/* Ferreteria VR — palette derived from the supplied identity. */
:root[data-theme="light"]{
  --red:#f26b12;
  --red2:#bd3f08;
  --dark:#eef3f9;
  --panel:rgba(255,255,255,.96);
  --line:rgba(8,27,51,.16);
  --text:#081c35;
  --muted:#506176;
}
:root[data-theme="dark"]{
  --red:#ff7900;
  --red2:#e45300;
  --dark:#061426;
  --panel:rgba(8,25,47,.94);
  --line:rgba(207,222,238,.16);
  --text:#f5f8fc;
  --muted:#a8b7c9;
}
html[data-theme="light"] body{background:radial-gradient(circle at 16% 0,#fff 0,#eef4fb 38%,#dce5ef 100%)}
html[data-theme="dark"] body{background:radial-gradient(circle at 24% 0,#12355e 0,#07182e 44%,#040d1b 100%)}
.brand img,.login-brand img,.brand-preview img{background:#081c35;border:2px solid #f26b12;border-radius:50%;box-shadow:0 0 0 3px rgba(255,255,255,.85),0 8px 24px rgba(6,20,38,.28)}
html[data-theme="light"] .module-card{border-color:rgba(242,107,18,.34);background:linear-gradient(145deg,#fff,#fff5ec 52%,#e8eff7);box-shadow:0 16px 38px rgba(6,20,38,.12),inset 0 0 0 1px #fff}
html[data-theme="light"] .module-card:hover{border-color:#f26b12;box-shadow:0 18px 45px rgba(242,107,18,.22),0 18px 45px rgba(6,20,38,.1)}
html[data-theme="light"] .eyebrow{color:#bd3f08}
html[data-theme="light"] .drop-zone{background:linear-gradient(135deg,rgba(242,107,18,.10),#fff)}
html[data-theme="light"] .row-media{background:#fff0e5;border-color:rgba(242,107,18,.18)}
html[data-theme="light"] .detail-link,html[data-theme="light"] .scan-help{background:#fff3e8;color:#74300a}
html[data-theme="dark"] .module-card{border-color:rgba(255,121,0,.38);background:linear-gradient(145deg,#0d2a4d,#081a31 62%,#13273d);box-shadow:0 16px 38px rgba(0,0,0,.26),inset 0 0 0 1px rgba(255,255,255,.04)}
html[data-theme="dark"] .module-card:hover{border-color:#ff7900;box-shadow:0 18px 45px rgba(255,121,0,.18)}
.btn:not(.ghost),.brand-accent{background:linear-gradient(135deg,#ff8a16,#e75200);border-color:#ff8a16;color:#fff;box-shadow:0 8px 18px rgba(229,82,0,.22)}
.btn:not(.ghost):hover{filter:brightness(1.06);transform:translateY(-1px)}
::selection{background:rgba(255,121,0,.28);color:inherit}/* High-contrast accessibility pass — Ferreteria VR. */
html[data-theme="light"] .login-card,
html[data-theme="light"] .recovery-modal{
  background:linear-gradient(160deg,#ffffff 0%,#f4f8fc 100%)!important;
  border:1px solid rgba(242,107,18,.52)!important;
  box-shadow:0 24px 64px rgba(5,23,46,.20),inset 0 0 0 1px rgba(255,255,255,.9)!important;
  color:#081c35!important;
}
html[data-theme="light"] .login-card h1,
html[data-theme="light"] .login-card h2,
html[data-theme="light"] .login-card h3,
html[data-theme="light"] .recovery-modal h3{color:#081c35!important}
html[data-theme="light"] .login-card p,
html[data-theme="light"] .login-card label,
html[data-theme="light"] .recovery-modal p,
html[data-theme="light"] .recovery-modal label,
html[data-theme="light"] .hint{color:#40546b!important}
html[data-theme="light"] .login-card input,
html[data-theme="light"] .recovery-modal input{background:#fff!important;color:#081c35!important;border:1px solid #8293a8!important}
html[data-theme="light"] .login-card input:focus,
html[data-theme="light"] .recovery-modal input:focus{outline:3px solid rgba(242,107,18,.28)!important;border-color:#e85c08!important}
html[data-theme="light"] .forgot-link,
html[data-theme="light"] .muted-link{color:#a63c08!important;font-weight:800!important}
html[data-theme="light"] .form-error{color:#a61e20!important;font-weight:750!important}
html[data-theme="light"] .topbar,
html[data-theme="light"] .footerbar,
html[data-theme="light"] .panel,
html[data-theme="light"] .modal-box{color:#081c35!important}
html[data-theme="light"] .mini-link,
html[data-theme="light"] .back-btn,
html[data-theme="light"] .btn.ghost{color:#173656!important}
html[data-theme="light"] .workspace-card,
html[data-theme="light"] .summary,
html[data-theme="light"] .product-card,
html[data-theme="light"] .user-card,
html[data-theme="light"] .data-row{border-color:rgba(8,28,53,.16)!important}
html[data-theme="dark"] .login-card,
html[data-theme="dark"] .recovery-modal{background:linear-gradient(160deg,#0d2948,#07182e)!important;border-color:rgba(255,121,0,.58)!important;color:#f7fafc!important}
html[data-theme="dark"] .login-card h1,
html[data-theme="dark"] .login-card h2,
html[data-theme="dark"] .login-card h3,
html[data-theme="dark"] .login-card label,
html[data-theme="dark"] .recovery-modal h3,
html[data-theme="dark"] .recovery-modal label{color:#f7fafc!important}
html[data-theme="dark"] .login-card p,
html[data-theme="dark"] .recovery-modal p,
html[data-theme="dark"] .hint{color:#c4d2e2!important}
html[data-theme="dark"] .login-card input,
html[data-theme="dark"] .recovery-modal input{background:#061325!important;color:#f7fafc!important;border-color:#7990aa!important}
html[data-theme="dark"] .mini-link,
html[data-theme="dark"] .back-btn,
html[data-theme="dark"] .btn.ghost{color:#d7e6f5!important}
.btn:not(.ghost):focus-visible,
.back-btn:focus-visible,
.mini-link:focus-visible,
input:focus-visible,
select:focus-visible{outline:3px solid rgba(255,121,0,.48)!important;outline-offset:2px}
@media(max-width:700px){
  .login-card{width:min(100% - 28px,440px)!important;padding:26px 22px!important}
  .brand img,.login-brand img{width:82px!important;height:82px!important}
  html[data-theme="light"] .module-card{min-height:104px!important}
}/* Primary actions retain 4.5:1-or-better text contrast. */
.btn:not(.ghost){background:#b84200!important;border-color:#b84200!important;color:#fff!important;box-shadow:0 8px 18px rgba(184,66,0,.26)!important}
.btn:not(.ghost):hover{background:#d35500!important;border-color:#d35500!important}
/* Decorative particles stay behind every working surface. */
#particles{z-index:0!important;pointer-events:none!important;opacity:.13!important}
.shell,.login-card,.recovery-modal,.modal{position:relative;z-index:1}
/* Opaque login surface prevents background visual noise from affecting text. */
html[data-theme="light"] .login-card{background:#fff!important;background-image:none!important}
html[data-theme="light"] .login-card h1{color:#071a31!important}
html[data-theme="light"] .login-card p{color:#304961!important}
html[data-theme="light"] .login-card label{color:#304961!important}
