/* Site enhancements: dark mode, scroll progress, back-to-top, search, cookie
   banner, newsletter, confirm modal, floating contact. Loaded after style.css
   so these rules can override it. */

/* ---------- Dark mode ---------- */
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --ink:#eef4fb;
    --navy:#081528;
    --navy-2:#0d1d35;
    --muted:#93a4bd;
    --line:#1d2c42;
    --soft:#0b1626;
    --white:#0a1424;
    --card:#0f1c30;
    --shadow:0 22px 60px rgba(0,0,0,.45);
  }
}
:root[data-theme="dark"] {
  --ink:#eef4fb;
  --navy:#081528;
  --navy-2:#0d1d35;
  --muted:#93a4bd;
  --line:#1d2c42;
  --soft:#0b1626;
  --white:#0a1424;
  --card:#0f1c30;
  --shadow:0 22px 60px rgba(0,0,0,.45);
}
:root[data-theme="dark"] body{background:var(--white)}
:root[data-theme="dark"] .site-header{background:rgba(10,20,36,.86);border-bottom-color:rgba(255,255,255,.08)}
:root[data-theme="dark"] .nav-links a{color:#dbe6f5}
:root[data-theme="dark"] .nav-links a.active,:root[data-theme="dark"] .nav-links a:hover{background:#12233c;color:#7fd6ff}
:root[data-theme="dark"] .login-link{color:#dbe6f5}
:root[data-theme="dark"] .dropdown{background:var(--card);border-color:var(--line)}
:root[data-theme="dark"] .dropdown a:hover{background:#12233c;color:#7fd6ff}
:root[data-theme="dark"] .menu-toggle{background:#12233c;color:#dbe6f5}
:root[data-theme="dark"] th{background:#0b1626;color:#93a4bd}
:root[data-theme="dark"] td{color:#cdd9ea}
:root[data-theme="dark"] .table-wrap{background:var(--card)}
:root[data-theme="dark"] .field input,:root[data-theme="dark"] .field select,:root[data-theme="dark"] .field textarea{background:#0b1626;border-color:#22344e;color:#eef4fb}
:root[data-theme="dark"] .story-card,:root[data-theme="dark"] .form-card{background:var(--card)}
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) .site-header{background:rgba(10,20,36,.86);border-bottom-color:rgba(255,255,255,.08)}
  :root:not([data-theme="light"]) .nav-links a{color:#dbe6f5}
  :root:not([data-theme="light"]) .nav-links a.active,:root:not([data-theme="light"]) .nav-links a:hover{background:#12233c;color:#7fd6ff}
  :root:not([data-theme="light"]) .login-link{color:#dbe6f5}
  :root:not([data-theme="light"]) .dropdown{background:var(--card);border-color:var(--line)}
  :root:not([data-theme="light"]) .menu-toggle{background:#12233c;color:#dbe6f5}
  :root:not([data-theme="light"]) th{background:#0b1626;color:#93a4bd}
  :root:not([data-theme="light"]) td{color:#cdd9ea}
  :root:not([data-theme="light"]) .field input,:root:not([data-theme="light"]) .field select,:root:not([data-theme="light"]) .field textarea{background:#0b1626;border-color:#22344e;color:#eef4fb}
  :root:not([data-theme="light"]) .story-card,:root:not([data-theme="light"]) .form-card{background:var(--card)}
}

.theme-toggle{border:0;background:#eef7ff;border-radius:999px;width:40px;height:40px;display:inline-grid;place-items:center;color:#0f2745;cursor:pointer;flex:none;transition:.2s ease}
.theme-toggle:hover{background:#dbeefe;transform:translateY(-1px)}
.theme-toggle svg{width:19px;height:19px}
.theme-toggle .icon-moon{display:none}
:root[data-theme="dark"] .theme-toggle{background:#12233c;color:#9af0ff}
:root[data-theme="dark"] .theme-toggle .icon-sun{display:none}
:root[data-theme="dark"] .theme-toggle .icon-moon{display:block}
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) .theme-toggle{background:#12233c;color:#9af0ff}
  :root:not([data-theme="light"]) .theme-toggle .icon-sun{display:none}
  :root:not([data-theme="light"]) .theme-toggle .icon-moon{display:block}
}

/* ---------- Search trigger + modal ---------- */
.search-toggle{border:0;background:#eef7ff;border-radius:999px;width:40px;height:40px;display:inline-grid;place-items:center;color:#0f2745;cursor:pointer;flex:none;transition:.2s ease}
.search-toggle:hover{background:#dbeefe;transform:translateY(-1px)}
.search-toggle svg{width:18px;height:18px}
:root[data-theme="dark"] .search-toggle{background:#12233c;color:#dbe6f5}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]) .search-toggle{background:#12233c;color:#dbe6f5}}

.site-search-modal{position:fixed;inset:0;z-index:1200;display:none;align-items:flex-start;justify-content:center;padding:12vh 16px 20px}
.site-search-modal.open{display:flex}
.site-search-overlay{position:absolute;inset:0;background:rgba(6,16,31,.6);backdrop-filter:blur(3px)}
.site-search-box{position:relative;width:min(560px,100%);max-height:70vh;background:var(--card);border-radius:22px;box-shadow:0 30px 80px rgba(0,0,0,.4);overflow:hidden;display:flex;flex-direction:column}
.site-search-input-row{display:flex;align-items:center;gap:10px;padding:16px 18px;border-bottom:1px solid var(--line)}
.site-search-input-row svg{flex:none;color:var(--muted);width:18px;height:18px}
.site-search-input{flex:1;border:0;outline:0;background:transparent;font:inherit;font-size:1.02rem;color:var(--ink);min-width:0}
.site-search-close{border:0;background:transparent;color:var(--muted);cursor:pointer;font-size:1.3rem;line-height:1;flex:none}
.site-search-results{overflow-y:auto;padding:8px}
.site-search-results a{display:block;padding:12px 14px;border-radius:14px;color:var(--ink)}
.site-search-results a:hover,.site-search-results a.active{background:var(--soft)}
.site-search-results .res-title{font-weight:850;font-size:.95rem}
.site-search-results .res-desc{color:var(--muted);font-size:.84rem;margin-top:2px;display:-webkit-box;-webkit-line-clamp:1;-webkit-box-orient:vertical;overflow:hidden}
.site-search-empty{padding:24px 18px;color:var(--muted);text-align:center;font-size:.92rem}

/* ---------- Scroll progress bar ---------- */
#scrollProgress{position:fixed;top:0;left:0;height:3px;width:0%;background:linear-gradient(90deg,var(--cyan),var(--blue));z-index:1300;transition:width .12s linear}

/* ---------- Back to top ---------- */
/* Left side: the live-chat launcher already owns bottom-right (20px/60px). */
#backToTop{position:fixed;left:20px;bottom:20px;width:46px;height:46px;border-radius:50%;border:0;background:var(--navy);color:#fff;display:grid;place-items:center;cursor:pointer;box-shadow:0 14px 30px rgba(8,21,40,.3);opacity:0;visibility:hidden;transform:translateY(10px);transition:.25s ease;z-index:900}
#backToTop.show{opacity:1;visibility:visible;transform:translateY(0)}
#backToTop:hover{transform:translateY(-3px)}
#backToTop svg{width:18px;height:18px}

/* ---------- Floating contact button ---------- */
#floatingContact{position:fixed;left:20px;bottom:76px;height:46px;border-radius:999px;border:0;background:linear-gradient(135deg,var(--cyan),var(--blue));color:#061121;display:inline-flex;align-items:center;gap:8px;padding:0 18px;font-weight:900;cursor:pointer;box-shadow:0 14px 30px rgba(34,167,255,.35);z-index:900;text-decoration:none}
#floatingContact:hover{transform:translateY(-3px)}
#floatingContact svg{width:17px;height:17px;flex:none}
@media (max-width:640px){#floatingContact span{display:none}#floatingContact{width:46px;height:46px;padding:0;border-radius:50%;justify-content:center;bottom:76px}}

/* ---------- Cookie banner ---------- */
#cookieBanner{position:fixed;left:0;right:0;bottom:0;z-index:1100;background:var(--navy);color:#eaf3ff;padding:16px 20px;display:none;align-items:center;justify-content:center;gap:18px;flex-wrap:wrap;box-shadow:0 -16px 40px rgba(0,0,0,.25)}
#cookieBanner.show{display:flex}
#cookieBanner p{margin:0;font-size:.9rem;color:#c7d7ec;max-width:640px}
#cookieBanner a{color:#8ff3ff;text-decoration:underline}
#cookieBanner .cookie-actions{display:flex;gap:10px;flex:none}
#cookieBanner button{border-radius:999px;padding:10px 16px;font-weight:900;font-size:.85rem;cursor:pointer;border:1px solid rgba(255,255,255,.24);background:transparent;color:#fff}
#cookieBanner button.accept{background:linear-gradient(135deg,var(--cyan),var(--blue));color:#061121;border-color:transparent}

/* ---------- Confirm modal ---------- */
.confirm-modal{position:fixed;inset:0;z-index:1400;display:none;align-items:center;justify-content:center;padding:20px}
.confirm-modal.open{display:flex}
.confirm-overlay{position:absolute;inset:0;background:rgba(6,16,31,.65)}
.confirm-box{position:relative;width:min(400px,100%);background:var(--card);border-radius:20px;padding:26px;box-shadow:0 30px 80px rgba(0,0,0,.4)}
.confirm-box h3{margin:0 0 10px;font-size:1.1rem}
.confirm-box p{margin:0 0 20px;color:var(--muted);font-size:.94rem}
.confirm-actions{display:flex;gap:10px;justify-content:flex-end}
.confirm-actions button{border-radius:999px;padding:10px 18px;font-weight:900;font-size:.86rem;cursor:pointer;border:1px solid var(--line)}
.confirm-actions .confirm-cancel{background:transparent;color:var(--ink)}
.confirm-actions .confirm-ok{background:var(--red);color:#fff;border-color:transparent}

/* ---------- Newsletter ---------- */
.footer-newsletter{grid-column:1/-1;margin-top:8px;padding-top:28px;border-top:1px solid rgba(255,255,255,.11);display:flex;align-items:center;justify-content:space-between;gap:18px;flex-wrap:wrap}
.footer-newsletter h4{margin:0 0 4px;color:#fff;font-size:1.02rem}
.footer-newsletter p{margin:0;color:#aec3dc;font-size:.88rem}
.newsletter-form{display:flex;gap:10px;flex-wrap:wrap;min-width:280px}
.newsletter-form input[type=email]{border:1px solid rgba(255,255,255,.22);background:rgba(255,255,255,.06);border-radius:999px;padding:11px 16px;color:#fff;outline:0;min-width:220px;flex:1}
.newsletter-form input[type=email]::placeholder{color:#8fa3bc}
.newsletter-form button{border:0;border-radius:999px;padding:11px 18px;font-weight:900;background:linear-gradient(135deg,var(--cyan),var(--blue));color:#061121;cursor:pointer;white-space:nowrap}
.newsletter-form button[disabled]{opacity:.7;cursor:default}
.newsletter-success{display:none;align-items:center;gap:8px;color:#7cf5b6;font-weight:800;font-size:.92rem}
.newsletter-success.show{display:flex}
.newsletter-success svg{width:18px;height:18px;flex:none}
.newsletter-error{display:none;color:#ff8ca0;font-size:.85rem;width:100%}
.newsletter-error.show{display:block}

/* ---------- Loading / button spinner ---------- */
.btn.is-loading{pointer-events:none;opacity:.85;position:relative;color:transparent!important}
.btn.is-loading:after{content:"";position:absolute;left:50%;top:50%;width:16px;height:16px;margin:-8px 0 0 -8px;border-radius:50%;border:2px solid rgba(255,255,255,.5);border-top-color:#fff;animation:btnspin .7s linear infinite}
.btn-outline.is-loading:after,.btn-light.is-loading:after{border-color:rgba(7,17,31,.25);border-top-color:#07111f}
@keyframes btnspin{to{transform:rotate(360deg)}}
#pageLoadBar{position:fixed;top:0;left:0;height:3px;width:0;background:linear-gradient(90deg,var(--cyan),var(--blue));z-index:1301;transition:width .3s ease,opacity .3s ease}
#pageLoadBar.done{width:100%;opacity:0}

/* ---------- Resource card "last updated" ---------- */
.resource-updated{display:flex;align-items:center;gap:6px;color:var(--muted);font-size:.78rem;font-weight:700;margin-top:-4px}
.resource-updated svg{width:13px;height:13px;flex:none}

/* ---------- Copy-to-clipboard (future-proofed for code blocks) ---------- */
.code-copy-wrap{position:relative}
.code-copy-btn{position:absolute;top:10px;right:10px;border:1px solid rgba(255,255,255,.18);background:rgba(255,255,255,.08);color:#dbe6f5;border-radius:8px;padding:6px 10px;font-size:.76rem;font-weight:800;cursor:pointer;display:flex;align-items:center;gap:6px}
.code-copy-btn:hover{background:rgba(255,255,255,.16)}
.code-copy-btn svg{width:13px;height:13px}

/* ---------- Hover-state safety net: any interactive control without its own
   hover rule still gets a visible affordance. ---------- */
a[href],button,.btn,input[type=submit],input[type=button]{transition:transform .18s ease,box-shadow .18s ease,background-color .18s ease,color .18s ease,border-color .18s ease}
button:not([class]):hover,a:not([class]):not(.logo):hover{opacity:.82}

@media (max-width:640px){
  #cookieBanner{padding:14px 16px;justify-content:flex-start}
  .footer-newsletter{flex-direction:column;align-items:flex-start}
}

/* ---------- Trust strip (SSL / payments / safe browsing / privacy) ---------- */
.trust-strip{display:flex;flex-wrap:wrap;gap:8px 10px;align-items:center;padding:14px 0 4px;margin-top:-4px}
.trust-item{display:inline-flex;align-items:center;gap:6px;padding:6px 11px;border:1px solid #e2e8f0;border-radius:999px;background:#f8fafc;font-size:.74rem;font-weight:800;color:#475569;letter-spacing:.01em;text-decoration:none}
.trust-item svg{width:14px;height:14px;flex:none;color:#16a34a}
a.trust-item:hover{background:#eef2f7;color:#1f2937}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .trust-item{background:rgba(255,255,255,.06);border-color:rgba(255,255,255,.14);color:#c3d0e3}}
:root[data-theme="dark"] .trust-item{background:rgba(255,255,255,.06);border-color:rgba(255,255,255,.14);color:#c3d0e3}
@media (max-width:640px){.trust-strip{gap:6px 8px}.trust-item{font-size:.68rem;padding:5px 9px}}
