/* Capa común de las páginas de detalle: se carga después de los estilos propios de cada página. */
@import url("tokens.css");

html{background:var(--bg)}
html body{font-family:var(--f);background:radial-gradient(circle,var(--dot) 1.2px,transparent 1.6px) 0 0/22px 22px,var(--bg);color:var(--tx)}
h1,h2,h3{font-family:var(--fh)}
h1,h2{font-stretch:108%;letter-spacing:-.015em}
code,pre,kbd,.font-mono,svg text{font-family:var(--fm)}
.glow-text{text-shadow:none}
::selection{background:var(--ac);color:var(--on)}

/* Los selectores de tema propios de algunas páginas ceden el sitio al selector común */
#themeToggle,.boton-tema{display:none!important}

/* ---------- Barra del portal, igual que la cabecera del resto de la web ---------- */
.ccnav{position:relative;z-index:60;width:100%;background:var(--bg);border-bottom:1px solid var(--bd);color:var(--mu);font:14px/1.45 var(--f)}
.ccnav,.ccnav *{box-sizing:border-box}
.ccnav-in{max-width:72rem;margin:0 auto;padding:.6rem 1.25rem;display:flex;flex-wrap:wrap;gap:.4rem 1rem;align-items:center}
.ccnav a{color:var(--ac);text-decoration:none;font-weight:400}
.ccnav a:hover{text-decoration:underline}
.ccnav .ccnav-brand{display:flex;align-items:center;gap:.55rem;color:var(--tx);font-size:16px;font-weight:600;margin-right:auto}
.ccnav .ccnav-brand:hover{text-decoration:none}
.ccnav-brand b{font:600 .8rem/1 var(--fm);background:var(--ac);color:var(--on);padding:.36rem .42rem;border-radius:.25rem}
.ccnav-main{display:flex;gap:.15rem;flex-wrap:wrap}
.ccnav .ccnav-main a{color:var(--mu);padding:.3rem .7rem;border-radius:.35rem;font-size:.92rem;font-weight:500}
.ccnav .ccnav-main a:hover{background:var(--cd2);color:var(--tx);text-decoration:none}
.ccnav .ccnav-main a[aria-current]{background:var(--cd2);color:var(--tx);box-shadow:inset 0 -2px 0 var(--ac)}
.ccnav-th{width:2.2rem;height:2.2rem;background:transparent;color:var(--tx);border:1px solid var(--bd);border-radius:.35rem;cursor:pointer;font-size:1.05rem;line-height:1}
.ccnav-th:hover{border-color:var(--ac);color:var(--ac)}
.ccnav-sub{padding-top:.4rem;padding-bottom:.45rem;border-top:1px solid var(--bd);font:.76rem/1.5 var(--fm);justify-content:space-between}
.ccnav-sub a{color:var(--mu)}.ccnav-sub a:hover{color:var(--ac);text-decoration:none}
.ccnav-sub [aria-current]{color:var(--tx)}
.ccnav-sep{margin:0 .35rem;color:var(--mu);opacity:.6}
.ccnav .ccnav-back{color:var(--ac);font-weight:500}
.ccnav-sib{color:var(--mu)}.ccnav-sib a{margin-left:.7rem}
@media(max-width:760px){.ccnav-sib{display:none}}
@media print{.ccnav{display:none}}

nav.sticky a{white-space:nowrap}

/* ---------- Islas: siguen oscuras en tema claro, como una pantalla o un osciloscopio ---------- */
[data-flip][data-design=dark] pre{background-color:#0a1416;color:#c9d6d0}
[data-flip][data-design=dark] svg:has(text){background-color:#0a1416;border-radius:.5rem}
[data-flip] .grid-bg,[data-flip] .tech-grid{background-color:transparent}

/* ---------- Texto sobre relleno verde: siempre tinta oscura ---------- */
:is(.bg-brand-emerald,[class^="bg-emerald-5"],[class*=" bg-emerald-5"],[class^="bg-emerald-6"],[class*=" bg-emerald-6"],[class^="bg-sky-5"],[class*=" bg-sky-5"],[class^="bg-sky-6"],[class*=" bg-sky-6"],[class^="bg-blue-5"],[class*=" bg-blue-5"],[class^="bg-blue-6"],[class*=" bg-blue-6"],[class^="bg-brand-5"],[class*=" bg-brand-5"],[class^="bg-brand-6"],[class*=" bg-brand-6"]):is(.text-white,.text-slate-950):not([class*="-500/"]):not([class*="-600/"]){color:#0a1416}
.bg-brand-emerald{color:#0a1416}
[data-flip] .bg-indigo-500.text-white{color:#fff}

/* ---------- Colores fijados por las páginas que deben seguir al tema ---------- */
[data-flip][data-design=dark] table th{color:var(--ac);border-bottom-color:var(--bd2)}
[data-flip][data-design=dark] table td{border-bottom-color:var(--bd)}
[data-flip] .nav-tab.active,[data-flip] .code-tab.active{color:var(--ac);border-color:var(--ac);background-color:color-mix(in srgb,var(--ac) 10%,transparent)}
[data-flip] ::-webkit-scrollbar-track{background:var(--cd2)}
[data-flip] ::-webkit-scrollbar-thumb{background:var(--bd2)}
[data-flip] #sim{--panel:#112224;--fg:#edf3ef;--mut:#9db1ab;--line:#233b3b;--em:#3ddc9c;--chip:#233b3b}