/* =====================================================================
   ÍCONOS TIPO APP DE iPHONE (18-10-2026). Una sola paleta por módulo para el menú, el Inicio y la captura:
   cuadro de esquinas continuas (~22 %), degradado vertical leve del mismo tono (como Ajustes de iOS)
   y glifo relleno blanco estilo SF Symbols. Los colores siguen el arcoíris de Apple y la colorimetría
   de Cosapín: azul COSAPI del chaleco para lo central (Inicio, Foto, Ayuda), naranja de sus zapatos para
   Informes y el resto del arcoíris repartido. Va al final: manda sobre tema.css, apple.css e inicio.css.
   ===================================================================== */
[data-ic]{--c1:#0071e3}
[data-ic=inicio],[data-ic=camara],[data-ic=ayuda]{--c1:#0071e3}
[data-ic=gastos],[data-ic=comprobante]{--c1:#34c759}
[data-ic=informes]{--c1:#ff9500}
[data-ic=fondos]{--c1:#ff2d55}
[data-ic=viaticos]{--c1:#30b0c7}
[data-ic=galeria]{--c1:#af52de}
[data-ic=aprobar]{--c1:#5856d6}
[data-ic=conciliacion]{--c1:#32ade6}
[data-ic=reportes]{--c1:#ff3b30}
[data-ic=administracion]{--c1:#8e8e93}
[data-ic=auditoria]{--c1:#ffb000}
[data-ic=celular]{--c1:#0071e3}
.ct-ic[data-ic=comprobante]{--c1:#af52de}
[data-ic=ia]{--c1:#af52de}

/* El cuadro */
.sidebar nav a span.nav-chip[data-ic],.rp-bubble[data-ic],.ct-ic[data-ic]{
 --kc:color-mix(in srgb,var(--c1) 92%,#fff);
 background:linear-gradient(180deg,color-mix(in srgb,var(--c1) 76%,#fff) 0%,var(--c1) 100%)!important;
 color:#fff!important;box-shadow:inset 0 0 0 .5px rgba(0,0,0,.08),0 1px 2px rgba(0,0,0,.10)!important;display:grid!important;place-items:center}
.sidebar nav a span.nav-chip[data-ic]{width:30px!important;height:30px!important;border-radius:7px!important}
.rp-bubble[data-ic]{width:58px;height:58px;border-radius:13px}
.ct-ic[data-ic]{width:40px;height:40px;border-radius:9px}
/* El glifo relleno */
.ic-fill{stroke:none!important;fill:currentColor}
.ic-fill .k{fill:none;stroke:var(--kc,#fff);stroke-width:1.9}
.ic-fill .kf{fill:var(--kc,#fff);stroke:none}
.ic-fill .w{fill:none;stroke:currentColor;stroke-width:2.4}
.sidebar nav a span.nav-chip .ic-fill{width:19px!important;height:19px!important}
.rp-bubble .ic-fill{width:32px!important;height:32px!important}
.ct-ic .ic-fill{width:24px!important;height:24px!important}
/* Al pasar o tocar: un leve levantamiento, sin rebote */
.sidebar nav a span.nav-chip[data-ic]{transition:transform .2s cubic-bezier(.2,.8,.2,1)}
.sidebar nav a:hover span.nav-chip[data-ic]{transform:scale(1.06)!important}
.sidebar nav a.active span.nav-chip[data-ic]{box-shadow:inset 0 0 0 .5px rgba(0,0,0,.08),0 0 0 2px #fff,0 0 0 3.5px var(--c1)!important}
@media(max-height:820px) and (min-width:761px){.sidebar nav a span.nav-chip[data-ic]{width:26px!important;height:26px!important;border-radius:6px!important}.sidebar nav a span.nav-chip .ic-fill{width:16px!important;height:16px!important}}
@media(max-width:760px){.rp-bubble[data-ic]{width:56px;height:56px;border-radius:12.5px}.rp-bubble .ic-fill{width:30px!important;height:30px!important}}

/* Barra inferior: como iOS, glifo de contorno en reposo y relleno al estar seleccionado; un solo acento azul */
.tabbar .tab>.ic-fill{display:none}
.tabbar .tab.active>.nav-ic:not(.ic-fill){display:none!important}
.tabbar .tab.active>.ic-fill,.tabbar .tab-cam>.ic-fill{display:block!important;width:24px!important;height:24px!important;margin:0 auto;--kc:#fff}
.tabbar .tab .ic-fill .kf{fill:#fff}.tabbar .tab .ic-fill .k{stroke:#fff}