/*
 * Estilos propios del panel.
 *
 * Filament sirve su CSS ya compilado, así que las utilidades de Tailwind que
 * él no usa internamente no existen en esa hoja. En vez de montar un tema
 * personalizado con npm (que obligaría a compilar antes de cada subida por
 * FTP), se declaran aquí las poquísimas clases propias que hacen falta.
 */

/* Rejilla de tarjetas: 1 columna en móvil, 2 en tablet, 4 en escritorio. */
.lic-grid {
    display: grid;
    gap: 1rem;
    grid-template-columns: 1fr;
}

@media (min-width: 640px) {
    .lic-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (min-width: 1280px) {
    .lic-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}

/* Tabla del reporte de vendedores. */
.lic-table-wrap { overflow-x: auto; }

.lic-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.875rem;
}

.lic-table thead th {
    text-align: left;
    font-size: 0.72rem;
    font-weight: 500;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: rgb(113 113 122);
    padding: 0.5rem 0.75rem 0.5rem 0;
    border-bottom: 1px solid rgb(228 228 231);
    white-space: nowrap;
}

.lic-table tbody td {
    padding: 0.5rem 0.75rem 0.5rem 0;
    border-bottom: 1px solid rgb(244 244 245);
    color: rgb(63 63 70);
}

.lic-table tfoot td {
    padding: 0.75rem 0.75rem 0.75rem 0;
    border-top: 2px solid rgb(212 212 216);
    font-weight: 600;
    color: rgb(24 24 27);
}

.dark .lic-table thead th { color: rgb(161 161 170); border-bottom-color: rgba(255, 255, 255, 0.1); }
.dark .lic-table tbody td { color: rgb(212 212 216); border-bottom-color: rgba(255, 255, 255, 0.05); }
.dark .lic-table tfoot td { color: #fff; border-top-color: rgba(255, 255, 255, 0.2); }

.lic-num { text-align: right; white-space: nowrap; }

/* La especificidad tiene que ganarle a ".lic-table tbody td", que también
   define color; si no, el nombre del cliente no destaca del resto. */
.lic-strong,
.lic-table tbody td.lic-strong { font-weight: 500; color: rgb(9 9 11); }

.dark .lic-strong,
.dark .lic-table tbody td.lic-strong { color: #fff; }

/* Tarjetas de totales. */
.lic-stat-label {
    font-size: 0.72rem;
    font-weight: 500;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: rgb(113 113 122);
}

.dark .lic-stat-label { color: rgb(161 161 170); }

.lic-stat-value {
    margin-top: 0.25rem;
    font-size: 1.5rem;
    font-weight: 600;
    line-height: 1.2;
}

.lic-stat-hint {
    margin-top: 0.25rem;
    font-size: 0.75rem;
    color: rgb(113 113 122);
}

.dark .lic-stat-hint { color: rgb(161 161 170); }

.lic-muted { color: rgb(113 113 122); }
.dark .lic-muted { color: rgb(161 161 170); }
.lic-warning { color: rgb(217 119 6); }
.dark .lic-warning { color: rgb(251 191 36); }
.lic-success { color: rgb(21 128 61); }
.dark .lic-success { color: rgb(52 211 153); }
.lic-primary { color: rgb(79 70 229); }
.dark .lic-primary { color: rgb(129 140 248); }
.lic-empty { padding: 1.5rem 0; text-align: center; font-size: 0.875rem; }

/* Contenido de la página de portabilidad. */
.lic-prose { font-size: .875rem; color: rgb(82 82 91); }
.dark .lic-prose { color: rgb(212 212 216); }
.lic-prose p { margin: 0 0 .75rem; }
.lic-prose ul { margin: 0 0 .75rem; padding-left: 1.25rem; }
.lic-prose li { margin-bottom: .25rem; }
.lic-prose code {
    font-size: .8em;
    padding: .1em .35em;
    border-radius: .25rem;
    background: rgba(113, 113, 122, .12);
}

.lic-list > * + * { border-top: 1px solid rgb(228 228 231); }
.dark .lic-list > * + * { border-top-color: rgba(255, 255, 255, .1); }

.lic-list-row {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: .75rem;
    padding: .75rem 0;
}

.lic-actions { display: flex; align-items: center; gap: .5rem; }

.lic-callout {
    border-radius: .5rem;
    border: 1px solid rgba(245, 158, 11, .3);
    background: rgba(245, 158, 11, .08);
    padding: 1rem;
    font-size: .875rem;
    color: rgb(180 83 9);
}

.dark .lic-callout { color: rgb(252 211 77); }
.lic-callout code { background: rgba(113, 113, 122, .18); padding: .1em .35em; border-radius: .25rem; }

/* El reset de Filament quita los marcadores de lista. */
.lic-prose ul { list-style: disc outside; }
.lic-prose ol { list-style: decimal outside; }