/* Sistema de diseño SILOÉ - paleta y componentes compartidos por todas las
   vistas de configuración, panel, estadísticas, ficha, tab de expediente y
   portal de cliente. */
:root {
    --siloe-brand: #4f46e5; --siloe-brand-dark: #4338ca; --siloe-brand-soft: #eef2ff; --siloe-brand-border: #e0e7ff;
    --siloe-emerald: #047857; --siloe-emerald-soft: #ecfdf5; --siloe-emerald-border: #a7f3d0; --siloe-emerald-dot: #10b981;
    --siloe-amber: #b45309; --siloe-amber-soft: #fffbeb; --siloe-amber-border: #fde68a; --siloe-amber-dot: #f59e0b;
    --siloe-rose: #be123c; --siloe-rose-soft: #fff1f2; --siloe-rose-border: #fecdd3; --siloe-rose-dot: #fb7185;
    --siloe-slate: #334155; --siloe-slate-soft: #f1f5f9; --siloe-slate-border: #e2e8f0; --siloe-slate-dot: #94a3b8;
}

.siloe-header-title { font-size: 1.85rem; font-weight: 700; letter-spacing: -.01em; }

.siloe-card { border-radius: 1rem; }

.siloe-year-switch { display: inline-flex; align-items: center; gap: .25rem; background: #fff; border: 1px solid #dee2e6; border-radius: .9rem; padding: .25rem; }
.siloe-year-switch .lbl { font-size: .68rem; font-weight: 700; text-transform: uppercase; color: #94a3b8; letter-spacing: .04em; padding: 0 .5rem; }
.siloe-year-switch .yr { font-weight: 700; background: var(--siloe-slate-soft); border: 1px solid var(--siloe-slate-border); border-radius: .6rem; padding: .25rem .75rem; }
.siloe-year-switch a.nav-arrow { width: 2rem; height: 2rem; display: inline-flex; align-items: center; justify-content: center; border-radius: .6rem; color: #64748b; text-decoration: none; }
.siloe-year-switch a.nav-arrow:hover { background: var(--siloe-slate-soft); color: #1e293b; }

.siloe-btn-apertura { background: linear-gradient(90deg, #fbbf24, #f59e0b); border: none; color: #451a03; border-radius: .9rem; font-weight: 600; padding: .55rem 1.1rem; }
.siloe-btn-apertura:hover { color: #451a03; filter: brightness(1.05); }

.siloe-icon-square { width: 1.75rem; height: 1.75rem; border-radius: .5rem; background: var(--siloe-brand-soft); color: var(--siloe-brand); display: inline-flex; align-items: center; justify-content: center; flex-shrink: 0; font-weight: 700; }
.siloe-label-xs { font-size: .68rem; font-weight: 700; text-transform: uppercase; letter-spacing: .04em; color: #64748b; }
.siloe-input-soft { border-radius: .8rem !important; background: #f8fafc; border-color: #cbd5e1; }
.siloe-btn-primary { background: var(--siloe-brand); border-color: var(--siloe-brand); border-radius: .8rem; font-weight: 600; }
.siloe-btn-primary:hover { background: var(--siloe-brand-dark); border-color: var(--siloe-brand-dark); }

.siloe-filters-bar { display: flex; flex-wrap: wrap; gap: .3rem; background: rgba(241,245,249,.8); border: 1px solid #e5e9ef; border-radius: .9rem; padding: .3rem; }
.filtro-temporada { border: none; background: transparent; border-radius: .6rem; padding: .35rem .7rem; font-size: .8rem; font-weight: 600; display: inline-flex; align-items: center; gap: .4rem; color: #334155; transition: background-color .15s; }
.filtro-temporada:hover { background: rgba(255,255,255,.8); }
.filtro-temporada .dot { width: .5rem; height: .5rem; border-radius: 50%; display: inline-block; }
.filtro-temporada .count { border-radius: 999px; padding: .05rem .4rem; font-size: .68rem; font-weight: 700; }
.filtro-temporada-activo, .filtro-temporada-activo:hover { background: var(--siloe-brand); color: #fff; }
.filtro-temporada-activo .count { background: rgba(255,255,255,.25); color: #fff; }
.siloe-search { border-radius: .8rem; }

.siloe-pill { display: inline-flex; align-items: center; gap: .35rem; font-size: .75rem; font-weight: 600; padding: .3rem .65rem; border-radius: 999px; border: 1px solid transparent; }
.siloe-pill .dot { width: .4rem; height: .4rem; border-radius: 50%; display: inline-block; }
.siloe-pill-emerald { background: var(--siloe-emerald-soft); color: var(--siloe-emerald); border-color: var(--siloe-emerald-border); }
.siloe-pill-emerald .dot { background: var(--siloe-emerald-dot); }
.siloe-pill-amber { background: var(--siloe-amber-soft); color: var(--siloe-amber); border-color: var(--siloe-amber-border); }
.siloe-pill-amber .dot { background: var(--siloe-amber-dot); }
.siloe-pill-rose { background: var(--siloe-rose-soft); color: var(--siloe-rose); border-color: var(--siloe-rose-border); }
.siloe-pill-rose .dot { background: var(--siloe-rose-dot); }
.siloe-pill-slate { background: var(--siloe-slate-soft); color: var(--siloe-slate); border-color: var(--siloe-slate-border); }
.siloe-pill-slate .dot { background: var(--siloe-slate-dot); }

.siloe-vasos-chip { width: 1.5rem; height: 1.5rem; border-radius: .4rem; background: var(--siloe-slate-soft); display: inline-flex; align-items: center; justify-content: center; font-size: .75rem; font-weight: 700; color: #334155; }

.siloe-table thead { background: rgba(248,250,252,.9); }
.siloe-table thead th { font-size: .68rem; font-weight: 700; text-transform: uppercase; letter-spacing: .04em; color: #64748b; border-bottom-width: 1px; }
.siloe-table tbody tr:hover { background: rgba(248,250,252,.7); }

.siloe-action-btn { width: 2rem; height: 2rem; display: inline-flex; align-items: center; justify-content: center; border-radius: .6rem; border: 1px solid transparent; color: #64748b; background: transparent; }
.siloe-action-btn:hover { background: var(--siloe-slate-soft); border-color: var(--siloe-slate-border); color: #1e293b; }
.siloe-action-btn.brand { color: var(--siloe-brand); background: rgba(238,242,255,.6); border-color: var(--siloe-brand-border); }
.siloe-action-btn.brand:hover { background: var(--siloe-brand-soft); }
.siloe-action-btn.amber { color: var(--siloe-amber); background: var(--siloe-amber-soft); border-color: var(--siloe-amber-border); }
.siloe-action-btn.amber:hover { filter: brightness(0.97); }

.siloe-table-footer { background: rgba(248,250,252,.9); border-top: 1px solid #e2e8f0; padding: .7rem 1rem; font-size: .78rem; color: #64748b; }
.siloe-pager button { font-size: .78rem; padding: .25rem .6rem; border-radius: .5rem; border: 1px solid #e2e8f0; background: #fff; color: #94a3b8; }
.siloe-pager button.actual { color: #1e293b; font-weight: 700; }
