/* Базові змінні (Колір буде перевизначатися з PHP) */
:root { 
    --npg-gold: #d4af37; 
    --npg-black: #0a0a0a; 
    --npg-white: #fff; 
}

/* КНОПКА (Badge) */
#npg-badge {
    position: fixed; bottom: 20px; left: 20px; z-index: 99999999;
    background: rgba(0,0,0,0.9); border: 1px solid #333; color: var(--npg-gold);
    padding: 10px 16px; border-radius: 50px; cursor: pointer;
    font-family: sans-serif; font-size: 13px; font-weight: 600;
    box-shadow: 0 4px 15px rgba(0,0,0,0.5); backdrop-filter: blur(5px);
    display: flex; align-items: center; gap: 10px; transition: 0.3s;
}
#npg-badge:hover { border-color: var(--npg-gold); transform: scale(1.05); }

#npg-status-dot {
    width: 8px; height: 8px; border-radius: 50%; background: #999;
    box-shadow: 0 0 5px rgba(255,255,255,0.2); transition: 0.3s;
}
.npg-active #npg-status-dot { background: #2ecc71; box-shadow: 0 0 8px #2ecc71; }
.npg-blocked #npg-status-dot { background: #e74c3c; box-shadow: 0 0 8px #e74c3c; }

/* Банер */
#npg-banner {
    position: fixed; bottom: 0; left: 0; width: 100%; z-index: 99999998;
    background: rgba(15,15,15,0.98); border-top: 1px solid var(--npg-gold);
    padding: 25px; display: none; 
    flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 20px;
    font-family: 'Montserrat', sans-serif; box-shadow: 0 -10px 50px rgba(0,0,0,0.9);
}
.npg-text { color: #ddd; font-size: 13px; max-width: 700px; line-height: 1.6; }
.npg-text a { color: var(--npg-gold); text-decoration: underline; }
.npg-btns { display: flex; gap: 10px; align-items: center; }

/* Модальне вікно */
#npg-modal {
    position: fixed; top: 0; left: 0; width: 100%; height: 100%; z-index: 100000000;
    background: rgba(0,0,0,0.85); backdrop-filter: blur(8px);
    display: none; align-items: center; justify-content: center;
}
.npg-modal-box {
    background: #111; border: 1px solid #333; width: 90%; max-width: 450px;
    border-radius: 8px; overflow: hidden; box-shadow: 0 20px 60px rgba(0,0,0,0.9);
    animation: npgPop 0.3s ease-out;
}
@keyframes npgPop { from{opacity:0;transform:scale(0.95);} to{opacity:1;transform:scale(1);} }

.npg-head { padding: 20px; background: #151515; border-bottom: 1px solid #222; display:flex; justify-content:space-between; align-items:center; }
.npg-head h3 { margin:0; color: var(--npg-gold); font-family: 'Playfair Display', serif; font-size: 18px; }
.npg-close { color: #666; font-size: 24px; cursor: pointer; transition:0.2s; }
.npg-close:hover { color: #fff; }

.npg-body { padding: 25px 20px; }
.npg-row { display: flex; justify-content: space-between; align-items: center; margin-bottom: 25px; }
.npg-info h4 { color: #fff; margin: 0 0 5px; font-size: 14px; }
.npg-info p { color: #777; margin: 0; font-size: 11px; }

/* Switch */
.npg-switch { position: relative; display: inline-block; width: 44px; height: 24px; }
.npg-switch input { opacity: 0; width: 0; height: 0; }
.npg-slider { position: absolute; cursor: pointer; top: 0; left: 0; right: 0; bottom: 0; background-color: #333; transition: .4s; border-radius: 34px; }
.npg-slider:before { position: absolute; content: ""; height: 18px; width: 18px; left: 3px; bottom: 3px; background-color: white; transition: .4s; border-radius: 50%; }
input:checked + .npg-slider { background-color: var(--npg-gold); }
input:checked + .npg-slider:before { transform: translateX(20px); }
input:disabled + .npg-slider { opacity: 0.5; cursor: not-allowed; }

.npg-foot { padding: 20px; background: #151515; border-top: 1px solid #222; text-align: right; }

/* === ОНОВЛЕНІ КНОПКИ (GDPR Compliant) === */
.npg-btn { border: none; padding: 12px 20px; border-radius: 4px; font-weight: 700; font-size: 11px; text-transform: uppercase; cursor: pointer; letter-spacing: 1px; transition:0.3s; }
.npg-btn-acc { background: var(--npg-gold); color: #000; }
.npg-btn-acc:hover { background: #fff; }

/* Рівнозначна кнопка відмови (без Dark Patterns) */
.npg-btn-rej { background: #444; color: #fff; }
.npg-btn-rej:hover { background: #555; }

.npg-link-set { color: #aaa; text-decoration: underline; margin-right: 15px; font-size: 11px; cursor: pointer; transition: 0.2s; }
.npg-link-set:hover { color: #fff; }

/* МОБІЛЬНА АДАПТАЦІЯ */
@media(max-width: 600px) { 
    #npg-badge {
        bottom: 95px !important; 
        left: 15px !important;
        padding: 12px !important;
        border-radius: 50% !important;
        width: 44px !important; height: 44px !important;
        justify-content: center !important;
        opacity: 1 !important; 
        display: flex !important;
    }
    #npg-badge span { display: none !important; }
    #npg-status-dot { margin: 0 !important; width: 10px; height: 10px; }
    
    #npg-banner { padding: 15px; bottom: 0 !important; }
    .npg-btns { width: 100%; justify-content: space-between; margin-top: 10px; }
    .npg-btn { flex: 1; text-align: center; }
}