/**
 * IT Live — Theme: Bold Dark (Modern Donker)
 * Full dark mode with glassmorphism cards and bright accents.
 * Loaded as external stylesheet — replaces inline CSS from theme-switcher.php
 */

/* ── 1. CSS Variables: force dark palette globally ───────── */
:root{
  --ink:#e2e8f0!important;--dim:#b0bec5!important;--bg:#0f172a!important;
  --bdr:rgba(255,255,255,.12)!important;--cl:rgba(255,255,255,.08)!important
}

/* ── 2. Body & base text ─────────────────────────────────── */
body{background:linear-gradient(135deg,#0f172a,#1e293b)!important;color:#e2e8f0!important}
h1,h2,h3,h4,h5,h6{color:#f1f5f9!important}
p,li,td,th,label,figcaption,blockquote,address{color:#cbd5e1!important}
strong,b{color:#e2e8f0!important}
a{color:var(--c)!important}
a:hover{color:#fff!important}
.btn,.btn-primary,.nav-cta,.dienst-cta,
.btn-cb-primary,.mc-btn-primary,.wa-btn-primary,
a.btn,a.btn-primary,a.nav-cta,a.dienst-cta,
a[class*="btn-primary"],a[class*="-cta"]:not(.svc-link):not([class*="svc-link"]){
  color:#fff!important
}
.svc-link,.cb-svc-link,.mc-svc-link,.wa-svc-link{color:var(--c)!important}
.cta-strip .btn,.cta-bottom .btn,.cta-strip a.btn,.cta-bottom a.btn{color:#1e293b!important;background:#fff!important}
.cta-strip .btn-outline,.cta-bottom .btn-outline{color:#fff!important;background:transparent!important}
hr{border-color:rgba(255,255,255,.1)!important}

/* ── 3. Navigation ───────────────────────────────────────── */
nav,.main-nav,.site-nav,.navbar,header{background:rgba(15,23,42,.95)!important;backdrop-filter:blur(12px);border-color:rgba(255,255,255,.08)!important}
.nav-links a,.nav-links a:visited,.nav-link{color:#cbd5e1!important}
.nav-links a:hover,.nav-links a.active,.nav-link:hover,.nav-link.active{color:#fff!important}
.nav-cta{color:#fff!important}
.logo-text,.logo-l1,.logo-l2{color:#e2e8f0!important}
.mobile-toggle,.nav-toggle{color:#e2e8f0!important;border-color:rgba(255,255,255,.15)!important;background:rgba(255,255,255,.06)!important}

/* ── 4. Hero sections ────────────────────────────────────── */
.hero h1,.hero h2,.sec-title,.sec-badge,.section-badge{color:#f8fafc!important}
.hero p,.sec-sub,.lead{color:#cbd5e1!important}
.hero h1 em{color:var(--cl,#d1fae5)!important;-webkit-text-fill-color:var(--cl,#d1fae5)!important;text-shadow:0 0 20px rgba(var(--c-rgb,0,0,0),.4)}
.hero-badge,.badge{background:rgba(255,255,255,.1)!important;color:var(--c)!important}
.breadcrumb,.breadcrumb a,.breadcrumb span{color:rgba(255,255,255,.7)!important}

/* ── 5. ALL card-like elements → glassmorphism ───────────── */
.svc,.blog-card,.dienst-card,.faq-item,.step,.review,.cat-card,.usp,
.card,.about-card,.team-card,.pricing-card,.feature-card,
.contact-card,.info-item,.value-card,.timeline-item,.sidebar-card,
.related-card,.gallery-card,.testimonial{
  background:rgba(255,255,255,.06)!important;color:#e2e8f0!important;border-color:rgba(255,255,255,.12)!important
}
.dienst-header,.card-header{background:rgba(255,255,255,.08)!important}

/* ── 6. Titles in content cards ──────────────────────────── */
.svc-title,.blog-title,.dienst-title,.faq-q,.card-title,
.about-title,.team-name,.pricing-title,.feature-title,
.contact-title,.info-title,.value-title,.sidebar-title,
.related-title,.gallery-title,.pd-title{color:#f1f5f9!important}

/* ── 7. Descriptions in content cards ────────────────────── */
.svc-desc,.blog-body,.blog-excerpt,.dienst-desc,.dienst-subtitle,
.faq-a,.card-desc,.about-desc,.team-role,.pricing-desc,.feature-desc,
.contact-desc,.info-desc,.value-desc,
.sidebar-desc,.related-desc,.gallery-desc,.blog-meta,.blog-date,
.pd-desc,
.blog-card-excerpt,.blog-card-meta,.article-meta,
.sidebar-newsletter p,.cat-card p,
.stat-lbl,.stat-label,.hv-lbl{color:#cbd5e1!important}

/* ── 7b. Sidebar titles + pills (dark) ──────────────────── */
.sidebar-box h4,.sidebar-card h4,.sidebar-section h3{color:#e2e8f0!important}
.sidebar-pill,.blog-tag,.blog-category,.tag{color:#cbd5e1!important;background:rgba(255,255,255,.08)!important;border-color:rgba(255,255,255,.1)!important}

/* ── 7c. Blog card titles ────────────────────────────────── */
.blog-card h3,.blog-card-title{color:#f1f5f9!important}

/* ── 8. Feature lists & sub-items ────────────────────────── */
.svc-sub-item,.svc-sub-list span,.svc-sub-list li,
.feature-list li,.check-list li,.spec-table td,
.dienst-features li,.service-features li{color:#b0bec5!important}

/* ── 9. Steps & reviews ──────────────────────────────────── */
.step h4,.review-name,.review-author{color:#f1f5f9!important}
.step p,.review-text,.review-loc,.review-date{color:#cbd5e1!important}
.review-stars{color:#f59e0b!important}

/* ── 10. Stats ───────────────────────────────────────────── */
.stat-val,.stat-icon,.stat-number{color:#f8fafc!important}
.stat-lbl,.stat-label{color:#cbd5e1!important}
.stats-bar,.stats-section,.stats-grid{background:rgba(255,255,255,.04)!important;border-color:rgba(255,255,255,.08)!important}

/* ── 11. USPs ────────────────────────────────────────────── */
.usp-text,.usp span,.usp-grid *,.usp-strip *{color:#fff!important}

/* ── 12. Forms ───────────────────────────────────────────── */
input,textarea,select{background:rgba(255,255,255,.06)!important;color:#e2e8f0!important;border-color:rgba(255,255,255,.15)!important}
input:focus,textarea:focus,select:focus{border-color:var(--c)!important;box-shadow:0 0 0 3px rgba(var(--c-rgb,37,99,235),.2)!important}
input::placeholder,textarea::placeholder{color:#94a3b8!important}
.form-group label,.form-label{color:#cbd5e1!important}
.form-card,.offerte-form,.contact-form{background:rgba(255,255,255,.04)!important;border-color:rgba(255,255,255,.1)!important}

/* ── 13. Buttons ─────────────────────────────────────────── */
.btn-outline,.btn-ghost,.btn-outline-white{color:#cbd5e1!important;border-color:rgba(255,255,255,.25)!important;background:transparent!important}
.btn-outline:hover,.btn-ghost:hover{color:#fff!important;border-color:rgba(255,255,255,.5)!important}
.btn-white{background:rgba(255,255,255,.12)!important;color:#fff!important}
.btn-white:hover{background:rgba(255,255,255,.2)!important}

/* ── 14. Sidebar ─────────────────────────────────────────── */
.sidebar,.sidebar-card,.sidebar-section,.blog-sidebar,
aside{background:rgba(255,255,255,.04)!important;border-color:rgba(255,255,255,.1)!important;color:#cbd5e1!important}
.sidebar h3,.sidebar h4,.sidebar-section h3{color:#e2e8f0!important}
.sidebar a{color:var(--c)!important}.sidebar a:hover{color:#fff!important}

/* ── 15. Blog specifics ──────────────────────────────────── */
.blog-content,.article-content,.blog-body,.prose{color:#cbd5e1!important}
.blog-content h2,.blog-content h3,.article-content h2,.article-content h3{color:#f1f5f9!important}
.blog-content a,.article-content a{color:var(--c)!important}
.blog-tag,.blog-category,.tag{background:rgba(255,255,255,.08)!important;color:#b0bec5!important;border-color:rgba(255,255,255,.1)!important}

/* ── 16. Privacy/voorwaarden ─────────────────────────────── */
.legal-content,.privacy-content,.terms-content{color:#cbd5e1!important}
.legal-content h2,.legal-content h3,.privacy-content h2,.terms-content h2{color:#f1f5f9!important}

/* ── 17. Shop/product pages ──────────────────────────────── */
.product-card{background:rgba(255,255,255,.06)!important;border-color:rgba(255,255,255,.12)!important}
.product-title,.product-name,.pd-title{color:#f1f5f9!important}
.product-price,.pd-price{color:var(--c)!important}
.product-desc,.pd-desc{color:#cbd5e1!important}
.spec-table{border-color:rgba(255,255,255,.1)!important}
.spec-table td,.spec-table th{border-color:rgba(255,255,255,.08)!important;color:#cbd5e1!important}
.spec-table td:first-child{color:#e2e8f0!important}
.qty-btn{background:rgba(255,255,255,.08)!important;color:#e2e8f0!important;border-color:rgba(255,255,255,.12)!important}

/* ── 17b. Webshop: lichte productkaarten op donkere achtergrond ── */
body.page-shop .shop-surface,
body.page-shop .cart-drawer,
body.page-shop .qv-modal{
  --ink:#0f172a!important;
  --dim:#475569!important;
  --bdr:#e2e8f0!important;
  --cl:#f1f5f9!important;
}
body.page-shop{background:#e8ecf4!important}
body.page-shop .shop-surface{background:linear-gradient(180deg,#e2e8f0,#f8fafc)!important}
.p-card,.p-card-body{background:#fff!important;color:#0f172a!important;border-color:rgba(15,23,42,.1)!important;box-shadow:0 10px 40px rgba(0,0,0,.14)!important}
.p-card h3,.p-card .p-card-title{color:#020617!important}
.p-card .p-card-cat{color:#020617!important;border-bottom-color:var(--c)!important;opacity:1!important}
.p-card .p-card-desc,.p-card p.p-card-desc{color:#1e293b!important}
.p-card .p-card-price{color:#020617!important}
.p-card .p-card-price small{color:#475569!important}
.p-card-view,.p-card-wishlist{color:#475569!important}
.p-card-view:hover{border-color:var(--c)!important;color:var(--c)!important}
.p-card .p-card-placeholder{background:linear-gradient(145deg,#e2e8f0,#f1f5f9)!important}
.p-card .p-card-placeholder i{color:var(--c)!important;opacity:.5!important}
.itw-container.shop-wrap .shop-count{color:#334155!important}
.itw-container.shop-wrap .shop-toolbar{color:#334155!important}
.itw-container.shop-wrap .cat-pill:not(.active){color:#0f172a!important;background:#fff!important;border-color:rgba(15,23,42,.12)!important}
.itw-container.shop-wrap .shop-toolbar,.itw-container.shop-wrap .mini-cart-btn,.itw-container.shop-wrap .shop-sort,.itw-container.shop-wrap .shop-view-btn{background:#fff!important;border-color:rgba(15,23,42,.12)!important}
.itw-container.shop-wrap .cat-pill.active,.itw-container.shop-wrap .cat-pill:hover{background:var(--c)!important;color:#fff!important;border-color:var(--c)!important}

/* ── 17c. Winkelwagen / checkout ─────────────────────────── */
body.page-cart{background:linear-gradient(180deg,#e8ecf4,#f1f5f9 45%,#f8fafc)!important}
body.page-cart .itw-container.cart-page{
  --ink:#0f172a!important;
  --dim:#475569!important;
  --bdr:#e2e8f0!important;
  --cl:#f1f5f9!important;
}
body.page-cart .cart-page h2,body.page-cart .cart-page h3,body.page-cart .checkout-section h2,body.page-cart .checkout-section h3{color:#020617!important}
body.page-cart .cart-page p,body.page-cart .cart-page li,body.page-cart .order-success p{color:#475569!important}
body.page-cart .cart-empty-page h2,body.page-cart .cart-row-info h3,body.page-cart .cart-summary h3,body.page-cart .order-success h2{color:#020617!important}
body.page-cart .cart-row-info p,body.page-cart .cart-row-price,body.page-cart .summary-row span,body.page-cart .summary-total{color:#0f172a!important}
body.page-cart .cart-row-head{color:#64748b!important}
body.page-cart .cart-summary{background:#fff!important;border-color:#e2e8f0!important;box-shadow:0 10px 40px rgba(0,0,0,.08)!important}
body.page-cart .checkout-field input,body.page-cart .checkout-field select{background:#fff!important;color:#0f172a!important;border-color:#e2e8f0!important}
body.page-cart .checkout-field input::placeholder{color:#94a3b8!important}
body.page-cart .checkout-field label,body.page-cart .pay-opt-label{color:#0f172a!important}
body.page-cart .pay-opt-desc{color:#64748b!important}
body.page-cart .pay-opt{border-color:#e2e8f0!important;background:#fff!important}
body.page-cart .pay-opt:hover,body.page-cart .pay-opt.selected{background:#f1f5f9!important;border-color:var(--c)!important}
body.page-cart .cart-row-qty button{background:#fff!important;color:#0f172a!important;border-color:#e2e8f0!important}
body.page-cart .cart-table{border-color:#e2e8f0!important}

/* ── 18. Map placeholder ─────────────────────────────────── */
.map,.map-placeholder,.map-container{background:rgba(255,255,255,.04)!important;border-color:rgba(255,255,255,.1)!important}

/* ── 19. Over-ons ────────────────────────────────────────── */
.timeline,.timeline-item{border-color:rgba(255,255,255,.1)!important}
.value-card,.team-card{background:rgba(255,255,255,.06)!important}
.about-text,.about-content{color:#cbd5e1!important}

/* ── 20. Hover states ────────────────────────────────────── */
.svc:hover,.blog-card:hover,.dienst-card:hover,.step:hover,.review:hover,
.related-card:hover,.gallery-card:hover{
  border-color:var(--c)!important;background:rgba(255,255,255,.1)!important
}

/* ── 21. Offerte/contact info blocks ─────────────────────── */
.info-block,.contact-info,.contact-details{color:#cbd5e1!important}
.info-block h3,.info-block h4,.contact-info h3{color:#e2e8f0!important}
.info-block i,.contact-info i{color:var(--c)!important}

/* ── 22. Gallery ─────────────────────────────────────────── */
.gallery img,.gallery-img{border-radius:12px;border:1px solid rgba(255,255,255,.08)!important}

/* ── 23. Alerts & notices ────────────────────────────────── */
.alert,.notice,.success-message{background:rgba(255,255,255,.06)!important;border-color:rgba(255,255,255,.12)!important;color:#cbd5e1!important}