/* HitechFibre Global Premium Theme + ISP Animated Background */
:root{
  --hf-bg:#050a18;--hf-bg2:#08132b;--hf-card:rgba(11,22,43,.78);--hf-card-solid:#101b31;--hf-card2:rgba(15,32,61,.72);
  --hf-text:#eef7ff;--hf-muted:#9fb0c8;--hf-line:rgba(68,190,255,.22);--hf-line-strong:rgba(0,212,255,.42);
  --hf-brand:#00d4ff;--hf-brand2:#22d3a0;--hf-shadow:0 24px 80px rgba(0,0,0,.36);--hf-input:rgba(2,8,23,.58);
}
html[data-theme="light"],body.light-theme{
  --hf-bg:#f5f8ff;--hf-bg2:#eaf3ff;--hf-card:rgba(255,255,255,.82);--hf-card-solid:#ffffff;--hf-card2:rgba(255,255,255,.74);
  --hf-text:#0d1728;--hf-muted:#53627a;--hf-line:rgba(11,74,118,.16);--hf-line-strong:rgba(0,108,170,.28);
  --hf-brand:#0077c8;--hf-brand2:#00a884;--hf-shadow:0 24px 80px rgba(15,35,70,.14);--hf-input:rgba(255,255,255,.88);
}
html,body{min-height:100%;background:var(--hf-bg)!important;color:var(--hf-text)!important;transition:background .35s ease,color .35s ease;overflow-x:hidden;}
body{position:relative;}
body > *:not(.hf-animated-bg):not(.hf-theme-toggle){position:relative;z-index:1;}
.hf-animated-bg{position:fixed;inset:0;z-index:0;pointer-events:none;overflow:hidden;background:
  radial-gradient(circle at 20% 15%, color-mix(in srgb,var(--hf-brand) 25%,transparent), transparent 28%),
  radial-gradient(circle at 85% 20%, color-mix(in srgb,var(--hf-brand2) 22%,transparent), transparent 28%),
  linear-gradient(135deg,var(--hf-bg),var(--hf-bg2));}
.hf-animated-bg:before{content:"";position:absolute;inset:-20%;opacity:.58;background-image:
  linear-gradient(color-mix(in srgb,var(--hf-brand) 18%,transparent) 1px,transparent 1px),
  linear-gradient(90deg,color-mix(in srgb,var(--hf-brand) 18%,transparent) 1px,transparent 1px);
  background-size:64px 64px;transform:perspective(720px) rotateX(62deg) translateY(-14%);transform-origin:center top;animation:hfGridMove 16s linear infinite;}
.hf-animated-bg:after{content:"";position:absolute;inset:0;background:
  linear-gradient(115deg,transparent 0 18%,color-mix(in srgb,var(--hf-brand) 28%,transparent) 19%,transparent 22% 48%,color-mix(in srgb,var(--hf-brand2) 20%,transparent) 50%,transparent 54% 100%);
  filter:blur(1px);opacity:.72;animation:hfLightSweep 9s ease-in-out infinite alternate;}
.hf-fibre-line{position:absolute;height:2px;width:44vw;min-width:360px;border-radius:999px;background:linear-gradient(90deg,transparent,var(--hf-brand),var(--hf-brand2),transparent);box-shadow:0 0 18px var(--hf-brand);opacity:.55;animation:hfLineFloat 7s ease-in-out infinite;}
.hf-fibre-line.l1{left:-8%;top:24%;transform:rotate(-12deg)}.hf-fibre-line.l2{right:-10%;top:46%;transform:rotate(15deg);animation-delay:-2s}.hf-fibre-line.l3{left:16%;bottom:19%;transform:rotate(4deg);animation-delay:-4s}
.hf-node{position:absolute;width:8px;height:8px;border-radius:50%;background:var(--hf-brand);box-shadow:0 0 18px var(--hf-brand),0 0 40px var(--hf-brand2);opacity:.78;animation:hfPulse 2.4s ease-in-out infinite;}
.hf-node.n1{top:24%;left:18%}.hf-node.n2{top:46%;right:24%;animation-delay:.8s}.hf-node.n3{bottom:20%;left:52%;animation-delay:1.4s}.hf-node.n4{top:62%;left:28%;animation-delay:2s}
@keyframes hfGridMove{from{background-position:0 0,0 0}to{background-position:0 128px,128px 0}}
@keyframes hfLightSweep{from{transform:translateX(-6%) scale(1.02);opacity:.45}to{transform:translateX(6%) scale(1.05);opacity:.78}}
@keyframes hfLineFloat{0%,100%{opacity:.35;filter:blur(0)}50%{opacity:.9;filter:blur(.4px)}}
@keyframes hfPulse{0%,100%{transform:scale(1);opacity:.45}50%{transform:scale(1.8);opacity:1}}
.card,.status-card,.glass,.panel,.mini-card,.incident-card,.form-section,.contact-card,.live-row,form,.contact-box,.package-card,.provider-card,.summary-card,.coverage-card,.box,.container-card,
section[class*="card"],div[class*="card"],div[class*="panel"]{background:var(--hf-card)!important;color:var(--hf-text)!important;border-color:var(--hf-line)!important;box-shadow:var(--hf-shadow)!important;backdrop-filter:blur(18px);}
header,nav,.top,.top-bar,.navbar,.site-header{background:color-mix(in srgb,var(--hf-card-solid) 70%,transparent)!important;color:var(--hf-text)!important;border-color:var(--hf-line)!important;backdrop-filter:blur(18px);}
h1,h2,h3,h4,h5,h6,p,span,label,li,td,th,strong,small,div{border-color:var(--hf-line);}
h1,h2,h3,h4,h5,h6,strong,label{color:var(--hf-text)!important}p,li,.muted,.small,.subtext,.text-muted{color:var(--hf-muted)!important}a{color:var(--hf-brand)!important}.page-hero h1,.hero-copy h1{background:linear-gradient(135deg,var(--hf-text),var(--hf-brand) 55%,var(--hf-brand2))!important;-webkit-background-clip:text!important;background-clip:text!important;-webkit-text-fill-color:transparent!important;}
input,textarea,select{background:var(--hf-input)!important;color:var(--hf-text)!important;border:1px solid var(--hf-line-strong)!important;box-shadow:none!important;}input::placeholder,textarea::placeholder{color:color-mix(in srgb,var(--hf-muted) 78%,transparent)!important;}select option{background:var(--hf-card-solid)!important;color:var(--hf-text)!important;}
button,.btn,.btn-submit,input[type="submit"]{border-color:var(--hf-line-strong)!important}.btn-submit,.primary-btn,.cta,.button-primary{background:linear-gradient(135deg,var(--hf-brand),var(--hf-brand2))!important;color:#061020!important;box-shadow:0 14px 38px color-mix(in srgb,var(--hf-brand) 25%,transparent)!important;}
.theme-toggle{display:none!important}.hf-theme-toggle{position:fixed;right:18px;bottom:18px;z-index:999999;display:inline-flex;align-items:center;gap:8px;border:1px solid var(--hf-line-strong);background:color-mix(in srgb,var(--hf-card-solid) 72%,transparent);color:var(--hf-text);backdrop-filter:blur(18px);border-radius:999px;padding:11px 15px;font-weight:800;font-size:13px;box-shadow:0 14px 40px rgba(0,0,0,.22);cursor:pointer}.hf-theme-toggle:hover{transform:translateY(-1px)}
@media(max-width:768px){.hf-animated-bg:before{background-size:42px 42px;opacity:.38}.hf-fibre-line{min-width:260px;width:72vw}.hf-theme-toggle{right:12px;bottom:12px;padding:10px 12px;font-size:12px}.top,.top-bar,header,nav{flex-wrap:wrap!important}.form-grid,.grid-2,.hero-grid,.summary,.contact-cards{grid-template-columns:1fr!important}.page-wrap,main,.container{padding-left:16px!important;padding-right:16px!important;max-width:100%!important}h1{font-size:clamp(28px,9vw,44px)!important}.btn,.btn-submit,button,input,select,textarea{max-width:100%!important}.submit-row{align-items:stretch!important}.submit-row .btn-submit{width:100%;justify-content:center}}
@media(prefers-reduced-motion:reduce){.hf-animated-bg:before,.hf-animated-bg:after,.hf-fibre-line,.hf-node{animation:none!important}}

/* Final polish: logo visibility + remove white panels in dark mode */
:root{--hf-logo-backdrop:#061020;--hf-logo-ring:rgba(0,212,255,.35)}
html[data-theme="light"],body.light-theme{--hf-logo-backdrop:#071426;--hf-logo-ring:rgba(0,119,200,.28)}
.logo img,.site-logo img,.navbar-brand img,.brand img,header img[src*="logo" i],header img[src*="HTF"],nav img[src*="logo" i],nav img[src*="HTF"],img.logo,img[src*="HTF.png"],img[src*="hitech" i][src*="logo" i]{
  background:linear-gradient(135deg,rgba(5,10,24,.96),rgba(10,28,54,.92))!important;
  padding:8px 12px!important;border-radius:16px!important;border:1px solid var(--hf-logo-ring)!important;
  box-shadow:0 10px 28px rgba(0,0,0,.22),0 0 22px rgba(0,212,255,.10)!important;
  object-fit:contain!important;max-height:74px;width:auto;
}
html[data-theme="dark"] .logo img,body:not(.light-theme) .logo img,html[data-theme="dark"] .site-logo img,html[data-theme="dark"] .navbar-brand img{
  background:rgba(255,255,255,.04)!important;
}
html[data-theme="light"] header,html[data-theme="light"] nav,body.light-theme header,body.light-theme nav{
  background:rgba(255,255,255,.72)!important;
}
html[data-theme="light"] .hf-animated-bg:before,body.light-theme .hf-animated-bg:before{opacity:.28!important}
html[data-theme="light"] .hf-animated-bg:after,body.light-theme .hf-animated-bg:after{opacity:.36!important}

html[data-theme="dark"] .white,html[data-theme="dark"] .bg-white,html[data-theme="dark"] .bg-light,html[data-theme="dark"] .card-body,html[data-theme="dark"] .modal-content,html[data-theme="dark"] .dropdown-menu,html[data-theme="dark"] .list-group-item,html[data-theme="dark"] .table,html[data-theme="dark"] table,html[data-theme="dark"] thead,html[data-theme="dark"] tbody,html[data-theme="dark"] tr,html[data-theme="dark"] td,html[data-theme="dark"] th,html[data-theme="dark"] .content,html[data-theme="dark"] .main-content,html[data-theme="dark"] .page-content,html[data-theme="dark"] .wrap,html[data-theme="dark"] .wrapper,html[data-theme="dark"] .box-body,html[data-theme="dark"] .well,html[data-theme="dark"] .jumbotron,html[data-theme="dark"] .section,html[data-theme="dark"] .form-control,
body:not(.light-theme) .white,body:not(.light-theme) .bg-white,body:not(.light-theme) .bg-light,body:not(.light-theme) .card-body,body:not(.light-theme) .modal-content,body:not(.light-theme) .dropdown-menu,body:not(.light-theme) .list-group-item,body:not(.light-theme) .table,body:not(.light-theme) table,body:not(.light-theme) thead,body:not(.light-theme) tbody,body:not(.light-theme) tr,body:not(.light-theme) td,body:not(.light-theme) th,body:not(.light-theme) .content,body:not(.light-theme) .main-content,body:not(.light-theme) .page-content,body:not(.light-theme) .wrap,body:not(.light-theme) .wrapper,body:not(.light-theme) .box-body,body:not(.light-theme) .well,body:not(.light-theme) .jumbotron,body:not(.light-theme) .section,body:not(.light-theme) .form-control{
  background:var(--hf-card)!important;background-color:var(--hf-card)!important;color:var(--hf-text)!important;border-color:var(--hf-line)!important;
}
html[data-theme="dark"] [style*="background:#fff"],html[data-theme="dark"] [style*="background: #fff"],html[data-theme="dark"] [style*="background:white"],html[data-theme="dark"] [style*="background: white"],html[data-theme="dark"] [style*="background-color:#fff"],html[data-theme="dark"] [style*="background-color: #fff"],html[data-theme="dark"] [style*="background-color:white"],html[data-theme="dark"] [style*="background-color: white"],
body:not(.light-theme) [style*="background:#fff"],body:not(.light-theme) [style*="background: #fff"],body:not(.light-theme) [style*="background:white"],body:not(.light-theme) [style*="background: white"],body:not(.light-theme) [style*="background-color:#fff"],body:not(.light-theme) [style*="background-color: #fff"],body:not(.light-theme) [style*="background-color:white"],body:not(.light-theme) [style*="background-color: white"]{
  background:var(--hf-card)!important;background-color:var(--hf-card)!important;color:var(--hf-text)!important;
}
html[data-theme="dark"] input[type="checkbox"],html[data-theme="dark"] input[type="radio"],body:not(.light-theme) input[type="checkbox"],body:not(.light-theme) input[type="radio"]{background-color:transparent!important;box-shadow:none!important}
html[data-theme="dark"] .hf-theme-toggle,body:not(.light-theme) .hf-theme-toggle{background:rgba(7,18,38,.88)!important;color:#eef7ff!important}
html[data-theme="light"] .hf-theme-toggle,body.light-theme .hf-theme-toggle{background:rgba(255,255,255,.9)!important;color:#071426!important}
@media(max-width:768px){.logo img,.site-logo img,.navbar-brand img,.brand img,header img[src*="logo" i],nav img[src*="logo" i],img.logo,img[src*="HTF.png"]{max-height:58px!important;padding:6px 10px!important;border-radius:13px!important}}

/* === 2026-05 final repair: real dark mode surfaces, logo contrast, mobile containment === */
html[data-theme="dark"], html[data-theme="dark"] body, body:not(.light-theme){
  background:#050a18!important;color:#eef7ff!important;
}
html[data-theme="dark"] body::before, body:not(.light-theme)::before{opacity:.18!important;}

/* Keep the ISP animated background visible: page wrappers stay transparent, content cards stay glass/dark */
html[data-theme="dark"] .site-wrap,
html[data-theme="dark"] main,
html[data-theme="dark"] .hero-section,
html[data-theme="dark"] .coverage-section,
html[data-theme="dark"] .packages-preview,
html[data-theme="dark"] .business-section,
html[data-theme="dark"] .contact-section,
html[data-theme="dark"] .status-section,
html[data-theme="dark"] .page-wrap,
html[data-theme="dark"] .container,
body:not(.light-theme) .site-wrap,
body:not(.light-theme) main,
body:not(.light-theme) .hero-section,
body:not(.light-theme) .coverage-section,
body:not(.light-theme) .packages-preview,
body:not(.light-theme) .business-section,
body:not(.light-theme) .contact-section,
body:not(.light-theme) .status-section,
body:not(.light-theme) .page-wrap,
body:not(.light-theme) .container{
  background:transparent!important;background-color:transparent!important;
}

/* Remove the remaining white blocks in dark mode */
html[data-theme="dark"] .hero-mini-stats > div,
html[data-theme="dark"] .how-step-card,
html[data-theme="dark"] .provider-summary,
html[data-theme="dark"] .provider-cards,
html[data-theme="dark"] .provider-card,
html[data-theme="dark"] .package-card,
html[data-theme="dark"] .fibre-card,
html[data-theme="dark"] .plan-card,
html[data-theme="dark"] .price-card,
html[data-theme="dark"] .search-panel,
html[data-theme="dark"] .glass-card,
html[data-theme="dark"] .modern-status-card,
html[data-theme="dark"] .status-card-preview,
html[data-theme="dark"] .status-preview-item,
html[data-theme="dark"] .status-metric,
html[data-theme="dark"] .hero-visual-card,
html[data-theme="dark"] .benefit-stack-card,
html[data-theme="dark"] .benefit-item,
html[data-theme="dark"] .mini-card,
html[data-theme="dark"] .contact-stack,
html[data-theme="dark"] .htf-support-form-wrap,
html[data-theme="dark"] .htf-form-header,
html[data-theme="dark"] .htf-field,
html[data-theme="dark"] .form-section,
html[data-theme="dark"] .contact-card,
html[data-theme="dark"] .step-card,
html[data-theme="dark"] [class*="white"],
html[data-theme="dark"] [class*="light"],
html[data-theme="dark"] [class*="card"],
html[data-theme="dark"] [class*="panel"],
html[data-theme="dark"] [class*="box"],
body:not(.light-theme) .hero-mini-stats > div,
body:not(.light-theme) .how-step-card,
body:not(.light-theme) .provider-summary,
body:not(.light-theme) .provider-cards,
body:not(.light-theme) .provider-card,
body:not(.light-theme) .package-card,
body:not(.light-theme) .fibre-card,
body:not(.light-theme) .plan-card,
body:not(.light-theme) .price-card,
body:not(.light-theme) .search-panel,
body:not(.light-theme) .glass-card,
body:not(.light-theme) .modern-status-card,
body:not(.light-theme) .status-card-preview,
body:not(.light-theme) .status-preview-item,
body:not(.light-theme) .status-metric,
body:not(.light-theme) .hero-visual-card,
body:not(.light-theme) .benefit-stack-card,
body:not(.light-theme) .benefit-item,
body:not(.light-theme) .mini-card,
body:not(.light-theme) .contact-stack,
body:not(.light-theme) .htf-support-form-wrap,
body:not(.light-theme) .htf-form-header,
body:not(.light-theme) .htf-field,
body:not(.light-theme) .form-section,
body:not(.light-theme) .contact-card,
body:not(.light-theme) .step-card,
body:not(.light-theme) [class*="white"],
body:not(.light-theme) [class*="light"],
body:not(.light-theme) [class*="card"],
body:not(.light-theme) [class*="panel"],
body:not(.light-theme) [class*="box"]{
  background:rgba(8,18,38,.82)!important;
  background-color:rgba(8,18,38,.82)!important;
  color:#eef7ff!important;
  border-color:rgba(0,212,255,.22)!important;
  box-shadow:0 22px 70px rgba(0,0,0,.34)!important;
}
html[data-theme="dark"] [style*="background:#ffffff"],html[data-theme="dark"] [style*="background: #ffffff"],html[data-theme="dark"] [style*="background-color:#ffffff"],html[data-theme="dark"] [style*="background-color: #ffffff"],html[data-theme="dark"] [style*="background: rgb(255"],html[data-theme="dark"] [style*="background-color: rgb(255"],
body:not(.light-theme) [style*="background:#ffffff"],body:not(.light-theme) [style*="background: #ffffff"],body:not(.light-theme) [style*="background-color:#ffffff"],body:not(.light-theme) [style*="background-color: #ffffff"],body:not(.light-theme) [style*="background: rgb(255"],body:not(.light-theme) [style*="background-color: rgb(255"]{
  background:rgba(8,18,38,.82)!important;background-color:rgba(8,18,38,.82)!important;color:#eef7ff!important;
}
html[data-theme="dark"] .packages-preview h2,
html[data-theme="dark"] .packages-preview p,
html[data-theme="dark"] .packages-preview span,
html[data-theme="dark"] .hero-mini-stats strong,
html[data-theme="dark"] .hero-mini-stats span,
html[data-theme="dark"] .how-step-card strong,
html[data-theme="dark"] .how-step-card span,
body:not(.light-theme) .packages-preview h2,
body:not(.light-theme) .packages-preview p,
body:not(.light-theme) .packages-preview span,
body:not(.light-theme) .hero-mini-stats strong,
body:not(.light-theme) .hero-mini-stats span,
body:not(.light-theme) .how-step-card strong,
body:not(.light-theme) .how-step-card span{color:#eef7ff!important;-webkit-text-fill-color:initial!important;}
html[data-theme="dark"] .muted, html[data-theme="dark"] small, html[data-theme="dark"] .section-head p,
body:not(.light-theme) .muted, body:not(.light-theme) small, body:not(.light-theme) .section-head p{color:#b9c7dc!important;}

/* Light theme: keep white logo visible by placing it on a dark premium badge */
html[data-theme="light"] .site-logo,
html[data-theme="light"] .logo-top,
html[data-theme="light"] img[src*="HTF"],
html[data-theme="light"] img[src*="hitech" i],
body.light-theme .site-logo,
body.light-theme .logo-top,
body.light-theme img[src*="HTF"],
body.light-theme img[src*="hitech" i]{
  background:linear-gradient(135deg,#061225,#10284a)!important;
  padding:10px 14px!important;
  border-radius:18px!important;
  border:1px solid rgba(0,119,200,.26)!important;
  box-shadow:0 12px 34px rgba(8,20,38,.2)!important;
}
html[data-theme="dark"] .site-logo,
html[data-theme="dark"] .logo-top,
html[data-theme="dark"] img[src*="HTF"],
body:not(.light-theme) .site-logo,
body:not(.light-theme) .logo-top,
body:not(.light-theme) img[src*="HTF"]{
  background:rgba(255,255,255,.05)!important;
  padding:8px 12px!important;
  border-radius:18px!important;
}

/* Contact form visual + reliable layout */
.htf-support-form,.htf-form-grid,.form-grid{max-width:100%!important;}
.htf-input,.htf-textarea,.htf-select,.form-input,.form-select,.form-textarea{
  width:100%!important;max-width:100%!important;min-width:0!important;
  background:rgba(3,10,24,.68)!important;color:#eef7ff!important;border:1px solid rgba(0,212,255,.28)!important;
}
html[data-theme="light"] .htf-input,html[data-theme="light"] .htf-textarea,html[data-theme="light"] .form-input,html[data-theme="light"] .form-select,html[data-theme="light"] .form-textarea,body.light-theme .htf-input,body.light-theme .htf-textarea,body.light-theme .form-input,body.light-theme .form-select,body.light-theme .form-textarea{
  background:#fff!important;color:#0d1728!important;border-color:rgba(0,119,200,.25)!important;
}

/* Strong mobile containment: nothing may run outside the screen */
*,*::before,*::after{box-sizing:border-box!important;}
html,body{max-width:100%!important;overflow-x:hidden!important;}
img,svg,video,canvas,iframe,table{max-width:100%!important;}
.container,.site-wrap,.page-wrap,main,section,.hero-grid,.business-grid,.contact-stack,.packages-preview,.provider-cards,.provider-grid,.htf-form-grid,.form-grid,.mini-grid,.hero-mini-stats,.how-grid,.status-metrics-row,.hero-visual-row{min-width:0!important;}
@media(max-width:900px){
  .container,.page-wrap{width:100%!important;max-width:100%!important;padding-left:16px!important;padding-right:16px!important;}
  .hero-grid,.business-grid,.contact-top,.section-head.split,.status-card-header,.htf-form-header{display:grid!important;grid-template-columns:1fr!important;gap:18px!important;}
  .hero-side-stack,.hero-copy,.glass-card,.search-panel,.provider-cards,.packages-preview .container,.contact-stack,.htf-support-form-wrap{width:100%!important;max-width:100%!important;min-width:0!important;}
  .hero-mini-stats,.how-grid,.mini-grid,.contact-cards,.status-metrics-row,.hero-visual-row,.htf-form-grid,.form-grid{display:grid!important;grid-template-columns:1fr!important;gap:12px!important;}
  .nav-links,.nav-actions .ghost-btn{display:none!important;}
  .hamburger{display:inline-flex!important;}
  .search-row,.hero-cta-row,.submit-row,.priority-row,.htf-priority-opts,.htf-type-pills{display:grid!important;grid-template-columns:1fr!important;width:100%!important;gap:10px!important;}
  .search-row input,.search-row button,.primary-btn,.ghost-btn,.btn-submit,.htf-type-pill,.htf-prio{width:100%!important;justify-content:center!important;}
  .provider-cards{overflow-x:auto!important;-webkit-overflow-scrolling:touch!important;padding-bottom:8px!important;}
  .package-card,.provider-card,.plan-card{width:100%!important;min-width:0!important;max-width:100%!important;}
  .packages-preview{padding-top:44px!important;padding-bottom:44px!important;}
  h1{font-size:clamp(30px,10vw,46px)!important;line-height:1.06!important;}
  h2{font-size:clamp(24px,7vw,34px)!important;line-height:1.12!important;}
  .site-logo,.logo-top{max-width:210px!important;height:auto!important;}
  .hf-theme-toggle{bottom:14px!important;right:14px!important;top:auto!important;}
}
@media(max-width:480px){
  .container,.page-wrap{padding-left:12px!important;padding-right:12px!important;}
  .glass-card,.form-section,.contact-stack,.htf-support-form-wrap,.search-panel{padding:18px!important;border-radius:18px!important;}
  .announcement-bar{font-size:12px!important;}
  .topbar{position:relative!important;}
}
html[data-theme="dark"] .hf-force-dark-panel, body:not(.light-theme) .hf-force-dark-panel{background:rgba(8,18,38,.82)!important;background-color:rgba(8,18,38,.82)!important;color:#eef7ff!important;border-color:rgba(0,212,255,.22)!important;}

/* =========================================================
   FINAL PROVIDER LOGO FIX
   The normal site logo needs a dark backing in light mode,
   but provider logos must NOT receive that backing.
   This fixes the black pill/box showing inside provider tiles.
   ========================================================= */
.provider-selector__logo-wrap,
.provider-pill .provider-selector__logo-wrap,
.provider-selector .provider-selector__logo-wrap,
.provider-package-panel__head .provider-selector__logo-wrap,
body.light-theme .provider-selector__logo-wrap,
html[data-theme="light"] .provider-selector__logo-wrap,
html[data-theme="dark"] .provider-selector__logo-wrap,
body:not(.light-theme) .provider-selector__logo-wrap{
  background:linear-gradient(180deg,#ffffff,#f7fbff)!important;
  background-color:#ffffff!important;
  border:1px solid rgba(8,42,72,.16)!important;
  border-radius:12px!important;
  padding:8px 10px!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.85),0 8px 22px rgba(5,20,40,.08)!important;
  overflow:hidden!important;
}

.provider-selector__logo-wrap img,
.provider-pill img,
.provider-selector img,
.provider-package-panel__head img,
html[data-theme="light"] .provider-selector__logo-wrap img,
html[data-theme="light"] .provider-pill img,
html[data-theme="light"] .provider-selector img,
html[data-theme="dark"] .provider-selector__logo-wrap img,
html[data-theme="dark"] .provider-pill img,
html[data-theme="dark"] .provider-selector img,
body.light-theme .provider-selector__logo-wrap img,
body.light-theme .provider-pill img,
body.light-theme .provider-selector img,
body:not(.light-theme) .provider-selector__logo-wrap img,
body:not(.light-theme) .provider-pill img,
body:not(.light-theme) .provider-selector img{
  background:transparent!important;
  background-color:transparent!important;
  padding:0!important;
  border:0!important;
  border-radius:0!important;
  box-shadow:none!important;
  max-width:100%!important;
  max-height:100%!important;
  width:auto!important;
  height:auto!important;
  object-fit:contain!important;
  filter:none!important;
}

.provider-selector,
body.light-theme .provider-selector,
html[data-theme="light"] .provider-selector{
  background:rgba(255,255,255,.92)!important;
  border-color:rgba(0,119,200,.22)!important;
}
html[data-theme="dark"] .provider-selector,
body:not(.light-theme) .provider-selector{
  background:rgba(255,255,255,.07)!important;
  border-color:rgba(0,212,255,.24)!important;
}

/* In dark mode the provider logo area stays white because many provider logos are dark/coloured. */
html[data-theme="dark"] .provider-package-panel__head,
body:not(.light-theme) .provider-package-panel__head{
  background:rgba(7,18,38,.92)!important;
}

/* === FINAL GLOBAL THEME VISIBILITY SWEEP 2026-05-16 === */
html[data-theme="dark"], body:not(.light-theme){
  --hf-page-bg:#050a18;--hf-surface:rgba(8,18,38,.88);--hf-surface2:rgba(12,25,48,.86);--hf-surface-solid:#0b162b;
  --hf-text-strong:#f4fbff;--hf-text-normal:#e8f2ff;--hf-text-soft:#b8c8dd;--hf-border:rgba(0,212,255,.25);
  --hf-field:#101b31;--hf-field-text:#f4fbff;
}
html[data-theme="light"], body.light-theme{
  --hf-page-bg:#f4f8ff;--hf-surface:rgba(255,255,255,.92);--hf-surface2:rgba(248,251,255,.94);--hf-surface-solid:#ffffff;
  --hf-text-strong:#071426;--hf-text-normal:#18253a;--hf-text-soft:#56677f;--hf-border:rgba(0,88,160,.18);
  --hf-field:#ffffff;--hf-field-text:#071426;
}
html,body{background:var(--hf-page-bg)!important;color:var(--hf-text-normal)!important;}

/* Big page wrappers must not create white strips over the animated background in dark mode */
body:not(.light-theme) main,body:not(.light-theme) .page,body:not(.light-theme) .page-wrapper,body:not(.light-theme) .site-wrapper,body:not(.light-theme) .site-main,body:not(.light-theme) .content-wrapper,body:not(.light-theme) .main-wrapper,body:not(.light-theme) .section-wrapper,body:not(.light-theme) .signup-shell,body:not(.light-theme) .signup-modal,body:not(.light-theme) .modal-dialog,body:not(.light-theme) .modal,
html[data-theme="dark"] main,html[data-theme="dark"] .page,html[data-theme="dark"] .page-wrapper,html[data-theme="dark"] .site-wrapper,html[data-theme="dark"] .site-main,html[data-theme="dark"] .content-wrapper,html[data-theme="dark"] .main-wrapper,html[data-theme="dark"] .section-wrapper,html[data-theme="dark"] .signup-shell,html[data-theme="dark"] .signup-modal,html[data-theme="dark"] .modal-dialog,html[data-theme="dark"] .modal{background:transparent!important;background-color:transparent!important;}

/* Everything that is an actual content box gets a readable surface */
.card,.panel,.box,.tile,.widget,.modal-content,.popup,.popup-window,.signup-card,.signup-content,.signup-form,.signup-panel,.signup-step,.step-content,.step-pane,.step-body,.sidebar,.left-panel,.right-panel,.form-card,.form-box,.field-card,.fee-card,.addon-card,.provider-card,.package-card,.plan-card,.status-card,.contact-card,.contact-form,.address-popup,.search-popup,.pac-container,.dropdown-menu,.list-group-item,table,thead,tbody,tr,td,th,
[class*="card"],[class*="panel"],[class*="box"],[class*="modal"],[class*="popup"],[class*="step"],[class*="form"],[class*="fee"],[class*="addon"]{
  background-color:var(--hf-surface)!important;color:var(--hf-text-normal)!important;border-color:var(--hf-border)!important;
}
body:not(.light-theme) .card,body:not(.light-theme) .panel,body:not(.light-theme) .box,body:not(.light-theme) .tile,body:not(.light-theme) .widget,body:not(.light-theme) .modal-content,body:not(.light-theme) .popup,body:not(.light-theme) .popup-window,body:not(.light-theme) .signup-card,body:not(.light-theme) .signup-content,body:not(.light-theme) .signup-form,body:not(.light-theme) .signup-panel,body:not(.light-theme) .signup-step,body:not(.light-theme) .step-content,body:not(.light-theme) .step-pane,body:not(.light-theme) .step-body,body:not(.light-theme) .sidebar,body:not(.light-theme) .left-panel,body:not(.light-theme) .right-panel,body:not(.light-theme) .form-card,body:not(.light-theme) .form-box,body:not(.light-theme) .field-card,body:not(.light-theme) .fee-card,body:not(.light-theme) .addon-card,body:not(.light-theme) .provider-card,body:not(.light-theme) .package-card,body:not(.light-theme) .plan-card,body:not(.light-theme) .status-card,body:not(.light-theme) .contact-card,body:not(.light-theme) .contact-form,body:not(.light-theme) .address-popup,body:not(.light-theme) .search-popup,body:not(.light-theme) .pac-container,body:not(.light-theme) .dropdown-menu,body:not(.light-theme) .list-group-item,body:not(.light-theme) table,body:not(.light-theme) thead,body:not(.light-theme) tbody,body:not(.light-theme) tr,body:not(.light-theme) td,body:not(.light-theme) th,
html[data-theme="dark"] .card,html[data-theme="dark"] .panel,html[data-theme="dark"] .box,html[data-theme="dark"] .tile,html[data-theme="dark"] .widget,html[data-theme="dark"] .modal-content,html[data-theme="dark"] .popup,html[data-theme="dark"] .popup-window,html[data-theme="dark"] .signup-card,html[data-theme="dark"] .signup-content,html[data-theme="dark"] .signup-form,html[data-theme="dark"] .signup-panel,html[data-theme="dark"] .signup-step,html[data-theme="dark"] .step-content,html[data-theme="dark"] .step-pane,html[data-theme="dark"] .step-body,html[data-theme="dark"] .sidebar,html[data-theme="dark"] .left-panel,html[data-theme="dark"] .right-panel,html[data-theme="dark"] .form-card,html[data-theme="dark"] .form-box,html[data-theme="dark"] .field-card,html[data-theme="dark"] .fee-card,html[data-theme="dark"] .addon-card,html[data-theme="dark"] .provider-card,html[data-theme="dark"] .package-card,html[data-theme="dark"] .plan-card,html[data-theme="dark"] .status-card,html[data-theme="dark"] .contact-card,html[data-theme="dark"] .contact-form,html[data-theme="dark"] .address-popup,html[data-theme="dark"] .search-popup,html[data-theme="dark"] .pac-container,html[data-theme="dark"] .dropdown-menu,html[data-theme="dark"] .list-group-item,html[data-theme="dark"] table,html[data-theme="dark"] thead,html[data-theme="dark"] tbody,html[data-theme="dark"] tr,html[data-theme="dark"] td,html[data-theme="dark"] th{
  background:var(--hf-surface)!important;background-color:var(--hf-surface)!important;color:var(--hf-text-normal)!important;border-color:var(--hf-border)!important;box-shadow:0 18px 60px rgba(0,0,0,.34)!important;
}

/* Text contrast in both modes */
h1,h2,h3,h4,h5,h6,strong,b,label,.title,.heading,.step-title,.card-title,.form-title,.section-title{color:var(--hf-text-strong)!important;-webkit-text-fill-color:var(--hf-text-strong)!important;}
p,span,li,small,td,th,div,.text,.description,.subtext,.muted,.help,.hint{color:var(--hf-text-normal)!important;}
small,.muted,.subtext,.description,.hint,.help,.caption{color:var(--hf-text-soft)!important;}

/* Inputs and selects */
input,select,textarea,.form-control,.input,.select{background:var(--hf-field)!important;color:var(--hf-field-text)!important;border:1px solid var(--hf-border)!important;}
input::placeholder,textarea::placeholder{color:color-mix(in srgb,var(--hf-text-soft) 78%,transparent)!important;opacity:1!important;}
select option{background:var(--hf-surface-solid)!important;color:var(--hf-text-strong)!important;}

/* Google address suggestions must be readable */
.pac-container{z-index:2147483647!important;border-radius:16px!important;overflow:hidden!important;border:1px solid var(--hf-border)!important;box-shadow:0 20px 60px rgba(0,0,0,.28)!important;}
.pac-item{background:var(--hf-surface-solid)!important;color:var(--hf-text-normal)!important;border-color:var(--hf-border)!important;padding:12px 14px!important;font-size:14px!important;}
.pac-item:hover,.pac-item-selected{background:linear-gradient(135deg,rgba(0,212,255,.16),rgba(34,211,160,.12))!important;}
.pac-item-query,.pac-matched{color:var(--hf-text-strong)!important;font-weight:800!important;}
.pac-secondary-text{color:var(--hf-text-soft)!important;}

/* Keep logo readable on light mode */
body.light-theme img[src*="HTF"],body.light-theme img[src*="hitech" i],html[data-theme="light"] img[src*="HTF"],html[data-theme="light"] img[src*="hitech" i]{background:linear-gradient(135deg,#061225,#10284a)!important;border-radius:16px!important;padding:8px 12px!important;}

/* Mobile containment */
*{box-sizing:border-box!important;}
html,body{max-width:100%!important;overflow-x:hidden!important;}
@media(max-width:768px){
  .container,.page-wrap,.wrapper,.site-wrap,.content,.main-content,.signup-card,.signup-content,.modal-content,.popup,.popup-window{width:100%!important;max-width:100%!important;margin-left:0!important;margin-right:0!important;}
  .signup-card,.modal-content,.popup,.popup-window{border-radius:20px!important;}
  .form-grid,.grid,.row,.columns,.two-col,.three-col{display:grid!important;grid-template-columns:1fr!important;gap:14px!important;}
  input,select,textarea,button,.btn{width:100%!important;max-width:100%!important;}
  h1{font-size:clamp(28px,9vw,44px)!important;line-height:1.05!important;}
  h2{font-size:clamp(24px,7vw,34px)!important;line-height:1.1!important;}
}


/* === HTF FINAL THEME CONTRAST PATCH + CONTACT SUCCESS MODAL === */
:root, body.light-theme, html[data-theme="light"]{
  --hf-package-bg:#ffffff;
  --hf-package-text:#071426;
  --hf-package-muted:#52637a;
  --hf-package-price:#0b5fe8;
  --hf-package-border:rgba(11,95,232,.18);
  --hf-panel-bg:rgba(255,255,255,.94);
  --hf-panel-head:rgba(239,246,255,.96);
}
body:not(.light-theme), html[data-theme="dark"]{
  --hf-package-bg:rgba(8,18,38,.96);
  --hf-package-text:#f3f8ff;
  --hf-package-muted:#aebed4;
  --hf-package-price:#3ee7ff;
  --hf-package-border:rgba(0,212,255,.32);
  --hf-panel-bg:rgba(4,12,28,.92);
  --hf-panel-head:rgba(7,18,38,.98);
}

/* Package browser/cards: keep both light and dark mode readable */
.provider-cards,.provider-package-panel,.package-slider-shell,.packages-preview .container{
  color:var(--hf-package-text)!important;
}
.provider-package-panel{
  background:var(--hf-panel-bg)!important;
  border:1px solid var(--hf-package-border)!important;
  box-shadow:0 22px 70px rgba(0,0,0,.20)!important;
}
.provider-package-panel__head,.provider-selector-featured-label{
  background:var(--hf-panel-head)!important;
  border-color:var(--hf-package-border)!important;
  color:var(--hf-package-text)!important;
}
.package-slider-nav h4,.provider-package-panel__head strong,.provider-selector-featured-sub,
.provider-selector-name,.provider-fallback-name{
  color:var(--hf-package-text)!important;
  -webkit-text-fill-color:var(--hf-package-text)!important;
}
.package-slide,.package-card,.plan-card{
  background:var(--hf-package-bg)!important;
  background-color:var(--hf-package-bg)!important;
  border:1px solid var(--hf-package-border)!important;
  color:var(--hf-package-text)!important;
  box-shadow:0 16px 36px rgba(0,0,0,.16)!important;
}
.package-slide *, .package-card *, .plan-card *{
  color:var(--hf-package-text)!important;
  -webkit-text-fill-color:var(--hf-package-text)!important;
}
.package-slide strong,.package-card strong,.plan-card strong,
.package-slide h3,.package-card h3,.plan-card h3{
  color:var(--hf-package-text)!important;
  -webkit-text-fill-color:var(--hf-package-text)!important;
}
.package-slide .speed,.package-card .speed,.plan-card .speed{
  color:var(--hf-package-price)!important;
  -webkit-text-fill-color:var(--hf-package-price)!important;
}
.package-slide .install,.package-card .install,.plan-card .install,
.package-slide small,.package-card small,.plan-card small{
  color:var(--hf-package-muted)!important;
  -webkit-text-fill-color:var(--hf-package-muted)!important;
}
.package-slide .price,.package-card .price,.plan-card .price{
  color:var(--hf-package-price)!important;
  -webkit-text-fill-color:var(--hf-package-price)!important;
  text-shadow:none!important;
}
.package-slide .choose-plan,.package-card .choose-plan,.plan-card .choose-plan,
.package-slide button,.package-card button,.plan-card button{
  background:linear-gradient(135deg,#155dfc,#0bd3c7)!important;
  color:#ffffff!important;
  -webkit-text-fill-color:#ffffff!important;
  border:0!important;
}
body:not(.light-theme) .package-slide:first-child::before,
html[data-theme="dark"] .package-slide:first-child::before{
  background:rgba(0,212,255,.10)!important;
  color:#7cf3ff!important;
  -webkit-text-fill-color:#7cf3ff!important;
  border-color:rgba(0,212,255,.35)!important;
}

/* Provider tiles: white logo wells, readable names in both modes */
.provider-selector__logo-wrap,.provider-pill .provider-selector__logo-wrap{
  background:#ffffff!important;
  border:1px solid rgba(15,45,78,.16)!important;
  border-radius:12px!important;
}
.provider-selector,.provider-pill{
  background:color-mix(in srgb,var(--hf-panel-bg) 92%,transparent)!important;
  border-color:var(--hf-package-border)!important;
  color:var(--hf-package-text)!important;
}
.provider-selector.active,.provider-selector--featured.active{
  border-color:#00d4ff!important;
  box-shadow:0 0 0 2px rgba(0,212,255,.20),0 18px 44px rgba(0,0,0,.20)!important;
}

/* Signup/contact modal and all form steps readable */
.signup-flow,.signup-flow-modal,.flow-modal,.signup-shell,.flow-card,.flow-step,.flow-main,.flow-sidebar,.step-pane,.step-content,.modal-content{
  background:var(--hf-panel-bg)!important;
  color:var(--hf-package-text)!important;
  border-color:var(--hf-package-border)!important;
}
.signup-flow *,.signup-flow-modal *,.flow-modal *,.signup-shell *,.flow-card *,.step-pane *,.step-content *,.modal-content *{
  color:var(--hf-package-text)!important;
  -webkit-text-fill-color:var(--hf-package-text)!important;
}
.signup-flow input,.signup-flow select,.signup-flow textarea,.flow-modal input,.flow-modal select,.flow-modal textarea,.modal-content input,.modal-content select,.modal-content textarea{
  background:color-mix(in srgb,var(--hf-package-bg) 92%,#000 0%)!important;
  color:var(--hf-package-text)!important;
  -webkit-text-fill-color:var(--hf-package-text)!important;
  border:1px solid var(--hf-package-border)!important;
}
.signup-flow button,.flow-modal button,.modal-content button,.flow-card button{
  -webkit-text-fill-color:initial!important;
}

/* Contact success popup */
.htf-success-overlay{position:fixed;inset:0;z-index:2147483646;display:none;align-items:center;justify-content:center;padding:20px;background:rgba(2,6,23,.68);backdrop-filter:blur(10px)}
.htf-success-overlay.show{display:flex!important;}
.htf-success-modal{width:min(560px,100%);border-radius:28px;padding:28px;background:var(--hf-panel-bg);border:1px solid var(--hf-package-border);box-shadow:0 30px 100px rgba(0,0,0,.38);color:var(--hf-package-text);text-align:center;position:relative;overflow:hidden}
.htf-success-modal:before{content:"";position:absolute;inset:0;background:radial-gradient(circle at 30% 0%,rgba(0,212,255,.20),transparent 38%),radial-gradient(circle at 80% 15%,rgba(34,211,160,.18),transparent 35%);pointer-events:none}
.htf-success-modal>*{position:relative;z-index:1}.htf-success-icon{width:72px;height:72px;margin:0 auto 14px;border-radius:24px;display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg,#00d4ff,#22d3a0);color:#061020!important;font-size:34px;font-weight:900;box-shadow:0 18px 42px rgba(0,212,255,.28)}
.htf-success-modal h3{font-size:28px;margin:0 0 8px;color:var(--hf-package-text)!important;-webkit-text-fill-color:var(--hf-package-text)!important}.htf-success-modal p{font-size:15px;line-height:1.6;color:var(--hf-package-muted)!important;-webkit-text-fill-color:var(--hf-package-muted)!important}.htf-ticket-number{display:inline-flex;align-items:center;justify-content:center;margin:12px auto 18px;padding:12px 18px;border-radius:999px;background:rgba(0,212,255,.12);border:1px solid rgba(0,212,255,.32);font-weight:900;color:var(--hf-package-price)!important;-webkit-text-fill-color:var(--hf-package-price)!important;letter-spacing:.04em}.htf-success-close{display:inline-flex;align-items:center;justify-content:center;padding:12px 22px;border-radius:14px;border:0;background:linear-gradient(135deg,#155dfc,#0bd3c7)!important;color:#fff!important;-webkit-text-fill-color:#fff!important;font-weight:900;cursor:pointer}
.form-status.success{background:rgba(34,211,160,.12)!important;border:1px solid rgba(34,211,160,.35)!important;color:var(--hf-package-text)!important;border-radius:18px!important;padding:14px 16px!important;}
.form-status.error{background:rgba(248,113,113,.12)!important;border:1px solid rgba(248,113,113,.38)!important;color:var(--hf-package-text)!important;border-radius:18px!important;padding:14px 16px!important;}
@media(max-width:768px){.provider-selector-row{grid-template-columns:repeat(2,minmax(0,1fr))!important}.package-slider-track{display:grid!important;grid-template-columns:1fr!important;overflow:visible!important}.package-slide{width:100%!important;min-width:0!important}.htf-success-modal{padding:24px 18px;border-radius:22px}}

/* === FINAL LIGHT MODE PROVIDER LOGO PATCH ===
   Do not treat provider logos as the main HitechFibre header logo.
   Provider logos must sit on clean white logo wells in BOTH themes. */
.provider-selector img,
.provider-selector__logo-wrap img,
.provider-pill img,
.provider-package-panel img,
.provider-card img,
.provider-logos img,
.providers img,
#providerCards img,
#providerSummary img,
body.light-theme .provider-selector img,
body.light-theme .provider-selector__logo-wrap img,
body.light-theme .provider-pill img,
body.light-theme .provider-package-panel img,
body.light-theme .provider-card img,
body.light-theme .provider-logos img,
body.light-theme .providers img,
body.light-theme #providerCards img,
body.light-theme #providerSummary img,
html[data-theme="light"] .provider-selector img,
html[data-theme="light"] .provider-selector__logo-wrap img,
html[data-theme="light"] .provider-pill img,
html[data-theme="light"] .provider-package-panel img,
html[data-theme="light"] .provider-card img,
html[data-theme="light"] .provider-logos img,
html[data-theme="light"] .providers img,
html[data-theme="light"] #providerCards img,
html[data-theme="light"] #providerSummary img{
  background:transparent!important;
  background-color:transparent!important;
  padding:0!important;
  border:0!important;
  border-radius:0!important;
  box-shadow:none!important;
  filter:none!important;
  opacity:1!important;
  mix-blend-mode:normal!important;
  -webkit-text-fill-color:initial!important;
}

.provider-selector__logo-wrap,
.provider-pill .provider-selector__logo-wrap,
.provider-card .provider-selector__logo-wrap,
.provider-package-panel .provider-selector__logo-wrap,
#providerCards .provider-selector__logo-wrap,
#providerSummary .provider-selector__logo-wrap,
body.light-theme .provider-selector__logo-wrap,
body.light-theme .provider-pill .provider-selector__logo-wrap,
body.light-theme .provider-card .provider-selector__logo-wrap,
body.light-theme .provider-package-panel .provider-selector__logo-wrap,
body.light-theme #providerCards .provider-selector__logo-wrap,
body.light-theme #providerSummary .provider-selector__logo-wrap,
html[data-theme="light"] .provider-selector__logo-wrap,
html[data-theme="light"] .provider-pill .provider-selector__logo-wrap,
html[data-theme="light"] .provider-card .provider-selector__logo-wrap,
html[data-theme="light"] .provider-package-panel .provider-selector__logo-wrap,
html[data-theme="light"] #providerCards .provider-selector__logo-wrap,
html[data-theme="light"] #providerSummary .provider-selector__logo-wrap{
  background:#ffffff!important;
  background-color:#ffffff!important;
  border:1px solid rgba(5,44,84,.16)!important;
  border-radius:14px!important;
  padding:8px 10px!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.95),0 8px 20px rgba(7,20,38,.10)!important;
}

body.light-theme .provider-selector,
html[data-theme="light"] .provider-selector,
body.light-theme .provider-pill,
html[data-theme="light"] .provider-pill,
body.light-theme .provider-card,
html[data-theme="light"] .provider-card{
  background:#ffffff!important;
  background-color:#ffffff!important;
  color:#071426!important;
  border-color:rgba(0,119,200,.22)!important;
}

body.light-theme .provider-selector *,
html[data-theme="light"] .provider-selector *,
body.light-theme .provider-pill *,
html[data-theme="light"] .provider-pill *,
body.light-theme .provider-card *,
html[data-theme="light"] .provider-card *{
  color:#071426!important;
  -webkit-text-fill-color:#071426!important;
}
body.light-theme .provider-selector img,
html[data-theme="light"] .provider-selector img,
body.light-theme .provider-pill img,
html[data-theme="light"] .provider-pill img,
body.light-theme .provider-card img,
html[data-theme="light"] .provider-card img{
  -webkit-text-fill-color:initial!important;
}