/* Cookie consent banner — ใช้ร่วมกันทุกหน้าสาธารณะ (js/pages/cookie-consent.js) */
.svc {
     position: fixed;
     left: 0;
     right: 0;
     bottom: 0;
     z-index: 100500;
     padding: 0 max(12px, env(safe-area-inset-right, 0px)) max(12px, env(safe-area-inset-bottom, 0px)) max(12px, env(safe-area-inset-left, 0px));
     pointer-events: none;
     font-family: 'Montserrat', 'Segoe UI', Tahoma, sans-serif;
}
.svc[hidden] { display: none !important; }
.svc-box {
     pointer-events: auto;
     max-width: 980px;
     margin: 0 auto;
     background: #1A2B48;
     color: #F5F3F0;
     border-top: 3px solid #C9A961;
     border-radius: 6px;
     box-shadow: 0 10px 40px rgba(10, 20, 40, .35);
     padding: 1.1rem 1.25rem;
     display: flex;
     flex-wrap: wrap;
     align-items: center;
     gap: .9rem 1.25rem;
}
.svc-text {
     flex: 1 1 380px;
     min-width: 0;
     margin: 0;
     font-size: .85rem;
     line-height: 1.6;
}
.svc-text a { color: #C9A961; text-decoration: underline; }
.svc-prefs {
     flex: 1 1 100%;
     display: flex;
     flex-direction: column;
     gap: .55rem;
     border-top: 1px solid rgba(245, 243, 240, .15);
     padding-top: .8rem;
}
.svc-prefs[hidden] { display: none; }
.svc-row { display: flex; gap: .6rem; align-items: flex-start; font-size: .82rem; line-height: 1.5; cursor: pointer; }
.svc-row input { margin-top: .2rem; accent-color: #C9A961; width: 16px; height: 16px; flex: none; }
.svc-row b { color: #fff; font-weight: 600; }
.svc-actions { display: flex; flex-wrap: wrap; gap: .5rem; align-items: center; }
.svc-btn {
     font: inherit;
     font-size: .8rem;
     font-weight: 600;
     letter-spacing: .03em;
     border-radius: 4px;
     padding: .6rem 1rem;
     cursor: pointer;
     border: 1px solid transparent;
     line-height: 1.2;
}
.svc-btn[hidden] { display: none; }
.svc-primary { background: #C9A961; color: #1A2B48; }
.svc-primary:hover { background: #d8bb79; }
.svc-ghost { background: transparent; color: #F5F3F0; border-color: rgba(245, 243, 240, .45); }
.svc-ghost:hover { border-color: #F5F3F0; }
.svc-link { background: none; color: #F5F3F0; text-decoration: underline; padding-left: .25rem; padding-right: .25rem; }
.svc-btn:focus-visible, .svc-text a:focus-visible { outline: 2px solid #C9A961; outline-offset: 2px; }
@media (max-width: 576px) {
     .svc-box { padding: 1rem; }
     .svc-actions { width: 100%; }
     .svc-actions .svc-primary, .svc-actions .svc-ghost { flex: 1 1 auto; }
}