@import '_content/SharedIdentity.UI/SharedIdentity.UI.u7vjwi51b8.bundle.scp.css';

/* _content/Geniar.Asistencias.Web/Pages/Admin/Areas.razor.rz.scp.css */
/* ============================================
   AREAS PAGE STYLES
   ============================================ */

.admin-page[b-eic94g37nv] {
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
}

/* ============================================
   PAGE HEADER
   ============================================ */

.page-header[b-eic94g37nv] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    gap: 1rem;
}

.page-header__info[b-eic94g37nv] {
    flex: 1;
}

.page-header__title[b-eic94g37nv] {
    margin: 0 0 0.25rem 0;
    font-size: var(--font-size-3xl);
    font-weight: 700;
    color: var(--text-primary);
}

.page-header__subtitle[b-eic94g37nv] {
    margin: 0;
    font-size: var(--font-size-base);
    color: var(--text-secondary);
}

.page-header__actions[b-eic94g37nv] {
    display: flex;
    gap: 0.75rem;
}

/* Action Buttons */
.btn-action[b-eic94g37nv] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.625rem 1.25rem;
    font-size: var(--font-size-sm);
    font-weight: 500;
    border: none;
    border-radius: var(--border-radius);
    cursor: pointer;
    transition: all var(--transition-fast);
}

.btn-action .material-icons[b-eic94g37nv] {
    font-size: 20px;
}

.btn-action--primary[b-eic94g37nv] {
    background-color: var(--color-primary);
    color: white;
    box-shadow: 0 4px 14px 0 rgba(29, 78, 216, 0.3);
}

.btn-action--primary:hover[b-eic94g37nv] {
    background-color: var(--color-primary-hover);
}

/* ============================================
   ALERT MESSAGE
   ============================================ */

.alert-message[b-eic94g37nv] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 1rem 1.25rem;
    border-radius: var(--border-radius-lg);
    font-size: var(--font-size-sm);
}

.alert-message .material-icons[b-eic94g37nv] {
    font-size: 20px;
}

.alert-message--success[b-eic94g37nv] {
    background-color: var(--color-success-bg);
    color: var(--color-success);
    border: 1px solid rgba(16, 185, 129, 0.2);
}

.alert-message--error[b-eic94g37nv] {
    background-color: var(--color-danger-bg);
    color: var(--color-danger);
    border: 1px solid rgba(239, 68, 68, 0.2);
}

.alert-message__close[b-eic94g37nv] {
    margin-left: auto;
    background: none;
    border: none;
    cursor: pointer;
    padding: 0.25rem;
    display: flex;
    color: inherit;
    opacity: 0.7;
}

.alert-message__close:hover[b-eic94g37nv] {
    opacity: 1;
}

/* ============================================
   FILTER CARD
   ============================================ */

.filter-card[b-eic94g37nv] {
    background-color: var(--bg-card);
    border: 1px solid var(--border-color);
    border-radius: var(--border-radius-xl);
    overflow: hidden;
}

.filter-card__header[b-eic94g37nv] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.875rem 1.25rem;
    background-color: var(--bg-hover);
    font-size: var(--font-size-sm);
    font-weight: 500;
    color: var(--text-secondary);
    border-bottom: 1px solid var(--border-color);
}

.filter-card__header .material-icons[b-eic94g37nv] {
    font-size: 18px;
}

.filter-card__body[b-eic94g37nv] {
    padding: 1.25rem;
}

.filter-grid[b-eic94g37nv] {
    display: grid;
    gap: 1rem;
}

.filter-grid--3col[b-eic94g37nv] {
    grid-template-columns: 1fr 1fr auto;
}

.filter-group[b-eic94g37nv] {
    display: flex;
    flex-direction: column;
    gap: 0.375rem;
}

.filter-group--count[b-eic94g37nv] {
    display: flex;
    align-items: flex-end;
    justify-content: flex-end;
}

.filter-label[b-eic94g37nv] {
    font-size: var(--font-size-xs);
    font-weight: 500;
    color: var(--text-secondary);
}

.filter-input-wrapper[b-eic94g37nv] {
    position: relative;
}

.filter-input-icon[b-eic94g37nv] {
    position: absolute;
    left: 0.75rem;
    top: 50%;
    transform: translateY(-50%);
    font-size: 18px;
    color: var(--text-muted);
}

.filter-input[b-eic94g37nv] {
    width: 100%;
    padding: 0.5rem 0.75rem 0.5rem 2.5rem;
    font-size: var(--font-size-sm);
    border: 1px solid var(--border-color);
    border-radius: var(--border-radius);
    background-color: var(--bg-card);
    color: var(--text-primary);
    transition: border-color var(--transition-fast);
}

.filter-input:focus[b-eic94g37nv] {
    outline: none;
    border-color: var(--color-primary);
    box-shadow: 0 0 0 3px rgba(29, 78, 216, 0.1);
}

.filter-select[b-eic94g37nv] {
    width: 100%;
    padding: 0.5rem 0.75rem;
    font-size: var(--font-size-sm);
    border: 1px solid var(--border-color);
    border-radius: var(--border-radius);
    background-color: var(--bg-card);
    color: var(--text-primary);
    cursor: pointer;
}

.filter-select:focus[b-eic94g37nv] {
    outline: none;
    border-color: var(--color-primary);
}

.count-badge[b-eic94g37nv] {
    display: inline-flex;
    align-items: center;
    gap: 0.375rem;
    padding: 0.5rem 1rem;
    background-color: var(--bg-hover);
    border-radius: var(--border-radius);
    font-size: var(--font-size-sm);
    color: var(--text-secondary);
}

.count-badge .material-icons[b-eic94g37nv] {
    font-size: 18px;
    color: var(--color-primary);
}

/* ============================================
   LOADING & EMPTY STATE
   ============================================ */

.loading-state[b-eic94g37nv],
.empty-state[b-eic94g37nv] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 4rem 2rem;
    gap: 1rem;
    background-color: var(--bg-card);
    border: 1px solid var(--border-color);
    border-radius: var(--border-radius-xl);
    color: var(--text-secondary);
}

.loading-state .spinner-border[b-eic94g37nv] {
    width: 3rem;
    height: 3rem;
}

.empty-state .material-icons[b-eic94g37nv] {
    font-size: 48px;
    color: var(--text-muted);
}

/* ============================================
   TABLE CARD
   ============================================ */

.table-card[b-eic94g37nv] {
    background-color: var(--bg-card);
    border: 1px solid var(--border-color);
    border-radius: var(--border-radius-xl);
    overflow: hidden;
}

.table-responsive[b-eic94g37nv] {
    overflow-x: auto;
}

.data-table[b-eic94g37nv] {
    width: 100%;
    border-collapse: collapse;
}

.data-table thead[b-eic94g37nv] {
    background-color: var(--bg-hover);
}

.data-table th[b-eic94g37nv] {
    padding: 0.875rem 1rem;
    font-size: var(--font-size-xs);
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: var(--text-secondary);
    text-align: left;
    border-bottom: 1px solid var(--border-color);
}

.data-table td[b-eic94g37nv] {
    padding: 1rem;
    font-size: var(--font-size-sm);
    color: var(--text-primary);
    border-bottom: 1px solid var(--border-color);
    vertical-align: middle;
}

.data-table tbody tr[b-eic94g37nv] {
    transition: background-color var(--transition-fast);
}

.data-table tbody tr:hover[b-eic94g37nv] {
    background-color: var(--bg-hover);
}

.data-table tbody tr:last-child td[b-eic94g37nv] {
    border-bottom: none;
}

/* Color Swatch */
.color-swatch[b-eic94g37nv] {
    width: 32px;
    height: 32px;
    border-radius: var(--border-radius);
    border: 2px solid var(--border-color);
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
}

/* Area Name */
.area-nombre[b-eic94g37nv] {
    font-weight: 500;
    color: var(--text-primary);
}

.area-descripcion[b-eic94g37nv] {
    font-size: var(--font-size-xs);
    color: var(--text-secondary);
}

/* Empleados Badge */
.empleados-badge[b-eic94g37nv] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 28px;
    height: 28px;
    padding: 0 0.5rem;
    background-color: var(--color-primary-bg);
    color: var(--color-primary);
    font-size: var(--font-size-sm);
    font-weight: 600;
    border-radius: 9999px;
}

/* Status Badges */
.status-badge[b-eic94g37nv] {
    display: inline-block;
    padding: 0.25rem 0.75rem;
    font-size: var(--font-size-xs);
    font-weight: 500;
    border-radius: 9999px;
}

.status-badge--activo[b-eic94g37nv] {
    background-color: var(--color-success-bg);
    color: var(--color-success);
}

.status-badge--inactivo[b-eic94g37nv] {
    background-color: var(--bg-hover);
    color: var(--text-secondary);
}

/* Action Buttons */
.action-buttons[b-eic94g37nv] {
    display: flex;
    justify-content: center;
    gap: 0.5rem;
}

.action-btn[b-eic94g37nv] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    border: 1px solid var(--border-color);
    border-radius: var(--border-radius);
    background-color: transparent;
    cursor: pointer;
    transition: all var(--transition-fast);
}

.action-btn .material-icons[b-eic94g37nv] {
    font-size: 18px;
}

.action-btn--edit[b-eic94g37nv] {
    color: var(--color-warning);
}

.action-btn--edit:hover[b-eic94g37nv] {
    background-color: var(--color-warning-bg);
    border-color: var(--color-warning);
}

.action-btn--toggle[b-eic94g37nv] {
    color: var(--color-primary);
}

.action-btn--toggle:hover[b-eic94g37nv] {
    background-color: var(--color-primary-bg);
    border-color: var(--color-primary);
}

.action-btn--delete[b-eic94g37nv] {
    color: var(--color-danger);
}

.action-btn--delete:hover[b-eic94g37nv] {
    background-color: var(--color-danger-bg);
    border-color: var(--color-danger);
}

/* Table Footer */
.table-footer[b-eic94g37nv] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 1rem 1.25rem;
    border-top: 1px solid var(--border-color);
    background-color: var(--bg-hover);
}

.table-footer__count[b-eic94g37nv] {
    font-size: var(--font-size-sm);
    color: var(--text-secondary);
}

.table-footer__count strong[b-eic94g37nv] {
    color: var(--text-primary);
}

/* ============================================
   MODAL
   ============================================ */

.modal-overlay[b-eic94g37nv] {
    position: fixed;
    inset: 0;
    background-color: rgba(0, 0, 0, 0.5);
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 1rem;
    z-index: 1050;
    backdrop-filter: blur(4px);
}

.modal-container[b-eic94g37nv] {
    background-color: var(--bg-card);
    border-radius: var(--border-radius-xl);
    width: 100%;
    max-width: 480px;
    max-height: 90vh;
    overflow: hidden;
    box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.25);
}

.modal-header[b-eic94g37nv] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 1.25rem 1.5rem;
    border-bottom: 1px solid var(--border-color);
}

.modal-title[b-eic94g37nv] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin: 0;
    font-size: var(--font-size-lg);
    font-weight: 600;
    color: var(--text-primary);
}

.modal-title .material-icons[b-eic94g37nv] {
    font-size: 24px;
    color: var(--color-primary);
}

.modal-close[b-eic94g37nv] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    border: none;
    border-radius: var(--border-radius);
    background-color: transparent;
    color: var(--text-secondary);
    cursor: pointer;
    transition: all var(--transition-fast);
}

.modal-close:hover[b-eic94g37nv] {
    background-color: var(--bg-hover);
    color: var(--text-primary);
}

.modal-body[b-eic94g37nv] {
    padding: 1.5rem;
    overflow-y: auto;
    max-height: 60vh;
}

.modal-footer[b-eic94g37nv] {
    display: flex;
    justify-content: flex-end;
    gap: 0.75rem;
    padding: 1.25rem 1.5rem;
    border-top: 1px solid var(--border-color);
    background-color: var(--bg-hover);
}

/* ============================================
   FORM STYLES
   ============================================ */

.form-group[b-eic94g37nv] {
    margin-bottom: 1.25rem;
}

.form-group:last-child[b-eic94g37nv] {
    margin-bottom: 0;
}

.form-label[b-eic94g37nv] {
    display: block;
    margin-bottom: 0.375rem;
    font-size: var(--font-size-sm);
    font-weight: 500;
    color: var(--text-primary);
}

.form-label .required[b-eic94g37nv] {
    color: var(--color-danger);
}

.form-input[b-eic94g37nv] {
    width: 100%;
    padding: 0.625rem 0.875rem;
    font-size: var(--font-size-sm);
    border: 1px solid var(--border-color);
    border-radius: var(--border-radius);
    background-color: var(--bg-card);
    color: var(--text-primary);
    transition: border-color var(--transition-fast);
}

.form-input:focus[b-eic94g37nv] {
    outline: none;
    border-color: var(--color-primary);
    box-shadow: 0 0 0 3px rgba(29, 78, 216, 0.1);
}

.form-textarea[b-eic94g37nv] {
    resize: vertical;
    min-height: 80px;
}

.form-hint[b-eic94g37nv] {
    display: block;
    margin-top: 0.25rem;
    font-size: var(--font-size-xs);
    color: var(--text-muted);
}

/* Color Picker */
.color-picker[b-eic94g37nv] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.color-picker__input[b-eic94g37nv] {
    width: 48px;
    height: 40px;
    padding: 0;
    border: 2px solid var(--border-color);
    border-radius: var(--border-radius);
    cursor: pointer;
}

.color-picker__input[b-eic94g37nv]::-webkit-color-swatch-wrapper {
    padding: 2px;
}

.color-picker__input[b-eic94g37nv]::-webkit-color-swatch {
    border: none;
    border-radius: 4px;
}

.color-picker .form-input[b-eic94g37nv] {
    flex: 1;
    font-family: monospace;
}

/* Checkbox */
.checkbox-item[b-eic94g37nv] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    cursor: pointer;
    font-size: var(--font-size-sm);
    color: var(--text-primary);
}

.checkbox-item input[type="checkbox"][b-eic94g37nv] {
    width: 18px;
    height: 18px;
    accent-color: var(--color-primary);
}

/* Modal Buttons */
.btn-modal[b-eic94g37nv] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    padding: 0.625rem 1.25rem;
    font-size: var(--font-size-sm);
    font-weight: 500;
    border: none;
    border-radius: var(--border-radius);
    cursor: pointer;
    transition: all var(--transition-fast);
}

.btn-modal:disabled[b-eic94g37nv] {
    opacity: 0.6;
    cursor: not-allowed;
}

.btn-modal--primary[b-eic94g37nv] {
    background-color: var(--color-primary);
    color: white;
}

.btn-modal--primary:hover:not(:disabled)[b-eic94g37nv] {
    background-color: var(--color-primary-hover);
}

.btn-modal--secondary[b-eic94g37nv] {
    background-color: var(--bg-hover);
    color: var(--text-primary);
    border: 1px solid var(--border-color);
}

.btn-modal--secondary:hover[b-eic94g37nv] {
    background-color: var(--border-color);
}

/* Validation */
.validation-message[b-eic94g37nv] {
    font-size: var(--font-size-xs);
    color: var(--color-danger);
    margin-top: 0.25rem;
}

/* ============================================
   RESPONSIVE
   ============================================ */

@media (max-width: 768px) {
    .page-header[b-eic94g37nv] {
        flex-direction: column;
        align-items: flex-start;
    }

    .page-header__actions[b-eic94g37nv] {
        width: 100%;
    }

    .btn-action[b-eic94g37nv] {
        flex: 1;
        justify-content: center;
    }

    .filter-grid--3col[b-eic94g37nv] {
        grid-template-columns: 1fr;
    }

    .filter-group--count[b-eic94g37nv] {
        justify-content: flex-start;
    }

    .data-table th:nth-child(3)[b-eic94g37nv],
    .data-table td:nth-child(3)[b-eic94g37nv] {
        display: none;
    }
}

@media (max-width: 640px) {
    .page-header__title[b-eic94g37nv] {
        font-size: var(--font-size-2xl);
    }

    .data-table th:nth-child(4)[b-eic94g37nv],
    .data-table td:nth-child(4)[b-eic94g37nv] {
        display: none;
    }
}

/* ============================================
   DARK MODE
   ============================================ */

[data-theme="dark"] .filter-card[b-eic94g37nv] {
    background-color: var(--bg-card);
    border-color: var(--border-color);
}

[data-theme="dark"] .filter-card__header[b-eic94g37nv] {
    background-color: rgba(255, 255, 255, 0.05);
}

[data-theme="dark"] .table-card[b-eic94g37nv] {
    background-color: var(--bg-card);
    border-color: var(--border-color);
}

[data-theme="dark"] .data-table thead[b-eic94g37nv] {
    background-color: rgba(255, 255, 255, 0.05);
}

[data-theme="dark"] .table-footer[b-eic94g37nv] {
    background-color: rgba(255, 255, 255, 0.05);
}

[data-theme="dark"] .loading-state[b-eic94g37nv],
[data-theme="dark"] .empty-state[b-eic94g37nv] {
    background-color: var(--bg-card);
    border-color: var(--border-color);
}

[data-theme="dark"] .modal-container[b-eic94g37nv] {
    background-color: var(--bg-card);
}

[data-theme="dark"] .modal-footer[b-eic94g37nv] {
    background-color: rgba(255, 255, 255, 0.05);
}

[data-theme="dark"] .color-swatch[b-eic94g37nv] {
    border-color: var(--border-color);
}

[data-theme="dark"] .count-badge[b-eic94g37nv] {
    background-color: rgba(255, 255, 255, 0.1);
}
/* _content/Geniar.Asistencias.Web/Pages/Admin/AsignacionMasiva.razor.rz.scp.css */
/* ============================================
   ASIGNACION MASIVA PAGE STYLES
   ============================================ */

.admin-page[b-1922zlcush] { display: flex; flex-direction: column; gap: 1.5rem; }

/* Page Header */
.page-header[b-1922zlcush] { display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 1rem; }
.page-header__info[b-1922zlcush] { flex: 1; }
.page-header__title[b-1922zlcush] { margin: 0 0 0.25rem 0; font-size: var(--font-size-3xl); font-weight: 700; color: var(--text-primary); }
.page-header__subtitle[b-1922zlcush] { margin: 0; font-size: var(--font-size-base); color: var(--text-secondary); }

/* Wizard Progress */
.wizard-progress[b-1922zlcush] { display: flex; align-items: center; justify-content: center; gap: 0; padding: 1.5rem 2rem; background-color: var(--bg-card); border: 1px solid var(--border-color); border-radius: var(--border-radius-xl); }
.wizard-step[b-1922zlcush] { display: flex; align-items: center; gap: 0.75rem; }
.wizard-step__circle[b-1922zlcush] { display: flex; align-items: center; justify-content: center; width: 40px; height: 40px; border-radius: 50%; background-color: var(--bg-hover); border: 2px solid var(--border-color); font-weight: 600; color: var(--text-secondary); transition: all var(--transition-fast); }
.wizard-step__circle .material-icons[b-1922zlcush] { font-size: 20px; }
.wizard-step--active .wizard-step__circle[b-1922zlcush] { background-color: var(--color-primary); border-color: var(--color-primary); color: white; }
.wizard-step--completed .wizard-step__circle[b-1922zlcush] { background-color: var(--color-success); border-color: var(--color-success); color: white; }
.wizard-step__content[b-1922zlcush] { display: flex; flex-direction: column; }
.wizard-step__title[b-1922zlcush] { font-size: var(--font-size-sm); font-weight: 600; color: var(--text-primary); }
.wizard-step__subtitle[b-1922zlcush] { font-size: var(--font-size-xs); color: var(--text-muted); }
.wizard-step--active .wizard-step__title[b-1922zlcush] { color: var(--color-primary); }
.wizard-step--completed .wizard-step__title[b-1922zlcush] { color: var(--color-success); }
.wizard-step__connector[b-1922zlcush] { flex: 0 0 60px; height: 2px; background-color: var(--border-color); margin: 0 1rem; }
.wizard-step__connector--active[b-1922zlcush] { background-color: var(--color-success); }

/* Step Card */
.step-card[b-1922zlcush] { background-color: var(--bg-card); border: 1px solid var(--border-color); border-radius: var(--border-radius-xl); overflow: hidden; }
.step-card--success[b-1922zlcush] { border-color: var(--color-success); }
.step-card--warning[b-1922zlcush] { border-color: var(--color-warning); }
.step-card__header[b-1922zlcush] { display: flex; align-items: center; gap: 0.5rem; padding: 1rem 1.5rem; background-color: var(--bg-hover); font-size: var(--font-size-base); font-weight: 600; color: var(--text-primary); border-bottom: 1px solid var(--border-color); }
.step-card__header .material-icons[b-1922zlcush] { font-size: 20px; color: var(--color-primary); }
.step-card__header--result[b-1922zlcush] { background-color: var(--color-success); color: white; }
.step-card__header--result .material-icons[b-1922zlcush] { color: white; }
.step-card__header--warning[b-1922zlcush] { background-color: var(--color-warning); color: white; }
.step-card__header--warning .material-icons[b-1922zlcush] { color: white; }
.step-card__body[b-1922zlcush] { padding: 1.5rem; }
.step-card__footer[b-1922zlcush] { display: flex; justify-content: space-between; align-items: center; padding: 1rem 1.5rem; background-color: var(--bg-hover); border-top: 1px solid var(--border-color); }

/* Step Filters */
.step-filters[b-1922zlcush] { display: flex; gap: 0.75rem; margin-bottom: 1rem; flex-wrap: wrap; }
.step-filters__search[b-1922zlcush] { flex: 1; min-width: 250px; display: flex; align-items: center; gap: 0.5rem; padding: 0 0.75rem; background-color: var(--bg-card); border: 1px solid var(--border-color); border-radius: var(--border-radius); }
.step-filters__search .material-icons[b-1922zlcush] { font-size: 20px; color: var(--text-muted); }
.step-filters__search .form-input[b-1922zlcush] { border: none; padding-left: 0; background: transparent; }
.step-filters__search .form-input:focus[b-1922zlcush] { box-shadow: none; }

/* Step Buttons */
.btn-step[b-1922zlcush] { display: inline-flex; align-items: center; justify-content: center; gap: 0.5rem; padding: 0.625rem 1.25rem; font-size: var(--font-size-sm); font-weight: 500; border: none; border-radius: var(--border-radius); cursor: pointer; transition: all var(--transition-fast); text-decoration: none; }
.btn-step .material-icons[b-1922zlcush] { font-size: 18px; }
.btn-step:disabled[b-1922zlcush] { opacity: 0.6; cursor: not-allowed; }
.btn-step--primary[b-1922zlcush] { background-color: var(--color-primary); color: white; }
.btn-step--primary:hover:not(:disabled)[b-1922zlcush] { background-color: var(--color-primary-hover); }
.btn-step--secondary[b-1922zlcush] { background-color: var(--bg-hover); color: var(--text-primary); border: 1px solid var(--border-color); }
.btn-step--secondary:hover:not(:disabled)[b-1922zlcush] { background-color: var(--border-color); }
.btn-step--success[b-1922zlcush] { background-color: var(--color-success); color: white; }
.btn-step--success:hover:not(:disabled)[b-1922zlcush] { background-color: #059669; }
.btn-step--outline[b-1922zlcush] { background-color: transparent; color: var(--color-primary); border: 1px solid var(--color-primary); }
.btn-step--outline:hover:not(:disabled)[b-1922zlcush] { background-color: var(--color-primary-bg); }

/* Loading/Empty States */
.loading-state[b-1922zlcush], .empty-state[b-1922zlcush] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem 2rem; gap: 1rem; color: var(--text-muted); }
.loading-state .spinner-border[b-1922zlcush] { width: 2.5rem; height: 2.5rem; }
.empty-state .material-icons[b-1922zlcush] { font-size: 48px; }
.empty-state p[b-1922zlcush] { margin: 0; font-size: var(--font-size-sm); }

/* Employees Table Container */
.employees-table-container[b-1922zlcush] { max-height: 400px; overflow-y: auto; border: 1px solid var(--border-color); border-radius: var(--border-radius); }

/* Data Table */
.data-table[b-1922zlcush] { width: 100%; border-collapse: collapse; font-size: var(--font-size-sm); }
.data-table thead[b-1922zlcush] { position: sticky; top: 0; z-index: 10; }
.data-table th[b-1922zlcush] { padding: 0.75rem 1rem; text-align: left; font-weight: 600; color: var(--text-primary); background-color: var(--bg-hover); border-bottom: 1px solid var(--border-color); }
.data-table td[b-1922zlcush] { padding: 0.75rem 1rem; border-bottom: 1px solid var(--border-color); color: var(--text-primary); }
.data-table tbody tr[b-1922zlcush] { cursor: pointer; transition: background-color var(--transition-fast); }
.data-table tbody tr:hover[b-1922zlcush] { background-color: var(--bg-hover); }
.data-table tbody tr.row-selected[b-1922zlcush] { background-color: var(--color-primary-bg); }
.data-table--compact th[b-1922zlcush], .data-table--compact td[b-1922zlcush] { padding: 0.5rem 0.75rem; font-size: var(--font-size-xs); }

/* Checkbox Wrapper */
.checkbox-wrapper[b-1922zlcush] { display: flex; align-items: center; cursor: pointer; }
.checkbox-wrapper input[b-1922zlcush] { display: none; }
.checkbox-custom[b-1922zlcush] { width: 18px; height: 18px; border: 2px solid var(--border-color); border-radius: 4px; display: flex; align-items: center; justify-content: center; transition: all var(--transition-fast); }
.checkbox-wrapper input:checked + .checkbox-custom[b-1922zlcush] { background-color: var(--color-primary); border-color: var(--color-primary); }
.checkbox-wrapper input:checked + .checkbox-custom[b-1922zlcush]::after { content: ''; width: 5px; height: 9px; border: solid white; border-width: 0 2px 2px 0; transform: rotate(45deg); margin-bottom: 2px; }

/* Legajo Badge */
.legajo-badge[b-1922zlcush] { display: inline-block; padding: 0.25rem 0.5rem; font-size: var(--font-size-xs); font-weight: 500; background-color: var(--bg-hover); color: var(--text-primary); border-radius: var(--border-radius); font-family: monospace; }

/* Text Muted */
.text-muted[b-1922zlcush] { color: var(--text-muted); }

/* Selection Summary */
.selection-summary[b-1922zlcush] { display: flex; align-items: center; gap: 0.5rem; padding: 0.75rem 1rem; margin-top: 1rem; background-color: var(--color-primary-bg); border-radius: var(--border-radius); color: var(--color-primary); font-size: var(--font-size-sm); }
.selection-summary .material-icons[b-1922zlcush] { font-size: 18px; }

/* Turnos Grid */
.turnos-grid[b-1922zlcush] { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 1rem; }
.turno-card[b-1922zlcush] { background-color: var(--bg-card); border: 2px solid var(--border-color); border-radius: var(--border-radius-lg); padding: 1rem; cursor: pointer; transition: all var(--transition-fast); }
.turno-card:hover[b-1922zlcush] { border-color: var(--color-primary); }
.turno-card--selected[b-1922zlcush] { border-color: var(--color-primary); background-color: var(--color-primary-bg); }
.turno-card__header[b-1922zlcush] { display: flex; justify-content: space-between; align-items: flex-start; margin-bottom: 0.75rem; }
.turno-card__name[b-1922zlcush] { font-size: var(--font-size-base); font-weight: 600; color: var(--text-primary); }
.turno-card__radio input[b-1922zlcush] { width: 18px; height: 18px; accent-color: var(--color-primary); }
.turno-card__tipo[b-1922zlcush] { margin-bottom: 0.75rem; }
.tipo-badge[b-1922zlcush] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.25rem 0.5rem; font-size: var(--font-size-xs); font-weight: 500; border-radius: var(--border-radius); }
.tipo-badge .material-icons[b-1922zlcush] { font-size: 14px; }
.tipo-badge--diurno[b-1922zlcush] { background-color: var(--color-warning-bg); color: var(--color-warning); }
.tipo-badge--nocturno[b-1922zlcush] { background-color: #1e293b; color: #94a3b8; }
.turno-card__details[b-1922zlcush] { display: flex; flex-direction: column; gap: 0.375rem; }
.turno-detail[b-1922zlcush] { display: flex; align-items: center; gap: 0.375rem; font-size: var(--font-size-xs); color: var(--text-secondary); }
.turno-detail .material-icons[b-1922zlcush] { font-size: 14px; color: var(--color-primary); }
.turno-card__description[b-1922zlcush] { margin-top: 0.75rem; padding-top: 0.75rem; border-top: 1px solid var(--border-color); font-size: var(--font-size-xs); color: var(--text-muted); }

/* Config Section */
.config-section[b-1922zlcush] { margin-bottom: 1.5rem; }
.config-section:last-child[b-1922zlcush] { margin-bottom: 0; }
.config-section__label[b-1922zlcush] { display: block; font-size: var(--font-size-sm); font-weight: 600; color: var(--text-primary); margin-bottom: 0.5rem; }
.config-section__hint[b-1922zlcush] { margin: 0 0 0.75rem 0; font-size: var(--font-size-xs); color: var(--text-muted); }

/* Period Grid */
.period-grid[b-1922zlcush] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 1rem; }
.period-card[b-1922zlcush] { display: flex; flex-direction: column; align-items: center; padding: 1.25rem 1rem; background-color: var(--bg-card); border: 2px solid var(--border-color); border-radius: var(--border-radius-lg); cursor: pointer; transition: all var(--transition-fast); text-align: center; }
.period-card:hover[b-1922zlcush] { border-color: var(--color-primary); }
.period-card--selected[b-1922zlcush] { border-color: var(--color-primary); background-color: var(--color-primary-bg); }
.period-card .material-icons[b-1922zlcush] { font-size: 32px; color: var(--text-muted); margin-bottom: 0.5rem; }
.period-card--selected .material-icons[b-1922zlcush] { color: var(--color-primary); }
.period-card__title[b-1922zlcush] { font-size: var(--font-size-sm); font-weight: 500; color: var(--text-primary); margin-bottom: 0.25rem; }
.period-card__dates[b-1922zlcush] { font-size: var(--font-size-xs); color: var(--text-muted); }

/* Form Styles */
.form-row[b-1922zlcush] { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; }
.form-group[b-1922zlcush] { margin-bottom: 1rem; }
.form-label[b-1922zlcush] { display: block; margin-bottom: 0.5rem; font-size: var(--font-size-sm); font-weight: 500; color: var(--text-primary); }
.form-input[b-1922zlcush] { width: 100%; padding: 0.625rem 0.875rem; font-size: var(--font-size-sm); border: 1px solid var(--border-color); border-radius: var(--border-radius); background-color: var(--bg-card); color: var(--text-primary); }
.form-input:focus[b-1922zlcush] { outline: none; border-color: var(--color-primary); box-shadow: 0 0 0 3px rgba(29, 78, 216, 0.1); }
.form-textarea[b-1922zlcush] { resize: vertical; min-height: 60px; }
.form-hint[b-1922zlcush] { display: block; margin-top: 0.25rem; font-size: var(--font-size-xs); color: var(--text-muted); }

/* Days Grid */
.days-grid[b-1922zlcush] { display: flex; flex-wrap: wrap; gap: 0.5rem; margin-bottom: 0.5rem; }
.day-checkbox[b-1922zlcush] { display: flex; align-items: center; justify-content: center; width: 48px; height: 40px; border: 1px solid var(--border-color); border-radius: var(--border-radius); background-color: var(--bg-card); cursor: pointer; transition: all var(--transition-fast); }
.day-checkbox input[b-1922zlcush] { display: none; }
.day-checkbox span[b-1922zlcush] { font-size: var(--font-size-sm); font-weight: 500; color: var(--text-secondary); }
.day-checkbox:hover[b-1922zlcush] { border-color: var(--color-primary); }
.day-checkbox--active[b-1922zlcush] { background-color: var(--color-primary); border-color: var(--color-primary); }
.day-checkbox--active span[b-1922zlcush] { color: white; }
.days-hint[b-1922zlcush] { display: flex; align-items: center; gap: 0.25rem; font-size: var(--font-size-xs); color: var(--color-primary); }
.days-hint .material-icons[b-1922zlcush] { font-size: 14px; }

/* Options Grid */
.options-grid[b-1922zlcush] { display: flex; flex-direction: column; gap: 0.75rem; }
.toggle-option[b-1922zlcush] { display: flex; align-items: center; justify-content: space-between; padding: 1rem; background-color: var(--bg-hover); border-radius: var(--border-radius); cursor: pointer; }
.toggle-option__info[b-1922zlcush] { display: flex; flex-direction: column; gap: 0.125rem; }
.toggle-option__title[b-1922zlcush] { font-size: var(--font-size-sm); font-weight: 500; color: var(--text-primary); }
.toggle-option__description[b-1922zlcush] { font-size: var(--font-size-xs); color: var(--text-muted); }

/* Toggle Switch */
.toggle-switch[b-1922zlcush] { display: flex; align-items: center; cursor: pointer; }
.toggle-switch input[b-1922zlcush] { display: none; }
.toggle-switch__slider[b-1922zlcush] { position: relative; width: 44px; height: 24px; background-color: var(--border-color); border-radius: 12px; transition: background-color var(--transition-fast); }
.toggle-switch__slider[b-1922zlcush]::before { content: ''; position: absolute; top: 2px; left: 2px; width: 20px; height: 20px; background-color: white; border-radius: 50%; transition: transform var(--transition-fast); box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2); }
.toggle-switch input:checked + .toggle-switch__slider[b-1922zlcush] { background-color: var(--color-primary); }
.toggle-switch input:checked + .toggle-switch__slider[b-1922zlcush]::before { transform: translateX(20px); }

/* Result Stats */
.result-stats[b-1922zlcush] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 1rem; margin-bottom: 1.5rem; }
.result-stat[b-1922zlcush] { display: flex; flex-direction: column; align-items: center; padding: 1.25rem 1rem; border-radius: var(--border-radius-lg); text-align: center; }
.result-stat--primary[b-1922zlcush] { background-color: var(--color-primary-bg); border: 1px solid rgba(29, 78, 216, 0.2); }
.result-stat--success[b-1922zlcush] { background-color: var(--color-success-bg); border: 1px solid rgba(16, 185, 129, 0.2); }
.result-stat--warning[b-1922zlcush] { background-color: var(--color-warning-bg); border: 1px solid rgba(245, 158, 11, 0.2); }
.result-stat--danger[b-1922zlcush] { background-color: var(--color-danger-bg); border: 1px solid rgba(239, 68, 68, 0.2); }
.result-stat__value[b-1922zlcush] { font-size: var(--font-size-2xl); font-weight: 700; margin-bottom: 0.25rem; }
.result-stat--primary .result-stat__value[b-1922zlcush] { color: var(--color-primary); }
.result-stat--success .result-stat__value[b-1922zlcush] { color: var(--color-success); }
.result-stat--warning .result-stat__value[b-1922zlcush] { color: var(--color-warning); }
.result-stat--danger .result-stat__value[b-1922zlcush] { color: var(--color-danger); }
.result-stat__label[b-1922zlcush] { font-size: var(--font-size-xs); color: var(--text-secondary); }

/* Result Message */
.result-message[b-1922zlcush] { display: flex; align-items: center; gap: 0.75rem; padding: 1rem; border-radius: var(--border-radius); font-size: var(--font-size-sm); font-weight: 500; margin-bottom: 1.5rem; }
.result-message .material-icons[b-1922zlcush] { font-size: 20px; }
.result-message--success[b-1922zlcush] { background-color: var(--color-success-bg); color: var(--color-success); border: 1px solid rgba(16, 185, 129, 0.2); }
.result-message--warning[b-1922zlcush] { background-color: var(--color-warning-bg); color: var(--color-warning); border: 1px solid rgba(245, 158, 11, 0.2); }

/* Result Section */
.result-section[b-1922zlcush] { border-radius: var(--border-radius-lg); overflow: hidden; margin-bottom: 1rem; }
.result-section:last-child[b-1922zlcush] { margin-bottom: 0; }
.result-section--warning[b-1922zlcush] { border: 1px solid var(--color-warning); }
.result-section--danger[b-1922zlcush] { border: 1px solid var(--color-danger); }
.result-section__header[b-1922zlcush] { display: flex; align-items: center; gap: 0.5rem; padding: 0.75rem 1rem; font-size: var(--font-size-sm); font-weight: 600; }
.result-section--warning .result-section__header[b-1922zlcush] { background-color: var(--color-warning); color: white; }
.result-section--danger .result-section__header[b-1922zlcush] { background-color: var(--color-danger); color: white; }
.result-section__header .material-icons[b-1922zlcush] { font-size: 18px; }
.result-section__body[b-1922zlcush] { padding: 0; }
.result-section__body .data-table[b-1922zlcush] { margin: 0; }
.result-section__body .data-table tbody tr:last-child td[b-1922zlcush] { border-bottom: none; }

/* Responsive */
@media (max-width: 1024px) {
    .wizard-progress[b-1922zlcush] { flex-wrap: wrap; gap: 1rem; justify-content: flex-start; }
    .wizard-step__connector[b-1922zlcush] { display: none; }
    .period-grid[b-1922zlcush] { grid-template-columns: repeat(2, 1fr); }
    .result-stats[b-1922zlcush] { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 768px) {
    .step-filters[b-1922zlcush] { flex-direction: column; }
    .step-filters__search[b-1922zlcush] { min-width: 100%; }
    .form-row[b-1922zlcush] { grid-template-columns: 1fr; }
    .period-grid[b-1922zlcush] { grid-template-columns: 1fr; }
    .result-stats[b-1922zlcush] { grid-template-columns: 1fr; }
    .turnos-grid[b-1922zlcush] { grid-template-columns: 1fr; }
    .step-card__footer[b-1922zlcush] { flex-direction: column; gap: 0.75rem; }
    .step-card__footer .btn-step[b-1922zlcush] { width: 100%; }
}

/* Dark Mode */
[data-theme="dark"] .wizard-progress[b-1922zlcush], [data-theme="dark"] .step-card[b-1922zlcush] { background-color: var(--bg-card); border-color: var(--border-color); }
[data-theme="dark"] .step-card__header[b-1922zlcush], [data-theme="dark"] .step-card__footer[b-1922zlcush] { background-color: rgba(255, 255, 255, 0.05); }
[data-theme="dark"] .data-table th[b-1922zlcush] { background-color: rgba(255, 255, 255, 0.05); }
[data-theme="dark"] .turno-card[b-1922zlcush], [data-theme="dark"] .period-card[b-1922zlcush] { background-color: var(--bg-card); }
[data-theme="dark"] .toggle-option[b-1922zlcush] { background-color: rgba(255, 255, 255, 0.05); }
[data-theme="dark"] .employees-table-container[b-1922zlcush] { border-color: var(--border-color); }
/* _content/Geniar.Asistencias.Web/Pages/Admin/AsignarTurnos.razor.rz.scp.css */
/* ============================================
   ASIGNAR TURNOS PAGE STYLES
   ============================================ */

.admin-page[b-o2z6z5hz3d] { display: flex; flex-direction: column; gap: 1.5rem; }

/* Page Header */
.page-header[b-o2z6z5hz3d] { display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 1rem; }
.page-header__info[b-o2z6z5hz3d] { flex: 1; }
.page-header__title[b-o2z6z5hz3d] { margin: 0 0 0.25rem 0; font-size: var(--font-size-3xl); font-weight: 700; color: var(--text-primary); }
.page-header__subtitle[b-o2z6z5hz3d] { margin: 0; font-size: var(--font-size-base); color: var(--text-secondary); }

/* Alert */
.alert-message[b-o2z6z5hz3d] { display: flex; align-items: center; gap: 0.75rem; padding: 1rem 1.25rem; border-radius: var(--border-radius-lg); font-size: var(--font-size-sm); }
.alert-message .material-icons[b-o2z6z5hz3d] { font-size: 20px; }
.alert-message--success[b-o2z6z5hz3d] { background-color: var(--color-success-bg); color: var(--color-success); border: 1px solid rgba(16, 185, 129, 0.2); }
.alert-message--error[b-o2z6z5hz3d] { background-color: var(--color-danger-bg); color: var(--color-danger); border: 1px solid rgba(239, 68, 68, 0.2); }
.alert-message__close[b-o2z6z5hz3d] { margin-left: auto; background: none; border: none; cursor: pointer; padding: 0.25rem; display: flex; color: inherit; opacity: 0.7; }
.alert-message__close:hover[b-o2z6z5hz3d] { opacity: 1; }

/* Content Grid */
.content-grid[b-o2z6z5hz3d] { display: grid; grid-template-columns: 2fr 1fr; gap: 1.5rem; }

/* Form Card */
.form-card[b-o2z6z5hz3d] { background-color: var(--bg-card); border: 1px solid var(--border-color); border-radius: var(--border-radius-xl); overflow: hidden; }
.form-card__header[b-o2z6z5hz3d] { display: flex; align-items: center; gap: 0.5rem; padding: 1rem 1.5rem; background-color: var(--bg-hover); font-size: var(--font-size-base); font-weight: 600; color: var(--text-primary); border-bottom: 1px solid var(--border-color); }
.form-card__header .material-icons[b-o2z6z5hz3d] { font-size: 20px; color: var(--color-primary); }
.form-card__body[b-o2z6z5hz3d] { padding: 1.5rem; }

/* Form Styles */
.form-group[b-o2z6z5hz3d] { margin-bottom: 1.25rem; }
.form-row[b-o2z6z5hz3d] { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; }
.form-label[b-o2z6z5hz3d] { display: flex; align-items: center; gap: 0.375rem; margin-bottom: 0.5rem; font-size: var(--font-size-sm); font-weight: 500; color: var(--text-primary); }
.form-label .material-icons[b-o2z6z5hz3d] { font-size: 18px; color: var(--color-primary); }
.form-label .required[b-o2z6z5hz3d] { color: var(--color-danger); }
.form-input[b-o2z6z5hz3d] { width: 100%; padding: 0.625rem 0.875rem; font-size: var(--font-size-sm); border: 1px solid var(--border-color); border-radius: var(--border-radius); background-color: var(--bg-card); color: var(--text-primary); }
.form-input:focus[b-o2z6z5hz3d] { outline: none; border-color: var(--color-primary); box-shadow: 0 0 0 3px rgba(29, 78, 216, 0.1); }
.form-textarea[b-o2z6z5hz3d] { resize: vertical; min-height: 60px; }
.form-hint[b-o2z6z5hz3d] { display: block; margin-top: 0.25rem; font-size: var(--font-size-xs); color: var(--text-muted); }

/* Turno Info */
.turno-info[b-o2z6z5hz3d] { display: flex; flex-wrap: wrap; gap: 1rem; margin-top: 0.75rem; padding: 0.75rem; background-color: var(--bg-hover); border-radius: var(--border-radius); }
.turno-info__item[b-o2z6z5hz3d] { display: flex; align-items: center; gap: 0.375rem; font-size: var(--font-size-sm); color: var(--text-secondary); }
.turno-info__item .material-icons[b-o2z6z5hz3d] { font-size: 16px; color: var(--color-primary); }

/* Days Grid */
.days-grid[b-o2z6z5hz3d] { display: flex; flex-wrap: wrap; gap: 0.5rem; }
.day-checkbox[b-o2z6z5hz3d] { display: flex; align-items: center; justify-content: center; width: 48px; height: 40px; border: 1px solid var(--border-color); border-radius: var(--border-radius); background-color: var(--bg-card); cursor: pointer; transition: all var(--transition-fast); }
.day-checkbox input[b-o2z6z5hz3d] { display: none; }
.day-checkbox span[b-o2z6z5hz3d] { font-size: var(--font-size-sm); font-weight: 500; color: var(--text-secondary); }
.day-checkbox:hover[b-o2z6z5hz3d] { border-color: var(--color-primary); }
.day-checkbox--active[b-o2z6z5hz3d] { background-color: var(--color-primary); border-color: var(--color-primary); }
.day-checkbox--active span[b-o2z6z5hz3d] { color: white; }

/* Form Actions */
.form-actions[b-o2z6z5hz3d] { display: flex; justify-content: flex-end; gap: 0.75rem; margin-top: 1.5rem; padding-top: 1.5rem; border-top: 1px solid var(--border-color); }
.btn-modal[b-o2z6z5hz3d] { display: inline-flex; align-items: center; justify-content: center; gap: 0.5rem; padding: 0.625rem 1.25rem; font-size: var(--font-size-sm); font-weight: 500; border: none; border-radius: var(--border-radius); cursor: pointer; transition: all var(--transition-fast); }
.btn-modal:disabled[b-o2z6z5hz3d] { opacity: 0.6; cursor: not-allowed; }
.btn-modal--primary[b-o2z6z5hz3d] { background-color: var(--color-primary); color: white; }
.btn-modal--primary:hover:not(:disabled)[b-o2z6z5hz3d] { background-color: var(--color-primary-hover); }
.btn-modal--secondary[b-o2z6z5hz3d] { background-color: var(--bg-hover); color: var(--text-primary); border: 1px solid var(--border-color); }
.btn-modal--secondary:hover[b-o2z6z5hz3d] { background-color: var(--border-color); }
.btn-modal .material-icons[b-o2z6z5hz3d] { font-size: 18px; }

/* Sidebar Card */
.sidebar-card[b-o2z6z5hz3d] { background-color: var(--bg-card); border: 1px solid var(--border-color); border-radius: var(--border-radius-xl); overflow: hidden; align-self: flex-start; }
.sidebar-card__header[b-o2z6z5hz3d] { display: flex; align-items: center; gap: 0.5rem; padding: 1rem 1.25rem; background-color: var(--bg-hover); font-size: var(--font-size-sm); font-weight: 600; color: var(--text-primary); border-bottom: 1px solid var(--border-color); }
.sidebar-card__header .material-icons[b-o2z6z5hz3d] { font-size: 18px; color: var(--color-primary); }
.sidebar-card__body[b-o2z6z5hz3d] { padding: 1rem; max-height: 500px; overflow-y: auto; }
.sidebar-card__empty[b-o2z6z5hz3d] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem 1.5rem; text-align: center; color: var(--text-muted); }
.sidebar-card__empty .material-icons[b-o2z6z5hz3d] { font-size: 48px; margin-bottom: 1rem; }
.sidebar-card__empty p[b-o2z6z5hz3d] { margin: 0; font-size: var(--font-size-sm); }

/* Loading/Empty Mini */
.loading-mini[b-o2z6z5hz3d], .empty-mini[b-o2z6z5hz3d] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; padding: 2rem 1rem; color: var(--text-muted); }
.empty-mini .material-icons[b-o2z6z5hz3d] { font-size: 32px; }

/* Asignaciones List */
.asignaciones-list[b-o2z6z5hz3d] { display: flex; flex-direction: column; gap: 0.75rem; }
.asignacion-item[b-o2z6z5hz3d] { display: flex; align-items: flex-start; gap: 0.75rem; padding: 0.75rem; background-color: var(--bg-hover); border-radius: var(--border-radius); }
.asignacion-item__info[b-o2z6z5hz3d] { flex: 1; display: flex; flex-direction: column; gap: 0.25rem; }
.asignacion-item__nombre[b-o2z6z5hz3d] { font-size: var(--font-size-sm); font-weight: 500; color: var(--text-primary); display: flex; align-items: center; gap: 0.5rem; }
.asignacion-item__horario[b-o2z6z5hz3d], .asignacion-item__periodo[b-o2z6z5hz3d], .asignacion-item__dias[b-o2z6z5hz3d] { display: flex; align-items: center; gap: 0.25rem; font-size: var(--font-size-xs); color: var(--text-secondary); }
.asignacion-item__horario .material-icons[b-o2z6z5hz3d], .asignacion-item__periodo .material-icons[b-o2z6z5hz3d], .asignacion-item__dias .material-icons[b-o2z6z5hz3d] { font-size: 14px; }

/* Status Badge */
.status-badge[b-o2z6z5hz3d] { display: inline-block; padding: 0.125rem 0.5rem; font-size: 10px; font-weight: 500; border-radius: 9999px; }
.status-badge--activo[b-o2z6z5hz3d] { background-color: var(--color-success-bg); color: var(--color-success); }

/* Action Button */
.action-btn[b-o2z6z5hz3d] { display: flex; align-items: center; justify-content: center; width: 32px; height: 32px; border: 1px solid var(--border-color); border-radius: var(--border-radius); background-color: var(--bg-card); cursor: pointer; transition: all var(--transition-fast); flex-shrink: 0; }
.action-btn .material-icons[b-o2z6z5hz3d] { font-size: 16px; }
.action-btn--delete[b-o2z6z5hz3d] { color: var(--color-danger); }
.action-btn--delete:hover[b-o2z6z5hz3d] { background-color: var(--color-danger-bg); border-color: var(--color-danger); }

/* Responsive */
@media (max-width: 1024px) { .content-grid[b-o2z6z5hz3d] { grid-template-columns: 1fr; } .sidebar-card[b-o2z6z5hz3d] { order: -1; } }
@media (max-width: 768px) { .form-row[b-o2z6z5hz3d] { grid-template-columns: 1fr; } .days-grid[b-o2z6z5hz3d] { justify-content: flex-start; } }

/* Dark Mode */
[data-theme="dark"] .form-card[b-o2z6z5hz3d], [data-theme="dark"] .sidebar-card[b-o2z6z5hz3d] { background-color: var(--bg-card); border-color: var(--border-color); }
[data-theme="dark"] .form-card__header[b-o2z6z5hz3d], [data-theme="dark"] .sidebar-card__header[b-o2z6z5hz3d] { background-color: rgba(255, 255, 255, 0.05); }
[data-theme="dark"] .turno-info[b-o2z6z5hz3d], [data-theme="dark"] .asignacion-item[b-o2z6z5hz3d] { background-color: rgba(255, 255, 255, 0.05); }
/* _content/Geniar.Asistencias.Web/Pages/Admin/Ausencias.razor.rz.scp.css */
/* ============================================
   AUSENCIAS PAGE STYLES
   ============================================ */

.admin-page[b-3632xmk42w] {
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
}

/* Page Header */
.page-header[b-3632xmk42w] { display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 1rem; }
.page-header__info[b-3632xmk42w] { flex: 1; }
.page-header__title[b-3632xmk42w] { margin: 0 0 0.25rem 0; font-size: var(--font-size-3xl); font-weight: 700; color: var(--text-primary); }
.page-header__subtitle[b-3632xmk42w] { margin: 0; font-size: var(--font-size-base); color: var(--text-secondary); }
.page-header__actions[b-3632xmk42w] { display: flex; gap: 0.75rem; }

/* Buttons */
.btn-action[b-3632xmk42w] { display: inline-flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1.25rem; font-size: var(--font-size-sm); font-weight: 500; border: none; border-radius: var(--border-radius); cursor: pointer; transition: all var(--transition-fast); }
.btn-action .material-icons[b-3632xmk42w] { font-size: 20px; }
.btn-action--primary[b-3632xmk42w] { background-color: var(--color-primary); color: white; box-shadow: 0 4px 14px 0 rgba(29, 78, 216, 0.3); }
.btn-action--primary:hover[b-3632xmk42w] { background-color: var(--color-primary-hover); }

/* Alert Message */
.alert-message[b-3632xmk42w] { display: flex; align-items: center; gap: 0.75rem; padding: 1rem 1.25rem; border-radius: var(--border-radius-lg); font-size: var(--font-size-sm); }
.alert-message .material-icons[b-3632xmk42w] { font-size: 20px; }
.alert-message--success[b-3632xmk42w] { background-color: var(--color-success-bg); color: var(--color-success); border: 1px solid rgba(16, 185, 129, 0.2); }
.alert-message--error[b-3632xmk42w] { background-color: var(--color-danger-bg); color: var(--color-danger); border: 1px solid rgba(239, 68, 68, 0.2); }
.alert-message__close[b-3632xmk42w] { margin-left: auto; background: none; border: none; cursor: pointer; padding: 0.25rem; display: flex; color: inherit; opacity: 0.7; }
.alert-message__close:hover[b-3632xmk42w] { opacity: 1; }

/* Stats Grid */
.stats-grid[b-3632xmk42w] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 1rem; }
.stat-card[b-3632xmk42w] { display: flex; align-items: center; gap: 1rem; padding: 1.25rem; background-color: var(--bg-card); border: 1px solid var(--border-color); border-radius: var(--border-radius-xl); border-left: 4px solid; }
.stat-card--primary[b-3632xmk42w] { border-left-color: var(--color-primary); }
.stat-card--warning[b-3632xmk42w] { border-left-color: var(--color-warning); }
.stat-card--success[b-3632xmk42w] { border-left-color: var(--color-success); }
.stat-card--danger[b-3632xmk42w] { border-left-color: var(--color-danger); }
.stat-card__icon[b-3632xmk42w] { display: flex; align-items: center; justify-content: center; width: 48px; height: 48px; border-radius: var(--border-radius-lg); }
.stat-card--primary .stat-card__icon[b-3632xmk42w] { background-color: var(--color-primary-bg); color: var(--color-primary); }
.stat-card--warning .stat-card__icon[b-3632xmk42w] { background-color: var(--color-warning-bg); color: var(--color-warning); }
.stat-card--success .stat-card__icon[b-3632xmk42w] { background-color: var(--color-success-bg); color: var(--color-success); }
.stat-card--danger .stat-card__icon[b-3632xmk42w] { background-color: var(--color-danger-bg); color: var(--color-danger); }
.stat-card__icon .material-icons[b-3632xmk42w] { font-size: 24px; }
.stat-card__content[b-3632xmk42w] { display: flex; flex-direction: column; gap: 0.125rem; }
.stat-card__value[b-3632xmk42w] { font-size: var(--font-size-2xl); font-weight: 700; color: var(--text-primary); display: flex; align-items: center; gap: 0.5rem; }
.stat-card__label[b-3632xmk42w] { font-size: var(--font-size-sm); color: var(--text-secondary); }
.pending-alert[b-3632xmk42w] { display: inline-flex; align-items: center; justify-content: center; width: 20px; height: 20px; background-color: var(--color-warning); color: white; font-size: 12px; font-weight: 700; border-radius: 50%; }

/* Filter Card */
.filter-card[b-3632xmk42w] { background-color: var(--bg-card); border: 1px solid var(--border-color); border-radius: var(--border-radius-xl); overflow: hidden; }
.filter-card__header[b-3632xmk42w] { display: flex; align-items: center; gap: 0.5rem; padding: 0.875rem 1.25rem; background-color: var(--bg-hover); font-size: var(--font-size-sm); font-weight: 500; color: var(--text-secondary); border-bottom: 1px solid var(--border-color); }
.filter-card__header .material-icons[b-3632xmk42w] { font-size: 18px; }
.filter-card__body[b-3632xmk42w] { padding: 1.25rem; }
.filter-grid[b-3632xmk42w] { display: grid; gap: 1rem; }
.filter-grid--6col[b-3632xmk42w] { grid-template-columns: repeat(6, 1fr); }
.filter-group[b-3632xmk42w] { display: flex; flex-direction: column; gap: 0.375rem; }
.filter-group--actions[b-3632xmk42w] { display: flex; flex-direction: row; align-items: flex-end; gap: 0.5rem; }
.filter-label[b-3632xmk42w] { font-size: var(--font-size-xs); font-weight: 500; color: var(--text-secondary); }
.filter-input[b-3632xmk42w], .filter-select[b-3632xmk42w] { width: 100%; padding: 0.5rem 0.75rem; font-size: var(--font-size-sm); border: 1px solid var(--border-color); border-radius: var(--border-radius); background-color: var(--bg-card); color: var(--text-primary); }
.filter-input:focus[b-3632xmk42w], .filter-select:focus[b-3632xmk42w] { outline: none; border-color: var(--color-primary); }
.btn-filter[b-3632xmk42w] { display: flex; align-items: center; justify-content: center; width: 40px; height: 38px; border: 1px solid var(--border-color); border-radius: var(--border-radius); cursor: pointer; transition: all var(--transition-fast); }
.btn-filter .material-icons[b-3632xmk42w] { font-size: 18px; }
.btn-filter--primary[b-3632xmk42w] { background-color: var(--color-primary); color: white; border-color: var(--color-primary); }
.btn-filter--primary:hover[b-3632xmk42w] { background-color: var(--color-primary-hover); }
.btn-filter--secondary[b-3632xmk42w] { background-color: var(--bg-card); color: var(--text-secondary); }
.btn-filter--secondary:hover[b-3632xmk42w] { background-color: var(--bg-hover); }

/* States */
.loading-state[b-3632xmk42w], .empty-state[b-3632xmk42w] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 4rem 2rem; gap: 1rem; background-color: var(--bg-card); border: 1px solid var(--border-color); border-radius: var(--border-radius-xl); color: var(--text-secondary); }
.loading-state .spinner-border[b-3632xmk42w] { width: 3rem; height: 3rem; }
.empty-state .material-icons[b-3632xmk42w] { font-size: 48px; color: var(--text-muted); }

/* Table Card */
.table-card[b-3632xmk42w] { background-color: var(--bg-card); border: 1px solid var(--border-color); border-radius: var(--border-radius-xl); overflow: hidden; }
.table-responsive[b-3632xmk42w] { overflow-x: auto; }
.data-table[b-3632xmk42w] { width: 100%; border-collapse: collapse; }
.data-table thead[b-3632xmk42w] { background-color: var(--bg-hover); }
.data-table th[b-3632xmk42w] { padding: 0.875rem 1rem; font-size: var(--font-size-xs); font-weight: 600; text-transform: uppercase; letter-spacing: 0.05em; color: var(--text-secondary); text-align: left; border-bottom: 1px solid var(--border-color); }
.data-table td[b-3632xmk42w] { padding: 1rem; font-size: var(--font-size-sm); color: var(--text-primary); border-bottom: 1px solid var(--border-color); vertical-align: middle; }
.data-table tbody tr[b-3632xmk42w] { transition: background-color var(--transition-fast); }
.data-table tbody tr:hover[b-3632xmk42w] { background-color: var(--bg-hover); }
.data-table tbody tr:last-child td[b-3632xmk42w] { border-bottom: none; }

/* Table Cells */
.empleado-cell[b-3632xmk42w] { display: flex; flex-direction: column; gap: 0.125rem; }
.empleado-nombre[b-3632xmk42w] { font-weight: 500; color: var(--text-primary); }
.empleado-legajo[b-3632xmk42w] { font-size: var(--font-size-xs); color: var(--text-muted); }
.periodo-cell[b-3632xmk42w] { display: flex; flex-direction: column; gap: 0.125rem; }
.periodo-fechas[b-3632xmk42w] { font-size: var(--font-size-sm); color: var(--text-primary); }
.solicitada-cell[b-3632xmk42w] { display: flex; flex-direction: column; gap: 0.125rem; }
.solicitada-por[b-3632xmk42w] { font-size: var(--font-size-sm); color: var(--text-primary); }
.solicitada-fecha[b-3632xmk42w] { font-size: var(--font-size-xs); color: var(--text-muted); }

/* Badges */
.tipo-badge[b-3632xmk42w] { display: inline-block; padding: 0.25rem 0.625rem; font-size: var(--font-size-xs); font-weight: 500; border-radius: 9999px; }
.tipo-badge--vacaciones[b-3632xmk42w] { background-color: rgba(6, 182, 212, 0.15); color: var(--color-cyan); }
.tipo-badge--medica[b-3632xmk42w] { background-color: var(--color-warning-bg); color: var(--color-warning); }
.tipo-badge--personal[b-3632xmk42w] { background-color: var(--bg-hover); color: var(--text-secondary); }
.tipo-badge--otros[b-3632xmk42w] { background-color: var(--bg-hover); color: var(--text-muted); }
.estado-badge[b-3632xmk42w] { display: inline-block; padding: 0.25rem 0.75rem; font-size: var(--font-size-xs); font-weight: 500; border-radius: 9999px; }
.estado-badge--pendiente[b-3632xmk42w] { background-color: var(--color-warning-bg); color: var(--color-warning); }
.estado-badge--aprobada[b-3632xmk42w] { background-color: var(--color-success-bg); color: var(--color-success); }
.estado-badge--rechazada[b-3632xmk42w] { background-color: var(--color-danger-bg); color: var(--color-danger); }
.dias-badge[b-3632xmk42w] { display: inline-flex; align-items: center; justify-content: center; min-width: 28px; height: 28px; padding: 0 0.5rem; background-color: var(--color-primary-bg); color: var(--color-primary); font-size: var(--font-size-sm); font-weight: 600; border-radius: 9999px; }

/* Action Buttons */
.action-buttons[b-3632xmk42w] { display: flex; justify-content: center; gap: 0.375rem; flex-wrap: wrap; }
.action-btn[b-3632xmk42w] { display: flex; align-items: center; justify-content: center; width: 32px; height: 32px; border: 1px solid var(--border-color); border-radius: var(--border-radius); background-color: transparent; cursor: pointer; transition: all var(--transition-fast); }
.action-btn .material-icons[b-3632xmk42w] { font-size: 16px; }
.action-btn--view[b-3632xmk42w] { color: var(--color-primary); }
.action-btn--view:hover[b-3632xmk42w] { background-color: var(--color-primary-bg); border-color: var(--color-primary); }
.action-btn--edit[b-3632xmk42w] { color: var(--color-warning); }
.action-btn--edit:hover[b-3632xmk42w] { background-color: var(--color-warning-bg); border-color: var(--color-warning); }
.action-btn--approve[b-3632xmk42w] { color: var(--color-success); }
.action-btn--approve:hover[b-3632xmk42w] { background-color: var(--color-success-bg); border-color: var(--color-success); }
.action-btn--reject[b-3632xmk42w] { color: var(--color-danger); }
.action-btn--reject:hover[b-3632xmk42w] { background-color: var(--color-danger-bg); border-color: var(--color-danger); }

/* Table Footer */
.table-footer[b-3632xmk42w] { display: flex; justify-content: space-between; align-items: center; padding: 1rem 1.25rem; border-top: 1px solid var(--border-color); background-color: var(--bg-hover); }
.table-footer__count[b-3632xmk42w] { font-size: var(--font-size-sm); color: var(--text-secondary); }
.table-footer__count strong[b-3632xmk42w] { color: var(--text-primary); }

/* Modal */
.modal-overlay[b-3632xmk42w] { position: fixed; inset: 0; background-color: rgba(0, 0, 0, 0.5); display: flex; align-items: center; justify-content: center; padding: 1rem; z-index: 1050; backdrop-filter: blur(4px); }
.modal-container[b-3632xmk42w] { background-color: var(--bg-card); border-radius: var(--border-radius-xl); width: 100%; max-width: 480px; max-height: 90vh; overflow: hidden; box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.25); }
.modal-container--lg[b-3632xmk42w] { max-width: 640px; }
.modal-header[b-3632xmk42w] { display: flex; align-items: center; justify-content: space-between; padding: 1.25rem 1.5rem; border-bottom: 1px solid var(--border-color); }
.modal-header--success[b-3632xmk42w] { background-color: var(--color-success-bg); }
.modal-header--danger[b-3632xmk42w] { background-color: var(--color-danger-bg); }
.modal-title[b-3632xmk42w] { display: flex; align-items: center; gap: 0.5rem; margin: 0; font-size: var(--font-size-lg); font-weight: 600; color: var(--text-primary); }
.modal-title .material-icons[b-3632xmk42w] { font-size: 24px; color: var(--color-primary); }
.modal-header--success .modal-title .material-icons[b-3632xmk42w] { color: var(--color-success); }
.modal-header--danger .modal-title .material-icons[b-3632xmk42w] { color: var(--color-danger); }
.modal-close[b-3632xmk42w] { display: flex; align-items: center; justify-content: center; width: 36px; height: 36px; border: none; border-radius: var(--border-radius); background-color: transparent; color: var(--text-secondary); cursor: pointer; transition: all var(--transition-fast); }
.modal-close:hover[b-3632xmk42w] { background-color: var(--bg-hover); color: var(--text-primary); }
.modal-body[b-3632xmk42w] { padding: 1.5rem; overflow-y: auto; max-height: 60vh; }
.modal-footer[b-3632xmk42w] { display: flex; justify-content: flex-end; gap: 0.75rem; padding: 1.25rem 1.5rem; border-top: 1px solid var(--border-color); background-color: var(--bg-hover); }

/* Form Styles */
.form-group[b-3632xmk42w] { margin-bottom: 1.25rem; }
.form-group:last-child[b-3632xmk42w] { margin-bottom: 0; }
.form-row[b-3632xmk42w] { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; }
.form-label[b-3632xmk42w] { display: block; margin-bottom: 0.375rem; font-size: var(--font-size-sm); font-weight: 500; color: var(--text-primary); }
.form-label .required[b-3632xmk42w] { color: var(--color-danger); }
.form-input[b-3632xmk42w] { width: 100%; padding: 0.625rem 0.875rem; font-size: var(--font-size-sm); border: 1px solid var(--border-color); border-radius: var(--border-radius); background-color: var(--bg-card); color: var(--text-primary); }
.form-input:focus[b-3632xmk42w] { outline: none; border-color: var(--color-primary); box-shadow: 0 0 0 3px rgba(29, 78, 216, 0.1); }
.form-input:disabled[b-3632xmk42w] { background-color: var(--bg-hover); cursor: not-allowed; }
.form-textarea[b-3632xmk42w] { resize: vertical; min-height: 80px; }
.dias-info[b-3632xmk42w] { display: flex; align-items: center; gap: 0.5rem; padding: 0.75rem 1rem; background-color: var(--color-primary-bg); color: var(--color-primary); border-radius: var(--border-radius); font-size: var(--font-size-sm); margin-bottom: 1.25rem; }
.dias-info .material-icons[b-3632xmk42w] { font-size: 18px; }

/* Modal Buttons */
.btn-modal[b-3632xmk42w] { display: inline-flex; align-items: center; justify-content: center; gap: 0.5rem; padding: 0.625rem 1.25rem; font-size: var(--font-size-sm); font-weight: 500; border: none; border-radius: var(--border-radius); cursor: pointer; transition: all var(--transition-fast); }
.btn-modal:disabled[b-3632xmk42w] { opacity: 0.6; cursor: not-allowed; }
.btn-modal--primary[b-3632xmk42w] { background-color: var(--color-primary); color: white; }
.btn-modal--primary:hover:not(:disabled)[b-3632xmk42w] { background-color: var(--color-primary-hover); }
.btn-modal--secondary[b-3632xmk42w] { background-color: var(--bg-hover); color: var(--text-primary); border: 1px solid var(--border-color); }
.btn-modal--secondary:hover[b-3632xmk42w] { background-color: var(--border-color); }
.btn-modal--success[b-3632xmk42w] { background-color: var(--color-success); color: white; }
.btn-modal--success:hover:not(:disabled)[b-3632xmk42w] { filter: brightness(0.9); }
.btn-modal--danger[b-3632xmk42w] { background-color: var(--color-danger); color: white; }
.btn-modal--danger:hover:not(:disabled)[b-3632xmk42w] { filter: brightness(0.9); }

/* Detail Modal */
.detail-section[b-3632xmk42w] { margin-bottom: 1.5rem; }
.detail-section:last-child[b-3632xmk42w] { margin-bottom: 0; }
.section-title[b-3632xmk42w] { display: flex; align-items: center; gap: 0.5rem; margin: 0 0 0.75rem 0; padding-bottom: 0.5rem; font-size: var(--font-size-sm); font-weight: 600; color: var(--text-secondary); border-bottom: 1px solid var(--border-color); }
.detail-grid[b-3632xmk42w] { display: grid; grid-template-columns: repeat(2, 1fr); gap: 1rem; }
.detail-grid--3col[b-3632xmk42w] { grid-template-columns: repeat(3, 1fr); }
.detail-item[b-3632xmk42w] { display: flex; flex-direction: column; gap: 0.25rem; }
.detail-label[b-3632xmk42w] { font-size: var(--font-size-xs); color: var(--text-muted); text-transform: uppercase; letter-spacing: 0.05em; }
.detail-value[b-3632xmk42w] { font-size: var(--font-size-sm); color: var(--text-primary); }
.detail-sub[b-3632xmk42w] { font-size: var(--font-size-xs); color: var(--text-secondary); }
.detail-text[b-3632xmk42w] { margin: 0; font-size: var(--font-size-sm); color: var(--text-primary); line-height: 1.5; }

/* Confirm Modal */
.confirm-summary[b-3632xmk42w] { text-align: center; padding: 1rem; background-color: var(--bg-hover); border-radius: var(--border-radius-lg); margin-bottom: 1rem; }
.confirm-summary p[b-3632xmk42w] { margin: 0 0 0.25rem 0; }
.confirm-details[b-3632xmk42w] { display: flex; align-items: center; justify-content: center; gap: 0.75rem; margin-top: 0.75rem; flex-wrap: wrap; }
.confirm-periodo[b-3632xmk42w] { font-size: var(--font-size-sm); color: var(--text-secondary); }
.confirm-alert[b-3632xmk42w] { display: flex; align-items: center; justify-content: center; gap: 0.5rem; padding: 1rem; border-radius: var(--border-radius); font-size: var(--font-size-sm); }
.confirm-alert .material-icons[b-3632xmk42w] { font-size: 20px; }
.confirm-alert--warning[b-3632xmk42w] { background-color: var(--color-warning-bg); color: var(--color-warning); }

/* File Upload */
.file-upload-area[b-3632xmk42w] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    padding: 2rem 1rem;
    border: 2px dashed var(--border-color);
    border-radius: var(--border-radius-lg);
    background-color: var(--bg-hover);
    cursor: pointer;
    transition: all var(--transition-fast);
}
.file-upload-area:hover[b-3632xmk42w] {
    border-color: var(--color-primary);
    background-color: var(--color-primary-bg);
}
.file-upload-area .material-icons[b-3632xmk42w] {
    font-size: 36px;
    color: var(--text-muted);
}
.file-upload-area:hover .material-icons[b-3632xmk42w] {
    color: var(--color-primary);
}
.file-upload-area[b-3632xmk42w]  input[type="file"] {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    border: 0;
}
.file-upload-text[b-3632xmk42w] {
    font-size: var(--font-size-sm);
    font-weight: 500;
    color: var(--text-secondary);
}
.file-upload-hint[b-3632xmk42w] {
    font-size: var(--font-size-xs);
    color: var(--text-muted);
}

/* File Preview */
.file-preview[b-3632xmk42w] {
    display: flex;
    align-items: center;
    gap: 1rem;
    padding: 0.75rem 1rem;
    border: 1px solid var(--border-color);
    border-radius: var(--border-radius-lg);
    background-color: var(--bg-hover);
}
.file-preview__image[b-3632xmk42w] {
    width: 64px;
    height: 64px;
    object-fit: cover;
    border-radius: var(--border-radius);
    border: 1px solid var(--border-color);
}
.file-preview__pdf[b-3632xmk42w] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 64px;
    height: 64px;
    background-color: var(--color-danger-bg);
    border-radius: var(--border-radius);
}
.file-preview__pdf .material-icons[b-3632xmk42w] {
    font-size: 32px;
    color: var(--color-danger);
}
.file-preview__info[b-3632xmk42w] {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 0.125rem;
    min-width: 0;
}
.file-preview__name[b-3632xmk42w] {
    font-size: var(--font-size-sm);
    font-weight: 500;
    color: var(--text-primary);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.file-preview__size[b-3632xmk42w] {
    font-size: var(--font-size-xs);
    color: var(--text-muted);
}
.file-preview__remove[b-3632xmk42w] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    border: 1px solid var(--border-color);
    border-radius: var(--border-radius);
    background-color: transparent;
    color: var(--color-danger);
    cursor: pointer;
    transition: all var(--transition-fast);
    flex-shrink: 0;
}
.file-preview__remove:hover[b-3632xmk42w] {
    background-color: var(--color-danger-bg);
    border-color: var(--color-danger);
}
.file-preview__remove .material-icons[b-3632xmk42w] {
    font-size: 18px;
}

/* Field Error */
.field-error[b-3632xmk42w] {
    display: block;
    margin-top: 0.375rem;
    font-size: var(--font-size-xs);
    color: var(--color-danger);
}

/* Detail Document */
.detail-doc-image[b-3632xmk42w] {
    max-width: 100%;
    max-height: 300px;
    border-radius: var(--border-radius);
    border: 1px solid var(--border-color);
}
.detail-doc-link[b-3632xmk42w] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.75rem 1.25rem;
    background-color: var(--color-danger-bg);
    color: var(--color-danger);
    border-radius: var(--border-radius);
    font-size: var(--font-size-sm);
    font-weight: 500;
    text-decoration: none;
    transition: all var(--transition-fast);
}
.detail-doc-link:hover[b-3632xmk42w] {
    filter: brightness(0.9);
}
.detail-doc-link .material-icons[b-3632xmk42w] {
    font-size: 20px;
}

/* Responsive */
@media (max-width: 1200px) { .filter-grid--6col[b-3632xmk42w] { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 1024px) { .stats-grid[b-3632xmk42w] { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 768px) {
    .page-header[b-3632xmk42w] { flex-direction: column; align-items: flex-start; }
    .page-header__actions[b-3632xmk42w] { width: 100%; }
    .btn-action[b-3632xmk42w] { flex: 1; justify-content: center; }
    .stats-grid[b-3632xmk42w] { grid-template-columns: 1fr; }
    .filter-grid--6col[b-3632xmk42w] { grid-template-columns: 1fr; }
    .form-row[b-3632xmk42w] { grid-template-columns: 1fr; }
    .detail-grid[b-3632xmk42w], .detail-grid--3col[b-3632xmk42w] { grid-template-columns: 1fr; }
    .data-table th:nth-child(3)[b-3632xmk42w], .data-table td:nth-child(3)[b-3632xmk42w], .data-table th:nth-child(6)[b-3632xmk42w], .data-table td:nth-child(6)[b-3632xmk42w] { display: none; }
}

/* Dark Mode */
[data-theme="dark"] .stat-card[b-3632xmk42w], [data-theme="dark"] .filter-card[b-3632xmk42w], [data-theme="dark"] .table-card[b-3632xmk42w], [data-theme="dark"] .loading-state[b-3632xmk42w], [data-theme="dark"] .empty-state[b-3632xmk42w], [data-theme="dark"] .modal-container[b-3632xmk42w] { background-color: var(--bg-card); border-color: var(--border-color); }
[data-theme="dark"] .filter-card__header[b-3632xmk42w], [data-theme="dark"] .data-table thead[b-3632xmk42w], [data-theme="dark"] .table-footer[b-3632xmk42w], [data-theme="dark"] .modal-footer[b-3632xmk42w] { background-color: rgba(255, 255, 255, 0.05); }
[data-theme="dark"] .confirm-summary[b-3632xmk42w] { background-color: rgba(255, 255, 255, 0.05); }
/* _content/Geniar.Asistencias.Web/Pages/Admin/Branding.razor.rz.scp.css */
/* ============================================
   BRANDING PAGE STYLES
   ============================================ */

.admin-page[b-ywrvic9bfy] { display: flex; flex-direction: column; gap: 1.5rem; }

/* Page Header */
.page-header[b-ywrvic9bfy] { display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 1rem; }
.page-header__info[b-ywrvic9bfy] { flex: 1; }
.page-header__title[b-ywrvic9bfy] { margin: 0 0 0.25rem 0; font-size: var(--font-size-3xl); font-weight: 700; color: var(--text-primary); }
.page-header__subtitle[b-ywrvic9bfy] { margin: 0; font-size: var(--font-size-base); color: var(--text-secondary); }

/* Alert */
.alert-message[b-ywrvic9bfy] { display: flex; align-items: center; gap: 0.75rem; padding: 1rem 1.25rem; border-radius: var(--border-radius-lg); font-size: var(--font-size-sm); }
.alert-message .material-icons[b-ywrvic9bfy] { font-size: 20px; }
.alert-message--success[b-ywrvic9bfy] { background-color: var(--color-success-bg); color: var(--color-success); border: 1px solid rgba(16, 185, 129, 0.2); }
.alert-message--error[b-ywrvic9bfy] { background-color: var(--color-danger-bg); color: var(--color-danger); border: 1px solid rgba(239, 68, 68, 0.2); }
.alert-message__close[b-ywrvic9bfy] { margin-left: auto; background: none; border: none; cursor: pointer; padding: 0.25rem; display: flex; color: inherit; opacity: 0.7; }
.alert-message__close:hover[b-ywrvic9bfy] { opacity: 1; }

/* Loading State */
.loading-state[b-ywrvic9bfy] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 4rem 2rem; gap: 1rem; background-color: var(--bg-card); border: 1px solid var(--border-color); border-radius: var(--border-radius-xl); color: var(--text-secondary); }
.loading-state .spinner-border[b-ywrvic9bfy] { width: 3rem; height: 3rem; }

/* Branding Grid */
.branding-grid[b-ywrvic9bfy] { display: grid; grid-template-columns: repeat(2, 1fr); gap: 1.5rem; }

/* Branding Card */
.branding-card[b-ywrvic9bfy] { background-color: var(--bg-card); border: 1px solid var(--border-color); border-radius: var(--border-radius-xl); overflow: hidden; }
.branding-card__header[b-ywrvic9bfy] { display: flex; align-items: center; gap: 0.5rem; padding: 1rem 1.5rem; background-color: var(--bg-hover); font-size: var(--font-size-base); font-weight: 600; color: var(--text-primary); border-bottom: 1px solid var(--border-color); }
.branding-card__header .material-icons[b-ywrvic9bfy] { font-size: 20px; color: var(--color-primary); }
.branding-card__body[b-ywrvic9bfy] { padding: 1.5rem; }

/* Form Styles */
.form-group[b-ywrvic9bfy] { margin-bottom: 1rem; }
.form-group:last-child[b-ywrvic9bfy] { margin-bottom: 0; }
.form-label[b-ywrvic9bfy] { display: block; margin-bottom: 0.5rem; font-size: var(--font-size-sm); font-weight: 500; color: var(--text-primary); }
.form-input[b-ywrvic9bfy] { width: 100%; padding: 0.625rem 0.875rem; font-size: var(--font-size-sm); border: 1px solid var(--border-color); border-radius: var(--border-radius); background-color: var(--bg-card); color: var(--text-primary); }
.form-input:focus[b-ywrvic9bfy] { outline: none; border-color: var(--color-primary); box-shadow: 0 0 0 3px rgba(29, 78, 216, 0.1); }
.form-hint[b-ywrvic9bfy] { display: block; margin-top: 0.25rem; font-size: var(--font-size-xs); color: var(--text-muted); }

/* Color Input Group */
.color-input-group[b-ywrvic9bfy] { display: flex; gap: 0.5rem; }
.color-picker[b-ywrvic9bfy] { width: 50px; height: 42px; padding: 0.25rem; border: 1px solid var(--border-color); border-radius: var(--border-radius); background-color: var(--bg-card); cursor: pointer; }
.color-picker[b-ywrvic9bfy]::-webkit-color-swatch-wrapper { padding: 0; }
.color-picker[b-ywrvic9bfy]::-webkit-color-swatch { border: none; border-radius: 4px; }
.color-input-group .form-input[b-ywrvic9bfy] { flex: 1; font-family: monospace; }

/* Branding Button */
.btn-branding[b-ywrvic9bfy] { display: inline-flex; align-items: center; justify-content: center; gap: 0.5rem; padding: 0.625rem 1.25rem; font-size: var(--font-size-sm); font-weight: 500; border: none; border-radius: var(--border-radius); cursor: pointer; transition: all var(--transition-fast); margin-top: 0.5rem; }
.btn-branding .material-icons[b-ywrvic9bfy] { font-size: 18px; }
.btn-branding:disabled[b-ywrvic9bfy] { opacity: 0.6; cursor: not-allowed; }
.btn-branding--primary[b-ywrvic9bfy] { background-color: var(--color-primary); color: white; }
.btn-branding--primary:hover:not(:disabled)[b-ywrvic9bfy] { background-color: var(--color-primary-hover); }

/* File Upload */
.file-upload[b-ywrvic9bfy] { position: relative; margin-bottom: 0.5rem; }
.file-upload__input[b-ywrvic9bfy] { position: absolute; inset: 0; opacity: 0; cursor: pointer; z-index: 10; }
.file-upload__zone[b-ywrvic9bfy] { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 0.5rem; padding: 2rem 1rem; border: 2px dashed var(--border-color); border-radius: var(--border-radius-lg); background-color: var(--bg-hover); transition: all var(--transition-fast); }
.file-upload__zone .material-icons[b-ywrvic9bfy] { font-size: 32px; color: var(--text-muted); }
.file-upload__zone span[b-ywrvic9bfy] { font-size: var(--font-size-sm); color: var(--text-secondary); }
.file-upload:hover .file-upload__zone[b-ywrvic9bfy] { border-color: var(--color-primary); background-color: var(--color-primary-bg); }
.file-upload:hover .file-upload__zone .material-icons[b-ywrvic9bfy] { color: var(--color-primary); }

/* Image Preview */
.image-preview[b-ywrvic9bfy] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; padding: 1rem; margin-bottom: 1rem; background-color: var(--bg-hover); border-radius: var(--border-radius-lg); }
.image-preview img[b-ywrvic9bfy] { max-height: 150px; max-width: 100%; object-fit: contain; border-radius: var(--border-radius); border: 1px solid var(--border-color); background-color: white; }
.image-preview--small img[b-ywrvic9bfy] { max-height: 80px; }
.image-preview--new[b-ywrvic9bfy] { background-color: var(--color-primary-bg); border: 1px dashed var(--color-primary); }
.image-preview__label[b-ywrvic9bfy] { font-size: var(--font-size-xs); color: var(--text-muted); }
.image-preview--new .image-preview__label[b-ywrvic9bfy] { color: var(--color-primary); }

/* Responsive */
@media (max-width: 1024px) {
    .branding-grid[b-ywrvic9bfy] { grid-template-columns: 1fr; }
}

/* Dark Mode */
[data-theme="dark"] .branding-card[b-ywrvic9bfy], [data-theme="dark"] .loading-state[b-ywrvic9bfy] { background-color: var(--bg-card); border-color: var(--border-color); }
[data-theme="dark"] .branding-card__header[b-ywrvic9bfy] { background-color: rgba(255, 255, 255, 0.05); }
[data-theme="dark"] .file-upload__zone[b-ywrvic9bfy], [data-theme="dark"] .image-preview[b-ywrvic9bfy] { background-color: rgba(255, 255, 255, 0.05); }
[data-theme="dark"] .color-picker[b-ywrvic9bfy] { background-color: var(--bg-card); }
[data-theme="dark"] .image-preview img[b-ywrvic9bfy] { background-color: var(--bg-card); }
/* _content/Geniar.Asistencias.Web/Pages/Admin/Configuracion.razor.rz.scp.css */
/* ============================================
   CONFIGURACION PAGE STYLES
   ============================================ */

.admin-page[b-4uqu68dr4j] { display: flex; flex-direction: column; gap: 1.5rem; }

/* Page Header */
.page-header[b-4uqu68dr4j] { display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 1rem; }
.page-header__info[b-4uqu68dr4j] { flex: 1; }
.page-header__title[b-4uqu68dr4j] { margin: 0 0 0.25rem 0; font-size: var(--font-size-3xl); font-weight: 700; color: var(--text-primary); }
.page-header__subtitle[b-4uqu68dr4j] { margin: 0; font-size: var(--font-size-base); color: var(--text-secondary); }
.page-header__actions[b-4uqu68dr4j] { display: flex; gap: 0.75rem; }

/* Buttons */
.btn-action[b-4uqu68dr4j] { display: inline-flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1.25rem; font-size: var(--font-size-sm); font-weight: 500; border: none; border-radius: var(--border-radius); cursor: pointer; transition: all var(--transition-fast); }
.btn-action .material-icons[b-4uqu68dr4j] { font-size: 20px; }
.btn-action:disabled[b-4uqu68dr4j] { opacity: 0.6; cursor: not-allowed; }
.btn-action--primary[b-4uqu68dr4j] { background-color: var(--color-primary); color: white; box-shadow: 0 4px 14px 0 rgba(29, 78, 216, 0.3); }
.btn-action--primary:hover:not(:disabled)[b-4uqu68dr4j] { background-color: var(--color-primary-hover); }

/* Alert */
.alert-message[b-4uqu68dr4j] { display: flex; align-items: center; gap: 0.75rem; padding: 1rem 1.25rem; border-radius: var(--border-radius-lg); font-size: var(--font-size-sm); }
.alert-message .material-icons[b-4uqu68dr4j] { font-size: 20px; }
.alert-message--success[b-4uqu68dr4j] { background-color: var(--color-success-bg); color: var(--color-success); border: 1px solid rgba(16, 185, 129, 0.2); }
.alert-message--error[b-4uqu68dr4j] { background-color: var(--color-danger-bg); color: var(--color-danger); border: 1px solid rgba(239, 68, 68, 0.2); }
.alert-message__close[b-4uqu68dr4j] { margin-left: auto; background: none; border: none; cursor: pointer; padding: 0.25rem; display: flex; color: inherit; opacity: 0.7; }
.alert-message__close:hover[b-4uqu68dr4j] { opacity: 1; }

/* Loading State */
.loading-state[b-4uqu68dr4j] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 4rem 2rem; gap: 1rem; background-color: var(--bg-card); border: 1px solid var(--border-color); border-radius: var(--border-radius-xl); color: var(--text-secondary); }
.loading-state .spinner-border[b-4uqu68dr4j] { width: 3rem; height: 3rem; }

/* Config Layout */
.config-layout[b-4uqu68dr4j] { display: grid; grid-template-columns: 280px 1fr; gap: 1.5rem; }

/* Config Menu */
.config-menu[b-4uqu68dr4j] { display: flex; flex-direction: column; gap: 0.25rem; background-color: var(--bg-card); border: 1px solid var(--border-color); border-radius: var(--border-radius-xl); padding: 0.5rem; position: sticky; top: 1rem; align-self: flex-start; }
.config-menu__item[b-4uqu68dr4j] { display: flex; align-items: center; gap: 0.75rem; padding: 0.75rem 1rem; border: none; border-radius: var(--border-radius); background-color: transparent; text-align: left; cursor: pointer; transition: all var(--transition-fast); font-size: var(--font-size-sm); color: var(--text-secondary); }
.config-menu__item .material-icons[b-4uqu68dr4j] { font-size: 20px; }
.config-menu__item:hover[b-4uqu68dr4j] { background-color: var(--bg-hover); color: var(--text-primary); }
.config-menu__item--active[b-4uqu68dr4j] { background-color: var(--color-primary-bg); color: var(--color-primary); font-weight: 500; }
.config-menu__item--active .material-icons[b-4uqu68dr4j] { color: var(--color-primary); }
.config-menu__badge[b-4uqu68dr4j] { display: inline-flex; align-items: center; justify-content: center; width: 20px; height: 20px; margin-left: auto; background-color: var(--color-warning); color: white; font-size: 12px; font-weight: 700; border-radius: 50%; }

/* Config Panel */
.config-panel[b-4uqu68dr4j] { flex: 1; min-width: 0; }
.config-card[b-4uqu68dr4j] { background-color: var(--bg-card); border: 1px solid var(--border-color); border-radius: var(--border-radius-xl); overflow: hidden; }
.config-card__header[b-4uqu68dr4j] { display: flex; align-items: center; gap: 0.5rem; padding: 1rem 1.5rem; background-color: var(--bg-hover); font-size: var(--font-size-base); font-weight: 600; color: var(--text-primary); border-bottom: 1px solid var(--border-color); }
.config-card__header .material-icons[b-4uqu68dr4j] { font-size: 20px; color: var(--color-primary); }
.config-card__body[b-4uqu68dr4j] { padding: 1.5rem; }

/* Config Item */
.config-item[b-4uqu68dr4j] { padding: 1rem 0; border-bottom: 1px solid var(--border-color); }
.config-item:last-child[b-4uqu68dr4j] { border-bottom: none; padding-bottom: 0; }
.config-item:first-child[b-4uqu68dr4j] { padding-top: 0; }
.config-item__header[b-4uqu68dr4j] { margin-bottom: 0.75rem; }
.config-item__label[b-4uqu68dr4j] { display: flex; align-items: center; gap: 0.5rem; font-size: var(--font-size-sm); font-weight: 500; color: var(--text-primary); margin-bottom: 0.25rem; }
.config-item__description[b-4uqu68dr4j] { display: block; font-size: var(--font-size-xs); color: var(--text-muted); }
.config-item__input[b-4uqu68dr4j] { margin-bottom: 0.5rem; }
.config-item__meta[b-4uqu68dr4j] { display: flex; align-items: center; gap: 0.75rem; }
.meta-tag[b-4uqu68dr4j] { display: inline-block; padding: 0.125rem 0.5rem; font-size: 10px; font-weight: 500; background-color: var(--bg-hover); color: var(--text-secondary); border-radius: var(--border-radius); }
.meta-date[b-4uqu68dr4j] { font-size: var(--font-size-xs); color: var(--text-muted); }
.modified-badge[b-4uqu68dr4j] { display: inline-block; padding: 0.125rem 0.5rem; font-size: 10px; font-weight: 500; background-color: var(--color-warning-bg); color: var(--color-warning); border-radius: var(--border-radius); margin-left: 0.5rem; }

/* Form Input */
.form-input[b-4uqu68dr4j] { width: 100%; max-width: 400px; padding: 0.5rem 0.75rem; font-size: var(--font-size-sm); border: 1px solid var(--border-color); border-radius: var(--border-radius); background-color: var(--bg-card); color: var(--text-primary); }
.form-input:focus[b-4uqu68dr4j] { outline: none; border-color: var(--color-primary); box-shadow: 0 0 0 3px rgba(29, 78, 216, 0.1); }

/* Toggle Switch */
.toggle-switch[b-4uqu68dr4j] { display: flex; align-items: center; gap: 0.75rem; cursor: pointer; }
.toggle-switch input[b-4uqu68dr4j] { display: none; }
.toggle-switch__slider[b-4uqu68dr4j] { position: relative; width: 48px; height: 26px; background-color: var(--border-color); border-radius: 13px; transition: background-color var(--transition-fast); }
.toggle-switch__slider[b-4uqu68dr4j]::before { content: ''; position: absolute; top: 3px; left: 3px; width: 20px; height: 20px; background-color: white; border-radius: 50%; transition: transform var(--transition-fast); box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2); }
.toggle-switch input:checked + .toggle-switch__slider[b-4uqu68dr4j] { background-color: var(--color-primary); }
.toggle-switch input:checked + .toggle-switch__slider[b-4uqu68dr4j]::before { transform: translateX(22px); }
.toggle-switch__label[b-4uqu68dr4j] { font-size: var(--font-size-sm); color: var(--text-secondary); }

/* Responsive */
@media (max-width: 1024px) { .config-layout[b-4uqu68dr4j] { grid-template-columns: 1fr; } .config-menu[b-4uqu68dr4j] { position: relative; top: 0; flex-direction: row; flex-wrap: wrap; } .config-menu__item[b-4uqu68dr4j] { flex: 1; min-width: 120px; justify-content: center; } }
@media (max-width: 768px) { .page-header[b-4uqu68dr4j] { flex-direction: column; align-items: flex-start; } .page-header__actions[b-4uqu68dr4j] { width: 100%; } .btn-action[b-4uqu68dr4j] { flex: 1; justify-content: center; } .form-input[b-4uqu68dr4j] { max-width: 100%; } }

/* Dark Mode */
[data-theme="dark"] .config-menu[b-4uqu68dr4j], [data-theme="dark"] .config-card[b-4uqu68dr4j], [data-theme="dark"] .loading-state[b-4uqu68dr4j] { background-color: var(--bg-card); border-color: var(--border-color); }
[data-theme="dark"] .config-card__header[b-4uqu68dr4j] { background-color: rgba(255, 255, 255, 0.05); }
[data-theme="dark"] .meta-tag[b-4uqu68dr4j] { background-color: rgba(255, 255, 255, 0.1); }
/* _content/Geniar.Asistencias.Web/Pages/Admin/RolesApp.razor.rz.scp.css */
/* ============================================
   ROLES APP PAGE STYLES
   ============================================ */

.admin-page[b-he6k5swl2j] {
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
}

/* ============================================
   PAGE HEADER
   ============================================ */

.page-header[b-he6k5swl2j] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    gap: 1rem;
}

.page-header__info[b-he6k5swl2j] {
    flex: 1;
}

.page-header__title[b-he6k5swl2j] {
    margin: 0 0 0.25rem 0;
    font-size: var(--font-size-3xl);
    font-weight: 700;
    color: var(--text-primary);
}

.page-header__subtitle[b-he6k5swl2j] {
    margin: 0;
    font-size: var(--font-size-base);
    color: var(--text-secondary);
}

.page-header__actions[b-he6k5swl2j] {
    display: flex;
    gap: 0.75rem;
}

/* Action Buttons */
.btn-action[b-he6k5swl2j] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.625rem 1.25rem;
    font-size: var(--font-size-sm);
    font-weight: 500;
    border: none;
    border-radius: var(--border-radius);
    cursor: pointer;
    transition: all var(--transition-fast);
}

.btn-action .material-icons[b-he6k5swl2j] {
    font-size: 20px;
}

.btn-action--secondary[b-he6k5swl2j] {
    background-color: var(--bg-card);
    color: var(--text-primary);
    border: 1px solid var(--border-color);
}

.btn-action--secondary:hover[b-he6k5swl2j] {
    background-color: var(--bg-hover);
}

/* ============================================
   ALERT MESSAGE
   ============================================ */

.alert-message[b-he6k5swl2j] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 1rem 1.25rem;
    border-radius: var(--border-radius-lg);
    font-size: var(--font-size-sm);
}

.alert-message .material-icons[b-he6k5swl2j] {
    font-size: 20px;
}

.alert-message--success[b-he6k5swl2j] {
    background-color: var(--color-success-bg);
    color: var(--color-success);
    border: 1px solid rgba(16, 185, 129, 0.2);
}

.alert-message--error[b-he6k5swl2j] {
    background-color: var(--color-danger-bg);
    color: var(--color-danger);
    border: 1px solid rgba(239, 68, 68, 0.2);
}

.alert-message__close[b-he6k5swl2j] {
    margin-left: auto;
    background: none;
    border: none;
    cursor: pointer;
    padding: 0.25rem;
    display: flex;
    color: inherit;
    opacity: 0.7;
}

.alert-message__close:hover[b-he6k5swl2j] {
    opacity: 1;
}

/* ============================================
   FILTER CARD
   ============================================ */

.filter-card[b-he6k5swl2j] {
    background-color: var(--bg-card);
    border: 1px solid var(--border-color);
    border-radius: var(--border-radius-xl);
    overflow: hidden;
}

.filter-card__header[b-he6k5swl2j] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.875rem 1.25rem;
    background-color: var(--bg-hover);
    font-size: var(--font-size-sm);
    font-weight: 500;
    color: var(--text-secondary);
    border-bottom: 1px solid var(--border-color);
}

.filter-card__header .material-icons[b-he6k5swl2j] {
    font-size: 18px;
}

.filter-card__body[b-he6k5swl2j] {
    padding: 1.25rem;
}

.filter-grid[b-he6k5swl2j] {
    display: grid;
    gap: 1rem;
}

.filter-grid--2col[b-he6k5swl2j] {
    grid-template-columns: 1fr auto;
}

.filter-group[b-he6k5swl2j] {
    display: flex;
    flex-direction: column;
    gap: 0.375rem;
}

.filter-group--count[b-he6k5swl2j] {
    display: flex;
    align-items: flex-end;
}

.filter-label[b-he6k5swl2j] {
    font-size: var(--font-size-xs);
    font-weight: 500;
    color: var(--text-secondary);
}

.filter-input-wrapper[b-he6k5swl2j] {
    position: relative;
}

.filter-input-icon[b-he6k5swl2j] {
    position: absolute;
    left: 0.75rem;
    top: 50%;
    transform: translateY(-50%);
    font-size: 18px;
    color: var(--text-muted);
}

.filter-input[b-he6k5swl2j] {
    width: 100%;
    padding: 0.5rem 0.75rem 0.5rem 2.5rem;
    font-size: var(--font-size-sm);
    border: 1px solid var(--border-color);
    border-radius: var(--border-radius);
    background-color: var(--bg-card);
    color: var(--text-primary);
    transition: border-color var(--transition-fast);
}

.filter-input:focus[b-he6k5swl2j] {
    outline: none;
    border-color: var(--color-primary);
    box-shadow: 0 0 0 3px rgba(29, 78, 216, 0.1);
}

.count-badge[b-he6k5swl2j] {
    display: inline-flex;
    align-items: center;
    gap: 0.375rem;
    padding: 0.5rem 1rem;
    background-color: var(--bg-hover);
    border-radius: var(--border-radius);
    font-size: var(--font-size-sm);
    color: var(--text-secondary);
}

.count-badge .material-icons[b-he6k5swl2j] {
    font-size: 18px;
    color: var(--color-primary);
}

/* ============================================
   LOADING & EMPTY STATE
   ============================================ */

.loading-state[b-he6k5swl2j],
.empty-state[b-he6k5swl2j] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 4rem 2rem;
    gap: 1rem;
    background-color: var(--bg-card);
    border: 1px solid var(--border-color);
    border-radius: var(--border-radius-xl);
    color: var(--text-secondary);
}

.loading-state .spinner-border[b-he6k5swl2j] {
    width: 3rem;
    height: 3rem;
}

.empty-state .material-icons[b-he6k5swl2j] {
    font-size: 48px;
    color: var(--text-muted);
}

/* ============================================
   TABLE CARD
   ============================================ */

.table-card[b-he6k5swl2j] {
    background-color: var(--bg-card);
    border: 1px solid var(--border-color);
    border-radius: var(--border-radius-xl);
    overflow: hidden;
}

.table-responsive[b-he6k5swl2j] {
    overflow-x: auto;
}

.data-table[b-he6k5swl2j] {
    width: 100%;
    border-collapse: collapse;
}

.data-table thead[b-he6k5swl2j] {
    background-color: var(--bg-hover);
}

.data-table th[b-he6k5swl2j] {
    padding: 0.875rem 1rem;
    font-size: var(--font-size-xs);
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: var(--text-secondary);
    text-align: left;
    border-bottom: 1px solid var(--border-color);
}

.data-table td[b-he6k5swl2j] {
    padding: 1rem;
    font-size: var(--font-size-sm);
    color: var(--text-primary);
    border-bottom: 1px solid var(--border-color);
    vertical-align: middle;
}

.data-table tbody tr[b-he6k5swl2j] {
    transition: background-color var(--transition-fast);
}

.data-table tbody tr:hover[b-he6k5swl2j] {
    background-color: var(--bg-hover);
}

.data-table tbody tr:last-child td[b-he6k5swl2j] {
    border-bottom: none;
}

/* User Cell */
.user-cell[b-he6k5swl2j] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.user-avatar[b-he6k5swl2j] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    border-radius: 50%;
    color: white;
    font-size: var(--font-size-sm);
    font-weight: 600;
    flex-shrink: 0;
}

.user-avatar--lg[b-he6k5swl2j] {
    width: 56px;
    height: 56px;
    font-size: var(--font-size-lg);
}

.user-info[b-he6k5swl2j] {
    display: flex;
    flex-direction: column;
    gap: 0.125rem;
}

.user-name[b-he6k5swl2j] {
    font-weight: 500;
    color: var(--text-primary);
}

.user-email[b-he6k5swl2j] {
    font-size: var(--font-size-xs);
    color: var(--text-muted);
}

/* Empleado Badge */
.empleado-badge[b-he6k5swl2j] {
    display: inline-flex;
    align-items: center;
    gap: 0.375rem;
    padding: 0.375rem 0.75rem;
    background-color: var(--color-cyan);
    color: white;
    font-size: var(--font-size-xs);
    font-weight: 500;
    border-radius: var(--border-radius);
}

.empleado-badge .material-icons[b-he6k5swl2j] {
    font-size: 14px;
}

/* Roles List */
.roles-list[b-he6k5swl2j] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.375rem;
}

.role-badge[b-he6k5swl2j] {
    display: inline-block;
    padding: 0.25rem 0.625rem;
    font-size: var(--font-size-xs);
    font-weight: 500;
    border-radius: 9999px;
}

.role-badge--identity[b-he6k5swl2j] {
    background-color: var(--bg-hover);
    color: var(--text-secondary);
}

/* Permisos Button */
.permisos-btn[b-he6k5swl2j] {
    display: inline-flex;
    align-items: center;
    gap: 0.375rem;
    padding: 0.375rem 0.75rem;
    background-color: var(--color-primary-bg);
    color: var(--color-primary);
    font-size: var(--font-size-sm);
    font-weight: 500;
    border: none;
    border-radius: var(--border-radius);
    cursor: pointer;
    transition: all var(--transition-fast);
}

.permisos-btn .material-icons[b-he6k5swl2j] {
    font-size: 16px;
}

.permisos-btn:hover[b-he6k5swl2j] {
    background-color: var(--color-primary);
    color: white;
}

.permisos-count[b-he6k5swl2j] {
    display: inline-block;
    padding: 0.25rem 0.5rem;
    background-color: var(--bg-hover);
    color: var(--text-muted);
    font-size: var(--font-size-sm);
    border-radius: var(--border-radius);
}

/* Status Badges */
.status-badge[b-he6k5swl2j] {
    display: inline-block;
    padding: 0.125rem 0.5rem;
    font-size: var(--font-size-xs);
    font-weight: 500;
    border-radius: 9999px;
}

.status-badge--activo[b-he6k5swl2j] {
    background-color: var(--color-success-bg);
    color: var(--color-success);
}

.status-badge--inactivo[b-he6k5swl2j] {
    background-color: var(--bg-hover);
    color: var(--text-secondary);
}

/* Action Buttons */
.action-buttons[b-he6k5swl2j] {
    display: flex;
    justify-content: center;
    gap: 0.5rem;
}

.action-btn[b-he6k5swl2j] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    border: 1px solid var(--border-color);
    border-radius: var(--border-radius);
    background-color: transparent;
    cursor: pointer;
    transition: all var(--transition-fast);
}

.action-btn .material-icons[b-he6k5swl2j] {
    font-size: 18px;
}

.action-btn--primary[b-he6k5swl2j] {
    color: var(--color-primary);
}

.action-btn--primary:hover[b-he6k5swl2j] {
    background-color: var(--color-primary-bg);
    border-color: var(--color-primary);
}

/* Table Footer */
.table-footer[b-he6k5swl2j] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 1rem 1.25rem;
    border-top: 1px solid var(--border-color);
    background-color: var(--bg-hover);
}

.table-footer__count[b-he6k5swl2j] {
    font-size: var(--font-size-sm);
    color: var(--text-secondary);
}

.table-footer__count strong[b-he6k5swl2j] {
    color: var(--text-primary);
}

/* ============================================
   MODAL
   ============================================ */

.modal-overlay[b-he6k5swl2j] {
    position: fixed;
    inset: 0;
    background-color: rgba(0, 0, 0, 0.5);
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 1rem;
    z-index: 1050;
    backdrop-filter: blur(4px);
}

.modal-container[b-he6k5swl2j] {
    background-color: var(--bg-card);
    border-radius: var(--border-radius-xl);
    width: 100%;
    max-width: 480px;
    max-height: 90vh;
    overflow: hidden;
    box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.25);
}

.modal-container--lg[b-he6k5swl2j] {
    max-width: 640px;
}

.modal-header[b-he6k5swl2j] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 1.25rem 1.5rem;
    border-bottom: 1px solid var(--border-color);
}

.modal-title[b-he6k5swl2j] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin: 0;
    font-size: var(--font-size-lg);
    font-weight: 600;
    color: var(--text-primary);
}

.modal-title .material-icons[b-he6k5swl2j] {
    font-size: 24px;
    color: var(--color-primary);
}

.modal-close[b-he6k5swl2j] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    border: none;
    border-radius: var(--border-radius);
    background-color: transparent;
    color: var(--text-secondary);
    cursor: pointer;
    transition: all var(--transition-fast);
}

.modal-close:hover[b-he6k5swl2j] {
    background-color: var(--bg-hover);
    color: var(--text-primary);
}

.modal-body[b-he6k5swl2j] {
    padding: 1.5rem;
    overflow-y: auto;
    max-height: 60vh;
}

.modal-footer[b-he6k5swl2j] {
    display: flex;
    justify-content: flex-end;
    gap: 0.75rem;
    padding: 1.25rem 1.5rem;
    border-top: 1px solid var(--border-color);
    background-color: var(--bg-hover);
}

/* User Summary */
.user-summary[b-he6k5swl2j] {
    display: flex;
    align-items: center;
    gap: 1rem;
    padding: 1rem;
    background-color: var(--bg-hover);
    border-radius: var(--border-radius-lg);
    margin-bottom: 1.5rem;
}

.user-summary__info[b-he6k5swl2j] {
    display: flex;
    flex-direction: column;
    gap: 0.125rem;
}

.user-summary__name[b-he6k5swl2j] {
    font-size: var(--font-size-lg);
    font-weight: 600;
    color: var(--text-primary);
}

.user-summary__email[b-he6k5swl2j] {
    font-size: var(--font-size-sm);
    color: var(--text-secondary);
}

/* Roles Section */
.roles-section[b-he6k5swl2j] {
    margin-bottom: 1.5rem;
}

.section-title[b-he6k5swl2j] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin: 0 0 1rem 0;
    font-size: var(--font-size-base);
    font-weight: 600;
    color: var(--text-primary);
}

.section-title .material-icons[b-he6k5swl2j] {
    font-size: 20px;
    color: var(--color-primary);
}

/* Roles Grid */
.roles-grid[b-he6k5swl2j] {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 0.75rem;
}

.role-card[b-he6k5swl2j] {
    padding: 1rem;
    background-color: var(--bg-card);
    border: 2px solid var(--border-color);
    border-radius: var(--border-radius-lg);
    cursor: pointer;
    transition: all var(--transition-fast);
}

.role-card:hover[b-he6k5swl2j] {
    border-color: var(--color-primary);
}

.role-card--selected[b-he6k5swl2j] {
    border-color: var(--color-primary);
    background-color: var(--color-primary-bg);
}

.role-card__header[b-he6k5swl2j] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-bottom: 0.5rem;
}

.role-card__checkbox[b-he6k5swl2j] {
    color: var(--text-secondary);
}

.role-card--selected .role-card__checkbox[b-he6k5swl2j] {
    color: var(--color-primary);
}

.role-card__checkbox .material-icons[b-he6k5swl2j] {
    font-size: 22px;
}

.role-card__badge[b-he6k5swl2j] {
    display: inline-block;
    padding: 0.25rem 0.625rem;
    font-size: var(--font-size-xs);
    font-weight: 500;
    color: white;
    border-radius: 9999px;
}

.role-card__description[b-he6k5swl2j] {
    margin: 0;
    font-size: var(--font-size-xs);
    color: var(--text-secondary);
    line-height: 1.4;
}

/* Permisos Grid */
.permisos-grid[b-he6k5swl2j] {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 1rem;
    margin-top: 1rem;
}

.permiso-card[b-he6k5swl2j] {
    background-color: var(--bg-card);
    border: 1px solid var(--border-color);
    border-radius: var(--border-radius-lg);
    overflow: hidden;
}

.permiso-card__header[b-he6k5swl2j] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.75rem 1rem;
    background-color: var(--bg-hover);
    font-size: var(--font-size-sm);
    font-weight: 600;
    color: var(--text-primary);
    border-bottom: 1px solid var(--border-color);
}

.permiso-card__header .material-icons[b-he6k5swl2j] {
    font-size: 18px;
    color: var(--color-warning);
}

.permiso-card__body[b-he6k5swl2j] {
    padding: 0.75rem 1rem;
}

.permiso-item[b-he6k5swl2j] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.25rem 0;
    font-size: var(--font-size-xs);
    color: var(--text-secondary);
}

.permiso-item .material-icons[b-he6k5swl2j] {
    font-size: 16px;
    color: var(--color-success);
}

/* ============================================
   FORM STYLES
   ============================================ */

.form-group[b-he6k5swl2j] {
    margin-top: 1rem;
}

.form-label[b-he6k5swl2j] {
    display: block;
    margin-bottom: 0.375rem;
    font-size: var(--font-size-sm);
    font-weight: 500;
    color: var(--text-primary);
}

.form-input[b-he6k5swl2j] {
    width: 100%;
    padding: 0.625rem 0.875rem;
    font-size: var(--font-size-sm);
    border: 1px solid var(--border-color);
    border-radius: var(--border-radius);
    background-color: var(--bg-card);
    color: var(--text-primary);
    transition: border-color var(--transition-fast);
}

.form-input:focus[b-he6k5swl2j] {
    outline: none;
    border-color: var(--color-primary);
    box-shadow: 0 0 0 3px rgba(29, 78, 216, 0.1);
}

.form-hint[b-he6k5swl2j] {
    display: block;
    margin-top: 0.25rem;
    font-size: var(--font-size-xs);
    color: var(--text-muted);
}

/* Modal Buttons */
.btn-modal[b-he6k5swl2j] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    padding: 0.625rem 1.25rem;
    font-size: var(--font-size-sm);
    font-weight: 500;
    border: none;
    border-radius: var(--border-radius);
    cursor: pointer;
    transition: all var(--transition-fast);
}

.btn-modal:disabled[b-he6k5swl2j] {
    opacity: 0.6;
    cursor: not-allowed;
}

.btn-modal--primary[b-he6k5swl2j] {
    background-color: var(--color-primary);
    color: white;
}

.btn-modal--primary:hover:not(:disabled)[b-he6k5swl2j] {
    background-color: var(--color-primary-hover);
}

.btn-modal--secondary[b-he6k5swl2j] {
    background-color: var(--bg-hover);
    color: var(--text-primary);
    border: 1px solid var(--border-color);
}

.btn-modal--secondary:hover[b-he6k5swl2j] {
    background-color: var(--border-color);
}

/* ============================================
   RESPONSIVE
   ============================================ */

@media (max-width: 768px) {
    .page-header[b-he6k5swl2j] {
        flex-direction: column;
        align-items: flex-start;
    }

    .page-header__actions[b-he6k5swl2j] {
        width: 100%;
    }

    .btn-action[b-he6k5swl2j] {
        flex: 1;
        justify-content: center;
    }

    .filter-grid--2col[b-he6k5swl2j] {
        grid-template-columns: 1fr;
    }

    .data-table th:nth-child(2)[b-he6k5swl2j],
    .data-table td:nth-child(2)[b-he6k5swl2j],
    .data-table th:nth-child(3)[b-he6k5swl2j],
    .data-table td:nth-child(3)[b-he6k5swl2j] {
        display: none;
    }

    .roles-grid[b-he6k5swl2j] {
        grid-template-columns: 1fr;
    }

    .permisos-grid[b-he6k5swl2j] {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 640px) {
    .page-header__title[b-he6k5swl2j] {
        font-size: var(--font-size-2xl);
    }

    .data-table th:nth-child(4)[b-he6k5swl2j],
    .data-table td:nth-child(4)[b-he6k5swl2j] {
        display: none;
    }
}

/* ============================================
   DARK MODE
   ============================================ */

[data-theme="dark"] .filter-card[b-he6k5swl2j] {
    background-color: var(--bg-card);
    border-color: var(--border-color);
}

[data-theme="dark"] .filter-card__header[b-he6k5swl2j] {
    background-color: rgba(255, 255, 255, 0.05);
}

[data-theme="dark"] .table-card[b-he6k5swl2j] {
    background-color: var(--bg-card);
    border-color: var(--border-color);
}

[data-theme="dark"] .data-table thead[b-he6k5swl2j] {
    background-color: rgba(255, 255, 255, 0.05);
}

[data-theme="dark"] .table-footer[b-he6k5swl2j] {
    background-color: rgba(255, 255, 255, 0.05);
}

[data-theme="dark"] .loading-state[b-he6k5swl2j],
[data-theme="dark"] .empty-state[b-he6k5swl2j] {
    background-color: var(--bg-card);
    border-color: var(--border-color);
}

[data-theme="dark"] .modal-container[b-he6k5swl2j] {
    background-color: var(--bg-card);
}

[data-theme="dark"] .modal-footer[b-he6k5swl2j] {
    background-color: rgba(255, 255, 255, 0.05);
}

[data-theme="dark"] .user-summary[b-he6k5swl2j] {
    background-color: rgba(255, 255, 255, 0.05);
}

[data-theme="dark"] .role-card[b-he6k5swl2j] {
    background-color: var(--bg-card);
    border-color: var(--border-color);
}

[data-theme="dark"] .role-card--selected[b-he6k5swl2j] {
    background-color: rgba(29, 78, 216, 0.1);
}

[data-theme="dark"] .permiso-card[b-he6k5swl2j] {
    background-color: var(--bg-card);
    border-color: var(--border-color);
}

[data-theme="dark"] .permiso-card__header[b-he6k5swl2j] {
    background-color: rgba(255, 255, 255, 0.05);
}

[data-theme="dark"] .count-badge[b-he6k5swl2j] {
    background-color: rgba(255, 255, 255, 0.1);
}

[data-theme="dark"] .role-badge--identity[b-he6k5swl2j] {
    background-color: rgba(255, 255, 255, 0.1);
}
/* _content/Geniar.Asistencias.Web/Pages/Admin/Turnos.razor.rz.scp.css */
/* ============================================
   TURNOS PAGE STYLES
   ============================================ */

.admin-page[b-ghzap8ni9j] {
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
}

/* ============================================
   PAGE HEADER
   ============================================ */

.page-header[b-ghzap8ni9j] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    gap: 1rem;
}

.page-header__info[b-ghzap8ni9j] {
    flex: 1;
}

.page-header__title[b-ghzap8ni9j] {
    margin: 0 0 0.25rem 0;
    font-size: var(--font-size-3xl);
    font-weight: 700;
    color: var(--text-primary);
}

.page-header__subtitle[b-ghzap8ni9j] {
    margin: 0;
    font-size: var(--font-size-base);
    color: var(--text-secondary);
}

.page-header__actions[b-ghzap8ni9j] {
    display: flex;
    gap: 0.75rem;
}

/* Action Buttons */
.btn-action[b-ghzap8ni9j] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.625rem 1.25rem;
    font-size: var(--font-size-sm);
    font-weight: 500;
    border: none;
    border-radius: var(--border-radius);
    cursor: pointer;
    transition: all var(--transition-fast);
}

.btn-action .material-icons[b-ghzap8ni9j] {
    font-size: 20px;
}

.btn-action--primary[b-ghzap8ni9j] {
    background-color: var(--color-primary);
    color: white;
    box-shadow: 0 4px 14px 0 rgba(29, 78, 216, 0.3);
}

.btn-action--primary:hover[b-ghzap8ni9j] {
    background-color: var(--color-primary-hover);
}

/* ============================================
   ALERT MESSAGE
   ============================================ */

.alert-message[b-ghzap8ni9j] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 1rem 1.25rem;
    border-radius: var(--border-radius-lg);
    font-size: var(--font-size-sm);
}

.alert-message .material-icons[b-ghzap8ni9j] {
    font-size: 20px;
}

.alert-message--success[b-ghzap8ni9j] {
    background-color: var(--color-success-bg);
    color: var(--color-success);
    border: 1px solid rgba(16, 185, 129, 0.2);
}

.alert-message--error[b-ghzap8ni9j] {
    background-color: var(--color-danger-bg);
    color: var(--color-danger);
    border: 1px solid rgba(239, 68, 68, 0.2);
}

.alert-message__close[b-ghzap8ni9j] {
    margin-left: auto;
    background: none;
    border: none;
    cursor: pointer;
    padding: 0.25rem;
    display: flex;
    color: inherit;
    opacity: 0.7;
}

.alert-message__close:hover[b-ghzap8ni9j] {
    opacity: 1;
}

/* ============================================
   STATS GRID
   ============================================ */

.stats-grid[b-ghzap8ni9j] {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 1rem;
}

.stat-card[b-ghzap8ni9j] {
    display: flex;
    align-items: center;
    gap: 1rem;
    padding: 1.25rem;
    background-color: var(--bg-card);
    border: 1px solid var(--border-color);
    border-radius: var(--border-radius-xl);
    border-left: 4px solid;
}

.stat-card--primary[b-ghzap8ni9j] {
    border-left-color: var(--color-primary);
}

.stat-card--success[b-ghzap8ni9j] {
    border-left-color: var(--color-success);
}

.stat-card--info[b-ghzap8ni9j] {
    border-left-color: var(--color-cyan);
}

.stat-card--warning[b-ghzap8ni9j] {
    border-left-color: var(--color-warning);
}

.stat-card__icon[b-ghzap8ni9j] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 48px;
    height: 48px;
    border-radius: var(--border-radius-lg);
}

.stat-card--primary .stat-card__icon[b-ghzap8ni9j] {
    background-color: var(--color-primary-bg);
    color: var(--color-primary);
}

.stat-card--success .stat-card__icon[b-ghzap8ni9j] {
    background-color: var(--color-success-bg);
    color: var(--color-success);
}

.stat-card--info .stat-card__icon[b-ghzap8ni9j] {
    background-color: rgba(6, 182, 212, 0.1);
    color: var(--color-cyan);
}

.stat-card--warning .stat-card__icon[b-ghzap8ni9j] {
    background-color: var(--color-warning-bg);
    color: var(--color-warning);
}

.stat-card__icon .material-icons[b-ghzap8ni9j] {
    font-size: 24px;
}

.stat-card__content[b-ghzap8ni9j] {
    display: flex;
    flex-direction: column;
    gap: 0.125rem;
}

.stat-card__value[b-ghzap8ni9j] {
    font-size: var(--font-size-2xl);
    font-weight: 700;
    color: var(--text-primary);
}

.stat-card__label[b-ghzap8ni9j] {
    font-size: var(--font-size-sm);
    color: var(--text-secondary);
}

/* ============================================
   FILTER CARD
   ============================================ */

.filter-card[b-ghzap8ni9j] {
    background-color: var(--bg-card);
    border: 1px solid var(--border-color);
    border-radius: var(--border-radius-xl);
    overflow: hidden;
}

.filter-card__header[b-ghzap8ni9j] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.875rem 1.25rem;
    background-color: var(--bg-hover);
    font-size: var(--font-size-sm);
    font-weight: 500;
    color: var(--text-secondary);
    border-bottom: 1px solid var(--border-color);
}

.filter-card__header .material-icons[b-ghzap8ni9j] {
    font-size: 18px;
}

.filter-card__body[b-ghzap8ni9j] {
    padding: 1.25rem;
}

.filter-grid[b-ghzap8ni9j] {
    display: grid;
    gap: 1rem;
}

.filter-grid--4col[b-ghzap8ni9j] {
    grid-template-columns: 1fr 1fr 1fr auto;
}

.filter-group[b-ghzap8ni9j] {
    display: flex;
    flex-direction: column;
    gap: 0.375rem;
}

.filter-group--actions[b-ghzap8ni9j] {
    display: flex;
    align-items: flex-end;
}

.filter-label[b-ghzap8ni9j] {
    font-size: var(--font-size-xs);
    font-weight: 500;
    color: var(--text-secondary);
}

.filter-input-wrapper[b-ghzap8ni9j] {
    position: relative;
}

.filter-input-icon[b-ghzap8ni9j] {
    position: absolute;
    left: 0.75rem;
    top: 50%;
    transform: translateY(-50%);
    font-size: 18px;
    color: var(--text-muted);
}

.filter-input[b-ghzap8ni9j] {
    width: 100%;
    padding: 0.5rem 0.75rem 0.5rem 2.5rem;
    font-size: var(--font-size-sm);
    border: 1px solid var(--border-color);
    border-radius: var(--border-radius);
    background-color: var(--bg-card);
    color: var(--text-primary);
    transition: border-color var(--transition-fast);
}

.filter-input:focus[b-ghzap8ni9j] {
    outline: none;
    border-color: var(--color-primary);
    box-shadow: 0 0 0 3px rgba(29, 78, 216, 0.1);
}

.filter-select[b-ghzap8ni9j] {
    width: 100%;
    padding: 0.5rem 0.75rem;
    font-size: var(--font-size-sm);
    border: 1px solid var(--border-color);
    border-radius: var(--border-radius);
    background-color: var(--bg-card);
    color: var(--text-primary);
    cursor: pointer;
}

.filter-select:focus[b-ghzap8ni9j] {
    outline: none;
    border-color: var(--color-primary);
}

.btn-filter[b-ghzap8ni9j] {
    display: inline-flex;
    align-items: center;
    gap: 0.375rem;
    padding: 0.5rem 1rem;
    font-size: var(--font-size-sm);
    font-weight: 500;
    border: 1px solid var(--border-color);
    border-radius: var(--border-radius);
    cursor: pointer;
    transition: all var(--transition-fast);
}

.btn-filter .material-icons[b-ghzap8ni9j] {
    font-size: 18px;
}

.btn-filter--secondary[b-ghzap8ni9j] {
    background-color: var(--bg-card);
    color: var(--text-secondary);
}

.btn-filter--secondary:hover[b-ghzap8ni9j] {
    background-color: var(--bg-hover);
    color: var(--text-primary);
}

/* ============================================
   LOADING & EMPTY STATE
   ============================================ */

.loading-state[b-ghzap8ni9j],
.empty-state[b-ghzap8ni9j] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 4rem 2rem;
    gap: 1rem;
    background-color: var(--bg-card);
    border: 1px solid var(--border-color);
    border-radius: var(--border-radius-xl);
    color: var(--text-secondary);
}

.loading-state .spinner-border[b-ghzap8ni9j] {
    width: 3rem;
    height: 3rem;
}

.empty-state .material-icons[b-ghzap8ni9j] {
    font-size: 48px;
    color: var(--text-muted);
}

/* ============================================
   TABLE CARD
   ============================================ */

.table-card[b-ghzap8ni9j] {
    background-color: var(--bg-card);
    border: 1px solid var(--border-color);
    border-radius: var(--border-radius-xl);
    overflow: hidden;
}

.table-responsive[b-ghzap8ni9j] {
    overflow-x: auto;
}

.data-table[b-ghzap8ni9j] {
    width: 100%;
    border-collapse: collapse;
}

.data-table thead[b-ghzap8ni9j] {
    background-color: var(--bg-hover);
}

.data-table th[b-ghzap8ni9j] {
    padding: 0.875rem 1rem;
    font-size: var(--font-size-xs);
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: var(--text-secondary);
    text-align: left;
    border-bottom: 1px solid var(--border-color);
}

.data-table td[b-ghzap8ni9j] {
    padding: 1rem;
    font-size: var(--font-size-sm);
    color: var(--text-primary);
    border-bottom: 1px solid var(--border-color);
    vertical-align: middle;
}

.data-table tbody tr[b-ghzap8ni9j] {
    transition: background-color var(--transition-fast);
}

.data-table tbody tr:hover[b-ghzap8ni9j] {
    background-color: var(--bg-hover);
}

.data-table tbody tr:last-child td[b-ghzap8ni9j] {
    border-bottom: none;
}

/* Turno Cell */
.turno-cell[b-ghzap8ni9j] {
    display: flex;
    align-items: center;
    gap: 0.875rem;
}

.turno-icon[b-ghzap8ni9j] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    border-radius: var(--border-radius-lg);
    flex-shrink: 0;
}

.turno-icon .material-icons[b-ghzap8ni9j] {
    font-size: 22px;
}

.turno-icon--diurno[b-ghzap8ni9j] {
    background-color: var(--color-warning-bg);
    color: var(--color-warning);
}

.turno-icon--nocturno[b-ghzap8ni9j] {
    background-color: rgba(30, 27, 75, 0.1);
    color: #1E1B4B;
}

.turno-info[b-ghzap8ni9j] {
    display: flex;
    flex-direction: column;
    gap: 0.125rem;
}

.turno-nombre[b-ghzap8ni9j] {
    font-weight: 500;
    color: var(--text-primary);
}

.turno-descripcion[b-ghzap8ni9j] {
    font-size: var(--font-size-xs);
    color: var(--text-muted);
}

/* Badges */
.horario-badge[b-ghzap8ni9j] {
    display: inline-flex;
    align-items: center;
    gap: 0.375rem;
    padding: 0.375rem 0.75rem;
    background-color: var(--color-primary-bg);
    color: var(--color-primary);
    font-size: var(--font-size-sm);
    font-weight: 500;
    border-radius: var(--border-radius);
}

.horario-badge .material-icons[b-ghzap8ni9j] {
    font-size: 16px;
}

.duracion-badge[b-ghzap8ni9j],
.tolerancia-badge[b-ghzap8ni9j] {
    display: inline-block;
    padding: 0.25rem 0.625rem;
    font-size: var(--font-size-xs);
    font-weight: 500;
    font-family: monospace;
    background-color: var(--bg-hover);
    border-radius: var(--border-radius);
    color: var(--text-secondary);
}

.tipo-badge[b-ghzap8ni9j] {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    padding: 0.25rem 0.625rem;
    font-size: var(--font-size-xs);
    font-weight: 500;
    border-radius: 9999px;
}

.tipo-badge .material-icons[b-ghzap8ni9j] {
    font-size: 14px;
}

.tipo-badge--diurno[b-ghzap8ni9j] {
    background-color: var(--color-warning-bg);
    color: var(--color-warning);
}

.tipo-badge--nocturno[b-ghzap8ni9j] {
    background-color: rgba(30, 27, 75, 0.15);
    color: #1E1B4B;
}

.asignaciones-badge[b-ghzap8ni9j] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 28px;
    height: 28px;
    padding: 0 0.5rem;
    background-color: var(--color-primary-bg);
    color: var(--color-primary);
    font-size: var(--font-size-sm);
    font-weight: 600;
    border-radius: 9999px;
}

/* Status Badges */
.status-badge[b-ghzap8ni9j] {
    display: inline-block;
    padding: 0.25rem 0.75rem;
    font-size: var(--font-size-xs);
    font-weight: 500;
    border-radius: 9999px;
}

.status-badge--activo[b-ghzap8ni9j] {
    background-color: var(--color-success-bg);
    color: var(--color-success);
}

.status-badge--inactivo[b-ghzap8ni9j] {
    background-color: var(--bg-hover);
    color: var(--text-secondary);
}

/* Action Buttons */
.action-buttons[b-ghzap8ni9j] {
    display: flex;
    justify-content: center;
    gap: 0.5rem;
}

.action-btn[b-ghzap8ni9j] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    border: 1px solid var(--border-color);
    border-radius: var(--border-radius);
    background-color: transparent;
    cursor: pointer;
    transition: all var(--transition-fast);
}

.action-btn .material-icons[b-ghzap8ni9j] {
    font-size: 18px;
}

.action-btn--edit[b-ghzap8ni9j] {
    color: var(--color-warning);
}

.action-btn--edit:hover[b-ghzap8ni9j] {
    background-color: var(--color-warning-bg);
    border-color: var(--color-warning);
}

.action-btn--toggle[b-ghzap8ni9j] {
    color: var(--color-primary);
}

.action-btn--toggle:hover[b-ghzap8ni9j] {
    background-color: var(--color-primary-bg);
    border-color: var(--color-primary);
}

.action-btn--delete[b-ghzap8ni9j] {
    color: var(--color-danger);
}

.action-btn--delete:hover[b-ghzap8ni9j] {
    background-color: var(--color-danger-bg);
    border-color: var(--color-danger);
}

/* Table Footer */
.table-footer[b-ghzap8ni9j] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 1rem 1.25rem;
    border-top: 1px solid var(--border-color);
    background-color: var(--bg-hover);
}

.table-footer__count[b-ghzap8ni9j] {
    font-size: var(--font-size-sm);
    color: var(--text-secondary);
}

.table-footer__count strong[b-ghzap8ni9j] {
    color: var(--text-primary);
}

/* ============================================
   MODAL
   ============================================ */

.modal-overlay[b-ghzap8ni9j] {
    position: fixed;
    inset: 0;
    background-color: rgba(0, 0, 0, 0.5);
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 1rem;
    z-index: 1050;
    backdrop-filter: blur(4px);
}

.modal-container[b-ghzap8ni9j] {
    background-color: var(--bg-card);
    border-radius: var(--border-radius-xl);
    width: 100%;
    max-width: 480px;
    max-height: 90vh;
    overflow: hidden;
    box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.25);
}

.modal-container--lg[b-ghzap8ni9j] {
    max-width: 600px;
}

.modal-header[b-ghzap8ni9j] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 1.25rem 1.5rem;
    border-bottom: 1px solid var(--border-color);
}

.modal-title[b-ghzap8ni9j] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin: 0;
    font-size: var(--font-size-lg);
    font-weight: 600;
    color: var(--text-primary);
}

.modal-title .material-icons[b-ghzap8ni9j] {
    font-size: 24px;
    color: var(--color-primary);
}

.modal-close[b-ghzap8ni9j] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    border: none;
    border-radius: var(--border-radius);
    background-color: transparent;
    color: var(--text-secondary);
    cursor: pointer;
    transition: all var(--transition-fast);
}

.modal-close:hover[b-ghzap8ni9j] {
    background-color: var(--bg-hover);
    color: var(--text-primary);
}

.modal-body[b-ghzap8ni9j] {
    padding: 1.5rem;
    overflow-y: auto;
    max-height: 60vh;
}

.modal-footer[b-ghzap8ni9j] {
    display: flex;
    justify-content: flex-end;
    gap: 0.75rem;
    padding: 1.25rem 1.5rem;
    border-top: 1px solid var(--border-color);
    background-color: var(--bg-hover);
}

/* ============================================
   FORM STYLES
   ============================================ */

.form-group[b-ghzap8ni9j] {
    margin-bottom: 1.25rem;
}

.form-group:last-child[b-ghzap8ni9j] {
    margin-bottom: 0;
}

.form-row[b-ghzap8ni9j] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1rem;
}

.form-label[b-ghzap8ni9j] {
    display: block;
    margin-bottom: 0.375rem;
    font-size: var(--font-size-sm);
    font-weight: 500;
    color: var(--text-primary);
}

.form-label .required[b-ghzap8ni9j] {
    color: var(--color-danger);
}

.form-input[b-ghzap8ni9j] {
    width: 100%;
    padding: 0.625rem 0.875rem;
    font-size: var(--font-size-sm);
    border: 1px solid var(--border-color);
    border-radius: var(--border-radius);
    background-color: var(--bg-card);
    color: var(--text-primary);
    transition: border-color var(--transition-fast);
}

.form-input:focus[b-ghzap8ni9j] {
    outline: none;
    border-color: var(--color-primary);
    box-shadow: 0 0 0 3px rgba(29, 78, 216, 0.1);
}

.form-textarea[b-ghzap8ni9j] {
    resize: vertical;
    min-height: 80px;
}

.form-hint[b-ghzap8ni9j] {
    display: block;
    margin-top: 0.25rem;
    font-size: var(--font-size-xs);
    color: var(--text-muted);
}

/* Checkbox */
.checkbox-item[b-ghzap8ni9j] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    cursor: pointer;
    font-size: var(--font-size-sm);
    color: var(--text-primary);
    padding-top: 0.625rem;
}

.checkbox-item input[type="checkbox"][b-ghzap8ni9j] {
    width: 18px;
    height: 18px;
    accent-color: var(--color-primary);
}

/* Modal Buttons */
.btn-modal[b-ghzap8ni9j] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    padding: 0.625rem 1.25rem;
    font-size: var(--font-size-sm);
    font-weight: 500;
    border: none;
    border-radius: var(--border-radius);
    cursor: pointer;
    transition: all var(--transition-fast);
}

.btn-modal:disabled[b-ghzap8ni9j] {
    opacity: 0.6;
    cursor: not-allowed;
}

.btn-modal--primary[b-ghzap8ni9j] {
    background-color: var(--color-primary);
    color: white;
}

.btn-modal--primary:hover:not(:disabled)[b-ghzap8ni9j] {
    background-color: var(--color-primary-hover);
}

.btn-modal--secondary[b-ghzap8ni9j] {
    background-color: var(--bg-hover);
    color: var(--text-primary);
    border: 1px solid var(--border-color);
}

.btn-modal--secondary:hover[b-ghzap8ni9j] {
    background-color: var(--border-color);
}

/* ============================================
   RESPONSIVE
   ============================================ */

@media (max-width: 1024px) {
    .stats-grid[b-ghzap8ni9j] {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 768px) {
    .page-header[b-ghzap8ni9j] {
        flex-direction: column;
        align-items: flex-start;
    }

    .page-header__actions[b-ghzap8ni9j] {
        width: 100%;
    }

    .btn-action[b-ghzap8ni9j] {
        flex: 1;
        justify-content: center;
    }

    .stats-grid[b-ghzap8ni9j] {
        grid-template-columns: 1fr;
    }

    .filter-grid--4col[b-ghzap8ni9j] {
        grid-template-columns: 1fr;
    }

    .data-table th:nth-child(3)[b-ghzap8ni9j],
    .data-table td:nth-child(3)[b-ghzap8ni9j],
    .data-table th:nth-child(4)[b-ghzap8ni9j],
    .data-table td:nth-child(4)[b-ghzap8ni9j] {
        display: none;
    }

    .form-row[b-ghzap8ni9j] {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 640px) {
    .page-header__title[b-ghzap8ni9j] {
        font-size: var(--font-size-2xl);
    }

    .data-table th:nth-child(5)[b-ghzap8ni9j],
    .data-table td:nth-child(5)[b-ghzap8ni9j],
    .data-table th:nth-child(6)[b-ghzap8ni9j],
    .data-table td:nth-child(6)[b-ghzap8ni9j] {
        display: none;
    }
}

/* ============================================
   DARK MODE
   ============================================ */

[data-theme="dark"] .stat-card[b-ghzap8ni9j] {
    background-color: var(--bg-card);
    border-color: var(--border-color);
}

[data-theme="dark"] .filter-card[b-ghzap8ni9j] {
    background-color: var(--bg-card);
    border-color: var(--border-color);
}

[data-theme="dark"] .filter-card__header[b-ghzap8ni9j] {
    background-color: rgba(255, 255, 255, 0.05);
}

[data-theme="dark"] .table-card[b-ghzap8ni9j] {
    background-color: var(--bg-card);
    border-color: var(--border-color);
}

[data-theme="dark"] .data-table thead[b-ghzap8ni9j] {
    background-color: rgba(255, 255, 255, 0.05);
}

[data-theme="dark"] .table-footer[b-ghzap8ni9j] {
    background-color: rgba(255, 255, 255, 0.05);
}

[data-theme="dark"] .loading-state[b-ghzap8ni9j],
[data-theme="dark"] .empty-state[b-ghzap8ni9j] {
    background-color: var(--bg-card);
    border-color: var(--border-color);
}

[data-theme="dark"] .modal-container[b-ghzap8ni9j] {
    background-color: var(--bg-card);
}

[data-theme="dark"] .modal-footer[b-ghzap8ni9j] {
    background-color: rgba(255, 255, 255, 0.05);
}

[data-theme="dark"] .turno-icon--nocturno[b-ghzap8ni9j] {
    background-color: rgba(255, 255, 255, 0.1);
    color: #A5B4FC;
}

[data-theme="dark"] .tipo-badge--nocturno[b-ghzap8ni9j] {
    background-color: rgba(255, 255, 255, 0.1);
    color: #A5B4FC;
}

[data-theme="dark"] .duracion-badge[b-ghzap8ni9j],
[data-theme="dark"] .tolerancia-badge[b-ghzap8ni9j] {
    background-color: rgba(255, 255, 255, 0.1);
}
/* _content/Geniar.Asistencias.Web/Pages/Admin/Usuarios.razor.rz.scp.css */
/* ============================================
   ADMIN PAGE STYLES
   ============================================ */

.admin-page[b-0rcxmumw39] {
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
}

/* ============================================
   PAGE HEADER
   ============================================ */

.page-header[b-0rcxmumw39] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    gap: 1rem;
}

.page-header__info[b-0rcxmumw39] { flex: 1; }
.page-header__title[b-0rcxmumw39] { margin: 0 0 0.25rem 0; font-size: var(--font-size-3xl); font-weight: 700; color: var(--text-primary); }
.page-header__subtitle[b-0rcxmumw39] { margin: 0; font-size: var(--font-size-base); color: var(--text-secondary); }
.page-header__actions[b-0rcxmumw39] { display: flex; gap: 0.75rem; }

.btn-action[b-0rcxmumw39] {
    display: inline-flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1.25rem;
    font-size: var(--font-size-sm); font-weight: 500; border: none; border-radius: var(--border-radius);
    cursor: pointer; transition: all var(--transition-fast);
}
.btn-action .material-icons[b-0rcxmumw39] { font-size: 20px; }
.btn-action--primary[b-0rcxmumw39] { background-color: var(--color-primary); color: white; box-shadow: 0 4px 14px 0 rgba(29, 78, 216, 0.3); }
.btn-action--primary:hover[b-0rcxmumw39] { background-color: var(--color-primary-hover); }

/* ============================================
   ALERT MESSAGE
   ============================================ */

.alert-message[b-0rcxmumw39] {
    display: flex; align-items: center; gap: 0.75rem; padding: 1rem 1.25rem;
    border-radius: var(--border-radius); margin-bottom: 0.5rem;
}
.alert-message .material-icons[b-0rcxmumw39] { font-size: 22px; }
.alert-message--success[b-0rcxmumw39] { background-color: var(--color-success-bg); color: var(--color-success); }
.alert-message--error[b-0rcxmumw39] { background-color: var(--color-danger-bg); color: var(--color-danger); }
.alert-message__close[b-0rcxmumw39] {
    margin-left: auto; background: none; border: none; cursor: pointer; opacity: 0.7;
    color: inherit; padding: 0.25rem;
}
.alert-message__close:hover[b-0rcxmumw39] { opacity: 1; }

/* ============================================
   FILTER CARD
   ============================================ */

.filter-card[b-0rcxmumw39] { background-color: var(--bg-card); border: 1px solid var(--border-color); border-radius: var(--border-radius-xl); overflow: hidden; }
.filter-card__header[b-0rcxmumw39] { display: flex; align-items: center; gap: 0.5rem; padding: 0.875rem 1.25rem; background-color: var(--bg-hover); border-bottom: 1px solid var(--border-color); font-size: var(--font-size-sm); font-weight: 600; color: var(--text-secondary); }
.filter-card__header .material-icons[b-0rcxmumw39] { font-size: 18px; }
.filter-card__body[b-0rcxmumw39] { padding: 1.25rem; }

.filter-grid[b-0rcxmumw39] { display: grid; grid-template-columns: 2fr 1fr 1fr auto; gap: 1rem; align-items: end; }
.filter-group[b-0rcxmumw39] { display: flex; flex-direction: column; gap: 0.375rem; }
.filter-label[b-0rcxmumw39] { font-size: var(--font-size-xs); font-weight: 500; color: var(--text-secondary); text-transform: uppercase; letter-spacing: 0.05em; }
.filter-input-wrapper[b-0rcxmumw39] { position: relative; }
.filter-input-icon[b-0rcxmumw39] { position: absolute; left: 0.75rem; top: 50%; transform: translateY(-50%); font-size: 20px; color: var(--text-muted); }
.filter-input[b-0rcxmumw39] { width: 100%; padding: 0.625rem 0.75rem 0.625rem 2.5rem; font-size: var(--font-size-sm); border: 1px solid var(--border-color); border-radius: var(--border-radius); background-color: var(--bg-card); color: var(--text-primary); }
.filter-input:focus[b-0rcxmumw39] { outline: none; border-color: var(--color-primary); box-shadow: 0 0 0 3px var(--color-primary-bg); }
.filter-select[b-0rcxmumw39] { width: 100%; padding: 0.625rem 0.75rem; font-size: var(--font-size-sm); border: 1px solid var(--border-color); border-radius: var(--border-radius); background-color: var(--bg-card); color: var(--text-primary); }
.filter-select:focus[b-0rcxmumw39] { outline: none; border-color: var(--color-primary); box-shadow: 0 0 0 3px var(--color-primary-bg); }
.filter-group--actions[b-0rcxmumw39] { display: flex; flex-direction: row; gap: 0.5rem; }

.btn-filter[b-0rcxmumw39] { display: inline-flex; align-items: center; gap: 0.375rem; padding: 0.625rem 1rem; font-size: var(--font-size-sm); font-weight: 500; border: 1px solid var(--border-color); border-radius: var(--border-radius); cursor: pointer; transition: all var(--transition-fast); }
.btn-filter .material-icons[b-0rcxmumw39] { font-size: 18px; }
.btn-filter--primary[b-0rcxmumw39] { background-color: var(--color-primary); color: white; border-color: var(--color-primary); }
.btn-filter--primary:hover[b-0rcxmumw39] { background-color: var(--color-primary-hover); }
.btn-filter--clear[b-0rcxmumw39] { background-color: transparent; color: var(--text-secondary); }
.btn-filter--clear:hover[b-0rcxmumw39] { background-color: var(--bg-hover); }

/* ============================================
   STATES
   ============================================ */

.loading-state[b-0rcxmumw39], .empty-state[b-0rcxmumw39] {
    display: flex; flex-direction: column; align-items: center; justify-content: center;
    padding: 4rem 2rem; gap: 1rem; background-color: var(--bg-card);
    border: 1px solid var(--border-color); border-radius: var(--border-radius-xl); color: var(--text-secondary);
}
.loading-state .spinner-border[b-0rcxmumw39] { width: 3rem; height: 3rem; }
.empty-state .material-icons[b-0rcxmumw39] { font-size: 48px; color: var(--text-muted); }

/* ============================================
   TABLE
   ============================================ */

.table-card[b-0rcxmumw39] { background-color: var(--bg-card); border: 1px solid var(--border-color); border-radius: var(--border-radius-xl); overflow: hidden; }
.data-table[b-0rcxmumw39] { width: 100%; border-collapse: collapse; }
.data-table thead[b-0rcxmumw39] { background-color: var(--bg-hover); }
.data-table th[b-0rcxmumw39] { padding: 0.875rem 1rem; font-size: var(--font-size-xs); font-weight: 600; text-transform: uppercase; letter-spacing: 0.05em; color: var(--text-secondary); text-align: left; border-bottom: 1px solid var(--border-color); }
.data-table td[b-0rcxmumw39] { padding: 1rem; font-size: var(--font-size-sm); color: var(--text-primary); border-bottom: 1px solid var(--border-color); vertical-align: middle; }
.data-table tbody tr[b-0rcxmumw39] { transition: background-color var(--transition-fast); }
.data-table tbody tr:hover[b-0rcxmumw39] { background-color: var(--bg-hover); }
.data-table tbody tr:last-child td[b-0rcxmumw39] { border-bottom: none; }

.table-footer[b-0rcxmumw39] { display: flex; justify-content: space-between; align-items: center; padding: 1rem 1.25rem; border-top: 1px solid var(--border-color); background-color: var(--bg-hover); }
.table-footer__count[b-0rcxmumw39] { font-size: var(--font-size-sm); color: var(--text-secondary); }
.table-footer__count strong[b-0rcxmumw39] { color: var(--text-primary); }

/* User Cell */
.user-cell[b-0rcxmumw39] { display: flex; align-items: center; gap: 0.875rem; }
.user-avatar[b-0rcxmumw39] { display: flex; align-items: center; justify-content: center; width: 40px; height: 40px; border-radius: 50%; font-size: var(--font-size-sm); font-weight: 600; color: white; background-color: var(--color-primary); flex-shrink: 0; }
.user-info[b-0rcxmumw39] { display: flex; flex-direction: column; gap: 0.125rem; }
.user-name[b-0rcxmumw39] { font-weight: 500; color: var(--text-primary); }
.user-email[b-0rcxmumw39] { font-size: var(--font-size-xs); color: var(--text-muted); }

/* Role Badges */
.roles-list[b-0rcxmumw39] { display: flex; flex-wrap: wrap; gap: 0.375rem; }
.role-badge[b-0rcxmumw39] { display: inline-block; padding: 0.2rem 0.5rem; font-size: var(--font-size-xs); font-weight: 500; border-radius: var(--border-radius); }
.role-badge--administrador[b-0rcxmumw39] { background-color: var(--color-primary-bg); color: var(--color-primary); }
.role-badge--encargado[b-0rcxmumw39] { background-color: var(--color-cyan-bg); color: var(--color-cyan); }
.role-badge--empleado[b-0rcxmumw39] { background-color: var(--bg-hover); color: var(--text-secondary); }

/* Status Badges */
.status-badge[b-0rcxmumw39] { display: inline-block; padding: 0.25rem 0.75rem; font-size: var(--font-size-xs); font-weight: 500; border-radius: 9999px; }
.status-badge--activo[b-0rcxmumw39] { background-color: var(--color-success-bg); color: var(--color-success); }
.status-badge--inactivo[b-0rcxmumw39] { background-color: var(--bg-hover); color: var(--text-secondary); }

/* Verification Icons */
.verification-icons[b-0rcxmumw39] { display: flex; gap: 0.5rem; }
.verification-icon[b-0rcxmumw39] { display: flex; align-items: center; justify-content: center; width: 28px; height: 28px; border-radius: var(--border-radius); }
.verification-icon .material-icons[b-0rcxmumw39] { font-size: 18px; }
.verification-icon--success[b-0rcxmumw39] { background-color: var(--color-success-bg); color: var(--color-success); }
.verification-icon--error[b-0rcxmumw39] { background-color: var(--color-danger-bg); color: var(--color-danger); }

/* Action Buttons */
.action-buttons[b-0rcxmumw39] { display: flex; justify-content: center; gap: 0.375rem; }
.action-btn[b-0rcxmumw39] { display: flex; align-items: center; justify-content: center; width: 32px; height: 32px; border: 1px solid var(--border-color); border-radius: var(--border-radius); background-color: transparent; cursor: pointer; transition: all var(--transition-fast); }
.action-btn .material-icons[b-0rcxmumw39] { font-size: 18px; }
.action-btn--edit[b-0rcxmumw39] { color: var(--color-warning); }
.action-btn--edit:hover[b-0rcxmumw39] { background-color: var(--color-warning-bg); border-color: var(--color-warning); }
.action-btn--roles[b-0rcxmumw39] { color: var(--color-primary); }
.action-btn--roles:hover[b-0rcxmumw39] { background-color: var(--color-primary-bg); border-color: var(--color-primary); }
.action-btn--password[b-0rcxmumw39] { color: var(--color-cyan); }
.action-btn--password:hover[b-0rcxmumw39] { background-color: var(--color-cyan-bg); border-color: var(--color-cyan); }

/* Dropdown */
.dropdown-item[b-0rcxmumw39] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 1rem; }
.dropdown-item .material-icons[b-0rcxmumw39] { font-size: 18px; }

/* ============================================
   MODAL
   ============================================ */

.modal-overlay[b-0rcxmumw39] { position: fixed; top: 0; left: 0; right: 0; bottom: 0; background-color: rgba(0, 0, 0, 0.5); display: flex; align-items: center; justify-content: center; z-index: 1000; padding: 1rem; }
.modal-container[b-0rcxmumw39] { background-color: var(--bg-card); border-radius: var(--border-radius-xl); width: 100%; max-width: 500px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: var(--shadow-xl); }
.modal-container--lg[b-0rcxmumw39] { max-width: 700px; }
.modal-header[b-0rcxmumw39] { display: flex; justify-content: space-between; align-items: center; padding: 1.25rem 1.5rem; border-bottom: 1px solid var(--border-color); }
.modal-title[b-0rcxmumw39] { display: flex; align-items: center; gap: 0.5rem; margin: 0; font-size: var(--font-size-xl); font-weight: 600; color: var(--text-primary); }
.modal-title .material-icons[b-0rcxmumw39] { color: var(--color-primary); }
.modal-close[b-0rcxmumw39] { display: flex; align-items: center; justify-content: center; width: 36px; height: 36px; border: none; border-radius: var(--border-radius); background-color: transparent; color: var(--text-secondary); cursor: pointer; }
.modal-close:hover[b-0rcxmumw39] { background-color: var(--bg-hover); color: var(--text-primary); }
.modal-body[b-0rcxmumw39] { padding: 1.5rem; overflow-y: auto; }
.modal-info[b-0rcxmumw39] { margin: 0 0 1rem 0; font-size: var(--font-size-sm); color: var(--text-secondary); }
.modal-footer[b-0rcxmumw39] { display: flex; justify-content: flex-end; gap: 0.75rem; padding: 1rem 1.5rem; border-top: 1px solid var(--border-color); background-color: var(--bg-hover); }

.btn-modal[b-0rcxmumw39] { padding: 0.625rem 1.5rem; font-size: var(--font-size-sm); font-weight: 500; border: none; border-radius: var(--border-radius); cursor: pointer; transition: all var(--transition-fast); }
.btn-modal--primary[b-0rcxmumw39] { background-color: var(--color-primary); color: white; }
.btn-modal--primary:hover[b-0rcxmumw39] { background-color: var(--color-primary-hover); }
.btn-modal--primary:disabled[b-0rcxmumw39] { opacity: 0.6; cursor: not-allowed; }
.btn-modal--secondary[b-0rcxmumw39] { background-color: var(--text-secondary); color: white; }
.btn-modal--secondary:hover[b-0rcxmumw39] { background-color: var(--text-primary); }

/* Forms */
.form-grid[b-0rcxmumw39] { display: grid; grid-template-columns: repeat(2, 1fr); gap: 1rem; margin-bottom: 1rem; }
.form-group[b-0rcxmumw39] { display: flex; flex-direction: column; gap: 0.375rem; margin-bottom: 1rem; }
.form-label[b-0rcxmumw39] { font-size: var(--font-size-sm); font-weight: 500; color: var(--text-primary); }
.form-label .required[b-0rcxmumw39] { color: var(--color-danger); }
.form-input[b-0rcxmumw39] { width: 100%; padding: 0.625rem 0.75rem; font-size: var(--font-size-sm); border: 1px solid var(--border-color); border-radius: var(--border-radius); background-color: var(--bg-card); color: var(--text-primary); }
.form-input:focus[b-0rcxmumw39] { outline: none; border-color: var(--color-primary); box-shadow: 0 0 0 3px var(--color-primary-bg); }
.form-input:disabled[b-0rcxmumw39] { background-color: var(--bg-hover); cursor: not-allowed; }
.form-hint[b-0rcxmumw39] { font-size: var(--font-size-xs); color: var(--text-muted); }

.checkbox-group[b-0rcxmumw39] { display: flex; flex-direction: column; gap: 0.5rem; }
.checkbox-item[b-0rcxmumw39] { display: flex; align-items: center; gap: 0.5rem; font-size: var(--font-size-sm); cursor: pointer; }
.checkbox-item input[type="checkbox"][b-0rcxmumw39] { width: 16px; height: 16px; accent-color: var(--color-primary); }

.input-with-button[b-0rcxmumw39] { display: flex; gap: 0.5rem; }
.input-with-button .form-input[b-0rcxmumw39] { flex: 1; }
.input-button[b-0rcxmumw39] { display: flex; align-items: center; justify-content: center; width: 40px; border: 1px solid var(--border-color); border-radius: var(--border-radius); background-color: var(--bg-hover); color: var(--text-secondary); cursor: pointer; }
.input-button:hover[b-0rcxmumw39] { background-color: var(--border-color); color: var(--text-primary); }

.password-generated[b-0rcxmumw39] { display: flex; align-items: center; gap: 0.5rem; padding: 0.75rem 1rem; background-color: var(--color-cyan-bg); border-radius: var(--border-radius); color: var(--color-cyan); font-size: var(--font-size-sm); margin-top: 1rem; }

/* ============================================
   RESPONSIVE
   ============================================ */

@media (max-width: 1024px) {
    .filter-grid[b-0rcxmumw39] { grid-template-columns: 1fr 1fr; }
    .filter-group--actions[b-0rcxmumw39] { grid-column: span 2; justify-content: flex-end; }
}

@media (max-width: 768px) {
    .page-header[b-0rcxmumw39] { flex-direction: column; align-items: flex-start; }
    .page-header__actions[b-0rcxmumw39] { width: 100%; }
    .btn-action[b-0rcxmumw39] { flex: 1; justify-content: center; }
    .filter-grid[b-0rcxmumw39] { grid-template-columns: 1fr; }
    .filter-group--actions[b-0rcxmumw39] { grid-column: 1; }
    .form-grid[b-0rcxmumw39] { grid-template-columns: 1fr; }
    .data-table th:nth-child(5)[b-0rcxmumw39], .data-table td:nth-child(5)[b-0rcxmumw39],
    .data-table th:nth-child(6)[b-0rcxmumw39], .data-table td:nth-child(6)[b-0rcxmumw39] { display: none; }
}

@media (max-width: 640px) {
    .page-header__title[b-0rcxmumw39] { font-size: var(--font-size-2xl); }
    .data-table th:nth-child(2)[b-0rcxmumw39], .data-table td:nth-child(2)[b-0rcxmumw39],
    .data-table th:nth-child(3)[b-0rcxmumw39], .data-table td:nth-child(3)[b-0rcxmumw39] { display: none; }
    .user-email[b-0rcxmumw39] { display: none; }
}

/* ============================================
   DARK MODE
   ============================================ */

[data-theme="dark"] .filter-card[b-0rcxmumw39],
[data-theme="dark"] .table-card[b-0rcxmumw39],
[data-theme="dark"] .modal-container[b-0rcxmumw39] { background-color: var(--bg-card); border-color: var(--border-color); }
[data-theme="dark"] .filter-card__header[b-0rcxmumw39],
[data-theme="dark"] .table-footer[b-0rcxmumw39],
[data-theme="dark"] .modal-footer[b-0rcxmumw39] { background-color: rgba(255, 255, 255, 0.05); }
[data-theme="dark"] .data-table thead[b-0rcxmumw39] { background-color: rgba(255, 255, 255, 0.05); }
[data-theme="dark"] .loading-state[b-0rcxmumw39],
[data-theme="dark"] .empty-state[b-0rcxmumw39] { background-color: var(--bg-card); border-color: var(--border-color); }
/* _content/Geniar.Asistencias.Web/Pages/Asistencias/Index.razor.rz.scp.css */
/* ============================================
   ASISTENCIAS PAGE STYLES
   ============================================ */

.asistencias-page[b-vphlfx0xl5] {
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
}

/* ============================================
   PAGE HEADER
   ============================================ */

.page-header[b-vphlfx0xl5] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    gap: 1rem;
}

.page-header__info[b-vphlfx0xl5] {
    flex: 1;
}

.page-header__title[b-vphlfx0xl5] {
    margin: 0 0 0.25rem 0;
    font-size: var(--font-size-3xl);
    font-weight: 700;
    color: var(--text-primary);
}

.page-header__subtitle[b-vphlfx0xl5] {
    margin: 0;
    font-size: var(--font-size-base);
    color: var(--text-secondary);
}

.page-header__actions[b-vphlfx0xl5] {
    display: flex;
    gap: 0.75rem;
}

/* ============================================
   STATS GRID
   ============================================ */

.stats-grid[b-vphlfx0xl5] {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 1.5rem;
}

/* ============================================
   ACTION BUTTONS
   ============================================ */

.btn-action[b-vphlfx0xl5] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.625rem 1.25rem;
    font-size: var(--font-size-sm);
    font-weight: 500;
    border: none;
    border-radius: var(--border-radius);
    cursor: pointer;
    text-decoration: none;
    transition: all var(--transition-fast);
}

.btn-action .material-icons[b-vphlfx0xl5] {
    font-size: 20px;
}

.btn-action--primary[b-vphlfx0xl5] {
    background-color: var(--color-primary);
    color: white;
    box-shadow: 0 4px 14px 0 rgba(29, 78, 216, 0.3);
}

.btn-action--primary:hover[b-vphlfx0xl5] {
    background-color: var(--color-primary-hover);
    color: white;
}

/* ============================================
   FILTER CARD
   ============================================ */

.filter-card[b-vphlfx0xl5] {
    background-color: var(--bg-card);
    border: 1px solid var(--border-color);
    border-radius: var(--border-radius-xl);
    overflow: hidden;
}

.filter-card__header[b-vphlfx0xl5] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.875rem 1.25rem;
    background-color: var(--bg-hover);
    border-bottom: 1px solid var(--border-color);
    font-size: var(--font-size-sm);
    font-weight: 600;
    color: var(--text-secondary);
}

.filter-card__header .material-icons[b-vphlfx0xl5] {
    font-size: 18px;
}

.filter-card__body[b-vphlfx0xl5] {
    padding: 1.25rem;
}

.filter-grid[b-vphlfx0xl5] {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 1rem;
    margin-bottom: 1rem;
}

.filter-grid--6col[b-vphlfx0xl5] {
    grid-template-columns: repeat(6, 1fr);
}

.filter-group[b-vphlfx0xl5] {
    display: flex;
    flex-direction: column;
    gap: 0.375rem;
}

.filter-label[b-vphlfx0xl5] {
    font-size: var(--font-size-xs);
    font-weight: 500;
    color: var(--text-secondary);
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

.filter-input[b-vphlfx0xl5],
.filter-select[b-vphlfx0xl5] {
    width: 100%;
    padding: 0.625rem 0.75rem;
    font-size: var(--font-size-sm);
    border: 1px solid var(--border-color);
    border-radius: var(--border-radius);
    background-color: var(--bg-card);
    color: var(--text-primary);
    transition: border-color var(--transition-fast);
}

.filter-input:focus[b-vphlfx0xl5],
.filter-select:focus[b-vphlfx0xl5] {
    outline: none;
    border-color: var(--color-primary);
    box-shadow: 0 0 0 3px var(--color-primary-bg);
}

.filter-actions[b-vphlfx0xl5] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding-top: 1rem;
    border-top: 1px solid var(--border-color);
}

.filter-checkbox[b-vphlfx0xl5] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-size: var(--font-size-sm);
    color: var(--text-secondary);
}

.filter-checkbox input[type="checkbox"][b-vphlfx0xl5] {
    width: 16px;
    height: 16px;
    accent-color: var(--color-primary);
}

.filter-buttons[b-vphlfx0xl5] {
    display: flex;
    gap: 0.5rem;
}

.btn-filter[b-vphlfx0xl5] {
    display: inline-flex;
    align-items: center;
    gap: 0.375rem;
    padding: 0.625rem 1rem;
    font-size: var(--font-size-sm);
    font-weight: 500;
    border: 1px solid var(--border-color);
    border-radius: var(--border-radius);
    cursor: pointer;
    transition: all var(--transition-fast);
}

.btn-filter .material-icons[b-vphlfx0xl5] {
    font-size: 18px;
}

.btn-filter--primary[b-vphlfx0xl5] {
    background-color: var(--color-primary);
    color: white;
    border-color: var(--color-primary);
}

.btn-filter--primary:hover[b-vphlfx0xl5] {
    background-color: var(--color-primary-hover);
}

.btn-filter--clear[b-vphlfx0xl5] {
    background-color: transparent;
    color: var(--text-secondary);
}

.btn-filter--clear:hover[b-vphlfx0xl5] {
    background-color: var(--bg-hover);
}

.btn-filter--success[b-vphlfx0xl5] {
    background-color: var(--color-success);
    color: white;
    border-color: var(--color-success);
}

.btn-filter--success:hover[b-vphlfx0xl5] {
    background-color: var(--color-success-hover);
}

.btn-filter:disabled[b-vphlfx0xl5] {
    opacity: 0.5;
    cursor: not-allowed;
}

/* ============================================
   LOADING & EMPTY STATES
   ============================================ */

.loading-state[b-vphlfx0xl5],
.empty-state[b-vphlfx0xl5] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 4rem 2rem;
    gap: 1rem;
    background-color: var(--bg-card);
    border: 1px solid var(--border-color);
    border-radius: var(--border-radius-xl);
    color: var(--text-secondary);
}

.loading-state .spinner-border[b-vphlfx0xl5] {
    width: 3rem;
    height: 3rem;
}

.empty-state .material-icons[b-vphlfx0xl5] {
    font-size: 48px;
    color: var(--text-muted);
}

/* ============================================
   TABLE CARD
   ============================================ */

.table-card[b-vphlfx0xl5] {
    background-color: var(--bg-card);
    border: 1px solid var(--border-color);
    border-radius: var(--border-radius-xl);
    overflow: hidden;
}

.data-table[b-vphlfx0xl5] {
    width: 100%;
    border-collapse: collapse;
}

.data-table thead[b-vphlfx0xl5] {
    background-color: var(--bg-hover);
}

.data-table th[b-vphlfx0xl5] {
    padding: 0.875rem 1rem;
    font-size: var(--font-size-xs);
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: var(--text-secondary);
    text-align: left;
    border-bottom: 1px solid var(--border-color);
}

.data-table td[b-vphlfx0xl5] {
    padding: 1rem;
    font-size: var(--font-size-sm);
    color: var(--text-primary);
    border-bottom: 1px solid var(--border-color);
    vertical-align: middle;
}

.data-table tbody tr[b-vphlfx0xl5] {
    transition: background-color var(--transition-fast);
}

.data-table tbody tr:hover[b-vphlfx0xl5] {
    background-color: var(--bg-hover);
}

.data-table tbody tr:last-child td[b-vphlfx0xl5] {
    border-bottom: none;
}

/* DateTime Cell */
.datetime-cell[b-vphlfx0xl5] {
    display: flex;
    flex-direction: column;
    gap: 0.125rem;
}

.datetime-date[b-vphlfx0xl5] {
    font-weight: 500;
    color: var(--text-primary);
}

.datetime-time[b-vphlfx0xl5] {
    font-size: var(--font-size-xs);
    color: var(--text-muted);
}

/* Empleado nombre */
.empleado-nombre[b-vphlfx0xl5] {
    font-weight: 500;
}

/* Legajo Badge */
.legajo-badge[b-vphlfx0xl5] {
    display: inline-block;
    padding: 0.25rem 0.625rem;
    font-size: var(--font-size-xs);
    font-weight: 500;
    font-family: monospace;
    background-color: var(--bg-hover);
    border-radius: var(--border-radius);
    color: var(--text-secondary);
}

/* Tipo Badges */
.tipo-badge[b-vphlfx0xl5] {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    padding: 0.25rem 0.75rem;
    font-size: var(--font-size-xs);
    font-weight: 500;
    border-radius: 9999px;
}

.tipo-badge .material-icons[b-vphlfx0xl5] {
    font-size: 14px;
}

.tipo-badge--entrada[b-vphlfx0xl5] {
    background-color: var(--color-primary-bg);
    color: var(--color-primary);
}

.tipo-badge--salida[b-vphlfx0xl5] {
    background-color: var(--bg-hover);
    color: var(--text-secondary);
}

/* Status Badges */
.status-badge[b-vphlfx0xl5] {
    display: inline-block;
    padding: 0.25rem 0.75rem;
    font-size: var(--font-size-xs);
    font-weight: 500;
    border-radius: 9999px;
}

.status-badge--atiempo[b-vphlfx0xl5] {
    background-color: var(--color-success-bg);
    color: var(--color-success);
}

.status-badge--tarde[b-vphlfx0xl5] {
    background-color: var(--color-warning-bg);
    color: var(--color-warning);
}

.status-badge--otro[b-vphlfx0xl5] {
    background-color: var(--color-cyan-bg);
    color: var(--color-cyan);
}

/* Distancia */
.distancia[b-vphlfx0xl5] {
    font-size: var(--font-size-sm);
    color: var(--text-secondary);
}

/* Action Buttons */
.action-buttons[b-vphlfx0xl5] {
    display: flex;
    justify-content: center;
    gap: 0.5rem;
}

.action-btn[b-vphlfx0xl5] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    border: 1px solid var(--border-color);
    border-radius: var(--border-radius);
    background-color: transparent;
    cursor: pointer;
    transition: all var(--transition-fast);
}

.action-btn .material-icons[b-vphlfx0xl5] {
    font-size: 18px;
}

.action-btn--view[b-vphlfx0xl5] {
    color: var(--color-primary);
}

.action-btn--view:hover[b-vphlfx0xl5] {
    background-color: var(--color-primary-bg);
    border-color: var(--color-primary);
}

/* Table Footer & Pagination */
.table-footer[b-vphlfx0xl5] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 1rem 1.25rem;
    border-top: 1px solid var(--border-color);
    background-color: var(--bg-hover);
}

.table-footer__count[b-vphlfx0xl5] {
    font-size: var(--font-size-sm);
    color: var(--text-secondary);
}

.table-footer__count strong[b-vphlfx0xl5] {
    color: var(--text-primary);
}

.pagination-wrapper[b-vphlfx0xl5] {
    display: flex;
    gap: 0.25rem;
}

.pagination-btn[b-vphlfx0xl5] {
    display: flex;
    align-items: center;
    justify-content: center;
    min-width: 36px;
    height: 36px;
    padding: 0 0.5rem;
    font-size: var(--font-size-sm);
    font-weight: 500;
    border: 1px solid var(--border-color);
    border-radius: var(--border-radius);
    background-color: var(--bg-card);
    color: var(--text-secondary);
    cursor: pointer;
    transition: all var(--transition-fast);
}

.pagination-btn:hover:not(:disabled)[b-vphlfx0xl5] {
    background-color: var(--bg-hover);
    border-color: var(--border-color-dark);
}

.pagination-btn--active[b-vphlfx0xl5] {
    background-color: var(--color-primary);
    border-color: var(--color-primary);
    color: white;
}

.pagination-btn:disabled[b-vphlfx0xl5] {
    opacity: 0.5;
    cursor: not-allowed;
}

.pagination-btn .material-icons[b-vphlfx0xl5] {
    font-size: 20px;
}

/* ============================================
   MODAL
   ============================================ */

.modal-overlay[b-vphlfx0xl5] {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: rgba(0, 0, 0, 0.5);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 1000;
    padding: 1rem;
}

.modal-container[b-vphlfx0xl5] {
    background-color: var(--bg-card);
    border-radius: var(--border-radius-xl);
    width: 100%;
    max-width: 700px;
    max-height: 90vh;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    box-shadow: var(--shadow-xl);
}

.modal-header[b-vphlfx0xl5] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 1.25rem 1.5rem;
    border-bottom: 1px solid var(--border-color);
}

.modal-title[b-vphlfx0xl5] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin: 0;
    font-size: var(--font-size-xl);
    font-weight: 600;
    color: var(--text-primary);
}

.modal-title .material-icons[b-vphlfx0xl5] {
    color: var(--color-primary);
}

.modal-close[b-vphlfx0xl5] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    border: none;
    border-radius: var(--border-radius);
    background-color: transparent;
    color: var(--text-secondary);
    cursor: pointer;
    transition: all var(--transition-fast);
}

.modal-close:hover[b-vphlfx0xl5] {
    background-color: var(--bg-hover);
    color: var(--text-primary);
}

.modal-body[b-vphlfx0xl5] {
    padding: 1.5rem;
    overflow-y: auto;
}

.modal-footer[b-vphlfx0xl5] {
    display: flex;
    justify-content: flex-end;
    padding: 1rem 1.5rem;
    border-top: 1px solid var(--border-color);
    background-color: var(--bg-hover);
}

.btn-modal[b-vphlfx0xl5] {
    padding: 0.625rem 1.5rem;
    font-size: var(--font-size-sm);
    font-weight: 500;
    border: none;
    border-radius: var(--border-radius);
    cursor: pointer;
    transition: all var(--transition-fast);
}

.btn-modal--secondary[b-vphlfx0xl5] {
    background-color: var(--text-secondary);
    color: white;
}

.btn-modal--secondary:hover[b-vphlfx0xl5] {
    background-color: var(--text-primary);
}

/* Detail Grid */
.detail-grid[b-vphlfx0xl5] {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 1rem;
    margin-bottom: 1.25rem;
}

.detail-grid--3col[b-vphlfx0xl5] {
    grid-template-columns: repeat(3, 1fr);
}

.detail-grid--technical[b-vphlfx0xl5] {
    margin-top: 1.25rem;
    padding-top: 1.25rem;
    border-top: 1px dashed var(--border-color);
}

.detail-item[b-vphlfx0xl5] {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}

.detail-item--highlight[b-vphlfx0xl5] {
    padding: 1rem;
    background-color: var(--bg-hover);
    border-radius: var(--border-radius);
}

.detail-label[b-vphlfx0xl5] {
    font-size: var(--font-size-xs);
    font-weight: 500;
    color: var(--text-secondary);
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

.detail-value[b-vphlfx0xl5] {
    font-size: var(--font-size-base);
    font-weight: 500;
    color: var(--text-primary);
}

.detail-subvalue[b-vphlfx0xl5] {
    font-size: var(--font-size-xs);
    color: var(--text-muted);
}

.detail-value-mono[b-vphlfx0xl5] {
    font-family: monospace;
    font-size: var(--font-size-sm);
    color: var(--text-primary);
}

.detail-value-small[b-vphlfx0xl5] {
    font-size: var(--font-size-xs);
    color: var(--text-secondary);
    word-break: break-all;
}

/* Detail Sections */
.detail-section[b-vphlfx0xl5] {
    margin-top: 1.25rem;
    padding-top: 1.25rem;
    border-top: 1px solid var(--border-color);
}

.detail-section-title[b-vphlfx0xl5] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-bottom: 0.75rem;
    font-size: var(--font-size-sm);
    font-weight: 600;
    color: var(--text-primary);
}

.detail-section-title .material-icons[b-vphlfx0xl5] {
    font-size: 18px;
    color: var(--color-primary);
}

.detail-coords[b-vphlfx0xl5] {
    margin: 0 0 0.75rem 0;
    font-size: var(--font-size-sm);
    color: var(--text-secondary);
    font-family: monospace;
}

.detail-text[b-vphlfx0xl5] {
    margin: 0;
    font-size: var(--font-size-sm);
    color: var(--text-primary);
    line-height: 1.6;
}

/* Map Container */
.map-container[b-vphlfx0xl5] {
    height: 250px;
    width: 100%;
    border-radius: var(--border-radius);
    border: 1px solid var(--border-color);
    margin-bottom: 0.75rem;
}

/* Selfie Image */
.selfie-image[b-vphlfx0xl5] {
    max-width: 200px;
    border-radius: var(--border-radius);
    border: 1px solid var(--border-color);
}

/* Button Link */
.btn-link[b-vphlfx0xl5] {
    display: inline-flex;
    align-items: center;
    gap: 0.375rem;
    font-size: var(--font-size-sm);
    color: var(--color-primary);
    text-decoration: none;
    transition: color var(--transition-fast);
}

.btn-link:hover[b-vphlfx0xl5] {
    color: var(--color-primary-hover);
}

.btn-link .material-icons[b-vphlfx0xl5] {
    font-size: 16px;
}

/* ============================================
   RESPONSIVE
   ============================================ */

@media (max-width: 1200px) {
    .filter-grid--6col[b-vphlfx0xl5] {
        grid-template-columns: repeat(3, 1fr);
    }
}

@media (max-width: 1024px) {
    .stats-grid[b-vphlfx0xl5] {
        grid-template-columns: repeat(2, 1fr);
    }

    .filter-grid[b-vphlfx0xl5],
    .filter-grid--6col[b-vphlfx0xl5] {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 768px) {
    .page-header[b-vphlfx0xl5] {
        flex-direction: column;
        align-items: flex-start;
    }

    .page-header__actions[b-vphlfx0xl5] {
        width: 100%;
    }

    .btn-action[b-vphlfx0xl5] {
        flex: 1;
        justify-content: center;
    }

    .filter-grid[b-vphlfx0xl5],
    .filter-grid--6col[b-vphlfx0xl5] {
        grid-template-columns: 1fr;
    }

    .filter-actions[b-vphlfx0xl5] {
        flex-direction: column;
        gap: 1rem;
    }

    .filter-buttons[b-vphlfx0xl5] {
        width: 100%;
        justify-content: stretch;
    }

    .filter-buttons .btn-filter[b-vphlfx0xl5] {
        flex: 1;
        justify-content: center;
    }

    .table-footer[b-vphlfx0xl5] {
        flex-direction: column;
        gap: 1rem;
    }

    .detail-grid[b-vphlfx0xl5],
    .detail-grid--3col[b-vphlfx0xl5] {
        grid-template-columns: 1fr;
    }

    /* Hide some columns on mobile */
    .data-table th:nth-child(3)[b-vphlfx0xl5],
    .data-table td:nth-child(3)[b-vphlfx0xl5],
    .data-table th:nth-child(7)[b-vphlfx0xl5],
    .data-table td:nth-child(7)[b-vphlfx0xl5] {
        display: none;
    }
}

@media (max-width: 640px) {
    .page-header__title[b-vphlfx0xl5] {
        font-size: var(--font-size-2xl);
    }

    .stats-grid[b-vphlfx0xl5] {
        grid-template-columns: 1fr;
    }

    .data-table th:nth-child(4)[b-vphlfx0xl5],
    .data-table td:nth-child(4)[b-vphlfx0xl5] {
        display: none;
    }
}

/* ============================================
   DARK MODE
   ============================================ */

[data-theme="dark"] .filter-card[b-vphlfx0xl5] {
    background-color: var(--bg-card);
    border-color: var(--border-color);
}

[data-theme="dark"] .filter-card__header[b-vphlfx0xl5] {
    background-color: rgba(255, 255, 255, 0.05);
}

[data-theme="dark"] .filter-input[b-vphlfx0xl5],
[data-theme="dark"] .filter-select[b-vphlfx0xl5] {
    background-color: var(--bg-card);
    border-color: var(--border-color);
}

[data-theme="dark"] .table-card[b-vphlfx0xl5] {
    background-color: var(--bg-card);
    border-color: var(--border-color);
}

[data-theme="dark"] .data-table thead[b-vphlfx0xl5] {
    background-color: rgba(255, 255, 255, 0.05);
}

[data-theme="dark"] .legajo-badge[b-vphlfx0xl5] {
    background-color: rgba(255, 255, 255, 0.1);
}

[data-theme="dark"] .table-footer[b-vphlfx0xl5] {
    background-color: rgba(255, 255, 255, 0.05);
}

[data-theme="dark"] .modal-container[b-vphlfx0xl5] {
    background-color: var(--bg-card);
}

[data-theme="dark"] .modal-footer[b-vphlfx0xl5] {
    background-color: rgba(255, 255, 255, 0.05);
}

[data-theme="dark"] .detail-item--highlight[b-vphlfx0xl5] {
    background-color: rgba(255, 255, 255, 0.05);
}

[data-theme="dark"] .loading-state[b-vphlfx0xl5],
[data-theme="dark"] .empty-state[b-vphlfx0xl5] {
    background-color: var(--bg-card);
    border-color: var(--border-color);
}

[data-theme="dark"] .pagination-btn[b-vphlfx0xl5] {
    background-color: var(--bg-card);
    border-color: var(--border-color);
}
/* _content/Geniar.Asistencias.Web/Pages/Asistencias/Registrar.razor.rz.scp.css */
/* ============================================
   REGISTRAR ASISTENCIA STYLES
   ============================================ */

.register-page[b-5ir7h9af2d] { display: flex; justify-content: center; align-items: flex-start; padding: 1.5rem; min-height: 100%; }

/* Register Card */
.register-card[b-5ir7h9af2d] { width: 100%; max-width: 480px; background-color: var(--bg-card); border: 1px solid var(--border-color); border-radius: var(--border-radius-xl); overflow: hidden; box-shadow: 0 4px 20px rgba(0, 0, 0, 0.08); }
.register-card__header[b-5ir7h9af2d] { display: flex; align-items: center; justify-content: center; gap: 0.75rem; padding: 1.25rem; background-color: var(--color-primary); color: white; }
.register-card__header .material-icons[b-5ir7h9af2d] { font-size: 28px; }
.register-card__header h2[b-5ir7h9af2d] { margin: 0; font-size: var(--font-size-lg); font-weight: 600; }
.register-card__body[b-5ir7h9af2d] { padding: 1.5rem; }
.register-card__footer[b-5ir7h9af2d] { padding: 1rem 1.5rem; border-top: 1px solid var(--border-color); text-align: center; }

/* Processing State */
.processing-state[b-5ir7h9af2d] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem 1rem; gap: 1rem; text-align: center; }
.processing-state .spinner-border[b-5ir7h9af2d] { width: 3rem; height: 3rem; color: var(--color-primary); }
.processing-state h4[b-5ir7h9af2d] { margin: 0; font-size: var(--font-size-lg); color: var(--text-primary); }
.processing-state p[b-5ir7h9af2d] { margin: 0; font-size: var(--font-size-sm); color: var(--text-muted); }

/* Result Card */
.result-card[b-5ir7h9af2d] { display: flex; flex-direction: column; align-items: center; padding: 2rem 1rem; border-radius: var(--border-radius-xl); text-align: center; margin-bottom: 1.5rem; }
.result-card--success[b-5ir7h9af2d] { background-color: var(--color-success-bg); }
.result-card--error[b-5ir7h9af2d] { background-color: var(--color-danger-bg); }
.result-card__icon[b-5ir7h9af2d] { margin-bottom: 1rem; }
.result-card__icon .material-icons[b-5ir7h9af2d] { font-size: 56px; }
.result-card--success .result-card__icon .material-icons[b-5ir7h9af2d] { color: var(--color-success); }
.result-card--error .result-card__icon .material-icons[b-5ir7h9af2d] { color: var(--color-danger); }
.result-card h3[b-5ir7h9af2d] { margin: 0 0 0.5rem 0; font-size: var(--font-size-xl); font-weight: 600; color: var(--text-primary); }
.result-card__message[b-5ir7h9af2d] { margin: 0; font-size: var(--font-size-sm); color: var(--text-secondary); }

/* Result Details */
.result-details[b-5ir7h9af2d] { display: flex; flex-direction: column; gap: 0.75rem; width: 100%; margin-top: 1.5rem; padding-top: 1.5rem; border-top: 1px solid var(--border-color); text-align: left; }
.result-details__item[b-5ir7h9af2d] { display: flex; justify-content: space-between; align-items: center; }
.result-details__label[b-5ir7h9af2d] { font-size: var(--font-size-sm); color: var(--text-muted); }
.result-details__value[b-5ir7h9af2d] { font-size: var(--font-size-sm); font-weight: 500; color: var(--text-primary); }

/* Badges */
.badge-type[b-5ir7h9af2d] { display: inline-flex; align-items: center; padding: 0.25rem 0.5rem; font-size: var(--font-size-xs); font-weight: 600; border-radius: var(--border-radius); text-transform: uppercase; }
.badge-type--entry[b-5ir7h9af2d] { background-color: var(--color-success); color: white; }
.badge-type--exit[b-5ir7h9af2d] { background-color: var(--color-warning); color: white; }

/* Warnings */
.late-warning[b-5ir7h9af2d], .distance-warning[b-5ir7h9af2d] { display: flex; align-items: center; justify-content: center; gap: 0.5rem; margin-top: 1rem; padding: 0.75rem 1rem; border-radius: var(--border-radius); font-size: var(--font-size-sm); font-weight: 500; }
.late-warning[b-5ir7h9af2d] { background-color: var(--color-warning-bg); color: var(--color-warning); }
.distance-warning[b-5ir7h9af2d] { background-color: var(--color-danger-bg); color: var(--color-danger); }
.late-warning .material-icons[b-5ir7h9af2d], .distance-warning .material-icons[b-5ir7h9af2d] { font-size: 18px; }

/* Error List */
.error-list[b-5ir7h9af2d] { margin: 1rem 0 0 0; padding: 0; list-style: none; text-align: left; }
.error-list li[b-5ir7h9af2d] { padding: 0.375rem 0; font-size: var(--font-size-sm); color: var(--text-secondary); }
.error-list li[b-5ir7h9af2d]::before { content: "• "; color: var(--color-danger); }

/* Step Title */
.step-title[b-5ir7h9af2d] { margin: 0 0 1rem 0; font-size: var(--font-size-base); font-weight: 600; color: var(--text-primary); text-align: center; }

/* Info Alert */
.info-alert[b-5ir7h9af2d] { display: flex; align-items: center; gap: 0.75rem; padding: 1rem; background-color: var(--color-primary-bg); border-radius: var(--border-radius); margin-bottom: 1rem; }
.info-alert--centered[b-5ir7h9af2d] { justify-content: center; text-align: center; flex-wrap: wrap; }
.info-alert .material-icons[b-5ir7h9af2d] { font-size: 20px; color: var(--color-primary); flex-shrink: 0; }
.info-alert span:last-child[b-5ir7h9af2d] { font-size: var(--font-size-sm); color: var(--text-primary); }

/* Empty Alert */
.empty-alert[b-5ir7h9af2d] { display: flex; align-items: center; justify-content: center; gap: 0.5rem; padding: 1rem; background-color: var(--color-warning-bg); border-radius: var(--border-radius); }
.empty-alert .material-icons[b-5ir7h9af2d] { font-size: 20px; color: var(--color-warning); }
.empty-alert span:last-child[b-5ir7h9af2d] { font-size: var(--font-size-sm); color: var(--text-primary); }

/* Selected Branch */
.selected-branch[b-5ir7h9af2d] { display: flex; align-items: center; gap: 1rem; padding: 1.25rem; background-color: var(--color-success-bg); border-radius: var(--border-radius-xl); margin-bottom: 1rem; }
.selected-branch__icon[b-5ir7h9af2d] { display: flex; align-items: center; justify-content: center; width: 48px; height: 48px; background-color: var(--color-success); border-radius: 50%; flex-shrink: 0; }
.selected-branch__icon .material-icons[b-5ir7h9af2d] { font-size: 24px; color: white; }
.selected-branch__info[b-5ir7h9af2d] { flex: 1; }
.selected-branch__info h4[b-5ir7h9af2d] { margin: 0 0 0.25rem 0; font-size: var(--font-size-xs); font-weight: 500; color: var(--color-success); text-transform: uppercase; }
.selected-branch__name[b-5ir7h9af2d] { margin: 0; font-size: var(--font-size-base); font-weight: 600; color: var(--text-primary); }
.selected-branch__address[b-5ir7h9af2d] { margin: 0.25rem 0 0 0; font-size: var(--font-size-sm); color: var(--text-muted); }

/* Loading Branches */
.loading-branches[b-5ir7h9af2d] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 2rem; color: var(--text-muted); }

/* Branch List */
.branch-list[b-5ir7h9af2d] { display: flex; flex-direction: column; gap: 0.5rem; }
.branch-item[b-5ir7h9af2d] { display: flex; align-items: center; justify-content: space-between; padding: 1rem; background-color: var(--bg-card); border: 1px solid var(--border-color); border-radius: var(--border-radius); cursor: pointer; transition: all var(--transition-fast); text-align: left; width: 100%; }
.branch-item:hover[b-5ir7h9af2d] { border-color: var(--color-primary); background-color: var(--color-primary-bg); }
.branch-item__info[b-5ir7h9af2d] { flex: 1; }
.branch-item__name[b-5ir7h9af2d] { display: block; font-size: var(--font-size-sm); font-weight: 500; color: var(--text-primary); }
.branch-item__address[b-5ir7h9af2d] { display: block; font-size: var(--font-size-xs); color: var(--text-muted); margin-top: 0.25rem; }
.branch-item .material-icons[b-5ir7h9af2d] { font-size: 20px; color: var(--text-muted); }

/* GPS State */
.gps-state[b-5ir7h9af2d] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem 1rem; gap: 1rem; text-align: center; }
.gps-state__icon[b-5ir7h9af2d] { display: flex; align-items: center; justify-content: center; width: 64px; height: 64px; background-color: var(--color-primary-bg); border-radius: 50%; margin-bottom: 0.5rem; }
.gps-state__icon .material-icons[b-5ir7h9af2d] { font-size: 32px; color: var(--color-primary); }
.gps-state h4[b-5ir7h9af2d] { margin: 0; font-size: var(--font-size-lg); color: var(--text-primary); }
.gps-state .spinner-border[b-5ir7h9af2d] { width: 2rem; height: 2rem; color: var(--color-primary); }
.gps-state p[b-5ir7h9af2d] { margin: 0; font-size: var(--font-size-sm); color: var(--text-muted); max-width: 280px; }

/* Selfie Step */
.selfie-step[b-5ir7h9af2d] { text-align: center; }
.selfie-actions[b-5ir7h9af2d] { display: flex; flex-direction: column; gap: 0.75rem; margin-top: 1.5rem; }

/* Camera Container */
.camera-container[b-5ir7h9af2d] { margin-bottom: 1rem; }
.camera-preview[b-5ir7h9af2d] { width: 100%; max-width: 320px; border-radius: var(--border-radius-xl); border: 2px solid var(--border-color); }
.selfie-preview[b-5ir7h9af2d] { width: 100%; max-width: 320px; border-radius: var(--border-radius-xl); border: 2px solid var(--color-success); }

/* Step Indicator */
.step-indicator[b-5ir7h9af2d] { font-size: var(--font-size-sm); color: var(--text-muted); }
.step-indicator__current[b-5ir7h9af2d] { font-weight: 500; color: var(--text-primary); }

/* Buttons */
.btn-action[b-5ir7h9af2d] { display: inline-flex; align-items: center; justify-content: center; gap: 0.5rem; padding: 0.75rem 1.5rem; font-size: var(--font-size-sm); font-weight: 500; border: none; border-radius: var(--border-radius); cursor: pointer; transition: all var(--transition-fast); text-decoration: none; }
.btn-action .material-icons[b-5ir7h9af2d] { font-size: 18px; }
.btn-action:disabled[b-5ir7h9af2d] { opacity: 0.6; cursor: not-allowed; }
.btn-action--full[b-5ir7h9af2d] { width: 100%; }
.btn-action--lg[b-5ir7h9af2d] { padding: 1rem 1.5rem; font-size: var(--font-size-base); }
.btn-action--primary[b-5ir7h9af2d] { background-color: var(--color-primary); color: white; }
.btn-action--primary:hover:not(:disabled)[b-5ir7h9af2d] { background-color: var(--color-primary-hover); }
.btn-action--success[b-5ir7h9af2d] { background-color: var(--color-success); color: white; }
.btn-action--success:hover:not(:disabled)[b-5ir7h9af2d] { opacity: 0.9; }
.btn-action--warning[b-5ir7h9af2d] { background-color: var(--color-warning); color: white; }
.btn-action--warning:hover:not(:disabled)[b-5ir7h9af2d] { opacity: 0.9; }
.btn-action--secondary[b-5ir7h9af2d] { background-color: var(--bg-hover); color: var(--text-primary); border: 1px solid var(--border-color); }
.btn-action--secondary:hover:not(:disabled)[b-5ir7h9af2d] { background-color: var(--border-color); }

/* Dark Mode */
[data-theme="dark"] .register-card[b-5ir7h9af2d] { background-color: var(--bg-card); border-color: var(--border-color); }
[data-theme="dark"] .branch-item[b-5ir7h9af2d] { background-color: rgba(255, 255, 255, 0.05); border-color: var(--border-color); }
/* _content/Geniar.Asistencias.Web/Pages/Empleados/Crear.razor.rz.scp.css */
/* ============================================
   CREAR EMPLEADO FORM STYLES
   ============================================ */

.form-page[b-30x9xk4mmj] { display: flex; flex-direction: column; gap: 1.5rem; }

/* Page Header */
.page-header[b-30x9xk4mmj] { display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 1rem; }
.page-header__info[b-30x9xk4mmj] { flex: 1; }
.page-header__title[b-30x9xk4mmj] { margin: 0 0 0.25rem 0; font-size: var(--font-size-3xl); font-weight: 700; color: var(--text-primary); }
.page-header__subtitle[b-30x9xk4mmj] { margin: 0; font-size: var(--font-size-base); color: var(--text-secondary); }
.page-header__actions[b-30x9xk4mmj] { display: flex; gap: 0.75rem; }

/* Form Card */
.form-card[b-30x9xk4mmj] { background-color: var(--bg-card); border: 1px solid var(--border-color); border-radius: var(--border-radius-xl); padding: 1.5rem; }

/* Form Sections */
.form-section[b-30x9xk4mmj] { padding: 1.5rem 0; border-bottom: 1px solid var(--border-color); }
.form-section:first-of-type[b-30x9xk4mmj] { padding-top: 0; }
.form-section:last-of-type[b-30x9xk4mmj] { border-bottom: none; }
.form-section__header[b-30x9xk4mmj] { display: flex; align-items: center; gap: 0.75rem; margin-bottom: 1.25rem; }
.form-section__header .material-icons[b-30x9xk4mmj] { font-size: 24px; color: var(--color-primary); }
.form-section__header h3[b-30x9xk4mmj] { margin: 0; font-size: var(--font-size-lg); font-weight: 600; color: var(--text-primary); }

/* Form Grid */
.form-grid[b-30x9xk4mmj] { display: grid; grid-template-columns: repeat(2, 1fr); gap: 1rem; margin-bottom: 1rem; }
.form-group[b-30x9xk4mmj] { display: flex; flex-direction: column; gap: 0.375rem; }
.form-group--full[b-30x9xk4mmj] { grid-column: 1 / -1; margin-bottom: 1rem; }

/* Form Elements */
.form-label[b-30x9xk4mmj] { font-size: var(--font-size-sm); font-weight: 500; color: var(--text-primary); }
.form-label .required[b-30x9xk4mmj] { color: var(--color-danger); }
.form-input[b-30x9xk4mmj] { width: 100%; padding: 0.625rem 0.875rem; font-size: var(--font-size-sm); border: 1px solid var(--border-color); border-radius: var(--border-radius); background-color: var(--bg-card); color: var(--text-primary); transition: all var(--transition-fast); }
.form-input:focus[b-30x9xk4mmj] { outline: none; border-color: var(--color-primary); box-shadow: 0 0 0 3px rgba(29, 78, 216, 0.1); }
.form-input--textarea[b-30x9xk4mmj] { resize: vertical; min-height: 80px; }
.form-hint[b-30x9xk4mmj] { font-size: var(--font-size-xs); color: var(--text-muted); }
.validation-message[b-30x9xk4mmj] { font-size: var(--font-size-xs); color: var(--color-danger); }

/* Alert Card */
.alert-card[b-30x9xk4mmj] { display: flex; align-items: flex-start; gap: 0.75rem; padding: 1rem; border-radius: var(--border-radius); margin-bottom: 1.5rem; }
.alert-card .material-icons[b-30x9xk4mmj] { font-size: 20px; flex-shrink: 0; margin-top: 0.125rem; }
.alert-card--danger[b-30x9xk4mmj] { background-color: var(--color-danger-bg); border: 1px solid var(--color-danger); }
.alert-card--danger .material-icons[b-30x9xk4mmj] { color: var(--color-danger); }
.alert-card__content[b-30x9xk4mmj] { flex: 1; }
.alert-card__content p[b-30x9xk4mmj] { margin: 0 0 0.5rem 0; font-size: var(--font-size-sm); color: var(--text-primary); }
.alert-card__content ul[b-30x9xk4mmj] { margin: 0; padding-left: 1.25rem; font-size: var(--font-size-sm); color: var(--text-secondary); }

/* Form Actions */
.form-actions[b-30x9xk4mmj] { display: flex; justify-content: flex-end; gap: 0.75rem; padding-top: 1.5rem; border-top: 1px solid var(--border-color); margin-top: 0.5rem; }

/* Buttons */
.btn-action[b-30x9xk4mmj] { display: inline-flex; align-items: center; justify-content: center; gap: 0.5rem; padding: 0.625rem 1.25rem; font-size: var(--font-size-sm); font-weight: 500; border: none; border-radius: var(--border-radius); cursor: pointer; transition: all var(--transition-fast); text-decoration: none; }
.btn-action .material-icons[b-30x9xk4mmj] { font-size: 18px; }
.btn-action:disabled[b-30x9xk4mmj] { opacity: 0.6; cursor: not-allowed; }
.btn-action--primary[b-30x9xk4mmj] { background-color: var(--color-primary); color: white; }
.btn-action--primary:hover:not(:disabled)[b-30x9xk4mmj] { background-color: var(--color-primary-hover); }
.btn-action--secondary[b-30x9xk4mmj] { background-color: var(--bg-hover); color: var(--text-primary); border: 1px solid var(--border-color); }
.btn-action--secondary:hover:not(:disabled)[b-30x9xk4mmj] { background-color: var(--border-color); }

/* Responsive */
@media (max-width: 768px) {
    .page-header[b-30x9xk4mmj] { flex-direction: column; align-items: flex-start; }
    .form-grid[b-30x9xk4mmj] { grid-template-columns: 1fr; }
    .form-actions[b-30x9xk4mmj] { flex-direction: column-reverse; }
    .form-actions .btn-action[b-30x9xk4mmj] { width: 100%; }
}

/* Dark Mode */
[data-theme="dark"] .form-card[b-30x9xk4mmj] { background-color: var(--bg-card); border-color: var(--border-color); }
[data-theme="dark"] .form-input[b-30x9xk4mmj] { background-color: rgba(255, 255, 255, 0.05); border-color: var(--border-color); }
/* _content/Geniar.Asistencias.Web/Pages/Empleados/Detalle.razor.rz.scp.css */
/* ============================================
   DETALLE EMPLEADO STYLES
   ============================================ */

.detail-page[b-24jrghnnx2] { display: flex; flex-direction: column; gap: 1.5rem; }

/* Loading & Error States */
.loading-state[b-24jrghnnx2], .error-card[b-24jrghnnx2] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 4rem 2rem; gap: 1rem; background-color: var(--bg-card); border: 1px solid var(--border-color); border-radius: var(--border-radius-xl); }
.loading-state[b-24jrghnnx2] { color: var(--text-secondary); }
.loading-state .spinner-border[b-24jrghnnx2] { width: 3rem; height: 3rem; }
.error-card[b-24jrghnnx2] { color: var(--color-danger); }
.error-card .material-icons[b-24jrghnnx2] { font-size: 48px; }

/* Page Header */
.page-header[b-24jrghnnx2] { display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 1rem; }
.page-header__info[b-24jrghnnx2] { flex: 1; }
.page-header__title[b-24jrghnnx2] { margin: 0 0 0.25rem 0; font-size: var(--font-size-3xl); font-weight: 700; color: var(--text-primary); }
.page-header__subtitle[b-24jrghnnx2] { margin: 0; font-size: var(--font-size-base); color: var(--text-secondary); }
.page-header__actions[b-24jrghnnx2] { display: flex; gap: 0.75rem; flex-wrap: wrap; }

/* Detail Layout */
.detail-layout[b-24jrghnnx2] { display: grid; grid-template-columns: 1fr 320px; gap: 1.5rem; }
.detail-main[b-24jrghnnx2] { display: flex; flex-direction: column; gap: 1.5rem; }
.detail-sidebar[b-24jrghnnx2] { display: flex; flex-direction: column; gap: 1.5rem; }

/* Employee Header Card */
.employee-header-card[b-24jrghnnx2] { display: flex; align-items: center; gap: 1.5rem; padding: 1.5rem; background-color: var(--bg-card); border: 1px solid var(--border-color); border-radius: var(--border-radius-xl); }
.employee-header-card__avatar[b-24jrghnnx2] { display: flex; align-items: center; justify-content: center; width: 80px; height: 80px; border-radius: 50%; background-color: var(--color-primary-bg); flex-shrink: 0; overflow: hidden; }
.employee-header-card__avatar img[b-24jrghnnx2] { width: 100%; height: 100%; object-fit: cover; }
.employee-header-card__avatar .material-icons[b-24jrghnnx2] { font-size: 40px; color: var(--color-primary); }
.employee-header-card__info[b-24jrghnnx2] { flex: 1; }
.employee-header-card__info h2[b-24jrghnnx2] { margin: 0 0 0.75rem 0; font-size: var(--font-size-xl); font-weight: 700; color: var(--text-primary); }
.employee-header-card__badges[b-24jrghnnx2] { display: flex; flex-wrap: wrap; gap: 0.5rem; }

/* Badges */
.badge-legajo[b-24jrghnnx2] { display: inline-flex; align-items: center; gap: 0.375rem; padding: 0.375rem 0.75rem; font-size: var(--font-size-sm); font-weight: 500; background-color: var(--bg-hover); color: var(--text-primary); border-radius: var(--border-radius); font-family: monospace; }
.badge-legajo .material-icons[b-24jrghnnx2] { font-size: 16px; color: var(--text-muted); }
.badge-status[b-24jrghnnx2] { display: inline-flex; align-items: center; padding: 0.375rem 0.75rem; font-size: var(--font-size-xs); font-weight: 600; border-radius: var(--border-radius); text-transform: uppercase; letter-spacing: 0.025em; }
.badge-status--activo[b-24jrghnnx2] { background-color: var(--color-success-bg); color: var(--color-success); }
.badge-status--inactivo[b-24jrghnnx2] { background-color: var(--bg-hover); color: var(--text-muted); }
.badge-status--suspendido[b-24jrghnnx2] { background-color: var(--color-warning-bg); color: var(--color-warning); }
.badge-area[b-24jrghnnx2] { display: inline-flex; align-items: center; gap: 0.375rem; padding: 0.375rem 0.75rem; font-size: var(--font-size-xs); font-weight: 500; color: white; border-radius: var(--border-radius); }
.badge-area .material-icons[b-24jrghnnx2] { font-size: 14px; }

/* Info Card */
.info-card[b-24jrghnnx2] { background-color: var(--bg-card); border: 1px solid var(--border-color); border-radius: var(--border-radius-xl); overflow: hidden; }
.info-card__header[b-24jrghnnx2] { display: flex; align-items: center; gap: 0.75rem; padding: 1rem 1.25rem; background-color: var(--bg-hover); border-bottom: 1px solid var(--border-color); }
.info-card__header .material-icons[b-24jrghnnx2] { font-size: 20px; color: var(--color-primary); }
.info-card__header h3[b-24jrghnnx2] { margin: 0; font-size: var(--font-size-base); font-weight: 600; color: var(--text-primary); }
.info-card__body[b-24jrghnnx2] { padding: 1.25rem; }

/* Info Grid */
.info-grid[b-24jrghnnx2] { display: grid; grid-template-columns: repeat(2, 1fr); gap: 1rem; }
.info-item[b-24jrghnnx2] { display: flex; flex-direction: column; gap: 0.25rem; }
.info-item--full[b-24jrghnnx2] { grid-column: 1 / -1; }
.info-item__label[b-24jrghnnx2] { font-size: var(--font-size-xs); font-weight: 500; color: var(--text-muted); text-transform: uppercase; letter-spacing: 0.025em; }
.info-item__value[b-24jrghnnx2] { font-size: var(--font-size-sm); color: var(--text-primary); }
.email-link[b-24jrghnnx2] { color: var(--color-primary); text-decoration: none; }
.email-link:hover[b-24jrghnnx2] { text-decoration: underline; }

/* Stats Card */
.stats-card[b-24jrghnnx2] { background-color: var(--bg-card); border: 1px solid var(--border-color); border-radius: var(--border-radius-xl); overflow: hidden; }
.stats-card__header[b-24jrghnnx2] { display: flex; align-items: center; gap: 0.75rem; padding: 1rem 1.25rem; background-color: var(--bg-hover); border-bottom: 1px solid var(--border-color); }
.stats-card__header .material-icons[b-24jrghnnx2] { font-size: 20px; color: var(--color-primary); }
.stats-card__header h3[b-24jrghnnx2] { margin: 0; font-size: var(--font-size-base); font-weight: 600; color: var(--text-primary); }
.stats-card__body[b-24jrghnnx2] { padding: 1rem; display: flex; flex-direction: column; gap: 1rem; }

/* Stat Item */
.stat-item[b-24jrghnnx2] { display: flex; align-items: center; gap: 0.75rem; padding: 0.75rem; background-color: var(--bg-hover); border-radius: var(--border-radius); }
.stat-item__icon[b-24jrghnnx2] { display: flex; align-items: center; justify-content: center; width: 40px; height: 40px; background-color: var(--color-primary-bg); border-radius: var(--border-radius); }
.stat-item__icon .material-icons[b-24jrghnnx2] { font-size: 20px; color: var(--color-primary); }
.stat-item__content[b-24jrghnnx2] { flex: 1; }
.stat-item__label[b-24jrghnnx2] { display: block; font-size: var(--font-size-xs); color: var(--text-muted); }
.stat-item__value[b-24jrghnnx2] { display: block; font-size: var(--font-size-sm); font-weight: 600; color: var(--text-primary); }

/* Sucursales & Empty Info */
.sucursales-count[b-24jrghnnx2], .empty-info[b-24jrghnnx2] { display: flex; align-items: center; gap: 0.5rem; padding: 0.75rem; background-color: var(--bg-hover); border-radius: var(--border-radius); font-size: var(--font-size-sm); }
.sucursales-count[b-24jrghnnx2] { color: var(--color-success); }
.sucursales-count .material-icons[b-24jrghnnx2] { font-size: 18px; }
.empty-info[b-24jrghnnx2] { color: var(--text-muted); }
.empty-info .material-icons[b-24jrghnnx2] { font-size: 18px; }

/* Buttons */
.btn-action[b-24jrghnnx2] { display: inline-flex; align-items: center; justify-content: center; gap: 0.5rem; padding: 0.625rem 1rem; font-size: var(--font-size-sm); font-weight: 500; border: none; border-radius: var(--border-radius); cursor: pointer; transition: all var(--transition-fast); text-decoration: none; }
.btn-action .material-icons[b-24jrghnnx2] { font-size: 18px; }
.btn-action--secondary[b-24jrghnnx2] { background-color: var(--bg-hover); color: var(--text-primary); border: 1px solid var(--border-color); }
.btn-action--secondary:hover[b-24jrghnnx2] { background-color: var(--border-color); }
.btn-action--info[b-24jrghnnx2] { background-color: rgba(6, 182, 212, 0.1); color: #06B6D4; }
.btn-action--info:hover[b-24jrghnnx2] { background-color: rgba(6, 182, 212, 0.2); }
.btn-action--warning[b-24jrghnnx2] { background-color: var(--color-warning-bg); color: var(--color-warning); }
.btn-action--warning:hover[b-24jrghnnx2] { background-color: rgba(245, 158, 11, 0.2); }

/* Responsive */
@media (max-width: 1024px) {
    .detail-layout[b-24jrghnnx2] { grid-template-columns: 1fr; }
    .detail-sidebar[b-24jrghnnx2] { order: -1; }
}
@media (max-width: 768px) {
    .page-header[b-24jrghnnx2] { flex-direction: column; align-items: flex-start; }
    .page-header__actions[b-24jrghnnx2] { width: 100%; flex-wrap: wrap; }
    .page-header__actions .btn-action[b-24jrghnnx2] { flex: 1; min-width: 120px; }
    .employee-header-card[b-24jrghnnx2] { flex-direction: column; text-align: center; }
    .employee-header-card__badges[b-24jrghnnx2] { justify-content: center; }
    .info-grid[b-24jrghnnx2] { grid-template-columns: 1fr; }
}

/* Dark Mode */
[data-theme="dark"] .employee-header-card[b-24jrghnnx2], [data-theme="dark"] .info-card[b-24jrghnnx2], [data-theme="dark"] .stats-card[b-24jrghnnx2], [data-theme="dark"] .loading-state[b-24jrghnnx2], [data-theme="dark"] .error-card[b-24jrghnnx2] { background-color: var(--bg-card); border-color: var(--border-color); }
[data-theme="dark"] .info-card__header[b-24jrghnnx2], [data-theme="dark"] .stats-card__header[b-24jrghnnx2] { background-color: rgba(255, 255, 255, 0.05); }
/* _content/Geniar.Asistencias.Web/Pages/Empleados/Editar.razor.rz.scp.css */
/* ============================================
   EDITAR EMPLEADO FORM STYLES
   ============================================ */

.form-page[b-gudr1cvtum] { display: flex; flex-direction: column; gap: 1.5rem; }

/* Loading State */
.loading-state[b-gudr1cvtum] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 4rem 2rem; gap: 1rem; background-color: var(--bg-card); border: 1px solid var(--border-color); border-radius: var(--border-radius-xl); color: var(--text-secondary); }
.loading-state .spinner-border[b-gudr1cvtum] { width: 3rem; height: 3rem; }

/* Page Header */
.page-header[b-gudr1cvtum] { display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 1rem; }
.page-header__info[b-gudr1cvtum] { flex: 1; }
.page-header__title[b-gudr1cvtum] { margin: 0 0 0.25rem 0; font-size: var(--font-size-3xl); font-weight: 700; color: var(--text-primary); }
.page-header__subtitle[b-gudr1cvtum] { margin: 0; font-size: var(--font-size-base); color: var(--text-secondary); }
.page-header__actions[b-gudr1cvtum] { display: flex; gap: 0.75rem; }

/* Form Card */
.form-card[b-gudr1cvtum] { background-color: var(--bg-card); border: 1px solid var(--border-color); border-radius: var(--border-radius-xl); padding: 1.5rem; }

/* Form Sections */
.form-section[b-gudr1cvtum] { padding: 1.5rem 0; border-bottom: 1px solid var(--border-color); }
.form-section:first-of-type[b-gudr1cvtum] { padding-top: 0; }
.form-section:last-of-type[b-gudr1cvtum] { border-bottom: none; }
.form-section__header[b-gudr1cvtum] { display: flex; align-items: center; gap: 0.75rem; margin-bottom: 1.25rem; }
.form-section__header .material-icons[b-gudr1cvtum] { font-size: 24px; color: var(--color-primary); }
.form-section__header h3[b-gudr1cvtum] { margin: 0; font-size: var(--font-size-lg); font-weight: 600; color: var(--text-primary); }

/* Form Grid */
.form-grid[b-gudr1cvtum] { display: grid; grid-template-columns: repeat(2, 1fr); gap: 1rem; margin-bottom: 1rem; }
.form-group[b-gudr1cvtum] { display: flex; flex-direction: column; gap: 0.375rem; }
.form-group--full[b-gudr1cvtum] { grid-column: 1 / -1; margin-bottom: 1rem; }

/* Form Elements */
.form-label[b-gudr1cvtum] { font-size: var(--font-size-sm); font-weight: 500; color: var(--text-primary); }
.form-label .required[b-gudr1cvtum] { color: var(--color-danger); }
.form-input[b-gudr1cvtum] { width: 100%; padding: 0.625rem 0.875rem; font-size: var(--font-size-sm); border: 1px solid var(--border-color); border-radius: var(--border-radius); background-color: var(--bg-card); color: var(--text-primary); transition: all var(--transition-fast); }
.form-input:focus[b-gudr1cvtum] { outline: none; border-color: var(--color-primary); box-shadow: 0 0 0 3px rgba(29, 78, 216, 0.1); }
.form-input--textarea[b-gudr1cvtum] { resize: vertical; min-height: 80px; }
.form-hint[b-gudr1cvtum] { font-size: var(--font-size-xs); color: var(--text-muted); }
.validation-message[b-gudr1cvtum] { font-size: var(--font-size-xs); color: var(--color-danger); }

/* Alert Card */
.alert-card[b-gudr1cvtum] { display: flex; align-items: flex-start; gap: 0.75rem; padding: 1rem; border-radius: var(--border-radius); margin-bottom: 1.5rem; }
.alert-card .material-icons[b-gudr1cvtum] { font-size: 20px; flex-shrink: 0; margin-top: 0.125rem; }
.alert-card--danger[b-gudr1cvtum] { background-color: var(--color-danger-bg); border: 1px solid var(--color-danger); }
.alert-card--danger .material-icons[b-gudr1cvtum] { color: var(--color-danger); }
.alert-card__content[b-gudr1cvtum] { flex: 1; }
.alert-card__content p[b-gudr1cvtum] { margin: 0 0 0.5rem 0; font-size: var(--font-size-sm); color: var(--text-primary); }
.alert-card__content ul[b-gudr1cvtum] { margin: 0; padding-left: 1.25rem; font-size: var(--font-size-sm); color: var(--text-secondary); }

/* Form Actions */
.form-actions[b-gudr1cvtum] { display: flex; justify-content: flex-end; gap: 0.75rem; padding-top: 1.5rem; border-top: 1px solid var(--border-color); margin-top: 0.5rem; }

/* Buttons */
.btn-action[b-gudr1cvtum] { display: inline-flex; align-items: center; justify-content: center; gap: 0.5rem; padding: 0.625rem 1.25rem; font-size: var(--font-size-sm); font-weight: 500; border: none; border-radius: var(--border-radius); cursor: pointer; transition: all var(--transition-fast); text-decoration: none; }
.btn-action .material-icons[b-gudr1cvtum] { font-size: 18px; }
.btn-action:disabled[b-gudr1cvtum] { opacity: 0.6; cursor: not-allowed; }
.btn-action--primary[b-gudr1cvtum] { background-color: var(--color-primary); color: white; }
.btn-action--primary:hover:not(:disabled)[b-gudr1cvtum] { background-color: var(--color-primary-hover); }
.btn-action--secondary[b-gudr1cvtum] { background-color: var(--bg-hover); color: var(--text-primary); border: 1px solid var(--border-color); }
.btn-action--secondary:hover:not(:disabled)[b-gudr1cvtum] { background-color: var(--border-color); }

/* Responsive */
@media (max-width: 768px) {
    .page-header[b-gudr1cvtum] { flex-direction: column; align-items: flex-start; }
    .form-grid[b-gudr1cvtum] { grid-template-columns: 1fr; }
    .form-actions[b-gudr1cvtum] { flex-direction: column-reverse; }
    .form-actions .btn-action[b-gudr1cvtum] { width: 100%; }
}

/* Dark Mode */
[data-theme="dark"] .form-card[b-gudr1cvtum], [data-theme="dark"] .loading-state[b-gudr1cvtum] { background-color: var(--bg-card); border-color: var(--border-color); }
[data-theme="dark"] .form-input[b-gudr1cvtum] { background-color: rgba(255, 255, 255, 0.05); border-color: var(--border-color); }
/* _content/Geniar.Asistencias.Web/Pages/Empleados/ImportarMasivo.razor.rz.scp.css */
/* ============================================
   IMPORTAR MASIVO STYLES
   ============================================ */

.import-page[b-1xm3829vy1] { display: flex; flex-direction: column; gap: 1.5rem; }

/* Page Header */
.page-header[b-1xm3829vy1] { display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 1rem; }
.page-header__info[b-1xm3829vy1] { flex: 1; }
.page-header__title[b-1xm3829vy1] { margin: 0 0 0.25rem 0; font-size: var(--font-size-3xl); font-weight: 700; color: var(--text-primary); }
.page-header__subtitle[b-1xm3829vy1] { margin: 0; font-size: var(--font-size-base); color: var(--text-secondary); }
.page-header__actions[b-1xm3829vy1] { display: flex; gap: 0.75rem; }

/* Info Card */
.info-card[b-1xm3829vy1] { background-color: var(--bg-card); border: 1px solid var(--border-color); border-radius: var(--border-radius-xl); overflow: hidden; }
.info-card--primary[b-1xm3829vy1] { border-color: var(--color-primary); }
.info-card__header[b-1xm3829vy1] { display: flex; align-items: center; gap: 0.75rem; padding: 1rem 1.25rem; background-color: var(--color-primary-bg); border-bottom: 1px solid var(--border-color); }
.info-card--primary .info-card__header[b-1xm3829vy1] { background-color: var(--color-primary-bg); }
.info-card__header .material-icons[b-1xm3829vy1] { font-size: 24px; color: var(--color-primary); }
.info-card__header h3[b-1xm3829vy1] { margin: 0; font-size: var(--font-size-base); font-weight: 600; color: var(--text-primary); }
.info-card__body[b-1xm3829vy1] { padding: 1.25rem; }
.instructions-list[b-1xm3829vy1] { margin: 0; padding-left: 1.5rem; font-size: var(--font-size-sm); color: var(--text-secondary); line-height: 1.8; }
.instructions-list li[b-1xm3829vy1] { margin-bottom: 0.25rem; }
.instructions-list strong[b-1xm3829vy1] { color: var(--text-primary); }

/* Templates Grid */
.templates-grid[b-1xm3829vy1] { display: grid; grid-template-columns: repeat(2, 1fr); gap: 1.25rem; }

/* Template Card */
.template-card[b-1xm3829vy1] { display: flex; flex-direction: column; align-items: center; gap: 1rem; padding: 2rem; background-color: var(--bg-card); border: 1px solid var(--border-color); border-radius: var(--border-radius-xl); text-align: center; }
.template-card__icon[b-1xm3829vy1] { display: flex; align-items: center; justify-content: center; width: 64px; height: 64px; border-radius: 50%; }
.template-card__icon .material-icons[b-1xm3829vy1] { font-size: 32px; }
.template-card__icon--excel[b-1xm3829vy1] { background-color: var(--color-success-bg); color: var(--color-success); }
.template-card__icon--csv[b-1xm3829vy1] { background-color: var(--color-primary-bg); color: var(--color-primary); }
.template-card__title[b-1xm3829vy1] { margin: 0; font-size: var(--font-size-lg); font-weight: 600; color: var(--text-primary); }
.template-card__description[b-1xm3829vy1] { margin: 0; font-size: var(--font-size-sm); color: var(--text-muted); }

/* Upload Card */
.upload-card[b-1xm3829vy1] { background-color: var(--bg-card); border: 1px solid var(--border-color); border-radius: var(--border-radius-xl); overflow: hidden; }
.upload-card__header[b-1xm3829vy1] { display: flex; align-items: center; gap: 0.75rem; padding: 1rem 1.25rem; background-color: var(--bg-hover); border-bottom: 1px solid var(--border-color); }
.upload-card__header .material-icons[b-1xm3829vy1] { font-size: 24px; color: var(--color-primary); }
.upload-card__header h3[b-1xm3829vy1] { margin: 0; font-size: var(--font-size-base); font-weight: 600; color: var(--text-primary); }
.upload-card__body[b-1xm3829vy1] { padding: 1.25rem; }
.upload-card__footer[b-1xm3829vy1] { display: flex; gap: 0.75rem; padding: 1rem 1.25rem; border-top: 1px solid var(--border-color); flex-wrap: wrap; }

/* Upload Zone */
.upload-zone[b-1xm3829vy1] { position: relative; border: 2px dashed var(--border-color); border-radius: var(--border-radius); padding: 2rem; text-align: center; transition: all var(--transition-fast); }
.upload-zone:hover[b-1xm3829vy1] { border-color: var(--color-primary); background-color: var(--color-primary-bg); }
.upload-input[b-1xm3829vy1] { position: absolute; inset: 0; opacity: 0; cursor: pointer; }
.upload-zone__content[b-1xm3829vy1] { pointer-events: none; }
.upload-zone__content .material-icons[b-1xm3829vy1] { font-size: 48px; color: var(--text-muted); }
.upload-zone__content p[b-1xm3829vy1] { margin: 0.75rem 0 0.25rem; font-size: var(--font-size-sm); color: var(--text-secondary); }
.upload-zone__hint[b-1xm3829vy1] { font-size: var(--font-size-xs); color: var(--text-muted); }

/* File Selected */
.file-selected[b-1xm3829vy1] { display: flex; align-items: center; gap: 0.75rem; margin-top: 1rem; padding: 0.75rem 1rem; background-color: var(--color-success-bg); border-radius: var(--border-radius); }
.file-selected .material-icons[b-1xm3829vy1] { font-size: 24px; color: var(--color-success); }
.file-selected__info[b-1xm3829vy1] { display: flex; flex-direction: column; }
.file-selected__name[b-1xm3829vy1] { font-size: var(--font-size-sm); font-weight: 500; color: var(--text-primary); }
.file-selected__size[b-1xm3829vy1] { font-size: var(--font-size-xs); color: var(--text-muted); }

/* Processing State */
.processing-state[b-1xm3829vy1] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 4rem 2rem; gap: 1rem; background-color: var(--bg-card); border: 1px solid var(--border-color); border-radius: var(--border-radius-xl); text-align: center; }
.processing-state .spinner-border[b-1xm3829vy1] { width: 3rem; height: 3rem; }
.processing-state h3[b-1xm3829vy1] { margin: 0; font-size: var(--font-size-lg); color: var(--text-primary); }
.processing-state p[b-1xm3829vy1] { margin: 0; font-size: var(--font-size-sm); color: var(--text-muted); }

/* Results Card */
.results-card[b-1xm3829vy1] { background-color: var(--bg-card); border: 1px solid var(--border-color); border-radius: var(--border-radius-xl); overflow: hidden; }
.results-card--success[b-1xm3829vy1] { border-color: var(--color-success); }
.results-card--warning[b-1xm3829vy1] { border-color: var(--color-warning); }
.results-card__header[b-1xm3829vy1] { display: flex; align-items: center; gap: 0.75rem; padding: 1rem 1.25rem; }
.results-card--success .results-card__header[b-1xm3829vy1] { background-color: var(--color-success); color: white; }
.results-card--warning .results-card__header[b-1xm3829vy1] { background-color: var(--color-warning); color: white; }
.results-card__header .material-icons[b-1xm3829vy1] { font-size: 24px; }
.results-card__header h3[b-1xm3829vy1] { margin: 0; font-size: var(--font-size-lg); font-weight: 600; }
.results-card__body[b-1xm3829vy1] { padding: 1.25rem; }

/* Results Stats */
.results-stats[b-1xm3829vy1] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 1rem; margin-bottom: 1.25rem; }
.result-stat[b-1xm3829vy1] { display: flex; flex-direction: column; align-items: center; padding: 1rem; background-color: var(--bg-hover); border-radius: var(--border-radius); text-align: center; }
.result-stat__value[b-1xm3829vy1] { font-size: var(--font-size-2xl); font-weight: 700; color: var(--text-primary); }
.result-stat__label[b-1xm3829vy1] { font-size: var(--font-size-xs); color: var(--text-muted); margin-top: 0.25rem; }
.result-stat--success .result-stat__value[b-1xm3829vy1] { color: var(--color-success); }
.result-stat--danger .result-stat__value[b-1xm3829vy1] { color: var(--color-danger); }

.results-message[b-1xm3829vy1] { margin: 0 0 1.25rem 0; font-size: var(--font-size-sm); font-weight: 500; color: var(--text-primary); }

/* Results Section */
.results-section[b-1xm3829vy1] { margin-bottom: 1rem; border: 1px solid var(--border-color); border-radius: var(--border-radius); overflow: hidden; }
.results-section--success[b-1xm3829vy1] { border-color: var(--color-success); }
.results-section--danger[b-1xm3829vy1] { border-color: var(--color-danger); }
.results-section__header[b-1xm3829vy1] { display: flex; align-items: center; gap: 0.5rem; padding: 0.75rem 1rem; font-size: var(--font-size-sm); font-weight: 600; }
.results-section--success .results-section__header[b-1xm3829vy1] { background-color: var(--color-success-bg); color: var(--color-success); }
.results-section--danger .results-section__header[b-1xm3829vy1] { background-color: var(--color-danger-bg); color: var(--color-danger); }
.results-section__header .material-icons[b-1xm3829vy1] { font-size: 18px; }
.results-section__body[b-1xm3829vy1] { max-height: 300px; overflow-y: auto; }

/* Table */
.table-container[b-1xm3829vy1] { overflow-x: auto; }
.data-table[b-1xm3829vy1] { width: 100%; border-collapse: collapse; font-size: var(--font-size-sm); }
.data-table th[b-1xm3829vy1] { padding: 0.75rem 1rem; text-align: left; font-weight: 600; color: var(--text-primary); background-color: var(--bg-hover); border-bottom: 1px solid var(--border-color); position: sticky; top: 0; }
.data-table td[b-1xm3829vy1] { padding: 0.75rem 1rem; border-bottom: 1px solid var(--border-color); color: var(--text-primary); }
.data-table tbody tr:hover[b-1xm3829vy1] { background-color: var(--bg-hover); }
.data-table code[b-1xm3829vy1] { padding: 0.125rem 0.375rem; background-color: var(--bg-hover); border-radius: var(--border-radius-sm); font-size: var(--font-size-xs); }

/* Badges */
.legajo-badge[b-1xm3829vy1] { display: inline-block; padding: 0.25rem 0.5rem; font-size: var(--font-size-xs); font-weight: 500; background-color: var(--bg-hover); color: var(--text-primary); border-radius: var(--border-radius); font-family: monospace; }
.error-badge[b-1xm3829vy1] { display: inline-block; padding: 0.25rem 0.5rem; font-size: var(--font-size-xs); font-weight: 500; border-radius: var(--border-radius); }
.error-badge--warning[b-1xm3829vy1] { background-color: var(--color-warning-bg); color: var(--color-warning); }
.error-badge--danger[b-1xm3829vy1] { background-color: var(--color-danger-bg); color: var(--color-danger); }
.error-badge--info[b-1xm3829vy1] { background-color: rgba(6, 182, 212, 0.1); color: #06B6D4; }
.error-badge--dark[b-1xm3829vy1] { background-color: var(--bg-hover); color: var(--text-primary); }
.error-badge--secondary[b-1xm3829vy1] { background-color: var(--bg-hover); color: var(--text-muted); }

/* Results Actions */
.results-actions[b-1xm3829vy1] { display: flex; gap: 0.75rem; margin-top: 1.25rem; padding-top: 1.25rem; border-top: 1px solid var(--border-color); }

/* Buttons */
.btn-action[b-1xm3829vy1] { display: inline-flex; align-items: center; justify-content: center; gap: 0.5rem; padding: 0.625rem 1.25rem; font-size: var(--font-size-sm); font-weight: 500; border: none; border-radius: var(--border-radius); cursor: pointer; transition: all var(--transition-fast); text-decoration: none; }
.btn-action .material-icons[b-1xm3829vy1] { font-size: 18px; }
.btn-action:disabled[b-1xm3829vy1] { opacity: 0.6; cursor: not-allowed; }
.btn-action--primary[b-1xm3829vy1] { background-color: var(--color-primary); color: white; }
.btn-action--primary:hover:not(:disabled)[b-1xm3829vy1] { background-color: var(--color-primary-hover); }
.btn-action--success[b-1xm3829vy1] { background-color: var(--color-success); color: white; }
.btn-action--success:hover:not(:disabled)[b-1xm3829vy1] { opacity: 0.9; }
.btn-action--warning[b-1xm3829vy1] { background-color: var(--color-warning); color: white; }
.btn-action--warning:hover:not(:disabled)[b-1xm3829vy1] { opacity: 0.9; }
.btn-action--secondary[b-1xm3829vy1] { background-color: var(--bg-hover); color: var(--text-primary); border: 1px solid var(--border-color); }
.btn-action--secondary:hover:not(:disabled)[b-1xm3829vy1] { background-color: var(--border-color); }

/* Responsive */
@media (max-width: 1024px) { .results-stats[b-1xm3829vy1] { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 768px) {
    .page-header[b-1xm3829vy1] { flex-direction: column; align-items: flex-start; }
    .templates-grid[b-1xm3829vy1] { grid-template-columns: 1fr; }
    .upload-card__footer[b-1xm3829vy1] { flex-direction: column; }
    .upload-card__footer .btn-action[b-1xm3829vy1] { width: 100%; }
    .results-stats[b-1xm3829vy1] { grid-template-columns: 1fr 1fr; }
    .results-actions[b-1xm3829vy1] { flex-direction: column; }
    .results-actions .btn-action[b-1xm3829vy1] { width: 100%; }
}

/* Dark Mode */
[data-theme="dark"] .info-card[b-1xm3829vy1], [data-theme="dark"] .template-card[b-1xm3829vy1], [data-theme="dark"] .upload-card[b-1xm3829vy1], [data-theme="dark"] .processing-state[b-1xm3829vy1], [data-theme="dark"] .results-card[b-1xm3829vy1] { background-color: var(--bg-card); border-color: var(--border-color); }
[data-theme="dark"] .upload-card__header[b-1xm3829vy1], [data-theme="dark"] .data-table th[b-1xm3829vy1] { background-color: rgba(255, 255, 255, 0.05); }
/* _content/Geniar.Asistencias.Web/Pages/Empleados/Index.razor.rz.scp.css */
/* ============================================
   EMPLEADOS PAGE STYLES
   ============================================ */

.empleados-page[b-vza70677hg] {
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
}

/* ============================================
   PAGE HEADER
   ============================================ */

.page-header[b-vza70677hg] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    gap: 1rem;
}

.page-header__info[b-vza70677hg] {
    flex: 1;
}

.page-header__title[b-vza70677hg] {
    margin: 0 0 0.25rem 0;
    font-size: var(--font-size-3xl);
    font-weight: 700;
    color: var(--text-primary);
}

.page-header__subtitle[b-vza70677hg] {
    margin: 0;
    font-size: var(--font-size-base);
    color: var(--text-secondary);
}

.page-header__actions[b-vza70677hg] {
    display: flex;
    gap: 0.75rem;
}

/* Action Buttons */
.btn-action[b-vza70677hg] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.625rem 1.25rem;
    font-size: var(--font-size-sm);
    font-weight: 500;
    border: none;
    border-radius: var(--border-radius);
    cursor: pointer;
    transition: all var(--transition-fast);
}

.btn-action .material-icons[b-vza70677hg] {
    font-size: 20px;
}

.btn-action--primary[b-vza70677hg] {
    background-color: var(--color-primary);
    color: white;
    box-shadow: 0 4px 14px 0 rgba(29, 78, 216, 0.3);
}

.btn-action--primary:hover[b-vza70677hg] {
    background-color: var(--color-primary-hover);
}

.btn-action--success[b-vza70677hg] {
    background-color: var(--color-success);
    color: white;
    box-shadow: 0 4px 14px 0 rgba(16, 185, 129, 0.3);
}

.btn-action--success:hover[b-vza70677hg] {
    background-color: var(--color-success-hover);
}

/* ============================================
   FILTER CARD
   ============================================ */

.filter-card[b-vza70677hg] {
    background-color: var(--bg-card);
    border: 1px solid var(--border-color);
    border-radius: var(--border-radius-xl);
    overflow: hidden;
}

.filter-card__header[b-vza70677hg] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.875rem 1.25rem;
    background-color: var(--bg-hover);
    border-bottom: 1px solid var(--border-color);
    font-size: var(--font-size-sm);
    font-weight: 600;
    color: var(--text-secondary);
}

.filter-card__header .material-icons[b-vza70677hg] {
    font-size: 18px;
}

.filter-card__body[b-vza70677hg] {
    padding: 1.25rem;
}

.filter-grid[b-vza70677hg] {
    display: grid;
    grid-template-columns: 2fr 1fr 1fr auto;
    gap: 1rem;
    align-items: end;
}

.filter-group[b-vza70677hg] {
    display: flex;
    flex-direction: column;
    gap: 0.375rem;
}

.filter-label[b-vza70677hg] {
    font-size: var(--font-size-xs);
    font-weight: 500;
    color: var(--text-secondary);
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

.filter-input-wrapper[b-vza70677hg] {
    position: relative;
}

.filter-input-icon[b-vza70677hg] {
    position: absolute;
    left: 0.75rem;
    top: 50%;
    transform: translateY(-50%);
    font-size: 20px;
    color: var(--text-muted);
}

.filter-input[b-vza70677hg] {
    width: 100%;
    padding: 0.625rem 0.75rem 0.625rem 2.5rem;
    font-size: var(--font-size-sm);
    border: 1px solid var(--border-color);
    border-radius: var(--border-radius);
    background-color: var(--bg-card);
    color: var(--text-primary);
    transition: border-color var(--transition-fast);
}

.filter-input:focus[b-vza70677hg] {
    outline: none;
    border-color: var(--color-primary);
    box-shadow: 0 0 0 3px var(--color-primary-bg);
}

.filter-select[b-vza70677hg] {
    width: 100%;
    padding: 0.625rem 0.75rem;
    font-size: var(--font-size-sm);
    border: 1px solid var(--border-color);
    border-radius: var(--border-radius);
    background-color: var(--bg-card);
    color: var(--text-primary);
    cursor: pointer;
    transition: border-color var(--transition-fast);
}

.filter-select:focus[b-vza70677hg] {
    outline: none;
    border-color: var(--color-primary);
    box-shadow: 0 0 0 3px var(--color-primary-bg);
}

.filter-group--actions[b-vza70677hg] {
    display: flex;
    flex-direction: row;
    align-items: flex-end;
}

.btn-filter[b-vza70677hg] {
    display: inline-flex;
    align-items: center;
    gap: 0.375rem;
    padding: 0.625rem 1rem;
    font-size: var(--font-size-sm);
    font-weight: 500;
    border: 1px solid var(--border-color);
    border-radius: var(--border-radius);
    cursor: pointer;
    transition: all var(--transition-fast);
}

.btn-filter .material-icons[b-vza70677hg] {
    font-size: 18px;
}

.btn-filter--clear[b-vza70677hg] {
    background-color: transparent;
    color: var(--text-secondary);
}

.btn-filter--clear:hover[b-vza70677hg] {
    background-color: var(--bg-hover);
    border-color: var(--border-color-dark);
}

/* ============================================
   LOADING STATE
   ============================================ */

.loading-state[b-vza70677hg] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 4rem 2rem;
    gap: 1rem;
    color: var(--text-secondary);
}

.loading-state .spinner-border[b-vza70677hg] {
    width: 3rem;
    height: 3rem;
}

/* ============================================
   TABLE CARD
   ============================================ */

.table-card[b-vza70677hg] {
    background-color: var(--bg-card);
    border: 1px solid var(--border-color);
    border-radius: var(--border-radius-xl);
    overflow: hidden;
}

.data-table[b-vza70677hg] {
    width: 100%;
    border-collapse: collapse;
}

.data-table thead[b-vza70677hg] {
    background-color: var(--bg-hover);
}

.data-table th[b-vza70677hg] {
    padding: 0.875rem 1rem;
    font-size: var(--font-size-xs);
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: var(--text-secondary);
    text-align: left;
    border-bottom: 1px solid var(--border-color);
}

.data-table td[b-vza70677hg] {
    padding: 1rem;
    font-size: var(--font-size-sm);
    color: var(--text-primary);
    border-bottom: 1px solid var(--border-color);
    vertical-align: middle;
}

.data-table tbody tr[b-vza70677hg] {
    transition: background-color var(--transition-fast);
}

.data-table tbody tr:hover[b-vza70677hg] {
    background-color: var(--bg-hover);
}

.data-table tbody tr:last-child td[b-vza70677hg] {
    border-bottom: none;
}

/* Empleado Cell (Avatar + Info) */
.empleado-cell[b-vza70677hg] {
    display: flex;
    align-items: center;
    gap: 0.875rem;
}

.empleado-avatar[b-vza70677hg] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    border-radius: 50%;
    font-size: var(--font-size-sm);
    font-weight: 600;
    color: white;
    flex-shrink: 0;
}

.empleado-info[b-vza70677hg] {
    display: flex;
    flex-direction: column;
    gap: 0.125rem;
}

.empleado-nombre[b-vza70677hg] {
    font-weight: 500;
    color: var(--text-primary);
}

.empleado-email[b-vza70677hg] {
    font-size: var(--font-size-xs);
    color: var(--text-muted);
}

/* Legajo Badge */
.legajo-badge[b-vza70677hg] {
    display: inline-block;
    padding: 0.25rem 0.625rem;
    font-size: var(--font-size-xs);
    font-weight: 500;
    font-family: monospace;
    background-color: var(--bg-hover);
    border-radius: var(--border-radius);
    color: var(--text-secondary);
}

/* Area Badge */
.area-badge[b-vza70677hg] {
    display: inline-block;
    padding: 0.25rem 0.75rem;
    font-size: var(--font-size-xs);
    font-weight: 500;
    border-radius: 9999px;
    background-color: color-mix(in srgb, var(--area-color) 15%, transparent);
    color: var(--area-color);
    border: 1px solid color-mix(in srgb, var(--area-color) 30%, transparent);
}

/* Status Badges */
.status-badge[b-vza70677hg] {
    display: inline-block;
    padding: 0.25rem 0.75rem;
    font-size: var(--font-size-xs);
    font-weight: 500;
    border-radius: 9999px;
}

.status-badge--activo[b-vza70677hg] {
    background-color: var(--color-success-bg);
    color: var(--color-success);
}

.status-badge--inactivo[b-vza70677hg] {
    background-color: var(--bg-hover);
    color: var(--text-secondary);
}

.status-badge--suspendido[b-vza70677hg] {
    background-color: var(--color-warning-bg);
    color: var(--color-warning);
}

/* Action Buttons */
.action-buttons[b-vza70677hg] {
    display: flex;
    justify-content: center;
    gap: 0.5rem;
}

.action-btn[b-vza70677hg] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    border: 1px solid var(--border-color);
    border-radius: var(--border-radius);
    background-color: transparent;
    cursor: pointer;
    transition: all var(--transition-fast);
}

.action-btn .material-icons[b-vza70677hg] {
    font-size: 18px;
}

.action-btn--view[b-vza70677hg] {
    color: var(--color-primary);
}

.action-btn--view:hover[b-vza70677hg] {
    background-color: var(--color-primary-bg);
    border-color: var(--color-primary);
}

.action-btn--edit[b-vza70677hg] {
    color: var(--color-warning);
}

.action-btn--edit:hover[b-vza70677hg] {
    background-color: var(--color-warning-bg);
    border-color: var(--color-warning);
}

/* Table Footer */
.table-footer[b-vza70677hg] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 1rem 1.25rem;
    border-top: 1px solid var(--border-color);
    background-color: var(--bg-hover);
}

.table-footer__count[b-vza70677hg] {
    font-size: var(--font-size-sm);
    color: var(--text-secondary);
}

.table-footer__count strong[b-vza70677hg] {
    color: var(--text-primary);
}

/* ============================================
   RESPONSIVE
   ============================================ */

@media (max-width: 1024px) {
    .filter-grid[b-vza70677hg] {
        grid-template-columns: 1fr 1fr;
    }

    .filter-group--actions[b-vza70677hg] {
        grid-column: span 2;
        justify-content: flex-end;
    }
}

@media (max-width: 768px) {
    .page-header[b-vza70677hg] {
        flex-direction: column;
        align-items: flex-start;
    }

    .page-header__actions[b-vza70677hg] {
        width: 100%;
    }

    .btn-action[b-vza70677hg] {
        flex: 1;
        justify-content: center;
    }

    .filter-grid[b-vza70677hg] {
        grid-template-columns: 1fr;
    }

    .filter-group--actions[b-vza70677hg] {
        grid-column: 1;
    }

    .data-table th:nth-child(3)[b-vza70677hg],
    .data-table td:nth-child(3)[b-vza70677hg] {
        display: none;
    }

    .empleado-email[b-vza70677hg] {
        display: none;
    }
}

@media (max-width: 640px) {
    .page-header__title[b-vza70677hg] {
        font-size: var(--font-size-2xl);
    }

    .data-table th:nth-child(4)[b-vza70677hg],
    .data-table td:nth-child(4)[b-vza70677hg] {
        display: none;
    }
}

/* ============================================
   DARK MODE
   ============================================ */

[data-theme="dark"] .filter-card[b-vza70677hg] {
    background-color: var(--bg-card);
    border-color: var(--border-color);
}

[data-theme="dark"] .filter-card__header[b-vza70677hg] {
    background-color: rgba(255, 255, 255, 0.05);
}

[data-theme="dark"] .filter-input[b-vza70677hg],
[data-theme="dark"] .filter-select[b-vza70677hg] {
    background-color: var(--bg-card);
    border-color: var(--border-color);
}

[data-theme="dark"] .table-card[b-vza70677hg] {
    background-color: var(--bg-card);
    border-color: var(--border-color);
}

[data-theme="dark"] .data-table thead[b-vza70677hg] {
    background-color: rgba(255, 255, 255, 0.05);
}

[data-theme="dark"] .legajo-badge[b-vza70677hg] {
    background-color: rgba(255, 255, 255, 0.1);
}

[data-theme="dark"] .table-footer[b-vza70677hg] {
    background-color: rgba(255, 255, 255, 0.05);
}
/* _content/Geniar.Asistencias.Web/Pages/Empleados/Selfies.razor.rz.scp.css */
/* ============================================
   SELFIES GALLERY STYLES
   ============================================ */

.gallery-page[b-j18eklb1u9] { display: flex; flex-direction: column; gap: 1.5rem; }

/* Page Header */
.page-header[b-j18eklb1u9] { display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 1rem; }
.page-header__info[b-j18eklb1u9] { flex: 1; }
.page-header__title[b-j18eklb1u9] { margin: 0 0 0.25rem 0; font-size: var(--font-size-3xl); font-weight: 700; color: var(--text-primary); }
.page-header__subtitle[b-j18eklb1u9] { margin: 0; font-size: var(--font-size-base); color: var(--text-secondary); }
.page-header__actions[b-j18eklb1u9] { display: flex; gap: 0.75rem; }

/* Loading & Error States */
.loading-state[b-j18eklb1u9], .error-card[b-j18eklb1u9] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 4rem 2rem; gap: 1rem; background-color: var(--bg-card); border: 1px solid var(--border-color); border-radius: var(--border-radius-xl); }
.loading-state[b-j18eklb1u9] { color: var(--text-secondary); }
.loading-state .spinner-border[b-j18eklb1u9] { width: 3rem; height: 3rem; }
.error-card[b-j18eklb1u9] { color: var(--color-danger); }
.error-card .material-icons[b-j18eklb1u9] { font-size: 48px; }

/* Filter Card */
.filter-card[b-j18eklb1u9] { background-color: var(--bg-card); border: 1px solid var(--border-color); border-radius: var(--border-radius-xl); padding: 1.25rem; }
.filter-grid[b-j18eklb1u9] { display: flex; gap: 1rem; align-items: flex-end; flex-wrap: wrap; }
.filter-grid .form-group[b-j18eklb1u9] { flex: 1; min-width: 150px; margin: 0; }
.filter-actions[b-j18eklb1u9] { display: flex; gap: 0.5rem; }

/* Form Styles */
.form-label[b-j18eklb1u9] { display: flex; align-items: center; gap: 0.375rem; margin-bottom: 0.5rem; font-size: var(--font-size-sm); font-weight: 500; color: var(--text-primary); }
.form-label .material-icons[b-j18eklb1u9] { font-size: 16px; color: var(--color-primary); }
.form-input[b-j18eklb1u9] { width: 100%; padding: 0.625rem 0.875rem; font-size: var(--font-size-sm); border: 1px solid var(--border-color); border-radius: var(--border-radius); background-color: var(--bg-card); color: var(--text-primary); }
.form-input:focus[b-j18eklb1u9] { outline: none; border-color: var(--color-primary); box-shadow: 0 0 0 3px rgba(29, 78, 216, 0.1); }

/* Filter Buttons */
.btn-filter[b-j18eklb1u9] { display: inline-flex; align-items: center; justify-content: center; gap: 0.5rem; padding: 0.625rem 1rem; font-size: var(--font-size-sm); font-weight: 500; border: none; border-radius: var(--border-radius); cursor: pointer; transition: all var(--transition-fast); }
.btn-filter .material-icons[b-j18eklb1u9] { font-size: 18px; }
.btn-filter--secondary[b-j18eklb1u9] { background-color: var(--bg-hover); color: var(--text-primary); border: 1px solid var(--border-color); }
.btn-filter--secondary:hover[b-j18eklb1u9] { background-color: var(--border-color); }

/* Gallery Counter */
.gallery-counter[b-j18eklb1u9] { display: flex; align-items: center; gap: 0.5rem; padding: 0.75rem 1rem; background-color: var(--color-primary-bg); color: var(--color-primary); border-radius: var(--border-radius); font-size: var(--font-size-sm); font-weight: 500; }
.gallery-counter .material-icons[b-j18eklb1u9] { font-size: 18px; }

/* Gallery Grid */
.gallery-grid[b-j18eklb1u9] { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 1.25rem; }

/* Selfie Card */
.selfie-card[b-j18eklb1u9] { background-color: var(--bg-card); border: 1px solid var(--border-color); border-radius: var(--border-radius-xl); overflow: hidden; cursor: pointer; transition: all var(--transition-fast); }
.selfie-card:hover[b-j18eklb1u9] { transform: translateY(-4px); box-shadow: 0 10px 25px rgba(0, 0, 0, 0.1); }
.selfie-card__image[b-j18eklb1u9] { position: relative; height: 200px; overflow: hidden; }
.selfie-card__image img[b-j18eklb1u9] { width: 100%; height: 100%; object-fit: cover; transition: transform var(--transition-base); }
.selfie-card:hover .selfie-card__image img[b-j18eklb1u9] { transform: scale(1.05); }
.selfie-card__status[b-j18eklb1u9] { position: absolute; top: 0.75rem; right: 0.75rem; display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.375rem 0.625rem; font-size: var(--font-size-xs); font-weight: 500; border-radius: var(--border-radius); }
.selfie-card__status .material-icons[b-j18eklb1u9] { font-size: 14px; }
.selfie-card__status--success[b-j18eklb1u9] { background-color: var(--color-success); color: white; }
.selfie-card__status--warning[b-j18eklb1u9] { background-color: var(--color-warning); color: white; }
.selfie-card__content[b-j18eklb1u9] { padding: 1rem; display: flex; flex-direction: column; gap: 0.5rem; }
.selfie-card__date[b-j18eklb1u9], .selfie-card__time[b-j18eklb1u9], .selfie-card__location[b-j18eklb1u9] { display: flex; align-items: center; gap: 0.375rem; font-size: var(--font-size-sm); color: var(--text-secondary); }
.selfie-card__date .material-icons[b-j18eklb1u9], .selfie-card__time .material-icons[b-j18eklb1u9], .selfie-card__location .material-icons[b-j18eklb1u9] { font-size: 16px; color: var(--text-muted); }
.selfie-card__badges[b-j18eklb1u9] { display: flex; flex-wrap: wrap; gap: 0.5rem; margin-top: 0.25rem; }

/* Badges */
.type-badge[b-j18eklb1u9] { display: inline-flex; align-items: center; padding: 0.25rem 0.5rem; font-size: var(--font-size-xs); font-weight: 500; border-radius: var(--border-radius); }
.type-badge--entry[b-j18eklb1u9] { background-color: rgba(6, 182, 212, 0.1); color: #06B6D4; }
.type-badge--exit[b-j18eklb1u9] { background-color: var(--bg-hover); color: var(--text-muted); }
.minutes-badge[b-j18eklb1u9] { display: inline-flex; align-items: center; padding: 0.25rem 0.5rem; font-size: var(--font-size-xs); font-weight: 500; background-color: var(--color-warning-bg); color: var(--color-warning); border-radius: var(--border-radius); }

/* Empty State */
.empty-state[b-j18eklb1u9] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 4rem 2rem; gap: 1rem; background-color: var(--bg-card); border: 1px solid var(--border-color); border-radius: var(--border-radius-xl); }
.empty-state .material-icons[b-j18eklb1u9] { font-size: 64px; color: var(--text-muted); }
.empty-state p[b-j18eklb1u9] { margin: 0; font-size: var(--font-size-base); color: var(--text-muted); }

/* Modal */
.modal-overlay[b-j18eklb1u9] { position: fixed; inset: 0; background-color: rgba(0, 0, 0, 0.8); display: flex; align-items: center; justify-content: center; z-index: 1000; padding: 1rem; }
.modal-container[b-j18eklb1u9] { background-color: var(--bg-card); border-radius: var(--border-radius-xl); width: 100%; max-width: 700px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; }
.modal-header[b-j18eklb1u9] { display: flex; align-items: center; justify-content: space-between; padding: 1rem 1.25rem; border-bottom: 1px solid var(--border-color); }
.modal-title[b-j18eklb1u9] { display: flex; align-items: center; gap: 0.5rem; margin: 0; font-size: var(--font-size-lg); font-weight: 600; color: var(--text-primary); }
.modal-title .material-icons[b-j18eklb1u9] { font-size: 24px; color: var(--color-primary); }
.modal-close[b-j18eklb1u9] { display: flex; align-items: center; justify-content: center; width: 32px; height: 32px; border: none; background: none; cursor: pointer; color: var(--text-muted); border-radius: var(--border-radius); }
.modal-close:hover[b-j18eklb1u9] { background-color: var(--bg-hover); color: var(--text-primary); }
.modal-body[b-j18eklb1u9] { padding: 1.25rem; overflow-y: auto; flex: 1; text-align: center; }
.modal-image[b-j18eklb1u9] { max-width: 100%; max-height: 60vh; border-radius: var(--border-radius); }
.modal-footer[b-j18eklb1u9] { display: flex; justify-content: space-between; align-items: center; padding: 1rem 1.25rem; border-top: 1px solid var(--border-color); gap: 1rem; flex-wrap: wrap; }
.modal-info[b-j18eklb1u9] { flex: 1; }
.modal-info p[b-j18eklb1u9] { margin: 0 0 0.375rem 0; font-size: var(--font-size-sm); color: var(--text-secondary); }
.modal-info p:last-child[b-j18eklb1u9] { margin-bottom: 0; }
.modal-actions[b-j18eklb1u9] { display: flex; gap: 0.75rem; }

/* Buttons */
.btn-action[b-j18eklb1u9] { display: inline-flex; align-items: center; justify-content: center; gap: 0.5rem; padding: 0.625rem 1rem; font-size: var(--font-size-sm); font-weight: 500; border: none; border-radius: var(--border-radius); cursor: pointer; transition: all var(--transition-fast); text-decoration: none; }
.btn-action .material-icons[b-j18eklb1u9] { font-size: 18px; }
.btn-action--primary[b-j18eklb1u9] { background-color: var(--color-primary); color: white; }
.btn-action--primary:hover[b-j18eklb1u9] { background-color: var(--color-primary-hover); }
.btn-action--secondary[b-j18eklb1u9] { background-color: var(--bg-hover); color: var(--text-primary); border: 1px solid var(--border-color); }
.btn-action--secondary:hover[b-j18eklb1u9] { background-color: var(--border-color); }

/* Responsive */
@media (max-width: 768px) {
    .page-header[b-j18eklb1u9] { flex-direction: column; align-items: flex-start; }
    .filter-grid[b-j18eklb1u9] { flex-direction: column; }
    .filter-grid .form-group[b-j18eklb1u9] { min-width: 100%; }
    .filter-actions[b-j18eklb1u9] { width: 100%; }
    .filter-actions .btn-filter[b-j18eklb1u9] { flex: 1; }
    .gallery-grid[b-j18eklb1u9] { grid-template-columns: 1fr; }
    .modal-footer[b-j18eklb1u9] { flex-direction: column; }
    .modal-actions[b-j18eklb1u9] { width: 100%; }
    .modal-actions .btn-action[b-j18eklb1u9] { flex: 1; }
}

/* Dark Mode */
[data-theme="dark"] .filter-card[b-j18eklb1u9], [data-theme="dark"] .selfie-card[b-j18eklb1u9], [data-theme="dark"] .empty-state[b-j18eklb1u9], [data-theme="dark"] .loading-state[b-j18eklb1u9], [data-theme="dark"] .error-card[b-j18eklb1u9], [data-theme="dark"] .modal-container[b-j18eklb1u9] { background-color: var(--bg-card); border-color: var(--border-color); }
/* _content/Geniar.Asistencias.Web/Pages/EspacioPersonal/Index.razor.rz.scp.css */
/* ============================================
   ESPACIO PERSONAL STYLES
   ============================================ */

.personal-space[b-nrm1wu6azx] {
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
    max-width: 1200px;
    margin: 0 auto;
    padding: 1rem;
}

/* Loading State */
.loading-state[b-nrm1wu6azx] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    min-height: 400px;
    gap: 1rem;
}

.loading-state .spinner-border[b-nrm1wu6azx] {
    width: 3rem;
    height: 3rem;
}

.loading-state p[b-nrm1wu6azx] {
    color: var(--text-muted);
    font-size: var(--font-size-base);
}

/* No Employee Card */
.no-employee-card[b-nrm1wu6azx] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    padding: 4rem 2rem;
    background-color: var(--bg-card);
    border: 1px solid var(--border-color);
    border-radius: var(--border-radius-xl);
    gap: 1rem;
}

.no-employee-card__icon[b-nrm1wu6azx] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 80px;
    height: 80px;
    background-color: var(--color-warning-bg);
    border-radius: 50%;
}

.no-employee-card__icon .material-icons[b-nrm1wu6azx] {
    font-size: 40px;
    color: var(--color-warning);
}

.no-employee-card h2[b-nrm1wu6azx] {
    margin: 0;
    font-size: var(--font-size-xl);
    font-weight: 600;
    color: var(--text-primary);
}

.no-employee-card p[b-nrm1wu6azx] {
    margin: 0;
    font-size: var(--font-size-base);
    color: var(--text-secondary);
    max-width: 400px;
}

/* Welcome Header */
.welcome-header[b-nrm1wu6azx] {
    display: flex;
    align-items: center;
    gap: 1rem;
    padding: 1rem 0;
}

.welcome-header__avatar[b-nrm1wu6azx] {
    width: 64px;
    height: 64px;
    border-radius: 50%;
    overflow: hidden;
    flex-shrink: 0;
}

.welcome-header__avatar img[b-nrm1wu6azx] {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.avatar-initials[b-nrm1wu6azx] {
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    background: linear-gradient(135deg, var(--color-primary), #7C3AED);
    color: white;
    font-size: 24px;
    font-weight: 600;
}

.welcome-header__content[b-nrm1wu6azx] {
    flex: 1;
}

.welcome-header__title[b-nrm1wu6azx] {
    margin: 0;
    font-size: var(--font-size-2xl);
    font-weight: 700;
    color: var(--text-primary);
}

.welcome-header__subtitle[b-nrm1wu6azx] {
    margin: 0.25rem 0 0 0;
    font-size: var(--font-size-base);
    color: var(--text-secondary);
}

/* Main Section */
.main-section[b-nrm1wu6azx] {
    display: grid;
    grid-template-columns: 2fr 1fr;
    gap: 1.5rem;
}

/* Session Card */
.session-card[b-nrm1wu6azx] {
    background-color: var(--bg-card);
    border: 1px solid var(--border-color);
    border-radius: var(--border-radius-xl);
    overflow: hidden;
}

.session-card__header[b-nrm1wu6azx] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 1rem 1.5rem;
    background-color: var(--bg-hover);
    font-size: var(--font-size-xs);
    font-weight: 600;
    color: var(--text-muted);
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

.session-card__header .material-icons[b-nrm1wu6azx] {
    font-size: 18px;
}

.session-card__body[b-nrm1wu6azx] {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 2rem;
    gap: 1.5rem;
}

/* Timer Display */
.timer-display[b-nrm1wu6azx] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.timer-unit[b-nrm1wu6azx] {
    display: flex;
    flex-direction: column;
    align-items: center;
}

.timer-value[b-nrm1wu6azx] {
    font-size: 3rem;
    font-weight: 700;
    color: var(--text-primary);
    font-variant-numeric: tabular-nums;
    background-color: var(--bg-hover);
    padding: 0.5rem 1rem;
    border-radius: var(--border-radius);
    min-width: 80px;
    text-align: center;
}

.timer-value--accent[b-nrm1wu6azx] {
    color: var(--color-primary);
}

.timer-label[b-nrm1wu6azx] {
    font-size: var(--font-size-xs);
    font-weight: 500;
    color: var(--text-muted);
    text-transform: uppercase;
    margin-top: 0.5rem;
}

.timer-separator[b-nrm1wu6azx] {
    font-size: 2.5rem;
    font-weight: 300;
    color: var(--text-muted);
    margin-bottom: 1.5rem;
}

.timer-separator--blink[b-nrm1wu6azx] {
    animation: blink-b-nrm1wu6azx 1s infinite;
}

@keyframes blink-b-nrm1wu6azx {
    50% { opacity: 0.3; }
}

/* Session Inactive */
.session-inactive[b-nrm1wu6azx] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.5rem;
    padding: 2rem;
    color: var(--text-muted);
}

.session-inactive .material-icons[b-nrm1wu6azx] {
    font-size: 48px;
    opacity: 0.5;
}

.session-inactive p[b-nrm1wu6azx] {
    margin: 0;
    font-size: var(--font-size-base);
}

/* Clock Buttons */
.btn-clock[b-nrm1wu6azx] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    padding: 1rem 2rem;
    font-size: var(--font-size-base);
    font-weight: 600;
    border: none;
    border-radius: var(--border-radius-xl);
    cursor: pointer;
    transition: all var(--transition-fast);
    text-decoration: none;
}

.btn-clock .material-icons[b-nrm1wu6azx] {
    font-size: 20px;
}

.btn-clock--in[b-nrm1wu6azx] {
    background-color: var(--color-primary);
    color: white;
}

.btn-clock--in:hover[b-nrm1wu6azx] {
    background-color: var(--color-primary-hover);
    color: white;
}

.btn-clock--out[b-nrm1wu6azx] {
    background-color: var(--color-danger);
    color: white;
}

.btn-clock--out:hover[b-nrm1wu6azx] {
    opacity: 0.9;
    color: white;
}

/* Status Sidebar */
.status-sidebar[b-nrm1wu6azx] {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

/* Progress Card */
.progress-card[b-nrm1wu6azx] {
    background-color: var(--bg-card);
    border: 1px solid var(--border-color);
    border-radius: var(--border-radius-xl);
    padding: 1.25rem;
}

.progress-card__header[b-nrm1wu6azx] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 0.75rem;
}

.progress-card__header span:first-child[b-nrm1wu6azx] {
    font-size: var(--font-size-sm);
    font-weight: 500;
    color: var(--text-secondary);
}

.progress-card__badge[b-nrm1wu6azx] {
    font-size: var(--font-size-xs);
    font-weight: 500;
    padding: 0.25rem 0.5rem;
    border-radius: var(--border-radius);
    background-color: var(--color-primary-bg);
    color: var(--color-primary);
}

.progress-card__badge--success[b-nrm1wu6azx] {
    background-color: var(--color-success-bg);
    color: var(--color-success);
}

.progress-card__value[b-nrm1wu6azx] {
    margin-bottom: 0.75rem;
}

.progress-value[b-nrm1wu6azx] {
    font-size: var(--font-size-2xl);
    font-weight: 700;
    color: var(--text-primary);
}

.progress-max[b-nrm1wu6azx] {
    font-size: var(--font-size-sm);
    color: var(--text-muted);
    margin-left: 0.25rem;
}

.progress-bar[b-nrm1wu6azx] {
    height: 8px;
    background-color: var(--bg-hover);
    border-radius: 4px;
    overflow: hidden;
}

.progress-bar__fill[b-nrm1wu6azx] {
    height: 100%;
    background: linear-gradient(90deg, var(--color-primary), var(--color-success));
    border-radius: 4px;
    transition: width 0.3s ease;
}

/* Today Status */
.today-status[b-nrm1wu6azx] {
    padding: 1.25rem;
    border-radius: var(--border-radius-xl);
}

.today-status--success[b-nrm1wu6azx] {
    background: linear-gradient(135deg, #7C3AED, #8B5CF6);
}

.today-status--warning[b-nrm1wu6azx] {
    background: linear-gradient(135deg, var(--color-warning), #FBBF24);
}

.today-status--neutral[b-nrm1wu6azx] {
    background: linear-gradient(135deg, #6B7280, #9CA3AF);
}

.today-status__label[b-nrm1wu6azx] {
    font-size: var(--font-size-xs);
    font-weight: 500;
    color: rgba(255, 255, 255, 0.8);
    margin-bottom: 0.5rem;
}

.today-status__value[b-nrm1wu6azx] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-size: var(--font-size-xl);
    font-weight: 700;
    color: white;
}

.today-status__value .material-icons[b-nrm1wu6azx] {
    font-size: 24px;
}

/* Stats Row */
.stats-row[b-nrm1wu6azx] {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 1rem;
}

.stat-card[b-nrm1wu6azx] {
    background-color: var(--bg-card);
    border: 1px solid var(--border-color);
    border-radius: var(--border-radius-xl);
    padding: 1.25rem;
    position: relative;
    overflow: hidden;
}

.stat-card__icon[b-nrm1wu6azx] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    border-radius: var(--border-radius);
    margin-bottom: 1rem;
}

.stat-card__icon .material-icons[b-nrm1wu6azx] {
    font-size: 24px;
}

.stat-card--blue .stat-card__icon[b-nrm1wu6azx] {
    background-color: var(--color-primary-bg);
}

.stat-card--blue .stat-card__icon .material-icons[b-nrm1wu6azx] {
    color: var(--color-primary);
}

.stat-card--green .stat-card__icon[b-nrm1wu6azx] {
    background-color: var(--color-success-bg);
}

.stat-card--green .stat-card__icon .material-icons[b-nrm1wu6azx] {
    color: var(--color-success);
}

.stat-card--orange .stat-card__icon[b-nrm1wu6azx] {
    background-color: var(--color-warning-bg);
}

.stat-card--orange .stat-card__icon .material-icons[b-nrm1wu6azx] {
    color: var(--color-warning);
}

.stat-card--red .stat-card__icon[b-nrm1wu6azx] {
    background-color: var(--color-danger-bg);
}

.stat-card--red .stat-card__icon .material-icons[b-nrm1wu6azx] {
    color: var(--color-danger);
}

.stat-card__value[b-nrm1wu6azx] {
    font-size: var(--font-size-3xl);
    font-weight: 700;
    color: var(--text-primary);
    margin-bottom: 0.25rem;
}

.stat-card__label[b-nrm1wu6azx] {
    font-size: var(--font-size-sm);
    font-weight: 500;
    color: var(--text-secondary);
}

.stat-card__trend[b-nrm1wu6azx] {
    display: flex;
    align-items: center;
    gap: 0.25rem;
    position: absolute;
    top: 1rem;
    right: 1rem;
    font-size: var(--font-size-xs);
    font-weight: 500;
    color: var(--color-success);
}

.stat-card__trend .material-icons[b-nrm1wu6azx] {
    font-size: 14px;
}

.stat-card__info[b-nrm1wu6azx] {
    font-size: var(--font-size-xs);
    color: var(--text-muted);
    margin-top: 0.25rem;
}

/* Bottom Section */
.bottom-section[b-nrm1wu6azx] {
    display: grid;
    grid-template-columns: 1fr 2fr;
    gap: 1.5rem;
}

/* Card Header */
.card-header[b-nrm1wu6azx] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 1rem 1.25rem;
    border-bottom: 1px solid var(--border-color);
    font-size: var(--font-size-base);
    font-weight: 600;
    color: var(--text-primary);
}

.card-header .material-icons[b-nrm1wu6azx] {
    font-size: 20px;
    color: var(--text-muted);
}

/* Quick Actions */
.quick-actions-card[b-nrm1wu6azx] {
    background-color: var(--bg-card);
    border: 1px solid var(--border-color);
    border-radius: var(--border-radius-xl);
    overflow: hidden;
}

.quick-actions-list[b-nrm1wu6azx] {
    padding: 0.5rem;
}

.quick-action-item[b-nrm1wu6azx] {
    display: flex;
    align-items: center;
    gap: 1rem;
    padding: 0.875rem;
    border-radius: var(--border-radius);
    text-decoration: none;
    transition: background-color var(--transition-fast);
}

.quick-action-item:hover[b-nrm1wu6azx] {
    background-color: var(--bg-hover);
}

.quick-action-item__icon[b-nrm1wu6azx] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    border-radius: var(--border-radius);
    flex-shrink: 0;
}

.quick-action-item__icon .material-icons[b-nrm1wu6azx] {
    font-size: 20px;
    color: white;
}

.quick-action-item__icon--primary[b-nrm1wu6azx] {
    background-color: var(--color-primary);
}

.quick-action-item__icon--green[b-nrm1wu6azx] {
    background-color: var(--color-success);
}

.quick-action-item__icon--orange[b-nrm1wu6azx] {
    background-color: var(--color-warning);
}

.quick-action-item__content[b-nrm1wu6azx] {
    flex: 1;
    min-width: 0;
}

.quick-action-item__title[b-nrm1wu6azx] {
    display: block;
    font-size: var(--font-size-sm);
    font-weight: 500;
    color: var(--text-primary);
}

.quick-action-item__desc[b-nrm1wu6azx] {
    display: block;
    font-size: var(--font-size-xs);
    color: var(--text-muted);
}

.quick-action-item__arrow[b-nrm1wu6azx] {
    font-size: 20px;
    color: var(--text-muted);
}

/* Activity Card */
.activity-card[b-nrm1wu6azx] {
    background-color: var(--bg-card);
    border: 1px solid var(--border-color);
    border-radius: var(--border-radius-xl);
    overflow: hidden;
}

.activity-table[b-nrm1wu6azx] {
    padding: 0 1rem;
}

.activity-table__header[b-nrm1wu6azx] {
    display: grid;
    grid-template-columns: 1.5fr 1fr 1fr 1fr;
    gap: 1rem;
    padding: 0.75rem 0;
    font-size: var(--font-size-xs);
    font-weight: 600;
    color: var(--text-muted);
    text-transform: uppercase;
    border-bottom: 1px solid var(--border-color);
}

.activity-table__row[b-nrm1wu6azx] {
    display: grid;
    grid-template-columns: 1.5fr 1fr 1fr 1fr;
    gap: 1rem;
    padding: 0.875rem 0;
    border-bottom: 1px solid var(--border-color);
    font-size: var(--font-size-sm);
}

.activity-table__row:last-child[b-nrm1wu6azx] {
    border-bottom: none;
}

.activity-date[b-nrm1wu6azx] {
    font-weight: 500;
    color: var(--text-primary);
}

.activity-time[b-nrm1wu6azx] {
    color: var(--text-secondary);
    font-variant-numeric: tabular-nums;
}

.activity-status[b-nrm1wu6azx] {
    display: inline-flex;
    align-items: center;
    padding: 0.25rem 0.5rem;
    font-size: var(--font-size-xs);
    font-weight: 500;
    border-radius: var(--border-radius);
}

.activity-status--activo[b-nrm1wu6azx] {
    background-color: var(--color-success-bg);
    color: var(--color-success);
}

.activity-status--completado[b-nrm1wu6azx] {
    background-color: var(--bg-hover);
    color: var(--text-secondary);
}

.activity-status--overtime[b-nrm1wu6azx] {
    background-color: var(--color-warning-bg);
    color: var(--color-warning);
}

.activity-empty[b-nrm1wu6azx] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 3rem;
    color: var(--text-muted);
}

.activity-empty .material-icons[b-nrm1wu6azx] {
    font-size: 40px;
    margin-bottom: 0.5rem;
    opacity: 0.5;
}

.activity-empty p[b-nrm1wu6azx] {
    margin: 0;
    font-size: var(--font-size-sm);
}

.activity-link[b-nrm1wu6azx] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    padding: 1rem;
    font-size: var(--font-size-sm);
    font-weight: 500;
    color: var(--color-primary);
    text-decoration: none;
    border-top: 1px solid var(--border-color);
    transition: background-color var(--transition-fast);
}

.activity-link:hover[b-nrm1wu6azx] {
    background-color: var(--color-primary-bg);
}

.activity-link .material-icons[b-nrm1wu6azx] {
    font-size: 18px;
}

/* Button Action */
.btn-action[b-nrm1wu6azx] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    padding: 0.75rem 1.5rem;
    font-size: var(--font-size-sm);
    font-weight: 500;
    border: none;
    border-radius: var(--border-radius);
    cursor: pointer;
    transition: all var(--transition-fast);
    text-decoration: none;
}

.btn-action .material-icons[b-nrm1wu6azx] {
    font-size: 18px;
}

.btn-action--primary[b-nrm1wu6azx] {
    background-color: var(--color-primary);
    color: white;
}

.btn-action--primary:hover[b-nrm1wu6azx] {
    background-color: var(--color-primary-hover);
    color: white;
}

/* Responsive */
@media (max-width: 992px) {
    .main-section[b-nrm1wu6azx] {
        grid-template-columns: 1fr;
    }

    .status-sidebar[b-nrm1wu6azx] {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 1rem;
    }

    .stats-row[b-nrm1wu6azx] {
        grid-template-columns: repeat(2, 1fr);
    }

    .bottom-section[b-nrm1wu6azx] {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 576px) {
    .personal-space[b-nrm1wu6azx] {
        padding: 0.5rem;
    }

    .welcome-header[b-nrm1wu6azx] {
        flex-direction: column;
        text-align: center;
    }

    .welcome-header__title[b-nrm1wu6azx] {
        font-size: var(--font-size-xl);
    }

    .timer-value[b-nrm1wu6azx] {
        font-size: 2rem;
        min-width: 60px;
        padding: 0.375rem 0.75rem;
    }

    .timer-separator[b-nrm1wu6azx] {
        font-size: 1.5rem;
    }

    .status-sidebar[b-nrm1wu6azx] {
        grid-template-columns: 1fr;
    }

    .stats-row[b-nrm1wu6azx] {
        grid-template-columns: 1fr 1fr;
    }

    .stat-card__value[b-nrm1wu6azx] {
        font-size: var(--font-size-2xl);
    }

    .activity-table__header[b-nrm1wu6azx],
    .activity-table__row[b-nrm1wu6azx] {
        grid-template-columns: 1.2fr 1fr 1fr 0.8fr;
        gap: 0.5rem;
    }
}

/* Dark Mode */
[data-theme="dark"] .session-card[b-nrm1wu6azx],
[data-theme="dark"] .progress-card[b-nrm1wu6azx],
[data-theme="dark"] .stat-card[b-nrm1wu6azx],
[data-theme="dark"] .quick-actions-card[b-nrm1wu6azx],
[data-theme="dark"] .activity-card[b-nrm1wu6azx],
[data-theme="dark"] .no-employee-card[b-nrm1wu6azx] {
    background-color: var(--bg-card);
    border-color: var(--border-color);
}

[data-theme="dark"] .timer-value[b-nrm1wu6azx] {
    background-color: rgba(255, 255, 255, 0.05);
}

[data-theme="dark"] .avatar-initials[b-nrm1wu6azx] {
    background: linear-gradient(135deg, #6366F1, #8B5CF6);
}
/* _content/Geniar.Asistencias.Web/Pages/Index.razor.rz.scp.css */
/* ============================================
   DASHBOARD PAGE STYLES
   ============================================ */

.dashboard[b-nrht7shkkk] {
    padding: 0;
}

/* Header del Dashboard */
.dashboard__header[b-nrht7shkkk] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 2rem;
    flex-wrap: wrap;
    gap: 1rem;
}

.dashboard__title-section[b-nrht7shkkk] {
    flex: 1;
}

.dashboard__title[b-nrht7shkkk] {
    margin: 0 0 0.25rem 0;
    font-size: var(--font-size-3xl);
    font-weight: 700;
    color: var(--text-primary);
}

.dashboard__subtitle[b-nrht7shkkk] {
    margin: 0;
    font-size: var(--font-size-base);
    color: var(--text-secondary);
}

.dashboard__timestamp[b-nrht7shkkk] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.5rem 1rem;
    background-color: var(--bg-card);
    border: 1px solid var(--border-color);
    border-radius: var(--border-radius);
    font-size: var(--font-size-sm);
    color: var(--text-secondary);
}

.dashboard__timestamp .material-icons[b-nrht7shkkk] {
    font-size: 18px;
    color: var(--color-primary);
}

/* Loading state */
.dashboard__loading[b-nrht7shkkk] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 4rem 2rem;
    gap: 1rem;
    color: var(--text-secondary);
}

.dashboard__loading .spinner-border[b-nrht7shkkk] {
    width: 3rem;
    height: 3rem;
}

/* Secciones */
.dashboard__section[b-nrht7shkkk] {
    margin-bottom: 2.5rem;
}

.dashboard__section-title[b-nrht7shkkk] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    margin: 0 0 1.25rem 0;
    font-size: var(--font-size-lg);
    font-weight: 600;
    color: var(--text-primary);
}

.dashboard__section-title .material-icons[b-nrht7shkkk] {
    font-size: 24px;
    color: var(--color-primary);
}

/* Grid de estadisticas (4 columnas) */
.stats-grid[b-nrht7shkkk] {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 1.5rem;
}

/* Grid de accesos rapidos */
.quick-grid[b-nrht7shkkk] {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 1.5rem;
}

/* ============================================
   RESPONSIVE DESIGN
   ============================================ */

/* Tablet */
@media (max-width: 1024px) {
    .stats-grid[b-nrht7shkkk] {
        grid-template-columns: repeat(2, 1fr);
    }

    .quick-grid[b-nrht7shkkk] {
        grid-template-columns: repeat(2, 1fr);
    }
}

/* Mobile */
@media (max-width: 640px) {
    .dashboard__header[b-nrht7shkkk] {
        flex-direction: column;
    }

    .dashboard__timestamp[b-nrht7shkkk] {
        width: 100%;
        justify-content: center;
    }

    .dashboard__title[b-nrht7shkkk] {
        font-size: var(--font-size-2xl);
    }

    .stats-grid[b-nrht7shkkk] {
        grid-template-columns: 1fr;
    }

    .quick-grid[b-nrht7shkkk] {
        grid-template-columns: 1fr;
    }

    .dashboard__section[b-nrht7shkkk] {
        margin-bottom: 2rem;
    }

    .dashboard__section-title[b-nrht7shkkk] {
        font-size: var(--font-size-base);
    }
}

/* ============================================
   DARK MODE
   ============================================ */

[data-theme="dark"] .dashboard__timestamp[b-nrht7shkkk] {
    background-color: var(--bg-card);
    border-color: var(--border-color);
}
/* _content/Geniar.Asistencias.Web/Pages/MiUsuario.razor.rz.scp.css */
/* ============================================
   MI USUARIO / PROFILE STYLES
   ============================================ */

.profile-page[b-4955xrivu7] { display: flex; flex-direction: column; gap: 1.5rem; }

/* Page Header */
.page-header[b-4955xrivu7] { display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 1rem; }
.page-header__info[b-4955xrivu7] { flex: 1; }
.page-header__title[b-4955xrivu7] { margin: 0 0 0.25rem 0; font-size: var(--font-size-3xl); font-weight: 700; color: var(--text-primary); }
.page-header__subtitle[b-4955xrivu7] { margin: 0; font-size: var(--font-size-base); color: var(--text-secondary); }

/* Profile Layout */
.profile-layout[b-4955xrivu7] { display: grid; grid-template-columns: repeat(2, 1fr); gap: 1.5rem; }

/* Info Card */
.info-card[b-4955xrivu7] { background-color: var(--bg-card); border: 1px solid var(--border-color); border-radius: var(--border-radius-xl); overflow: hidden; }
.info-card__header[b-4955xrivu7] { display: flex; align-items: center; gap: 0.75rem; padding: 1rem 1.25rem; border-bottom: 1px solid var(--border-color); }
.info-card__header .material-icons[b-4955xrivu7] { font-size: 20px; }
.info-card__header h3[b-4955xrivu7] { margin: 0; font-size: var(--font-size-base); font-weight: 600; }
.info-card__header--primary[b-4955xrivu7] { background-color: var(--color-primary); color: white; }
.info-card__header--primary .material-icons[b-4955xrivu7] { color: white; }
.info-card__header--cyan[b-4955xrivu7] { background-color: #06B6D4; color: white; }
.info-card__header--secondary[b-4955xrivu7] { background-color: var(--bg-hover); color: var(--text-primary); }
.info-card__header--secondary .material-icons[b-4955xrivu7] { color: var(--color-primary); }
.info-card__body[b-4955xrivu7] { padding: 1.25rem; }

/* User Info */
.user-info[b-4955xrivu7] { display: flex; align-items: center; gap: 1rem; margin-bottom: 1.5rem; padding-bottom: 1.5rem; border-bottom: 1px solid var(--border-color); }
.user-info__avatar[b-4955xrivu7] { display: flex; align-items: center; justify-content: center; width: 64px; height: 64px; border-radius: 50%; background-color: var(--color-primary-bg); }
.user-info__avatar .material-icons[b-4955xrivu7] { font-size: 40px; color: var(--color-primary); }
.user-info__details[b-4955xrivu7] { flex: 1; }
.user-info__name[b-4955xrivu7] { margin: 0 0 0.5rem 0; font-size: var(--font-size-lg); font-weight: 600; color: var(--text-primary); }
.badge-authenticated[b-4955xrivu7] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.25rem 0.5rem; font-size: var(--font-size-xs); font-weight: 500; background-color: var(--color-success-bg); color: var(--color-success); border-radius: var(--border-radius); }
.badge-authenticated .material-icons[b-4955xrivu7] { font-size: 14px; }

/* Info List */
.info-list[b-4955xrivu7] { display: flex; flex-direction: column; gap: 1rem; }
.info-list__item[b-4955xrivu7] { display: flex; flex-direction: column; gap: 0.25rem; }
.info-list__label[b-4955xrivu7] { display: flex; align-items: center; gap: 0.5rem; font-size: var(--font-size-xs); font-weight: 500; color: var(--text-muted); text-transform: uppercase; }
.info-list__label .material-icons[b-4955xrivu7] { font-size: 16px; }
.info-list__value[b-4955xrivu7] { font-size: var(--font-size-sm); color: var(--text-primary); }
.info-list__code[b-4955xrivu7] { font-family: monospace; font-size: var(--font-size-xs); padding: 0.25rem 0.5rem; background-color: var(--bg-hover); border-radius: var(--border-radius); color: var(--text-primary); }

/* Roles List */
.roles-list[b-4955xrivu7] { display: flex; flex-direction: column; gap: 0.5rem; }
.role-item[b-4955xrivu7] { display: flex; align-items: center; gap: 0.75rem; padding: 0.75rem 1rem; background-color: var(--bg-hover); border-radius: var(--border-radius); }
.role-item .material-icons[b-4955xrivu7] { font-size: 20px; color: var(--color-success); }
.role-item span:last-child[b-4955xrivu7] { font-size: var(--font-size-sm); font-weight: 500; color: var(--text-primary); }

/* Empty State */
.empty-state[b-4955xrivu7] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 2rem; gap: 0.5rem; text-align: center; }
.empty-state .material-icons[b-4955xrivu7] { font-size: 32px; color: var(--text-muted); }
.empty-state p[b-4955xrivu7] { margin: 0; font-size: var(--font-size-sm); color: var(--text-muted); }

/* Table */
.table-container[b-4955xrivu7] { overflow-x: auto; }
.data-table[b-4955xrivu7] { width: 100%; border-collapse: collapse; font-size: var(--font-size-sm); }
.data-table th[b-4955xrivu7] { padding: 0.75rem 1rem; text-align: left; font-weight: 600; color: var(--text-primary); background-color: var(--bg-hover); border-bottom: 1px solid var(--border-color); }
.data-table td[b-4955xrivu7] { padding: 0.75rem 1rem; border-bottom: 1px solid var(--border-color); color: var(--text-primary); }
.data-table tbody tr:hover[b-4955xrivu7] { background-color: var(--bg-hover); }
.data-table code[b-4955xrivu7] { font-family: monospace; font-size: var(--font-size-xs); color: var(--color-primary); }

/* Help Card */
.help-card[b-4955xrivu7] { background-color: var(--color-primary-bg); border: 1px solid var(--color-primary); border-radius: var(--border-radius-xl); overflow: hidden; }
.help-card__header[b-4955xrivu7] { display: flex; align-items: center; gap: 0.75rem; padding: 1rem 1.25rem; background-color: rgba(29, 78, 216, 0.1); border-bottom: 1px solid var(--color-primary); }
.help-card__header .material-icons[b-4955xrivu7] { font-size: 20px; color: var(--color-primary); }
.help-card__header h4[b-4955xrivu7] { margin: 0; font-size: var(--font-size-base); font-weight: 600; color: var(--color-primary); }
.help-card__body[b-4955xrivu7] { padding: 1.25rem; }
.help-card__body p[b-4955xrivu7] { margin: 0 0 0.75rem 0; font-size: var(--font-size-sm); color: var(--text-secondary); }
.help-card__body code[b-4955xrivu7] { font-family: monospace; font-size: var(--font-size-xs); padding: 0.125rem 0.375rem; background-color: var(--bg-hover); border-radius: var(--border-radius-sm); }
.code-block[b-4955xrivu7] { margin: 1rem 0; padding: 1rem; background-color: var(--bg-card); border: 1px solid var(--border-color); border-radius: var(--border-radius); overflow-x: auto; font-size: var(--font-size-xs); line-height: 1.6; }
.help-card__note[b-4955xrivu7] { display: flex; align-items: flex-start; gap: 0.5rem; margin: 1rem 0 0 0; padding: 0.75rem; background-color: var(--color-warning-bg); border-radius: var(--border-radius); font-size: var(--font-size-sm); color: var(--text-primary); }
.help-card__note .material-icons[b-4955xrivu7] { font-size: 18px; color: var(--color-warning); flex-shrink: 0; margin-top: 0.125rem; }

/* Responsive */
@media (max-width: 768px) {
    .profile-layout[b-4955xrivu7] { grid-template-columns: 1fr; }
    .user-info[b-4955xrivu7] { flex-direction: column; text-align: center; }
}

/* Dark Mode */
[data-theme="dark"] .info-card[b-4955xrivu7], [data-theme="dark"] .help-card[b-4955xrivu7] { background-color: var(--bg-card); border-color: var(--border-color); }
[data-theme="dark"] .code-block[b-4955xrivu7] { background-color: rgba(255, 255, 255, 0.05); }
/* _content/Geniar.Asistencias.Web/Pages/Reportes/Ausentismo.razor.rz.scp.css */
/* ============================================
   AUSENTISMO REPORT STYLES
   ============================================ */

.report-page[b-k4n4woc6le] { display: flex; flex-direction: column; gap: 1.5rem; }

/* Page Header */
.page-header[b-k4n4woc6le] { display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 1rem; }
.page-header__info[b-k4n4woc6le] { flex: 1; }
.page-header__title[b-k4n4woc6le] { margin: 0 0 0.25rem 0; font-size: var(--font-size-3xl); font-weight: 700; color: var(--text-primary); }
.page-header__subtitle[b-k4n4woc6le] { margin: 0; font-size: var(--font-size-base); color: var(--text-secondary); }

/* Filter Card */
.filter-card[b-k4n4woc6le] { background-color: var(--bg-card); border: 1px solid var(--border-color); border-radius: var(--border-radius-xl); padding: 1.25rem; }
.filter-grid[b-k4n4woc6le] { display: flex; gap: 1rem; align-items: flex-end; flex-wrap: wrap; }
.filter-grid .form-group[b-k4n4woc6le] { flex: 1; min-width: 150px; margin: 0; }
.filter-actions[b-k4n4woc6le] { display: flex; gap: 0.5rem; }

/* Form Styles */
.form-label[b-k4n4woc6le] { display: flex; align-items: center; gap: 0.375rem; margin-bottom: 0.5rem; font-size: var(--font-size-sm); font-weight: 500; color: var(--text-primary); }
.form-label .material-icons[b-k4n4woc6le] { font-size: 16px; color: var(--color-primary); }
.form-input[b-k4n4woc6le] { width: 100%; padding: 0.625rem 0.875rem; font-size: var(--font-size-sm); border: 1px solid var(--border-color); border-radius: var(--border-radius); background-color: var(--bg-card); color: var(--text-primary); }
.form-input:focus[b-k4n4woc6le] { outline: none; border-color: var(--color-primary); box-shadow: 0 0 0 3px rgba(29, 78, 216, 0.1); }

/* Filter Buttons */
.btn-filter[b-k4n4woc6le] { display: inline-flex; align-items: center; justify-content: center; gap: 0.5rem; padding: 0.625rem 1rem; font-size: var(--font-size-sm); font-weight: 500; border: none; border-radius: var(--border-radius); cursor: pointer; transition: all var(--transition-fast); }
.btn-filter .material-icons[b-k4n4woc6le] { font-size: 18px; }
.btn-filter:disabled[b-k4n4woc6le] { opacity: 0.6; cursor: not-allowed; }
.btn-filter--primary[b-k4n4woc6le] { background-color: var(--color-primary); color: white; }
.btn-filter--primary:hover:not(:disabled)[b-k4n4woc6le] { background-color: var(--color-primary-hover); }

/* Loading State */
.loading-state[b-k4n4woc6le] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 4rem 2rem; gap: 1rem; background-color: var(--bg-card); border: 1px solid var(--border-color); border-radius: var(--border-radius-xl); color: var(--text-secondary); }
.loading-state .spinner-border[b-k4n4woc6le] { width: 3rem; height: 3rem; }

/* Stats Grid */
.stats-grid[b-k4n4woc6le] { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1rem; }
.stat-card[b-k4n4woc6le] { display: flex; align-items: center; gap: 1rem; padding: 1.25rem; background-color: var(--bg-card); border: 1px solid var(--border-color); border-radius: var(--border-radius-xl); }
.stat-card__icon[b-k4n4woc6le] { display: flex; align-items: center; justify-content: center; width: 48px; height: 48px; border-radius: var(--border-radius-lg); flex-shrink: 0; }
.stat-card__icon .material-icons[b-k4n4woc6le] { font-size: 24px; }
.stat-card--primary .stat-card__icon[b-k4n4woc6le] { background-color: var(--color-primary-bg); color: var(--color-primary); }
.stat-card--warning .stat-card__icon[b-k4n4woc6le] { background-color: var(--color-warning-bg); color: var(--color-warning); }
.stat-card--danger .stat-card__icon[b-k4n4woc6le] { background-color: var(--color-danger-bg); color: var(--color-danger); }
.stat-card__content[b-k4n4woc6le] { display: flex; flex-direction: column; }
.stat-card__value[b-k4n4woc6le] { font-size: var(--font-size-2xl); font-weight: 700; color: var(--text-primary); line-height: 1.2; }
.stat-card__label[b-k4n4woc6le] { font-size: var(--font-size-xs); color: var(--text-muted); }
.stat-card__badge[b-k4n4woc6le] { display: inline-block; margin-top: 0.25rem; padding: 0.125rem 0.375rem; font-size: 10px; font-weight: 600; border-radius: var(--border-radius); }
.stat-card--primary .stat-card__badge[b-k4n4woc6le] { background-color: var(--color-primary-bg); color: var(--color-primary); }
.stat-card--warning .stat-card__badge[b-k4n4woc6le] { background-color: var(--color-warning-bg); color: var(--color-warning); }
.stat-card--danger .stat-card__badge[b-k4n4woc6le] { background-color: var(--color-danger-bg); color: var(--color-danger); }

/* Table Card */
.table-card[b-k4n4woc6le] { background-color: var(--bg-card); border: 1px solid var(--border-color); border-radius: var(--border-radius-xl); overflow: hidden; }
.table-card__header[b-k4n4woc6le] { display: flex; align-items: center; gap: 0.5rem; padding: 1rem 1.25rem; background-color: var(--bg-hover); font-size: var(--font-size-base); font-weight: 600; color: var(--text-primary); border-bottom: 1px solid var(--border-color); }
.table-card__header .material-icons[b-k4n4woc6le] { font-size: 20px; color: var(--color-primary); }
.table-card__body[b-k4n4woc6le] { padding: 0; }

/* Table Container */
.table-container[b-k4n4woc6le] { overflow-x: auto; }
.data-table[b-k4n4woc6le] { width: 100%; border-collapse: collapse; font-size: var(--font-size-sm); }
.data-table th[b-k4n4woc6le] { padding: 0.875rem 1rem; text-align: left; font-weight: 600; color: var(--text-primary); background-color: var(--bg-hover); border-bottom: 1px solid var(--border-color); }
.data-table td[b-k4n4woc6le] { padding: 0.875rem 1rem; border-bottom: 1px solid var(--border-color); color: var(--text-primary); }
.data-table tbody tr:hover[b-k4n4woc6le] { background-color: var(--bg-hover); }
.data-table tbody tr:last-child td[b-k4n4woc6le] { border-bottom: none; }
.text-center[b-k4n4woc6le] { text-align: center; }

/* Badges */
.legajo-badge[b-k4n4woc6le] { display: inline-block; padding: 0.25rem 0.5rem; font-size: var(--font-size-xs); font-weight: 500; background-color: var(--bg-hover); color: var(--text-primary); border-radius: var(--border-radius); font-family: monospace; }
.count-badge[b-k4n4woc6le] { display: inline-flex; align-items: center; justify-content: center; min-width: 28px; height: 24px; padding: 0 0.5rem; font-size: var(--font-size-xs); font-weight: 600; border-radius: 9999px; }
.count-badge--success[b-k4n4woc6le] { background-color: var(--color-success-bg); color: var(--color-success); }
.count-badge--warning[b-k4n4woc6le] { background-color: var(--color-warning-bg); color: var(--color-warning); }
.count-badge--danger[b-k4n4woc6le] { background-color: var(--color-danger-bg); color: var(--color-danger); }
.percent-badge[b-k4n4woc6le] { display: inline-block; padding: 0.25rem 0.5rem; font-size: var(--font-size-xs); font-weight: 600; border-radius: var(--border-radius); }
.percent-badge--success[b-k4n4woc6le] { background-color: var(--color-success-bg); color: var(--color-success); }
.percent-badge--warning[b-k4n4woc6le] { background-color: var(--color-warning-bg); color: var(--color-warning); }
.percent-badge--danger[b-k4n4woc6le] { background-color: var(--color-danger-bg); color: var(--color-danger); }

/* Detail Button */
.btn-detail[b-k4n4woc6le] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.375rem 0.75rem; font-size: var(--font-size-xs); font-weight: 500; color: var(--color-primary); background-color: var(--color-primary-bg); border: none; border-radius: var(--border-radius); cursor: pointer; transition: all var(--transition-fast); }
.btn-detail .material-icons[b-k4n4woc6le] { font-size: 16px; }
.btn-detail:hover[b-k4n4woc6le] { background-color: var(--color-primary); color: white; }

/* Success State */
.success-state[b-k4n4woc6le] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem 2rem; gap: 0.75rem; }
.success-state .material-icons[b-k4n4woc6le] { font-size: 48px; color: var(--color-success); }
.success-state p[b-k4n4woc6le] { margin: 0; font-size: var(--font-size-sm); color: var(--color-success); font-weight: 500; }

/* Modal */
.modal-overlay[b-k4n4woc6le] { position: fixed; inset: 0; background-color: rgba(0, 0, 0, 0.5); display: flex; align-items: center; justify-content: center; z-index: 1000; padding: 1rem; }
.modal-container[b-k4n4woc6le] { background-color: var(--bg-card); border-radius: var(--border-radius-xl); width: 100%; max-width: 500px; max-height: 80vh; overflow: hidden; display: flex; flex-direction: column; }
.modal-header[b-k4n4woc6le] { display: flex; align-items: center; justify-content: space-between; padding: 1rem 1.25rem; border-bottom: 1px solid var(--border-color); }
.modal-title[b-k4n4woc6le] { display: flex; align-items: center; gap: 0.5rem; margin: 0; font-size: var(--font-size-lg); font-weight: 600; color: var(--text-primary); }
.modal-title .material-icons[b-k4n4woc6le] { font-size: 24px; color: var(--color-warning); }
.modal-close[b-k4n4woc6le] { display: flex; align-items: center; justify-content: center; width: 32px; height: 32px; border: none; background: none; cursor: pointer; color: var(--text-muted); border-radius: var(--border-radius); }
.modal-close:hover[b-k4n4woc6le] { background-color: var(--bg-hover); color: var(--text-primary); }
.modal-body[b-k4n4woc6le] { padding: 1.25rem; overflow-y: auto; flex: 1; }
.modal-subtitle[b-k4n4woc6le] { font-size: var(--font-size-base); font-weight: 500; color: var(--text-primary); margin-bottom: 1rem; }
.modal-footer[b-k4n4woc6le] { display: flex; justify-content: flex-end; gap: 0.75rem; padding: 1rem 1.25rem; border-top: 1px solid var(--border-color); }

/* Fechas List */
.fechas-list[b-k4n4woc6le] { display: flex; flex-direction: column; gap: 0.5rem; }
.fecha-item[b-k4n4woc6le] { display: flex; align-items: center; gap: 0.5rem; padding: 0.75rem 1rem; background-color: var(--bg-hover); border-radius: var(--border-radius); font-size: var(--font-size-sm); color: var(--text-primary); }
.fecha-item .material-icons[b-k4n4woc6le] { font-size: 18px; color: var(--color-danger); }

/* Modal Button */
.btn-modal[b-k4n4woc6le] { display: inline-flex; align-items: center; justify-content: center; gap: 0.5rem; padding: 0.625rem 1.25rem; font-size: var(--font-size-sm); font-weight: 500; border: none; border-radius: var(--border-radius); cursor: pointer; transition: all var(--transition-fast); }
.btn-modal--secondary[b-k4n4woc6le] { background-color: var(--bg-hover); color: var(--text-primary); border: 1px solid var(--border-color); }
.btn-modal--secondary:hover[b-k4n4woc6le] { background-color: var(--border-color); }

/* Responsive */
@media (max-width: 1024px) { .stats-grid[b-k4n4woc6le] { grid-template-columns: 1fr; } }
@media (max-width: 768px) { .filter-grid[b-k4n4woc6le] { flex-direction: column; } .filter-grid .form-group[b-k4n4woc6le] { min-width: 100%; } .filter-actions[b-k4n4woc6le] { width: 100%; } .filter-actions .btn-filter[b-k4n4woc6le] { flex: 1; } }

/* Dark Mode */
[data-theme="dark"] .filter-card[b-k4n4woc6le], [data-theme="dark"] .stat-card[b-k4n4woc6le], [data-theme="dark"] .table-card[b-k4n4woc6le], [data-theme="dark"] .loading-state[b-k4n4woc6le], [data-theme="dark"] .modal-container[b-k4n4woc6le] { background-color: var(--bg-card); border-color: var(--border-color); }
[data-theme="dark"] .table-card__header[b-k4n4woc6le], [data-theme="dark"] .data-table th[b-k4n4woc6le] { background-color: rgba(255, 255, 255, 0.05); }
[data-theme="dark"] .fecha-item[b-k4n4woc6le] { background-color: rgba(255, 255, 255, 0.05); }
/* _content/Geniar.Asistencias.Web/Pages/Reportes/Diario.razor.rz.scp.css */
/* ============================================
   REPORT PAGE STYLES (DIARIO)
   ============================================ */

.report-page[b-ohn2gxjjt5] { display: flex; flex-direction: column; gap: 1.5rem; }

/* Page Header */
.page-header[b-ohn2gxjjt5] { display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 1rem; }
.page-header__info[b-ohn2gxjjt5] { flex: 1; }
.page-header__title[b-ohn2gxjjt5] { margin: 0 0 0.25rem 0; font-size: var(--font-size-3xl); font-weight: 700; color: var(--text-primary); }
.page-header__subtitle[b-ohn2gxjjt5] { margin: 0; font-size: var(--font-size-base); color: var(--text-secondary); }

/* Filter Card */
.filter-card[b-ohn2gxjjt5] { background-color: var(--bg-card); border: 1px solid var(--border-color); border-radius: var(--border-radius-xl); padding: 1.25rem; }
.filter-grid[b-ohn2gxjjt5] { display: flex; gap: 1rem; align-items: flex-end; flex-wrap: wrap; }
.filter-grid .form-group[b-ohn2gxjjt5] { flex: 1; min-width: 180px; margin: 0; }
.filter-actions[b-ohn2gxjjt5] { display: flex; gap: 0.5rem; }

/* Form Styles */
.form-group[b-ohn2gxjjt5] { margin-bottom: 0; }
.form-label[b-ohn2gxjjt5] { display: flex; align-items: center; gap: 0.375rem; margin-bottom: 0.5rem; font-size: var(--font-size-sm); font-weight: 500; color: var(--text-primary); }
.form-label .material-icons[b-ohn2gxjjt5] { font-size: 16px; color: var(--color-primary); }
.form-input[b-ohn2gxjjt5] { width: 100%; padding: 0.625rem 0.875rem; font-size: var(--font-size-sm); border: 1px solid var(--border-color); border-radius: var(--border-radius); background-color: var(--bg-card); color: var(--text-primary); }
.form-input:focus[b-ohn2gxjjt5] { outline: none; border-color: var(--color-primary); box-shadow: 0 0 0 3px rgba(29, 78, 216, 0.1); }

/* Filter Buttons */
.btn-filter[b-ohn2gxjjt5] { display: inline-flex; align-items: center; justify-content: center; gap: 0.5rem; padding: 0.625rem 1rem; font-size: var(--font-size-sm); font-weight: 500; border: none; border-radius: var(--border-radius); cursor: pointer; transition: all var(--transition-fast); white-space: nowrap; }
.btn-filter .material-icons[b-ohn2gxjjt5] { font-size: 18px; }
.btn-filter:disabled[b-ohn2gxjjt5] { opacity: 0.6; cursor: not-allowed; }
.btn-filter--primary[b-ohn2gxjjt5] { background-color: var(--color-primary); color: white; }
.btn-filter--primary:hover:not(:disabled)[b-ohn2gxjjt5] { background-color: var(--color-primary-hover); }
.btn-filter--success[b-ohn2gxjjt5] { background-color: var(--color-success); color: white; }
.btn-filter--success:hover:not(:disabled)[b-ohn2gxjjt5] { background-color: #059669; }

/* Loading State */
.loading-state[b-ohn2gxjjt5] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 4rem 2rem; gap: 1rem; background-color: var(--bg-card); border: 1px solid var(--border-color); border-radius: var(--border-radius-xl); color: var(--text-secondary); }
.loading-state .spinner-border[b-ohn2gxjjt5] { width: 3rem; height: 3rem; }

/* Stats Grid */
.stats-grid[b-ohn2gxjjt5] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 1rem; }
.stat-card[b-ohn2gxjjt5] { display: flex; align-items: center; gap: 1rem; padding: 1.25rem; background-color: var(--bg-card); border: 1px solid var(--border-color); border-radius: var(--border-radius-xl); }
.stat-card__icon[b-ohn2gxjjt5] { display: flex; align-items: center; justify-content: center; width: 48px; height: 48px; border-radius: var(--border-radius-lg); flex-shrink: 0; }
.stat-card__icon .material-icons[b-ohn2gxjjt5] { font-size: 24px; }
.stat-card--primary .stat-card__icon[b-ohn2gxjjt5] { background-color: var(--color-primary-bg); color: var(--color-primary); }
.stat-card--success .stat-card__icon[b-ohn2gxjjt5] { background-color: var(--color-success-bg); color: var(--color-success); }
.stat-card--warning .stat-card__icon[b-ohn2gxjjt5] { background-color: var(--color-warning-bg); color: var(--color-warning); }
.stat-card--danger .stat-card__icon[b-ohn2gxjjt5] { background-color: var(--color-danger-bg); color: var(--color-danger); }
.stat-card--cyan .stat-card__icon[b-ohn2gxjjt5] { background-color: rgba(6, 182, 212, 0.1); color: #06B6D4; }
.stat-card__content[b-ohn2gxjjt5] { display: flex; flex-direction: column; }
.stat-card__value[b-ohn2gxjjt5] { font-size: var(--font-size-2xl); font-weight: 700; color: var(--text-primary); line-height: 1.2; }
.stat-card__label[b-ohn2gxjjt5] { font-size: var(--font-size-xs); color: var(--text-muted); }
.stat-card__badge[b-ohn2gxjjt5] { display: inline-block; margin-top: 0.25rem; padding: 0.125rem 0.375rem; font-size: 10px; font-weight: 600; border-radius: var(--border-radius); }
.stat-card--primary .stat-card__badge[b-ohn2gxjjt5] { background-color: var(--color-primary-bg); color: var(--color-primary); }
.stat-card--success .stat-card__badge[b-ohn2gxjjt5] { background-color: var(--color-success-bg); color: var(--color-success); }
.stat-card--warning .stat-card__badge[b-ohn2gxjjt5] { background-color: var(--color-warning-bg); color: var(--color-warning); }
.stat-card--danger .stat-card__badge[b-ohn2gxjjt5] { background-color: var(--color-danger-bg); color: var(--color-danger); }
.stat-card--cyan .stat-card__badge[b-ohn2gxjjt5] { background-color: rgba(6, 182, 212, 0.1); color: #06B6D4; }

/* Report Title */
.report-title[b-ohn2gxjjt5] { display: flex; align-items: center; gap: 0.5rem; padding: 1rem 1.25rem; background-color: var(--bg-card); border: 1px solid var(--border-color); border-radius: var(--border-radius-xl); font-size: var(--font-size-base); font-weight: 600; color: var(--text-primary); }
.report-title .material-icons[b-ohn2gxjjt5] { font-size: 20px; color: var(--color-primary); }
.report-title__sucursal[b-ohn2gxjjt5] { display: inline-block; margin-left: 0.5rem; padding: 0.25rem 0.75rem; font-size: var(--font-size-xs); font-weight: 500; background-color: var(--color-primary-bg); color: var(--color-primary); border-radius: 9999px; }

/* Tabs */
.tabs-container[b-ohn2gxjjt5] { background-color: var(--bg-card); border: 1px solid var(--border-color); border-radius: var(--border-radius-xl); overflow: hidden; }
.tabs-header[b-ohn2gxjjt5] { display: flex; gap: 0; border-bottom: 1px solid var(--border-color); background-color: var(--bg-hover); }
.tab-btn[b-ohn2gxjjt5] { display: flex; align-items: center; gap: 0.5rem; padding: 0.875rem 1.25rem; font-size: var(--font-size-sm); font-weight: 500; color: var(--text-secondary); background: none; border: none; cursor: pointer; transition: all var(--transition-fast); border-bottom: 2px solid transparent; margin-bottom: -1px; }
.tab-btn .material-icons[b-ohn2gxjjt5] { font-size: 18px; }
.tab-btn:hover[b-ohn2gxjjt5] { color: var(--text-primary); background-color: rgba(0, 0, 0, 0.03); }
.tab-btn--active[b-ohn2gxjjt5] { color: var(--color-primary); border-bottom-color: var(--color-primary); background-color: var(--bg-card); }
.tabs-content[b-ohn2gxjjt5] { padding: 0; }

/* Table Container */
.table-container[b-ohn2gxjjt5] { overflow-x: auto; }
.data-table[b-ohn2gxjjt5] { width: 100%; border-collapse: collapse; font-size: var(--font-size-sm); }
.data-table th[b-ohn2gxjjt5] { padding: 0.875rem 1rem; text-align: left; font-weight: 600; color: var(--text-primary); background-color: var(--bg-hover); border-bottom: 1px solid var(--border-color); }
.data-table td[b-ohn2gxjjt5] { padding: 0.875rem 1rem; border-bottom: 1px solid var(--border-color); color: var(--text-primary); }
.data-table tbody tr:hover[b-ohn2gxjjt5] { background-color: var(--bg-hover); }
.data-table tbody tr:last-child td[b-ohn2gxjjt5] { border-bottom: none; }

/* Badges */
.legajo-badge[b-ohn2gxjjt5] { display: inline-block; padding: 0.25rem 0.5rem; font-size: var(--font-size-xs); font-weight: 500; background-color: var(--bg-hover); color: var(--text-primary); border-radius: var(--border-radius); font-family: monospace; }
.time-badge[b-ohn2gxjjt5] { display: inline-block; padding: 0.25rem 0.5rem; font-size: var(--font-size-xs); font-weight: 600; background-color: var(--bg-hover); color: var(--text-primary); border-radius: var(--border-radius); }
.status-badge[b-ohn2gxjjt5] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.25rem 0.5rem; font-size: var(--font-size-xs); font-weight: 500; border-radius: var(--border-radius); }
.status-badge .material-icons[b-ohn2gxjjt5] { font-size: 14px; }
.status-badge--success[b-ohn2gxjjt5] { background-color: var(--color-success-bg); color: var(--color-success); }
.status-badge--warning[b-ohn2gxjjt5] { background-color: var(--color-warning-bg); color: var(--color-warning); }
.status-badge--danger[b-ohn2gxjjt5] { background-color: var(--color-danger-bg); color: var(--color-danger); }

/* Text Muted */
.text-muted[b-ohn2gxjjt5] { color: var(--text-muted); }

/* Empty/Success States */
.empty-state[b-ohn2gxjjt5], .success-state[b-ohn2gxjjt5] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem 2rem; gap: 0.75rem; }
.empty-state .material-icons[b-ohn2gxjjt5] { font-size: 48px; color: var(--text-muted); }
.empty-state p[b-ohn2gxjjt5] { margin: 0; font-size: var(--font-size-sm); color: var(--text-muted); }
.success-state .material-icons[b-ohn2gxjjt5] { font-size: 48px; color: var(--color-success); }
.success-state p[b-ohn2gxjjt5] { margin: 0; font-size: var(--font-size-sm); color: var(--color-success); font-weight: 500; }

/* Responsive */
@media (max-width: 1024px) {
    .stats-grid[b-ohn2gxjjt5] { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 768px) {
    .filter-grid[b-ohn2gxjjt5] { flex-direction: column; }
    .filter-grid .form-group[b-ohn2gxjjt5] { min-width: 100%; }
    .filter-actions[b-ohn2gxjjt5] { width: 100%; }
    .filter-actions .btn-filter[b-ohn2gxjjt5] { flex: 1; }
    .stats-grid[b-ohn2gxjjt5] { grid-template-columns: 1fr; }
    .tabs-header[b-ohn2gxjjt5] { flex-wrap: wrap; }
    .tab-btn[b-ohn2gxjjt5] { flex: 1; justify-content: center; }
}

/* Dark Mode */
[data-theme="dark"] .filter-card[b-ohn2gxjjt5], [data-theme="dark"] .stat-card[b-ohn2gxjjt5], [data-theme="dark"] .report-title[b-ohn2gxjjt5], [data-theme="dark"] .tabs-container[b-ohn2gxjjt5], [data-theme="dark"] .loading-state[b-ohn2gxjjt5] { background-color: var(--bg-card); border-color: var(--border-color); }
[data-theme="dark"] .tabs-header[b-ohn2gxjjt5] { background-color: rgba(255, 255, 255, 0.05); }
[data-theme="dark"] .data-table th[b-ohn2gxjjt5] { background-color: rgba(255, 255, 255, 0.05); }
[data-theme="dark"] .tab-btn:hover[b-ohn2gxjjt5] { background-color: rgba(255, 255, 255, 0.05); }
[data-theme="dark"] .tab-btn--active[b-ohn2gxjjt5] { background-color: var(--bg-card); }
/* _content/Geniar.Asistencias.Web/Pages/Reportes/EstadisticasMensuales.razor.rz.scp.css */
/* ============================================
   ESTADISTICAS MENSUALES REPORT STYLES
   ============================================ */

.report-page[b-tps2w8bmib] { display: flex; flex-direction: column; gap: 1.5rem; }

/* Page Header */
.page-header[b-tps2w8bmib] { display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 1rem; }
.page-header__info[b-tps2w8bmib] { flex: 1; }
.page-header__title[b-tps2w8bmib] { margin: 0 0 0.25rem 0; font-size: var(--font-size-3xl); font-weight: 700; color: var(--text-primary); }
.page-header__subtitle[b-tps2w8bmib] { margin: 0; font-size: var(--font-size-base); color: var(--text-secondary); }

/* Filter Card */
.filter-card[b-tps2w8bmib] { background-color: var(--bg-card); border: 1px solid var(--border-color); border-radius: var(--border-radius-xl); padding: 1.25rem; }
.filter-grid[b-tps2w8bmib] { display: flex; gap: 1rem; align-items: flex-end; flex-wrap: wrap; }
.filter-grid .form-group[b-tps2w8bmib] { flex: 1; min-width: 120px; margin: 0; }
.filter-actions[b-tps2w8bmib] { display: flex; gap: 0.5rem; }

/* Form Styles */
.form-label[b-tps2w8bmib] { display: flex; align-items: center; gap: 0.375rem; margin-bottom: 0.5rem; font-size: var(--font-size-sm); font-weight: 500; color: var(--text-primary); }
.form-label .material-icons[b-tps2w8bmib] { font-size: 16px; color: var(--color-primary); }
.form-input[b-tps2w8bmib] { width: 100%; padding: 0.625rem 0.875rem; font-size: var(--font-size-sm); border: 1px solid var(--border-color); border-radius: var(--border-radius); background-color: var(--bg-card); color: var(--text-primary); }
.form-input:focus[b-tps2w8bmib] { outline: none; border-color: var(--color-primary); box-shadow: 0 0 0 3px rgba(29, 78, 216, 0.1); }

/* Filter Buttons */
.btn-filter[b-tps2w8bmib] { display: inline-flex; align-items: center; justify-content: center; gap: 0.5rem; padding: 0.625rem 1rem; font-size: var(--font-size-sm); font-weight: 500; border: none; border-radius: var(--border-radius); cursor: pointer; transition: all var(--transition-fast); }
.btn-filter .material-icons[b-tps2w8bmib] { font-size: 18px; }
.btn-filter:disabled[b-tps2w8bmib] { opacity: 0.6; cursor: not-allowed; }
.btn-filter--primary[b-tps2w8bmib] { background-color: var(--color-primary); color: white; }
.btn-filter--primary:hover:not(:disabled)[b-tps2w8bmib] { background-color: var(--color-primary-hover); }

/* Loading State */
.loading-state[b-tps2w8bmib] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 4rem 2rem; gap: 1rem; background-color: var(--bg-card); border: 1px solid var(--border-color); border-radius: var(--border-radius-xl); color: var(--text-secondary); }
.loading-state .spinner-border[b-tps2w8bmib] { width: 3rem; height: 3rem; }

/* Stats Grid */
.stats-grid[b-tps2w8bmib] { display: grid; grid-template-columns: repeat(6, 1fr); gap: 1rem; }
.stat-card[b-tps2w8bmib] { display: flex; align-items: center; gap: 1rem; padding: 1.25rem; background-color: var(--bg-card); border: 1px solid var(--border-color); border-radius: var(--border-radius-xl); }
.stat-card__icon[b-tps2w8bmib] { display: flex; align-items: center; justify-content: center; width: 48px; height: 48px; border-radius: var(--border-radius-lg); flex-shrink: 0; }
.stat-card__icon .material-icons[b-tps2w8bmib] { font-size: 24px; }
.stat-card--primary .stat-card__icon[b-tps2w8bmib] { background-color: var(--color-primary-bg); color: var(--color-primary); }
.stat-card--success .stat-card__icon[b-tps2w8bmib] { background-color: var(--color-success-bg); color: var(--color-success); }
.stat-card--cyan .stat-card__icon[b-tps2w8bmib] { background-color: rgba(6, 182, 212, 0.1); color: #06B6D4; }
.stat-card--info .stat-card__icon[b-tps2w8bmib] { background-color: rgba(59, 130, 246, 0.1); color: #3B82F6; }
.stat-card--warning .stat-card__icon[b-tps2w8bmib] { background-color: var(--color-warning-bg); color: var(--color-warning); }
.stat-card--danger .stat-card__icon[b-tps2w8bmib] { background-color: var(--color-danger-bg); color: var(--color-danger); }
.stat-card__content[b-tps2w8bmib] { display: flex; flex-direction: column; }
.stat-card__value[b-tps2w8bmib] { font-size: var(--font-size-2xl); font-weight: 700; color: var(--text-primary); line-height: 1.2; }
.stat-card__label[b-tps2w8bmib] { font-size: var(--font-size-xs); color: var(--text-muted); }

/* Report Title */
.report-title[b-tps2w8bmib] { display: flex; align-items: center; gap: 0.75rem; padding: 1rem 1.25rem; background-color: var(--bg-card); border: 1px solid var(--border-color); border-radius: var(--border-radius-xl); font-size: var(--font-size-base); font-weight: 600; color: var(--text-primary); }
.report-title .material-icons[b-tps2w8bmib] { font-size: 24px; color: var(--color-primary); }
.report-title__sucursal[b-tps2w8bmib] { padding: 0.25rem 0.75rem; background-color: var(--color-primary-bg); color: var(--color-primary); border-radius: var(--border-radius); font-size: var(--font-size-sm); font-weight: 500; }
.report-title__dias[b-tps2w8bmib] { margin-left: auto; padding: 0.25rem 0.75rem; background-color: var(--bg-hover); color: var(--text-secondary); border-radius: var(--border-radius); font-size: var(--font-size-sm); font-weight: 500; }

/* Table Card */
.table-card[b-tps2w8bmib] { background-color: var(--bg-card); border: 1px solid var(--border-color); border-radius: var(--border-radius-xl); overflow: hidden; }
.table-card__header[b-tps2w8bmib] { display: flex; align-items: center; gap: 0.5rem; padding: 1rem 1.25rem; background-color: var(--bg-hover); font-size: var(--font-size-base); font-weight: 600; color: var(--text-primary); border-bottom: 1px solid var(--border-color); }
.table-card__header .material-icons[b-tps2w8bmib] { font-size: 20px; color: var(--color-primary); }
.table-card__body[b-tps2w8bmib] { padding: 0; }

/* Table Container */
.table-container[b-tps2w8bmib] { overflow-x: auto; }
.data-table[b-tps2w8bmib] { width: 100%; border-collapse: collapse; font-size: var(--font-size-sm); }
.data-table th[b-tps2w8bmib] { padding: 0.875rem 1rem; text-align: left; font-weight: 600; color: var(--text-primary); background-color: var(--bg-hover); border-bottom: 1px solid var(--border-color); }
.data-table td[b-tps2w8bmib] { padding: 0.875rem 1rem; border-bottom: 1px solid var(--border-color); color: var(--text-primary); }
.data-table tbody tr:hover[b-tps2w8bmib] { background-color: var(--bg-hover); }
.data-table tbody tr:last-child td[b-tps2w8bmib] { border-bottom: none; }
.text-center[b-tps2w8bmib] { text-align: center; }

/* Badges */
.legajo-badge[b-tps2w8bmib] { display: inline-block; padding: 0.25rem 0.5rem; font-size: var(--font-size-xs); font-weight: 500; background-color: var(--bg-hover); color: var(--text-primary); border-radius: var(--border-radius); font-family: monospace; }
.count-badge[b-tps2w8bmib] { display: inline-flex; align-items: center; justify-content: center; min-width: 28px; height: 24px; padding: 0 0.5rem; font-size: var(--font-size-xs); font-weight: 600; border-radius: 9999px; }
.count-badge--success[b-tps2w8bmib] { background-color: var(--color-success-bg); color: var(--color-success); }
.count-badge--warning[b-tps2w8bmib] { background-color: var(--color-warning-bg); color: var(--color-warning); }
.count-badge--danger[b-tps2w8bmib] { background-color: var(--color-danger-bg); color: var(--color-danger); }
.percent-badge[b-tps2w8bmib] { display: inline-block; padding: 0.25rem 0.5rem; font-size: var(--font-size-xs); font-weight: 600; border-radius: var(--border-radius); }
.percent-badge--success[b-tps2w8bmib] { background-color: var(--color-success-bg); color: var(--color-success); }
.percent-badge--warning[b-tps2w8bmib] { background-color: var(--color-warning-bg); color: var(--color-warning); }
.percent-badge--danger[b-tps2w8bmib] { background-color: var(--color-danger-bg); color: var(--color-danger); }
.hours-badge[b-tps2w8bmib] { display: inline-block; padding: 0.25rem 0.5rem; font-size: var(--font-size-xs); font-weight: 600; background-color: rgba(6, 182, 212, 0.1); color: #06B6D4; border-radius: var(--border-radius); }

/* Empty State */
.empty-state[b-tps2w8bmib] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem 2rem; gap: 0.75rem; }
.empty-state .material-icons[b-tps2w8bmib] { font-size: 48px; color: var(--text-muted); }
.empty-state p[b-tps2w8bmib] { margin: 0; font-size: var(--font-size-sm); color: var(--text-muted); }

/* Responsive */
@media (max-width: 1400px) { .stats-grid[b-tps2w8bmib] { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 1024px) { .stats-grid[b-tps2w8bmib] { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 768px) {
    .stats-grid[b-tps2w8bmib] { grid-template-columns: 1fr; }
    .filter-grid[b-tps2w8bmib] { flex-direction: column; }
    .filter-grid .form-group[b-tps2w8bmib] { min-width: 100%; }
    .filter-actions[b-tps2w8bmib] { width: 100%; }
    .filter-actions .btn-filter[b-tps2w8bmib] { flex: 1; }
    .report-title[b-tps2w8bmib] { flex-wrap: wrap; }
    .report-title__dias[b-tps2w8bmib] { margin-left: 0; margin-top: 0.5rem; width: 100%; text-align: center; }
}

/* Dark Mode */
[data-theme="dark"] .filter-card[b-tps2w8bmib], [data-theme="dark"] .stat-card[b-tps2w8bmib], [data-theme="dark"] .table-card[b-tps2w8bmib], [data-theme="dark"] .loading-state[b-tps2w8bmib], [data-theme="dark"] .report-title[b-tps2w8bmib] { background-color: var(--bg-card); border-color: var(--border-color); }
[data-theme="dark"] .table-card__header[b-tps2w8bmib], [data-theme="dark"] .data-table th[b-tps2w8bmib] { background-color: rgba(255, 255, 255, 0.05); }
/* _content/Geniar.Asistencias.Web/Pages/Reportes/HorasTrabajadas.razor.rz.scp.css */
/* ============================================
   HORAS TRABAJADAS REPORT STYLES
   ============================================ */

.report-page[b-5le321kn5r] { display: flex; flex-direction: column; gap: 1.5rem; }

/* Page Header */
.page-header[b-5le321kn5r] { display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 1rem; }
.page-header__info[b-5le321kn5r] { flex: 1; }
.page-header__title[b-5le321kn5r] { margin: 0 0 0.25rem 0; font-size: var(--font-size-3xl); font-weight: 700; color: var(--text-primary); }
.page-header__subtitle[b-5le321kn5r] { margin: 0; font-size: var(--font-size-base); color: var(--text-secondary); }

/* Filter Card */
.filter-card[b-5le321kn5r] { background-color: var(--bg-card); border: 1px solid var(--border-color); border-radius: var(--border-radius-xl); padding: 1.25rem; }
.filter-grid[b-5le321kn5r] { display: flex; gap: 1rem; align-items: flex-end; flex-wrap: wrap; }
.filter-grid .form-group[b-5le321kn5r] { flex: 1; min-width: 120px; margin: 0; }
.filter-actions[b-5le321kn5r] { display: flex; gap: 0.5rem; }

/* Form Styles */
.form-label[b-5le321kn5r] { display: flex; align-items: center; gap: 0.375rem; margin-bottom: 0.5rem; font-size: var(--font-size-sm); font-weight: 500; color: var(--text-primary); }
.form-label .material-icons[b-5le321kn5r] { font-size: 16px; color: var(--color-primary); }
.form-input[b-5le321kn5r] { width: 100%; padding: 0.625rem 0.875rem; font-size: var(--font-size-sm); border: 1px solid var(--border-color); border-radius: var(--border-radius); background-color: var(--bg-card); color: var(--text-primary); }
.form-input:focus[b-5le321kn5r] { outline: none; border-color: var(--color-primary); box-shadow: 0 0 0 3px rgba(29, 78, 216, 0.1); }

/* Filter Buttons */
.btn-filter[b-5le321kn5r] { display: inline-flex; align-items: center; justify-content: center; gap: 0.5rem; padding: 0.625rem 1rem; font-size: var(--font-size-sm); font-weight: 500; border: none; border-radius: var(--border-radius); cursor: pointer; transition: all var(--transition-fast); }
.btn-filter .material-icons[b-5le321kn5r] { font-size: 18px; }
.btn-filter:disabled[b-5le321kn5r] { opacity: 0.6; cursor: not-allowed; }
.btn-filter--primary[b-5le321kn5r] { background-color: var(--color-primary); color: white; }
.btn-filter--primary:hover:not(:disabled)[b-5le321kn5r] { background-color: var(--color-primary-hover); }

/* Loading State */
.loading-state[b-5le321kn5r] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 4rem 2rem; gap: 1rem; background-color: var(--bg-card); border: 1px solid var(--border-color); border-radius: var(--border-radius-xl); color: var(--text-secondary); }
.loading-state .spinner-border[b-5le321kn5r] { width: 3rem; height: 3rem; }

/* Stats Grid */
.stats-grid[b-5le321kn5r] { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1rem; }
.stat-card[b-5le321kn5r] { display: flex; align-items: center; gap: 1rem; padding: 1.25rem; background-color: var(--bg-card); border: 1px solid var(--border-color); border-radius: var(--border-radius-xl); }
.stat-card__icon[b-5le321kn5r] { display: flex; align-items: center; justify-content: center; width: 48px; height: 48px; border-radius: var(--border-radius-lg); flex-shrink: 0; }
.stat-card__icon .material-icons[b-5le321kn5r] { font-size: 24px; }
.stat-card--primary .stat-card__icon[b-5le321kn5r] { background-color: var(--color-primary-bg); color: var(--color-primary); }
.stat-card--success .stat-card__icon[b-5le321kn5r] { background-color: var(--color-success-bg); color: var(--color-success); }
.stat-card--cyan .stat-card__icon[b-5le321kn5r] { background-color: rgba(6, 182, 212, 0.1); color: #06B6D4; }
.stat-card__content[b-5le321kn5r] { display: flex; flex-direction: column; }
.stat-card__value[b-5le321kn5r] { font-size: var(--font-size-2xl); font-weight: 700; color: var(--text-primary); line-height: 1.2; }
.stat-card__label[b-5le321kn5r] { font-size: var(--font-size-xs); color: var(--text-muted); }
.stat-card__badge[b-5le321kn5r] { display: inline-block; margin-top: 0.25rem; padding: 0.125rem 0.375rem; font-size: 10px; font-weight: 600; border-radius: var(--border-radius); }
.stat-card--primary .stat-card__badge[b-5le321kn5r] { background-color: var(--color-primary-bg); color: var(--color-primary); }
.stat-card--success .stat-card__badge[b-5le321kn5r] { background-color: var(--color-success-bg); color: var(--color-success); }
.stat-card--cyan .stat-card__badge[b-5le321kn5r] { background-color: rgba(6, 182, 212, 0.1); color: #06B6D4; }

/* Tabs */
.tabs-container[b-5le321kn5r] { background-color: var(--bg-card); border: 1px solid var(--border-color); border-radius: var(--border-radius-xl); overflow: hidden; }
.tabs-header[b-5le321kn5r] { display: flex; gap: 0; border-bottom: 1px solid var(--border-color); background-color: var(--bg-hover); }
.tab-btn[b-5le321kn5r] { display: flex; align-items: center; gap: 0.5rem; padding: 0.875rem 1.25rem; font-size: var(--font-size-sm); font-weight: 500; color: var(--text-secondary); background: none; border: none; cursor: pointer; transition: all var(--transition-fast); border-bottom: 2px solid transparent; margin-bottom: -1px; }
.tab-btn .material-icons[b-5le321kn5r] { font-size: 18px; }
.tab-btn:hover[b-5le321kn5r] { color: var(--text-primary); background-color: rgba(0, 0, 0, 0.03); }
.tab-btn--active[b-5le321kn5r] { color: var(--color-primary); border-bottom-color: var(--color-primary); background-color: var(--bg-card); }
.tabs-content[b-5le321kn5r] { padding: 0; }

/* Table Container */
.table-container[b-5le321kn5r] { overflow-x: auto; }
.data-table[b-5le321kn5r] { width: 100%; border-collapse: collapse; font-size: var(--font-size-sm); }
.data-table th[b-5le321kn5r] { padding: 0.875rem 1rem; text-align: left; font-weight: 600; color: var(--text-primary); background-color: var(--bg-hover); border-bottom: 1px solid var(--border-color); }
.data-table td[b-5le321kn5r] { padding: 0.875rem 1rem; border-bottom: 1px solid var(--border-color); color: var(--text-primary); }
.data-table tbody tr:hover[b-5le321kn5r] { background-color: var(--bg-hover); }
.data-table tbody tr:last-child td[b-5le321kn5r] { border-bottom: none; }
.text-center[b-5le321kn5r] { text-align: center; }
.text-muted[b-5le321kn5r] { color: var(--text-muted); }

/* Badges */
.legajo-badge[b-5le321kn5r] { display: inline-block; padding: 0.25rem 0.5rem; font-size: var(--font-size-xs); font-weight: 500; background-color: var(--bg-hover); color: var(--text-primary); border-radius: var(--border-radius); font-family: monospace; }
.count-badge[b-5le321kn5r] { display: inline-flex; align-items: center; justify-content: center; min-width: 28px; height: 24px; padding: 0 0.5rem; font-size: var(--font-size-xs); font-weight: 600; border-radius: 9999px; }
.count-badge--success[b-5le321kn5r] { background-color: var(--color-success-bg); color: var(--color-success); }
.hours-badge[b-5le321kn5r] { display: inline-block; padding: 0.25rem 0.5rem; font-size: var(--font-size-xs); font-weight: 600; border-radius: var(--border-radius); }
.hours-badge--primary[b-5le321kn5r] { background-color: var(--color-primary-bg); color: var(--color-primary); }
.hours-badge--cyan[b-5le321kn5r] { background-color: rgba(6, 182, 212, 0.1); color: #06B6D4; }
.time-badge[b-5le321kn5r] { display: inline-block; padding: 0.25rem 0.5rem; font-size: var(--font-size-xs); font-weight: 600; background-color: var(--bg-hover); color: var(--text-primary); border-radius: var(--border-radius); }
.status-badge[b-5le321kn5r] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.25rem 0.5rem; font-size: var(--font-size-xs); font-weight: 500; border-radius: var(--border-radius); }
.status-badge .material-icons[b-5le321kn5r] { font-size: 14px; }
.status-badge--success[b-5le321kn5r] { background-color: var(--color-success-bg); color: var(--color-success); }
.status-badge--warning[b-5le321kn5r] { background-color: var(--color-warning-bg); color: var(--color-warning); }

/* Empty State */
.empty-state[b-5le321kn5r] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem 2rem; gap: 0.75rem; }
.empty-state .material-icons[b-5le321kn5r] { font-size: 48px; color: var(--text-muted); }
.empty-state p[b-5le321kn5r] { margin: 0; font-size: var(--font-size-sm); color: var(--text-muted); }

/* Responsive */
@media (max-width: 1024px) { .stats-grid[b-5le321kn5r] { grid-template-columns: 1fr; } }
@media (max-width: 768px) { .filter-grid[b-5le321kn5r] { flex-direction: column; } .filter-grid .form-group[b-5le321kn5r] { min-width: 100%; } .filter-actions[b-5le321kn5r] { width: 100%; } .filter-actions .btn-filter[b-5le321kn5r] { flex: 1; } .tabs-header[b-5le321kn5r] { flex-wrap: wrap; } .tab-btn[b-5le321kn5r] { flex: 1; justify-content: center; } }

/* Dark Mode */
[data-theme="dark"] .filter-card[b-5le321kn5r], [data-theme="dark"] .stat-card[b-5le321kn5r], [data-theme="dark"] .tabs-container[b-5le321kn5r], [data-theme="dark"] .loading-state[b-5le321kn5r] { background-color: var(--bg-card); border-color: var(--border-color); }
[data-theme="dark"] .tabs-header[b-5le321kn5r] { background-color: rgba(255, 255, 255, 0.05); }
[data-theme="dark"] .data-table th[b-5le321kn5r] { background-color: rgba(255, 255, 255, 0.05); }
[data-theme="dark"] .tab-btn:hover[b-5le321kn5r] { background-color: rgba(255, 255, 255, 0.05); }
[data-theme="dark"] .tab-btn--active[b-5le321kn5r] { background-color: var(--bg-card); }
/* _content/Geniar.Asistencias.Web/Pages/Reportes/Index.razor.rz.scp.css */
/* ============================================
   REPORTES INDEX PAGE STYLES
   ============================================ */

.reports-page[b-fjbqc3qh6l] { display: flex; flex-direction: column; gap: 1.5rem; }

/* Page Header */
.page-header[b-fjbqc3qh6l] { display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 1rem; }
.page-header__info[b-fjbqc3qh6l] { flex: 1; }
.page-header__title[b-fjbqc3qh6l] { margin: 0 0 0.25rem 0; font-size: var(--font-size-3xl); font-weight: 700; color: var(--text-primary); }
.page-header__subtitle[b-fjbqc3qh6l] { margin: 0; font-size: var(--font-size-base); color: var(--text-secondary); }

/* Reports Grid */
.reports-grid[b-fjbqc3qh6l] { display: grid; grid-template-columns: repeat(auto-fill, minmax(360px, 1fr)); gap: 1.25rem; }

/* Report Card */
.report-card[b-fjbqc3qh6l] { display: flex; align-items: flex-start; gap: 1rem; padding: 1.5rem; background-color: var(--bg-card); border: 1px solid var(--border-color); border-radius: var(--border-radius-xl); text-decoration: none; transition: all var(--transition-fast); }
.report-card:hover[b-fjbqc3qh6l] { transform: translateY(-4px); box-shadow: 0 10px 25px -5px rgba(0, 0, 0, 0.1); border-color: var(--color-primary); }

/* Report Card Icon */
.report-card__icon[b-fjbqc3qh6l] { display: flex; align-items: center; justify-content: center; width: 56px; height: 56px; border-radius: var(--border-radius-lg); flex-shrink: 0; }
.report-card__icon .material-icons[b-fjbqc3qh6l] { font-size: 28px; }
.report-card__icon--primary[b-fjbqc3qh6l] { background-color: var(--color-primary-bg); color: var(--color-primary); }
.report-card__icon--warning[b-fjbqc3qh6l] { background-color: var(--color-warning-bg); color: var(--color-warning); }
.report-card__icon--danger[b-fjbqc3qh6l] { background-color: var(--color-danger-bg); color: var(--color-danger); }
.report-card__icon--success[b-fjbqc3qh6l] { background-color: var(--color-success-bg); color: var(--color-success); }
.report-card__icon--cyan[b-fjbqc3qh6l] { background-color: rgba(6, 182, 212, 0.1); color: #06B6D4; }
.report-card__icon--secondary[b-fjbqc3qh6l] { background-color: var(--bg-hover); color: var(--text-secondary); }

/* Report Card Content */
.report-card__content[b-fjbqc3qh6l] { flex: 1; min-width: 0; }
.report-card__title[b-fjbqc3qh6l] { margin: 0 0 0.125rem 0; font-size: var(--font-size-base); font-weight: 600; color: var(--text-primary); }
.report-card__subtitle[b-fjbqc3qh6l] { display: block; font-size: var(--font-size-xs); color: var(--text-muted); margin-bottom: 0.5rem; }
.report-card__description[b-fjbqc3qh6l] { margin: 0; font-size: var(--font-size-sm); color: var(--text-secondary); line-height: 1.5; }

/* Report Card Action */
.report-card__action[b-fjbqc3qh6l] { display: flex; align-items: center; justify-content: center; width: 36px; height: 36px; border-radius: 50%; background-color: var(--bg-hover); color: var(--text-muted); flex-shrink: 0; transition: all var(--transition-fast); margin-top: 0.5rem; }
.report-card__action .material-icons[b-fjbqc3qh6l] { font-size: 20px; }
.report-card:hover .report-card__action[b-fjbqc3qh6l] { background-color: var(--color-primary); color: white; }

/* Responsive */
@media (max-width: 768px) {
    .reports-grid[b-fjbqc3qh6l] { grid-template-columns: 1fr; }
    .report-card[b-fjbqc3qh6l] { flex-direction: column; text-align: center; }
    .report-card__action[b-fjbqc3qh6l] { align-self: center; margin-top: 1rem; }
}

/* Dark Mode */
[data-theme="dark"] .report-card[b-fjbqc3qh6l] { background-color: var(--bg-card); border-color: var(--border-color); }
[data-theme="dark"] .report-card:hover[b-fjbqc3qh6l] { border-color: var(--color-primary); }
/* _content/Geniar.Asistencias.Web/Pages/Reportes/LlegadasTarde.razor.rz.scp.css */
/* ============================================
   LLEGADAS TARDE REPORT STYLES
   ============================================ */

.report-page[b-kj52xop0uu] { display: flex; flex-direction: column; gap: 1.5rem; }

/* Page Header */
.page-header[b-kj52xop0uu] { display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 1rem; }
.page-header__info[b-kj52xop0uu] { flex: 1; }
.page-header__title[b-kj52xop0uu] { margin: 0 0 0.25rem 0; font-size: var(--font-size-3xl); font-weight: 700; color: var(--text-primary); }
.page-header__subtitle[b-kj52xop0uu] { margin: 0; font-size: var(--font-size-base); color: var(--text-secondary); }

/* Filter Card */
.filter-card[b-kj52xop0uu] { background-color: var(--bg-card); border: 1px solid var(--border-color); border-radius: var(--border-radius-xl); padding: 1.25rem; }
.filter-grid[b-kj52xop0uu] { display: flex; gap: 1rem; align-items: flex-end; flex-wrap: wrap; }
.filter-grid .form-group[b-kj52xop0uu] { flex: 1; min-width: 150px; margin: 0; }
.filter-actions[b-kj52xop0uu] { display: flex; gap: 0.5rem; }

/* Form Styles */
.form-label[b-kj52xop0uu] { display: flex; align-items: center; gap: 0.375rem; margin-bottom: 0.5rem; font-size: var(--font-size-sm); font-weight: 500; color: var(--text-primary); }
.form-label .material-icons[b-kj52xop0uu] { font-size: 16px; color: var(--color-primary); }
.form-input[b-kj52xop0uu] { width: 100%; padding: 0.625rem 0.875rem; font-size: var(--font-size-sm); border: 1px solid var(--border-color); border-radius: var(--border-radius); background-color: var(--bg-card); color: var(--text-primary); }
.form-input:focus[b-kj52xop0uu] { outline: none; border-color: var(--color-primary); box-shadow: 0 0 0 3px rgba(29, 78, 216, 0.1); }

/* Filter Buttons */
.btn-filter[b-kj52xop0uu] { display: inline-flex; align-items: center; justify-content: center; gap: 0.5rem; padding: 0.625rem 1rem; font-size: var(--font-size-sm); font-weight: 500; border: none; border-radius: var(--border-radius); cursor: pointer; transition: all var(--transition-fast); }
.btn-filter .material-icons[b-kj52xop0uu] { font-size: 18px; }
.btn-filter:disabled[b-kj52xop0uu] { opacity: 0.6; cursor: not-allowed; }
.btn-filter--primary[b-kj52xop0uu] { background-color: var(--color-primary); color: white; }
.btn-filter--primary:hover:not(:disabled)[b-kj52xop0uu] { background-color: var(--color-primary-hover); }

/* Loading State */
.loading-state[b-kj52xop0uu] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 4rem 2rem; gap: 1rem; background-color: var(--bg-card); border: 1px solid var(--border-color); border-radius: var(--border-radius-xl); color: var(--text-secondary); }
.loading-state .spinner-border[b-kj52xop0uu] { width: 3rem; height: 3rem; }

/* Stats Grid */
.stats-grid[b-kj52xop0uu] { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1rem; }
.stat-card[b-kj52xop0uu] { display: flex; align-items: center; gap: 1rem; padding: 1.25rem; background-color: var(--bg-card); border: 1px solid var(--border-color); border-radius: var(--border-radius-xl); }
.stat-card__icon[b-kj52xop0uu] { display: flex; align-items: center; justify-content: center; width: 48px; height: 48px; border-radius: var(--border-radius-lg); flex-shrink: 0; }
.stat-card__icon .material-icons[b-kj52xop0uu] { font-size: 24px; }
.stat-card--warning .stat-card__icon[b-kj52xop0uu] { background-color: var(--color-warning-bg); color: var(--color-warning); }
.stat-card--danger .stat-card__icon[b-kj52xop0uu] { background-color: var(--color-danger-bg); color: var(--color-danger); }
.stat-card--cyan .stat-card__icon[b-kj52xop0uu] { background-color: rgba(6, 182, 212, 0.1); color: #06B6D4; }
.stat-card__content[b-kj52xop0uu] { display: flex; flex-direction: column; }
.stat-card__value[b-kj52xop0uu] { font-size: var(--font-size-2xl); font-weight: 700; color: var(--text-primary); line-height: 1.2; }
.stat-card__label[b-kj52xop0uu] { font-size: var(--font-size-xs); color: var(--text-muted); }
.stat-card__badge[b-kj52xop0uu] { display: inline-block; margin-top: 0.25rem; padding: 0.125rem 0.375rem; font-size: 10px; font-weight: 600; border-radius: var(--border-radius); }
.stat-card--warning .stat-card__badge[b-kj52xop0uu] { background-color: var(--color-warning-bg); color: var(--color-warning); }
.stat-card--danger .stat-card__badge[b-kj52xop0uu] { background-color: var(--color-danger-bg); color: var(--color-danger); }
.stat-card--cyan .stat-card__badge[b-kj52xop0uu] { background-color: rgba(6, 182, 212, 0.1); color: #06B6D4; }

/* Table Card */
.table-card[b-kj52xop0uu] { background-color: var(--bg-card); border: 1px solid var(--border-color); border-radius: var(--border-radius-xl); overflow: hidden; }
.table-card__header[b-kj52xop0uu] { display: flex; align-items: center; gap: 0.5rem; padding: 1rem 1.25rem; background-color: var(--bg-hover); font-size: var(--font-size-base); font-weight: 600; color: var(--text-primary); border-bottom: 1px solid var(--border-color); }
.table-card__header .material-icons[b-kj52xop0uu] { font-size: 20px; color: var(--color-primary); }
.table-card__body[b-kj52xop0uu] { padding: 0; }

/* Table Container */
.table-container[b-kj52xop0uu] { overflow-x: auto; }
.data-table[b-kj52xop0uu] { width: 100%; border-collapse: collapse; font-size: var(--font-size-sm); }
.data-table th[b-kj52xop0uu] { padding: 0.875rem 1rem; text-align: left; font-weight: 600; color: var(--text-primary); background-color: var(--bg-hover); border-bottom: 1px solid var(--border-color); }
.data-table td[b-kj52xop0uu] { padding: 0.875rem 1rem; border-bottom: 1px solid var(--border-color); color: var(--text-primary); }
.data-table tbody tr:hover[b-kj52xop0uu] { background-color: var(--bg-hover); }
.data-table tbody tr:last-child td[b-kj52xop0uu] { border-bottom: none; }
.text-center[b-kj52xop0uu] { text-align: center; }

/* Badges */
.legajo-badge[b-kj52xop0uu] { display: inline-block; padding: 0.25rem 0.5rem; font-size: var(--font-size-xs); font-weight: 500; background-color: var(--bg-hover); color: var(--text-primary); border-radius: var(--border-radius); font-family: monospace; }
.count-badge[b-kj52xop0uu] { display: inline-flex; align-items: center; justify-content: center; min-width: 28px; height: 24px; padding: 0 0.5rem; font-size: var(--font-size-xs); font-weight: 600; border-radius: 9999px; }
.count-badge--info[b-kj52xop0uu] { background-color: rgba(6, 182, 212, 0.1); color: #06B6D4; }
.count-badge--warning[b-kj52xop0uu] { background-color: var(--color-warning-bg); color: var(--color-warning); }
.count-badge--danger[b-kj52xop0uu] { background-color: var(--color-danger-bg); color: var(--color-danger); }
.minutes-badge[b-kj52xop0uu] { display: inline-block; padding: 0.25rem 0.5rem; font-size: var(--font-size-xs); font-weight: 600; border-radius: var(--border-radius); }
.minutes-badge--warning[b-kj52xop0uu] { background-color: var(--color-warning-bg); color: var(--color-warning); }
.minutes-badge--danger[b-kj52xop0uu] { background-color: var(--color-danger-bg); color: var(--color-danger); }
.minutes-badge--success[b-kj52xop0uu] { background-color: var(--color-success-bg); color: var(--color-success); }

/* Success State */
.success-state[b-kj52xop0uu] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem 2rem; gap: 0.75rem; }
.success-state .material-icons[b-kj52xop0uu] { font-size: 48px; color: var(--color-success); }
.success-state p[b-kj52xop0uu] { margin: 0; font-size: var(--font-size-sm); color: var(--color-success); font-weight: 500; }

/* Responsive */
@media (max-width: 1024px) {
    .stats-grid[b-kj52xop0uu] { grid-template-columns: 1fr; }
}
@media (max-width: 768px) {
    .filter-grid[b-kj52xop0uu] { flex-direction: column; }
    .filter-grid .form-group[b-kj52xop0uu] { min-width: 100%; }
    .filter-actions[b-kj52xop0uu] { width: 100%; }
    .filter-actions .btn-filter[b-kj52xop0uu] { flex: 1; }
}

/* Dark Mode */
[data-theme="dark"] .filter-card[b-kj52xop0uu], [data-theme="dark"] .stat-card[b-kj52xop0uu], [data-theme="dark"] .table-card[b-kj52xop0uu], [data-theme="dark"] .loading-state[b-kj52xop0uu] { background-color: var(--bg-card); border-color: var(--border-color); }
[data-theme="dark"] .table-card__header[b-kj52xop0uu], [data-theme="dark"] .data-table th[b-kj52xop0uu] { background-color: rgba(255, 255, 255, 0.05); }
/* _content/Geniar.Asistencias.Web/Pages/Reportes/PorEmpleado.razor.rz.scp.css */
/* ============================================
   POR EMPLEADO REPORT STYLES
   ============================================ */

.report-page[b-3gcfz0i2uo] { display: flex; flex-direction: column; gap: 1.5rem; }

/* Page Header */
.page-header[b-3gcfz0i2uo] { display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 1rem; }
.page-header__info[b-3gcfz0i2uo] { flex: 1; }
.page-header__title[b-3gcfz0i2uo] { margin: 0 0 0.25rem 0; font-size: var(--font-size-3xl); font-weight: 700; color: var(--text-primary); }
.page-header__subtitle[b-3gcfz0i2uo] { margin: 0; font-size: var(--font-size-base); color: var(--text-secondary); }

/* Filter Card */
.filter-card[b-3gcfz0i2uo] { background-color: var(--bg-card); border: 1px solid var(--border-color); border-radius: var(--border-radius-xl); padding: 1.25rem; }
.filter-grid[b-3gcfz0i2uo] { display: flex; gap: 1rem; align-items: flex-end; flex-wrap: wrap; }
.filter-grid .form-group[b-3gcfz0i2uo] { flex: 1; min-width: 140px; margin: 0; }
.filter-grid .form-group--large[b-3gcfz0i2uo] { flex: 2; min-width: 250px; }
.filter-actions[b-3gcfz0i2uo] { display: flex; gap: 0.5rem; }

/* Form Styles */
.form-label[b-3gcfz0i2uo] { display: flex; align-items: center; gap: 0.375rem; margin-bottom: 0.5rem; font-size: var(--font-size-sm); font-weight: 500; color: var(--text-primary); }
.form-label .material-icons[b-3gcfz0i2uo] { font-size: 16px; color: var(--color-primary); }
.form-input[b-3gcfz0i2uo] { width: 100%; padding: 0.625rem 0.875rem; font-size: var(--font-size-sm); border: 1px solid var(--border-color); border-radius: var(--border-radius); background-color: var(--bg-card); color: var(--text-primary); }
.form-input:focus[b-3gcfz0i2uo] { outline: none; border-color: var(--color-primary); box-shadow: 0 0 0 3px rgba(29, 78, 216, 0.1); }

/* Filter Buttons */
.btn-filter[b-3gcfz0i2uo] { display: inline-flex; align-items: center; justify-content: center; gap: 0.5rem; padding: 0.625rem 1rem; font-size: var(--font-size-sm); font-weight: 500; border: none; border-radius: var(--border-radius); cursor: pointer; transition: all var(--transition-fast); }
.btn-filter .material-icons[b-3gcfz0i2uo] { font-size: 18px; }
.btn-filter:disabled[b-3gcfz0i2uo] { opacity: 0.6; cursor: not-allowed; }
.btn-filter--primary[b-3gcfz0i2uo] { background-color: var(--color-primary); color: white; }
.btn-filter--primary:hover:not(:disabled)[b-3gcfz0i2uo] { background-color: var(--color-primary-hover); }

/* Loading State */
.loading-state[b-3gcfz0i2uo] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 4rem 2rem; gap: 1rem; background-color: var(--bg-card); border: 1px solid var(--border-color); border-radius: var(--border-radius-xl); color: var(--text-secondary); }
.loading-state .spinner-border[b-3gcfz0i2uo] { width: 3rem; height: 3rem; }

/* Employee Card */
.employee-card[b-3gcfz0i2uo] { display: flex; align-items: center; gap: 1.25rem; padding: 1.5rem; background-color: var(--bg-card); border: 1px solid var(--border-color); border-radius: var(--border-radius-xl); }
.employee-card__avatar[b-3gcfz0i2uo] { display: flex; align-items: center; justify-content: center; width: 72px; height: 72px; border-radius: 50%; background-color: var(--color-primary-bg); flex-shrink: 0; }
.employee-card__avatar .material-icons[b-3gcfz0i2uo] { font-size: 36px; color: var(--color-primary); }
.employee-card__info[b-3gcfz0i2uo] { flex: 1; }
.employee-card__name[b-3gcfz0i2uo] { margin: 0 0 0.75rem 0; font-size: var(--font-size-xl); font-weight: 700; color: var(--text-primary); }
.employee-card__details[b-3gcfz0i2uo] { display: flex; flex-wrap: wrap; gap: 0.75rem; }
.employee-card__badge[b-3gcfz0i2uo] { display: inline-flex; align-items: center; gap: 0.375rem; padding: 0.375rem 0.75rem; font-size: var(--font-size-sm); background-color: var(--bg-hover); color: var(--text-primary); border-radius: var(--border-radius); }
.employee-card__badge .material-icons[b-3gcfz0i2uo] { font-size: 16px; color: var(--text-muted); }

/* Stats Grid */
.stats-grid[b-3gcfz0i2uo] { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1rem; }
.stat-card[b-3gcfz0i2uo] { display: flex; align-items: center; gap: 1rem; padding: 1.25rem; background-color: var(--bg-card); border: 1px solid var(--border-color); border-radius: var(--border-radius-xl); }
.stat-card__icon[b-3gcfz0i2uo] { display: flex; align-items: center; justify-content: center; width: 48px; height: 48px; border-radius: var(--border-radius-lg); flex-shrink: 0; }
.stat-card__icon .material-icons[b-3gcfz0i2uo] { font-size: 24px; }
.stat-card--primary .stat-card__icon[b-3gcfz0i2uo] { background-color: var(--color-primary-bg); color: var(--color-primary); }
.stat-card--success .stat-card__icon[b-3gcfz0i2uo] { background-color: var(--color-success-bg); color: var(--color-success); }
.stat-card--cyan .stat-card__icon[b-3gcfz0i2uo] { background-color: rgba(6, 182, 212, 0.1); color: #06B6D4; }
.stat-card__content[b-3gcfz0i2uo] { display: flex; flex-direction: column; }
.stat-card__value[b-3gcfz0i2uo] { font-size: var(--font-size-2xl); font-weight: 700; color: var(--text-primary); line-height: 1.2; }
.stat-card__label[b-3gcfz0i2uo] { font-size: var(--font-size-xs); color: var(--text-muted); }

/* Table Card */
.table-card[b-3gcfz0i2uo] { background-color: var(--bg-card); border: 1px solid var(--border-color); border-radius: var(--border-radius-xl); overflow: hidden; }
.table-card__header[b-3gcfz0i2uo] { display: flex; align-items: center; gap: 0.5rem; padding: 1rem 1.25rem; background-color: var(--bg-hover); font-size: var(--font-size-base); font-weight: 600; color: var(--text-primary); border-bottom: 1px solid var(--border-color); }
.table-card__header .material-icons[b-3gcfz0i2uo] { font-size: 20px; color: var(--color-primary); }
.table-card__body[b-3gcfz0i2uo] { padding: 0; }

/* Table Container */
.table-container[b-3gcfz0i2uo] { overflow-x: auto; }
.data-table[b-3gcfz0i2uo] { width: 100%; border-collapse: collapse; font-size: var(--font-size-sm); }
.data-table th[b-3gcfz0i2uo] { padding: 0.875rem 1rem; text-align: left; font-weight: 600; color: var(--text-primary); background-color: var(--bg-hover); border-bottom: 1px solid var(--border-color); }
.data-table td[b-3gcfz0i2uo] { padding: 0.875rem 1rem; border-bottom: 1px solid var(--border-color); color: var(--text-primary); }
.data-table tbody tr:hover[b-3gcfz0i2uo] { background-color: var(--bg-hover); }
.data-table tbody tr:last-child td[b-3gcfz0i2uo] { border-bottom: none; }
.text-center[b-3gcfz0i2uo] { text-align: center; }
.text-muted[b-3gcfz0i2uo] { color: var(--text-muted); }

/* Date Cell */
.date-cell[b-3gcfz0i2uo] { display: flex; flex-direction: column; }
.date-cell__day[b-3gcfz0i2uo] { font-weight: 500; color: var(--text-primary); }
.date-cell__weekday[b-3gcfz0i2uo] { font-size: var(--font-size-xs); color: var(--text-muted); text-transform: capitalize; }

/* Badges */
.time-badge[b-3gcfz0i2uo] { display: inline-block; padding: 0.25rem 0.5rem; font-size: var(--font-size-xs); font-weight: 600; background-color: var(--bg-hover); color: var(--text-primary); border-radius: var(--border-radius); }
.time-badge--entry[b-3gcfz0i2uo] { background-color: var(--color-success-bg); color: var(--color-success); }
.time-badge--exit[b-3gcfz0i2uo] { background-color: var(--color-primary-bg); color: var(--color-primary); }
.hours-badge[b-3gcfz0i2uo] { display: inline-block; padding: 0.25rem 0.5rem; font-size: var(--font-size-xs); font-weight: 600; background-color: rgba(6, 182, 212, 0.1); color: #06B6D4; border-radius: var(--border-radius); }
.status-badge[b-3gcfz0i2uo] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.25rem 0.5rem; font-size: var(--font-size-xs); font-weight: 500; border-radius: var(--border-radius); }
.status-badge .material-icons[b-3gcfz0i2uo] { font-size: 14px; }
.status-badge--success[b-3gcfz0i2uo] { background-color: var(--color-success-bg); color: var(--color-success); }
.status-badge--warning[b-3gcfz0i2uo] { background-color: var(--color-warning-bg); color: var(--color-warning); }

/* Info Card */
.info-card[b-3gcfz0i2uo] { display: flex; align-items: center; gap: 1rem; padding: 1.25rem 1.5rem; background-color: var(--bg-card); border: 1px solid var(--border-color); border-radius: var(--border-radius-xl); }
.info-card .material-icons[b-3gcfz0i2uo] { font-size: 24px; }
.info-card p[b-3gcfz0i2uo] { margin: 0; font-size: var(--font-size-sm); color: var(--text-primary); }
.info-card--warning[b-3gcfz0i2uo] { border-color: var(--color-warning); }
.info-card--warning .material-icons[b-3gcfz0i2uo] { color: var(--color-warning); }

/* Empty State */
.empty-state[b-3gcfz0i2uo] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem 2rem; gap: 0.75rem; }
.empty-state .material-icons[b-3gcfz0i2uo] { font-size: 48px; color: var(--text-muted); }
.empty-state p[b-3gcfz0i2uo] { margin: 0; font-size: var(--font-size-sm); color: var(--text-muted); }

/* Responsive */
@media (max-width: 1024px) { .stats-grid[b-3gcfz0i2uo] { grid-template-columns: 1fr; } }
@media (max-width: 768px) {
    .filter-grid[b-3gcfz0i2uo] { flex-direction: column; }
    .filter-grid .form-group[b-3gcfz0i2uo], .filter-grid .form-group--large[b-3gcfz0i2uo] { min-width: 100%; }
    .filter-actions[b-3gcfz0i2uo] { width: 100%; }
    .filter-actions .btn-filter[b-3gcfz0i2uo] { flex: 1; }
    .employee-card[b-3gcfz0i2uo] { flex-direction: column; text-align: center; }
    .employee-card__details[b-3gcfz0i2uo] { justify-content: center; }
}

/* Dark Mode */
[data-theme="dark"] .filter-card[b-3gcfz0i2uo], [data-theme="dark"] .stat-card[b-3gcfz0i2uo], [data-theme="dark"] .table-card[b-3gcfz0i2uo], [data-theme="dark"] .loading-state[b-3gcfz0i2uo], [data-theme="dark"] .employee-card[b-3gcfz0i2uo], [data-theme="dark"] .info-card[b-3gcfz0i2uo] { background-color: var(--bg-card); border-color: var(--border-color); }
[data-theme="dark"] .table-card__header[b-3gcfz0i2uo], [data-theme="dark"] .data-table th[b-3gcfz0i2uo] { background-color: rgba(255, 255, 255, 0.05); }
/* _content/Geniar.Asistencias.Web/Pages/Sucursales/Crear.razor.rz.scp.css */
/* ============================================
   CREAR SUCURSAL FORM STYLES
   ============================================ */

.form-page[b-nq0e8rzy4t] { display: flex; flex-direction: column; gap: 1.5rem; }

/* Page Header */
.page-header[b-nq0e8rzy4t] { display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 1rem; }
.page-header__info[b-nq0e8rzy4t] { flex: 1; }
.page-header__title[b-nq0e8rzy4t] { margin: 0 0 0.25rem 0; font-size: var(--font-size-3xl); font-weight: 700; color: var(--text-primary); }
.page-header__subtitle[b-nq0e8rzy4t] { margin: 0; font-size: var(--font-size-base); color: var(--text-secondary); }
.page-header__actions[b-nq0e8rzy4t] { display: flex; gap: 0.75rem; }

/* Form Card */
.form-card[b-nq0e8rzy4t] { background-color: var(--bg-card); border: 1px solid var(--border-color); border-radius: var(--border-radius-xl); padding: 1.5rem; }

/* Form Sections */
.form-section[b-nq0e8rzy4t] { padding: 1.5rem 0; border-bottom: 1px solid var(--border-color); }
.form-section:first-of-type[b-nq0e8rzy4t] { padding-top: 0; }
.form-section:last-of-type[b-nq0e8rzy4t] { border-bottom: none; }
.form-section__header[b-nq0e8rzy4t] { display: flex; align-items: center; gap: 0.75rem; margin-bottom: 1.25rem; }
.form-section__header .material-icons[b-nq0e8rzy4t] { font-size: 24px; color: var(--color-primary); }
.form-section__header h3[b-nq0e8rzy4t] { margin: 0; font-size: var(--font-size-lg); font-weight: 600; color: var(--text-primary); }

/* Form Grid */
.form-grid[b-nq0e8rzy4t] { display: grid; gap: 1rem; margin-bottom: 1rem; }
.form-grid--3-1[b-nq0e8rzy4t] { grid-template-columns: 3fr 1fr; }
.form-grid--5-4-3[b-nq0e8rzy4t] { grid-template-columns: 5fr 4fr 3fr; }
.form-grid--3[b-nq0e8rzy4t] { grid-template-columns: repeat(3, 1fr); }
.form-group[b-nq0e8rzy4t] { display: flex; flex-direction: column; gap: 0.375rem; }
.form-group--full[b-nq0e8rzy4t] { grid-column: 1 / -1; margin-bottom: 1rem; }

/* Form Elements */
.form-label[b-nq0e8rzy4t] { font-size: var(--font-size-sm); font-weight: 500; color: var(--text-primary); }
.form-label .required[b-nq0e8rzy4t] { color: var(--color-danger); }
.form-input[b-nq0e8rzy4t] { width: 100%; padding: 0.625rem 0.875rem; font-size: var(--font-size-sm); border: 1px solid var(--border-color); border-radius: var(--border-radius); background-color: var(--bg-card); color: var(--text-primary); transition: all var(--transition-fast); }
.form-input:focus[b-nq0e8rzy4t] { outline: none; border-color: var(--color-primary); box-shadow: 0 0 0 3px rgba(29, 78, 216, 0.1); }
.form-input--textarea[b-nq0e8rzy4t] { resize: vertical; min-height: 60px; }
.form-hint[b-nq0e8rzy4t] { font-size: var(--font-size-xs); color: var(--text-muted); }
.validation-message[b-nq0e8rzy4t] { font-size: var(--font-size-xs); color: var(--color-danger); }

/* Alert Card */
.alert-card[b-nq0e8rzy4t] { display: flex; align-items: flex-start; gap: 0.75rem; padding: 1rem; border-radius: var(--border-radius); margin-bottom: 1.5rem; }
.alert-card .material-icons[b-nq0e8rzy4t] { font-size: 20px; flex-shrink: 0; margin-top: 0.125rem; }
.alert-card--danger[b-nq0e8rzy4t] { background-color: var(--color-danger-bg); border: 1px solid var(--color-danger); }
.alert-card--danger .material-icons[b-nq0e8rzy4t] { color: var(--color-danger); }
.alert-card__content[b-nq0e8rzy4t] { flex: 1; }
.alert-card__content p[b-nq0e8rzy4t] { margin: 0 0 0.5rem 0; font-size: var(--font-size-sm); color: var(--text-primary); }
.alert-card__content ul[b-nq0e8rzy4t] { margin: 0; padding-left: 1.25rem; font-size: var(--font-size-sm); color: var(--text-secondary); }

/* Form Actions */
.form-actions[b-nq0e8rzy4t] { display: flex; justify-content: flex-end; gap: 0.75rem; padding-top: 1.5rem; border-top: 1px solid var(--border-color); margin-top: 0.5rem; }

/* Buttons */
.btn-action[b-nq0e8rzy4t] { display: inline-flex; align-items: center; justify-content: center; gap: 0.5rem; padding: 0.625rem 1.25rem; font-size: var(--font-size-sm); font-weight: 500; border: none; border-radius: var(--border-radius); cursor: pointer; transition: all var(--transition-fast); text-decoration: none; }
.btn-action .material-icons[b-nq0e8rzy4t] { font-size: 18px; }
.btn-action:disabled[b-nq0e8rzy4t] { opacity: 0.6; cursor: not-allowed; }
.btn-action--primary[b-nq0e8rzy4t] { background-color: var(--color-primary); color: white; }
.btn-action--primary:hover:not(:disabled)[b-nq0e8rzy4t] { background-color: var(--color-primary-hover); }
.btn-action--secondary[b-nq0e8rzy4t] { background-color: var(--bg-hover); color: var(--text-primary); border: 1px solid var(--border-color); }
.btn-action--secondary:hover:not(:disabled)[b-nq0e8rzy4t] { background-color: var(--border-color); }

/* Responsive */
@media (max-width: 768px) {
    .page-header[b-nq0e8rzy4t] { flex-direction: column; align-items: flex-start; }
    .form-grid[b-nq0e8rzy4t], .form-grid--3-1[b-nq0e8rzy4t], .form-grid--5-4-3[b-nq0e8rzy4t], .form-grid--3[b-nq0e8rzy4t] { grid-template-columns: 1fr; }
    .form-actions[b-nq0e8rzy4t] { flex-direction: column-reverse; }
    .form-actions .btn-action[b-nq0e8rzy4t] { width: 100%; }
}

/* Dark Mode */
[data-theme="dark"] .form-card[b-nq0e8rzy4t] { background-color: var(--bg-card); border-color: var(--border-color); }
[data-theme="dark"] .form-input[b-nq0e8rzy4t] { background-color: rgba(255, 255, 255, 0.05); border-color: var(--border-color); }
/* _content/Geniar.Asistencias.Web/Pages/Sucursales/Detalle.razor.rz.scp.css */
/* ============================================
   DETALLE SUCURSAL STYLES
   ============================================ */

.detail-page[b-gidaqhftcp] { display: flex; flex-direction: column; gap: 1.5rem; }

/* Loading & Error States */
.loading-state[b-gidaqhftcp], .error-card[b-gidaqhftcp] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 4rem 2rem; gap: 1rem; background-color: var(--bg-card); border: 1px solid var(--border-color); border-radius: var(--border-radius-xl); }
.loading-state[b-gidaqhftcp] { color: var(--text-secondary); }
.loading-state .spinner-border[b-gidaqhftcp] { width: 3rem; height: 3rem; }
.error-card[b-gidaqhftcp] { color: var(--color-danger); }
.error-card .material-icons[b-gidaqhftcp] { font-size: 48px; }

/* Page Header */
.page-header[b-gidaqhftcp] { display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 1rem; }
.page-header__info[b-gidaqhftcp] { flex: 1; }
.page-header__title[b-gidaqhftcp] { margin: 0 0 0.25rem 0; font-size: var(--font-size-3xl); font-weight: 700; color: var(--text-primary); }
.page-header__subtitle[b-gidaqhftcp] { margin: 0; font-size: var(--font-size-base); color: var(--text-secondary); }
.page-header__actions[b-gidaqhftcp] { display: flex; gap: 0.75rem; flex-wrap: wrap; }

/* Detail Layout */
.detail-layout[b-gidaqhftcp] { display: grid; grid-template-columns: 1fr 320px; gap: 1.5rem; }
.detail-main[b-gidaqhftcp] { display: flex; flex-direction: column; gap: 1.5rem; }
.detail-sidebar[b-gidaqhftcp] { display: flex; flex-direction: column; gap: 1.5rem; }

/* Branch Header Card */
.branch-header-card[b-gidaqhftcp] { display: flex; align-items: center; gap: 1.5rem; padding: 1.5rem; background-color: var(--bg-card); border: 1px solid var(--border-color); border-radius: var(--border-radius-xl); }
.branch-header-card__icon[b-gidaqhftcp] { display: flex; align-items: center; justify-content: center; width: 72px; height: 72px; border-radius: 50%; background-color: var(--color-primary-bg); flex-shrink: 0; }
.branch-header-card__icon .material-icons[b-gidaqhftcp] { font-size: 36px; color: var(--color-primary); }
.branch-header-card__info[b-gidaqhftcp] { flex: 1; }
.branch-header-card__info h2[b-gidaqhftcp] { margin: 0 0 0.75rem 0; font-size: var(--font-size-xl); font-weight: 700; color: var(--text-primary); }
.branch-header-card__badges[b-gidaqhftcp] { display: flex; flex-wrap: wrap; gap: 0.5rem; }

/* Badges */
.badge-code[b-gidaqhftcp] { display: inline-flex; align-items: center; gap: 0.375rem; padding: 0.375rem 0.75rem; font-size: var(--font-size-sm); font-weight: 500; background-color: var(--bg-hover); color: var(--text-primary); border-radius: var(--border-radius); font-family: monospace; }
.badge-code .material-icons[b-gidaqhftcp] { font-size: 16px; color: var(--text-muted); }
.badge-status[b-gidaqhftcp] { display: inline-flex; align-items: center; padding: 0.375rem 0.75rem; font-size: var(--font-size-xs); font-weight: 600; border-radius: var(--border-radius); text-transform: uppercase; letter-spacing: 0.025em; }
.badge-status--activo[b-gidaqhftcp] { background-color: var(--color-success-bg); color: var(--color-success); }
.badge-status--inactivo[b-gidaqhftcp] { background-color: var(--bg-hover); color: var(--text-muted); }

/* Info Card */
.info-card[b-gidaqhftcp] { background-color: var(--bg-card); border: 1px solid var(--border-color); border-radius: var(--border-radius-xl); overflow: hidden; }
.info-card__header[b-gidaqhftcp] { display: flex; align-items: center; gap: 0.75rem; padding: 1rem 1.25rem; background-color: var(--bg-hover); border-bottom: 1px solid var(--border-color); }
.info-card__header .material-icons[b-gidaqhftcp] { font-size: 20px; color: var(--color-primary); }
.info-card__header h3[b-gidaqhftcp] { margin: 0; font-size: var(--font-size-base); font-weight: 600; color: var(--text-primary); }
.info-card__body[b-gidaqhftcp] { padding: 1.25rem; }

/* Info Grid */
.info-grid[b-gidaqhftcp] { display: grid; grid-template-columns: repeat(2, 1fr); gap: 1rem; }
.info-grid--3[b-gidaqhftcp] { grid-template-columns: repeat(3, 1fr); }
.info-item[b-gidaqhftcp] { display: flex; flex-direction: column; gap: 0.25rem; }
.info-item--full[b-gidaqhftcp] { grid-column: 1 / -1; }
.info-item__label[b-gidaqhftcp] { font-size: var(--font-size-xs); font-weight: 500; color: var(--text-muted); text-transform: uppercase; letter-spacing: 0.025em; }
.info-item__value[b-gidaqhftcp] { font-size: var(--font-size-sm); color: var(--text-primary); }
.info-item__value--mono[b-gidaqhftcp] { font-family: monospace; }

/* Map Link */
.map-link[b-gidaqhftcp] { display: flex; align-items: center; gap: 0.5rem; margin: 1.25rem 0; padding: 0.75rem 1rem; background-color: var(--color-primary-bg); border-radius: var(--border-radius); }
.map-link .material-icons[b-gidaqhftcp] { font-size: 20px; color: var(--color-primary); }
.map-link a[b-gidaqhftcp] { color: var(--color-primary); font-size: var(--font-size-sm); font-weight: 500; text-decoration: none; }
.map-link a:hover[b-gidaqhftcp] { text-decoration: underline; }

/* Map Container */
.map-container[b-gidaqhftcp] { height: 400px; width: 100%; border-radius: var(--border-radius); border: 2px solid var(--border-color); }

/* Action Card */
.action-card[b-gidaqhftcp] { display: flex; flex-direction: column; align-items: center; gap: 1rem; padding: 1.5rem; background-color: var(--bg-card); border: 1px solid var(--border-color); border-radius: var(--border-radius-xl); text-align: center; }
.action-card__icon[b-gidaqhftcp] { display: flex; align-items: center; justify-content: center; width: 64px; height: 64px; border-radius: 50%; }
.action-card__icon .material-icons[b-gidaqhftcp] { font-size: 32px; }
.action-card__icon--primary[b-gidaqhftcp] { background-color: var(--color-primary-bg); color: var(--color-primary); }
.action-card__title[b-gidaqhftcp] { margin: 0; font-size: var(--font-size-lg); font-weight: 600; color: var(--text-primary); }
.action-card__description[b-gidaqhftcp] { margin: 0; font-size: var(--font-size-sm); color: var(--text-muted); }

/* Summary Card */
.summary-card[b-gidaqhftcp] { background-color: var(--bg-card); border: 1px solid var(--border-color); border-radius: var(--border-radius-xl); overflow: hidden; }
.summary-card__header[b-gidaqhftcp] { display: flex; align-items: center; gap: 0.75rem; padding: 1rem 1.25rem; background-color: var(--bg-hover); border-bottom: 1px solid var(--border-color); }
.summary-card__header .material-icons[b-gidaqhftcp] { font-size: 20px; color: var(--color-primary); }
.summary-card__header h4[b-gidaqhftcp] { margin: 0; font-size: var(--font-size-base); font-weight: 600; color: var(--text-primary); }
.summary-card__body[b-gidaqhftcp] { padding: 1.25rem; display: flex; flex-direction: column; gap: 1rem; }
.summary-item[b-gidaqhftcp] { display: flex; flex-direction: column; gap: 0.25rem; }
.summary-item__label[b-gidaqhftcp] { font-size: var(--font-size-xs); font-weight: 500; color: var(--text-muted); text-transform: uppercase; letter-spacing: 0.025em; }
.summary-item__value[b-gidaqhftcp] { font-size: var(--font-size-sm); color: var(--text-primary); line-height: 1.5; }
.summary-item__hint[b-gidaqhftcp] { font-size: var(--font-size-xs); color: var(--text-muted); margin-top: 0.25rem; }

/* Buttons */
.btn-action[b-gidaqhftcp] { display: inline-flex; align-items: center; justify-content: center; gap: 0.5rem; padding: 0.625rem 1rem; font-size: var(--font-size-sm); font-weight: 500; border: none; border-radius: var(--border-radius); cursor: pointer; transition: all var(--transition-fast); text-decoration: none; }
.btn-action .material-icons[b-gidaqhftcp] { font-size: 18px; }
.btn-action--full[b-gidaqhftcp] { width: 100%; }
.btn-action--primary[b-gidaqhftcp] { background-color: var(--color-primary); color: white; }
.btn-action--primary:hover[b-gidaqhftcp] { background-color: var(--color-primary-hover); }
.btn-action--success[b-gidaqhftcp] { background-color: var(--color-success); color: white; }
.btn-action--success:hover[b-gidaqhftcp] { opacity: 0.9; }
.btn-action--warning[b-gidaqhftcp] { background-color: var(--color-warning-bg); color: var(--color-warning); }
.btn-action--warning:hover[b-gidaqhftcp] { background-color: rgba(245, 158, 11, 0.2); }
.btn-action--secondary[b-gidaqhftcp] { background-color: var(--bg-hover); color: var(--text-primary); border: 1px solid var(--border-color); }
.btn-action--secondary:hover[b-gidaqhftcp] { background-color: var(--border-color); }

/* Responsive */
@media (max-width: 1024px) {
    .detail-layout[b-gidaqhftcp] { grid-template-columns: 1fr; }
    .detail-sidebar[b-gidaqhftcp] { order: -1; }
    .info-grid--3[b-gidaqhftcp] { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 768px) {
    .page-header[b-gidaqhftcp] { flex-direction: column; align-items: flex-start; }
    .page-header__actions[b-gidaqhftcp] { width: 100%; flex-wrap: wrap; }
    .page-header__actions .btn-action[b-gidaqhftcp] { flex: 1; min-width: 120px; }
    .branch-header-card[b-gidaqhftcp] { flex-direction: column; text-align: center; }
    .branch-header-card__badges[b-gidaqhftcp] { justify-content: center; }
    .info-grid[b-gidaqhftcp], .info-grid--3[b-gidaqhftcp] { grid-template-columns: 1fr; }
    .map-container[b-gidaqhftcp] { height: 300px; }
}

/* Dark Mode */
[data-theme="dark"] .branch-header-card[b-gidaqhftcp], [data-theme="dark"] .info-card[b-gidaqhftcp], [data-theme="dark"] .action-card[b-gidaqhftcp], [data-theme="dark"] .summary-card[b-gidaqhftcp], [data-theme="dark"] .loading-state[b-gidaqhftcp], [data-theme="dark"] .error-card[b-gidaqhftcp] { background-color: var(--bg-card); border-color: var(--border-color); }
[data-theme="dark"] .info-card__header[b-gidaqhftcp], [data-theme="dark"] .summary-card__header[b-gidaqhftcp] { background-color: rgba(255, 255, 255, 0.05); }
/* _content/Geniar.Asistencias.Web/Pages/Sucursales/Editar.razor.rz.scp.css */
/* ============================================
   EDITAR SUCURSAL FORM STYLES
   ============================================ */

.form-page[b-4l5slg7zv3] { display: flex; flex-direction: column; gap: 1.5rem; }

/* Loading State */
.loading-state[b-4l5slg7zv3] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 4rem 2rem; gap: 1rem; background-color: var(--bg-card); border: 1px solid var(--border-color); border-radius: var(--border-radius-xl); color: var(--text-secondary); }
.loading-state .spinner-border[b-4l5slg7zv3] { width: 3rem; height: 3rem; }

/* Page Header */
.page-header[b-4l5slg7zv3] { display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 1rem; }
.page-header__info[b-4l5slg7zv3] { flex: 1; }
.page-header__title[b-4l5slg7zv3] { margin: 0 0 0.25rem 0; font-size: var(--font-size-3xl); font-weight: 700; color: var(--text-primary); }
.page-header__subtitle[b-4l5slg7zv3] { margin: 0; font-size: var(--font-size-base); color: var(--text-secondary); }
.page-header__actions[b-4l5slg7zv3] { display: flex; gap: 0.75rem; }

/* Form Card */
.form-card[b-4l5slg7zv3] { background-color: var(--bg-card); border: 1px solid var(--border-color); border-radius: var(--border-radius-xl); padding: 1.5rem; }

/* Form Sections */
.form-section[b-4l5slg7zv3] { padding: 1.5rem 0; border-bottom: 1px solid var(--border-color); }
.form-section:first-of-type[b-4l5slg7zv3] { padding-top: 0; }
.form-section:last-of-type[b-4l5slg7zv3] { border-bottom: none; }
.form-section__header[b-4l5slg7zv3] { display: flex; align-items: center; gap: 0.75rem; margin-bottom: 1.25rem; }
.form-section__header .material-icons[b-4l5slg7zv3] { font-size: 24px; color: var(--color-primary); }
.form-section__header h3[b-4l5slg7zv3] { margin: 0; font-size: var(--font-size-lg); font-weight: 600; color: var(--text-primary); }

/* Form Grid */
.form-grid[b-4l5slg7zv3] { display: grid; gap: 1rem; margin-bottom: 1rem; }
.form-grid--3-1[b-4l5slg7zv3] { grid-template-columns: 3fr 1fr; }
.form-grid--5-4-3[b-4l5slg7zv3] { grid-template-columns: 5fr 4fr 3fr; }
.form-grid--3[b-4l5slg7zv3] { grid-template-columns: repeat(3, 1fr); }
.form-group[b-4l5slg7zv3] { display: flex; flex-direction: column; gap: 0.375rem; }
.form-group--full[b-4l5slg7zv3] { grid-column: 1 / -1; margin-bottom: 1rem; }
.form-group--checkbox[b-4l5slg7zv3] { margin-top: 1rem; }

/* Form Elements */
.form-label[b-4l5slg7zv3] { font-size: var(--font-size-sm); font-weight: 500; color: var(--text-primary); }
.form-label .required[b-4l5slg7zv3] { color: var(--color-danger); }
.form-input[b-4l5slg7zv3] { width: 100%; padding: 0.625rem 0.875rem; font-size: var(--font-size-sm); border: 1px solid var(--border-color); border-radius: var(--border-radius); background-color: var(--bg-card); color: var(--text-primary); transition: all var(--transition-fast); }
.form-input:focus[b-4l5slg7zv3] { outline: none; border-color: var(--color-primary); box-shadow: 0 0 0 3px rgba(29, 78, 216, 0.1); }
.form-input--textarea[b-4l5slg7zv3] { resize: vertical; min-height: 60px; }
.form-hint[b-4l5slg7zv3] { font-size: var(--font-size-xs); color: var(--text-muted); }
.validation-message[b-4l5slg7zv3] { font-size: var(--font-size-xs); color: var(--color-danger); }

/* Checkbox */
.checkbox-label[b-4l5slg7zv3] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; }
.checkbox-input[b-4l5slg7zv3] { width: 18px; height: 18px; accent-color: var(--color-primary); cursor: pointer; }
.checkbox-text[b-4l5slg7zv3] { font-size: var(--font-size-sm); color: var(--text-primary); }

/* Alert Card */
.alert-card[b-4l5slg7zv3] { display: flex; align-items: flex-start; gap: 0.75rem; padding: 1rem; border-radius: var(--border-radius); margin-bottom: 1.5rem; }
.alert-card .material-icons[b-4l5slg7zv3] { font-size: 20px; flex-shrink: 0; margin-top: 0.125rem; }
.alert-card--danger[b-4l5slg7zv3] { background-color: var(--color-danger-bg); border: 1px solid var(--color-danger); }
.alert-card--danger .material-icons[b-4l5slg7zv3] { color: var(--color-danger); }
.alert-card__content[b-4l5slg7zv3] { flex: 1; }
.alert-card__content p[b-4l5slg7zv3] { margin: 0 0 0.5rem 0; font-size: var(--font-size-sm); color: var(--text-primary); }
.alert-card__content ul[b-4l5slg7zv3] { margin: 0; padding-left: 1.25rem; font-size: var(--font-size-sm); color: var(--text-secondary); }

/* Form Actions */
.form-actions[b-4l5slg7zv3] { display: flex; justify-content: flex-end; gap: 0.75rem; padding-top: 1.5rem; border-top: 1px solid var(--border-color); margin-top: 0.5rem; }

/* Buttons */
.btn-action[b-4l5slg7zv3] { display: inline-flex; align-items: center; justify-content: center; gap: 0.5rem; padding: 0.625rem 1.25rem; font-size: var(--font-size-sm); font-weight: 500; border: none; border-radius: var(--border-radius); cursor: pointer; transition: all var(--transition-fast); text-decoration: none; }
.btn-action .material-icons[b-4l5slg7zv3] { font-size: 18px; }
.btn-action:disabled[b-4l5slg7zv3] { opacity: 0.6; cursor: not-allowed; }
.btn-action--primary[b-4l5slg7zv3] { background-color: var(--color-primary); color: white; }
.btn-action--primary:hover:not(:disabled)[b-4l5slg7zv3] { background-color: var(--color-primary-hover); }
.btn-action--secondary[b-4l5slg7zv3] { background-color: var(--bg-hover); color: var(--text-primary); border: 1px solid var(--border-color); }
.btn-action--secondary:hover:not(:disabled)[b-4l5slg7zv3] { background-color: var(--border-color); }

/* Responsive */
@media (max-width: 768px) {
    .page-header[b-4l5slg7zv3] { flex-direction: column; align-items: flex-start; }
    .form-grid[b-4l5slg7zv3], .form-grid--3-1[b-4l5slg7zv3], .form-grid--5-4-3[b-4l5slg7zv3], .form-grid--3[b-4l5slg7zv3] { grid-template-columns: 1fr; }
    .form-actions[b-4l5slg7zv3] { flex-direction: column-reverse; }
    .form-actions .btn-action[b-4l5slg7zv3] { width: 100%; }
}

/* Dark Mode */
[data-theme="dark"] .form-card[b-4l5slg7zv3], [data-theme="dark"] .loading-state[b-4l5slg7zv3] { background-color: var(--bg-card); border-color: var(--border-color); }
[data-theme="dark"] .form-input[b-4l5slg7zv3] { background-color: rgba(255, 255, 255, 0.05); border-color: var(--border-color); }
/* _content/Geniar.Asistencias.Web/Pages/Sucursales/GenerarQR.razor.rz.scp.css */
/* ============================================
   GENERAR QR STYLES
   ============================================ */

.qr-page[b-r4zk10nrrm] { display: flex; flex-direction: column; gap: 1.5rem; }

/* Loading & Error States */
.loading-state[b-r4zk10nrrm], .error-card[b-r4zk10nrrm] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 4rem 2rem; gap: 1rem; background-color: var(--bg-card); border: 1px solid var(--border-color); border-radius: var(--border-radius-xl); }
.loading-state[b-r4zk10nrrm] { color: var(--text-secondary); }
.loading-state .spinner-border[b-r4zk10nrrm] { width: 3rem; height: 3rem; }
.error-card[b-r4zk10nrrm] { color: var(--color-danger); }
.error-card .material-icons[b-r4zk10nrrm] { font-size: 48px; }

/* Page Header */
.page-header[b-r4zk10nrrm] { display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 1rem; }
.page-header__info[b-r4zk10nrrm] { flex: 1; }
.page-header__title[b-r4zk10nrrm] { margin: 0 0 0.25rem 0; font-size: var(--font-size-3xl); font-weight: 700; color: var(--text-primary); }
.page-header__subtitle[b-r4zk10nrrm] { margin: 0; font-size: var(--font-size-base); color: var(--text-secondary); }
.page-header__actions[b-r4zk10nrrm] { display: flex; gap: 0.75rem; }

/* QR Layout */
.qr-layout[b-r4zk10nrrm] { display: grid; grid-template-columns: 340px 1fr; gap: 1.5rem; }
.config-panel[b-r4zk10nrrm] { display: flex; flex-direction: column; gap: 1.5rem; }
.qr-display[b-r4zk10nrrm] { display: flex; flex-direction: column; gap: 1.5rem; }

/* Info Card */
.info-card[b-r4zk10nrrm] { background-color: var(--bg-card); border: 1px solid var(--border-color); border-radius: var(--border-radius-xl); overflow: hidden; }
.info-card__header[b-r4zk10nrrm] { display: flex; align-items: center; gap: 0.75rem; padding: 1rem 1.25rem; background-color: var(--bg-hover); border-bottom: 1px solid var(--border-color); }
.info-card__header .material-icons[b-r4zk10nrrm] { font-size: 20px; color: var(--color-primary); }
.info-card__header h3[b-r4zk10nrrm] { margin: 0; font-size: var(--font-size-base); font-weight: 600; color: var(--text-primary); }
.info-card__body[b-r4zk10nrrm] { padding: 1.25rem; }

/* Info List */
.info-list[b-r4zk10nrrm] { display: flex; flex-direction: column; gap: 0.75rem; }
.info-list__item[b-r4zk10nrrm] { display: flex; flex-direction: column; gap: 0.125rem; }
.info-list__label[b-r4zk10nrrm] { font-size: var(--font-size-xs); font-weight: 500; color: var(--text-muted); text-transform: uppercase; }
.info-list__value[b-r4zk10nrrm] { font-size: var(--font-size-sm); color: var(--text-primary); }

/* Config Card */
.config-card[b-r4zk10nrrm] { background-color: var(--bg-card); border: 1px solid var(--border-color); border-radius: var(--border-radius-xl); overflow: hidden; }
.config-card__header[b-r4zk10nrrm] { display: flex; align-items: center; gap: 0.75rem; padding: 1rem 1.25rem; background-color: var(--bg-hover); border-bottom: 1px solid var(--border-color); }
.config-card__header .material-icons[b-r4zk10nrrm] { font-size: 20px; color: var(--color-primary); }
.config-card__header h3[b-r4zk10nrrm] { margin: 0; font-size: var(--font-size-base); font-weight: 600; color: var(--text-primary); }
.config-card__body[b-r4zk10nrrm] { padding: 1.25rem; display: flex; flex-direction: column; gap: 1rem; }

/* Form Elements */
.form-group[b-r4zk10nrrm] { display: flex; flex-direction: column; gap: 0.375rem; }
.form-label[b-r4zk10nrrm] { font-size: var(--font-size-sm); font-weight: 500; color: var(--text-primary); }
.form-input[b-r4zk10nrrm] { width: 100%; padding: 0.625rem 0.875rem; font-size: var(--font-size-sm); border: 1px solid var(--border-color); border-radius: var(--border-radius); background-color: var(--bg-card); color: var(--text-primary); transition: all var(--transition-fast); }
.form-input:focus[b-r4zk10nrrm] { outline: none; border-color: var(--color-primary); box-shadow: 0 0 0 3px rgba(29, 78, 216, 0.1); }
.form-input--textarea[b-r4zk10nrrm] { resize: vertical; min-height: 80px; }
.form-hint[b-r4zk10nrrm] { font-size: var(--font-size-xs); color: var(--text-muted); }

/* QR Card */
.qr-card[b-r4zk10nrrm] { background-color: var(--bg-card); border: 1px solid var(--border-color); border-radius: var(--border-radius-xl); overflow: hidden; }
.qr-card--active[b-r4zk10nrrm] { border-color: var(--color-success); }
.qr-card__header[b-r4zk10nrrm] { display: flex; align-items: center; gap: 0.75rem; padding: 1rem 1.25rem; background-color: var(--color-success); color: white; }
.qr-card__header .material-icons[b-r4zk10nrrm] { font-size: 24px; }
.qr-card__header h3[b-r4zk10nrrm] { margin: 0; font-size: var(--font-size-lg); font-weight: 600; }
.qr-card__body[b-r4zk10nrrm] { padding: 1.5rem; }

/* QR Image */
.qr-image-wrapper[b-r4zk10nrrm] { display: flex; justify-content: center; margin-bottom: 1.5rem; }
.qr-image[b-r4zk10nrrm] { max-width: 320px; border: 2px solid var(--border-color); padding: 1rem; background: white; border-radius: var(--border-radius); }
.qr-loading[b-r4zk10nrrm] { display: flex; flex-direction: column; align-items: center; gap: 1rem; padding: 3rem; color: var(--text-muted); }

/* QR Details */
.qr-details[b-r4zk10nrrm] { display: grid; grid-template-columns: repeat(2, 1fr); gap: 1rem; margin-bottom: 1.5rem; padding: 1rem; background-color: var(--bg-hover); border-radius: var(--border-radius); }
.qr-details__item[b-r4zk10nrrm] { display: flex; gap: 0.75rem; }
.qr-details__item--full[b-r4zk10nrrm] { grid-column: 1 / -1; }
.qr-details__item .material-icons[b-r4zk10nrrm] { font-size: 20px; color: var(--color-primary); flex-shrink: 0; }
.qr-details__label[b-r4zk10nrrm] { display: block; font-size: var(--font-size-xs); color: var(--text-muted); text-transform: uppercase; }
.qr-details__value[b-r4zk10nrrm] { display: block; font-size: var(--font-size-sm); color: var(--text-primary); }
.qr-details__link[b-r4zk10nrrm] { color: var(--color-primary); font-size: var(--font-size-sm); word-break: break-all; }

/* QR Actions */
.qr-actions[b-r4zk10nrrm] { display: flex; gap: 0.75rem; }

/* Empty QR */
.empty-qr[b-r4zk10nrrm] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 4rem 2rem; gap: 1rem; background-color: var(--color-warning-bg); border: 1px solid var(--color-warning); border-radius: var(--border-radius-xl); text-align: center; }
.empty-qr .material-icons[b-r4zk10nrrm] { font-size: 64px; color: var(--color-warning); }
.empty-qr h4[b-r4zk10nrrm] { margin: 0; font-size: var(--font-size-lg); color: var(--text-primary); }
.empty-qr p[b-r4zk10nrrm] { margin: 0; font-size: var(--font-size-sm); color: var(--text-muted); }

/* Instructions Card */
.instructions-card[b-r4zk10nrrm] { background-color: var(--color-primary-bg); border: 1px solid var(--color-primary); border-radius: var(--border-radius-xl); padding: 1.25rem; }
.instructions-card__header[b-r4zk10nrrm] { display: flex; align-items: center; gap: 0.5rem; margin-bottom: 0.75rem; }
.instructions-card__header .material-icons[b-r4zk10nrrm] { font-size: 20px; color: var(--color-primary); }
.instructions-card__header h4[b-r4zk10nrrm] { margin: 0; font-size: var(--font-size-sm); font-weight: 600; color: var(--color-primary); }
.instructions-list[b-r4zk10nrrm] { margin: 0; padding-left: 1.25rem; font-size: var(--font-size-sm); color: var(--text-secondary); line-height: 1.8; }

/* History Card */
.history-card[b-r4zk10nrrm] { background-color: var(--bg-card); border: 1px solid var(--border-color); border-radius: var(--border-radius-xl); overflow: hidden; }
.history-card__header[b-r4zk10nrrm] { display: flex; align-items: center; gap: 0.75rem; padding: 1rem 1.25rem; background-color: var(--bg-hover); border-bottom: 1px solid var(--border-color); }
.history-card__header .material-icons[b-r4zk10nrrm] { font-size: 20px; color: var(--color-primary); }
.history-card__header h3[b-r4zk10nrrm] { margin: 0; font-size: var(--font-size-base); font-weight: 600; color: var(--text-primary); }

/* Table */
.table-container[b-r4zk10nrrm] { overflow-x: auto; }
.data-table[b-r4zk10nrrm] { width: 100%; border-collapse: collapse; font-size: var(--font-size-sm); }
.data-table th[b-r4zk10nrrm] { padding: 0.75rem 1rem; text-align: left; font-weight: 600; color: var(--text-primary); background-color: var(--bg-hover); border-bottom: 1px solid var(--border-color); }
.data-table td[b-r4zk10nrrm] { padding: 0.75rem 1rem; border-bottom: 1px solid var(--border-color); color: var(--text-primary); }
.data-table tbody tr:hover[b-r4zk10nrrm] { background-color: var(--bg-hover); }
.data-table .row-active[b-r4zk10nrrm] { background-color: var(--color-success-bg); }

/* Badges */
.badge-status[b-r4zk10nrrm] { display: inline-flex; align-items: center; padding: 0.25rem 0.5rem; font-size: var(--font-size-xs); font-weight: 600; border-radius: var(--border-radius); text-transform: uppercase; letter-spacing: 0.025em; }
.badge-status--activo[b-r4zk10nrrm] { background-color: var(--color-success-bg); color: var(--color-success); }
.badge-status--inactivo[b-r4zk10nrrm] { background-color: var(--bg-hover); color: var(--text-muted); }
.badge-permanent[b-r4zk10nrrm] { display: inline-flex; align-items: center; padding: 0.25rem 0.5rem; font-size: var(--font-size-xs); font-weight: 500; background-color: rgba(6, 182, 212, 0.1); color: #06B6D4; border-radius: var(--border-radius); }

/* Buttons */
.btn-action[b-r4zk10nrrm] { display: inline-flex; align-items: center; justify-content: center; gap: 0.5rem; padding: 0.625rem 1.25rem; font-size: var(--font-size-sm); font-weight: 500; border: none; border-radius: var(--border-radius); cursor: pointer; transition: all var(--transition-fast); text-decoration: none; }
.btn-action .material-icons[b-r4zk10nrrm] { font-size: 18px; }
.btn-action:disabled[b-r4zk10nrrm] { opacity: 0.6; cursor: not-allowed; }
.btn-action--full[b-r4zk10nrrm] { width: 100%; }
.btn-action--primary[b-r4zk10nrrm] { background-color: var(--color-primary); color: white; }
.btn-action--primary:hover:not(:disabled)[b-r4zk10nrrm] { background-color: var(--color-primary-hover); }
.btn-action--success[b-r4zk10nrrm] { background-color: var(--color-success); color: white; }
.btn-action--success:hover:not(:disabled)[b-r4zk10nrrm] { opacity: 0.9; }
.btn-action--secondary[b-r4zk10nrrm] { background-color: var(--bg-hover); color: var(--text-primary); border: 1px solid var(--border-color); }
.btn-action--secondary:hover:not(:disabled)[b-r4zk10nrrm] { background-color: var(--border-color); }
.btn-action--danger-outline[b-r4zk10nrrm] { background-color: transparent; color: var(--color-danger); border: 1px solid var(--color-danger); }
.btn-action--danger-outline:hover:not(:disabled)[b-r4zk10nrrm] { background-color: var(--color-danger-bg); }

/* Responsive */
@media (max-width: 1024px) {
    .qr-layout[b-r4zk10nrrm] { grid-template-columns: 1fr; }
    .config-panel[b-r4zk10nrrm] { order: 1; }
    .qr-display[b-r4zk10nrrm] { order: 0; }
}
@media (max-width: 768px) {
    .page-header[b-r4zk10nrrm] { flex-direction: column; align-items: flex-start; }
    .qr-details[b-r4zk10nrrm] { grid-template-columns: 1fr; }
    .qr-actions[b-r4zk10nrrm] { flex-direction: column; }
    .qr-actions .btn-action[b-r4zk10nrrm] { width: 100%; }
}

/* Dark Mode */
[data-theme="dark"] .info-card[b-r4zk10nrrm], [data-theme="dark"] .config-card[b-r4zk10nrrm], [data-theme="dark"] .qr-card[b-r4zk10nrrm], [data-theme="dark"] .history-card[b-r4zk10nrrm], [data-theme="dark"] .loading-state[b-r4zk10nrrm], [data-theme="dark"] .error-card[b-r4zk10nrrm] { background-color: var(--bg-card); border-color: var(--border-color); }
[data-theme="dark"] .info-card__header[b-r4zk10nrrm], [data-theme="dark"] .config-card__header[b-r4zk10nrrm], [data-theme="dark"] .history-card__header[b-r4zk10nrrm], [data-theme="dark"] .data-table th[b-r4zk10nrrm] { background-color: rgba(255, 255, 255, 0.05); }
[data-theme="dark"] .form-input[b-r4zk10nrrm] { background-color: rgba(255, 255, 255, 0.05); border-color: var(--border-color); }
[data-theme="dark"] .qr-image[b-r4zk10nrrm] { background: white; }
/* _content/Geniar.Asistencias.Web/Pages/Sucursales/Index.razor.rz.scp.css */
/* ============================================
   SUCURSALES PAGE STYLES
   ============================================ */

.sucursales-page[b-wp8p98y7vc] {
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
}

/* ============================================
   PAGE HEADER
   ============================================ */

.page-header[b-wp8p98y7vc] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    gap: 1rem;
}

.page-header__info[b-wp8p98y7vc] {
    flex: 1;
}

.page-header__title[b-wp8p98y7vc] {
    margin: 0 0 0.25rem 0;
    font-size: var(--font-size-3xl);
    font-weight: 700;
    color: var(--text-primary);
}

.page-header__subtitle[b-wp8p98y7vc] {
    margin: 0;
    font-size: var(--font-size-base);
    color: var(--text-secondary);
}

.page-header__actions[b-wp8p98y7vc] {
    display: flex;
    gap: 0.75rem;
}

/* Action Buttons */
.btn-action[b-wp8p98y7vc] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.625rem 1.25rem;
    font-size: var(--font-size-sm);
    font-weight: 500;
    border: none;
    border-radius: var(--border-radius);
    cursor: pointer;
    transition: all var(--transition-fast);
}

.btn-action .material-icons[b-wp8p98y7vc] {
    font-size: 20px;
}

.btn-action--primary[b-wp8p98y7vc] {
    background-color: var(--color-primary);
    color: white;
    box-shadow: 0 4px 14px 0 rgba(29, 78, 216, 0.3);
}

.btn-action--primary:hover[b-wp8p98y7vc] {
    background-color: var(--color-primary-hover);
}

/* ============================================
   LOADING STATE
   ============================================ */

.loading-state[b-wp8p98y7vc] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 4rem 2rem;
    gap: 1rem;
    background-color: var(--bg-card);
    border: 1px solid var(--border-color);
    border-radius: var(--border-radius-xl);
    color: var(--text-secondary);
}

.loading-state .spinner-border[b-wp8p98y7vc] {
    width: 3rem;
    height: 3rem;
}

/* ============================================
   TABLE CARD
   ============================================ */

.table-card[b-wp8p98y7vc] {
    background-color: var(--bg-card);
    border: 1px solid var(--border-color);
    border-radius: var(--border-radius-xl);
    overflow: hidden;
}

.data-table[b-wp8p98y7vc] {
    width: 100%;
    border-collapse: collapse;
}

.data-table thead[b-wp8p98y7vc] {
    background-color: var(--bg-hover);
}

.data-table th[b-wp8p98y7vc] {
    padding: 0.875rem 1rem;
    font-size: var(--font-size-xs);
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: var(--text-secondary);
    text-align: left;
    border-bottom: 1px solid var(--border-color);
}

.data-table td[b-wp8p98y7vc] {
    padding: 1rem;
    font-size: var(--font-size-sm);
    color: var(--text-primary);
    border-bottom: 1px solid var(--border-color);
    vertical-align: middle;
}

.data-table tbody tr[b-wp8p98y7vc] {
    transition: background-color var(--transition-fast);
}

.data-table tbody tr:hover[b-wp8p98y7vc] {
    background-color: var(--bg-hover);
}

.data-table tbody tr:last-child td[b-wp8p98y7vc] {
    border-bottom: none;
}

/* Sucursal Cell (Icon + Info) */
.sucursal-cell[b-wp8p98y7vc] {
    display: flex;
    align-items: center;
    gap: 0.875rem;
}

.sucursal-icon[b-wp8p98y7vc] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    border-radius: var(--border-radius-lg);
    background-color: var(--color-warning-bg);
    color: var(--color-warning);
    flex-shrink: 0;
}

.sucursal-icon .material-icons[b-wp8p98y7vc] {
    font-size: 22px;
}

.sucursal-info[b-wp8p98y7vc] {
    display: flex;
    flex-direction: column;
    gap: 0.125rem;
}

.sucursal-nombre[b-wp8p98y7vc] {
    font-weight: 500;
    color: var(--text-primary);
}

.sucursal-direccion[b-wp8p98y7vc] {
    font-size: var(--font-size-xs);
    color: var(--text-muted);
}

/* Codigo Badge */
.codigo-badge[b-wp8p98y7vc] {
    display: inline-block;
    padding: 0.25rem 0.625rem;
    font-size: var(--font-size-xs);
    font-weight: 500;
    font-family: monospace;
    background-color: var(--bg-hover);
    border-radius: var(--border-radius);
    color: var(--text-secondary);
}

/* Ubicacion Cell */
.ubicacion-cell[b-wp8p98y7vc] {
    display: flex;
    align-items: center;
    gap: 0.375rem;
    color: var(--text-secondary);
}

.ubicacion-cell .material-icons[b-wp8p98y7vc] {
    font-size: 18px;
    color: var(--color-danger);
}

/* Status Badges */
.status-badge[b-wp8p98y7vc] {
    display: inline-block;
    padding: 0.25rem 0.75rem;
    font-size: var(--font-size-xs);
    font-weight: 500;
    border-radius: 9999px;
}

.status-badge--activo[b-wp8p98y7vc] {
    background-color: var(--color-success-bg);
    color: var(--color-success);
}

.status-badge--inactivo[b-wp8p98y7vc] {
    background-color: var(--bg-hover);
    color: var(--text-secondary);
}

/* Action Buttons */
.action-buttons[b-wp8p98y7vc] {
    display: flex;
    justify-content: center;
    gap: 0.5rem;
}

.action-btn[b-wp8p98y7vc] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    border: 1px solid var(--border-color);
    border-radius: var(--border-radius);
    background-color: transparent;
    cursor: pointer;
    transition: all var(--transition-fast);
}

.action-btn .material-icons[b-wp8p98y7vc] {
    font-size: 18px;
}

.action-btn--view[b-wp8p98y7vc] {
    color: var(--color-primary);
}

.action-btn--view:hover[b-wp8p98y7vc] {
    background-color: var(--color-primary-bg);
    border-color: var(--color-primary);
}

.action-btn--edit[b-wp8p98y7vc] {
    color: var(--color-warning);
}

.action-btn--edit:hover[b-wp8p98y7vc] {
    background-color: var(--color-warning-bg);
    border-color: var(--color-warning);
}

.action-btn--qr[b-wp8p98y7vc] {
    color: var(--text-primary);
}

.action-btn--qr:hover[b-wp8p98y7vc] {
    background-color: var(--bg-hover);
    border-color: var(--text-secondary);
}

/* Table Footer */
.table-footer[b-wp8p98y7vc] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 1rem 1.25rem;
    border-top: 1px solid var(--border-color);
    background-color: var(--bg-hover);
}

.table-footer__count[b-wp8p98y7vc] {
    font-size: var(--font-size-sm);
    color: var(--text-secondary);
}

.table-footer__count strong[b-wp8p98y7vc] {
    color: var(--text-primary);
}

/* ============================================
   RESPONSIVE
   ============================================ */

@media (max-width: 768px) {
    .page-header[b-wp8p98y7vc] {
        flex-direction: column;
        align-items: flex-start;
    }

    .page-header__actions[b-wp8p98y7vc] {
        width: 100%;
    }

    .btn-action[b-wp8p98y7vc] {
        flex: 1;
        justify-content: center;
    }

    .data-table th:nth-child(3)[b-wp8p98y7vc],
    .data-table td:nth-child(3)[b-wp8p98y7vc],
    .data-table th:nth-child(4)[b-wp8p98y7vc],
    .data-table td:nth-child(4)[b-wp8p98y7vc] {
        display: none;
    }

    .sucursal-direccion[b-wp8p98y7vc] {
        display: none;
    }
}

@media (max-width: 640px) {
    .page-header__title[b-wp8p98y7vc] {
        font-size: var(--font-size-2xl);
    }

    .data-table th:nth-child(2)[b-wp8p98y7vc],
    .data-table td:nth-child(2)[b-wp8p98y7vc] {
        display: none;
    }
}

/* ============================================
   DARK MODE
   ============================================ */

[data-theme="dark"] .table-card[b-wp8p98y7vc] {
    background-color: var(--bg-card);
    border-color: var(--border-color);
}

[data-theme="dark"] .data-table thead[b-wp8p98y7vc] {
    background-color: rgba(255, 255, 255, 0.05);
}

[data-theme="dark"] .codigo-badge[b-wp8p98y7vc] {
    background-color: rgba(255, 255, 255, 0.1);
}

[data-theme="dark"] .table-footer[b-wp8p98y7vc] {
    background-color: rgba(255, 255, 255, 0.05);
}

[data-theme="dark"] .loading-state[b-wp8p98y7vc] {
    background-color: var(--bg-card);
    border-color: var(--border-color);
}

[data-theme="dark"] .sucursal-icon[b-wp8p98y7vc] {
    background-color: rgba(245, 158, 11, 0.2);
}
/* _content/Geniar.Asistencias.Web/Shared/Components/QuickAccessCard.razor.rz.scp.css */
/* ============================================
   QUICK ACCESS CARD COMPONENT
   ============================================ */

.quick-card[b-n102nuchvq] {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    padding: 1.5rem;
    background-color: var(--bg-card);
    border: 1px solid var(--border-color);
    border-radius: var(--border-radius-xl);
    transition: all var(--transition);
}

.quick-card:hover[b-n102nuchvq] {
    border-color: var(--border-color-dark);
    box-shadow: var(--shadow-md);
}

/* Hover colors por tipo */
.quick-card--blue:hover[b-n102nuchvq] { border-color: var(--color-primary-light); }
.quick-card--green:hover[b-n102nuchvq] { border-color: var(--color-success); }
.quick-card--yellow:hover[b-n102nuchvq] { border-color: var(--color-warning); }
.quick-card--cyan:hover[b-n102nuchvq] { border-color: var(--color-cyan); }
.quick-card--gray:hover[b-n102nuchvq] { border-color: var(--text-secondary); }
.quick-card--dark:hover[b-n102nuchvq] { border-color: var(--text-primary); }

/* Wrapper del icono */
.quick-card__icon-wrapper[b-n102nuchvq] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 56px;
    height: 56px;
    border-radius: 50%;
    margin-bottom: 1rem;
}

.quick-card__icon-wrapper .material-icons[b-n102nuchvq] {
    font-size: 28px;
}

/* Colores del icono */
.quick-card__icon-wrapper--blue[b-n102nuchvq] {
    background-color: var(--color-primary-bg);
    color: var(--color-primary);
}

.quick-card__icon-wrapper--green[b-n102nuchvq] {
    background-color: var(--color-success-bg);
    color: var(--color-success);
}

.quick-card__icon-wrapper--yellow[b-n102nuchvq] {
    background-color: var(--color-warning-bg);
    color: var(--color-warning);
}

.quick-card__icon-wrapper--cyan[b-n102nuchvq] {
    background-color: var(--color-cyan-bg);
    color: var(--color-cyan);
}

.quick-card__icon-wrapper--gray[b-n102nuchvq] {
    background-color: var(--bg-hover);
    color: var(--text-secondary);
}

.quick-card__icon-wrapper--dark[b-n102nuchvq] {
    background-color: var(--text-primary);
    color: var(--bg-card);
}

/* Titulo */
.quick-card__title[b-n102nuchvq] {
    margin: 0 0 0.5rem 0;
    font-size: var(--font-size-lg);
    font-weight: 600;
    color: var(--text-primary);
}

/* Descripcion */
.quick-card__description[b-n102nuchvq] {
    margin: 0 0 1.25rem 0;
    font-size: var(--font-size-sm);
    color: var(--text-secondary);
    line-height: 1.5;
    min-height: 2.5rem;
}

/* Boton */
.quick-card__button[b-n102nuchvq] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    padding: 0.625rem 1.25rem;
    font-size: var(--font-size-sm);
    font-weight: 500;
    text-decoration: none;
    border-radius: var(--border-radius);
    transition: all var(--transition-fast);
}

/* Colores del boton */
.quick-card__button--blue[b-n102nuchvq] {
    background-color: var(--color-primary);
    color: white;
    box-shadow: 0 4px 14px 0 rgba(29, 78, 216, 0.3);
}

.quick-card__button--blue:hover[b-n102nuchvq] {
    background-color: var(--color-primary-hover);
}

.quick-card__button--green[b-n102nuchvq] {
    background-color: var(--color-success);
    color: white;
    box-shadow: 0 4px 14px 0 rgba(16, 185, 129, 0.3);
}

.quick-card__button--green:hover[b-n102nuchvq] {
    background-color: var(--color-success-hover);
}

.quick-card__button--yellow[b-n102nuchvq] {
    background-color: var(--color-warning);
    color: white;
    box-shadow: 0 4px 14px 0 rgba(245, 158, 11, 0.3);
}

.quick-card__button--yellow:hover[b-n102nuchvq] {
    background-color: var(--color-warning-hover);
}

.quick-card__button--cyan[b-n102nuchvq] {
    background-color: var(--color-cyan);
    color: white;
    box-shadow: 0 4px 14px 0 rgba(6, 182, 212, 0.3);
}

.quick-card__button--cyan:hover[b-n102nuchvq] {
    background-color: var(--color-cyan-hover);
}

.quick-card__button--gray[b-n102nuchvq] {
    background-color: var(--text-secondary);
    color: white;
    box-shadow: 0 4px 14px 0 rgba(107, 114, 128, 0.3);
}

.quick-card__button--gray:hover[b-n102nuchvq] {
    background-color: var(--color-secondary-hover);
}

.quick-card__button--dark[b-n102nuchvq] {
    background-color: var(--text-primary);
    color: var(--bg-card);
    box-shadow: 0 4px 14px 0 rgba(17, 24, 39, 0.3);
}

.quick-card__button--dark:hover[b-n102nuchvq] {
    opacity: 0.9;
}

/* ============================================
   DARK MODE
   ============================================ */

[data-theme="dark"] .quick-card[b-n102nuchvq] {
    background-color: var(--bg-card);
    border-color: var(--border-color);
}

[data-theme="dark"] .quick-card__icon-wrapper--blue[b-n102nuchvq] {
    background-color: rgba(59, 130, 246, 0.2);
}

[data-theme="dark"] .quick-card__icon-wrapper--green[b-n102nuchvq] {
    background-color: rgba(16, 185, 129, 0.2);
}

[data-theme="dark"] .quick-card__icon-wrapper--yellow[b-n102nuchvq] {
    background-color: rgba(245, 158, 11, 0.2);
}

[data-theme="dark"] .quick-card__icon-wrapper--cyan[b-n102nuchvq] {
    background-color: rgba(6, 182, 212, 0.2);
}

[data-theme="dark"] .quick-card__icon-wrapper--gray[b-n102nuchvq] {
    background-color: var(--bg-hover);
}

[data-theme="dark"] .quick-card__icon-wrapper--dark[b-n102nuchvq] {
    background-color: var(--text-secondary);
    color: var(--bg-card);
}
/* _content/Geniar.Asistencias.Web/Shared/Components/StatsCard.razor.rz.scp.css */
/* ============================================
   STATS CARD COMPONENT
   ============================================ */

.stats-card[b-ynq3rfoljl] {
    position: relative;
    background-color: var(--bg-card);
    border: 1px solid var(--border-color);
    border-radius: var(--border-radius-xl);
    overflow: hidden;
    transition: box-shadow var(--transition);
}

.stats-card:hover[b-ynq3rfoljl] {
    box-shadow: var(--shadow-md);
}

/* Indicador lateral coloreado */
.stats-card__indicator[b-ynq3rfoljl] {
    position: absolute;
    top: 0;
    left: 0;
    width: 4px;
    height: 100%;
    background-color: var(--color-primary);
}

.stats-card--blue .stats-card__indicator[b-ynq3rfoljl] { background-color: var(--color-primary-light); }
.stats-card--green .stats-card__indicator[b-ynq3rfoljl] { background-color: var(--color-success); }
.stats-card--yellow .stats-card__indicator[b-ynq3rfoljl] { background-color: var(--color-warning); }
.stats-card--cyan .stats-card__indicator[b-ynq3rfoljl] { background-color: var(--color-cyan); }
.stats-card--red .stats-card__indicator[b-ynq3rfoljl] { background-color: var(--color-danger); }

/* Contenido */
.stats-card__content[b-ynq3rfoljl] {
    padding: 1.25rem 1.5rem;
}

/* Header con titulo e icono */
.stats-card__header[b-ynq3rfoljl] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 1rem;
}

.stats-card__title[b-ynq3rfoljl] {
    margin: 0;
    font-size: var(--font-size-xs);
    font-weight: 500;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: var(--text-secondary);
}

/* Wrapper del icono */
.stats-card__icon-wrapper[b-ynq3rfoljl] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    border-radius: var(--border-radius-lg);
}

.stats-card__icon-wrapper .material-icons[b-ynq3rfoljl] {
    font-size: 22px;
}

/* Colores del icono */
.stats-card__icon-wrapper--blue[b-ynq3rfoljl] {
    background-color: var(--color-primary-bg);
    color: var(--color-primary-light);
}

.stats-card__icon-wrapper--green[b-ynq3rfoljl] {
    background-color: var(--color-success-bg);
    color: var(--color-success);
}

.stats-card__icon-wrapper--yellow[b-ynq3rfoljl] {
    background-color: var(--color-warning-bg);
    color: var(--color-warning);
}

.stats-card__icon-wrapper--cyan[b-ynq3rfoljl] {
    background-color: var(--color-cyan-bg);
    color: var(--color-cyan);
}

.stats-card__icon-wrapper--red[b-ynq3rfoljl] {
    background-color: var(--color-danger-bg);
    color: var(--color-danger);
}

/* Valor principal */
.stats-card__value[b-ynq3rfoljl] {
    font-size: var(--font-size-4xl);
    font-weight: 700;
    color: var(--text-primary);
    line-height: 1.1;
    margin-bottom: 0.5rem;
}

/* Valor secundario */
.stats-card__subvalue[b-ynq3rfoljl] {
    margin: 0;
    font-size: var(--font-size-sm);
    color: var(--text-secondary);
}

/* ============================================
   DARK MODE
   ============================================ */

[data-theme="dark"] .stats-card[b-ynq3rfoljl] {
    background-color: var(--bg-card);
    border-color: var(--border-color);
}

[data-theme="dark"] .stats-card__icon-wrapper--blue[b-ynq3rfoljl] {
    background-color: rgba(59, 130, 246, 0.2);
}

[data-theme="dark"] .stats-card__icon-wrapper--green[b-ynq3rfoljl] {
    background-color: rgba(16, 185, 129, 0.2);
}

[data-theme="dark"] .stats-card__icon-wrapper--yellow[b-ynq3rfoljl] {
    background-color: rgba(245, 158, 11, 0.2);
}

[data-theme="dark"] .stats-card__icon-wrapper--cyan[b-ynq3rfoljl] {
    background-color: rgba(6, 182, 212, 0.2);
}

[data-theme="dark"] .stats-card__icon-wrapper--red[b-ynq3rfoljl] {
    background-color: rgba(239, 68, 68, 0.2);
}
/* _content/Geniar.Asistencias.Web/Shared/LoginDisplay.razor.rz.scp.css */
/* ============================================
   HEADER ACTIONS CONTAINER
   ============================================ */

.header-actions[b-nozj8msh4z] {
    display: flex;
    align-items: center;
    gap: 1rem;
}

/* ============================================
   THEME TOGGLE BUTTON
   ============================================ */

.theme-toggle[b-nozj8msh4z] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    padding: 0;
    border: 1px solid var(--border-color);
    border-radius: var(--border-radius);
    background-color: transparent;
    color: var(--text-secondary);
    cursor: pointer;
    transition: all var(--transition-fast);
}

.theme-toggle:hover[b-nozj8msh4z] {
    background-color: var(--bg-hover);
    color: var(--text-primary);
    border-color: var(--border-color-dark);
}

.theme-toggle .material-icons[b-nozj8msh4z] {
    font-size: 20px;
}

/* ============================================
   USER INFO
   ============================================ */

.user-info[b-nozj8msh4z] {
    display: none;
}

@media (min-width: 576px) {
    .user-info[b-nozj8msh4z] {
        display: block;
    }
}

.user-details[b-nozj8msh4z] {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    line-height: 1.3;
}

.user-name[b-nozj8msh4z] {
    font-size: var(--font-size-sm);
    font-weight: 500;
    color: var(--text-primary);
}

.user-email[b-nozj8msh4z] {
    font-size: var(--font-size-xs);
    color: var(--text-secondary);
}

/* ============================================
   USER MENU BUTTON
   ============================================ */

.user-menu-btn[b-nozj8msh4z] {
    display: flex;
    align-items: center;
    gap: 0.25rem;
    padding: 0.375rem 0.5rem;
    border: 1px solid var(--border-color);
    border-radius: var(--border-radius);
    background-color: transparent;
    color: var(--text-secondary);
    cursor: pointer;
    transition: all var(--transition-fast);
}

.user-menu-btn:hover[b-nozj8msh4z] {
    background-color: var(--bg-hover);
    border-color: var(--border-color-dark);
}

.user-menu-btn .material-icons[b-nozj8msh4z] {
    font-size: 24px;
}

.user-menu-btn .dropdown-arrow[b-nozj8msh4z] {
    font-size: 18px;
    color: var(--text-muted);
}

/* ============================================
   DROPDOWN MENU
   ============================================ */

.dropdown-menu[b-nozj8msh4z] {
    min-width: 220px;
    padding: 0.5rem 0;
    margin-top: 0.5rem;
    border: 1px solid var(--border-color);
    border-radius: var(--border-radius-lg);
    box-shadow: var(--shadow-lg);
    background-color: var(--bg-card);
}

.dropdown-header[b-nozj8msh4z] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.75rem 1rem;
    font-size: var(--font-size-sm);
    font-weight: 600;
    color: var(--text-primary);
}

.dropdown-header .material-icons[b-nozj8msh4z] {
    font-size: 18px;
    color: var(--text-secondary);
}

.dropdown-divider[b-nozj8msh4z] {
    margin: 0.375rem 0;
    border-color: var(--border-color);
}

.dropdown-item[b-nozj8msh4z] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 0.625rem 1rem;
    font-size: var(--font-size-sm);
    color: var(--text-primary);
    text-decoration: none;
    transition: background-color var(--transition-fast);
}

.dropdown-item .material-icons[b-nozj8msh4z] {
    font-size: 18px;
    color: var(--text-secondary);
}

.dropdown-item:hover[b-nozj8msh4z] {
    background-color: var(--bg-hover);
}

.dropdown-item:hover .material-icons[b-nozj8msh4z] {
    color: var(--text-primary);
}

.dropdown-item-danger[b-nozj8msh4z] {
    color: var(--color-danger);
}

.dropdown-item-danger .material-icons[b-nozj8msh4z] {
    color: var(--color-danger);
}

.dropdown-item-danger:hover[b-nozj8msh4z] {
    background-color: var(--color-danger-bg);
    color: var(--color-danger);
}

/* ============================================
   DARK MODE
   ============================================ */

[data-theme="dark"] .theme-toggle[b-nozj8msh4z] {
    border-color: var(--border-color);
    color: var(--text-secondary);
}

[data-theme="dark"] .theme-toggle:hover[b-nozj8msh4z] {
    background-color: var(--bg-hover);
    color: var(--text-primary);
}

[data-theme="dark"] .user-menu-btn[b-nozj8msh4z] {
    border-color: var(--border-color);
    color: var(--text-secondary);
}

[data-theme="dark"] .user-menu-btn:hover[b-nozj8msh4z] {
    background-color: var(--bg-hover);
}

[data-theme="dark"] .dropdown-menu[b-nozj8msh4z] {
    background-color: var(--bg-card);
    border-color: var(--border-color);
}

[data-theme="dark"] .dropdown-item:hover[b-nozj8msh4z] {
    background-color: var(--bg-hover);
}
/* _content/Geniar.Asistencias.Web/Shared/MainLayout.razor.rz.scp.css */
/* ============================================
   PAGE LAYOUT
   ============================================ */

.page[b-rnty9lgu4v] {
    position: relative;
    display: flex;
    flex-direction: column;
    min-height: 100vh;
}

main[b-rnty9lgu4v] {
    flex: 1;
    background-color: var(--bg-page);
    transition: background-color var(--transition);
}

/* ============================================
   SIDEBAR
   ============================================ */

.sidebar[b-rnty9lgu4v] {
    background-color: var(--sidebar-bg);
    display: flex;
    flex-direction: column;
}

/* ============================================
   TOP ROW / HEADER
   ============================================ */

.top-row[b-rnty9lgu4v] {
    background-color: var(--bg-card);
    border-bottom: 1px solid var(--border-color);
    justify-content: flex-end;
    height: 64px;
    display: flex;
    align-items: center;
    padding: 0 1.5rem;
    transition: background-color var(--transition), border-color var(--transition);
}

.top-row[b-rnty9lgu4v]  a,
.top-row .btn-link[b-rnty9lgu4v] {
    white-space: nowrap;
    margin-left: 1.5rem;
    color: var(--text-primary);
}

.top-row a:first-child[b-rnty9lgu4v] {
    overflow: hidden;
    text-overflow: ellipsis;
}

/* ============================================
   CONTENT AREA
   ============================================ */

article[b-rnty9lgu4v] {
    padding: 1.5rem;
}

/* ============================================
   RESPONSIVE - Mobile
   ============================================ */

@media (max-width: 640.98px) {
    .top-row:not(.auth)[b-rnty9lgu4v] {
        display: none;
    }

    .top-row.auth[b-rnty9lgu4v] {
        justify-content: space-between;
    }

    .top-row a[b-rnty9lgu4v],
    .top-row .btn-link[b-rnty9lgu4v] {
        margin-left: 0;
    }

    .sidebar[b-rnty9lgu4v] {
        position: fixed;
        top: 0;
        left: 0;
        right: 0;
        z-index: var(--z-fixed);
    }

    article[b-rnty9lgu4v] {
        padding: 1rem;
        margin-top: 64px;
    }
}

/* ============================================
   RESPONSIVE - Desktop
   ============================================ */

@media (min-width: 641px) {
    .page[b-rnty9lgu4v] {
        flex-direction: row;
    }

    .sidebar[b-rnty9lgu4v] {
        width: var(--sidebar-width);
        height: 100vh;
        position: sticky;
        top: 0;
        flex-shrink: 0;
    }

    .top-row[b-rnty9lgu4v] {
        position: sticky;
        top: 0;
        z-index: var(--z-sticky);
        box-shadow: var(--shadow-sm);
    }

    article[b-rnty9lgu4v] {
        padding: 1.5rem 2rem;
    }

    main[b-rnty9lgu4v] {
        display: flex;
        flex-direction: column;
        flex: 1;
        min-width: 0;
    }
}

/* ============================================
   DARK MODE
   ============================================ */

[data-theme="dark"] .top-row[b-rnty9lgu4v] {
    background-color: var(--bg-card);
    border-bottom-color: var(--border-color);
}

[data-theme="dark"] main[b-rnty9lgu4v] {
    background-color: var(--bg-page);
}
/* _content/Geniar.Asistencias.Web/Shared/NavMenu.razor.rz.scp.css */
/* ============================================
   SIDEBAR HEADER
   ============================================ */

.sidebar-header[b-amlku6zbcf] {
    height: 64px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0 1rem 0 1.25rem;
    background-color: rgba(0, 0, 0, 0.2);
    border-bottom: 1px solid var(--sidebar-border);
}

.sidebar-brand[b-amlku6zbcf] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    text-decoration: none;
    color: white;
}

.sidebar-logo[b-amlku6zbcf] {
    height: 32px;
    width: auto;
    object-fit: contain;
}

.sidebar-logo-placeholder[b-amlku6zbcf] {
    width: 32px;
    height: 32px;
    background-color: rgba(255, 255, 255, 0.1);
    border-radius: var(--border-radius);
    display: flex;
    align-items: center;
    justify-content: center;
}

.sidebar-logo-placeholder .material-icons[b-amlku6zbcf] {
    font-size: 18px;
    color: white;
}

.sidebar-brand-text[b-amlku6zbcf] {
    font-size: 1rem;
    font-weight: 600;
    letter-spacing: 0.025em;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 160px;
}

.navbar-toggler[b-amlku6zbcf] {
    background: transparent;
    border: none;
    padding: 0.5rem;
    cursor: pointer;
    display: none;
    color: rgba(255, 255, 255, 0.7);
    transition: color var(--transition-fast);
}

.navbar-toggler:hover[b-amlku6zbcf] {
    color: white;
}

.navbar-toggler .material-icons[b-amlku6zbcf] {
    font-size: 24px;
}

/* ============================================
   SIDEBAR NAVIGATION
   ============================================ */

.sidebar-nav[b-amlku6zbcf] {
    flex: 1;
    overflow-y: auto;
    padding: 1rem 0.75rem;
}

.nav-section-header[b-amlku6zbcf] {
    padding: 1.25rem 0.75rem 0.5rem;
    font-size: 0.6875rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    color: rgba(255, 255, 255, 0.4);
}

.nav-item[b-amlku6zbcf] {
    margin-bottom: 2px;
}

.nav-item--highlight[b-amlku6zbcf] {
    margin-bottom: 0.5rem;
}

.nav-item--highlight[b-amlku6zbcf]  a {
    background: linear-gradient(90deg, rgba(99, 102, 241, 0.2), transparent);
    border-left-color: var(--color-primary-light);
}

.nav-item--highlight[b-amlku6zbcf]  a .material-icons {
    color: var(--color-primary-light);
    opacity: 1;
}

.nav-section-divider[b-amlku6zbcf] {
    height: 1px;
    background-color: var(--sidebar-border);
    margin: 0.5rem 0.75rem 0.75rem;
}

.nav-item[b-amlku6zbcf]  a {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 0.625rem 0.75rem;
    border-radius: var(--border-radius);
    color: var(--sidebar-text);
    text-decoration: none;
    font-size: 0.875rem;
    font-weight: 400;
    transition: all var(--transition-fast);
    border-left: 3px solid transparent;
    margin-left: -3px;
}

.nav-item[b-amlku6zbcf]  a .material-icons {
    font-size: 20px;
    opacity: 0.8;
}

.nav-item[b-amlku6zbcf]  a:hover {
    background-color: var(--sidebar-item-hover);
    color: var(--sidebar-text-hover);
}

.nav-item[b-amlku6zbcf]  a:hover .material-icons {
    opacity: 1;
}

.nav-item[b-amlku6zbcf]  a.active {
    background-color: var(--sidebar-item-active-bg);
    color: white;
    font-weight: 500;
    border-left-color: var(--sidebar-item-active-border);
}

.nav-item[b-amlku6zbcf]  a.active .material-icons {
    opacity: 1;
    color: var(--color-primary-light);
}

.nav-text[b-amlku6zbcf] {
    white-space: nowrap;
}

/* ============================================
   SIDEBAR FOOTER (USER)
   ============================================ */

.sidebar-footer[b-amlku6zbcf] {
    padding: 1rem;
    background-color: rgba(0, 0, 0, 0.2);
    border-top: 1px solid var(--sidebar-border);
}

.sidebar-user[b-amlku6zbcf] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    text-decoration: none;
    color: white;
    padding: 0.5rem;
    border-radius: var(--border-radius);
    transition: background-color var(--transition-fast);
}

.sidebar-user:hover[b-amlku6zbcf] {
    background-color: var(--sidebar-item-hover);
}

.sidebar-user-avatar[b-amlku6zbcf] {
    width: 36px;
    height: 36px;
    background: linear-gradient(135deg, var(--color-primary) 0%, var(--color-primary-light) 100%);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 0.75rem;
    font-weight: 700;
    color: white;
    text-transform: uppercase;
}

.sidebar-user-info[b-amlku6zbcf] {
    display: flex;
    flex-direction: column;
    min-width: 0;
}

.sidebar-user-name[b-amlku6zbcf] {
    font-size: 0.875rem;
    font-weight: 500;
    color: white;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.sidebar-user-link[b-amlku6zbcf] {
    font-size: 0.75rem;
    color: rgba(255, 255, 255, 0.5);
}

.sidebar-actions[b-amlku6zbcf] {
    display: flex;
    gap: 0.5rem;
    margin-top: 0.75rem;
}

.sidebar-theme-toggle[b-amlku6zbcf] {
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    padding: 0.625rem 0.75rem;
    border-radius: var(--border-radius);
    color: rgba(255, 255, 255, 0.7);
    font-size: 0.8125rem;
    font-weight: 400;
    transition: all var(--transition-fast);
    background-color: rgba(255, 255, 255, 0.1);
    border: 1px solid rgba(255, 255, 255, 0.15);
    cursor: pointer;
}

.sidebar-theme-toggle:hover[b-amlku6zbcf] {
    background-color: rgba(255, 255, 255, 0.15);
    color: white;
    border-color: rgba(255, 255, 255, 0.25);
}

.sidebar-theme-toggle .material-icons[b-amlku6zbcf] {
    font-size: 18px;
}

.sidebar-logout[b-amlku6zbcf] {
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    padding: 0.625rem 0.75rem;
    border-radius: var(--border-radius);
    color: rgba(255, 255, 255, 0.7);
    text-decoration: none;
    font-size: 0.8125rem;
    font-weight: 400;
    transition: all var(--transition-fast);
    background-color: rgba(239, 68, 68, 0.1);
    border: 1px solid rgba(239, 68, 68, 0.2);
}

.sidebar-logout:hover[b-amlku6zbcf] {
    background-color: rgba(239, 68, 68, 0.2);
    color: #fca5a5;
    border-color: rgba(239, 68, 68, 0.4);
}

.sidebar-logout .material-icons[b-amlku6zbcf] {
    font-size: 18px;
}

/* ============================================
   RESPONSIVE - Mobile
   ============================================ */

@media (max-width: 640.98px) {
    .navbar-toggler[b-amlku6zbcf] {
        display: block;
    }

    .sidebar-nav.collapse[b-amlku6zbcf] {
        display: none;
    }

    .sidebar-nav.collapse + .sidebar-footer[b-amlku6zbcf] {
        display: none;
    }
}

@media (min-width: 641px) {
    .navbar-toggler[b-amlku6zbcf] {
        display: none;
    }

    .sidebar-nav[b-amlku6zbcf] {
        display: flex;
        flex-direction: column;
    }

    .sidebar-nav.collapse[b-amlku6zbcf] {
        display: flex;
    }
}

/* ============================================
   SCROLLBAR STYLING
   ============================================ */

.sidebar-nav[b-amlku6zbcf]::-webkit-scrollbar {
    width: 6px;
}

.sidebar-nav[b-amlku6zbcf]::-webkit-scrollbar-track {
    background: transparent;
}

.sidebar-nav[b-amlku6zbcf]::-webkit-scrollbar-thumb {
    background-color: rgba(255, 255, 255, 0.2);
    border-radius: 3px;
}

.sidebar-nav[b-amlku6zbcf]::-webkit-scrollbar-thumb:hover {
    background-color: rgba(255, 255, 255, 0.3);
}
