/* _content/ImagineTheFuture.BlazorServer/Pages/Admin/AboutInfoEditor.razor.rz.scp.css */
/*
 * AboutInfoEditor.razor.css
 * Panel de configuración de "Nosotros" - Industrial Edition
 */

.font-montserrat[b-hjnoucbm25] {
    font-family: 'Montserrat', sans-serif;
}

/* === HEADER === */
.editor-header[b-hjnoucbm25] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 2rem;
    padding-bottom: 1rem;
    border-bottom: 1px solid var(--palette-gray-dark);
}

    .editor-header h1[b-hjnoucbm25] {
        margin: 0;
        font-size: 1.75rem;
        color: var(--palette-white);
        font-weight: 700;
        text-transform: uppercase;
        letter-spacing: 0.05em;
    }

.text-muted[b-hjnoucbm25] {
    color: var(--palette-gray-light);
    opacity: 0.8;
}

/* === GRID PRINCIPAL === */
.editor-grid[b-hjnoucbm25] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(400px, 1fr));
    gap: 1.5rem;
    margin-bottom: 5rem; /* Espacio para el footer flotante */
}

/* === PANELES INDUSTRIALES === */
.panel-industrial[b-hjnoucbm25] {
    background-color: var(--palette-carbon-deep);
    border: 1px solid var(--palette-gray-dark);
    border-radius: 4px;
    overflow: hidden;
    display: flex;
    flex-direction: column;
}

.panel-header[b-hjnoucbm25] {
    padding: 1rem 1.5rem;
    background-color: rgba(255, 255, 255, 0.02);
    border-bottom: 1px solid var(--palette-gray-dark);
}

    .panel-header h4[b-hjnoucbm25] {
        margin: 0;
        font-size: 1rem;
        font-weight: 700;
        color: var(--palette-primary);
        text-transform: uppercase;
        letter-spacing: 0.05em;
        display: flex;
        align-items: center;
        gap: 0.5rem;
    }

.panel-body[b-hjnoucbm25] {
    padding: 1.5rem;
    flex-grow: 1;
}

/* === FORMULARIOS === */
.form-group[b-hjnoucbm25] {
    margin-bottom: 1.25rem;
}

[b-hjnoucbm25] label {
    display: block;
    margin-bottom: 0.4rem;
    font-weight: 600;
    font-size: 0.8rem;
    color: var(--palette-gray-light);
    text-transform: uppercase;
}

[b-hjnoucbm25] .form-control {
    display: block;
    width: 100%;
    padding: 0.7rem 1rem;
    font-size: 0.95rem;
    color: var(--palette-white);
    background-color: rgba(0, 0, 0, 0.3);
    border: 1px solid var(--palette-gray-mid);
    border-radius: 2px; /* Recto */
    transition: all 0.2s;
    font-family: 'Montserrat', sans-serif;
}

    [b-hjnoucbm25] .form-control:focus {
        border-color: var(--palette-primary);
        box-shadow: 0 0 0 1px rgba(0, 163, 224, 0.2);
        outline: none;
        background-color: rgba(0, 0, 0, 0.5);
    }

[b-hjnoucbm25] .validation-message {
    color: var(--palette-danger);
    font-size: 0.75rem;
    margin-top: 0.25rem;
    font-weight: 500;
}

/* Separadores */
.separator-line[b-hjnoucbm25] {
    height: 1px;
    background-color: var(--palette-gray-dark);
    margin: 1.5rem 0;
}

/* Grupos de Tarjetas */
.card-group[b-hjnoucbm25] {
    padding-bottom: 1.5rem;
    margin-bottom: 1.5rem;
    border-bottom: 1px dashed var(--palette-gray-dark);
}

    .card-group.no-border[b-hjnoucbm25] {
        border-bottom: none;
        margin-bottom: 0;
        padding-bottom: 0;
    }

.group-label[b-hjnoucbm25] {
    display: block;
    color: var(--palette-primary);
    font-size: 0.75rem;
    font-weight: 700;
    text-transform: uppercase;
    margin-bottom: 1rem;
    letter-spacing: 0.05em;
}

/* === FOOTER DE ACCIÓN (STICKY) === */
.action-bar-sticky[b-hjnoucbm25] {
    position: fixed;
    bottom: 0;
    left: 0;
    width: 100%;
    padding: 1rem 2rem;
    background-color: var(--palette-carbon-deep);
    border-top: 1px solid var(--palette-primary);
    display: flex;
    justify-content: flex-end;
    gap: 1rem;
    z-index: 100;
    box-shadow: 0 -5px 20px rgba(0,0,0,0.5);
}

.btn-cancel[b-hjnoucbm25] {
    padding: 0.7rem 1.5rem;
    background-color: transparent;
    border: 1px solid var(--palette-gray-mid);
    color: var(--palette-gray-light);
    font-family: 'Montserrat', sans-serif;
    font-weight: 600;
    border-radius: 2px;
    cursor: pointer;
    text-transform: uppercase;
    font-size: 0.85rem;
}

    .btn-cancel:hover[b-hjnoucbm25] {
        background-color: var(--palette-gray-darker);
        color: var(--palette-white);
    }

.btn-save[b-hjnoucbm25] {
    padding: 0.7rem 2rem;
    background-color: var(--palette-primary);
    color: var(--palette-white);
    border: none;
    font-family: 'Montserrat', sans-serif;
    font-weight: 700;
    border-radius: 2px;
    cursor: pointer;
    text-transform: uppercase;
    font-size: 0.85rem;
    display: flex;
    align-items: center;
    gap: 0.5rem;
    box-shadow: 0 4px 15px rgba(0, 163, 224, 0.3);
}

    .btn-save:hover:not(:disabled)[b-hjnoucbm25] {
        background-color: #0088BE;
        transform: translateY(-2px);
    }

    .btn-save:disabled[b-hjnoucbm25] {
        opacity: 0.5;
        cursor: not-allowed;
        background-color: var(--palette-gray-mid);
    }

/* Spinner */
.energy-loader[b-hjnoucbm25] {
    width: 3rem;
    height: 3rem;
    border: 3px solid rgba(255,255,255,0.1);
    border-top-color: var(--palette-primary);
    border-radius: 50%;
    animation: spin-b-hjnoucbm25 1s linear infinite;
    margin: 0 auto 1rem;
}

.loading-container[b-hjnoucbm25] {
    padding: 5rem;
    text-align: center;
}

.loading-text[b-hjnoucbm25] {
    color: var(--palette-primary);
    font-family: 'Montserrat', sans-serif;
    text-transform: uppercase;
    font-size: 0.9rem;
}

@keyframes spin-b-hjnoucbm25 {
    to {
        transform: rotate(360deg);
    }
}

/* Responsive */
@media (max-width: 768px) {
    .editor-header[b-hjnoucbm25] {
        align-items: flex-start;
        flex-direction: column;
        gap: 1rem;
    }

    .action-bar-sticky[b-hjnoucbm25] {
        padding: 1rem;
        justify-content: space-between;
    }

    .btn-cancel[b-hjnoucbm25], .btn-save[b-hjnoucbm25] {
        flex: 1;
        justify-content: center;
    }
}
/* _content/ImagineTheFuture.BlazorServer/Pages/Admin/ClientEditor.razor.rz.scp.css */
/*
 * ClientEditor.razor.css
 * Estilos para el formulario de creación/edición de clientes - Industrial Edition
*/

/* --- Fuentes --- */
.font-montserrat[b-zd2zfz270o] {
    font-family: 'Montserrat', sans-serif;
}

/* === Encabezado del Editor === */
.editor-header[b-zd2zfz270o] {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: center;
    gap: 1rem;
    margin-bottom: 2rem;
    padding-bottom: 1.5rem;
    border-bottom: 1px solid var(--palette-gray-dark);
}

    .editor-header h1[b-zd2zfz270o] {
        margin: 0;
        font-size: 1.75rem;
        font-weight: 700;
        color: var(--palette-white);
        font-family: 'Montserrat', sans-serif;
        text-transform: uppercase;
        letter-spacing: 0.05em;
    }

    .editor-header h2[b-zd2zfz270o] {
        margin: 0.25rem 0 0 0;
        font-size: 1rem;
        font-weight: 400;
        color: var(--palette-gray-light);
        font-family: 'Montserrat', sans-serif;
    }

    .editor-header p.text-muted[b-zd2zfz270o] {
        margin: 0.25rem 0 0;
        color: var(--palette-gray-mid);
        font-size: 1rem;
        opacity: 0.8;
    }

/* --- Estilo para el enlace en el subtítulo --- */
.subtitle-link a[b-zd2zfz270o] {
    color: var(--palette-primary);
    text-decoration: none;
    transition: text-decoration 0.2s ease;
    font-weight: 600;
}

    .subtitle-link a:hover[b-zd2zfz270o] {
        text-decoration: underline;
    }

.header-actions[b-zd2zfz270o] {
    display: flex;
    gap: 0.75rem;
}

/* === Botones === */
.btn-cancel[b-zd2zfz270o], .btn-save[b-zd2zfz270o], .btn-danger[b-zd2zfz270o], .btn-secondary[b-zd2zfz270o] {
    padding: 0.6rem 1.2rem;
    font-family: 'Montserrat', sans-serif;
    font-weight: 700;
    border-radius: 2px; /* Cuadrado técnico */
    border: 1px solid transparent;
    cursor: pointer;
    transition: all 0.2s ease;
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    text-transform: uppercase;
    font-size: 0.85rem;
}

.btn-cancel[b-zd2zfz270o] {
    background-color: transparent;
    color: var(--palette-gray-light);
    border-color: var(--palette-gray-mid);
}

    .btn-cancel:hover[b-zd2zfz270o] {
        background-color: var(--palette-gray-darker);
        color: var(--palette-white);
    }

.btn-save[b-zd2zfz270o] {
    background-color: var(--palette-primary);
    color: var(--palette-white);
    position: relative;
    box-shadow: 0 4px 10px rgba(0, 163, 224, 0.3);
}

    .btn-save:hover[b-zd2zfz270o] {
        background-color: #0088BE; /* Azul oscuro */
        transform: translateY(-1px);
    }

.btn-danger[b-zd2zfz270o] {
    background-color: transparent;
    color: var(--palette-danger);
    border-color: var(--palette-danger);
}

    .btn-danger:hover[b-zd2zfz270o] {
        background-color: rgba(229, 62, 62, 0.1);
        color: var(--palette-white);
    }

.btn-secondary[b-zd2zfz270o] {
    background-color: var(--palette-gray-darker);
    color: var(--palette-soft-white);
    border: 1px solid var(--palette-gray-dark);
}

    .btn-secondary:hover[b-zd2zfz270o] {
        background-color: var(--palette-gray-mid);
        border-color: var(--palette-white);
    }

/* Estado de carga del botón */
.btn-save.is-loading[b-zd2zfz270o],
.btn-danger.is-loading[b-zd2zfz270o] {
    cursor: not-allowed;
    filter: brightness(0.9);
}

    .btn-save.is-loading > *[b-zd2zfz270o],
    .btn-danger.is-loading > *[b-zd2zfz270o] {
        visibility: hidden;
    }

    .btn-save.is-loading[b-zd2zfz270o]::after,
    .btn-danger.is-loading[b-zd2zfz270o]::after {
        content: '';
        position: absolute;
        width: 1.2rem;
        height: 1.2rem;
        top: calc(50% - 0.6rem);
        left: calc(50% - 0.6rem);
        border: 2px solid rgba(255,255,255,0.1);
        border-top-color: var(--palette-white);
        border-radius: 50%;
        animation: spin-b-zd2zfz270o 0.8s ease-in-out infinite;
    }

@keyframes spin-b-zd2zfz270o {
    to {
        transform: rotate(360deg);
    }
}

/* ===== LAYOUT APILADO Y PANELES ===== */
.editor-stacked-layout[b-zd2zfz270o] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 2rem;
    width: 100%;
}

.stacked-panel[b-zd2zfz270o] {
    width: 100%;
}

.form-section h4[b-zd2zfz270o],
.user-link-section h4[b-zd2zfz270o],
.watches-list-section h4[b-zd2zfz270o] {
    margin-top: 0;
    margin-bottom: 1.5rem;
    padding-bottom: 0.75rem;
    border-bottom: 1px solid var(--palette-gray-dark);
    font-family: 'Montserrat', sans-serif;
    color: var(--palette-primary);
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    font-size: 1rem;
}

.form-section[b-zd2zfz270o],
.user-link-section[b-zd2zfz270o],
.watches-list-section[b-zd2zfz270o] {
    max-width: 800px;
    background-color: var(--palette-carbon-deep);
    border: 1px solid var(--palette-gray-dark);
    border-radius: 4px;
    padding: 2rem;
    box-shadow: 0 10px 30px rgba(0,0,0,0.5);
}

.form-group[b-zd2zfz270o] {
    margin-bottom: 1.5rem;
}

.form-check[b-zd2zfz270o] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    color: var(--palette-soft-white);
}

.form-actions[b-zd2zfz270o] {
    margin-top: 2rem;
    padding-top: 1.5rem;
    border-top: 1px solid var(--palette-gray-dark);
    display: flex;
    justify-content: flex-end;
}

/* === Sección de Vinculación de Usuario === */
.linked-client-display[b-zd2zfz270o] {
    background-color: rgba(0, 0, 0, 0.3);
    border: 1px solid var(--palette-gray-dark);
    padding: 1rem;
    border-radius: 2px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    gap: 1rem;
}

    .linked-client-display span[b-zd2zfz270o] {
        color: var(--palette-white);
        font-weight: 500;
        display: inline-flex;
        align-items: center;
    }

    .linked-client-display i[b-zd2zfz270o] {
        color: var(--palette-primary);
        margin-right: 0.5rem;
    }

.user-link-section > p + .btn-save[b-zd2zfz270o] {
    margin-top: 1rem;
}

/* === Estilos de Formulario (::deep) === */
[b-zd2zfz270o] label {
    display: block;
    margin-bottom: 0.5rem;
    font-weight: 600;
    font-size: 0.8rem;
    color: var(--palette-primary);
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

[b-zd2zfz270o] .form-control {
    display: block;
    width: 100%;
    padding: 0.75rem 1rem;
    font-size: 0.95rem;
    font-family: 'Montserrat', sans-serif;
    color: var(--palette-white);
    background-color: rgba(0, 0, 0, 0.3);
    border: 1px solid var(--palette-gray-mid);
    border-radius: 2px;
    transition: all .15s ease-in-out;
}

/* SVG flecha select actualizado a Azul (#00A3E0) */
[b-zd2zfz270o] select.form-control {
    cursor: pointer;
    appearance: none;
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%2300A3E0' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M2 5l6 6 6-6'/%3e%3c/svg%3e");
    background-repeat: no-repeat;
    background-position: right 1rem center;
    background-size: 16px 12px;
    padding-right: 2.5rem;
}

[b-zd2zfz270o] .form-control:disabled {
    background-color: rgba(255, 255, 255, 0.05);
    opacity: 0.6;
    cursor: not-allowed;
    border-color: var(--palette-gray-dark);
}

[b-zd2zfz270o] .form-control:focus {
    border-color: var(--palette-primary);
    outline: 0;
    box-shadow: 0 0 0 1px var(--palette-primary);
    background-color: rgba(0, 0, 0, 0.5);
}

[b-zd2zfz270o] .validation-message {
    color: var(--palette-danger);
    font-size: .75rem;
    margin-top: .25rem;
    font-weight: 500;
}

[b-zd2zfz270o] .form-control.invalid {
    border-color: var(--palette-danger);
}

    [b-zd2zfz270o] .form-control.invalid:focus {
        border-color: var(--palette-danger);
        box-shadow: 0 0 0 1px rgba(229,62,62,.25);
    }

/* === Responsividad === */
@media (max-width: 768px) {
    .editor-header[b-zd2zfz270o] {
        align-items: flex-start;
        flex-direction: column;
        gap: 1rem;
    }

    .header-actions[b-zd2zfz270o] {
        width: 100%;
        justify-content: flex-start;
    }

    .form-section[b-zd2zfz270o],
    .user-link-section[b-zd2zfz270o],
    .watches-list-section[b-zd2zfz270o] {
        padding: 1.5rem;
    }
}

.text-muted[b-zd2zfz270o] {
    color: var(--palette-gray-mid);
}

.loading-text[b-zd2zfz270o], .empty-text[b-zd2zfz270o] {
    text-align: center;
    color: var(--palette-gray-light);
    margin-top: 2rem;
    font-style: italic;
}
/* _content/ImagineTheFuture.BlazorServer/Pages/Admin/ContactInfoEditor.razor.rz.scp.css */
/* * ContactInfoEditor.razor.css
 * Panel de configuración de contacto - Industrial Edition (Con Mapa Interactivo)
 */

.font-montserrat[b-ijw5ahqye4] {
    font-family: 'Montserrat', sans-serif;
}

/* === HEADER === */
.editor-header[b-ijw5ahqye4] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 2rem;
    padding-bottom: 1rem;
    border-bottom: 1px solid var(--palette-gray-dark);
}

    .editor-header h1[b-ijw5ahqye4] {
        margin: 0;
        font-size: 1.75rem;
        color: var(--palette-white);
        font-weight: 700;
        text-transform: uppercase;
        letter-spacing: 0.05em;
    }

.text-muted[b-ijw5ahqye4] {
    color: var(--palette-gray-light);
    opacity: 0.8;
}

/* === GRID PRINCIPAL === */
.editor-grid[b-ijw5ahqye4] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(350px, 1fr));
    gap: 1.5rem;
    margin-bottom: 5rem; /* Espacio para el footer flotante */
}

/* === PANELES INDUSTRIALES === */
.panel-industrial[b-ijw5ahqye4] {
    background-color: var(--palette-carbon-deep);
    border: 1px solid var(--palette-gray-dark);
    border-radius: 4px;
    overflow: hidden;
    display: flex;
    flex-direction: column;
}

.panel-header[b-ijw5ahqye4] {
    padding: 1rem 1.5rem;
    background-color: rgba(255, 255, 255, 0.02);
    border-bottom: 1px solid var(--palette-gray-dark);
}

    .panel-header h4[b-ijw5ahqye4] {
        margin: 0;
        font-size: 1rem;
        font-weight: 700;
        color: var(--palette-primary);
        text-transform: uppercase;
        letter-spacing: 0.05em;
        display: flex;
        align-items: center;
        gap: 0.5rem;
    }

.panel-body[b-ijw5ahqye4] {
    padding: 1.5rem;
    flex-grow: 1;
}

/* === FORMULARIOS === */
.form-group[b-ijw5ahqye4] {
    margin-bottom: 1.25rem;
}

.grid-2-cols[b-ijw5ahqye4] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1rem;
}

[b-ijw5ahqye4] label {
    display: block;
    margin-bottom: 0.4rem;
    font-weight: 600;
    font-size: 0.8rem;
    color: var(--palette-gray-light);
    text-transform: uppercase;
}

[b-ijw5ahqye4] .form-control {
    display: block;
    width: 100%;
    padding: 0.7rem 1rem;
    font-size: 0.95rem;
    color: var(--palette-white);
    background-color: rgba(0, 0, 0, 0.3);
    border: 1px solid var(--palette-gray-mid);
    border-radius: 2px; /* Recto */
    transition: all 0.2s;
    font-family: 'Montserrat', sans-serif;
}

    [b-ijw5ahqye4] .form-control:focus {
        border-color: var(--palette-primary);
        box-shadow: 0 0 0 1px rgba(0, 163, 224, 0.2);
        outline: none;
        background-color: rgba(0, 0, 0, 0.5);
    }

    [b-ijw5ahqye4] .form-control:read-only {
        background-color: rgba(255, 255, 255, 0.05);
        cursor: default;
        color: var(--palette-primary); /* Destacar valor de mapa */
    }

/* Input con Botón (Para Mapa) */
.input-with-button[b-ijw5ahqye4] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

    .input-with-button .form-control[b-ijw5ahqye4] {
        flex-grow: 1;
    }

/* Botón Icono Mapa */
.btn-icon-map[b-ijw5ahqye4] {
    background: var(--palette-gray-darker);
    border: 1px solid var(--palette-gray-mid);
    border-radius: 2px;
    width: 42px; /* Cuadrado técnico */
    height: 42px;
    font-size: 1.1rem;
    color: var(--palette-gray-light);
    cursor: pointer;
    transition: all .2s ease;
    flex-shrink: 0;
    display: flex;
    align-items: center;
    justify-content: center;
}

    .btn-icon-map:hover[b-ijw5ahqye4] {
        color: var(--palette-primary);
        border-color: var(--palette-primary);
        background-color: rgba(0, 163, 224, 0.1);
    }

.help-text[b-ijw5ahqye4] {
    font-size: 0.75rem;
    color: var(--palette-gray-mid);
    margin-top: 0.3rem;
    display: block;
}

/* Avatar Preview */
.current-avatar[b-ijw5ahqye4] {
    display: flex;
    align-items: center;
    gap: 1rem;
    margin-bottom: 1.5rem;
    padding-bottom: 1.5rem;
    border-bottom: 1px dashed var(--palette-gray-dark);
}

    .current-avatar img[b-ijw5ahqye4] {
        width: 60px;
        height: 60px;
        border-radius: 50%;
        object-fit: cover;
        border: 2px solid var(--palette-primary);
    }

.badge-tech[b-ijw5ahqye4] {
    font-size: 0.7rem;
    background-color: var(--palette-gray-darker);
    color: var(--palette-primary);
    padding: 0.2rem 0.5rem;
    border-radius: 2px;
    text-transform: uppercase;
    font-weight: 700;
}

/* === FOOTER DE ACCIÓN (STICKY) === */
.action-bar-sticky[b-ijw5ahqye4] {
    position: fixed;
    bottom: 0;
    left: 0;
    width: 100%;
    padding: 1rem 2rem;
    background-color: var(--palette-carbon-deep);
    border-top: 1px solid var(--palette-primary);
    display: flex;
    justify-content: flex-end;
    gap: 1rem;
    z-index: 100;
    box-shadow: 0 -5px 20px rgba(0,0,0,0.5);
}

.btn-cancel[b-ijw5ahqye4] {
    padding: 0.7rem 1.5rem;
    background-color: transparent;
    border: 1px solid var(--palette-gray-mid);
    color: var(--palette-gray-light);
    font-family: 'Montserrat', sans-serif;
    font-weight: 600;
    border-radius: 2px;
    cursor: pointer;
    text-transform: uppercase;
    font-size: 0.85rem;
}

    .btn-cancel:hover[b-ijw5ahqye4] {
        background-color: var(--palette-gray-darker);
        color: var(--palette-white);
    }

.btn-save[b-ijw5ahqye4] {
    padding: 0.7rem 2rem;
    background-color: var(--palette-primary);
    color: var(--palette-white);
    border: none;
    font-family: 'Montserrat', sans-serif;
    font-weight: 700;
    border-radius: 2px;
    cursor: pointer;
    text-transform: uppercase;
    font-size: 0.85rem;
    display: flex;
    align-items: center;
    gap: 0.5rem;
    box-shadow: 0 4px 15px rgba(0, 163, 224, 0.3);
}

    .btn-save:hover:not(:disabled)[b-ijw5ahqye4] {
        background-color: #0088BE;
        transform: translateY(-2px);
    }

    .btn-save:disabled[b-ijw5ahqye4] {
        opacity: 0.5;
        cursor: not-allowed;
        background-color: var(--palette-gray-mid);
    }

/* Spinner */
.energy-loader[b-ijw5ahqye4] {
    width: 3rem;
    height: 3rem;
    border: 3px solid rgba(255,255,255,0.1);
    border-top-color: var(--palette-primary);
    border-radius: 50%;
    animation: spin-b-ijw5ahqye4 1s linear infinite;
    margin: 0 auto 1rem;
}

.loading-container[b-ijw5ahqye4] {
    padding: 5rem;
    text-align: center;
}

.loading-text[b-ijw5ahqye4] {
    color: var(--palette-primary);
    font-family: 'Montserrat', sans-serif;
    text-transform: uppercase;
    font-size: 0.9rem;
}

@keyframes spin-b-ijw5ahqye4 {
    to {
        transform: rotate(360deg);
    }
}

/* Responsive */
@media (max-width: 768px) {
    .grid-2-cols[b-ijw5ahqye4] {
        grid-template-columns: 1fr;
    }

    .action-bar-sticky[b-ijw5ahqye4] {
        padding: 1rem;
        justify-content: space-between;
    }

    .btn-cancel[b-ijw5ahqye4], .btn-save[b-ijw5ahqye4] {
        flex: 1;
        justify-content: center;
    }
}
/* _content/ImagineTheFuture.BlazorServer/Pages/Admin/DepartmentEditor.razor.rz.scp.css */
/*
 * DepartmentEditor.razor.css
 * Estilos para el formulario de departamentos - Industrial Edition
 */

.font-montserrat[b-2xqpfc1sik] {
    font-family: 'Montserrat', sans-serif;
}

/* === HEADER === */
.editor-header[b-2xqpfc1sik] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 2rem;
    padding-bottom: 1.5rem;
    border-bottom: 1px solid var(--palette-gray-dark);
}

    .editor-header h1[b-2xqpfc1sik] {
        margin: 0;
        font-size: 1.75rem;
        font-weight: 700;
        color: var(--palette-white);
        text-transform: uppercase;
        letter-spacing: 0.05em;
    }

.header-actions[b-2xqpfc1sik] {
    display: flex;
    gap: 0.75rem;
}

/* === BOTONES === */
.btn-cancel[b-2xqpfc1sik], .btn-save[b-2xqpfc1sik] {
    padding: 0.6rem 1.2rem;
    font-family: 'Montserrat', sans-serif;
    font-weight: 700;
    border-radius: 2px;
    border: 1px solid transparent;
    cursor: pointer;
    transition: all 0.2s ease;
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    text-transform: uppercase;
    font-size: 0.85rem;
}

.btn-cancel[b-2xqpfc1sik] {
    background-color: transparent;
    color: var(--palette-gray-light);
    border-color: var(--palette-gray-mid);
}

    .btn-cancel:hover[b-2xqpfc1sik] {
        background-color: var(--palette-gray-darker);
        color: var(--palette-white);
    }

.btn-save[b-2xqpfc1sik] {
    background-color: var(--palette-primary);
    color: var(--palette-white);
    position: relative;
    box-shadow: 0 4px 10px rgba(0, 163, 224, 0.3);
}

    .btn-save:hover[b-2xqpfc1sik] {
        background-color: #0088BE;
        transform: translateY(-1px);
    }

    .btn-save.is-loading[b-2xqpfc1sik] {
        cursor: not-allowed;
        filter: brightness(0.9);
    }

        .btn-save.is-loading > *[b-2xqpfc1sik] {
            visibility: hidden;
        }

        .btn-save.is-loading[b-2xqpfc1sik]::after {
            content: '';
            position: absolute;
            width: 1.2rem;
            height: 1.2rem;
            top: calc(50% - 0.6rem);
            left: calc(50% - 0.6rem);
            border: 2px solid rgba(255,255,255,0.1);
            border-top-color: var(--palette-white);
            border-radius: 50%;
            animation: spin-b-2xqpfc1sik 0.8s ease-in-out infinite;
        }

@keyframes spin-b-2xqpfc1sik {
    to {
        transform: rotate(360deg);
    }
}

/* === LAYOUT === */
.editor-stacked-layout[b-2xqpfc1sik] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 2rem;
    width: 100%;
}

.stacked-panel[b-2xqpfc1sik] {
    width: 100%;
}

.form-section h4[b-2xqpfc1sik] {
    margin-top: 0;
    margin-bottom: 1.5rem;
    padding-bottom: 0.75rem;
    border-bottom: 1px solid var(--palette-gray-dark);
    font-family: 'Montserrat', sans-serif;
    color: var(--palette-primary);
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    font-size: 1rem;
}

.form-section[b-2xqpfc1sik] {
    max-width: 800px;
    background-color: var(--palette-carbon-deep);
    border: 1px solid var(--palette-gray-dark);
    border-radius: 4px;
    padding: 2rem;
    box-shadow: 0 10px 30px rgba(0,0,0,0.5);
}

.form-group[b-2xqpfc1sik] {
    margin-bottom: 1.5rem;
}

.form-actions[b-2xqpfc1sik] {
    margin-top: 2rem;
    padding-top: 1.5rem;
    border-top: 1px solid var(--palette-gray-dark);
    display: flex;
    justify-content: flex-end;
}

/* === INPUTS === */
[b-2xqpfc1sik] label {
    display: block;
    margin-bottom: 0.5rem;
    font-weight: 600;
    font-size: 0.8rem;
    color: var(--palette-primary);
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

[b-2xqpfc1sik] .form-control {
    display: block;
    width: 100%;
    padding: 0.75rem 1rem;
    font-size: 0.95rem;
    font-family: 'Montserrat', sans-serif;
    color: var(--palette-white);
    background-color: rgba(0, 0, 0, 0.3);
    border: 1px solid var(--palette-gray-mid);
    border-radius: 2px;
    transition: all .15s ease-in-out;
}

    [b-2xqpfc1sik] .form-control:focus {
        border-color: var(--palette-primary);
        outline: 0;
        box-shadow: 0 0 0 1px var(--palette-primary);
        background-color: rgba(0, 0, 0, 0.5);
    }

[b-2xqpfc1sik] .validation-message {
    color: var(--palette-danger);
    font-size: .75rem;
    margin-top: .25rem;
    font-weight: 500;
}

/* Utils */
.text-muted[b-2xqpfc1sik] {
    color: var(--palette-gray-mid);
}

.empty-text-container[b-2xqpfc1sik] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 4rem 2rem;
    text-align: center;
    color: var(--palette-gray-light);
    background-color: rgba(255, 255, 255, 0.02);
    border: 2px dashed var(--palette-gray-dark);
    border-radius: 4px;
}

    .empty-text-container i[b-2xqpfc1sik] {
        opacity: 0.5;
        margin-bottom: 1rem;
        color: var(--palette-gray-mid);
    }

/* Responsive */
@media (max-width: 768px) {
    .editor-header[b-2xqpfc1sik] {
        align-items: flex-start;
        flex-direction: column;
        gap: 1rem;
    }

    .header-actions[b-2xqpfc1sik] {
        width: 100%;
        justify-content: flex-start;
    }

    .form-section[b-2xqpfc1sik] {
        padding: 1.5rem;
    }
}

.animate-fade-in[b-2xqpfc1sik] {
    animation: fadeIn-b-2xqpfc1sik 0.4s ease-out forwards;
}

@keyframes fadeIn-b-2xqpfc1sik {
    from {
        opacity: 0;
        transform: translateY(10px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}
/* _content/ImagineTheFuture.BlazorServer/Pages/Admin/EmployeeEditor.razor.rz.scp.css */
/*
 * EmployeeEditor.razor.css
 * Estilos para el formulario de empleados - Industrial Edition
*/

.font-montserrat[b-12j0ujz2up] {
    font-family: 'Montserrat', sans-serif;
}

/* === ENCABEZADO === */
.editor-header[b-12j0ujz2up] {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: center;
    gap: 1rem;
    margin-bottom: 2rem;
    padding-bottom: 1.5rem;
    border-bottom: 1px solid var(--palette-gray-dark);
    width: 100%;
}

    .editor-header h1[b-12j0ujz2up] {
        margin: 0;
        font-size: 1.75rem;
        font-weight: 700;
        color: var(--palette-white);
        font-family: 'Montserrat', sans-serif;
        text-transform: uppercase;
        letter-spacing: 0.05em;
    }

    .editor-header h2[b-12j0ujz2up] {
        margin: 0.25rem 0 0 0;
        font-size: 1rem;
        font-weight: 400;
        color: var(--palette-gray-mid);
        font-family: 'Montserrat', sans-serif;
    }

/* Link de subtítulo */
.subtitle-link a[b-12j0ujz2up] {
    color: var(--palette-primary);
    text-decoration: none;
    transition: text-decoration 0.2s ease;
    font-weight: 600;
}

    .subtitle-link a:hover[b-12j0ujz2up] {
        text-decoration: underline;
    }

.header-actions[b-12j0ujz2up] {
    display: flex;
    gap: 0.75rem;
}

/* === BOTONES === */
.btn-cancel[b-12j0ujz2up], .btn-save[b-12j0ujz2up], .btn-danger[b-12j0ujz2up], .btn-secondary[b-12j0ujz2up] {
    padding: 0.6rem 1.2rem;
    font-family: 'Montserrat', sans-serif;
    font-weight: 700;
    border-radius: 2px; /* Cuadrado técnico */
    border: 1px solid transparent;
    cursor: pointer;
    transition: all 0.2s ease;
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    text-transform: uppercase;
    font-size: 0.85rem;
}

.btn-cancel[b-12j0ujz2up] {
    background-color: transparent;
    color: var(--palette-gray-light);
    border-color: var(--palette-gray-mid);
}

    .btn-cancel:hover[b-12j0ujz2up] {
        background-color: var(--palette-gray-darker);
        color: var(--palette-white);
    }

.btn-save[b-12j0ujz2up] {
    background-color: var(--palette-primary);
    color: var(--palette-white);
    position: relative;
    box-shadow: 0 4px 10px rgba(0, 163, 224, 0.3);
}

    .btn-save:hover[b-12j0ujz2up] {
        background-color: #0088BE;
        transform: translateY(-1px);
    }

    .btn-save.is-loading[b-12j0ujz2up] {
        cursor: not-allowed;
        filter: brightness(0.9);
    }

        .btn-save.is-loading > *[b-12j0ujz2up] {
            visibility: hidden;
        }

        .btn-save.is-loading[b-12j0ujz2up]::after {
            content: '';
            position: absolute;
            width: 1.2rem;
            height: 1.2rem;
            top: calc(50% - 0.6rem);
            left: calc(50% - 0.6rem);
            border: 2px solid rgba(255,255,255,0.1);
            border-top-color: var(--palette-white);
            border-radius: 50%;
            animation: spin-b-12j0ujz2up 0.8s ease-in-out infinite;
        }

.btn-danger[b-12j0ujz2up] {
    background-color: transparent;
    color: var(--palette-danger);
    border-color: var(--palette-danger);
}

    .btn-danger:hover[b-12j0ujz2up] {
        background-color: rgba(229, 62, 62, 0.1);
        color: var(--palette-white);
    }

.btn-secondary[b-12j0ujz2up] {
    background-color: var(--palette-gray-darker);
    color: var(--palette-soft-white);
    border: 1px solid var(--palette-gray-dark);
}

    .btn-secondary:hover[b-12j0ujz2up] {
        background-color: var(--palette-gray-mid);
        border-color: var(--palette-white);
    }

@keyframes spin-b-12j0ujz2up {
    to {
        transform: rotate(360deg);
    }
}

/* ===== LAYOUT ===== */
.editor-stacked-layout[b-12j0ujz2up] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 2rem;
    width: 100%;
}

.stacked-panel[b-12j0ujz2up] {
    width: 100%;
}

/* [CORRECCIÓN]: Regla unificada para el ancho de los paneles.
   Aplica a form, user-link Y schedule-section para que todos midan lo mismo.
*/
.form-section[b-12j0ujz2up], .user-link-section[b-12j0ujz2up], .schedule-section[b-12j0ujz2up] {
    max-width: 800px;
    width: 100%;
}

/* [CORRECCIÓN]: Estilos de tarjeta solo para Form y UserLink.
   ScheduleSection NO lleva esto porque el componente hijo ya trae sus tarjetas.
*/
.form-section[b-12j0ujz2up], .user-link-section[b-12j0ujz2up] {
    background-color: var(--palette-carbon-deep);
    border: 1px solid var(--palette-gray-dark);
    border-radius: 4px;
    padding: 2rem;
    box-shadow: 0 10px 30px rgba(0,0,0,0.5);
}

    .form-section h4[b-12j0ujz2up], .user-link-section h4[b-12j0ujz2up] {
        margin-top: 0;
        margin-bottom: 1.5rem;
        padding-bottom: 0.75rem;
        border-bottom: 1px solid var(--palette-gray-dark);
        font-family: 'Montserrat', sans-serif;
        color: var(--palette-primary);
        font-weight: 700;
        text-transform: uppercase;
        letter-spacing: 0.05em;
        font-size: 1rem;
    }

.form-group[b-12j0ujz2up] {
    margin-bottom: 1.5rem;
}

.form-actions[b-12j0ujz2up] {
    margin-top: 2rem;
    padding-top: 1.5rem;
    border-top: 1px solid var(--palette-gray-dark);
    display: flex;
    justify-content: flex-end;
}

.separator[b-12j0ujz2up] {
    border: 0;
    border-top: 1px solid var(--palette-gray-dark);
    margin: 2rem 0;
    opacity: 0.5;
}

/* Grid helper - Semántico */
.form-grid[b-12j0ujz2up] {
    display: grid;
    grid-template-columns: 1fr;
    gap: 1rem;
}

@media (min-width: 640px) {
    .form-grid[b-12j0ujz2up] {
        grid-template-columns: 1fr 1fr;
    }
}

/* === VINCULACIÓN DE USUARIO === */
.linked-user-display[b-12j0ujz2up] {
    background-color: rgba(0, 0, 0, 0.3);
    border: 1px solid var(--palette-gray-dark);
    padding: 1rem;
    border-radius: 2px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    gap: 1rem;
}

.user-info[b-12j0ujz2up] {
    color: var(--palette-white);
    font-weight: 500;
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

    .user-info i[b-12j0ujz2up] {
        color: var(--palette-primary);
    }

/* === INPUTS === */
[b-12j0ujz2up] label {
    display: block;
    margin-bottom: 0.5rem;
    font-weight: 600;
    font-size: 0.8rem;
    color: var(--palette-primary);
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

[b-12j0ujz2up] .form-control {
    display: block;
    width: 100%;
    padding: 0.75rem 1rem;
    font-size: 0.95rem;
    font-family: 'Montserrat', sans-serif;
    color: var(--palette-white);
    background-color: rgba(0, 0, 0, 0.3);
    border: 1px solid var(--palette-gray-mid);
    border-radius: 2px;
    transition: all .15s ease-in-out;
}

/* SVG flecha select en Azul */
[b-12j0ujz2up] select.form-control {
    cursor: pointer;
    appearance: none;
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%2300A3E0' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M2 5l6 6 6-6'/%3e%3c/svg%3e");
    background-repeat: no-repeat;
    background-position: right 1rem center;
    background-size: 16px 12px;
    padding-right: 2.5rem;
}

[b-12j0ujz2up] .form-control:focus {
    border-color: var(--palette-primary);
    outline: 0;
    box-shadow: 0 0 0 1px var(--palette-primary);
    background-color: rgba(0, 0, 0, 0.5);
}

[b-12j0ujz2up] .validation-message {
    color: var(--palette-danger);
    font-size: .75rem;
    margin-top: .25rem;
    font-weight: 500;
}

/* === Utils === */
.text-muted[b-12j0ujz2up] {
    color: var(--palette-gray-mid);
}

.help-text[b-12j0ujz2up] {
    font-size: 0.8rem;
    color: var(--palette-gray-mid);
    font-style: italic;
    margin-top: 0.3rem;
    display: block;
}

.empty-text-container[b-12j0ujz2up] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 4rem 2rem;
    text-align: center;
    color: var(--palette-gray-light);
    background-color: rgba(255, 255, 255, 0.02);
    border: 2px dashed var(--palette-gray-dark);
    border-radius: 4px;
}

    .empty-text-container i[b-12j0ujz2up] {
        opacity: 0.5;
        margin-bottom: 1rem;
        color: var(--palette-gray-mid);
    }

/* Responsive */
@media (max-width: 768px) {
    .editor-header[b-12j0ujz2up] {
        align-items: flex-start;
        flex-direction: column;
        gap: 1rem;
    }

    .header-actions[b-12j0ujz2up] {
        width: 100%;
        justify-content: flex-start;
    }

    .form-section[b-12j0ujz2up], .user-link-section[b-12j0ujz2up] {
        padding: 1.5rem;
    }
}

.animate-fade-in[b-12j0ujz2up] {
    animation: fadeIn-b-12j0ujz2up 0.4s ease-out forwards;
}

@keyframes fadeIn-b-12j0ujz2up {
    from {
        opacity: 0;
        transform: translateY(10px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}
/* _content/ImagineTheFuture.BlazorServer/Pages/Admin/ManageClients.razor.rz.scp.css */
/*
 * ManageClients.razor.css
 * Estilos para la gestión de clientes - Industrial Edition
*/

/* === HEADER Y BOTONES === */
.page-header[b-vm8zoq80ip] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 2rem;
    padding-bottom: 1rem;
    border-bottom: 1px solid var(--palette-gray-dark);
    flex-wrap: wrap;
    gap: 1rem;
}

    .page-header h1[b-vm8zoq80ip] {
        margin: 0;
        font-size: 1.75rem;
        font-family: 'Montserrat', sans-serif;
        font-weight: 700;
        color: var(--palette-white);
        text-transform: uppercase;
        letter-spacing: 0.05em;
    }

.header-actions[b-vm8zoq80ip] {
    display: flex;
    align-items: center;
    gap: 0.8rem;
}

/* Botón Crear Nuevo (Sólido Industrial) */
.btn-create-new[b-vm8zoq80ip] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.6rem 1.2rem;
    background-color: var(--palette-primary);
    color: var(--palette-white); /* Texto blanco para contraste */
    font-family: 'Montserrat', sans-serif;
    font-weight: 700;
    border-radius: 2px; /* Cuadrado técnico */
    text-decoration: none;
    transition: all 0.2s ease;
    border: none;
    cursor: pointer;
    font-size: 0.85rem;
    text-transform: uppercase;
    box-shadow: 0 4px 10px rgba(0, 163, 224, 0.3);
}

    .btn-create-new:hover[b-vm8zoq80ip] {
        background-color: #0088BE; /* Azul oscuro */
        transform: translateY(-1px);
        box-shadow: 0 6px 15px rgba(0, 163, 224, 0.4);
    }

/* Botón Refrescar (Outline) */
.btn-refresh[b-vm8zoq80ip] {
    color: var(--palette-primary);
    border: 1px solid var(--palette-gray-mid);
    background: transparent;
    width: 36px;
    height: 36px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 2px;
    cursor: pointer;
    transition: all 0.2s ease;
}

    .btn-refresh:hover[b-vm8zoq80ip] {
        background-color: rgba(0, 163, 224, 0.1);
        border-color: var(--palette-primary);
    }

/* === MURO DE SEGURIDAD (ADMIN AUTH WALL) === */
.admin-security-wall[b-vm8zoq80ip] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    min-height: 60vh;
    text-align: center;
    padding: 2rem;
    background: rgba(255, 255, 255, 0.02);
    border-radius: 4px;
    border: 2px dashed var(--palette-gray-dark);
}

.wall-content[b-vm8zoq80ip] {
    max-width: 500px;
    width: 100%;
}

.wall-icon-wrapper[b-vm8zoq80ip] {
    width: 80px;
    height: 80px;
    background-color: rgba(0, 163, 224, 0.1); /* Fondo azul sutil */
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto 1.5rem;
    color: var(--palette-primary);
    font-size: 2rem;
    border: 1px solid var(--palette-primary);
}

.wall-title[b-vm8zoq80ip] {
    font-family: 'Montserrat', sans-serif;
    font-weight: 700;
    color: var(--palette-white);
    margin-bottom: 0.5rem;
    text-transform: uppercase;
}

.wall-message[b-vm8zoq80ip] {
    color: var(--palette-gray-light);
    margin-bottom: 2rem;
    line-height: 1.5;
}

.wall-form-wrapper[b-vm8zoq80ip] {
    background-color: var(--palette-carbon-deep);
    padding: 1.5rem;
    border-radius: 4px;
    box-shadow: 0 10px 30px rgba(0,0,0,0.5);
    border: 1px solid var(--palette-gray-dark);
}

/* === ESTADOS VACÍOS === */
.empty-state-container[b-vm8zoq80ip] {
    text-align: center;
    padding: 4rem 1rem;
    border: 2px dashed var(--palette-gray-dark);
    border-radius: 4px;
    background-color: rgba(255,255,255,0.01);
    margin-top: 2rem;
}

.empty-icon[b-vm8zoq80ip] {
    font-size: 3rem;
    margin-bottom: 1rem;
    opacity: 0.5;
    color: var(--palette-gray-mid);
}

.empty-text[b-vm8zoq80ip] {
    font-family: 'Montserrat', sans-serif;
    color: var(--palette-gray-light);
    font-size: 1rem;
}

/* === TABLA RESPONSIVA === */
.table-responsive-wrapper[b-vm8zoq80ip] {
    width: 100%;
    overflow-x: auto;
    /* Scrollbar fino */
    scrollbar-width: thin;
    scrollbar-color: var(--palette-gray-dark) transparent;
}

.clients-table[b-vm8zoq80ip] {
    width: 100%;
    border-collapse: collapse;
}

    .clients-table th[b-vm8zoq80ip], .clients-table td[b-vm8zoq80ip] {
        padding: 1rem 1.25rem;
        text-align: left;
        border-bottom: 1px solid var(--palette-gray-dark);
        vertical-align: middle;
        color: var(--palette-soft-white);
    }

    .clients-table th[b-vm8zoq80ip] {
        font-weight: 700;
        color: var(--palette-primary); /* Encabezados Azules */
        font-size: 0.75rem;
        text-transform: uppercase;
        letter-spacing: 0.05em;
        border-bottom: 2px solid var(--palette-gray-dark);
        opacity: 1;
    }

    .clients-table tbody tr[b-vm8zoq80ip] {
        transition: background-color 0.2s ease;
    }

        .clients-table tbody tr:hover[b-vm8zoq80ip] {
            background-color: rgba(255, 255, 255, 0.03);
        }

.email-badge[b-vm8zoq80ip] {
    background-color: var(--palette-gray-darker);
    padding: 0.2rem 0.5rem;
    border-radius: 2px;
    font-size: 0.85rem;
    border: 1px solid var(--palette-gray-dark);
    font-family: 'Montserrat', sans-serif; /* Opcional: monospace si quieres que parezca código */
}

.text-muted[b-vm8zoq80ip] {
    color: var(--palette-gray-mid) !important;
}

.actions-cell[b-vm8zoq80ip] {
    text-align: right;
    white-space: nowrap;
}

.actions-header[b-vm8zoq80ip] {
    text-align: right;
}

.btn-icon[b-vm8zoq80ip] {
    background: transparent;
    border: 1px solid transparent;
    border-radius: 2px;
    width: 32px;
    height: 32px;
    font-size: 0.9rem;
    cursor: pointer;
    transition: all 0.2s ease;
    margin-left: 0.25rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.btn-edit[b-vm8zoq80ip] {
    color: var(--palette-gray-light);
}

    .btn-edit:hover[b-vm8zoq80ip] {
        color: var(--palette-primary);
        background-color: rgba(0, 163, 224, 0.1);
        border-color: var(--palette-primary);
    }

.btn-delete[b-vm8zoq80ip] {
    color: var(--palette-gray-light);
}

    .btn-delete:hover[b-vm8zoq80ip] {
        color: var(--palette-danger);
        background-color: rgba(229, 62, 62, 0.1);
        border-color: var(--palette-danger);
    }

/* === RESPONSIVIDAD === */
@media (max-width: 768px) {
    .page-header[b-vm8zoq80ip] {
        flex-direction: column;
        align-items: flex-start;
        gap: 1rem;
    }

    .header-actions[b-vm8zoq80ip] {
        width: 100%;
        justify-content: flex-start; /* Alineado a la izquierda en móvil */
    }

    /* Transformación a Tarjetas */
    .clients-table thead[b-vm8zoq80ip] {
        display: none;
    }

    .clients-table tr[b-vm8zoq80ip] {
        display: block;
        margin-bottom: 1rem;
        border: 1px solid var(--palette-gray-dark);
        border-radius: 4px;
        overflow: hidden;
        background-color: var(--palette-carbon-deep);
        padding: 1rem;
    }

    .clients-table td[b-vm8zoq80ip] {
        display: flex;
        justify-content: space-between;
        align-items: center;
        text-align: right;
        padding: 0.75rem 0;
        border-bottom: 1px solid rgba(255,255,255,0.05);
    }

        .clients-table td[b-vm8zoq80ip]::before {
            content: attr(data-label);
            font-weight: 700;
            text-align: left;
            margin-right: 1rem;
            color: var(--palette-primary);
            font-size: 0.75rem;
            text-transform: uppercase;
        }

    .clients-table tr:last-child[b-vm8zoq80ip] {
        margin-bottom: 0;
    }

    .clients-table td:last-child[b-vm8zoq80ip] {
        border-bottom: none;
        padding-top: 1rem;
        padding-bottom: 0;
    }

    .actions-cell[b-vm8zoq80ip] {
        justify-content: flex-end;
        background-color: transparent; /* Quitamos fondo oscuro si existía */
    }

        .actions-cell[b-vm8zoq80ip]::before {
            content: "Acciones";
        }
}

.animate-fade-in[b-vm8zoq80ip] {
    animation: fadeIn-b-vm8zoq80ip 0.5s ease-out forwards;
}

@keyframes fadeIn-b-vm8zoq80ip {
    from {
        opacity: 0;
        transform: translateY(5px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}
/* _content/ImagineTheFuture.BlazorServer/Pages/Admin/ManageContacts.razor.rz.scp.css */
/*
 * AdminContacts.razor.css
 * Gestión de mensajes de contacto - Industrial Edition
 */

.page-header[b-cm0tjr7e5r] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 2rem;
    padding-bottom: 1rem;
    border-bottom: 1px solid var(--palette-gray-dark);
}

    .page-header h1[b-cm0tjr7e5r] {
        font-size: 1.75rem;
        color: var(--palette-white);
        margin: 0;
        font-weight: 700;
        text-transform: uppercase;
        letter-spacing: 0.05em;
    }

.header-actions[b-cm0tjr7e5r] {
    display: flex;
    gap: 0.5rem;
}

/* === TABLA Y CELDAS === */
.custom-table[b-cm0tjr7e5r] {
    width: 100%;
    border-collapse: collapse;
}

    .custom-table th[b-cm0tjr7e5r], .custom-table td[b-cm0tjr7e5r] {
        padding: 1rem;
        text-align: left;
        border-bottom: 1px solid var(--palette-gray-dark);
        color: var(--palette-soft-white);
    }

    .custom-table th[b-cm0tjr7e5r] {
        font-size: 0.75rem;
        text-transform: uppercase;
        letter-spacing: 1px;
        color: var(--palette-primary); /* Azul Eléctrico */
        font-weight: 700;
        border-bottom: 2px solid var(--palette-gray-dark);
    }

/* Badges y Truncado */
.badge-event[b-cm0tjr7e5r] {
    background-color: rgba(0, 163, 224, 0.1); /* Fondo Azul sutil */
    color: var(--palette-primary); /* Texto Azul */
    padding: 0.25rem 0.6rem;
    border-radius: 2px; /* Borde recto industrial */
    font-size: 0.8rem;
    border: 1px solid var(--palette-primary);
    text-transform: uppercase;
    font-weight: 600;
}

.truncate-text[b-cm0tjr7e5r] {
    max-width: 250px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    color: var(--palette-gray-light);
    font-size: 0.9rem;
}

.email-link[b-cm0tjr7e5r] {
    color: var(--palette-soft-white);
    text-decoration: none;
    transition: color 0.2s;
    font-weight: 500;
}

    .email-link:hover[b-cm0tjr7e5r] {
        color: var(--palette-primary);
        text-decoration: underline;
    }

/* === BOTONES === */
.btn-icon[b-cm0tjr7e5r] {
    background: transparent;
    border: 1px solid transparent;
    cursor: pointer;
    font-size: 1rem;
    padding: 0.5rem;
    transition: all 0.2s;
    border-radius: 2px;
    color: var(--palette-gray-light);
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

/* Botones de Cabecera */
.btn-settings[b-cm0tjr7e5r], .btn-refresh[b-cm0tjr7e5r] {
    border: 1px solid var(--palette-gray-mid);
}

    .btn-settings:hover[b-cm0tjr7e5r], .btn-refresh:hover[b-cm0tjr7e5r] {
        border-color: var(--palette-primary);
        color: var(--palette-primary);
        background-color: rgba(0, 163, 224, 0.1);
    }

.btn-reply a[b-cm0tjr7e5r] {
    color: inherit;
    text-decoration: none;
    display: flex;
}

.btn-reply:hover[b-cm0tjr7e5r] {
    color: var(--palette-primary);
    background-color: rgba(0, 163, 224, 0.1);
}

.btn-delete[b-cm0tjr7e5r] {
    color: var(--palette-danger);
}

    .btn-delete:hover[b-cm0tjr7e5r] {
        background-color: rgba(229, 62, 62, 0.1);
        border-color: var(--palette-danger);
        color: var(--palette-white);
    }

/* === LOADING & EMPTY STATE === */
.loading-container[b-cm0tjr7e5r] {
    padding: 4rem;
    text-align: center;
    display: flex;
    flex-direction: column;
    align-items: center;
}

/* Loader Turbina */
.energy-loader[b-cm0tjr7e5r] {
    width: 3rem;
    height: 3rem;
    border: 3px solid rgba(255,255,255,0.1);
    border-top-color: var(--palette-primary);
    border-radius: 50%;
    animation: spin-b-cm0tjr7e5r 1s linear infinite;
    margin-bottom: 1rem;
}

.loading-text[b-cm0tjr7e5r] {
    color: var(--palette-primary);
    font-family: 'Montserrat', sans-serif;
    font-size: 0.9rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

.empty-state[b-cm0tjr7e5r] {
    padding: 5rem 2rem;
    text-align: center;
    background-color: rgba(255, 255, 255, 0.02);
    border: 2px dashed var(--palette-gray-dark);
    border-radius: 4px;
    margin-top: 2rem;
}

.text-muted[b-cm0tjr7e5r] {
    color: var(--palette-gray-mid) !important;
}

.empty-text[b-cm0tjr7e5r] {
    font-family: 'Montserrat', sans-serif;
    color: var(--palette-gray-light);
    font-size: 1.1rem;
    margin-top: 1rem;
}

@keyframes spin-b-cm0tjr7e5r {
    to {
        transform: rotate(360deg);
    }
}

.animate-fade-in[b-cm0tjr7e5r] {
    animation: fadeIn-b-cm0tjr7e5r 0.5s ease-out;
}

@keyframes fadeIn-b-cm0tjr7e5r {
    from {
        opacity: 0;
        transform: translateY(10px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* === LÓGICA DE TARJETAS (MÓVIL) === */
@media (max-width: 768px) {
    .custom-table thead[b-cm0tjr7e5r] {
        display: none;
    }

    .custom-table tr[b-cm0tjr7e5r] {
        display: block;
        background: var(--palette-carbon-deep);
        margin-bottom: 1.5rem;
        border-radius: 4px;
        border: 1px solid var(--palette-gray-dark);
        padding: 1rem;
    }

    .custom-table td[b-cm0tjr7e5r] {
        display: flex;
        justify-content: space-between;
        align-items: center;
        text-align: right;
        border-bottom: 1px solid rgba(255,255,255,0.05);
        padding: 0.8rem 0;
    }

        .custom-table td:last-child[b-cm0tjr7e5r] {
            border-bottom: none;
            padding-bottom: 0;
        }

        .custom-table td[b-cm0tjr7e5r]::before {
            content: attr(data-label);
            font-weight: 700;
            text-align: left;
            color: var(--palette-primary);
            font-size: 0.75rem;
            text-transform: uppercase;
        }

    .truncate-text[b-cm0tjr7e5r] {
        max-width: 180px;
    }

    .actions-cell[b-cm0tjr7e5r] {
        justify-content: flex-end;
        gap: 0.5rem;
    }
}
/* _content/ImagineTheFuture.BlazorServer/Pages/Admin/ManageDepartments.razor.rz.scp.css */
/*
 * ManageDepartments.razor.css
 * Gestión de Departamentos - Industrial Edition
 */

/* === HEADER === */
.page-header[b-9hdplusfu5] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 2rem;
    padding-bottom: 1rem;
    border-bottom: 1px solid var(--palette-gray-dark);
    flex-wrap: wrap;
    gap: 1rem;
}

    .page-header h1[b-9hdplusfu5] {
        margin: 0;
        font-size: 1.75rem;
        font-family: 'Montserrat', sans-serif;
        font-weight: 700;
        color: var(--palette-white);
        text-transform: uppercase;
        letter-spacing: 0.05em;
    }

.header-actions[b-9hdplusfu5] {
    display: flex;
    gap: 0.8rem;
    align-items: center;
}

/* Botones */
.btn-create-new[b-9hdplusfu5] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.6rem 1.2rem;
    background-color: var(--palette-primary);
    color: var(--palette-white);
    font-family: 'Montserrat', sans-serif;
    font-weight: 700;
    border-radius: 2px;
    border: none;
    cursor: pointer;
    font-size: 0.85rem;
    text-transform: uppercase;
    text-decoration: none;
    box-shadow: 0 4px 10px rgba(0, 163, 224, 0.3);
    transition: all 0.2s ease;
}

    .btn-create-new:hover[b-9hdplusfu5] {
        background-color: #0088BE;
        transform: translateY(-1px);
    }

.btn-refresh[b-9hdplusfu5] {
    color: var(--palette-primary);
    border: 1px solid var(--palette-gray-mid);
    background-color: transparent;
    width: 36px;
    height: 36px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 2px;
    cursor: pointer;
    transition: all 0.2s ease;
}

    .btn-refresh:hover[b-9hdplusfu5] {
        background-color: rgba(0, 163, 224, 0.1);
        border-color: var(--palette-primary);
    }

/* === TABLA INDUSTRIAL === */
.table-responsive-wrapper[b-9hdplusfu5] {
    width: 100%;
    overflow-x: auto;
    scrollbar-width: thin;
    scrollbar-color: var(--palette-gray-dark) transparent;
}

.industrial-table[b-9hdplusfu5] {
    width: 100%;
    border-collapse: collapse;
}

    .industrial-table th[b-9hdplusfu5], .industrial-table td[b-9hdplusfu5] {
        padding: 1rem 1.25rem;
        text-align: left;
        border-bottom: 1px solid var(--palette-gray-dark);
        color: var(--palette-soft-white);
        vertical-align: middle;
    }

    .industrial-table th[b-9hdplusfu5] {
        font-weight: 700;
        color: var(--palette-primary);
        font-size: 0.75rem;
        text-transform: uppercase;
        letter-spacing: 0.05em;
        border-bottom: 2px solid var(--palette-gray-dark);
    }

    .industrial-table tbody tr[b-9hdplusfu5] {
        transition: background-color 0.2s ease;
    }

        .industrial-table tbody tr:hover[b-9hdplusfu5] {
            background-color: rgba(255, 255, 255, 0.03);
        }

/* Badges */
.count-badge[b-9hdplusfu5] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    background-color: var(--palette-gray-darker);
    padding: 0.3rem 0.8rem;
    border-radius: 2px;
    font-size: 0.8rem;
    border: 1px solid var(--palette-gray-mid);
    color: var(--palette-white);
}

    .count-badge i[b-9hdplusfu5] {
        color: var(--palette-primary);
    }

/* Acciones */
.actions-cell[b-9hdplusfu5] {
    text-align: right;
    white-space: nowrap;
}

.actions-header[b-9hdplusfu5] {
    text-align: right;
}

.btn-icon[b-9hdplusfu5] {
    background: transparent;
    border: 1px solid transparent;
    border-radius: 2px;
    width: 32px;
    height: 32px;
    font-size: 0.9rem;
    cursor: pointer;
    transition: all 0.2s ease;
    margin-left: 0.25rem;
    display: inline-flex;
    justify-content: center;
    align-items: center;
}

.btn-edit[b-9hdplusfu5] {
    color: var(--palette-gray-light);
}

    .btn-edit:hover[b-9hdplusfu5] {
        color: var(--palette-primary);
        background-color: rgba(0, 163, 224, 0.1);
    }

.btn-delete[b-9hdplusfu5] {
    color: var(--palette-gray-light);
}

    .btn-delete:hover[b-9hdplusfu5] {
        color: var(--palette-danger);
        background-color: rgba(229, 62, 62, 0.1);
    }

/* Muro de Seguridad */
.admin-security-wall[b-9hdplusfu5] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    min-height: 60vh;
    text-align: center;
    padding: 2rem;
    background: rgba(255, 255, 255, 0.02);
    border-radius: 4px;
    border: 2px dashed var(--palette-gray-dark);
}

.wall-icon-wrapper[b-9hdplusfu5] {
    width: 80px;
    height: 80px;
    background-color: rgba(0, 163, 224, 0.1);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto 1.5rem;
    color: var(--palette-primary);
    font-size: 2rem;
    border: 1px solid var(--palette-primary);
}

.wall-title[b-9hdplusfu5] {
    font-family: 'Montserrat', sans-serif;
    font-weight: 700;
    color: var(--palette-white);
    margin-bottom: 0.5rem;
    text-transform: uppercase;
}

.wall-message[b-9hdplusfu5] {
    color: var(--palette-gray-light);
    margin-bottom: 2rem;
}

.wall-form-wrapper[b-9hdplusfu5] {
    background-color: var(--palette-carbon-deep);
    padding: 1.5rem;
    border-radius: 4px;
    box-shadow: 0 10px 30px rgba(0,0,0,0.5);
    border: 1px solid var(--palette-gray-dark);
}

/* Empty State */
.empty-state-container[b-9hdplusfu5] {
    text-align: center;
    padding: 4rem 1rem;
    border: 2px dashed var(--palette-gray-dark);
    border-radius: 4px;
    background-color: rgba(255,255,255,0.01);
}

.empty-icon[b-9hdplusfu5] {
    font-size: 3rem;
    margin-bottom: 1rem;
    opacity: 0.5;
    color: var(--palette-gray-mid);
}

.empty-text[b-9hdplusfu5] {
    font-family: 'Montserrat', sans-serif;
    color: var(--palette-gray-light);
}

.text-muted[b-9hdplusfu5] {
    color: var(--palette-gray-mid) !important;
}

/* Responsive */
@media (max-width: 768px) {
    .page-header[b-9hdplusfu5] {
        flex-direction: column;
        align-items: flex-start;
        gap: 1rem;
    }

    .header-actions[b-9hdplusfu5] {
        width: 100%;
        justify-content: flex-start;
    }

    .industrial-table thead[b-9hdplusfu5] {
        display: none;
    }

    .industrial-table tr[b-9hdplusfu5] {
        display: block;
        margin-bottom: 1rem;
        border: 1px solid var(--palette-gray-dark);
        border-radius: 4px;
        background-color: var(--palette-carbon-deep);
        padding: 1rem;
    }

    .industrial-table td[b-9hdplusfu5] {
        display: flex;
        justify-content: space-between;
        align-items: center;
        text-align: right;
        padding: 0.75rem 0;
        border-bottom: 1px solid rgba(255,255,255,0.05);
    }

        .industrial-table td:last-child[b-9hdplusfu5] {
            border-bottom: none;
        }

        .industrial-table td[b-9hdplusfu5]::before {
            content: attr(data-label);
            font-weight: 700;
            text-align: left;
            margin-right: 1rem;
            color: var(--palette-primary);
            font-size: 0.75rem;
            text-transform: uppercase;
        }

    .actions-cell[b-9hdplusfu5] {
        justify-content: flex-end;
    }
}

.animate-fade-in[b-9hdplusfu5] {
    animation: fadeIn-b-9hdplusfu5 0.5s ease-out forwards;
}

@keyframes fadeIn-b-9hdplusfu5 {
    from {
        opacity: 0;
        transform: translateY(5px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}
/* _content/ImagineTheFuture.BlazorServer/Pages/Admin/ManageEmployees.razor.rz.scp.css */
/*
 * ManageEmployees.razor.css
 * Gestión de personal - Industrial Edition
 */

/* === HEADER === */
.page-header[b-0eftvzex65] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 2rem;
    padding-bottom: 1rem;
    border-bottom: 1px solid var(--palette-gray-dark);
    flex-wrap: wrap;
    gap: 1rem;
}

    .page-header h1[b-0eftvzex65] {
        margin: 0;
        font-size: 1.75rem;
        font-family: 'Montserrat', sans-serif;
        font-weight: 700;
        color: var(--palette-white);
        text-transform: uppercase;
        letter-spacing: 0.05em;
    }

.text-muted[b-0eftvzex65] {
    color: var(--palette-gray-light);
    opacity: 0.8;
}

.header-actions[b-0eftvzex65] {
    display: flex;
    align-items: center;
    gap: 0.8rem;
}

/* Botón Crear */
.btn-create-new[b-0eftvzex65] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.6rem 1.2rem;
    background-color: var(--palette-primary);
    color: var(--palette-white);
    font-family: 'Montserrat', sans-serif;
    font-weight: 700;
    border-radius: 2px;
    text-decoration: none;
    transition: all 0.2s ease;
    border: none;
    cursor: pointer;
    font-size: 0.85rem;
    text-transform: uppercase;
    box-shadow: 0 4px 10px rgba(0, 163, 224, 0.3);
}

    .btn-create-new:hover[b-0eftvzex65] {
        background-color: #0088BE;
        transform: translateY(-1px);
        box-shadow: 0 6px 15px rgba(0, 163, 224, 0.4);
    }

/* Botón Refrescar */
.btn-refresh[b-0eftvzex65] {
    color: var(--palette-primary);
    border: 1px solid var(--palette-gray-mid);
    background-color: transparent;
    width: 36px;
    height: 36px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 2px;
    cursor: pointer;
    transition: all 0.2s ease;
}

    .btn-refresh:hover[b-0eftvzex65] {
        background-color: rgba(0, 163, 224, 0.1);
        border-color: var(--palette-primary);
    }

/* === TABLA INDUSTRIAL === */
.table-responsive-wrapper[b-0eftvzex65] {
    width: 100%;
    overflow-x: auto;
    scrollbar-width: thin;
    scrollbar-color: var(--palette-gray-dark) transparent;
}

.employees-table[b-0eftvzex65] {
    width: 100%;
    border-collapse: collapse;
}

    .employees-table th[b-0eftvzex65], .employees-table td[b-0eftvzex65] {
        padding: 1rem 1.25rem;
        text-align: left;
        border-bottom: 1px solid var(--palette-gray-dark);
        vertical-align: middle;
        color: var(--palette-soft-white);
    }

    .employees-table th[b-0eftvzex65] {
        font-weight: 700;
        color: var(--palette-primary);
        font-size: 0.75rem;
        text-transform: uppercase;
        letter-spacing: 0.05em;
        border-bottom: 2px solid var(--palette-gray-dark);
        opacity: 1;
    }

    .employees-table tbody tr[b-0eftvzex65] {
        transition: background-color 0.2s ease;
    }

        .employees-table tbody tr:hover[b-0eftvzex65] {
            background-color: rgba(255, 255, 255, 0.03);
        }

/* Celdas Especiales */
.employee-info-cell[b-0eftvzex65] {
    display: flex;
    align-items: center;
    gap: 0.8rem;
}

.mini-avatar-circle[b-0eftvzex65] {
    width: 36px;
    height: 36px;
    border-radius: 50%;
    background-color: var(--palette-gray-darker);
    border: 1px solid var(--palette-gray-mid);
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    color: var(--palette-white);
    font-weight: 700;
    font-size: 0.9rem;
    flex-shrink: 0;
}

    .mini-avatar-circle img[b-0eftvzex65] {
        width: 100%;
        height: 100%;
        object-fit: cover;
    }

.info-text[b-0eftvzex65] {
    display: flex;
    flex-direction: column;
    line-height: 1.2;
}

.text-mono[b-0eftvzex65] {
    font-family: 'Consolas', 'Monaco', monospace;
    font-size: 0.75rem;
    color: var(--palette-gray-light);
    opacity: 0.7;
}

/* Badges */
.badge-role[b-0eftvzex65] {
    display: inline-block;
    padding: 0.2rem 0.6rem;
    border-radius: 2px;
    font-size: 0.75rem;
    font-weight: 700;
    text-transform: uppercase;
    border: 1px solid transparent;
}

    .badge-role.role-staff[b-0eftvzex65] {
        background-color: #2D2D2D;
        color: #A0A0A0;
        border-color: #404040;
    }

    .badge-role.role-leader[b-0eftvzex65] {
        background-color: rgba(0, 163, 224, 0.15);
        color: var(--palette-primary);
        border-color: var(--palette-primary);
    }

    .badge-role.role-coord[b-0eftvzex65] {
        background-color: rgba(147, 51, 234, 0.15);
        color: #C084FC;
        border-color: #C084FC;
    }

.badge-dept[b-0eftvzex65] {
    background-color: rgba(255, 255, 255, 0.1);
    color: var(--palette-soft-white);
    padding: 0.2rem 0.5rem;
    border-radius: 2px;
    font-size: 0.75rem;
    border: 1px solid rgba(255, 255, 255, 0.15);
}

.org-cell[b-0eftvzex65] {
    display: flex;
    flex-direction: column;
    gap: 0.2rem;
    align-items: flex-start;
}

.payroll-text[b-0eftvzex65] {
    font-size: 0.75rem;
    color: var(--palette-gray-mid);
    display: flex;
    align-items: center;
    gap: 0.3rem;
}

.linked-user[b-0eftvzex65] {
    display: flex;
    align-items: center;
    gap: 0.4rem;
    color: var(--palette-primary);
    font-size: 0.85rem;
}

    .linked-user i[b-0eftvzex65] {
        font-size: 0.8rem;
    }

/* Acciones */
.actions-cell[b-0eftvzex65] {
    text-align: right;
    white-space: nowrap;
}

.actions-header[b-0eftvzex65] {
    text-align: right;
}

.btn-icon[b-0eftvzex65] {
    background: transparent;
    border: 1px solid transparent;
    border-radius: 2px;
    width: 32px;
    height: 32px;
    font-size: 0.9rem;
    cursor: pointer;
    transition: all 0.2s ease;
    margin-left: 0.25rem;
    display: inline-flex;
    justify-content: center;
    align-items: center;
}

.btn-edit[b-0eftvzex65] {
    color: var(--palette-gray-light);
}

    .btn-edit:hover[b-0eftvzex65] {
        color: var(--palette-primary);
        background-color: rgba(0, 163, 224, 0.1);
        border-color: var(--palette-primary);
    }

.btn-delete[b-0eftvzex65] {
    color: var(--palette-gray-light);
}

    .btn-delete:hover[b-0eftvzex65] {
        color: var(--palette-danger);
        background-color: rgba(229, 62, 62, 0.1);
        border-color: var(--palette-danger);
    }

/* === RESPONSIVIDAD === */
@media (max-width: 768px) {
    .page-header[b-0eftvzex65] {
        flex-direction: column;
        align-items: flex-start;
        gap: 1rem;
    }

    .header-actions[b-0eftvzex65] {
        width: 100%;
        justify-content: flex-start;
    }

    /* Tabla -> Tarjetas */
    .employees-table thead[b-0eftvzex65] {
        display: none;
    }

    .employees-table tr[b-0eftvzex65] {
        display: block;
        margin-bottom: 1rem;
        border: 1px solid var(--palette-gray-dark);
        border-radius: 4px;
        background-color: var(--palette-carbon-deep);
        padding: 1rem;
    }

    .employees-table td[b-0eftvzex65] {
        display: flex;
        justify-content: space-between;
        align-items: center;
        text-align: right;
        padding: 0.75rem 0;
        border-bottom: 1px solid rgba(255,255,255,0.05);
    }

        .employees-table td:last-child[b-0eftvzex65] {
            border-bottom: none;
        }

        .employees-table td[b-0eftvzex65]::before {
            content: attr(data-label);
            font-weight: 700;
            text-align: left;
            margin-right: 1rem;
            color: var(--palette-primary);
            font-size: 0.75rem;
            text-transform: uppercase;
        }

    .actions-cell[b-0eftvzex65] {
        justify-content: flex-end;
    }
}

/* Utils */
.empty-state-container[b-0eftvzex65] {
    text-align: center;
    padding: 4rem 1rem;
    border: 2px dashed var(--palette-gray-dark);
    border-radius: 4px;
    background-color: rgba(255,255,255,0.01);
}

.empty-icon[b-0eftvzex65] {
    font-size: 3rem;
    margin-bottom: 1rem;
    opacity: 0.5;
    color: var(--palette-gray-mid);
}

.empty-text[b-0eftvzex65] {
    font-family: 'Montserrat', sans-serif;
    color: var(--palette-gray-light);
}

.animate-fade-in[b-0eftvzex65] {
    animation: fadeIn-b-0eftvzex65 0.5s ease-out forwards;
}

@keyframes fadeIn-b-0eftvzex65 {
    from {
        opacity: 0;
        transform: translateY(5px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}
/* _content/ImagineTheFuture.BlazorServer/Pages/Admin/ManageFingerprints.razor.rz.scp.css */
/*
 * ManageFingerprints.razor.css
 * Gestión de Biométricos - Industrial Edition
 */

/* === HEADER === */
.page-header[b-x95vrejgze] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 2rem;
    padding-bottom: 1rem;
    border-bottom: 1px solid var(--palette-gray-dark);
    flex-wrap: wrap;
    gap: 1rem;
}

    .page-header h1[b-x95vrejgze] {
        margin: 0;
        font-size: 1.75rem;
        font-family: 'Montserrat', sans-serif;
        font-weight: 700;
        color: var(--palette-white);
        text-transform: uppercase;
        letter-spacing: 0.05em;
    }

.header-actions[b-x95vrejgze] {
    display: flex;
    gap: 0.8rem;
    align-items: center;
}

/* Botones */
.btn-create-new[b-x95vrejgze] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.6rem 1.2rem;
    background-color: var(--palette-primary);
    color: var(--palette-white);
    font-family: 'Montserrat', sans-serif;
    font-weight: 700;
    border-radius: 2px;
    border: none;
    cursor: pointer;
    font-size: 0.85rem;
    text-transform: uppercase;
    text-decoration: none;
    box-shadow: 0 4px 10px rgba(0, 163, 224, 0.3);
    transition: all 0.2s ease;
}

    .btn-create-new:hover[b-x95vrejgze] {
        background-color: #0088BE;
        transform: translateY(-1px);
    }

.btn-refresh[b-x95vrejgze] {
    color: var(--palette-primary);
    border: 1px solid var(--palette-gray-mid);
    background-color: transparent;
    width: 36px;
    height: 36px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 2px;
    cursor: pointer;
    transition: all 0.2s ease;
}

    .btn-refresh:hover[b-x95vrejgze] {
        background-color: rgba(0, 163, 224, 0.1);
        border-color: var(--palette-primary);
    }

/* === TABLA INDUSTRIAL === */
.table-responsive-wrapper[b-x95vrejgze] {
    width: 100%;
    overflow-x: auto;
    scrollbar-width: thin;
    scrollbar-color: var(--palette-gray-dark) transparent;
}

.industrial-table[b-x95vrejgze] {
    width: 100%;
    border-collapse: collapse;
}

    .industrial-table th[b-x95vrejgze], .industrial-table td[b-x95vrejgze] {
        padding: 1rem 1.25rem;
        text-align: left;
        border-bottom: 1px solid var(--palette-gray-dark);
        color: var(--palette-soft-white);
        vertical-align: middle;
    }

    .industrial-table th[b-x95vrejgze] {
        font-weight: 700;
        color: var(--palette-primary);
        font-size: 0.75rem;
        text-transform: uppercase;
        letter-spacing: 0.05em;
        border-bottom: 2px solid var(--palette-gray-dark);
    }

    .industrial-table tbody tr[b-x95vrejgze] {
        transition: background-color 0.2s ease;
    }

        .industrial-table tbody tr:hover[b-x95vrejgze] {
            background-color: rgba(255, 255, 255, 0.03);
        }

/* Celdas Especiales */
.user-cell[b-x95vrejgze] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

    .user-cell i[b-x95vrejgze] {
        color: var(--palette-gray-light);
    }

.badge-tech[b-x95vrejgze] {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    padding: 0.2rem 0.5rem;
    border-radius: 2px;
    font-size: 0.7rem;
    font-weight: 700;
    text-transform: uppercase;
    border: 1px solid transparent;
}

    .badge-tech.success[b-x95vrejgze] {
        background-color: rgba(38, 176, 80, 0.1);
        color: #26b050;
        border-color: #26b050;
    }

    .badge-tech.warning[b-x95vrejgze] {
        background-color: rgba(255, 193, 7, 0.1);
        color: #ffc107;
        border-color: #ffc107;
    }

/* Acciones */
.actions-cell[b-x95vrejgze] {
    text-align: right;
    white-space: nowrap;
}

.actions-header[b-x95vrejgze] {
    text-align: right;
}

.btn-icon[b-x95vrejgze] {
    background: transparent;
    border: 1px solid transparent;
    border-radius: 2px;
    width: 32px;
    height: 32px;
    font-size: 0.9rem;
    cursor: pointer;
    transition: all 0.2s ease;
    margin-left: 0.25rem;
    display: inline-flex;
    justify-content: center;
    align-items: center;
}

.btn-edit[b-x95vrejgze] {
    color: var(--palette-gray-light);
}

    .btn-edit:hover[b-x95vrejgze] {
        color: var(--palette-primary);
        background-color: rgba(0, 163, 224, 0.1);
    }

.btn-delete[b-x95vrejgze] {
    color: var(--palette-gray-light);
}

    .btn-delete:hover[b-x95vrejgze] {
        color: var(--palette-danger);
        background-color: rgba(229, 62, 62, 0.1);
    }

/* Muro de Seguridad */
.admin-security-wall[b-x95vrejgze] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    min-height: 60vh;
    text-align: center;
    padding: 2rem;
    background: rgba(255, 255, 255, 0.02);
    border-radius: 4px;
    border: 2px dashed var(--palette-gray-dark);
}

.wall-icon-wrapper[b-x95vrejgze] {
    width: 80px;
    height: 80px;
    background-color: rgba(0, 163, 224, 0.1);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto 1.5rem;
    color: var(--palette-primary);
    font-size: 2rem;
    border: 1px solid var(--palette-primary);
}

.wall-title[b-x95vrejgze] {
    font-family: 'Montserrat', sans-serif;
    font-weight: 700;
    color: var(--palette-white);
    margin-bottom: 0.5rem;
    text-transform: uppercase;
}

.wall-message[b-x95vrejgze] {
    color: var(--palette-gray-light);
    margin-bottom: 2rem;
}

.wall-form-wrapper[b-x95vrejgze] {
    background-color: var(--palette-carbon-deep);
    padding: 1.5rem;
    border-radius: 4px;
    box-shadow: 0 10px 30px rgba(0,0,0,0.5);
    border: 1px solid var(--palette-gray-dark);
}

/* Empty State */
.empty-state-container[b-x95vrejgze] {
    text-align: center;
    padding: 4rem 1rem;
    border: 2px dashed var(--palette-gray-dark);
    border-radius: 4px;
    background-color: rgba(255,255,255,0.01);
}

.empty-icon[b-x95vrejgze] {
    font-size: 3rem;
    margin-bottom: 1rem;
    opacity: 0.5;
    color: var(--palette-gray-mid);
}

.empty-text[b-x95vrejgze] {
    font-family: 'Montserrat', sans-serif;
    color: var(--palette-gray-light);
}

.text-muted[b-x95vrejgze] {
    color: var(--palette-gray-mid) !important;
}

/* Responsive */
@media (max-width: 768px) {
    .page-header[b-x95vrejgze] {
        flex-direction: column;
        align-items: flex-start;
        gap: 1rem;
    }

    .header-actions[b-x95vrejgze] {
        width: 100%;
        justify-content: flex-start;
    }

    .industrial-table thead[b-x95vrejgze] {
        display: none;
    }

    .industrial-table tr[b-x95vrejgze] {
        display: block;
        margin-bottom: 1rem;
        border: 1px solid var(--palette-gray-dark);
        border-radius: 4px;
        background-color: var(--palette-carbon-deep);
        padding: 1rem;
    }

    .industrial-table td[b-x95vrejgze] {
        display: flex;
        justify-content: space-between;
        align-items: center;
        text-align: right;
        padding: 0.75rem 0;
        border-bottom: 1px solid rgba(255,255,255,0.05);
    }

        .industrial-table td:last-child[b-x95vrejgze] {
            border-bottom: none;
        }

        .industrial-table td[b-x95vrejgze]::before {
            content: attr(data-label);
            font-weight: 700;
            text-align: left;
            margin-right: 1rem;
            color: var(--palette-primary);
            font-size: 0.75rem;
            text-transform: uppercase;
        }

    .actions-cell[b-x95vrejgze] {
        justify-content: flex-end;
    }
}

.animate-fade-in[b-x95vrejgze] {
    animation: fadeIn-b-x95vrejgze 0.5s ease-out forwards;
}

@keyframes fadeIn-b-x95vrejgze {
    from {
        opacity: 0;
        transform: translateY(5px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}
/* _content/ImagineTheFuture.BlazorServer/Pages/Admin/ManagePortfolio.razor.rz.scp.css */
/*
 * ManagePortfolio.razor.css
 * Estilos para la gestión de secciones con soporte para Drag & Drop - Industrial Edition
*/

.page-header[b-z0nlnunit6] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 2rem;
    padding-bottom: 1rem;
    border-bottom: 1px solid var(--palette-gray-dark);
}

.header-titles h1[b-z0nlnunit6] {
    margin: 0;
    font-size: 1.75rem;
    color: var(--palette-white);
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

.text-muted[b-z0nlnunit6] {
    color: var(--palette-gray-light);
    opacity: 0.8;
}

/* Botón Crear (Técnico) */
.btn-create-new[b-z0nlnunit6] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.7rem 1.5rem;
    background-color: var(--palette-primary);
    color: var(--palette-white); /* Texto blanco para contraste con azul */
    font-weight: 700;
    font-family: 'Montserrat', sans-serif;
    border-radius: 2px; /* Borde cuadrado */
    border: none;
    cursor: pointer;
    text-transform: uppercase;
    font-size: 0.85rem;
    transition: transform 0.2s ease, box-shadow 0.2s ease;
    box-shadow: 0 4px 10px rgba(0, 163, 224, 0.3);
}

    .btn-create-new:hover:not(:disabled)[b-z0nlnunit6] {
        transform: translateY(-1px);
        background-color: #0088BE; /* Azul más oscuro */
        box-shadow: 0 6px 15px rgba(0, 163, 224, 0.4);
    }

    .btn-create-new:disabled[b-z0nlnunit6] {
        opacity: 0.5;
        cursor: not-allowed;
    }

/* === ESTILOS DE LA TABLA Y DRAG & DROP === */
.portfolio-table[b-z0nlnunit6] {
    width: 100%;
    border-collapse: separate;
    border-spacing: 0;
}

    .portfolio-table th[b-z0nlnunit6] {
        padding: 1rem 1.25rem;
        font-weight: 700;
        color: var(--palette-primary); /* Encabezados azules */
        font-size: 0.75rem;
        text-transform: uppercase;
        letter-spacing: 0.05em;
        border-bottom: 2px solid var(--palette-gray-dark);
        text-align: left;
    }

    .portfolio-table td[b-z0nlnunit6] {
        padding: 1rem 1.25rem;
        border-bottom: 1px solid var(--palette-gray-dark);
        vertical-align: middle;
        transition: background-color 0.2s ease;
        color: var(--palette-soft-white);
    }

/* Asa de Arrastre */
.handle-column[b-z0nlnunit6] {
    width: 40px;
}

.handle-cell[b-z0nlnunit6] {
    padding-right: 0 !important;
}

.drag-handle[b-z0nlnunit6] {
    color: var(--palette-gray-mid);
    cursor: grab;
    padding: 0.5rem;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: color 0.2s ease;
}

    .drag-handle:hover[b-z0nlnunit6] {
        color: var(--palette-primary);
    }

    .drag-handle:active[b-z0nlnunit6] {
        cursor: grabbing;
    }

/* Clases de SortableJS */
#sections-table-body tr.sortable-ghost[b-z0nlnunit6] {
    opacity: 0.4;
    background-color: var(--palette-primary) !important;
}

#sections-table-body tr.sortable-chosen[b-z0nlnunit6] {
    background-color: rgba(0, 163, 224, 0.15) !important; /* Azul sutil */
    box-shadow: 0 4px 15px rgba(0,0,0,0.5);
}

/* Sello de Silencio visual */
tr.is-silenced[b-z0nlnunit6] {
    opacity: 0.6;
    pointer-events: none;
}

/* === COMPONENTES DE FILA === */
.order-badge[b-z0nlnunit6] {
    display: inline-block;
    background-color: var(--palette-gray-darker);
    color: var(--palette-primary);
    border: 1px solid var(--palette-primary);
    padding: 0.2rem 0.6rem;
    border-radius: 2px;
    font-weight: 700;
    font-size: 0.85rem;
}

.system-name[b-z0nlnunit6] {
    background-color: var(--palette-gray-darker);
    color: var(--palette-gray-light);
    padding: 0.2rem 0.4rem;
    border-radius: 2px;
    font-family: 'Montserrat', monospace; /* O una fuente mono real si tienes */
    font-size: 0.8rem;
    border: 1px solid var(--palette-gray-dark);
}

.status-pill[b-z0nlnunit6] {
    padding: 0.25rem 0.75rem;
    border-radius: 2px;
    font-size: 0.7rem;
    font-weight: 700;
    text-transform: uppercase;
    border: 1px solid transparent;
}

    .status-pill.active[b-z0nlnunit6] {
        background-color: rgba(38, 176, 80, 0.1);
        color: #26b050;
        border-color: #26b050;
    }

    .status-pill.inactive[b-z0nlnunit6] {
        background-color: rgba(229, 62, 62, 0.1);
        color: var(--palette-danger);
        border-color: var(--palette-danger);
    }

.image-count[b-z0nlnunit6] {
    color: var(--palette-gray-light);
    font-size: 0.9rem;
}

    .image-count i[b-z0nlnunit6] {
        margin-right: 5px;
    }

/* === ACCIONES === */
.actions-cell[b-z0nlnunit6] {
    text-align: right;
}

.actions-header[b-z0nlnunit6] {
    text-align: right;
}

.btn-icon[b-z0nlnunit6] {
    background: transparent;
    border: 1px solid transparent;
    border-radius: 2px;
    width: 32px;
    height: 32px;
    cursor: pointer;
    transition: all 0.2s ease;
    color: var(--palette-gray-light);
    margin-left: 0.2rem;
}

.btn-edit:hover[b-z0nlnunit6] {
    color: var(--palette-primary);
    background-color: rgba(0, 163, 224, 0.1);
    border-color: var(--palette-primary);
}

.btn-delete:hover[b-z0nlnunit6] {
    color: var(--palette-danger);
    background-color: rgba(229, 62, 62, 0.1);
    border-color: var(--palette-danger);
}

/* === LOADING & EMPTY STATE (CORREGIDO) === */

.loading-container[b-z0nlnunit6] {
    padding: 4rem;
    text-align: center;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}

/* AQUÍ ESTABA EL PROBLEMA: Agregamos Flex y alineación explícita */
.empty-state-container[b-z0nlnunit6] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 5rem 2rem;
    background-color: rgba(255, 255, 255, 0.02); /* Fondo sutil */
    border: 2px dashed var(--palette-gray-dark); /* Borde técnico */
    border-radius: 4px;
    margin-top: 2rem;
    text-align: center;
    width: 100%; /* Asegura que ocupe el ancho disponible */
}

    /* Estilo para el icono dentro del empty state */
    .empty-state-container i[b-z0nlnunit6] {
        font-size: 3.5rem;
        color: var(--palette-gray-mid);
        margin-bottom: 1.5rem;
        opacity: 0.6;
    }

/* Estilo para el texto */
.empty-text[b-z0nlnunit6] {
    font-family: 'Montserrat', sans-serif;
    font-size: 1.1rem;
    color: var(--palette-gray-light);
    margin: 0;
    max-width: 400px;
    line-height: 1.5;
}

/* Spinner Industrial */
.energy-loader[b-z0nlnunit6] {
    width: 3rem;
    height: 3rem;
    border: 3px solid rgba(255,255,255,0.1);
    border-top-color: var(--palette-primary);
    border-radius: 50%;
    animation: spin-b-z0nlnunit6 1s linear infinite;
    margin-bottom: 1rem;
}

.loading-text[b-z0nlnunit6] {
    color: var(--palette-primary);
    font-family: 'Montserrat', sans-serif;
    font-size: 0.9rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

@keyframes spin-b-z0nlnunit6 {
    to {
        transform: rotate(360deg);
    }
}

/* === RESPONSIVIDAD === */
@media (max-width: 992px) {
    /* Desactivamos el drag handle en móvil para evitar conflictos con el scroll touch */
    .drag-handle[b-z0nlnunit6], .handle-column[b-z0nlnunit6] {
        display: none;
    }

    .portfolio-table thead[b-z0nlnunit6] {
        display: none;
    }

    /* Fila -> Tarjeta */
    .portfolio-table tr[b-z0nlnunit6] {
        display: block;
        margin-bottom: 1.5rem;
        border: 1px solid var(--palette-gray-dark);
        border-radius: 4px;
        background-color: var(--palette-carbon-deep);
        padding: 1rem;
    }

    .portfolio-table td[b-z0nlnunit6] {
        display: flex;
        justify-content: space-between;
        align-items: center;
        text-align: right;
        padding: 0.75rem 0;
        border-bottom: 1px solid rgba(255,255,255,0.05);
    }

        .portfolio-table td:last-child[b-z0nlnunit6] {
            border-bottom: none;
        }

        .portfolio-table td[b-z0nlnunit6]:before {
            content: attr(data-label);
            font-weight: 700;
            color: var(--palette-primary);
            font-size: 0.75rem;
            text-transform: uppercase;
        }
}
/* _content/ImagineTheFuture.BlazorServer/Pages/Admin/ManageScheduleTemplates.razor.rz.scp.css */
/* Estilos Industriales (Reutilizando variables globales) */
.page-header[b-h3vk7dit6t] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 2rem;
    padding-bottom: 1rem;
    border-bottom: 1px solid var(--palette-gray-dark);
    flex-wrap: wrap;
    gap: 1rem;
}

    .page-header h1[b-h3vk7dit6t] {
        margin: 0;
        font-size: 1.75rem;
        font-family: 'Montserrat', sans-serif;
        font-weight: 700;
        color: var(--palette-white);
        text-transform: uppercase;
        letter-spacing: 0.05em;
    }

.header-actions[b-h3vk7dit6t] {
    display: flex;
    gap: 0.8rem;
    align-items: center;
}

.btn-create-new[b-h3vk7dit6t] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.6rem 1.2rem;
    background-color: var(--palette-primary);
    color: var(--palette-white);
    font-family: 'Montserrat', sans-serif;
    font-weight: 700;
    border-radius: 2px;
    border: none;
    cursor: pointer;
    text-transform: uppercase;
    transition: all 0.2s ease;
}

    .btn-create-new:hover[b-h3vk7dit6t] {
        background-color: #0088BE;
        transform: translateY(-1px);
    }

.btn-refresh[b-h3vk7dit6t] {
    color: var(--palette-primary);
    border: 1px solid var(--palette-gray-mid);
    background: transparent;
    width: 36px;
    height: 36px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 2px;
    cursor: pointer;
    transition: all 0.2s ease;
}

    .btn-refresh:hover[b-h3vk7dit6t] {
        background-color: rgba(0, 163, 224, 0.1);
        border-color: var(--palette-primary);
    }

.industrial-table[b-h3vk7dit6t] {
    width: 100%;
    border-collapse: collapse;
}

    .industrial-table th[b-h3vk7dit6t], .industrial-table td[b-h3vk7dit6t] {
        padding: 1rem 1.25rem;
        text-align: left;
        border-bottom: 1px solid var(--palette-gray-dark);
        color: var(--palette-soft-white);
    }

    .industrial-table th[b-h3vk7dit6t] {
        font-weight: 700;
        color: var(--palette-primary);
        text-transform: uppercase;
        font-size: 0.75rem;
        border-bottom: 2px solid var(--palette-gray-dark);
    }

    .industrial-table tbody tr[b-h3vk7dit6t] {
        transition: background 0.2s;
    }

        .industrial-table tbody tr:hover[b-h3vk7dit6t] {
            background-color: rgba(255, 255, 255, 0.03);
        }

.badge-tech[b-h3vk7dit6t] {
    background-color: var(--palette-gray-darker);
    color: var(--palette-soft-white);
    padding: 0.2rem 0.5rem;
    border-radius: 2px;
    font-size: 0.75rem;
    border: 1px solid var(--palette-gray-mid);
    font-weight: 700;
}

.actions-cell[b-h3vk7dit6t] {
    text-align: right;
}

.btn-icon[b-h3vk7dit6t] {
    background: transparent;
    border: 1px solid transparent;
    width: 32px;
    height: 32px;
    cursor: pointer;
    color: var(--palette-gray-light);
    transition: all 0.2s;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.btn-edit:hover[b-h3vk7dit6t] {
    color: var(--palette-primary);
    background: rgba(0, 163, 224, 0.1);
}

.btn-delete:hover[b-h3vk7dit6t] {
    color: var(--palette-danger);
    background: rgba(229, 62, 62, 0.1);
}

.empty-state-container[b-h3vk7dit6t] {
    text-align: center;
    padding: 4rem;
    border: 2px dashed var(--palette-gray-dark);
    border-radius: 4px;
    background: rgba(255,255,255,0.01);
}

.empty-icon[b-h3vk7dit6t] {
    font-size: 3rem;
    margin-bottom: 1rem;
    opacity: 0.5;
    color: var(--palette-gray-mid);
}

.text-muted[b-h3vk7dit6t] {
    color: var(--palette-gray-mid);
}

@media (max-width: 768px) {
    .industrial-table thead[b-h3vk7dit6t] {
        display: none;
    }

    .industrial-table tr[b-h3vk7dit6t] {
        display: block;
        margin-bottom: 1rem;
        border: 1px solid var(--palette-gray-dark);
        padding: 1rem;
        background: var(--palette-carbon-deep);
    }

    .industrial-table td[b-h3vk7dit6t] {
        display: flex;
        justify-content: space-between;
        padding: 0.75rem 0;
        border-bottom: 1px solid rgba(255,255,255,0.05);
    }

        .industrial-table td[b-h3vk7dit6t]::before {
            content: attr(data-label);
            font-weight: 700;
            color: var(--palette-primary);
            font-size: 0.75rem;
        }
}
/* _content/ImagineTheFuture.BlazorServer/Pages/Admin/ManageTeams.razor.rz.scp.css */
/*
 * ManageTeams.razor.css
 * Gestión de Equipos - Industrial Edition
 */

/* === HEADER === */
.page-header[b-ozlup5uaz7] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 2rem;
    padding-bottom: 1rem;
    border-bottom: 1px solid var(--palette-gray-dark);
    flex-wrap: wrap;
    gap: 1rem;
}

    .page-header h1[b-ozlup5uaz7] {
        margin: 0;
        font-size: 1.75rem;
        font-family: 'Montserrat', sans-serif;
        font-weight: 700;
        color: var(--palette-white);
        text-transform: uppercase;
        letter-spacing: 0.05em;
    }

.header-actions[b-ozlup5uaz7] {
    display: flex;
    gap: 0.8rem;
    align-items: center;
}

/* Botones */
.btn-create-new[b-ozlup5uaz7] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.6rem 1.2rem;
    background-color: var(--palette-primary);
    color: var(--palette-white);
    font-family: 'Montserrat', sans-serif;
    font-weight: 700;
    border-radius: 2px;
    border: none;
    cursor: pointer;
    font-size: 0.85rem;
    text-transform: uppercase;
    text-decoration: none;
    box-shadow: 0 4px 10px rgba(0, 163, 224, 0.3);
    transition: all 0.2s ease;
}

    .btn-create-new:hover[b-ozlup5uaz7] {
        background-color: #0088BE;
        transform: translateY(-1px);
    }

.btn-refresh[b-ozlup5uaz7] {
    color: var(--palette-primary);
    border: 1px solid var(--palette-gray-mid);
    background-color: transparent;
    width: 36px;
    height: 36px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 2px;
    cursor: pointer;
    transition: all 0.2s ease;
}

    .btn-refresh:hover[b-ozlup5uaz7] {
        background-color: rgba(0, 163, 224, 0.1);
        border-color: var(--palette-primary);
    }

/* === TABLA INDUSTRIAL === */
.table-responsive-wrapper[b-ozlup5uaz7] {
    width: 100%;
    overflow-x: auto;
    scrollbar-width: thin;
    scrollbar-color: var(--palette-gray-dark) transparent;
}

.industrial-table[b-ozlup5uaz7] {
    width: 100%;
    border-collapse: collapse;
}

    .industrial-table th[b-ozlup5uaz7], .industrial-table td[b-ozlup5uaz7] {
        padding: 1rem 1.25rem;
        text-align: left;
        border-bottom: 1px solid var(--palette-gray-dark);
        color: var(--palette-soft-white);
        vertical-align: middle;
    }

    .industrial-table th[b-ozlup5uaz7] {
        font-weight: 700;
        color: var(--palette-primary);
        font-size: 0.75rem;
        text-transform: uppercase;
        letter-spacing: 0.05em;
        border-bottom: 2px solid var(--palette-gray-dark);
    }

    .industrial-table tbody tr[b-ozlup5uaz7] {
        transition: background-color 0.2s ease;
    }

        .industrial-table tbody tr:hover[b-ozlup5uaz7] {
            background-color: rgba(255, 255, 255, 0.03);
        }

/* Badges */
.count-badge[b-ozlup5uaz7] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    background-color: var(--palette-gray-darker);
    padding: 0.3rem 0.8rem;
    border-radius: 2px;
    font-size: 0.8rem;
    border: 1px solid var(--palette-gray-mid);
    color: var(--palette-white);
}

    .count-badge i[b-ozlup5uaz7] {
        color: var(--palette-primary);
    }

.user-cell[b-ozlup5uaz7] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-size: 0.9rem;
}

    .user-cell i[b-ozlup5uaz7] {
        color: var(--palette-gray-light);
    }

/* Acciones */
.actions-cell[b-ozlup5uaz7] {
    text-align: right;
    white-space: nowrap;
}

.actions-header[b-ozlup5uaz7] {
    text-align: right;
}

.btn-icon[b-ozlup5uaz7] {
    background: transparent;
    border: 1px solid transparent;
    border-radius: 2px;
    width: 32px;
    height: 32px;
    font-size: 0.9rem;
    cursor: pointer;
    transition: all 0.2s ease;
    margin-left: 0.25rem;
    display: inline-flex;
    justify-content: center;
    align-items: center;
}

.btn-edit[b-ozlup5uaz7] {
    color: var(--palette-gray-light);
}

    .btn-edit:hover[b-ozlup5uaz7] {
        color: var(--palette-primary);
        background-color: rgba(0, 163, 224, 0.1);
    }

.btn-delete[b-ozlup5uaz7] {
    color: var(--palette-gray-light);
}

    .btn-delete:hover[b-ozlup5uaz7] {
        color: var(--palette-danger);
        background-color: rgba(229, 62, 62, 0.1);
    }

/* Muro */
.admin-security-wall[b-ozlup5uaz7] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    min-height: 60vh;
    text-align: center;
    padding: 2rem;
    background: rgba(255, 255, 255, 0.02);
    border-radius: 4px;
    border: 2px dashed var(--palette-gray-dark);
}

.wall-icon-wrapper[b-ozlup5uaz7] {
    width: 80px;
    height: 80px;
    background-color: rgba(0, 163, 224, 0.1);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto 1.5rem;
    color: var(--palette-primary);
    font-size: 2rem;
    border: 1px solid var(--palette-primary);
}

.wall-title[b-ozlup5uaz7] {
    font-family: 'Montserrat', sans-serif;
    font-weight: 700;
    color: var(--palette-white);
    margin-bottom: 0.5rem;
    text-transform: uppercase;
}

.wall-message[b-ozlup5uaz7] {
    color: var(--palette-gray-light);
    margin-bottom: 2rem;
}

.wall-form-wrapper[b-ozlup5uaz7] {
    background-color: var(--palette-carbon-deep);
    padding: 1.5rem;
    border-radius: 4px;
    box-shadow: 0 10px 30px rgba(0,0,0,0.5);
    border: 1px solid var(--palette-gray-dark);
}

/* Empty State */
.empty-state-container[b-ozlup5uaz7] {
    text-align: center;
    padding: 4rem 1rem;
    border: 2px dashed var(--palette-gray-dark);
    border-radius: 4px;
    background-color: rgba(255,255,255,0.01);
}

.empty-icon[b-ozlup5uaz7] {
    font-size: 3rem;
    margin-bottom: 1rem;
    opacity: 0.5;
    color: var(--palette-gray-mid);
}

.empty-text[b-ozlup5uaz7] {
    font-family: 'Montserrat', sans-serif;
    color: var(--palette-gray-light);
}

.text-muted[b-ozlup5uaz7] {
    color: var(--palette-gray-mid) !important;
}

/* Responsive */
@media (max-width: 768px) {
    .page-header[b-ozlup5uaz7] {
        flex-direction: column;
        align-items: flex-start;
        gap: 1rem;
    }

    .header-actions[b-ozlup5uaz7] {
        width: 100%;
        justify-content: flex-start;
    }

    .industrial-table thead[b-ozlup5uaz7] {
        display: none;
    }

    .industrial-table tr[b-ozlup5uaz7] {
        display: block;
        margin-bottom: 1rem;
        border: 1px solid var(--palette-gray-dark);
        border-radius: 4px;
        background-color: var(--palette-carbon-deep);
        padding: 1rem;
    }

    .industrial-table td[b-ozlup5uaz7] {
        display: flex;
        justify-content: space-between;
        align-items: center;
        text-align: right;
        padding: 0.75rem 0;
        border-bottom: 1px solid rgba(255,255,255,0.05);
    }

        .industrial-table td:last-child[b-ozlup5uaz7] {
            border-bottom: none;
        }

        .industrial-table td[b-ozlup5uaz7]::before {
            content: attr(data-label);
            font-weight: 700;
            text-align: left;
            margin-right: 1rem;
            color: var(--palette-primary);
            font-size: 0.75rem;
            text-transform: uppercase;
        }

    .actions-cell[b-ozlup5uaz7] {
        justify-content: flex-end;
    }
}

.animate-fade-in[b-ozlup5uaz7] {
    animation: fadeIn-b-ozlup5uaz7 0.4s ease-out forwards;
}

@keyframes fadeIn-b-ozlup5uaz7 {
    from {
        opacity: 0;
        transform: translateY(10px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}
/* _content/ImagineTheFuture.BlazorServer/Pages/Admin/ManageUsers.razor.rz.scp.css */
/*
 * ManageUsers.razor.css
 * Estilos para la gestión de usuarios - Industrial Edition
 */

/* === HEADER Y CONTROLES === */
.page-header[b-4lb4odo1et] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 2rem;
    padding-bottom: 1rem;
    border-bottom: 1px solid var(--palette-gray-dark);
    flex-wrap: wrap;
    gap: 1rem;
}

    .page-header h1[b-4lb4odo1et] {
        margin: 0;
        font-size: 1.75rem;
        font-family: 'Montserrat', sans-serif;
        font-weight: 700;
        color: var(--palette-white);
        text-transform: uppercase;
        letter-spacing: 0.05em;
    }

.header-actions[b-4lb4odo1et] {
    display: flex;
    align-items: center;
    gap: 0.8rem;
}

/* Botón Crear Nuevo (Industrial) */
.btn-create-new[b-4lb4odo1et] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.6rem 1.2rem;
    background-color: var(--palette-primary);
    color: var(--palette-white);
    font-family: 'Montserrat', sans-serif;
    font-weight: 700;
    text-transform: uppercase;
    font-size: 0.85rem;
    border-radius: 2px; /* Cuadrado */
    text-decoration: none;
    transition: all 0.2s ease;
    border: none;
    cursor: pointer;
    box-shadow: 0 4px 10px rgba(0, 163, 224, 0.3);
}

    .btn-create-new:hover[b-4lb4odo1et] {
        background-color: #0088BE;
        transform: translateY(-1px);
        box-shadow: 0 6px 15px rgba(0, 163, 224, 0.4);
    }

/* Botón Refrescar */
.btn-refresh[b-4lb4odo1et] {
    color: var(--palette-primary);
    border: 1px solid var(--palette-gray-mid);
    background-color: transparent;
    border-radius: 2px;
    width: 36px;
    height: 36px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: all 0.2s ease;
}

    .btn-refresh:hover[b-4lb4odo1et] {
        background-color: rgba(0, 163, 224, 0.1);
        border-color: var(--palette-primary);
    }

/* === MURO DE SEGURIDAD (ADMIN AUTH WALL) === */
.admin-security-wall[b-4lb4odo1et] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    min-height: 60vh;
    text-align: center;
    padding: 2rem;
    background: rgba(255, 255, 255, 0.02);
    border-radius: 4px;
    border: 2px dashed var(--palette-gray-dark);
}

.wall-content[b-4lb4odo1et] {
    max-width: 500px;
    width: 100%;
}

.wall-icon-wrapper[b-4lb4odo1et] {
    width: 80px;
    height: 80px;
    background-color: rgba(0, 163, 224, 0.1);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto 1.5rem;
    color: var(--palette-primary);
    font-size: 2rem;
    border: 1px solid var(--palette-primary);
}

.wall-title[b-4lb4odo1et] {
    font-family: 'Montserrat', sans-serif;
    font-weight: 700;
    color: var(--palette-white);
    margin-bottom: 0.5rem;
    text-transform: uppercase;
}

.wall-message[b-4lb4odo1et] {
    color: var(--palette-gray-light);
    margin-bottom: 2rem;
    line-height: 1.5;
}

.wall-form-wrapper[b-4lb4odo1et] {
    background-color: var(--palette-carbon-deep);
    padding: 1.5rem;
    border-radius: 4px;
    box-shadow: 0 10px 30px rgba(0,0,0,0.5);
    border: 1px solid var(--palette-gray-dark);
}

/* === ESTILOS DE LA TABLA (DESKTOP) === */
.table-responsive-wrapper[b-4lb4odo1et] {
    width: 100%;
    overflow-x: auto;
}

.users-table[b-4lb4odo1et] {
    width: 100%;
    border-collapse: collapse;
}

    .users-table th[b-4lb4odo1et], .users-table td[b-4lb4odo1et] {
        padding: 1rem 1.25rem;
        text-align: left;
        border-bottom: 1px solid var(--palette-gray-dark);
        vertical-align: middle;
        color: var(--palette-soft-white);
    }

    .users-table th[b-4lb4odo1et] {
        font-weight: 700;
        color: var(--palette-primary);
        font-size: 0.75rem;
        text-transform: uppercase;
        letter-spacing: 0.05em;
        border-bottom: 2px solid var(--palette-gray-dark);
    }

    .users-table tbody tr[b-4lb4odo1et] {
        transition: background-color 0.2s ease;
    }

        .users-table tbody tr:hover[b-4lb4odo1et] {
            background-color: rgba(255, 255, 255, 0.03);
        }

/* === ESTADOS DE FILA Y BADGES === */

.row-locked[b-4lb4odo1et] {
    background-color: rgba(229, 62, 62, 0.05);
    opacity: 0.8;
}

    .row-locked:hover[b-4lb4odo1et] {
        background-color: rgba(229, 62, 62, 0.1) !important;
        opacity: 1;
    }

.badge-danger[b-4lb4odo1et] {
    background-color: rgba(229, 62, 62, 0.2);
    color: #ff6b6b;
    padding: 2px 6px;
    border-radius: 2px;
    font-size: 0.65rem;
    font-weight: 700;
    vertical-align: middle;
    border: 1px solid #ff6b6b;
}

.text-danger[b-4lb4odo1et] {
    color: var(--palette-danger);
    font-weight: 600;
    font-size: 0.9rem;
}

.text-success[b-4lb4odo1et] {
    color: #26b050;
    font-weight: 600;
    font-size: 0.9rem;
}

.confirmed-note[b-4lb4odo1et] {
    display: flex;
    align-items: center;
    gap: 0.4rem;
    font-size: 0.9rem;
    color: var(--palette-gray-light);
}

.unconfirmed-note[b-4lb4odo1et] {
    display: flex;
    align-items: center;
    gap: 0.4rem;
    font-size: 0.9rem;
    color: var(--palette-danger);
    font-style: italic;
}

/* === ACCIONES Y BOTONES DE TABLA === */
.actions-cell[b-4lb4odo1et] {
    text-align: right;
    white-space: nowrap;
}

.actions-header[b-4lb4odo1et] {
    text-align: right;
}

.btn-icon[b-4lb4odo1et] {
    background: transparent;
    border: 1px solid transparent;
    border-radius: 2px;
    width: 32px;
    height: 32px;
    font-size: 0.9rem;
    cursor: pointer;
    transition: all .2s ease;
    margin-left: .25rem;
    display: inline-flex;
    justify-content: center;
    align-items: center;
}

.btn-edit[b-4lb4odo1et] {
    color: var(--palette-gray-light);
}

    .btn-edit:hover[b-4lb4odo1et] {
        color: var(--palette-primary);
        background-color: rgba(0, 163, 224, 0.1);
        border-color: var(--palette-primary);
    }

.btn-delete[b-4lb4odo1et] {
    color: var(--palette-gray-light);
}

    .btn-delete:hover[b-4lb4odo1et] {
        color: var(--palette-danger);
        background-color: rgba(229, 62, 62, 0.1);
        border-color: var(--palette-danger);
    }

.btn-restore[b-4lb4odo1et] {
    color: var(--palette-gray-light);
}

    .btn-restore:hover[b-4lb4odo1et] {
        color: #26b050;
        background-color: rgba(38, 176, 80, 0.1);
        border-color: #26b050;
    }

.btn-disabled[b-4lb4odo1et] {
    color: var(--palette-gray-mid);
    cursor: not-allowed;
    opacity: 0.5;
}

    .btn-disabled:hover[b-4lb4odo1et] {
        background-color: transparent;
        color: var(--palette-gray-mid);
    }


/* === RESPONSIVIDAD (MODO TARJETAS) === */
@media (max-width: 768px) {
    .page-header[b-4lb4odo1et] {
        flex-direction: column;
        align-items: flex-start;
    }

    .header-actions[b-4lb4odo1et] {
        width: 100%;
        justify-content: space-between;
        margin-top: 1rem;
    }

    .users-table thead[b-4lb4odo1et] {
        display: none;
    }

    .users-table tr[b-4lb4odo1et] {
        display: block;
        margin-bottom: 1rem;
        border: 1px solid var(--palette-gray-dark);
        border-radius: 4px;
        overflow: hidden;
        background-color: var(--palette-carbon-deep);
        padding: 1rem;
    }

        .users-table tr.row-locked[b-4lb4odo1et] {
            border-color: rgba(229, 62, 62, 0.3);
        }

    .users-table td[b-4lb4odo1et] {
        display: flex;
        justify-content: space-between;
        align-items: center;
        text-align: right;
        padding: .75rem 0;
        border-bottom: 1px solid rgba(255,255,255,0.05);
    }

    .users-table tr:last-child[b-4lb4odo1et] {
        margin-bottom: 0;
    }

    .users-table td:last-child[b-4lb4odo1et] {
        border-bottom: none;
        padding-top: 1rem;
        padding-bottom: 0;
    }

    .users-table td[b-4lb4odo1et]:before {
        content: attr(data-label);
        font-weight: 700;
        text-align: left;
        margin-right: 1rem;
        color: var(--palette-primary);
        font-size: 0.75rem;
        text-transform: uppercase;
        opacity: 0.9;
    }

    .actions-cell[b-4lb4odo1et] {
        justify-content: flex-end;
    }

        .actions-cell[b-4lb4odo1et]:before {
            content: "Acciones";
        }
}

.loading-text[b-4lb4odo1et], .empty-text[b-4lb4odo1et] {
    text-align: center;
    color: var(--palette-gray-light);
    margin-top: 2rem;
    font-style: italic;
    font-family: 'Montserrat', sans-serif;
}

.animate-fade-in[b-4lb4odo1et] {
    animation: fadeIn-b-4lb4odo1et 0.5s ease-out forwards;
}

@keyframes fadeIn-b-4lb4odo1et {
    from {
        opacity: 0;
        transform: translateY(5px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}
/* _content/ImagineTheFuture.BlazorServer/Pages/Admin/ManageWatches.razor.rz.scp.css */
/*
 * ManageWatches.razor.css
 * Estilos para la gestión de visores (Watches) - Industrial Edition
*/

/* === HEADER Y CONTROLES === */
.page-header[b-58g8rlitxg] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 2rem;
    padding-bottom: 1rem;
    border-bottom: 1px solid var(--palette-gray-dark);
    flex-wrap: wrap;
    gap: 1rem;
}

    .page-header h1[b-58g8rlitxg] {
        margin: 0;
        font-size: 1.75rem;
        font-family: 'Montserrat', sans-serif;
        font-weight: 700;
        color: var(--palette-white);
        text-transform: uppercase;
        letter-spacing: 0.05em;
    }

.header-actions[b-58g8rlitxg] {
    display: flex;
    align-items: center;
    gap: 0.8rem;
}

/* Botón Crear Nuevo (Sólido Industrial) */
.btn-create-new[b-58g8rlitxg] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.6rem 1.2rem;
    background-color: var(--palette-primary);
    color: var(--palette-white);
    font-family: 'Montserrat', sans-serif;
    font-weight: 700;
    border-radius: 2px; /* Cuadrado */
    text-decoration: none;
    transition: all 0.2s ease;
    border: none;
    cursor: pointer;
    font-size: 0.85rem;
    text-transform: uppercase;
    box-shadow: 0 4px 10px rgba(0, 163, 224, 0.3);
}

    .btn-create-new:hover[b-58g8rlitxg] {
        background-color: #0088BE; /* Azul oscuro */
        transform: translateY(-1px);
        box-shadow: 0 6px 15px rgba(0, 163, 224, 0.4);
    }

/* Botón Refrescar */
.btn-refresh[b-58g8rlitxg] {
    color: var(--palette-primary);
    border: 1px solid var(--palette-gray-mid);
    background-color: transparent;
    width: 36px;
    height: 36px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 2px;
    cursor: pointer;
    transition: all 0.2s ease;
}

    .btn-refresh:hover[b-58g8rlitxg] {
        background-color: rgba(0, 163, 224, 0.1);
        border-color: var(--palette-primary);
    }

/* === MURO DE SEGURIDAD (ADMIN AUTH WALL) === */
.admin-security-wall[b-58g8rlitxg] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    min-height: 60vh;
    text-align: center;
    padding: 2rem;
    background: rgba(255, 255, 255, 0.02);
    border-radius: 4px;
    border: 2px dashed var(--palette-gray-dark);
}

.wall-content[b-58g8rlitxg] {
    max-width: 500px;
    width: 100%;
}

.wall-icon-wrapper[b-58g8rlitxg] {
    width: 80px;
    height: 80px;
    background-color: rgba(0, 163, 224, 0.1);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto 1.5rem;
    color: var(--palette-primary);
    font-size: 2rem;
    border: 1px solid var(--palette-primary);
}

.wall-title[b-58g8rlitxg] {
    font-family: 'Montserrat', sans-serif;
    font-weight: 700;
    color: var(--palette-white);
    margin-bottom: 0.5rem;
    text-transform: uppercase;
}

.wall-message[b-58g8rlitxg] {
    color: var(--palette-gray-light);
    margin-bottom: 2rem;
    line-height: 1.5;
}

.wall-form-wrapper[b-58g8rlitxg] {
    background-color: var(--palette-carbon-deep);
    padding: 1.5rem;
    border-radius: 4px;
    box-shadow: 0 10px 30px rgba(0,0,0,0.5);
    border: 1px solid var(--palette-gray-dark);
}

/* === ESTADOS VACÍOS === */
.empty-state-container[b-58g8rlitxg] {
    text-align: center;
    padding: 4rem 1rem;
    border: 2px dashed var(--palette-gray-dark);
    border-radius: 4px;
    background-color: rgba(255,255,255,0.01);
    margin-top: 2rem;
}

.empty-icon[b-58g8rlitxg] {
    font-size: 3rem;
    margin-bottom: 1rem;
    opacity: 0.5;
    color: var(--palette-gray-mid);
}

.empty-text[b-58g8rlitxg] {
    font-family: 'Montserrat', sans-serif;
    color: var(--palette-gray-light);
    font-size: 1rem;
}

/* === TABLA RESPONSIVA (INDUSTRIAL) === */
.table-responsive-wrapper[b-58g8rlitxg] {
    width: 100%;
    overflow-x: auto;
    scrollbar-width: thin;
    scrollbar-color: var(--palette-gray-dark) transparent;
}

.watches-table[b-58g8rlitxg] {
    width: 100%;
    border-collapse: collapse;
}

    .watches-table th[b-58g8rlitxg], .watches-table td[b-58g8rlitxg] {
        padding: 1rem 1.25rem;
        text-align: left;
        border-bottom: 1px solid var(--palette-gray-dark);
        vertical-align: middle;
        color: var(--palette-soft-white);
    }

    .watches-table th[b-58g8rlitxg] {
        font-weight: 700;
        color: var(--palette-primary); /* Encabezados Azules */
        font-size: 0.75rem;
        text-transform: uppercase;
        letter-spacing: 0.05em;
        border-bottom: 2px solid var(--palette-gray-dark);
    }

    .watches-table tbody tr[b-58g8rlitxg] {
        transition: background-color 0.2s ease;
    }

        .watches-table tbody tr:hover[b-58g8rlitxg] {
            background-color: rgba(255, 255, 255, 0.03);
        }

/* Texto especial para dueño */
.text-owner[b-58g8rlitxg] {
    font-family: 'Montserrat', sans-serif;
    font-size: 0.9rem;
    color: var(--palette-white);
}

/* Badges de Tipo */
.badge[b-58g8rlitxg] {
    padding: 0.25rem 0.6rem;
    border-radius: 2px;
    font-size: 0.7rem;
    font-weight: 700;
    text-transform: uppercase;
    border: 1px solid transparent;
}

.badge-business[b-58g8rlitxg] {
    background-color: rgba(0, 163, 224, 0.15);
    color: var(--palette-primary);
    border-color: var(--palette-primary);
}

.badge-personal[b-58g8rlitxg] {
    background-color: rgba(255, 255, 255, 0.1);
    color: var(--palette-gray-light);
    border-color: var(--palette-gray-mid);
}

/* Acciones */
.actions-cell[b-58g8rlitxg] {
    text-align: right;
    white-space: nowrap;
}

.actions-header[b-58g8rlitxg] {
    text-align: right;
}

.btn-icon[b-58g8rlitxg] {
    background: transparent;
    border: 1px solid transparent;
    border-radius: 2px;
    width: 32px;
    height: 32px;
    font-size: 0.9rem;
    cursor: pointer;
    transition: all 0.2s ease;
    margin-left: 0.25rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.btn-edit[b-58g8rlitxg] {
    color: var(--palette-gray-light);
}

    .btn-edit:hover[b-58g8rlitxg] {
        color: var(--palette-primary);
        background-color: rgba(0, 163, 224, 0.1);
        border-color: var(--palette-primary);
    }

.btn-delete[b-58g8rlitxg] {
    color: var(--palette-gray-light);
}

    .btn-delete:hover[b-58g8rlitxg] {
        color: var(--palette-danger);
        background-color: rgba(229, 62, 62, 0.1);
        border-color: var(--palette-danger);
    }

/* === LÓGICA RESPONSIVA: TARJETAS === */
@media (max-width: 768px) {
    .watches-table thead[b-58g8rlitxg] {
        display: none;
    }

    .watches-table tr[b-58g8rlitxg] {
        display: block;
        margin-bottom: 1rem;
        border: 1px solid var(--palette-gray-dark);
        border-radius: 4px;
        overflow: hidden;
        background-color: var(--palette-carbon-deep);
        padding: 1rem;
    }

    .watches-table td[b-58g8rlitxg] {
        display: flex;
        justify-content: space-between;
        align-items: center;
        text-align: right;
        padding: 0.75rem 0;
        border-bottom: 1px solid rgba(255,255,255,0.05);
    }

    .watches-table tr:last-child[b-58g8rlitxg] {
        margin-bottom: 0;
    }

    .watches-table td:last-child[b-58g8rlitxg] {
        border-bottom: none;
        padding-top: 1rem;
        padding-bottom: 0;
    }

    .watches-table td[b-58g8rlitxg]::before {
        content: attr(data-label);
        font-weight: 700;
        text-align: left;
        margin-right: 1rem;
        color: var(--palette-primary);
        font-size: 0.75rem;
        text-transform: uppercase;
        opacity: 0.9;
    }

    .actions-cell[b-58g8rlitxg] {
        justify-content: flex-end;
    }

        .actions-cell[b-58g8rlitxg]::before {
            content: "Acciones";
        }
}

.animate-fade-in[b-58g8rlitxg] {
    animation: fadeIn-b-58g8rlitxg 0.5s ease-out forwards;
}

@keyframes fadeIn-b-58g8rlitxg {
    from {
        opacity: 0;
        transform: translateY(5px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}
/* _content/ImagineTheFuture.BlazorServer/Pages/Admin/ManageWorksites.razor.rz.scp.css */
/*
 * ManageWorksites.razor.css
 * Gestión de Lugares de Trabajo - Industrial Edition
 */

/* === HEADER === */
.page-header[b-fta6xjx2km] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 2rem;
    padding-bottom: 1rem;
    border-bottom: 1px solid var(--palette-gray-dark);
    flex-wrap: wrap;
    gap: 1rem;
}

    .page-header h1[b-fta6xjx2km] {
        margin: 0;
        font-size: 1.75rem;
        font-family: 'Montserrat', sans-serif;
        font-weight: 700;
        color: var(--palette-white);
        text-transform: uppercase;
        letter-spacing: 0.05em;
    }

.header-actions[b-fta6xjx2km] {
    display: flex;
    gap: 0.8rem;
    align-items: center;
}

/* Botones */
.btn-create-new[b-fta6xjx2km] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.6rem 1.2rem;
    background-color: var(--palette-primary);
    color: var(--palette-white);
    font-family: 'Montserrat', sans-serif;
    font-weight: 700;
    border-radius: 2px;
    border: none;
    cursor: pointer;
    font-size: 0.85rem;
    text-transform: uppercase;
    text-decoration: none;
    box-shadow: 0 4px 10px rgba(0, 163, 224, 0.3);
    transition: all 0.2s ease;
}

    .btn-create-new:hover[b-fta6xjx2km] {
        background-color: #0088BE;
        transform: translateY(-1px);
    }

.btn-refresh[b-fta6xjx2km] {
    color: var(--palette-primary);
    border: 1px solid var(--palette-gray-mid);
    background-color: transparent;
    width: 36px;
    height: 36px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 2px;
    cursor: pointer;
    transition: all 0.2s ease;
}

    .btn-refresh:hover[b-fta6xjx2km] {
        background-color: rgba(0, 163, 224, 0.1);
        border-color: var(--palette-primary);
    }

/* === TABLA INDUSTRIAL === */
.table-responsive-wrapper[b-fta6xjx2km] {
    width: 100%;
    overflow-x: auto;
    scrollbar-width: thin;
    scrollbar-color: var(--palette-gray-dark) transparent;
}

.industrial-table[b-fta6xjx2km] {
    width: 100%;
    border-collapse: collapse;
}

    .industrial-table th[b-fta6xjx2km], .industrial-table td[b-fta6xjx2km] {
        padding: 1rem 1.25rem;
        text-align: left;
        border-bottom: 1px solid var(--palette-gray-dark);
        color: var(--palette-soft-white);
        vertical-align: middle;
    }

    .industrial-table th[b-fta6xjx2km] {
        font-weight: 700;
        color: var(--palette-primary);
        font-size: 0.75rem;
        text-transform: uppercase;
        letter-spacing: 0.05em;
        border-bottom: 2px solid var(--palette-gray-dark);
    }

    .industrial-table tbody tr[b-fta6xjx2km] {
        transition: background-color 0.2s ease;
    }

        .industrial-table tbody tr:hover[b-fta6xjx2km] {
            background-color: rgba(255, 255, 255, 0.03);
        }

/* Celdas especiales */
.coords-cell[b-fta6xjx2km] {
    font-family: 'Consolas', monospace;
    font-size: 0.85rem;
    color: var(--palette-gray-light);
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

    .coords-cell i[b-fta6xjx2km] {
        color: var(--palette-primary);
        font-size: 0.8rem;
    }

.badge-tech[b-fta6xjx2km] {
    background-color: var(--palette-gray-darker);
    color: var(--palette-soft-white);
    padding: 0.2rem 0.5rem;
    border-radius: 2px;
    font-size: 0.75rem;
    border: 1px solid var(--palette-gray-mid);
    font-weight: 700;
}

.text-break[b-fta6xjx2km] {
    word-break: break-word;
    max-width: 300px;
}

/* Acciones */
.actions-cell[b-fta6xjx2km] {
    text-align: right;
    white-space: nowrap;
}

.actions-header[b-fta6xjx2km] {
    text-align: right;
}

.btn-icon[b-fta6xjx2km] {
    background: transparent;
    border: 1px solid transparent;
    border-radius: 2px;
    width: 32px;
    height: 32px;
    font-size: 0.9rem;
    cursor: pointer;
    transition: all 0.2s ease;
    margin-left: 0.25rem;
    display: inline-flex;
    justify-content: center;
    align-items: center;
}

.btn-edit[b-fta6xjx2km] {
    color: var(--palette-gray-light);
}

    .btn-edit:hover[b-fta6xjx2km] {
        color: var(--palette-primary);
        background-color: rgba(0, 163, 224, 0.1);
    }

.btn-delete[b-fta6xjx2km] {
    color: var(--palette-gray-light);
}

    .btn-delete:hover[b-fta6xjx2km] {
        color: var(--palette-danger);
        background-color: rgba(229, 62, 62, 0.1);
    }

/* Muro de Seguridad */
.admin-security-wall[b-fta6xjx2km] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    min-height: 60vh;
    text-align: center;
    padding: 2rem;
    background: rgba(255, 255, 255, 0.02);
    border-radius: 4px;
    border: 2px dashed var(--palette-gray-dark);
}

.wall-icon-wrapper[b-fta6xjx2km] {
    width: 80px;
    height: 80px;
    background-color: rgba(0, 163, 224, 0.1);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto 1.5rem;
    color: var(--palette-primary);
    font-size: 2rem;
    border: 1px solid var(--palette-primary);
}

.wall-title[b-fta6xjx2km] {
    font-family: 'Montserrat', sans-serif;
    font-weight: 700;
    color: var(--palette-white);
    margin-bottom: 0.5rem;
    text-transform: uppercase;
}

.wall-message[b-fta6xjx2km] {
    color: var(--palette-gray-light);
    margin-bottom: 2rem;
}

.wall-form-wrapper[b-fta6xjx2km] {
    background-color: var(--palette-carbon-deep);
    padding: 1.5rem;
    border-radius: 4px;
    box-shadow: 0 10px 30px rgba(0,0,0,0.5);
    border: 1px solid var(--palette-gray-dark);
}

/* Empty State */
.empty-state-container[b-fta6xjx2km] {
    text-align: center;
    padding: 4rem 1rem;
    border: 2px dashed var(--palette-gray-dark);
    border-radius: 4px;
    background-color: rgba(255,255,255,0.01);
}

.empty-icon[b-fta6xjx2km] {
    font-size: 3rem;
    margin-bottom: 1rem;
    opacity: 0.5;
    color: var(--palette-gray-mid);
}

.empty-text[b-fta6xjx2km] {
    font-family: 'Montserrat', sans-serif;
    color: var(--palette-gray-light);
}

.text-muted[b-fta6xjx2km] {
    color: var(--palette-gray-mid) !important;
}

/* Responsive */
@media (max-width: 768px) {
    .page-header[b-fta6xjx2km] {
        flex-direction: column;
        align-items: flex-start;
        gap: 1rem;
    }

    .header-actions[b-fta6xjx2km] {
        width: 100%;
        justify-content: flex-start;
    }

    .industrial-table thead[b-fta6xjx2km] {
        display: none;
    }

    .industrial-table tr[b-fta6xjx2km] {
        display: block;
        margin-bottom: 1rem;
        border: 1px solid var(--palette-gray-dark);
        border-radius: 4px;
        background-color: var(--palette-carbon-deep);
        padding: 1rem;
    }

    .industrial-table td[b-fta6xjx2km] {
        display: flex;
        justify-content: space-between;
        align-items: center;
        text-align: right;
        padding: 0.75rem 0;
        border-bottom: 1px solid rgba(255,255,255,0.05);
    }

        .industrial-table td:last-child[b-fta6xjx2km] {
            border-bottom: none;
        }

        .industrial-table td[b-fta6xjx2km]::before {
            content: attr(data-label);
            font-weight: 700;
            text-align: left;
            margin-right: 1rem;
            color: var(--palette-primary);
            font-size: 0.75rem;
            text-transform: uppercase;
        }

    .actions-cell[b-fta6xjx2km] {
        justify-content: flex-end;
    }

    .text-break[b-fta6xjx2km] {
        max-width: 200px;
    }
}

.animate-fade-in[b-fta6xjx2km] {
    animation: fadeIn-b-fta6xjx2km 0.5s ease-out forwards;
}

@keyframes fadeIn-b-fta6xjx2km {
    from {
        opacity: 0;
        transform: translateY(5px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}
/* _content/ImagineTheFuture.BlazorServer/Pages/Admin/PortfolioEditor.razor.rz.scp.css */
/*
 * PortfolioEditor.razor.css
 * Estilos para el editor de secciones del portafolio - Industrial Edition
*/

.font-montserrat[b-c1k2cz2qlp] {
    font-family: 'Montserrat', sans-serif;
}

/* === Encabezado === */
.editor-header[b-c1k2cz2qlp] {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: center;
    gap: 1rem;
    margin-bottom: 2rem;
    padding-bottom: 1rem;
    border-bottom: 1px solid var(--palette-gray-dark);
}

    .editor-header h1[b-c1k2cz2qlp] {
        margin: 0;
        font-size: 1.75rem;
        font-weight: 700;
        color: var(--palette-white);
        text-transform: uppercase;
        letter-spacing: 0.05em;
    }

    .editor-header h2[b-c1k2cz2qlp] {
        margin: 0.25rem 0 0 0;
        font-size: 0.85rem;
        font-weight: 400;
        color: var(--palette-gray-light);
    }

/* Badge ID Sistema */
.badge-system-name[b-c1k2cz2qlp] {
    font-family: 'Montserrat', sans-serif; /* O una fuente monoespaciada */
    background-color: var(--palette-gray-darker);
    color: var(--palette-primary);
    padding: 0.2rem 0.5rem;
    border-radius: 2px;
    font-weight: 600;
    font-size: 0.8rem;
    border: 1px solid var(--palette-gray-dark);
}

.header-actions[b-c1k2cz2qlp] {
    display: flex;
    gap: 0.75rem;
}

/* Botones */
.btn-cancel[b-c1k2cz2qlp], .btn-save[b-c1k2cz2qlp] {
    padding: 0.6rem 1.5rem;
    font-family: 'Montserrat', sans-serif;
    font-weight: 700;
    border-radius: 2px; /* Cuadrado industrial */
    border: none;
    cursor: pointer;
    transition: all 0.2s ease;
    text-transform: uppercase;
    font-size: 0.85rem;
}

.btn-cancel[b-c1k2cz2qlp] {
    background-color: transparent;
    color: var(--palette-gray-light);
    border: 1px solid var(--palette-gray-mid);
}

    .btn-cancel:hover[b-c1k2cz2qlp] {
        background-color: var(--palette-gray-darker);
        color: var(--palette-white);
    }

.btn-save[b-c1k2cz2qlp] {
    background-color: var(--palette-primary);
    color: var(--palette-white);
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
}

    .btn-save:hover:not(:disabled)[b-c1k2cz2qlp] {
        background-color: #0088BE; /* Azul oscuro */
        box-shadow: 0 4px 15px rgba(0, 163, 224, 0.3);
    }

    .btn-save:disabled[b-c1k2cz2qlp] {
        opacity: 0.6;
        cursor: not-allowed;
        background-color: var(--palette-gray-mid);
    }

/* === Layout de 2 Columnas === */
.editor-columns-layout[b-c1k2cz2qlp] {
    display: grid;
    grid-template-columns: 450px 1fr;
    gap: 2rem;
    align-items: start;
}

.stacked-panel[b-c1k2cz2qlp] {
    width: 100%;
}

.form-section[b-c1k2cz2qlp] {
    background-color: var(--palette-carbon-deep);
    border: 1px solid var(--palette-gray-dark);
    border-radius: 4px;
    padding: 2rem;
    position: sticky;
    top: 2rem;
    box-shadow: 0 10px 30px rgba(0,0,0,0.5);
}

    .form-section h4[b-c1k2cz2qlp], .gallery-section h4[b-c1k2cz2qlp] {
        margin-top: 0;
        margin-bottom: 1.5rem;
        padding-bottom: 0.75rem;
        border-bottom: 1px solid var(--palette-gray-dark);
        font-family: 'Montserrat', sans-serif;
        color: var(--palette-white);
        font-weight: 700;
        text-transform: uppercase;
        font-size: 1rem;
        letter-spacing: 0.05em;
    }

.form-group[b-c1k2cz2qlp] {
    margin-bottom: 1.5rem;
}

/* Grupo destacado (Plantilla) */
.highlight-group[b-c1k2cz2qlp] {
    background-color: rgba(0, 163, 224, 0.05); /* Tinte azul */
    padding: 1rem;
    border-left: 3px solid var(--palette-primary);
    border-radius: 0 4px 4px 0;
    margin-bottom: 1.5rem;
}

.text-accent[b-c1k2cz2qlp] {
    color: var(--palette-primary);
}

/* Estilos de Inputs (::deep) */
[b-c1k2cz2qlp] label {
    display: block;
    margin-bottom: 0.5rem;
    font-weight: 600;
    font-size: 0.8rem;
    color: var(--palette-primary); /* Label Azul */
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

[b-c1k2cz2qlp] .form-control {
    display: block;
    width: 100%;
    padding: 0.75rem 1rem;
    font-size: 0.95rem;
    color: var(--palette-white);
    background-color: rgba(0, 0, 0, 0.3); /* Fondo oscuro */
    border: 1px solid var(--palette-gray-dark);
    border-radius: 2px;
    transition: all 0.2s;
    font-family: 'Montserrat', sans-serif;
}

    [b-c1k2cz2qlp] .form-control:focus {
        border-color: var(--palette-primary);
        outline: 0;
        background-color: rgba(0, 0, 0, 0.5);
        box-shadow: 0 0 0 1px rgba(0, 163, 224, 0.2);
    }

    [b-c1k2cz2qlp] .form-control::placeholder {
        color: rgba(255,255,255,0.3);
    }

.help-text[b-c1k2cz2qlp] {
    font-size: 0.75rem;
    color: var(--palette-gray-light);
    margin-top: 0.4rem;
    display: block;
}

.separator[b-c1k2cz2qlp] {
    border: 0;
    border-top: 1px solid var(--palette-gray-dark);
    margin: 2rem 0;
    opacity: 0.5;
}

/* Switch */
.form-switch[b-c1k2cz2qlp] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.form-check-input[b-c1k2cz2qlp] {
    width: 2.5em;
    height: 1.25em;
    background-color: var(--palette-gray-darker);
    border-radius: 2px; /* Cuadrado industrial */
    appearance: none;
    cursor: pointer;
    position: relative;
    border: 1px solid var(--palette-gray-mid);
    transition: all 0.2s;
}

    .form-check-input:checked[b-c1k2cz2qlp] {
        background-color: var(--palette-primary);
        border-color: var(--palette-primary);
    }

    .form-check-input[b-c1k2cz2qlp]::before {
        content: '';
        position: absolute;
        width: 0.8em;
        height: 0.8em;
        background: #fff;
        border-radius: 1px; /* Recto */
        top: 0.15em;
        left: 0.15em;
        transition: transform 0.2s;
    }

    .form-check-input:checked[b-c1k2cz2qlp]::before {
        transform: translateX(1.25em);
    }

.form-check-label[b-c1k2cz2qlp] {
    font-size: 0.9rem;
    color: var(--palette-white);
    cursor: pointer;
}

/* Galería Vacía */
.empty-state-card[b-c1k2cz2qlp] {
    background-color: rgba(255, 255, 255, 0.02);
    border: 2px dashed var(--palette-gray-dark);
    border-radius: 4px;
    padding: 4rem 2rem;
    text-align: center;
    color: var(--palette-gray-light);
}

    .empty-state-card i[b-c1k2cz2qlp] {
        font-size: 3rem;
        margin-bottom: 1rem;
        opacity: 0.5;
        color: var(--palette-primary);
    }

    .empty-state-card strong[b-c1k2cz2qlp] {
        color: var(--palette-white);
    }

/* Loading */
.loading-wrapper[b-c1k2cz2qlp] {
    text-align: center;
    padding: 4rem;
    color: var(--palette-primary);
}

.spinner[b-c1k2cz2qlp] {
    width: 2.5rem;
    height: 2.5rem;
    border: 3px solid rgba(255,255,255,0.1);
    border-top-color: var(--palette-primary);
    border-radius: 50%;
    animation: spin-b-c1k2cz2qlp 1s linear infinite;
    margin: 0 auto 1rem;
}

@keyframes spin-b-c1k2cz2qlp {
    to {
        transform: rotate(360deg);
    }
}

/* Responsividad */
@media (max-width: 1100px) {
    .editor-columns-layout[b-c1k2cz2qlp] {
        grid-template-columns: 1fr;
    }

    .form-section[b-c1k2cz2qlp] {
        position: static;
        box-shadow: none;
        margin-bottom: 2rem;
    }
}
/* _content/ImagineTheFuture.BlazorServer/Pages/Admin/ScheduleTemplateEditor.razor.rz.scp.css */
/*
 * ScheduleTemplateEditor.razor.css
 * Industrial Edition
 */

.font-montserrat[b-30ywhyhb1z] {
    font-family: 'Montserrat', sans-serif;
}

/* HEADER */
.editor-header[b-30ywhyhb1z] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 2rem;
    padding-bottom: 1.5rem;
    border-bottom: 1px solid var(--palette-gray-dark);
}

    .editor-header h1[b-30ywhyhb1z] {
        margin: 0;
        font-size: 1.75rem;
        color: var(--palette-white);
        font-weight: 700;
        text-transform: uppercase;
        letter-spacing: 0.05em;
    }

/* LAYOUT */
.editor-stacked-layout[b-30ywhyhb1z] {
    display: flex;
    flex-direction: column;
    gap: 2rem;
    align-items: center;
}

.stacked-panel[b-30ywhyhb1z] {
    width: 100%;
    max-width: 800px;
    background-color: var(--palette-carbon-deep);
    border: 1px solid var(--palette-gray-dark);
    border-radius: 4px;
    padding: 2rem;
}

/* FORM */
.form-group[b-30ywhyhb1z] {
    margin-bottom: 1.5rem;
}

.form-actions[b-30ywhyhb1z] {
    display: flex;
    justify-content: flex-end;
    margin-top: 1rem;
}

[b-30ywhyhb1z] label {
    display: block;
    margin-bottom: 0.5rem;
    font-weight: 600;
    color: var(--palette-primary);
    text-transform: uppercase;
    font-size: 0.8rem;
}

[b-30ywhyhb1z] .form-control {
    width: 100%;
    padding: 0.75rem 1rem;
    background-color: rgba(0,0,0,0.3);
    border: 1px solid var(--palette-gray-mid);
    border-radius: 2px;
    color: white;
    transition: all 0.2s;
}

    [b-30ywhyhb1z] .form-control:focus {
        border-color: var(--palette-primary);
        outline: none;
        box-shadow: 0 0 0 1px var(--palette-primary);
    }

/* GRID DE DÍAS */
.panel-head-row[b-30ywhyhb1z] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 1.5rem;
    border-bottom: 1px solid var(--palette-gray-dark);
    padding-bottom: 0.5rem;
}

    .panel-head-row h4[b-30ywhyhb1z] {
        margin: 0;
        color: var(--palette-primary);
        text-transform: uppercase;
        font-size: 1rem;
    }

.days-grid[b-30ywhyhb1z] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
    gap: 1rem;
}

.day-card[b-30ywhyhb1z] {
    background-color: rgba(255,255,255,0.03);
    border: 1px solid var(--palette-gray-dark);
    border-radius: 2px;
    padding: 1rem;
}

    .day-card.day-off[b-30ywhyhb1z] {
        opacity: 0.7;
        border-style: dashed;
    }

.day-header[b-30ywhyhb1z] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 0.5rem;
}

.day-name[b-30ywhyhb1z] {
    font-weight: 700;
    color: var(--palette-white);
    text-transform: uppercase;
}

.day-actions[b-30ywhyhb1z] {
    display: flex;
    gap: 0.3rem;
}

.btn-icon-sm[b-30ywhyhb1z] {
    background: none;
    border: none;
    color: var(--palette-gray-mid);
    cursor: pointer;
    font-size: 0.8rem;
}

    .btn-icon-sm:hover[b-30ywhyhb1z] {
        color: var(--palette-primary);
    }

    .btn-icon-sm.danger:hover[b-30ywhyhb1z] {
        color: var(--palette-danger);
    }

.day-body[b-30ywhyhb1z] {
    font-size: 0.9rem;
    color: var(--palette-soft-white);
}

.badge-off[b-30ywhyhb1z] {
    background-color: rgba(255,255,255,0.1);
    padding: 0.2rem 0.5rem;
    border-radius: 2px;
    font-size: 0.75rem;
}

.time-row i[b-30ywhyhb1z] {
    color: var(--palette-primary);
    margin-right: 5px;
}

/* MODAL INTERNO */
.modal-overlay[b-30ywhyhb1z] {
    position: fixed;
    inset: 0;
    z-index: 2000;
    background-color: rgba(0,0,0,0.8);
    display: flex;
    justify-content: center;
    align-items: center;
    animation: fadeIn-b-30ywhyhb1z 0.2s;
}

.modal-card[b-30ywhyhb1z] {
    background-color: var(--palette-carbon-deep);
    border: 1px solid var(--palette-primary);
    padding: 2rem;
    width: 400px;
    box-shadow: 0 10px 40px rgba(0,0,0,0.8);
}

.modal-actions[b-30ywhyhb1z] {
    display: flex;
    justify-content: flex-end;
    gap: 1rem;
    margin-top: 1.5rem;
}

/* BOTONES */
.btn-save[b-30ywhyhb1z] {
    background-color: var(--palette-primary);
    color: white;
    border: none;
    padding: 0.6rem 1.2rem;
    border-radius: 2px;
    font-weight: 700;
    text-transform: uppercase;
    cursor: pointer;
}

.btn-cancel[b-30ywhyhb1z] {
    background: transparent;
    color: var(--palette-gray-light);
    border: 1px solid var(--palette-gray-mid);
    padding: 0.6rem 1.2rem;
    border-radius: 2px;
    cursor: pointer;
}

.btn-secondary-sm[b-30ywhyhb1z] {
    background: transparent;
    border: 1px solid var(--palette-primary);
    color: var(--palette-primary);
    padding: 0.4rem 0.8rem;
    border-radius: 2px;
    cursor: pointer;
    font-size: 0.8rem;
    text-transform: uppercase;
}

@keyframes fadeIn-b-30ywhyhb1z {
    from {
        opacity: 0;
    }

    to {
        opacity: 1;
    }
}
/* _content/ImagineTheFuture.BlazorServer/Pages/Admin/SystemLogs.razor.rz.scp.css */
/* Estilos aislados para la vista de Logs en DARK MODE */

/* Contenedor principal */
.system-logs-container[b-vc64i3sn25] {
    height: 100%;
    min-height: 80vh;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    background-color: #1e1e1e;
}

/* Encabezado */
.logs-header[b-vc64i3sn25] {
    background-color: #1e1e1e;
    border-bottom: 1px solid #333333;
    padding: 1rem;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

/* Icono del título */
.header-title i[b-vc64i3sn25] {
    margin-right: 0.5rem;
    color: #0d6efd;
}

/* Wrapper del Iframe */
.logs-frame-wrapper[b-vc64i3sn25] {
    flex-grow: 1;
    width: 100%;
    position: relative;
}

/* El Iframe en sí */
.logs-frame[b-vc64i3sn25] {
    width: 100%;
    height: 100%;
    border: none;
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    background-color: #1e1e1e;
}
/* _content/ImagineTheFuture.BlazorServer/Pages/Admin/TeamEditor.razor.rz.scp.css */
/*
 * TeamEditor.razor.css
 * Estilos para el formulario de equipos - Industrial Edition
 */

.font-montserrat[b-g7fhhuelbl] {
    font-family: 'Montserrat', sans-serif;
}

/* === HEADER === */
.editor-header[b-g7fhhuelbl] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 2rem;
    padding-bottom: 1.5rem;
    border-bottom: 1px solid var(--palette-gray-dark);
}

    .editor-header h1[b-g7fhhuelbl] {
        margin: 0;
        font-size: 1.75rem;
        font-weight: 700;
        color: var(--palette-white);
        text-transform: uppercase;
        letter-spacing: 0.05em;
    }

.header-actions[b-g7fhhuelbl] {
    display: flex;
    gap: 0.75rem;
}

/* === BOTONES === */
.btn-cancel[b-g7fhhuelbl], .btn-save[b-g7fhhuelbl] {
    padding: 0.6rem 1.2rem;
    font-family: 'Montserrat', sans-serif;
    font-weight: 700;
    border-radius: 2px;
    border: 1px solid transparent;
    cursor: pointer;
    transition: all 0.2s ease;
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    text-transform: uppercase;
    font-size: 0.85rem;
}

.btn-cancel[b-g7fhhuelbl] {
    background-color: transparent;
    color: var(--palette-gray-light);
    border-color: var(--palette-gray-mid);
}

    .btn-cancel:hover[b-g7fhhuelbl] {
        background-color: var(--palette-gray-darker);
        color: var(--palette-white);
    }

.btn-save[b-g7fhhuelbl] {
    background-color: var(--palette-primary);
    color: var(--palette-white);
    position: relative;
    box-shadow: 0 4px 10px rgba(0, 163, 224, 0.3);
}

    .btn-save:hover[b-g7fhhuelbl] {
        background-color: #0088BE;
        transform: translateY(-1px);
    }

    .btn-save.is-loading[b-g7fhhuelbl] {
        cursor: not-allowed;
        filter: brightness(0.9);
    }

        .btn-save.is-loading > *[b-g7fhhuelbl] {
            visibility: hidden;
        }

        .btn-save.is-loading[b-g7fhhuelbl]::after {
            content: '';
            position: absolute;
            width: 1.2rem;
            height: 1.2rem;
            top: calc(50% - 0.6rem);
            left: calc(50% - 0.6rem);
            border: 2px solid rgba(255,255,255,0.1);
            border-top-color: var(--palette-white);
            border-radius: 50%;
            animation: spin-b-g7fhhuelbl 0.8s ease-in-out infinite;
        }

@keyframes spin-b-g7fhhuelbl {
    to {
        transform: rotate(360deg);
    }
}

/* === LAYOUT === */
.editor-stacked-layout[b-g7fhhuelbl] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 2rem;
    width: 100%;
}

.stacked-panel[b-g7fhhuelbl] {
    width: 100%;
}

.form-section h4[b-g7fhhuelbl] {
    margin-top: 0;
    margin-bottom: 1.5rem;
    padding-bottom: 0.75rem;
    border-bottom: 1px solid var(--palette-gray-dark);
    font-family: 'Montserrat', sans-serif;
    color: var(--palette-primary);
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    font-size: 1rem;
}

.form-section[b-g7fhhuelbl] {
    max-width: 800px;
    background-color: var(--palette-carbon-deep);
    border: 1px solid var(--palette-gray-dark);
    border-radius: 4px;
    padding: 2rem;
    box-shadow: 0 10px 30px rgba(0,0,0,0.5);
}

.form-group[b-g7fhhuelbl] {
    margin-bottom: 1.5rem;
}

.form-actions[b-g7fhhuelbl] {
    margin-top: 2rem;
    padding-top: 1.5rem;
    border-top: 1px solid var(--palette-gray-dark);
    display: flex;
    justify-content: flex-end;
}

/* Grid helper */
.grid[b-g7fhhuelbl] {
    display: grid;
}

.grid-cols-1[b-g7fhhuelbl] {
    grid-template-columns: repeat(1, minmax(0, 1fr));
}

.gap-4[b-g7fhhuelbl] {
    gap: 1rem;
}

@media (min-width: 640px) {
    .sm\:grid-cols-2[b-g7fhhuelbl] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

/* === INPUTS === */
[b-g7fhhuelbl] label {
    display: block;
    margin-bottom: 0.5rem;
    font-weight: 600;
    font-size: 0.8rem;
    color: var(--palette-primary);
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

[b-g7fhhuelbl] .form-control {
    display: block;
    width: 100%;
    padding: 0.75rem 1rem;
    font-size: 0.95rem;
    font-family: 'Montserrat', sans-serif;
    color: var(--palette-white);
    background-color: rgba(0, 0, 0, 0.3);
    border: 1px solid var(--palette-gray-mid);
    border-radius: 2px;
    transition: all .15s ease-in-out;
}

/* SVG flecha select actualizado a Azul (#00A3E0) */
[b-g7fhhuelbl] select.form-control {
    cursor: pointer;
    appearance: none;
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%2300A3E0' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M2 5l6 6 6-6'/%3e%3c/svg%3e");
    background-repeat: no-repeat;
    background-position: right 1rem center;
    background-size: 16px 12px;
    padding-right: 2.5rem;
}

[b-g7fhhuelbl] .form-control:focus {
    border-color: var(--palette-primary);
    outline: 0;
    box-shadow: 0 0 0 1px var(--palette-primary);
    background-color: rgba(0, 0, 0, 0.5);
}

[b-g7fhhuelbl] .validation-message {
    color: var(--palette-danger);
    font-size: .75rem;
    margin-top: .25rem;
    font-weight: 500;
}

/* Utils */
.text-muted[b-g7fhhuelbl] {
    color: var(--palette-gray-mid);
}

.empty-text-container[b-g7fhhuelbl] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 4rem 2rem;
    text-align: center;
    color: var(--palette-gray-light);
    background-color: rgba(255, 255, 255, 0.02);
    border: 2px dashed var(--palette-gray-dark);
    border-radius: 4px;
}

    .empty-text-container i[b-g7fhhuelbl] {
        opacity: 0.5;
        margin-bottom: 1rem;
        color: var(--palette-gray-mid);
    }

/* Responsive */
@media (max-width: 768px) {
    .editor-header[b-g7fhhuelbl] {
        align-items: flex-start;
        flex-direction: column;
        gap: 1rem;
    }

    .header-actions[b-g7fhhuelbl] {
        width: 100%;
        justify-content: flex-start;
    }

    .form-section[b-g7fhhuelbl] {
        padding: 1.5rem;
    }
}

.animate-fade-in[b-g7fhhuelbl] {
    animation: fadeIn-b-g7fhhuelbl 0.4s ease-out forwards;
}

@keyframes fadeIn-b-g7fhhuelbl {
    from {
        opacity: 0;
        transform: translateY(10px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}
/* _content/ImagineTheFuture.BlazorServer/Pages/Admin/UserEditor.razor.rz.scp.css */
/*
 * UserEditor.razor.css
 * Estilos aislados para el componente UserEditor - Industrial Edition
 */

.font-montserrat[b-v8ueh50uzc] {
    font-family: 'Montserrat', sans-serif;
}

/* === Encabezado del Editor === */
.editor-header[b-v8ueh50uzc] {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: center;
    gap: 1rem;
    margin-bottom: 2rem;
    padding-bottom: 1.5rem;
    border-bottom: 1px solid var(--palette-gray-dark);
}

    .editor-header h1[b-v8ueh50uzc] {
        margin: 0;
        font-size: 1.75rem;
        font-weight: 700;
        color: var(--palette-white);
        font-family: 'Montserrat', sans-serif;
        text-transform: uppercase;
        letter-spacing: 0.05em;
    }

    .editor-header p.text-muted[b-v8ueh50uzc] {
        margin: 0.25rem 0 0;
        color: var(--palette-gray-light);
        font-size: 0.9rem;
        opacity: 0.8;
    }

.header-actions[b-v8ueh50uzc] {
    display: flex;
    gap: 0.75rem;
}

/* === Botones === */
.btn-cancel[b-v8ueh50uzc], .btn-save[b-v8ueh50uzc], .btn-danger[b-v8ueh50uzc], .btn-secondary[b-v8ueh50uzc] {
    padding: 0.6rem 1.2rem;
    font-family: 'Montserrat', sans-serif;
    font-weight: 700;
    border-radius: 2px; /* Cuadrado técnico */
    border: 1px solid transparent;
    cursor: pointer;
    transition: all 0.2s ease;
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    text-transform: uppercase;
    font-size: 0.85rem;
}

.btn-cancel[b-v8ueh50uzc] {
    background-color: transparent;
    color: var(--palette-gray-light);
    border-color: var(--palette-gray-mid);
}

    .btn-cancel:hover[b-v8ueh50uzc] {
        background-color: var(--palette-gray-darker);
        color: var(--palette-white);
    }

.btn-save[b-v8ueh50uzc] {
    background-color: var(--palette-primary);
    color: var(--palette-white);
    position: relative;
    box-shadow: 0 4px 10px rgba(0, 163, 224, 0.3);
}

    .btn-save:hover[b-v8ueh50uzc] {
        background-color: #0088BE; /* Azul oscuro */
        transform: translateY(-1px);
    }

.btn-secondary[b-v8ueh50uzc] {
    background-color: var(--palette-gray-darker);
    color: var(--palette-soft-white);
    border: 1px solid var(--palette-gray-dark);
}

    .btn-secondary:hover[b-v8ueh50uzc] {
        background-color: var(--palette-gray-mid);
        border-color: var(--palette-white);
    }

/* Estado de carga del botón */
.btn-save.is-loading[b-v8ueh50uzc] {
    cursor: not-allowed;
    filter: brightness(0.9);
}

    .btn-save.is-loading > *[b-v8ueh50uzc] {
        visibility: hidden;
    }

    .btn-save.is-loading[b-v8ueh50uzc]::after {
        content: '';
        position: absolute;
        width: 1.2rem;
        height: 1.2rem;
        top: calc(50% - 0.6rem);
        left: calc(50% - 0.6rem);
        border: 2px solid rgba(255,255,255,0.1);
        border-top-color: var(--palette-white);
        border-radius: 50%;
        animation: spin-b-v8ueh50uzc 0.8s ease-in-out infinite;
    }

@keyframes spin-b-v8ueh50uzc {
    to {
        transform: rotate(360deg);
    }
}

/* ===== LAYOUT APILADO Y PANELES ===== */
.editor-stacked-layout[b-v8ueh50uzc] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 2rem;
    width: 100%;
}

.stacked-panel[b-v8ueh50uzc] {
    width: 100%;
}

.form-section h4[b-v8ueh50uzc],
.roles-section h4[b-v8ueh50uzc],
.client-link-section h4[b-v8ueh50uzc] {
    margin-top: 0;
    margin-bottom: 1.5rem;
    padding-bottom: 0.75rem;
    border-bottom: 1px solid var(--palette-gray-dark);
    font-family: 'Montserrat', sans-serif;
    color: var(--palette-primary);
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    font-size: 1rem;
}

.form-section[b-v8ueh50uzc],
.roles-section[b-v8ueh50uzc],
.client-link-section[b-v8ueh50uzc] {
    max-width: 800px;
    background-color: var(--palette-carbon-deep);
    border: 1px solid var(--palette-gray-dark);
    border-radius: 4px;
    padding: 2rem;
    box-shadow: 0 10px 30px rgba(0,0,0,0.5);
}

.form-group[b-v8ueh50uzc] {
    margin-bottom: 1.5rem;
}

.form-check[b-v8ueh50uzc] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    color: var(--palette-soft-white);
}

.form-actions[b-v8ueh50uzc] {
    margin-top: 2rem;
    padding-top: 1.5rem;
    border-top: 1px solid var(--palette-gray-dark);
    display: flex;
    justify-content: flex-end;
}

/* === Sección de Vínculo con Cliente === */
.linked-client-display[b-v8ueh50uzc] {
    background-color: rgba(0, 0, 0, 0.3);
    border: 1px solid var(--palette-gray-dark);
    padding: 1rem;
    border-radius: 2px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap; /* Para móviles */
    gap: 1rem;
}

    .linked-client-display span[b-v8ueh50uzc] {
        color: var(--palette-white);
        font-weight: 500;
        display: inline-flex;
        align-items: center;
    }

    .linked-client-display i[b-v8ueh50uzc] {
        color: var(--palette-primary);
        margin-right: 0.5rem;
    }

/* === Estilos de Formulario (::deep) === */
[b-v8ueh50uzc] label {
    display: block;
    margin-bottom: 0.5rem;
    font-weight: 600;
    font-size: 0.8rem;
    color: var(--palette-primary);
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

/* Selector y Inputs de texto */
[b-v8ueh50uzc] .form-control {
    display: block;
    width: 100%;
    padding: 0.75rem 1rem;
    font-size: 0.95rem;
    font-family: 'Montserrat', sans-serif;
    color: var(--palette-white);
    background-color: rgba(0, 0, 0, 0.3);
    border: 1px solid var(--palette-gray-mid);
    border-radius: 2px;
    transition: all .15s ease-in-out;
}

/* Estilos específicos para el desplegable (select) */
/* SVG Actualizado con el color azul #00A3E0 */
[b-v8ueh50uzc] select.form-control {
    cursor: pointer;
    appearance: none; /* Quitar flecha default */
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%2300A3E0' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M2 5l6 6 6-6'/%3e%3c/svg%3e");
    background-repeat: no-repeat;
    background-position: right 1rem center;
    background-size: 16px 12px;
    padding-right: 2.5rem; /* Espacio para la flecha */
}

[b-v8ueh50uzc] .form-control:disabled {
    background-color: rgba(255, 255, 255, 0.05);
    opacity: 0.6;
    cursor: not-allowed;
    border-color: var(--palette-gray-dark);
}

[b-v8ueh50uzc] .form-control:focus {
    border-color: var(--palette-primary);
    outline: 0;
    box-shadow: 0 0 0 1px var(--palette-primary);
    background-color: rgba(0, 0, 0, 0.5);
}

[b-v8ueh50uzc] .validation-message {
    color: var(--palette-danger);
    font-size: .75rem;
    margin-top: .25rem;
    font-weight: 500;
}

[b-v8ueh50uzc] .form-control.invalid {
    border-color: var(--palette-danger);
}

    [b-v8ueh50uzc] .form-control.invalid:focus {
        border-color: var(--palette-danger);
        box-shadow: 0 0 0 1px rgba(229,62,62,.25);
    }

/* === Animaciones === */
.animate-fade-in[b-v8ueh50uzc] {
    animation: fadeIn-b-v8ueh50uzc 0.4s ease-out forwards;
}

@keyframes fadeIn-b-v8ueh50uzc {
    from {
        opacity: 0;
        transform: translateY(10px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* === Estado "No Encontrado" (Empty State) === */
.empty-text-container[b-v8ueh50uzc] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 4rem 2rem;
    text-align: center;
    color: var(--palette-gray-light);
    background-color: rgba(255, 255, 255, 0.02);
    border: 2px dashed var(--palette-gray-dark);
    border-radius: 4px;
}

    .empty-text-container i[b-v8ueh50uzc] {
        opacity: 0.5;
        margin-bottom: 1rem;
        color: var(--palette-gray-mid);
    }

/* === Utilidades de Texto === */
.text-muted[b-v8ueh50uzc] {
    color: var(--palette-gray-light);
    opacity: 0.8;
}

.loading-text[b-v8ueh50uzc] {
    text-align: center;
    color: var(--palette-primary);
    margin-top: 2rem;
    font-style: italic;
    font-family: 'Montserrat', sans-serif;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    font-size: 0.9rem;
}

/* === Responsividad === */
@media (max-width: 768px) {
    .editor-header[b-v8ueh50uzc] {
        align-items: flex-start;
        flex-direction: column;
        gap: 1rem;
    }

    .header-actions[b-v8ueh50uzc] {
        width: 100%;
        justify-content: flex-start;
    }

    .form-section[b-v8ueh50uzc],
    .roles-section[b-v8ueh50uzc],
    .client-link-section[b-v8ueh50uzc] {
        padding: 1.5rem;
    }
}
/* _content/ImagineTheFuture.BlazorServer/Pages/Admin/WatchEditor.razor.rz.scp.css */
/*
 * WatchEditor.razor.css
 * Estilos para el formulario de creación/edición de visores - Industrial Edition
*/

/* --- Fuentes --- */
.font-montserrat[b-q7ghxhxfs2] {
    font-family: 'Montserrat', sans-serif;
}

/* === Encabezado del Editor === */
.editor-header[b-q7ghxhxfs2] {
    display: flex;
    flex-wrap: wrap; /* Para responsividad */
    justify-content: space-between;
    align-items: center; /* Centrar verticalmente */
    gap: 1rem;
    margin-bottom: 2rem;
    padding-bottom: 1.5rem;
    border-bottom: 1px solid var(--palette-gray-dark);
    width: 100%;
}

    .editor-header h1[b-q7ghxhxfs2] {
        margin: 0;
        font-size: 1.75rem;
        font-weight: 700;
        color: var(--palette-white);
        font-family: 'Montserrat', sans-serif;
        text-transform: uppercase;
        letter-spacing: 0.05em;
    }

    /* Estilo para el subtítulo H2 (Cliente Padre) */
    .editor-header h2[b-q7ghxhxfs2] {
        margin: 0.25rem 0 0 0;
        font-size: 1rem;
        font-weight: 400;
        color: var(--palette-gray-mid);
        font-family: 'Montserrat', sans-serif;
    }

/* --- Estilo para el enlace en el subtítulo --- */
.subtitle-link a[b-q7ghxhxfs2] {
    color: var(--palette-primary); /* Azul */
    text-decoration: none;
    transition: text-decoration 0.2s ease;
    font-weight: 600;
}

    .subtitle-link a:hover[b-q7ghxhxfs2] {
        text-decoration: underline;
    }

.header-actions[b-q7ghxhxfs2] {
    display: flex;
    gap: 0.75rem;
}

/* === Botones === */
.btn-cancel[b-q7ghxhxfs2], .btn-save[b-q7ghxhxfs2] {
    padding: 0.6rem 1.2rem;
    font-family: 'Montserrat', sans-serif;
    font-weight: 700;
    border-radius: 2px; /* Cuadrado técnico */
    border: 1px solid transparent;
    cursor: pointer;
    transition: all 0.2s ease;
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    text-transform: uppercase;
    font-size: 0.85rem;
}

.btn-cancel[b-q7ghxhxfs2] {
    background-color: transparent;
    color: var(--palette-gray-light);
    border-color: var(--palette-gray-mid);
}

    .btn-cancel:hover[b-q7ghxhxfs2] {
        background-color: var(--palette-gray-darker);
        color: var(--palette-white);
    }

.btn-save[b-q7ghxhxfs2] {
    background-color: var(--palette-primary);
    color: var(--palette-white);
    position: relative; /* Para spinner */
    box-shadow: 0 4px 10px rgba(0, 163, 224, 0.3);
}

    .btn-save:hover[b-q7ghxhxfs2] {
        background-color: #0088BE; /* Azul oscuro */
        transform: translateY(-1px);
    }

    /* Estado de carga del botón */
    .btn-save.is-loading[b-q7ghxhxfs2] {
        cursor: not-allowed;
        filter: brightness(0.9);
    }

        .btn-save.is-loading > *[b-q7ghxhxfs2] {
            visibility: hidden;
        }

        .btn-save.is-loading[b-q7ghxhxfs2]::after {
            content: '';
            position: absolute;
            width: 1.2rem;
            height: 1.2rem;
            top: calc(50% - 0.6rem);
            left: calc(50% - 0.6rem);
            border: 2px solid rgba(255,255,255,0.1);
            border-top-color: var(--palette-white);
            border-radius: 50%;
            animation: spin-b-q7ghxhxfs2 0.8s ease-in-out infinite;
        }

@keyframes spin-b-q7ghxhxfs2 {
    to {
        transform: rotate(360deg);
    }
}

/* ===== LAYOUT APILADO Y PANELES ===== */
.editor-stacked-layout[b-q7ghxhxfs2] {
    display: flex;
    flex-direction: column;
    align-items: center; /* Centra los paneles hijos */
    gap: 2rem;
    width: 100%;
}

/* Regla general para paneles (ocupa ancho disponible) */
.stacked-panel[b-q7ghxhxfs2] {
    width: 100%;
}

/* Títulos H4 dentro de los paneles */
.form-section h4[b-q7ghxhxfs2],
.ceremonies-list-section h4[b-q7ghxhxfs2] {
    margin-top: 0;
    margin-bottom: 1.5rem;
    padding-bottom: 0.75rem;
    border-bottom: 1px solid var(--palette-gray-dark);
    font-family: 'Montserrat', sans-serif;
    color: var(--palette-primary);
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    font-size: 1rem;
}

/* Estilo común para los paneles de contenido */
.form-section[b-q7ghxhxfs2],
.ceremonies-list-section[b-q7ghxhxfs2] {
    max-width: 800px; /* Limitar ancho */
    background-color: var(--palette-carbon-deep);
    border: 1px solid var(--palette-gray-dark);
    border-radius: 4px;
    padding: 2rem;
    box-shadow: 0 10px 30px rgba(0,0,0,0.5);
}

/* Grupos y acciones del formulario */
.form-group[b-q7ghxhxfs2] {
    margin-bottom: 1.5rem;
}

.form-actions[b-q7ghxhxfs2] {
    margin-top: 2rem;
    padding-top: 1.5rem;
    border-top: 1px solid var(--palette-gray-dark);
    display: flex;
    justify-content: flex-end;
}

/* Grid layout */
.grid[b-q7ghxhxfs2] {
    display: grid;
}

.grid-cols-1[b-q7ghxhxfs2] {
    grid-template-columns: repeat(1, minmax(0, 1fr));
}

.gap-4[b-q7ghxhxfs2] {
    gap: 1rem;
}

@media (min-width: 640px) {
    .sm\:grid-cols-2[b-q7ghxhxfs2] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

/* === Estilos de Formulario (::deep) === */
[b-q7ghxhxfs2] label {
    display: block;
    margin-bottom: 0.5rem;
    font-weight: 600;
    font-size: 0.8rem;
    color: var(--palette-primary);
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

[b-q7ghxhxfs2] .form-control {
    display: block;
    width: 100%;
    padding: 0.75rem 1rem;
    font-size: 0.95rem;
    font-family: 'Montserrat', sans-serif;
    color: var(--palette-white);
    background-color: rgba(0, 0, 0, 0.3);
    border: 1px solid var(--palette-gray-mid);
    border-radius: 2px;
    transition: all .15s ease-in-out;
}

    [b-q7ghxhxfs2] .form-control:disabled {
        background-color: rgba(255, 255, 255, 0.05);
        opacity: 0.6;
        cursor: not-allowed;
        border-color: var(--palette-gray-dark);
    }

    [b-q7ghxhxfs2] .form-control:focus {
        border-color: var(--palette-primary);
        outline: 0;
        box-shadow: 0 0 0 1px var(--palette-primary);
        background-color: rgba(0, 0, 0, 0.5);
    }

/* SVG flecha select actualizado a Azul (#00A3E0) */
[b-q7ghxhxfs2] select.form-control {
    cursor: pointer;
    appearance: none;
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%2300A3E0' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M2 5l6 6 6-6'/%3e%3c/svg%3e");
    background-repeat: no-repeat;
    background-position: right 1rem center;
    background-size: 16px 12px;
    padding-right: 2.5rem;
}

[b-q7ghxhxfs2] .validation-message {
    color: var(--palette-danger);
    font-size: .75rem;
    margin-top: .25rem;
    font-weight: 500;
}

[b-q7ghxhxfs2] .form-control.invalid {
    border-color: var(--palette-danger);
}

    [b-q7ghxhxfs2] .form-control.invalid:focus {
        border-color: var(--palette-danger);
        box-shadow: 0 0 0 1px rgba(229,62,62,.25);
    }

/* Estado "No Encontrado" (Empty State) */
.empty-text-container[b-q7ghxhxfs2] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 4rem 2rem;
    text-align: center;
    color: var(--palette-gray-light);
    background-color: rgba(255, 255, 255, 0.02);
    border: 2px dashed var(--palette-gray-dark);
    border-radius: 4px;
}

    .empty-text-container i[b-q7ghxhxfs2] {
        opacity: 0.5;
        margin-bottom: 1rem;
        color: var(--palette-gray-mid);
    }

/* === Responsividad (Afecta principalmente al header) === */
@media (max-width: 768px) {
    .editor-header[b-q7ghxhxfs2] {
        align-items: flex-start; /* Alinear texto a la izquierda */
        flex-direction: column;
        gap: 1rem;
    }

    .header-actions[b-q7ghxhxfs2] {
        width: 100%;
        justify-content: flex-start; /* Botón a la izquierda */
    }
}

/* Utilidades */
.text-muted[b-q7ghxhxfs2] {
    color: var(--palette-gray-mid);
}
/* _content/ImagineTheFuture.BlazorServer/Pages/Admin/WorksiteEditor.razor.rz.scp.css */
/*
 * WorksiteEditor.razor.css
 * Estilos Industrial Edition (Locked Fields)
 */

.font-montserrat[b-mf709vyli8] {
    font-family: 'Montserrat', sans-serif;
}

/* HEADER */
.editor-header[b-mf709vyli8] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 2rem;
    padding-bottom: 1.5rem;
    border-bottom: 1px solid var(--palette-gray-dark);
}

    .editor-header h1[b-mf709vyli8] {
        margin: 0;
        font-size: 1.75rem;
        font-weight: 700;
        color: var(--palette-white);
        text-transform: uppercase;
        letter-spacing: 0.05em;
    }

.header-actions[b-mf709vyli8] {
    display: flex;
    gap: 0.75rem;
}

/* BOTONES */
.btn-cancel[b-mf709vyli8], .btn-save[b-mf709vyli8] {
    padding: 0.6rem 1.2rem;
    font-family: 'Montserrat', sans-serif;
    font-weight: 700;
    border-radius: 2px;
    border: 1px solid transparent;
    cursor: pointer;
    transition: all 0.2s ease;
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    text-transform: uppercase;
    font-size: 0.85rem;
}

.btn-cancel[b-mf709vyli8] {
    background-color: transparent;
    color: var(--palette-gray-light);
    border-color: var(--palette-gray-mid);
}

    .btn-cancel:hover[b-mf709vyli8] {
        background-color: var(--palette-gray-darker);
        color: var(--palette-white);
    }

.btn-save[b-mf709vyli8] {
    background-color: var(--palette-primary);
    color: var(--palette-white);
    position: relative;
    box-shadow: 0 4px 10px rgba(0, 163, 224, 0.3);
}

    .btn-save:hover[b-mf709vyli8] {
        background-color: #0088BE;
        transform: translateY(-1px);
    }

    .btn-save.is-loading[b-mf709vyli8] {
        cursor: not-allowed;
        filter: brightness(0.9);
    }

        .btn-save.is-loading > *[b-mf709vyli8] {
            visibility: hidden;
        }

        .btn-save.is-loading[b-mf709vyli8]::after {
            content: '';
            position: absolute;
            width: 1.2rem;
            height: 1.2rem;
            top: calc(50% - 0.6rem);
            left: calc(50% - 0.6rem);
            border: 2px solid rgba(255,255,255,0.1);
            border-top-color: var(--palette-white);
            border-radius: 50%;
            animation: spin-b-mf709vyli8 0.8s ease-in-out infinite;
        }

@keyframes spin-b-mf709vyli8 {
    to {
        transform: rotate(360deg);
    }
}

/* LAYOUT */
.editor-stacked-layout[b-mf709vyli8] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 2rem;
    width: 100%;
}

.stacked-panel[b-mf709vyli8] {
    width: 100%;
}

.form-section[b-mf709vyli8] {
    max-width: 800px;
    background-color: var(--palette-carbon-deep);
    border: 1px solid var(--palette-gray-dark);
    border-radius: 4px;
    padding: 2rem;
    box-shadow: 0 10px 30px rgba(0,0,0,0.5);
}

    .form-section h4[b-mf709vyli8] {
        margin-top: 0;
        margin-bottom: 1.5rem;
        padding-bottom: 0.75rem;
        border-bottom: 1px solid var(--palette-gray-dark);
        font-family: 'Montserrat', sans-serif;
        color: var(--palette-primary);
        font-weight: 700;
        text-transform: uppercase;
        font-size: 1rem;
    }

.form-group[b-mf709vyli8] {
    margin-bottom: 1.5rem;
}

.form-actions[b-mf709vyli8] {
    margin-top: 2rem;
    padding-top: 1.5rem;
    border-top: 1px solid var(--palette-gray-dark);
    display: flex;
    justify-content: flex-end;
}

.separator[b-mf709vyli8] {
    border: 0;
    border-top: 1px solid var(--palette-gray-dark);
    margin: 2rem 0;
    opacity: 0.5;
}

/* MAPA INPUT */
.map-input-group[b-mf709vyli8] {
    display: flex;
    gap: 0.5rem;
    align-items: stretch;
}

.input-wrapper[b-mf709vyli8] {
    position: relative;
    flex-grow: 1;
}

.lock-icon[b-mf709vyli8] {
    position: absolute;
    right: 10px;
    top: 10px;
    color: var(--palette-gray-mid);
    font-size: 0.9rem;
    opacity: 0.7;
}

.btn-map-trigger[b-mf709vyli8] {
    background-color: var(--palette-primary);
    color: white;
    border: none;
    border-radius: 2px;
    padding: 0 1.5rem;
    cursor: pointer;
    font-family: 'Montserrat', sans-serif;
    font-weight: 600;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 0.3rem;
    transition: background 0.2s;
    min-width: 100px;
}

    .btn-map-trigger:hover[b-mf709vyli8] {
        background-color: #0088BE;
    }

    .btn-map-trigger i[b-mf709vyli8] {
        font-size: 1.2rem;
    }

    .btn-map-trigger span[b-mf709vyli8] {
        font-size: 0.7rem;
        text-transform: uppercase;
    }

.help-text[b-mf709vyli8] {
    color: var(--palette-gray-light);
    font-size: 0.8rem;
    font-style: italic;
    margin-top: 0.5rem;
    display: block;
}

/* Grid */
.grid[b-mf709vyli8] {
    display: grid;
}

.grid-cols-1[b-mf709vyli8] {
    grid-template-columns: repeat(1, minmax(0, 1fr));
}

.gap-4[b-mf709vyli8] {
    gap: 1rem;
}

@media (min-width: 640px) {
    .sm\:grid-cols-3[b-mf709vyli8] {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

/* INPUTS */
[b-mf709vyli8] label {
    display: block;
    margin-bottom: 0.5rem;
    font-weight: 600;
    font-size: 0.8rem;
    color: var(--palette-primary);
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

[b-mf709vyli8] .form-control {
    display: block;
    width: 100%;
    padding: 0.75rem 1rem;
    font-size: 0.95rem;
    font-family: 'Montserrat', sans-serif;
    color: var(--palette-white);
    background-color: rgba(0, 0, 0, 0.3);
    border: 1px solid var(--palette-gray-mid);
    border-radius: 2px;
    transition: all .15s ease-in-out;
}

    [b-mf709vyli8] .form-control:focus {
        border-color: var(--palette-primary);
        outline: 0;
        box-shadow: 0 0 0 1px var(--palette-primary);
        background-color: rgba(0, 0, 0, 0.5);
    }

    /* ESTILO LOCKED / READONLY */
    [b-mf709vyli8] .form-control.locked-input,
    [b-mf709vyli8] .form-control[readonly],
    [b-mf709vyli8] .form-control:disabled {
        background-color: rgba(255, 255, 255, 0.05);
        color: var(--palette-gray-light);
        border-color: var(--palette-gray-dark);
        cursor: not-allowed;
        font-family: 'Consolas', monospace;
    }

[b-mf709vyli8] .validation-message {
    color: var(--palette-danger);
    font-size: .75rem;
    margin-top: .25rem;
    font-weight: 500;
}

/* RESPONSIVE */
@media (max-width: 768px) {
    .editor-header[b-mf709vyli8] {
        align-items: flex-start;
        flex-direction: column;
        gap: 1rem;
    }

    .header-actions[b-mf709vyli8] {
        width: 100%;
        justify-content: flex-start;
    }

    .form-section[b-mf709vyli8] {
        padding: 1.5rem;
    }

    .map-input-group[b-mf709vyli8] {
        flex-direction: column;
    }

    .btn-map-trigger[b-mf709vyli8] {
        width: 100%;
        padding: 1rem;
        flex-direction: row;
    }
}

.empty-text-container[b-mf709vyli8] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 4rem 2rem;
    text-align: center;
    color: var(--palette-gray-light);
    background-color: rgba(255, 255, 255, 0.02);
    border: 2px dashed var(--palette-gray-dark);
    border-radius: 4px;
}

    .empty-text-container i[b-mf709vyli8] {
        opacity: 0.5;
        margin-bottom: 1rem;
        color: var(--palette-gray-mid);
    }

.animate-fade-in[b-mf709vyli8] {
    animation: fadeIn-b-mf709vyli8 0.4s ease-out forwards;
}

@keyframes fadeIn-b-mf709vyli8 {
    from {
        opacity: 0;
        transform: translateY(10px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}
/* _content/ImagineTheFuture.BlazorServer/Pages/Auth/LoginPage.razor.rz.scp.css */
/* =================================================================
   PÁGINA DE LOGIN (/ingresar) - Estilo Unificado (Energy Edition)
   ================================================================= */

/* Contenedor de Página Completa (Centrado) */
.auth-page-container[b-37woiknqhm] {
    display: flex;
    justify-content: center;
    align-items: center;
    min-height: 85vh;
    padding: 1rem;
    /* Fondo oscuro base o transparente si el layout ya tiene fondo */
    background-color: transparent;
}

/* Tarjeta Principal */
.auth-card[b-37woiknqhm] {
    width: 100%;
    max-width: 450px;
    /* Adaptado a Theme Industrial: Fondo oscuro con transparencia */
    background-color: rgba(18, 18, 18, 0.95);
    border: 1px solid rgba(255, 255, 255, 0.1);
    /* Radio más cerrado para look técnico (antes 8px) */
    border-radius: 4px;
    padding: 2.5rem 2rem;
    box-shadow: 0 20px 50px rgba(0,0,0,0.7);
    position: relative;
    backdrop-filter: blur(10px);
}

    /* Decoración Superior Industrial */
    .auth-card[b-37woiknqhm]::before {
        content: '';
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 3px;
        background: var(--palette-primary);
        box-shadow: 0 0 10px var(--palette-primary);
    }

/* Animación de Entrada */
.animate-fade-in[b-37woiknqhm] {
    animation: fadeIn-b-37woiknqhm 0.5s ease-out forwards;
}

@keyframes fadeIn-b-37woiknqhm {
    from {
        opacity: 0;
        transform: translateY(10px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* --- Títulos --- */
.auth-title[b-37woiknqhm] {
    text-align: center;
    font-size: 2rem;
    font-weight: 800; /* Más bold para industrial */
    color: var(--palette-white);
    margin-bottom: 0.5rem;
    font-family: 'Montserrat', sans-serif;
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

.auth-subtitle[b-37woiknqhm] {
    text-align: center;
    color: var(--palette-gray-light);
    margin-bottom: 2rem;
    font-size: 0.95rem;
    font-family: 'Montserrat', sans-serif;
    opacity: 0.8;
}

/* --- Botón Google "Sabroso" (Material Style) --- */
/* Mantenemos estructura, ajustamos hover para tema oscuro */
.btn-google-tasty[b-37woiknqhm] {
    width: 100%;
    background-color: #ffffff;
    color: #3c4043;
    border: none;
    border-radius: 2px; /* Más cuadrado */
    padding: 2px;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    font-family: 'Roboto', 'Montserrat', sans-serif;
    font-weight: 500;
    font-size: 1rem;
    cursor: pointer;
    box-shadow: 0 1px 3px rgba(0,0,0,0.25);
    transition: box-shadow 0.2s ease, background-color 0.2s;
    height: 44px;
    margin-bottom: 0.5rem;
}

    .btn-google-tasty:hover[b-37woiknqhm] {
        box-shadow: 0 2px 5px rgba(0,0,0,0.3);
        background-color: #f8faff;
    }

    .btn-google-tasty:active[b-37woiknqhm] {
        background-color: #eee;
        box-shadow: 0 1px 2px rgba(0,0,0,0.2);
    }

.google-icon-wrapper[b-37woiknqhm] {
    width: 40px;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: white;
    border-radius: 2px;
    margin-right: 12px;
}

    .google-icon-wrapper img[b-37woiknqhm] {
        width: 18px;
        height: 18px;
    }

.btn-text[b-37woiknqhm] {
    flex-grow: 1;
    text-align: center;
    padding-right: 40px;
}

/* --- Divisor --- */
.auth-divider[b-37woiknqhm] {
    display: flex;
    align-items: center;
    text-align: center;
    margin: 1.5rem 0;
    color: var(--palette-gray-mid);
    opacity: 0.8;
}

    .auth-divider[b-37woiknqhm]::before,
    .auth-divider[b-37woiknqhm]::after {
        content: '';
        flex: 1;
        border-bottom: 1px solid rgba(255, 255, 255, 0.1);
    }

    .auth-divider span[b-37woiknqhm] {
        padding: 0 10px;
        font-size: 0.75rem;
        text-transform: uppercase;
        letter-spacing: 0.1em;
        font-weight: 600;
    }

/* --- Inputs --- */
.form-group[b-37woiknqhm] {
    margin-bottom: 1.25rem;
}

    .form-group label[b-37woiknqhm] {
        display: block;
        margin-bottom: 0.4rem;
        color: var(--palette-primary); /* Azul Eléctrico */
        font-size: 0.8rem;
        font-weight: 600;
        text-transform: uppercase;
        letter-spacing: 0.05em;
    }

[b-37woiknqhm] .form-control {
    width: 100%;
    padding: 0.8rem 1rem;
    background-color: rgba(0, 0, 0, 0.3); /* Fondo Input Dark */
    border: 1px solid rgba(255, 255, 255, 0.15);
    border-radius: 2px; /* Cuadrado industrial */
    color: var(--palette-white);
    font-family: 'Montserrat', sans-serif;
    font-size: 1rem;
    transition: all 0.3s ease;
}

    [b-37woiknqhm] .form-control:focus {
        border-color: var(--palette-primary);
        background-color: rgba(0, 0, 0, 0.5);
        box-shadow: 0 0 0 2px rgba(0, 163, 224, 0.2); /* Glow azul */
        outline: none;
    }

    [b-37woiknqhm] .form-control::placeholder {
        color: rgba(255, 255, 255, 0.3);
    }

/* --- Fila de Opciones (STACK VERTICAL) --- */
.options-stack[b-37woiknqhm] {
    display: flex;
    flex-direction: column;
    gap: 0.8rem;
    margin-bottom: 1.5rem;
    align-items: flex-start;
}

/* Contenedor del Checkbox + Texto */
.checkbox-container[b-37woiknqhm] {
    display: flex;
    align-items: center;
    gap: 0.6rem;
    cursor: pointer;
}

/* Checkbox Personalizado */
[b-37woiknqhm] .form-check-input {
    background-color: transparent;
    border: 1.5px solid rgba(255, 255, 255, 0.4);
    width: 1.2em;
    height: 1.2em;
    flex-shrink: 0;
    appearance: none;
    -webkit-appearance: none;
    border-radius: 2px; /* Cuadrado */
    cursor: pointer;
    margin: 0;
    position: relative;
    transition: all 0.2s ease;
}

    [b-37woiknqhm] .form-check-input:checked {
        background-color: var(--palette-primary);
        border-color: var(--palette-primary);
        /* SVG Encodeado (Checkmark blanco) */
        background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3e%3cpath fill='none' stroke='%23fff' stroke-linecap='round' stroke-linejoin='round' stroke-width='3' d='M6 10l3 3l6-6'/%3e%3c/svg%3e");
        background-size: 70%;
        background-position: center;
        background-repeat: no-repeat;
        box-shadow: 0 0 10px rgba(0, 163, 224, 0.4);
    }

.checkbox-label[b-37woiknqhm] {
    color: var(--palette-soft-white);
    font-size: 0.9rem;
    cursor: pointer;
    user-select: none;
}

.forgot-link[b-37woiknqhm] {
    color: var(--palette-gray-light);
    font-size: 0.85rem;
    opacity: 0.9;
    text-decoration: none;
    transition: color 0.2s;
    margin-left: 2px;
}

    .forgot-link:hover[b-37woiknqhm] {
        opacity: 1;
        color: var(--palette-primary);
        text-decoration: none;
    }

/* --- Botón Primario (Email) --- */
.btn-primary-custom[b-37woiknqhm] {
    width: 100%;
    padding: 0.9rem;
    /* Cambio clave: de 50px (boda) a 2px (industrial) */
    border-radius: 2px;
    border: none;
    font-family: 'Montserrat', sans-serif;
    font-weight: 700;
    cursor: pointer;
    background-color: var(--palette-primary);
    color: var(--palette-white); /* Texto blanco para contraste con azul */
    font-size: 1rem;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    box-shadow: 0 4px 15px rgba(0,0,0,0.3);
}

    .btn-primary-custom:hover[b-37woiknqhm] {
        background-color: #0088BE; /* Azul un poco más oscuro */
        box-shadow: 0 0 20px rgba(0, 163, 224, 0.4); /* Resplandor */
        transform: translateY(-2px);
    }

    .btn-primary-custom:disabled[b-37woiknqhm] {
        opacity: 0.6;
        cursor: not-allowed;
        background-color: var(--palette-gray-mid);
        box-shadow: none;
        transform: none;
    }

/* --- Footer --- */
.text-gold[b-37woiknqhm] {
    /* Mantuve la clase pero cambié el color a Primary */
    color: var(--palette-primary) !important;
}

    .text-gold:hover[b-37woiknqhm] {
        color: var(--palette-white) !important;
        text-decoration: none !important;
    }

.auth-footer[b-37woiknqhm] {
    margin-top: 2rem;
}

/* Alertas */
.alert[b-37woiknqhm] {
    padding: 0.75rem 1rem;
    border-radius: 2px;
    margin-bottom: 1rem;
    font-size: 0.9rem;
}

.alert-danger[b-37woiknqhm] {
    background-color: rgba(229, 62, 62, 0.15);
    color: #ff6b6b;
    border: 1px solid #e53e3e;
    border-left: 3px solid #e53e3e; /* Estilo técnico */
}

/* Spinner */
.spinner-border-sm[b-37woiknqhm] {
    width: 1.2rem;
    height: 1.2rem;
    border: 2px solid rgba(255,255,255,0.3);
    border-top: 2px solid white; /* Spinner blanco más limpio */
    border-radius: 50%;
    animation: spin-b-37woiknqhm 0.75s linear infinite;
    margin-right: 0.5rem;
}

@keyframes spin-b-37woiknqhm {
    to {
        transform: rotate(360deg);
    }
}

/* Responsive */
@media (max-width: 576px) {
    .auth-card[b-37woiknqhm] {
        padding: 1.5rem;
    }

    .auth-title[b-37woiknqhm] {
        font-size: 1.7rem;
    }
}
/* _content/ImagineTheFuture.BlazorServer/Pages/Auth/RegisterPage.razor.rz.scp.css */
/* =================================================================
   PÁGINA DE REGISTRO (/unirse) - Estilo Unificado (Energy Edition)
   ================================================================= */

/* Contenedor de Página Completa */
.auth-page-container[b-yokxpdkf61] {
    display: flex;
    justify-content: center;
    align-items: center;
    min-height: 85vh;
    padding: 1rem;
    background-color: transparent;
}

/* Tarjeta Principal */
.auth-card[b-yokxpdkf61] {
    width: 100%;
    max-width: 450px;
    /* Fondo oscuro industrial semi-transparente */
    background-color: rgba(18, 18, 18, 0.95);
    border: 1px solid rgba(255, 255, 255, 0.1);
    /* Radio más cerrado para look técnico */
    border-radius: 4px;
    padding: 2.5rem 2rem;
    box-shadow: 0 20px 50px rgba(0,0,0,0.7);
    position: relative;
    backdrop-filter: blur(10px);
}

    /* Decoración superior estilo Valan */
    .auth-card[b-yokxpdkf61]::before {
        content: '';
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 3px;
        background: var(--palette-primary);
        box-shadow: 0 0 10px var(--palette-primary);
    }

/* Animación */
.animate-fade-in[b-yokxpdkf61] {
    animation: fadeIn-b-yokxpdkf61 0.5s ease-out forwards;
}

@keyframes fadeIn-b-yokxpdkf61 {
    from {
        opacity: 0;
        transform: translateY(10px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* --- Títulos --- */
.auth-title[b-yokxpdkf61] {
    text-align: center;
    font-size: 2rem;
    font-weight: 800; /* Extra bold para industrial */
    color: var(--palette-white);
    margin-bottom: 0.5rem;
    font-family: 'Montserrat', sans-serif;
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

.auth-subtitle[b-yokxpdkf61] {
    text-align: center;
    color: var(--palette-gray-light);
    margin-bottom: 2rem;
    font-size: 0.95rem;
    font-family: 'Montserrat', sans-serif;
    opacity: 0.8;
}

/* --- Botón Google "Sabroso" (Material Style) --- */
.btn-google-tasty[b-yokxpdkf61] {
    width: 100%;
    background-color: #ffffff;
    color: #3c4043;
    border: none;
    border-radius: 2px; /* Cuadrado técnico */
    padding: 2px;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    font-family: 'Roboto', 'Montserrat', sans-serif;
    font-weight: 500;
    font-size: 1rem;
    cursor: pointer;
    box-shadow: 0 1px 3px rgba(0,0,0,0.25);
    transition: box-shadow 0.2s ease, background-color 0.2s;
    height: 44px;
    margin-bottom: 0.5rem;
}

    .btn-google-tasty:hover[b-yokxpdkf61] {
        box-shadow: 0 2px 5px rgba(0,0,0,0.3);
        background-color: #f8faff;
    }

    .btn-google-tasty:active[b-yokxpdkf61] {
        background-color: #eee;
        box-shadow: 0 1px 2px rgba(0,0,0,0.2);
    }

.google-icon-wrapper[b-yokxpdkf61] {
    width: 40px;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: white;
    border-radius: 2px;
    margin-right: 12px;
}

    .google-icon-wrapper img[b-yokxpdkf61] {
        width: 18px;
        height: 18px;
    }

.btn-text[b-yokxpdkf61] {
    flex-grow: 1;
    text-align: center;
    padding-right: 40px;
}

/* --- Divisor --- */
.auth-divider[b-yokxpdkf61] {
    display: flex;
    align-items: center;
    text-align: center;
    margin: 1.5rem 0;
    color: var(--palette-gray-mid);
    opacity: 0.8;
}

    .auth-divider[b-yokxpdkf61]::before,
    .auth-divider[b-yokxpdkf61]::after {
        content: '';
        flex: 1;
        border-bottom: 1px solid rgba(255, 255, 255, 0.1);
    }

    .auth-divider span[b-yokxpdkf61] {
        padding: 0 10px;
        font-size: 0.75rem;
        text-transform: uppercase;
        letter-spacing: 0.1em;
        font-weight: 600;
    }

/* --- Inputs --- */
.form-group[b-yokxpdkf61] {
    margin-bottom: 1.25rem;
}

    .form-group label[b-yokxpdkf61] {
        display: block;
        margin-bottom: 0.4rem;
        color: var(--palette-primary); /* Azul Eléctrico */
        font-size: 0.8rem;
        font-weight: 600;
        text-transform: uppercase;
        letter-spacing: 0.05em;
    }

[b-yokxpdkf61] .form-control {
    width: 100%;
    padding: 0.8rem 1rem;
    background-color: rgba(0, 0, 0, 0.3); /* Fondo Input Dark */
    border: 1px solid rgba(255, 255, 255, 0.15);
    border-radius: 2px; /* Cuadrado industrial */
    color: var(--palette-white);
    font-family: 'Montserrat', sans-serif;
    font-size: 1rem;
    transition: all 0.3s ease;
}

    [b-yokxpdkf61] .form-control:focus {
        border-color: var(--palette-primary);
        background-color: rgba(0, 0, 0, 0.5);
        box-shadow: 0 0 0 2px rgba(0, 163, 224, 0.2); /* Glow azul */
        outline: none;
    }

    [b-yokxpdkf61] .form-control::placeholder {
        color: rgba(255, 255, 255, 0.3);
    }

/* Validaciones */
[b-yokxpdkf61] .validation-message {
    color: var(--palette-danger);
    font-size: 0.8rem;
    margin-top: 0.3rem;
    font-weight: 500;
}

/* --- Botones --- */
.form-actions-auth[b-yokxpdkf61] {
    margin-top: 1.5rem;
}

.btn-primary-custom[b-yokxpdkf61] {
    width: 100%;
    padding: 0.9rem;
    border-radius: 2px; /* Cambio clave: Industrial */
    border: none;
    font-family: 'Montserrat', sans-serif;
    font-weight: 700;
    cursor: pointer;
    background-color: var(--palette-primary);
    color: var(--palette-white); /* Texto blanco para contraste */
    font-size: 1rem;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    box-shadow: 0 4px 15px rgba(0,0,0,0.3);
}

    .btn-primary-custom:hover[b-yokxpdkf61] {
        background-color: #0088BE; /* Azul un poco más oscuro */
        box-shadow: 0 0 20px rgba(0, 163, 224, 0.4); /* Resplandor */
        transform: translateY(-2px);
    }

    .btn-primary-custom:disabled[b-yokxpdkf61] {
        opacity: 0.6;
        cursor: not-allowed;
        background-color: var(--palette-gray-mid);
        box-shadow: none;
        transform: none;
    }

/* --- Footer --- */
.auth-footer[b-yokxpdkf61] {
    margin-top: 2rem;
}

.text-gold[b-yokxpdkf61] {
    /* Mantenemos el nombre de clase pero cambiamos el color a Primary */
    color: var(--palette-primary) !important;
}

    .text-gold:hover[b-yokxpdkf61] {
        color: var(--palette-white) !important;
        text-decoration: none !important;
    }

/* Alertas */
.alert[b-yokxpdkf61] {
    padding: 0.75rem 1rem;
    border-radius: 2px;
    margin-bottom: 1rem;
    font-size: 0.9rem;
}

.alert-danger[b-yokxpdkf61] {
    background-color: rgba(229, 62, 62, 0.15);
    color: #ff6b6b;
    border: 1px solid #e53e3e;
    border-left: 3px solid #e53e3e; /* Estilo técnico */
}

/* Spinner */
.spinner-border-sm[b-yokxpdkf61] {
    width: 1.2rem;
    height: 1.2rem;
    border: 2px solid rgba(255,255,255,0.3);
    border-top: 2px solid white; /* Spinner blanco más limpio */
    border-radius: 50%;
    animation: spin-b-yokxpdkf61 0.75s linear infinite;
    margin-right: 0.5rem;
}

@keyframes spin-b-yokxpdkf61 {
    to {
        transform: rotate(360deg);
    }
}

/* Responsive */
@media (max-width: 576px) {
    .auth-card[b-yokxpdkf61] {
        padding: 1.5rem;
    }

    .auth-title[b-yokxpdkf61] {
        font-size: 1.7rem;
    }
}
/* _content/ImagineTheFuture.BlazorServer/Pages/Client/ClientBusinessProfile.razor.rz.scp.css */
/*
 * ClientBusinessProfile.razor.css
 * Estilo: Engineering Blueprint (Light) - Versión Lite (Solo Datos)
 */

.business-profile-container[b-zpnn1u1e6w] {
    max-width: 1000px;
    margin: 0 auto;
    padding-bottom: 2rem;
    /* [AJUSTE] Separación superior para que no choque con la TopBar */
    margin-top: 2rem;
}

/* Header */
.profile-header[b-zpnn1u1e6w] {
    margin-bottom: 2rem;
    border-bottom: 1px solid #E5E7EB;
    padding-bottom: 1rem;
}

.profile-title[b-zpnn1u1e6w] {
    font-family: 'Montserrat', sans-serif;
    font-weight: 700;
    color: var(--palette-carbon-deep);
    font-size: 1.8rem;
    margin: 0;
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

.profile-subtitle[b-zpnn1u1e6w] {
    color: var(--palette-gray-mid);
    font-size: 0.95rem;
    margin-top: 0.5rem;
}

/* Grid Layout */
.profile-grid[b-zpnn1u1e6w] {
    display: grid;
    grid-template-columns: 1fr;
    gap: 1.5rem;
}

@media (min-width: 992px) {
    .profile-grid[b-zpnn1u1e6w] {
        grid-template-columns: 2fr 1fr;
    }
}

/* Tarjetas */
.content-card[b-zpnn1u1e6w] {
    background-color: #FFFFFF;
    border: 1px solid #E5E7EB;
    border-radius: 4px;
    box-shadow: 0 2px 10px rgba(0,0,0,0.03);
    overflow: hidden;
}

.card-header[b-zpnn1u1e6w] {
    background-color: #F9FAFB;
    padding: 1rem 1.5rem;
    border-bottom: 1px solid #E5E7EB;
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

    .card-header h4[b-zpnn1u1e6w] {
        margin: 0;
        font-size: 1rem;
        font-weight: 700;
        color: var(--palette-primary);
        text-transform: uppercase;
        letter-spacing: 0.05em;
    }

    .card-header i[b-zpnn1u1e6w] {
        color: var(--palette-gray-mid);
    }

.card-body[b-zpnn1u1e6w] {
    padding: 1.5rem;
}

    .card-body.text-center[b-zpnn1u1e6w] {
        text-align: center;
    }

/* --- FORMULARIOS --- */
.form-group[b-zpnn1u1e6w] {
    margin-bottom: 1.25rem;
}

[b-zpnn1u1e6w] label {
    display: block;
    margin-bottom: 0.4rem;
    font-weight: 600;
    font-size: 0.8rem;
    color: var(--palette-gray-mid);
    text-transform: uppercase;
}

[b-zpnn1u1e6w] .form-control {
    width: 100%;
    padding: 0.7rem 1rem;
    font-size: 0.95rem;
    background-color: #FFFFFF;
    border: 1px solid #D1D5DB;
    border-radius: 2px;
    color: var(--palette-carbon-deep);
    transition: all 0.2s;
}

    [b-zpnn1u1e6w] .form-control:focus {
        border-color: var(--palette-primary);
        box-shadow: 0 0 0 1px var(--palette-primary);
        outline: none;
    }

[b-zpnn1u1e6w] .validation-message {
    color: var(--palette-danger);
    font-size: 0.75rem;
    margin-top: 0.25rem;
}

.btn-save[b-zpnn1u1e6w] {
    background-color: var(--palette-primary);
    color: white;
    border: none;
    padding: 0.7rem 1.5rem;
    border-radius: 2px;
    font-weight: 700;
    text-transform: uppercase;
    cursor: pointer;
    display: flex;
    align-items: center;
    gap: 0.5rem;
    transition: background 0.2s;
}

    .btn-save:hover[b-zpnn1u1e6w] {
        background-color: #0088BE;
    }

    .btn-save:disabled[b-zpnn1u1e6w] {
        opacity: 0.6;
        cursor: not-allowed;
        background-color: var(--palette-gray-mid);
    }

.form-actions[b-zpnn1u1e6w] {
    display: flex;
    justify-content: flex-end;
    margin-top: 2rem;
    border-top: 1px solid #E5E7EB;
    padding-top: 1.5rem;
}

/* Facturación */
.billing-card[b-zpnn1u1e6w] {
    border-top: 3px solid var(--palette-gray-light);
}

.billing-icon[b-zpnn1u1e6w] {
    font-size: 3rem;
    color: #E5E7EB;
    margin-bottom: 1rem;
}

.btn-secondary[b-zpnn1u1e6w] {
    background: #E5E7EB;
    color: #9CA3AF;
    border: none;
    padding: 0.6rem 1.2rem;
    border-radius: 2px;
    cursor: default;
    font-size: 0.85rem;
    font-weight: 600;
}

.text-muted[b-zpnn1u1e6w] {
    color: var(--palette-gray-light);
    font-style: italic;
    margin-bottom: 1.5rem;
    font-size: 0.9rem;
}

.animate-fade-in[b-zpnn1u1e6w] {
    animation: fadeIn-b-zpnn1u1e6w 0.4s ease-out;
}

@keyframes fadeIn-b-zpnn1u1e6w {
    from {
        opacity: 0;
        transform: translateY(10px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* Muro de Seguridad (Estilo Cliente) */
.client-security-wall[b-zpnn1u1e6w] {
    display: flex;
    justify-content: center;
    align-items: center;
    min-height: 60vh;
    padding: 2rem;
}

.wall-content[b-zpnn1u1e6w] {
    background-color: #FFFFFF;
    border: 2px dashed #E5E7EB;
    border-radius: 4px;
    padding: 3rem 2rem;
    text-align: center;
    max-width: 450px;
    width: 100%;
}

.wall-icon-wrapper[b-zpnn1u1e6w] {
    font-size: 3rem;
    color: var(--palette-gray-light);
    margin-bottom: 1rem;
}

.wall-title[b-zpnn1u1e6w] {
    font-family: 'Montserrat', sans-serif;
    font-weight: 700;
    color: var(--palette-carbon-deep);
    margin-bottom: 0.5rem;
    text-transform: uppercase;
}

.wall-message[b-zpnn1u1e6w] {
    color: var(--palette-gray-mid);
    margin-bottom: 2rem;
}

.wall-form-wrapper[b-zpnn1u1e6w] {
    text-align: left;
    background-color: #F9FAFB;
    padding: 1.5rem;
    border-radius: 4px;
    border: 1px solid #E5E7EB;
}
/* _content/ImagineTheFuture.BlazorServer/Pages/Employee/AttendanceReportDashboard.razor.rz.scp.css */
.report-container[b-cf4e8byxij] {
    max-width: 1400px;
    margin: 0 auto;
    padding-top: 2rem;
    padding-bottom: 3rem;
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
    height: calc(100vh - 140px);
}

.report-header h1[b-cf4e8byxij] {
    margin: 0;
    font-size: 1.5rem;
    color: var(--employee-text-main);
    font-family: 'Montserrat', sans-serif;
    font-weight: 700;
    text-transform: uppercase;
}

.report-header p[b-cf4e8byxij] {
    margin: 0;
    color: var(--employee-text-secondary);
    font-size: 0.9rem;
}

/* Filtros */
.filters-card[b-cf4e8byxij] {
    background-color: #FFFFFF;
    border: 1px solid var(--employee-border);
    border-radius: 6px;
    padding: 1rem;
    display: flex;
    gap: 1rem;
    align-items: flex-end;
    flex-wrap: wrap;
    box-shadow: var(--employee-shadow);
}

.filter-group[b-cf4e8byxij] {
    display: flex;
    flex-direction: column;
    gap: 0.3rem;
    flex: 1;
    min-width: 150px;
}

    .filter-group label[b-cf4e8byxij] {
        font-size: 0.7rem;
        text-transform: uppercase;
        font-weight: 700;
        color: var(--employee-text-secondary);
    }

.form-control[b-cf4e8byxij] {
    width: 100%;
    padding: 0.5rem;
    border: 1px solid #CBD5E1;
    border-radius: 4px;
    font-size: 0.9rem;
    color: var(--employee-text-main);
}

.filter-actions[b-cf4e8byxij] {
    display: flex;
    gap: 0.5rem;
}

.btn-search[b-cf4e8byxij] {
    background-color: var(--palette-gray-darker);
    color: white;
    border: none;
    padding: 0.6rem 1.2rem;
    border-radius: 4px;
    font-weight: 600;
    cursor: pointer;
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.btn-excel[b-cf4e8byxij] {
    background-color: #107C41;
    color: white;
    border: none;
    padding: 0.6rem 1.2rem;
    border-radius: 4px;
    font-weight: 600;
    cursor: pointer;
    display: flex;
    align-items: center;
    gap: 0.5rem;
    transition: background 0.2s;
}

    .btn-excel:hover:not(:disabled)[b-cf4e8byxij] {
        background-color: #0b5e30;
    }

    .btn-excel:disabled[b-cf4e8byxij] {
        opacity: 0.6;
        cursor: not-allowed;
    }

/* Resultados */
.results-card[b-cf4e8byxij] {
    background-color: #FFFFFF;
    border: 1px solid var(--employee-border);
    border-radius: 6px;
    flex-grow: 1;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    box-shadow: var(--employee-shadow);
}

.table-responsive-wrapper[b-cf4e8byxij] {
    overflow: auto;
    flex-grow: 1;
}

.report-table[b-cf4e8byxij] {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.85rem;
}

    .report-table th[b-cf4e8byxij] {
        position: sticky;
        top: 0;
        background-color: #F1F5F9;
        color: var(--employee-text-main);
        font-weight: 700;
        text-transform: uppercase;
        padding: 0.8rem;
        text-align: left;
        border-bottom: 2px solid #E2E8F0;
        z-index: 10;
        font-size: 0.75rem;
    }

    .report-table td[b-cf4e8byxij] {
        padding: 0.6rem 0.8rem;
        border-bottom: 1px solid #F1F5F9;
        color: var(--employee-text-main);
        vertical-align: middle;
    }

    .report-table tr:hover[b-cf4e8byxij] {
        background-color: #F8FAFC;
    }

.font-mono[b-cf4e8byxij] {
    font-family: 'Consolas', monospace;
}

.emp-cell[b-cf4e8byxij] {
    display: flex;
    flex-direction: column;
    line-height: 1.2;
}

    .emp-cell .name[b-cf4e8byxij] {
        font-weight: 600;
    }

    .emp-cell small[b-cf4e8byxij] {
        color: var(--employee-text-secondary);
        font-size: 0.7rem;
    }

.badge-event[b-cf4e8byxij] {
    background-color: #E2E8F0;
    padding: 2px 6px;
    border-radius: 2px;
    font-size: 0.7rem;
    text-transform: uppercase;
    font-weight: 600;
}

.text-ok[b-cf4e8byxij] {
    color: #166534;
    font-weight: 600;
    font-size: 0.75rem;
}

.text-err[b-cf4e8byxij] {
    color: #DC2626;
    font-weight: 600;
    font-size: 0.75rem;
}

.loading-state[b-cf4e8byxij], .empty-state[b-cf4e8byxij] {
    padding: 3rem;
    text-align: center;
    color: var(--employee-text-secondary);
    font-style: italic;
}

/* Spinner */
.spinner-sm[b-cf4e8byxij] {
    width: 12px;
    height: 12px;
    border: 2px solid rgba(255,255,255,0.3);
    border-top: 2px solid white;
    border-radius: 50%;
    animation: spin-b-cf4e8byxij 1s linear infinite;
    display: inline-block;
}

@keyframes spin-b-cf4e8byxij {
    to {
        transform: rotate(360deg);
    }
}

/* Muro */
.staff-security-wall[b-cf4e8byxij] {
    display: flex;
    justify-content: center;
    align-items: center;
    height: 100%;
    padding: 2rem;
}

.wall-content[b-cf4e8byxij] {
    background-color: #FFFFFF;
    border: 2px dashed var(--employee-border);
    border-radius: 6px;
    padding: 3rem;
    text-align: center;
}

.wall-icon-wrapper.warning[b-cf4e8byxij] {
    color: #F59E0B;
    font-size: 3rem;
    margin-bottom: 1rem;
}

.wall-title[b-cf4e8byxij] {
    font-size: 1.5rem;
    margin-bottom: 0.5rem;
    color: var(--employee-text-main);
    font-family: 'Montserrat', sans-serif;
    font-weight: 700;
}

.wall-message[b-cf4e8byxij] {
    color: var(--employee-text-secondary);
    margin-bottom: 2rem;
}

.btn-secondary[b-cf4e8byxij] {
    background-color: #E2E8F0;
    color: var(--employee-text-main);
    padding: 0.6rem 1.2rem;
    text-decoration: none;
    border-radius: 4px;
    font-weight: 600;
}

.animate-fade-in[b-cf4e8byxij] {
    animation: fadeIn-b-cf4e8byxij 0.4s ease-out;
}

@keyframes fadeIn-b-cf4e8byxij {
    from {
        opacity: 0;
        transform: translateY(5px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@media (max-width: 768px) {
    .filters-card[b-cf4e8byxij] {
        flex-direction: column;
        align-items: stretch;
    }

    .filter-actions[b-cf4e8byxij] {
        justify-content: stretch;
    }

    .btn-search[b-cf4e8byxij], .btn-excel[b-cf4e8byxij] {
        flex: 1;
        justify-content: center;
    }
}
/* _content/ImagineTheFuture.BlazorServer/Pages/Employee/EmployeeIndex.razor.rz.scp.css */
/*
 * EmployeeIndex.razor.css
 * Estilo: Operational Command Center (Industrial)
 */

.dashboard-container[b-jp4nl651eq] {
    max-width: 1400px;
    margin: 0 auto;
    padding-bottom: 3rem;
    /* CORRECCIÓN: Espacio superior para despegar de la TopBar */
    margin-top: 2rem;
}

/* === HEADER === */
.dash-header[b-jp4nl651eq] {
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    margin-bottom: 2rem;
    padding: 0 0.5rem;
    flex-wrap: wrap;
    gap: 1rem;
}

.welcome-block h1[b-jp4nl651eq] {
    margin: 0;
    font-size: 1.8rem;
    color: var(--employee-text-main);
    font-weight: 800;
    font-family: 'Montserrat', sans-serif;
    text-transform: uppercase;
    letter-spacing: -0.02em;
    line-height: 1.1;
    margin-bottom: 0.5rem;
}

.date-badge[b-jp4nl651eq] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    background-color: #FFFFFF;
    border: 1px solid var(--employee-border);
    padding: 0.4rem 0.8rem;
    border-radius: 4px;
    color: var(--employee-text-secondary);
    font-size: 0.9rem;
    font-weight: 500;
    text-transform: capitalize;
    box-shadow: 0 2px 5px rgba(0,0,0,0.02);
}

    .date-badge i[b-jp4nl651eq] {
        color: var(--palette-primary);
    }

/* Badges GPS */
.badge-geo[b-jp4nl651eq] {
    padding: 0.5rem 1rem;
    border-radius: 50px;
    font-size: 0.8rem;
    font-weight: 700;
    text-transform: uppercase;
    display: flex;
    align-items: center;
    gap: 0.6rem;
    letter-spacing: 0.05em;
    box-shadow: 0 4px 10px rgba(0,0,0,0.05);
}

    .badge-geo.success[b-jp4nl651eq] {
        background-color: #F0FDF4;
        color: #15803D;
        border: 1px solid #BBF7D0;
    }

    .badge-geo.warning[b-jp4nl651eq] {
        background-color: #FEF2F2;
        color: #B91C1C;
        border: 1px solid #FECACA;
    }

.pulse-dot[b-jp4nl651eq] {
    width: 8px;
    height: 8px;
    background-color: #15803D;
    border-radius: 50%;
    box-shadow: 0 0 0 rgba(21, 128, 61, 0.4);
    animation: pulse-green-b-jp4nl651eq 2s infinite;
}

@keyframes pulse-green-b-jp4nl651eq {
    0% {
        box-shadow: 0 0 0 0 rgba(21, 128, 61, 0.4);
    }

    70% {
        box-shadow: 0 0 0 6px rgba(21, 128, 61, 0);
    }

    100% {
        box-shadow: 0 0 0 0 rgba(21, 128, 61, 0);
    }
}

/* === GRID === */
.dashboard-grid[b-jp4nl651eq] {
    display: grid;
    grid-template-columns: 1fr;
    gap: 1.5rem;
}

@media (min-width: 1024px) {
    .dashboard-grid[b-jp4nl651eq] {
        /* Mapa 65% - Bitácora 35% */
        grid-template-columns: 1.8fr 1fr;
        gap: 2rem;
    }
}

/* --- TARJETA DE ACCIÓN --- */
.action-card[b-jp4nl651eq] {
    background-color: #FFFFFF;
    border: 1px solid var(--employee-border);
    border-radius: 6px;
    overflow: hidden;
    box-shadow: var(--employee-shadow);
    display: flex;
    flex-direction: column;
    height: 100%;
}

.map-wrapper[b-jp4nl651eq] {
    height: 450px; /* Mapa alto y útil */
    background-color: #E5E7EB;
    position: relative;
}

@media (max-width: 768px) {
    .map-wrapper[b-jp4nl651eq] {
        height: 280px;
    }
}

/* Overlays Mapa */
.map-overlay-info[b-jp4nl651eq] {
    position: absolute;
    top: 1rem;
    left: 1rem;
    right: 1rem;
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    pointer-events: none;
    z-index: 10;
}

.site-tag[b-jp4nl651eq] {
    background-color: rgba(255, 255, 255, 0.95);
    padding: 0.5rem 1rem;
    border-radius: 4px;
    font-weight: 700;
    color: var(--palette-carbon-deep);
    font-size: 0.85rem;
    box-shadow: 0 4px 12px rgba(0,0,0,0.15);
    display: flex;
    align-items: center;
    gap: 0.5rem;
    backdrop-filter: blur(4px);
    pointer-events: auto;
}

    .site-tag i[b-jp4nl651eq] {
        color: var(--palette-primary);
    }

.distance-tag[b-jp4nl651eq] {
    padding: 0.4rem 0.8rem;
    border-radius: 50px;
    font-weight: 800;
    font-size: 0.8rem;
    font-family: 'Consolas', monospace;
    box-shadow: 0 4px 12px rgba(0,0,0,0.15);
    pointer-events: auto;
}

    .distance-tag.valid[b-jp4nl651eq] {
        background-color: #22C55E;
        color: white;
    }

    .distance-tag.invalid[b-jp4nl651eq] {
        background-color: #EF4444;
        color: white;
    }

.no-map-msg[b-jp4nl651eq] {
    height: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    color: var(--palette-gray-mid);
    gap: 1rem;
}

    .no-map-msg i[b-jp4nl651eq] {
        font-size: 3rem;
        opacity: 0.5;
    }

/* Botón Maestro */
.action-area[b-jp4nl651eq] {
    padding: 1.5rem;
    background-color: #F8FAFC;
    border-top: 1px solid var(--employee-border);
}

.btn-check-action[b-jp4nl651eq] {
    width: 100%;
    border: none;
    border-radius: 4px;
    padding: 0;
    overflow: hidden;
    cursor: pointer;
    box-shadow: 0 4px 6px rgba(0,0,0,0.1);
    transition: transform 0.1s, box-shadow 0.2s;
    background-color: transparent; /* El gradiente va en el hijo o clase especifica */
}

    .btn-check-action:active:not(:disabled)[b-jp4nl651eq] {
        transform: scale(0.98);
    }

    .btn-check-action:disabled[b-jp4nl651eq] {
        opacity: 0.6;
        cursor: not-allowed;
        filter: grayscale(1);
        box-shadow: none;
    }

.btn-content[b-jp4nl651eq] {
    padding: 1.5rem;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 1.2rem;
    color: white;
    font-family: 'Montserrat', sans-serif;
}

.icon-lg[b-jp4nl651eq] {
    font-size: 2rem;
}

.text-group[b-jp4nl651eq] {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    text-align: left;
}

.action-label[b-jp4nl651eq] {
    font-size: 1.4rem;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    line-height: 1;
}

.btn-subtext[b-jp4nl651eq] {
    font-size: 0.8rem;
    font-weight: 500;
    opacity: 0.9;
    margin-top: 4px;
}

/* Colores Botón */
.btn-check-in-start .btn-content[b-jp4nl651eq] {
    background: linear-gradient(135deg, #16a34a, #15803d);
}

.btn-check-in-lunch .btn-content[b-jp4nl651eq] {
    background: linear-gradient(135deg, #ea580c, #c2410c);
}

.btn-check-in-lunch-end .btn-content[b-jp4nl651eq] {
    background: linear-gradient(135deg, #2563eb, #1d4ed8);
}

.btn-check-in-end .btn-content[b-jp4nl651eq] {
    background: linear-gradient(135deg, #dc2626, #b91c1c);
}

.btn-disabled .btn-content[b-jp4nl651eq] {
    background-color: #94a3b8;
    cursor: default;
}

/* --- COLUMNA 2: BITÁCORA (TIMELINE) --- */
.timeline-card[b-jp4nl651eq] {
    background-color: #FFFFFF;
    border: 1px solid var(--employee-border);
    border-radius: 6px;
    height: 100%;
    display: flex;
    flex-direction: column;
    box-shadow: var(--employee-shadow);
}

.timeline-header[b-jp4nl651eq] {
    padding: 1rem 1.5rem;
    border-bottom: 1px solid var(--employee-border);
    background-color: #F8FAFC;
}

    .timeline-header h4[b-jp4nl651eq] {
        margin: 0;
        font-size: 1rem;
        color: var(--employee-text-secondary);
        text-transform: uppercase;
        font-weight: 700;
        letter-spacing: 0.05em;
    }

.timeline-body[b-jp4nl651eq] {
    padding: 1.5rem;
    flex-grow: 1;
    overflow-y: auto;
    max-height: 600px; /* Limite vertical en escritorio */
}

/* Feed Items */
.timeline-feed[b-jp4nl651eq] {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.feed-item[b-jp4nl651eq] {
    display: flex;
    gap: 1rem;
    padding: 1rem;
    border: 1px solid var(--employee-border);
    border-radius: 6px;
    background-color: #FFFFFF;
    transition: transform 0.2s;
}

    .feed-item:hover[b-jp4nl651eq] {
        transform: translateX(5px);
        border-color: var(--palette-primary);
    }

.feed-icon[b-jp4nl651eq] {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    font-size: 1.1rem;
}

    .feed-icon.entry[b-jp4nl651eq] {
        background-color: #F0FDF4;
        color: #166534;
    }

    .feed-icon.exit[b-jp4nl651eq] {
        background-color: #FEF2F2;
        color: #991B1B;
    }

    .feed-icon.lunch-start[b-jp4nl651eq] {
        background-color: #FFF7ED;
        color: #C2410C;
    }

    .feed-icon.lunch-end[b-jp4nl651eq] {
        background-color: #EFF6FF;
        color: #1D4ED8;
    }

.feed-content[b-jp4nl651eq] {
    flex-grow: 1;
    display: flex;
    flex-direction: column;
    gap: 0.3rem;
}

.feed-top[b-jp4nl651eq] {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
}

.event-type[b-jp4nl651eq] {
    font-weight: 700;
    color: var(--employee-text-main);
    font-size: 0.95rem;
}

.event-time[b-jp4nl651eq] {
    font-family: 'Consolas', monospace;
    font-weight: 600;
    color: var(--palette-primary);
    font-size: 0.9rem;
}

.feed-bottom[b-jp4nl651eq] {
    font-size: 0.8rem;
    color: var(--employee-text-secondary);
    display: flex;
    align-items: center;
    gap: 0.4rem;
}

.feed-status[b-jp4nl651eq] {
    font-size: 0.7rem;
    padding: 2px 6px;
    border-radius: 2px;
    background-color: #F1F5F9;
    color: #64748B;
    width: fit-content;
}

/* Estado Vacío */
.empty-timeline[b-jp4nl651eq] {
    text-align: center;
    padding: 3rem 1rem;
    display: flex;
    flex-direction: column;
    align-items: center;
}

.empty-circle[b-jp4nl651eq] {
    width: 60px;
    height: 60px;
    background-color: #F1F5F9;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.5rem;
    color: var(--palette-gray-mid);
    margin-bottom: 1rem;
}

.empty-timeline h5[b-jp4nl651eq] {
    margin: 0 0 0.5rem 0;
    font-weight: 700;
    color: var(--employee-text-main);
}

.empty-timeline p[b-jp4nl651eq] {
    margin: 0;
    font-size: 0.9rem;
    color: var(--employee-text-secondary);
}

.animate-fade-in[b-jp4nl651eq] {
    animation: fadeIn-b-jp4nl651eq 0.5s cubic-bezier(0.4, 0, 0.2, 1);
}

@keyframes fadeIn-b-jp4nl651eq {
    from {
        opacity: 0;
        transform: translateY(10px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}
/* _content/ImagineTheFuture.BlazorServer/Pages/Employee/EmployeeTechnicalSheet.razor.rz.scp.css */
/*
 * EmployeeTechnicalSheet.razor.css
 * Estilo: Operational / Cool Tech (Ultra Responsivo)
 */

.tech-sheet-container[b-21hkje4ct9] {
    max-width: 1200px;
    margin: 0 auto;
    padding-bottom: 3rem;
}

/* === HEADER (Identidad) === */
.sheet-header[b-21hkje4ct9] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    background-color: #FFFFFF;
    border: 1px solid var(--employee-border);
    border-radius: 4px;
    padding: 2rem;
    margin-bottom: 2rem;
    box-shadow: var(--employee-shadow);
    flex-wrap: wrap;
    gap: 2rem; /* Clave para apachurrar */
}

.identity-block[b-21hkje4ct9] {
    display: flex;
    align-items: center;
    gap: 1.5rem;
    flex: 1;
    min-width: 300px; /* No se hace más chico que esto */
    flex-wrap: wrap; /* Si la pantalla es muy chica, la foto se va arriba */
}

.photo-frame[b-21hkje4ct9] {
    width: 90px;
    height: 90px;
    border-radius: 4px;
    background-color: var(--employee-bg);
    border: 2px solid var(--palette-primary);
    overflow: hidden;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 2.5rem;
    color: var(--palette-primary);
    font-weight: 700;
    flex-shrink: 0;
}

    .photo-frame img[b-21hkje4ct9] {
        width: 100%;
        height: 100%;
        object-fit: cover;
    }

.text-info[b-21hkje4ct9] {
    flex-grow: 1;
    min-width: 200px;
}

    .text-info h1[b-21hkje4ct9] {
        margin: 0;
        font-family: 'Montserrat', sans-serif;
        font-weight: 800;
        color: var(--employee-text-main);
        font-size: 1.6rem;
        text-transform: uppercase;
        line-height: 1.2;
        margin-bottom: 0.5rem;
    }

.badges[b-21hkje4ct9] {
    display: flex;
    gap: 0.5rem;
    flex-wrap: wrap;
}

.badge-job[b-21hkje4ct9] {
    background-color: var(--palette-primary);
    color: white;
    font-weight: 700;
    font-size: 0.75rem;
    padding: 0.2rem 0.6rem;
    border-radius: 2px;
}

.badge-dept[b-21hkje4ct9] {
    background-color: var(--employee-bg);
    color: var(--palette-primary);
    border: 1px solid var(--palette-primary);
    font-weight: 600;
    font-size: 0.75rem;
    padding: 0.2rem 0.6rem;
    border-radius: 2px;
}

.badge-id[b-21hkje4ct9] {
    font-family: 'Consolas', monospace;
    color: var(--employee-text-secondary);
    background-color: #F1F5F9;
    border: 1px solid #E2E8F0;
    padding: 0.2rem 0.6rem;
    border-radius: 2px;
    font-size: 0.75rem;
}

/* Tarjeta Biometría */
.biometric-status-card[b-21hkje4ct9] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    background-color: #F8FAFC;
    border: 1px solid #E2E8F0;
    padding: 1rem 1.5rem;
    border-radius: 4px;
    min-width: 280px;
    flex-shrink: 0;
}

.status-content[b-21hkje4ct9] {
    display: flex;
    align-items: center;
    gap: 1rem;
}

.status-icon[b-21hkje4ct9] {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.2rem;
}

    .status-icon.ok[b-21hkje4ct9] {
        background-color: rgba(38, 176, 80, 0.1);
        color: #26b050;
        border: 2px solid #26b050;
    }

    .status-icon.alert[b-21hkje4ct9] {
        background-color: rgba(255, 193, 7, 0.1);
        color: #ffc107;
        border: 2px solid #ffc107;
    }

.status-text[b-21hkje4ct9] {
    display: flex;
    flex-direction: column;
}

    .status-text label[b-21hkje4ct9] {
        font-size: 0.65rem;
        text-transform: uppercase;
        color: var(--employee-text-secondary);
        font-weight: 700;
    }

    .status-text span[b-21hkje4ct9] {
        font-weight: 600;
        color: var(--employee-text-main);
        font-size: 0.9rem;
    }

.btn-biometric-action[b-21hkje4ct9] {
    background-color: white;
    border: 1px solid #CBD5E1;
    color: #64748B;
    padding: 0.4rem 0.8rem;
    border-radius: 2px;
    cursor: not-allowed;
    font-size: 0.75rem;
    font-weight: 600;
}

/* === GRID OPERATIVO === */
.operational-grid[b-21hkje4ct9] {
    display: grid;
    /* Cambia a columna en < 900px */
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
    gap: 2rem;
    align-items: start;
}

/* Columna Izquierda (Resumen) */
.op-card[b-21hkje4ct9] {
    background-color: #FFFFFF;
    border: 1px solid var(--employee-border);
    border-radius: 4px;
    overflow: hidden;
}

.card-head[b-21hkje4ct9] {
    background-color: var(--employee-bg);
    padding: 1rem;
    border-bottom: 1px solid var(--employee-border);
}

    .card-head h4[b-21hkje4ct9] {
        margin: 0;
        font-size: 1rem;
        color: var(--palette-primary);
        font-weight: 700;
        text-transform: uppercase;
    }

.card-body[b-21hkje4ct9] {
    padding: 1.5rem;
}

.field label[b-21hkje4ct9] {
    display: block;
    font-size: 0.7rem;
    color: var(--employee-text-secondary);
    text-transform: uppercase;
    font-weight: 700;
    margin-bottom: 0.3rem;
}

.field p[b-21hkje4ct9] {
    margin: 0;
    font-weight: 600;
    color: var(--employee-text-main);
    font-size: 1rem;
}

.worksites-list[b-21hkje4ct9] {
    list-style: none;
    padding: 0;
    margin: 0;
}

    .worksites-list li[b-21hkje4ct9] {
        padding: 0.5rem;
        border-bottom: 1px solid #F1F5F9;
        font-size: 0.9rem;
        color: var(--employee-text-main);
        display: flex;
        align-items: center;
    }

        .worksites-list li:last-child[b-21hkje4ct9] {
            border-bottom: none;
        }

    .worksites-list i[b-21hkje4ct9] {
        color: var(--palette-primary);
        margin-right: 0.5rem;
    }

/* Columna Derecha (Semana) */
.weekly-grid-wrapper[b-21hkje4ct9] {
    background-color: white;
    padding: 1.5rem;
    border-radius: 4px;
    border: 1px solid transparent; /* Contenedor limpio */
}

.grid-header[b-21hkje4ct9] {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    margin-bottom: 1.5rem;
    border-bottom: 1px solid var(--employee-border);
    padding-bottom: 0.5rem;
}

    .grid-header h4[b-21hkje4ct9] {
        font-family: 'Montserrat', sans-serif;
        font-size: 1.2rem;
        color: var(--employee-text-main);
        margin: 0;
        text-transform: uppercase;
        font-weight: 700;
    }

.grid-subtitle[b-21hkje4ct9] {
    font-size: 0.8rem;
    color: var(--employee-text-secondary);
    font-style: italic;
}

.week-grid[b-21hkje4ct9] {
    display: grid;
    /* APCHURRABLE: Se ajusta hasta 140px, luego salta de línea */
    grid-template-columns: repeat(auto-fill, minmax(140px, 1fr));
    gap: 1rem;
}

.day-card[b-21hkje4ct9] {
    background-color: #FFFFFF;
    border: 1px solid var(--employee-border);
    border-radius: 4px;
    overflow: hidden;
    transition: transform 0.2s, box-shadow 0.2s;
    cursor: pointer;
}

    .day-card:hover[b-21hkje4ct9] {
        transform: translateY(-3px);
        box-shadow: var(--employee-shadow);
        border-color: var(--palette-primary);
    }

    .day-card.active[b-21hkje4ct9] {
        border-top: 4px solid var(--palette-primary);
    }

    .day-card.off[b-21hkje4ct9] {
        border-top: 4px solid #CBD5E1;
        opacity: 0.7;
        background-color: #F8FAFC;
    }

.day-head[b-21hkje4ct9] {
    padding: 0.6rem;
    border-bottom: 1px solid #F1F5F9;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.day-name[b-21hkje4ct9] {
    font-weight: 800;
    color: var(--employee-text-main);
    text-transform: uppercase;
    font-size: 0.85rem;
}

.icon-off[b-21hkje4ct9] {
    color: #94A3B8;
    font-size: 0.9rem;
}

.day-body[b-21hkje4ct9] {
    padding: 0.8rem;
}

.status-off[b-21hkje4ct9] {
    color: #64748B;
    font-style: italic;
    font-weight: 500;
    font-size: 0.9rem;
}

.time-block[b-21hkje4ct9] {
    display: flex;
    flex-direction: column;
    margin-bottom: 0.5rem;
}

    .time-block .label[b-21hkje4ct9] {
        font-size: 0.65rem;
        text-transform: uppercase;
        color: var(--employee-text-secondary);
        font-weight: 700;
    }

    .time-block .value[b-21hkje4ct9] {
        font-size: 0.9rem;
        font-weight: 700;
        color: var(--palette-primary);
        white-space: nowrap;
    }

    .time-block.sub .value[b-21hkje4ct9] {
        font-size: 0.85rem;
        color: var(--employee-text-main);
        font-weight: 500;
    }

/* Empty State */
.empty-schedule[b-21hkje4ct9] {
    text-align: center;
    padding: 3rem;
    background-color: #F9FAFB;
    border: 2px dashed #CBD5E1;
    border-radius: 4px;
    color: #94A3B8;
}

    .empty-schedule i[b-21hkje4ct9] {
        font-size: 2.5rem;
        margin-bottom: 1rem;
    }

/* Muro de Seguridad */
.staff-security-wall[b-21hkje4ct9] {
    display: flex;
    justify-content: center;
    align-items: center;
    min-height: 60vh;
    padding: 2rem;
}

.wall-content[b-21hkje4ct9] {
    background-color: #FFFFFF;
    border: 2px dashed var(--employee-border);
    border-radius: 4px;
    padding: 3rem 2rem;
    text-align: center;
    max-width: 450px;
    width: 100%;
    box-shadow: var(--employee-shadow);
}

.wall-icon-wrapper[b-21hkje4ct9] {
    font-size: 3rem;
    color: var(--palette-primary);
    margin-bottom: 1rem;
}

.wall-title[b-21hkje4ct9] {
    font-family: 'Montserrat', sans-serif;
    font-weight: 700;
    color: var(--employee-text-main);
    margin-bottom: 0.5rem;
}

.wall-message[b-21hkje4ct9] {
    color: var(--employee-text-secondary);
    margin-bottom: 2rem;
}

.wall-form-wrapper[b-21hkje4ct9] {
    text-align: left;
    background-color: var(--employee-bg);
    padding: 1.5rem;
    border-radius: 4px;
    border: 1px solid var(--employee-border);
}

.text-muted[b-21hkje4ct9] {
    color: var(--employee-text-secondary);
    font-style: italic;
    font-size: 0.9rem;
}

.mt-3[b-21hkje4ct9] {
    margin-top: 1rem;
}

.animate-fade-in[b-21hkje4ct9] {
    animation: fadeIn-b-21hkje4ct9 0.4s ease-out;
}

@keyframes fadeIn-b-21hkje4ct9 {
    from {
        opacity: 0;
        transform: translateY(10px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* Responsive adjustments */
@media (max-width: 768px) {
    .sheet-header[b-21hkje4ct9] {
        flex-direction: column;
        align-items: stretch;
        gap: 1rem;
        padding: 1.5rem;
    }

    .biometric-status-card[b-21hkje4ct9] {
        margin-top: 1rem;
    }

    .operational-grid[b-21hkje4ct9] {
        grid-template-columns: 1fr;
    }

    .week-grid[b-21hkje4ct9] {
        grid-template-columns: repeat(2, 1fr);
    }
    /* Forzar 2 columnas en móvil */
}
/* _content/ImagineTheFuture.BlazorServer/Pages/Employee/MyRecords.razor.rz.scp.css */
/*
 * MyRecords.razor.css
 * Estilo: Payroll Audit (Industrial Clean)
 */

.records-container[b-b7h93dbtki] {
    max-width: 1000px;
    margin: 0 auto;
    padding-bottom: 3rem;
    margin-top: 2rem;
}

/* --- HEADER Y NAVEGACIÓN --- */
.records-header[b-b7h93dbtki] {
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    margin-bottom: 2rem;
    flex-wrap: wrap;
    gap: 1rem;
}

.title-block h1[b-b7h93dbtki] {
    margin: 0;
    font-size: 1.8rem;
    color: var(--employee-text-main);
    font-weight: 800;
    font-family: 'Montserrat', sans-serif;
    text-transform: uppercase;
}

.title-block p[b-b7h93dbtki] {
    margin: 0;
    color: var(--employee-text-secondary);
    font-size: 0.9rem;
}

.nav-controls[b-b7h93dbtki] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    background-color: #FFFFFF;
    padding: 0.3rem;
    border-radius: 4px;
    border: 1px solid var(--employee-border);
    box-shadow: 0 2px 5px rgba(0,0,0,0.03);
}

.btn-nav[b-b7h93dbtki], .btn-today[b-b7h93dbtki] {
    border: none;
    background: transparent;
    cursor: pointer;
    padding: 0.5rem 0.8rem;
    border-radius: 2px;
    color: var(--palette-gray-mid);
    transition: background 0.2s;
}

    .btn-nav:hover[b-b7h93dbtki], .btn-today:hover[b-b7h93dbtki] {
        background-color: var(--employee-bg);
        color: var(--palette-primary);
    }

.date-range-display[b-b7h93dbtki] {
    font-family: 'Consolas', monospace;
    font-weight: 700;
    color: var(--employee-text-main);
    padding: 0 0.5rem;
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

    .date-range-display i[b-b7h93dbtki] {
        color: var(--palette-primary);
    }

.btn-today[b-b7h93dbtki] {
    font-weight: 700;
    font-size: 0.8rem;
    text-transform: uppercase;
    border-left: 1px solid #E2E8F0;
}

/* --- RESUMEN SEMANAL --- */
.summary-card[b-b7h93dbtki] {
    background-color: #FFFFFF;
    border: 1px solid var(--employee-border);
    border-radius: 6px;
    padding: 1.5rem;
    display: flex;
    justify-content: space-around;
    align-items: center;
    margin-bottom: 2rem;
    box-shadow: var(--employee-shadow);
}

.summary-item[b-b7h93dbtki] {
    display: flex;
    flex-direction: column;
    align-items: center;
}

    .summary-item .label[b-b7h93dbtki] {
        font-size: 0.7rem;
        text-transform: uppercase;
        color: var(--employee-text-secondary);
        font-weight: 700;
        letter-spacing: 0.05em;
    }

    .summary-item .value[b-b7h93dbtki] {
        font-family: 'Montserrat', sans-serif;
        font-size: 1.8rem;
        font-weight: 800;
        color: var(--employee-text-main);
        line-height: 1;
        margin-top: 0.3rem;
    }

    .summary-item .unit[b-b7h93dbtki] {
        font-size: 0.8rem;
        color: var(--palette-gray-mid);
        font-weight: 500;
    }

    .summary-item .value.main[b-b7h93dbtki] {
        color: var(--palette-primary);
    }

    .summary-item .value.positive[b-b7h93dbtki] {
        color: #26b050;
    }

    .summary-item .value.negative[b-b7h93dbtki] {
        color: #dc2626;
    }

.divider-vertical[b-b7h93dbtki] {
    width: 1px;
    height: 40px;
    background-color: #E2E8F0;
}

/* --- LISTA DE DÍAS (TABLA FLEXIBLE) --- */
.days-list[b-b7h93dbtki] {
    display: flex;
    flex-direction: column;
    gap: 0.8rem;
}

.day-row[b-b7h93dbtki] {
    background-color: #FFFFFF;
    border: 1px solid var(--employee-border);
    border-radius: 4px;
    padding: 1rem 1.5rem;
    display: grid;
    grid-template-columns: 100px 140px 1fr 120px; /* Layout Escritorio */
    align-items: center;
    gap: 1rem;
    transition: transform 0.2s;
}

    .day-row:hover[b-b7h93dbtki] {
        transform: translateX(4px);
        border-color: var(--palette-primary);
    }

    .day-row.today[b-b7h93dbtki] {
        border-left: 4px solid var(--palette-primary);
        background-color: #F8FAFC;
    }

    .day-row.day-off[b-b7h93dbtki] {
        background-color: #FCFCFC;
        opacity: 0.8;
        border-style: dashed;
    }

/* Columna Fecha */
.col-date[b-b7h93dbtki] {
    display: flex;
    flex-direction: column;
}

.day-name[b-b7h93dbtki] {
    font-weight: 700;
    color: var(--employee-text-main);
    text-transform: uppercase;
    font-size: 0.9rem;
}

.day-number[b-b7h93dbtki] {
    font-size: 0.8rem;
    color: var(--employee-text-secondary);
}

/* Columna Horario */
.col-schedule[b-b7h93dbtki] {
    font-size: 0.9rem;
}

.time-range[b-b7h93dbtki] {
    font-weight: 600;
    color: var(--employee-text-main);
    display: block;
}

.badge-off[b-b7h93dbtki] {
    background-color: #F1F5F9;
    color: #94A3B8;
    padding: 2px 6px;
    border-radius: 2px;
    font-size: 0.75rem;
    text-transform: uppercase;
    font-weight: 700;
}

/* Columna Actividad (Pills) */
.col-activity[b-b7h93dbtki] {
    display: flex;
    align-items: center;
}

.punches-flow[b-b7h93dbtki] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
}

.punch-pill[b-b7h93dbtki] {
    display: flex;
    align-items: center;
    gap: 0.4rem;
    padding: 0.3rem 0.6rem;
    border-radius: 4px;
    font-size: 0.8rem;
    font-family: 'Consolas', monospace;
    border: 1px solid transparent;
}

    .punch-pill.entry[b-b7h93dbtki] {
        background-color: #F0FDF4;
        color: #166534;
        border-color: #BBF7D0;
    }

    .punch-pill.exit[b-b7h93dbtki] {
        background-color: #FEF2F2;
        color: #991B1B;
        border-color: #FECACA;
    }

    .punch-pill.lunch[b-b7h93dbtki] {
        background-color: #FFF7ED;
        color: #C2410C;
        border-color: #FED7AA;
    }

.no-activity[b-b7h93dbtki] {
    color: #CBD5E1;
    font-weight: 700;
}

/* Columna Estatus */
.col-status[b-b7h93dbtki] {
    text-align: right;
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 0.2rem;
}

.hours-calc[b-b7h93dbtki] {
    font-weight: 800;
    color: var(--employee-text-main);
    font-size: 1rem;
}

.status-badge[b-b7h93dbtki] {
    font-size: 0.7rem;
    text-transform: uppercase;
    font-weight: 700;
}

.status-ok[b-b7h93dbtki] {
    color: #26b050;
}

.status-warning[b-b7h93dbtki] {
    color: #d97706;
}

.status-danger[b-b7h93dbtki] {
    color: #dc2626;
}

.status-info[b-b7h93dbtki] {
    color: var(--palette-primary);
}

/* --- RESPONSIVIDAD --- */
@media (max-width: 768px) {
    .records-header[b-b7h93dbtki] {
        flex-direction: column;
        align-items: flex-start;
    }

    .nav-controls[b-b7h93dbtki] {
        width: 100%;
        justify-content: space-between;
    }

    .summary-card[b-b7h93dbtki] {
        flex-direction: column;
        gap: 1rem;
        text-align: center;
    }

    .divider-vertical[b-b7h93dbtki] {
        width: 100%;
        height: 1px;
    }

    /* Transformar Fila a Tarjeta */
    .day-row[b-b7h93dbtki] {
        grid-template-columns: 1fr 1fr; /* 2 columnas arriba */
        grid-template-areas:
            "date status"
            "schedule schedule"
            "activity activity";
        gap: 0.8rem;
        padding: 1rem;
    }

    .col-date[b-b7h93dbtki] {
        grid-area: date;
    }

    .col-status[b-b7h93dbtki] {
        grid-area: status;
        align-items: flex-end;
    }

    .col-schedule[b-b7h93dbtki] {
        grid-area: schedule;
        border-bottom: 1px dashed #E2E8F0;
        padding-bottom: 0.5rem;
    }

    .col-activity[b-b7h93dbtki] {
        grid-area: activity;
    }
}

/* Wall */
.staff-security-wall[b-b7h93dbtki] {
    display: flex;
    justify-content: center;
    align-items: center;
    min-height: 60vh;
    padding: 2rem;
}

.wall-content[b-b7h93dbtki] {
    background-color: #FFFFFF;
    border: 2px dashed var(--employee-border);
    border-radius: 4px;
    padding: 3rem 2rem;
    text-align: center;
    max-width: 450px;
    width: 100%;
}

.wall-icon-wrapper[b-b7h93dbtki] {
    font-size: 3rem;
    color: var(--palette-primary);
    margin-bottom: 1rem;
}

.wall-title[b-b7h93dbtki] {
    font-family: 'Montserrat', sans-serif;
    font-weight: 700;
    color: var(--employee-text-main);
    margin-bottom: 0.5rem;
}

.wall-message[b-b7h93dbtki] {
    color: var(--employee-text-secondary);
    margin-bottom: 2rem;
}

.wall-form-wrapper[b-b7h93dbtki] {
    text-align: left;
    background-color: var(--employee-bg);
    padding: 1.5rem;
    border-radius: 4px;
    border: 1px solid var(--employee-border);
}

.text-muted[b-b7h93dbtki] {
    color: var(--employee-text-secondary);
}

.animate-fade-in[b-b7h93dbtki] {
    animation: fadeIn-b-b7h93dbtki 0.4s ease-out;
}

@keyframes fadeIn-b-b7h93dbtki {
    from {
        opacity: 0;
        transform: translateY(10px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}
/* _content/ImagineTheFuture.BlazorServer/Pages/Employee/OperationalConfiguration.razor.rz.scp.css */
/*
 * OperationalConfiguration.razor.css
 * Estilo: Coordination Center (Light)
 */

.operational-container[b-p5xlltk5nr] {
    max-width: 1200px;
    margin: 0 auto;
    padding-bottom: 3rem;
    padding-top: 2rem;
    /* Transición suave cuando el ancho cambia al cambiar de tab */
    transition: max-width 0.4s cubic-bezier(0.4, 0, 0.2, 1), padding 0.4s ease;
}

    /* [NUEVO] Clase dinámica para expandir el lienzo del organigrama */
    .operational-container.fluid-container[b-p5xlltk5nr] {
        max-width: 100%;
        padding-left: 1.5rem;
        padding-right: 1.5rem;
    }

/* Header */
.coord-header[b-p5xlltk5nr] {
    margin-bottom: 2rem;
}

    .coord-header h1[b-p5xlltk5nr] {
        margin: 0;
        font-size: 1.5rem;
        color: var(--employee-text-main);
        font-weight: 700;
        font-family: 'Montserrat', sans-serif;
        text-transform: uppercase;
    }

.subtitle[b-p5xlltk5nr] {
    margin: 0;
    color: var(--employee-text-secondary);
    font-size: 0.9rem;
}

/* Tabs */
.tabs-header[b-p5xlltk5nr] {
    display: flex;
    gap: 0.5rem;
    border-bottom: 1px solid var(--employee-border);
    margin-bottom: 2rem;
    overflow-x: auto;
}

.tab-btn[b-p5xlltk5nr] {
    background: transparent;
    border: none;
    padding: 1rem 1.5rem;
    font-family: 'Montserrat', sans-serif;
    font-weight: 600;
    color: var(--palette-gray-mid);
    cursor: pointer;
    border-bottom: 3px solid transparent;
    transition: all 0.2s;
    white-space: nowrap;
}

    .tab-btn:hover[b-p5xlltk5nr] {
        color: var(--palette-primary);
        background-color: rgba(0,0,0,0.02);
    }

    .tab-btn.active[b-p5xlltk5nr] {
        color: var(--palette-primary);
        border-bottom-color: var(--palette-primary);
        background-color: rgba(0, 163, 224, 0.05);
    }

    .tab-btn i[b-p5xlltk5nr] {
        margin-right: 0.5rem;
    }

.tab-content[b-p5xlltk5nr] {
    animation: fadeIn-b-p5xlltk5nr 0.3s ease-out;
}

/* Muro y Utils */
.staff-security-wall[b-p5xlltk5nr] {
    display: flex;
    justify-content: center;
    align-items: center;
    min-height: 60vh;
    padding: 2rem;
}

.wall-content[b-p5xlltk5nr] {
    background-color: #FFFFFF;
    border: 2px dashed var(--employee-border);
    border-radius: 6px;
    padding: 3rem;
    text-align: center;
    max-width: 450px;
    width: 100%;
    box-shadow: var(--employee-shadow);
}

.wall-icon-wrapper.warning[b-p5xlltk5nr] {
    color: #F59E0B;
    font-size: 3rem;
    margin-bottom: 1rem;
}

.wall-title[b-p5xlltk5nr] {
    font-size: 1.5rem;
    margin-bottom: 0.5rem;
    color: var(--employee-text-main);
}

.wall-message[b-p5xlltk5nr] {
    color: var(--employee-text-secondary);
    margin-bottom: 2rem;
}

.btn-secondary[b-p5xlltk5nr] {
    background-color: #E2E8F0;
    color: var(--employee-text-main);
    padding: 0.6rem 1.2rem;
    text-decoration: none;
    border-radius: 4px;
    font-weight: 600;
}

.animate-fade-in[b-p5xlltk5nr] {
    animation: fadeIn-b-p5xlltk5nr 0.4s ease-out;
}

@keyframes fadeIn-b-p5xlltk5nr {
    from {
        opacity: 0;
        transform: translateY(5px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}
/* _content/ImagineTheFuture.BlazorServer/Pages/Employee/PersonnelManagement.razor.rz.scp.css */
/*
 * PersonnelManagement.razor.css
 * Estilo: Coordination Center (Light / Clean / High Contrast)
 */

.coordination-container[b-kyz3uhuu8u] {
    max-width: 1400px;
    padding-top: 2rem;
    margin: 0 auto;
    /* Altura fija relativa al viewport para permitir scroll interno */
    height: calc(100vh - 100px);
    display: flex;
    flex-direction: column;
}

/* Header */
.coord-header[b-kyz3uhuu8u] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 1.5rem;
    flex-shrink: 0;
}

    .coord-header h1[b-kyz3uhuu8u] {
        margin: 0;
        font-size: 1.5rem;
        color: var(--employee-text-main);
        font-weight: 700;
        font-family: 'Montserrat', sans-serif;
        text-transform: uppercase;
    }

.subtitle[b-kyz3uhuu8u] {
    margin: 0;
    color: var(--employee-text-secondary);
    font-size: 0.9rem;
}

.btn-create[b-kyz3uhuu8u] {
    background-color: var(--palette-primary);
    color: white;
    border: none;
    padding: 0.6rem 1.2rem;
    border-radius: 4px;
    font-weight: 700;
    text-transform: uppercase;
    cursor: pointer;
    display: flex;
    gap: 0.5rem;
    align-items: center;
    box-shadow: 0 2px 5px rgba(0,0,0,0.1);
    transition: background 0.2s;
}

    .btn-create:hover[b-kyz3uhuu8u] {
        background-color: #0088BE;
    }

/* Split View Layout */
.split-view-container[b-kyz3uhuu8u] {
    display: grid;
    grid-template-columns: 350px 1fr;
    gap: 1.5rem;
    flex-grow: 1;
    min-height: 0; /* Crítico para que el contenido scrollee y no estire el body */
}

/* --- Panel Izquierdo (Lista) --- */
.master-list-panel[b-kyz3uhuu8u] {
    background-color: #FFFFFF;
    border: 1px solid var(--employee-border);
    border-radius: 6px;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    box-shadow: var(--employee-shadow);
}

.filters-bar[b-kyz3uhuu8u] {
    padding: 1rem;
    border-bottom: 1px solid #F1F5F9;
    display: flex;
    flex-direction: column;
    gap: 0.8rem;
    background-color: #F8FAFC;
    flex-shrink: 0;
}

.search-wrapper[b-kyz3uhuu8u] {
    position: relative;
    display: flex;
    align-items: center;
}

    .search-wrapper i[b-kyz3uhuu8u] {
        position: absolute;
        left: 10px;
        color: var(--palette-gray-mid);
        z-index: 1;
    }

    .search-wrapper input[b-kyz3uhuu8u] {
        width: 100%;
        padding: 0.6rem 0.6rem 0.6rem 2.2rem;
        border: 1px solid #CBD5E1;
        border-radius: 4px;
        outline: none;
        font-size: 0.9rem;
        background-color: #FFFFFF;
        color: var(--employee-text-main);
    }

.dept-filter[b-kyz3uhuu8u] {
    padding: 0.5rem;
    border: 1px solid #CBD5E1;
    border-radius: 4px;
    font-size: 0.85rem;
    color: var(--employee-text-main);
    background-color: #FFFFFF;
}

.employees-scroll-list[b-kyz3uhuu8u] {
    flex-grow: 1;
    overflow-y: auto;
    padding: 0.5rem;
}

/* Tarjeta de Empleado */
.employee-card-item[b-kyz3uhuu8u] {
    display: flex;
    align-items: center;
    gap: 0.8rem;
    padding: 0.8rem;
    border-radius: 4px;
    cursor: pointer;
    transition: background 0.1s;
    border: 1px solid transparent;
    margin-bottom: 0.2rem;
}

    .employee-card-item:hover[b-kyz3uhuu8u] {
        background-color: #F1F5F9;
        border-color: #E2E8F0;
    }

    .employee-card-item.selected[b-kyz3uhuu8u] {
        background-color: #F0F9FF;
        border-color: var(--palette-primary);
    }

.card-avatar[b-kyz3uhuu8u] {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    background-color: #E2E8F0;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 700;
    color: #64748B;
    overflow: hidden;
    flex-shrink: 0;
}

    .card-avatar img[b-kyz3uhuu8u] {
        width: 100%;
        height: 100%;
        object-fit: cover;
    }

.card-info[b-kyz3uhuu8u] {
    flex-grow: 1;
    overflow: hidden;
}

    .card-info h4[b-kyz3uhuu8u] {
        margin: 0;
        font-size: 0.9rem;
        font-weight: 700;
        color: var(--employee-text-main);
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
    }

    .card-info .job-title[b-kyz3uhuu8u] {
        display: block;
        font-size: 0.75rem;
        color: var(--employee-text-secondary);
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
    }

.role-pill[b-kyz3uhuu8u] {
    font-size: 0.65rem;
    background-color: #E0E7FF;
    color: #3730A3;
    padding: 1px 4px;
    border-radius: 2px;
    font-weight: 600;
    text-transform: uppercase;
}

.arrow-indicator[b-kyz3uhuu8u] {
    color: #CBD5E1;
    font-size: 0.8rem;
}

/* --- Panel Derecho (Detalle) --- */
.detail-panel[b-kyz3uhuu8u] {
    background-color: #FFFFFF;
    border: 1px solid var(--employee-border);
    border-radius: 6px;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    box-shadow: var(--employee-shadow);
    position: relative; /* Para el absolute del móvil */
}

    /* [CORRECCIÓN CRÍTICA] Forzar que el EditForm llene el espacio */
    .detail-panel[b-kyz3uhuu8u]  form {
        display: flex;
        flex-direction: column;
        height: 100%;
        min-height: 0;
        overflow: hidden;
    }

.detail-form-wrapper[b-kyz3uhuu8u] {
    display: flex;
    flex-direction: column;
    height: 100%;
    min-height: 0;
    overflow: hidden;
}

.detail-header[b-kyz3uhuu8u] {
    padding: 1.5rem;
    border-bottom: 1px solid #F1F5F9;
    display: flex;
    justify-content: space-between;
    align-items: center;
    background-color: #F8FAFC;
    flex-shrink: 0; /* No encogerse */
}

    .detail-header h3[b-kyz3uhuu8u] {
        margin: 0;
        font-size: 1.2rem;
        font-weight: 700;
        color: var(--employee-text-main);
        text-transform: uppercase;
    }

.detail-actions[b-kyz3uhuu8u] {
    display: flex;
    gap: 1rem;
    align-items: center;
}

.btn-text-cancel[b-kyz3uhuu8u] {
    background: none;
    border: none;
    color: var(--palette-gray-mid);
    font-weight: 600;
    cursor: pointer;
    font-size: 0.9rem;
}

.btn-save-sm[b-kyz3uhuu8u] {
    background-color: var(--palette-primary);
    color: white;
    border: none;
    padding: 0.5rem 1.2rem;
    border-radius: 4px;
    font-weight: 700;
    font-size: 0.85rem;
    cursor: pointer;
    text-transform: uppercase;
}

/* Contenido Scrolleable */
.detail-content-scroll[b-kyz3uhuu8u] {
    flex-grow: 1;
    overflow-y: auto;
    padding: 2rem;
    padding-bottom: 6rem; /* Extra padding para móviles */
}

/* Formularios Detalle */
.form-section[b-kyz3uhuu8u] {
    margin-bottom: 2rem;
}

    .form-section h5[b-kyz3uhuu8u] {
        margin: 0 0 1rem 0;
        font-size: 0.9rem;
        color: var(--palette-primary);
        text-transform: uppercase;
        font-weight: 700;
        border-bottom: 1px solid #E2E8F0;
        padding-bottom: 0.5rem;
    }

.form-row[b-kyz3uhuu8u] {
    display: flex;
    gap: 1rem;
    margin-bottom: 1rem;
}

.form-group[b-kyz3uhuu8u] {
    margin-bottom: 1rem;
}

    .form-group.half[b-kyz3uhuu8u] {
        flex: 1;
    }

[b-kyz3uhuu8u] label {
    display: block;
    font-size: 0.75rem;
    font-weight: 700;
    color: var(--employee-text-secondary);
    text-transform: uppercase;
    margin-bottom: 0.4rem;
}

[b-kyz3uhuu8u] .form-control {
    width: 100%;
    padding: 0.7rem 0.8rem;
    border: 1px solid #CBD5E1;
    border-radius: 4px;
    background-color: #FFFFFF;
    color: #1E293B;
    font-size: 0.95rem;
}

    [b-kyz3uhuu8u] .form-control:focus {
        border-color: var(--palette-primary);
        box-shadow: 0 0 0 3px rgba(0, 163, 224, 0.1);
        outline: none;
    }

/* Biometría */
.biometric-status[b-kyz3uhuu8u] {
    display: flex;
    align-items: center;
    gap: 1rem;
    padding: 1rem;
    background-color: #F1F5F9;
    border-radius: 4px;
    border: 1px solid #E2E8F0;
}

.status-ok[b-kyz3uhuu8u] {
    color: #166534;
    font-weight: 600;
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.status-missing[b-kyz3uhuu8u] {
    color: #B91C1C;
    font-weight: 600;
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

/* Empty State */
.empty-detail[b-kyz3uhuu8u] {
    height: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    color: #CBD5E1;
}

    .empty-detail i[b-kyz3uhuu8u] {
        font-size: 4rem;
        margin-bottom: 1rem;
    }

/* Muro */
.staff-security-wall[b-kyz3uhuu8u] {
    display: flex;
    justify-content: center;
    align-items: center;
    height: 100%;
    padding: 2rem;
}

.wall-content[b-kyz3uhuu8u] {
    background-color: #FFFFFF;
    border: 2px dashed var(--employee-border);
    border-radius: 6px;
    padding: 3rem;
    text-align: center;
}

.wall-icon-wrapper.warning[b-kyz3uhuu8u] {
    color: #F59E0B;
    font-size: 3rem;
    margin-bottom: 1rem;
}

.wall-title[b-kyz3uhuu8u] {
    font-size: 1.5rem;
    margin-bottom: 0.5rem;
    color: var(--employee-text-main);
    font-family: 'Montserrat', sans-serif;
    font-weight: 700;
}

.wall-message[b-kyz3uhuu8u] {
    color: var(--employee-text-secondary);
    margin-bottom: 2rem;
}

.btn-secondary[b-kyz3uhuu8u] {
    background-color: #E2E8F0;
    color: var(--employee-text-main);
    padding: 0.6rem 1.2rem;
    text-decoration: none;
    border-radius: 4px;
    font-weight: 600;
}

.animate-fade-in[b-kyz3uhuu8u] {
    animation: fadeIn-b-kyz3uhuu8u 0.4s ease-out;
}

@keyframes fadeIn-b-kyz3uhuu8u {
    from {
        opacity: 0;
        transform: translateY(10px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* --- RESPONSIVE MOBILE VIEW --- */
@media (max-width: 900px) {
    .coordination-container[b-kyz3uhuu8u] {
        padding: 1rem;
        height: calc(100vh - 80px); /* Ajuste altura móvil */
    }

    .coord-header[b-kyz3uhuu8u] {
        flex-direction: column;
        align-items: flex-start;
        gap: 1rem;
        margin-bottom: 1rem;
    }

    /* 1. Grid de una sola celda (Stack) */
    .split-view-container[b-kyz3uhuu8u] {
        display: grid;
        grid-template-columns: 1fr;
        grid-template-rows: 1fr;
        position: relative;
        overflow: hidden; /* Ocultar lo que se sale del frame */
        width: 100%;
        height: 100%;
    }

    /* 2. Ambos paneles ocupan el mismo espacio */
    .master-list-panel[b-kyz3uhuu8u], .detail-panel[b-kyz3uhuu8u] {
        grid-column: 1;
        grid-row: 1;
        width: 100%;
        height: 100%;
        transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1);
        z-index: 1;
        border-radius: 6px;
    }

    /* 3. Panel de Detalle empieza fuera (derecha) */
    .detail-panel[b-kyz3uhuu8u] {
        transform: translateX(110%);
        z-index: 10;
        box-shadow: -5px 0 20px rgba(0,0,0,0.1);
    }

    /* 4. Estado Activo: Desliza el detalle a la vista */
    .split-view-container.mobile-detail-view-active .detail-panel[b-kyz3uhuu8u] {
        transform: translateX(0);
    }

    /* 5. Empuja la lista un poco a la izquierda para efecto de profundidad (opcional) */
    .split-view-container.mobile-detail-view-active .master-list-panel[b-kyz3uhuu8u] {
        transform: translateX(-20%);
        opacity: 0.5;
    }

    /* Ajustes internos */
    .form-row[b-kyz3uhuu8u] {
        flex-direction: column;
        gap: 0;
    }

    .form-group[b-kyz3uhuu8u] {
        margin-bottom: 0.8rem;
    }
}
/* _content/ImagineTheFuture.BlazorServer/Pages/Index.razor.rz.scp.css */
/* Index.razor.css
   Controlador Maestro de la Landing Page
*/

/* 1. WRAPPER PRINCIPAL (El "Corsé")
   Esta clase es fundamental. Atrapa cualquier elemento hijo que intente
   salirse del ancho de la pantalla (overflow-x) y asegura que el layout
   sea "ultra-modernist" (full width) sin barras horizontales.
*/
.landing-page-wrapper[b-epp9h8btby] {
    width: 100%;
    max-width: 100%;
    /* CRÍTICO: Esto elimina el scroll horizontal causado por animaciones 
       que entran desde los lados o anchos mal calculados (100vw).
    */
    overflow-x: hidden;
    display: flex;
    flex-direction: column;
    min-height: 100vh;
}

/* 2. CORRECCIÓN DE HIJOS (Deep Selectors)
   El HeroCarousel tiene por defecto width: 100vw. En Windows, eso incluye
   el ancho de la barra de scroll vertical, causando scroll horizontal.
   Aquí lo forzamos a ser 100% del padre (que ya descuenta la barra).
*/
[b-epp9h8btby] .hero-carousel {
    width: 100% !important;
    max-width: 100vw;
}

/* Aseguramos que las secciones de contenido tampoco se pasen 
*/
[b-epp9h8btby] section {
    max-width: 100%;
    width: 100%;
    overflow-x: clip; /* Clip es más moderno que hidden para paint operations */
}

/* 3. PANTALLA DE CARGA (Loading State)
   Estilo Dark/Energy para el momento de inicialización del workspace.
*/
.index-loading-wrapper[b-epp9h8btby] {
    position: fixed;
    inset: 0;
    z-index: 40; /* Debajo del TopBar (50) pero sobre el contenido */
    background-color: var(--palette-black, #000);
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 1.5rem;
}

.loader-spinner[b-epp9h8btby] {
    width: 50px;
    height: 50px;
    border: 3px solid rgba(255, 255, 255, 0.1);
    border-radius: 50%;
    border-top-color: var(--palette-primary, #00A3E0); /* Azul Energía */
    animation: spin-b-epp9h8btby 1s ease-in-out infinite;
    box-shadow: 0 0 15px rgba(0, 163, 224, 0.2);
}

.loading-text[b-epp9h8btby] {
    font-family: 'Montserrat', sans-serif;
    color: var(--palette-soft-white, #F0F2F5);
    font-size: 0.9rem;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    animation: pulse-b-epp9h8btby 1.5s infinite;
}

/* Animaciones del Loader */
@keyframes spin-b-epp9h8btby {
    to {
        transform: rotate(360deg);
    }
}

@keyframes pulse-b-epp9h8btby {
    0%, 100% {
        opacity: 0.6;
    }

    50% {
        opacity: 1;
    }
}
/* _content/ImagineTheFuture.BlazorServer/Pages/Profile/ForgotPassword.razor.rz.scp.css */
/* =================================================================
   FORGOT PASSWORD - Estilo Unificado (Energy Edition)
   ================================================================= */

/* Contenedor de Página Completa */
.auth-page-container[b-3nkzcj7hff] {
    display: flex;
    justify-content: center;
    align-items: center;
    min-height: 85vh;
    padding: 1rem;
    background-color: transparent;
}

/* Tarjeta Principal */
.auth-card[b-3nkzcj7hff] {
    width: 100%;
    max-width: 450px;
    background-color: rgba(18, 18, 18, 0.95);
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-radius: 4px; /* Industrial */
    padding: 2.5rem 2rem;
    box-shadow: 0 20px 50px rgba(0,0,0,0.7);
    position: relative;
    backdrop-filter: blur(10px);
}

    /* Decoración superior */
    .auth-card[b-3nkzcj7hff]::before {
        content: '';
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 3px;
        background: var(--palette-primary);
        box-shadow: 0 0 10px var(--palette-primary);
    }

/* Animación */
.animate-fade-in[b-3nkzcj7hff] {
    animation: fadeIn-b-3nkzcj7hff 0.5s ease-out forwards;
}

@keyframes fadeIn-b-3nkzcj7hff {
    from {
        opacity: 0;
        transform: translateY(10px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* --- Títulos --- */
.auth-title[b-3nkzcj7hff] {
    text-align: center;
    font-size: 1.8rem;
    font-weight: 800;
    color: var(--palette-white);
    margin-bottom: 0.5rem;
    font-family: 'Montserrat', sans-serif;
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

.auth-subtitle[b-3nkzcj7hff] {
    text-align: center;
    color: var(--palette-gray-light);
    margin-bottom: 2rem;
    font-size: 0.9rem;
    font-family: 'Montserrat', sans-serif;
    opacity: 0.8;
}

/* --- Inputs --- */
.form-group[b-3nkzcj7hff] {
    margin-bottom: 1.25rem;
}

    .form-group label[b-3nkzcj7hff] {
        display: block;
        margin-bottom: 0.4rem;
        color: var(--palette-primary);
        font-size: 0.8rem;
        font-weight: 600;
        text-transform: uppercase;
        letter-spacing: 0.05em;
    }

[b-3nkzcj7hff] .form-control {
    width: 100%;
    padding: 0.8rem 1rem;
    background-color: rgba(0, 0, 0, 0.3);
    border: 1px solid rgba(255, 255, 255, 0.15);
    border-radius: 2px;
    color: var(--palette-white);
    font-family: 'Montserrat', sans-serif;
    font-size: 1rem;
    transition: all 0.3s ease;
}

    [b-3nkzcj7hff] .form-control:focus {
        border-color: var(--palette-primary);
        background-color: rgba(0, 0, 0, 0.5);
        box-shadow: 0 0 0 2px rgba(0, 163, 224, 0.2);
        outline: none;
    }

    [b-3nkzcj7hff] .form-control::placeholder {
        color: rgba(255, 255, 255, 0.3);
    }

[b-3nkzcj7hff] .validation-message {
    color: var(--palette-danger);
    font-size: 0.8rem;
    margin-top: 0.3rem;
    font-weight: 500;
}

/* --- Botones --- */
.form-actions-auth[b-3nkzcj7hff] {
    margin-top: 1.5rem;
}

.btn-primary-custom[b-3nkzcj7hff] {
    width: 100%;
    padding: 0.9rem;
    border-radius: 2px;
    border: none;
    font-family: 'Montserrat', sans-serif;
    font-weight: 700;
    cursor: pointer;
    background-color: var(--palette-primary);
    color: var(--palette-white);
    font-size: 1rem;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    transition: all 0.3s ease;
    box-shadow: 0 4px 15px rgba(0,0,0,0.3);
}

    .btn-primary-custom:hover:not(:disabled)[b-3nkzcj7hff] {
        background-color: #0088BE;
        transform: translateY(-2px);
        box-shadow: 0 6px 20px rgba(0, 163, 224, 0.4);
    }

    .btn-primary-custom:disabled[b-3nkzcj7hff] {
        opacity: 0.6;
        cursor: not-allowed;
        background-color: var(--palette-gray-mid);
        transform: none;
        box-shadow: none;
    }

.btn-secondary-custom[b-3nkzcj7hff] {
    background-color: transparent;
    border: 1px solid var(--palette-gray-light);
    color: var(--palette-white);
    font-family: 'Montserrat', sans-serif;
    font-weight: 600;
    border-radius: 2px;
    cursor: pointer;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    transition: all 0.3s ease;
}

    .btn-secondary-custom:hover[b-3nkzcj7hff] {
        background-color: rgba(255, 255, 255, 0.1);
        border-color: var(--palette-white);
    }

/* --- Footer --- */
.auth-footer[b-3nkzcj7hff] {
    margin-top: 2rem;
}

.text-gold[b-3nkzcj7hff] {
    color: var(--palette-primary) !important;
    text-decoration: none;
}

    .text-gold:hover[b-3nkzcj7hff] {
        color: var(--palette-white) !important;
        text-decoration: underline !important;
    }

/* --- Alertas --- */
.alert[b-3nkzcj7hff] {
    padding: 0.75rem 1rem;
    border-radius: 2px;
    margin-bottom: 1rem;
    font-size: 0.9rem;
}

.alert-danger[b-3nkzcj7hff] {
    background-color: rgba(229, 62, 62, 0.15);
    color: #ff6b6b;
    border: 1px solid #e53e3e;
    border-left: 3px solid #e53e3e;
}

.alert-success[b-3nkzcj7hff] {
    background-color: rgba(38, 176, 80, 0.1);
    color: #4ade80;
    border: 1px solid #26b050;
    border-radius: 4px;
}

.text-success[b-3nkzcj7hff] {
    color: #4ade80 !important;
}

/* Spinner */
.spinner-border-sm[b-3nkzcj7hff] {
    width: 1.2rem;
    height: 1.2rem;
    border: 2px solid rgba(255,255,255,0.3);
    border-top: 2px solid white;
    border-radius: 50%;
    animation: spin-b-3nkzcj7hff 0.75s linear infinite;
    margin-right: 0.5rem;
}

@keyframes spin-b-3nkzcj7hff {
    to {
        transform: rotate(360deg);
    }
}

/* Responsive */
@media (max-width: 576px) {
    .auth-card[b-3nkzcj7hff] {
        padding: 1.5rem;
    }

    .auth-title[b-3nkzcj7hff] {
        font-size: 1.5rem;
    }
}
/* _content/ImagineTheFuture.BlazorServer/Pages/Profile/ProfileEmail.razor.rz.scp.css */
/* Reutilizamos estructura de tarjeta */
.profile-card[b-0cgy7b7ysq] {
    background-color: #FFFFFF;
    border: 1px solid var(--palette-gray-light);
    border-radius: 4px;
    padding: 2rem;
    box-shadow: 0 4px 20px rgba(0,0,0,0.05);
    max-width: 600px;
    margin: 0 auto;
}

.profile-header[b-0cgy7b7ysq] {
    margin-bottom: 2rem;
    border-bottom: 1px solid #E5E7EB;
    padding-bottom: 1rem;
}

.profile-title[b-0cgy7b7ysq] {
    font-family: 'Montserrat', sans-serif;
    font-weight: 700;
    color: var(--palette-carbon-deep);
    font-size: 1.5rem;
    margin: 0;
}

.profile-subtitle[b-0cgy7b7ysq] {
    color: var(--palette-gray-mid);
    font-size: 0.9rem;
    margin-top: 0.5rem;
}

.form-group[b-0cgy7b7ysq] {
    margin-bottom: 1.5rem;
}

label[b-0cgy7b7ysq] {
    display: block;
    margin-bottom: 0.5rem;
    font-weight: 600;
    font-size: 0.8rem;
    color: var(--palette-primary);
    text-transform: uppercase;
}

.readonly-input-group[b-0cgy7b7ysq] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.form-control[b-0cgy7b7ysq] {
    flex-grow: 1;
    padding: 0.8rem 1rem;
    background-color: #F3F4F6;
    border: 1px solid #E5E7EB;
    border-radius: 2px;
    color: var(--palette-carbon-deep);
    font-family: 'Montserrat', sans-serif;
}

.status-icon.success[b-0cgy7b7ysq] {
    color: #26b050;
    font-size: 1.2rem;
}

.help-text[b-0cgy7b7ysq] {
    display: block;
    margin-top: 0.5rem;
    color: var(--palette-gray-mid);
    font-size: 0.8rem;
}

.animate-fade-in[b-0cgy7b7ysq] {
    animation: fadeIn-b-0cgy7b7ysq 0.4s ease-out;
}

@keyframes fadeIn-b-0cgy7b7ysq {
    from {
        opacity: 0;
        transform: translateY(10px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}
/* _content/ImagineTheFuture.BlazorServer/Pages/Profile/ProfileExternalLogins.razor.rz.scp.css */
/* Reutilizamos la tarjeta base */
.profile-card[b-pjxat6j5o8] {
    background-color: #FFFFFF;
    border: 1px solid var(--palette-gray-light);
    border-radius: 4px;
    padding: 2rem;
    box-shadow: 0 4px 20px rgba(0,0,0,0.05);
    max-width: 600px;
    margin: 0 auto;
}

.profile-header[b-pjxat6j5o8] {
    margin-bottom: 2rem;
    border-bottom: 1px solid #E5E7EB;
    padding-bottom: 1rem;
}

.profile-title[b-pjxat6j5o8] {
    font-family: 'Montserrat', sans-serif;
    font-weight: 700;
    color: var(--palette-carbon-deep);
    font-size: 1.5rem;
    margin: 0;
}

.profile-subtitle[b-pjxat6j5o8] {
    color: var(--palette-gray-mid);
    font-size: 0.9rem;
    margin-top: 0.5rem;
}

.logins-list[b-pjxat6j5o8] {
    display: flex;
    flex-direction: column;
    gap: 1rem;
    margin-bottom: 2rem;
}

.login-item[b-pjxat6j5o8] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 1rem;
    border: 1px solid #E5E7EB;
    border-radius: 2px;
    background-color: #F9FAFB;
}

.provider-info[b-pjxat6j5o8] {
    display: flex;
    align-items: center;
    gap: 0.8rem;
    font-weight: 600;
    color: var(--palette-carbon-deep);
}

.google-icon[b-pjxat6j5o8] {
    color: #DB4437;
    font-size: 1.2rem;
}

.btn-remove[b-pjxat6j5o8] {
    background: transparent;
    border: 1px solid var(--palette-danger);
    color: var(--palette-danger);
    padding: 0.4rem 1rem;
    border-radius: 2px;
    cursor: pointer;
    font-size: 0.8rem;
    font-weight: 600;
    transition: all 0.2s;
}

    .btn-remove:hover[b-pjxat6j5o8] {
        background-color: rgba(229, 62, 62, 0.1);
    }

.badge-required[b-pjxat6j5o8] {
    font-size: 0.75rem;
    color: var(--palette-gray-mid);
    background-color: #E5E7EB;
    padding: 0.2rem 0.6rem;
    border-radius: 2px;
}

.separator-line[b-pjxat6j5o8] {
    height: 1px;
    background-color: #E5E7EB;
    margin: 2rem 0 1rem 0;
}

h4[b-pjxat6j5o8] {
    font-size: 1rem;
    font-weight: 700;
    color: var(--palette-primary);
    text-transform: uppercase;
    margin-bottom: 1rem;
}

.btn-google-connect[b-pjxat6j5o8] {
    display: flex;
    align-items: center;
    gap: 0.8rem;
    background-color: #FFFFFF;
    color: var(--palette-carbon-deep);
    border: 1px solid var(--palette-gray-light);
    padding: 0.8rem 1.5rem;
    border-radius: 2px;
    font-weight: 600;
    cursor: pointer;
    box-shadow: 0 2px 5px rgba(0,0,0,0.05);
    transition: all 0.2s;
}

    .btn-google-connect:hover[b-pjxat6j5o8] {
        border-color: var(--palette-primary);
        color: var(--palette-primary);
    }

.text-muted[b-pjxat6j5o8] {
    color: var(--palette-gray-mid);
}

.animate-fade-in[b-pjxat6j5o8] {
    animation: fadeIn-b-pjxat6j5o8 0.4s ease-out;
}

@keyframes fadeIn-b-pjxat6j5o8 {
    from {
        opacity: 0;
        transform: translateY(10px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}
/* _content/ImagineTheFuture.BlazorServer/Pages/Profile/ProfileIndex.razor.rz.scp.css */
/* ProfileIndex.razor.css
   Estilo: Engineering Blueprint (Light)
*/

.profile-container[b-ac4kb2d6k1] {
    padding-bottom: 2rem;
}

.profile-card[b-ac4kb2d6k1] {
    background-color: #FFFFFF;
    border: 1px solid var(--palette-gray-light);
    border-radius: 4px;
    padding: 2rem;
    box-shadow: 0 4px 20px rgba(0,0,0,0.05);
    max-width: 800px;
    margin: 0 auto;
}

/* --- TARJETA DE IDENTIDAD --- */
.profile-header-compact[b-ac4kb2d6k1] {
    display: flex;
    align-items: center;
}

.user-identity-row[b-ac4kb2d6k1] {
    display: flex;
    align-items: center;
    gap: 1.5rem;
    width: 100%;
    flex-wrap: wrap;
}

.avatar-large[b-ac4kb2d6k1] {
    width: 80px;
    height: 80px;
    border-radius: 50%;
    overflow: hidden;
    border: 2px solid var(--palette-primary);
    padding: 2px;
    background-color: #fff;
    flex-shrink: 0;
}

    .avatar-large img[b-ac4kb2d6k1] {
        width: 100%;
        height: 100%;
        border-radius: 50%;
        object-fit: cover;
    }

.identity-info[b-ac4kb2d6k1] {
    flex-grow: 1;
}

.user-name[b-ac4kb2d6k1] {
    margin: 0;
    font-size: 1.4rem;
    font-weight: 800;
    color: var(--palette-carbon-deep);
    font-family: 'Montserrat', sans-serif;
    text-transform: uppercase;
}

.badges-row[b-ac4kb2d6k1] {
    display: flex;
    gap: 0.5rem;
    margin: 0.3rem 0;
    flex-wrap: wrap;
}

.role-badge[b-ac4kb2d6k1] {
    background-color: var(--palette-carbon-deep);
    color: white;
    font-size: 0.7rem;
    font-weight: 700;
    padding: 0.2rem 0.6rem;
    border-radius: 2px;
    text-transform: uppercase;
}

.id-badge[b-ac4kb2d6k1] {
    font-size: 0.75rem;
    color: var(--palette-gray-mid);
    border: 1px solid #E5E7EB;
    padding: 0.2rem 0.5rem;
    border-radius: 2px;
    background-color: #F9FAFB;
}

.monospace[b-ac4kb2d6k1] {
    font-family: 'Consolas', monospace;
}

.context-active-text[b-ac4kb2d6k1] {
    font-size: 0.9rem;
    color: var(--palette-primary);
    margin-top: 0.3rem;
    font-weight: 500;
}

/* --- GESTIÓN DE VISORES --- */
.card-header-actions[b-ac4kb2d6k1] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 1.5rem;
    border-bottom: 1px solid #E5E7EB;
    padding-bottom: 1rem;
}

.header-text h3[b-ac4kb2d6k1] {
    margin: 0;
    font-size: 1.2rem;
    font-weight: 700;
    color: var(--palette-carbon-deep);
}

.header-text .subtitle[b-ac4kb2d6k1] {
    margin: 0;
    font-size: 0.9rem;
    color: var(--palette-gray-mid);
}

.btn-icon-add[b-ac4kb2d6k1] {
    background-color: var(--palette-primary);
    color: white;
    border: none;
    width: 36px;
    height: 36px;
    border-radius: 50%;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 4px 10px rgba(0, 163, 224, 0.3);
    transition: transform 0.2s;
}

    .btn-icon-add:hover[b-ac4kb2d6k1] {
        transform: scale(1.1);
        background-color: #0088BE;
    }

.watches-list[b-ac4kb2d6k1] {
    display: flex;
    flex-direction: column;
}

.watch-item[b-ac4kb2d6k1] {
    display: flex;
    align-items: center;
    gap: 1rem;
    padding: 1rem;
    border-bottom: 1px solid #F3F4F6;
    transition: background 0.2s;
}

    .watch-item:last-child[b-ac4kb2d6k1] {
        border-bottom: none;
    }

    .watch-item:hover[b-ac4kb2d6k1] {
        background-color: #F9FAFB;
    }

    .watch-item.active[b-ac4kb2d6k1] {
        background-color: rgba(0, 163, 224, 0.04);
        border-left: 3px solid var(--palette-primary);
    }

.viewer-wrapper-sm[b-ac4kb2d6k1] {
    width: 50px;
    height: 50px;
}
/* Ajuste para el componente hijo */
[b-ac4kb2d6k1] .watch-image-wrapper {
    width: 100%;
    height: 100%;
}

[b-ac4kb2d6k1] .image-preview-container {
    border-width: 1px;
}

.watch-info-col[b-ac4kb2d6k1] {
    flex-grow: 1;
}

.title-row[b-ac4kb2d6k1] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

    .title-row h5[b-ac4kb2d6k1] {
        margin: 0;
        font-size: 1rem;
        font-weight: 600;
        color: var(--palette-carbon-deep);
    }

.watch-type[b-ac4kb2d6k1] {
    font-size: 0.75rem;
    color: var(--palette-gray-mid);
    text-transform: uppercase;
}

.watch-actions-col[b-ac4kb2d6k1] {
    text-align: right;
}

.badge-active[b-ac4kb2d6k1] {
    font-size: 0.7rem;
    font-weight: 800;
    color: var(--palette-primary);
    background-color: rgba(0, 163, 224, 0.1);
    padding: 0.3rem 0.6rem;
    border-radius: 2px;
}

.btn-activate[b-ac4kb2d6k1] {
    background: white;
    border: 1px solid #E5E7EB;
    color: var(--palette-gray-mid);
    padding: 0.3rem 0.8rem;
    border-radius: 2px;
    cursor: pointer;
    font-size: 0.75rem;
    font-weight: 600;
    text-transform: uppercase;
}

    .btn-activate:hover[b-ac4kb2d6k1] {
        color: var(--palette-primary);
        border-color: var(--palette-primary);
    }

/* Edición en línea */
.inline-edit[b-ac4kb2d6k1] {
    display: flex;
    gap: 0.3rem;
}

.form-control.sm[b-ac4kb2d6k1] {
    padding: 0.3rem;
    font-size: 0.9rem;
    border: 1px solid #D1D5DB;
    border-radius: 2px;
}

.btn-icon-edit-sm[b-ac4kb2d6k1], .btn-icon-check[b-ac4kb2d6k1], .btn-icon-times[b-ac4kb2d6k1] {
    background: none;
    border: none;
    cursor: pointer;
    color: var(--palette-gray-mid);
}

    .btn-icon-edit-sm:hover[b-ac4kb2d6k1] {
        color: var(--palette-primary);
    }

.btn-icon-check[b-ac4kb2d6k1] {
    color: #26b050;
}

.btn-icon-times[b-ac4kb2d6k1] {
    color: #e53e3e;
}

/* --- HUB DE NAVEGACIÓN --- */
/* Modificado para ser una pila vertical alineada con las tarjetas superiores */
.context-actions-stack[b-ac4kb2d6k1] {
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
    margin: 1rem auto 0 auto; /* Centrado automático */
    max-width: 800px; /* Mismo ancho que .profile-card */
    width: 100%;
}

.context-card[b-ac4kb2d6k1] {
    display: flex;
    align-items: center;
    gap: 1rem;
    padding: 1.5rem;
    border-radius: 4px;
    text-decoration: none;
    transition: all 0.2s ease;
    border: 1px solid transparent;
    background-color: white;
    box-shadow: 0 2px 8px rgba(0,0,0,0.03);
    /* Aseguramos que tome el ancho del contenedor */
    width: 100%;
    box-sizing: border-box;
}

    .context-card .card-text h4[b-ac4kb2d6k1] {
        margin: 0;
        font-size: 1rem;
        font-weight: 700;
        color: var(--palette-carbon-deep);
        text-transform: uppercase;
    }

    .context-card .card-text p[b-ac4kb2d6k1] {
        margin: 0.2rem 0 0;
        font-size: 0.85rem;
        color: var(--palette-gray-mid);
    }

    .context-card .arrow[b-ac4kb2d6k1] {
        margin-left: auto;
        color: #D1D5DB;
    }

    .context-card.business[b-ac4kb2d6k1] {
        background-color: #F0F9FF;
        border-color: #BAE6FD;
    }

        .context-card.business:hover[b-ac4kb2d6k1] {
            transform: translateY(-3px);
            border-color: var(--palette-primary);
            box-shadow: 0 5px 15px rgba(0,163,224,0.1);
        }

        .context-card.business .card-icon[b-ac4kb2d6k1] {
            color: var(--palette-primary);
            font-size: 1.8rem;
        }

    .context-card.employee[b-ac4kb2d6k1] {
        background-color: #F8FAFC;
        border-color: #CBD5E1;
    }

        .context-card.employee:hover[b-ac4kb2d6k1] {
            transform: translateY(-3px);
            border-color: #94A3B8;
            box-shadow: 0 5px 15px rgba(0,0,0,0.08);
        }

        .context-card.employee .card-icon[b-ac4kb2d6k1] {
            color: #64748B;
            font-size: 1.8rem;
        }

/* Empty State */
.empty-watches[b-ac4kb2d6k1] {
    text-align: center;
    padding: 2rem;
    color: var(--palette-gray-mid);
}

.btn-secondary[b-ac4kb2d6k1] {
    background-color: #E5E7EB;
    color: var(--palette-gray-mid);
    padding: 0.5rem 1rem;
    border: none;
    border-radius: 2px;
    cursor: pointer;
}

/* Utils */
.separator-line[b-ac4kb2d6k1] {
    height: 1px;
    background-color: #E5E7EB;
    margin: 2rem 0;
}

.mb-4[b-ac4kb2d6k1] {
    margin-bottom: 2rem;
}

.animate-fade-in[b-ac4kb2d6k1] {
    animation: fadeIn-b-ac4kb2d6k1 0.4s ease-out;
}

@keyframes fadeIn-b-ac4kb2d6k1 {
    from {
        opacity: 0;
        transform: translateY(10px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* Wall */
.profile-security-wall[b-ac4kb2d6k1] {
    display: flex;
    justify-content: center;
    align-items: center;
    min-height: 60vh;
    padding: 2rem;
}

.wall-content[b-ac4kb2d6k1] {
    background-color: #FFFFFF;
    border: 2px dashed #E5E7EB;
    border-radius: 4px;
    padding: 3rem 2rem;
    text-align: center;
    max-width: 450px;
    width: 100%;
}

.wall-icon-wrapper[b-ac4kb2d6k1] {
    font-size: 3rem;
    color: var(--palette-gray-light);
    margin-bottom: 1rem;
}

.wall-title[b-ac4kb2d6k1] {
    font-family: 'Montserrat', sans-serif;
    font-weight: 700;
    color: var(--palette-carbon-deep);
    margin-bottom: 0.5rem;
}

.wall-message[b-ac4kb2d6k1] {
    color: var(--palette-gray-mid);
    margin-bottom: 2rem;
}

.wall-form-wrapper[b-ac4kb2d6k1] {
    text-align: left;
    background-color: #F9FAFB;
    padding: 1.5rem;
    border-radius: 4px;
    border: 1px solid #E5E7EB;
}

/* Modal */
.modal-overlay[b-ac4kb2d6k1] {
    position: fixed;
    inset: 0;
    z-index: 2000;
    background-color: rgba(0,0,0,0.5);
    backdrop-filter: blur(2px);
    display: flex;
    justify-content: center;
    align-items: center;
    animation: fadeIn-b-ac4kb2d6k1 0.2s;
}

.modal-card[b-ac4kb2d6k1] {
    background-color: white;
    padding: 2rem;
    border-radius: 4px;
    width: 90%;
    max-width: 400px;
    box-shadow: 0 20px 50px rgba(0,0,0,0.2);
}

.modal-actions[b-ac4kb2d6k1] {
    display: flex;
    justify-content: flex-end;
    gap: 1rem;
    margin-top: 1.5rem;
}

.btn-cancel[b-ac4kb2d6k1] {
    background: transparent;
    border: 1px solid var(--palette-gray-light);
    color: var(--palette-gray-mid);
    padding: 0.6rem 1.2rem;
    border-radius: 2px;
    cursor: pointer;
}

.btn-save[b-ac4kb2d6k1] {
    background-color: var(--palette-primary);
    color: white;
    border: none;
    padding: 0.6rem 1.2rem;
    border-radius: 2px;
    cursor: pointer;
    font-weight: 700;
}

.form-group[b-ac4kb2d6k1] {
    margin-bottom: 1rem;
}

.form-control[b-ac4kb2d6k1] {
    width: 100%;
    padding: 0.6rem;
    border: 1px solid #D1D5DB;
    border-radius: 2px;
}
/* _content/ImagineTheFuture.BlazorServer/Pages/Profile/ProfilePassword.razor.rz.scp.css */
/* Estilos Idénticos al de Email para consistencia */
.profile-card[b-1fkxojawie] {
    background-color: #FFFFFF;
    border: 1px solid var(--palette-gray-light);
    border-radius: 4px;
    padding: 2rem;
    box-shadow: 0 4px 20px rgba(0,0,0,0.05);
    max-width: 600px;
    margin: 0 auto;
}

.profile-header[b-1fkxojawie] {
    margin-bottom: 2rem;
    border-bottom: 1px solid #E5E7EB;
    padding-bottom: 1rem;
}

.profile-title[b-1fkxojawie] {
    font-family: 'Montserrat', sans-serif;
    font-weight: 700;
    color: var(--palette-carbon-deep);
    font-size: 1.5rem;
    margin: 0;
}

.profile-subtitle[b-1fkxojawie] {
    color: var(--palette-gray-mid);
    font-size: 0.9rem;
    margin-top: 0.5rem;
}

.form-group[b-1fkxojawie] {
    margin-bottom: 1.5rem;
}

[b-1fkxojawie] label {
    display: block;
    margin-bottom: 0.5rem;
    font-weight: 600;
    font-size: 0.8rem;
    color: var(--palette-primary);
    text-transform: uppercase;
}

[b-1fkxojawie] .form-control {
    display: block;
    width: 100%;
    padding: 0.8rem 1rem;
    background-color: #FFFFFF;
    border: 1px solid var(--palette-gray-light);
    border-radius: 2px;
    color: var(--palette-carbon-deep);
    transition: all 0.2s;
}

    [b-1fkxojawie] .form-control:focus {
        border-color: var(--palette-primary);
        box-shadow: 0 0 0 1px var(--palette-primary);
        outline: none;
    }

[b-1fkxojawie] .validation-message {
    color: var(--palette-danger);
    font-size: 0.75rem;
    margin-top: 0.25rem;
}

.form-actions[b-1fkxojawie] {
    display: flex;
    justify-content: flex-end;
    margin-top: 2rem;
}

.btn-save[b-1fkxojawie] {
    background-color: var(--palette-primary);
    color: white;
    border: none;
    padding: 0.8rem 2rem;
    border-radius: 2px;
    font-weight: 700;
    text-transform: uppercase;
    cursor: pointer;
    transition: background 0.2s;
}

    .btn-save:hover[b-1fkxojawie] {
        background-color: #0088BE;
    }

    .btn-save:disabled[b-1fkxojawie] {
        opacity: 0.6;
        cursor: not-allowed;
    }

.animate-fade-in[b-1fkxojawie] {
    animation: fadeIn-b-1fkxojawie 0.4s ease-out;
}

@keyframes fadeIn-b-1fkxojawie {
    from {
        opacity: 0;
        transform: translateY(10px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}
/* _content/ImagineTheFuture.BlazorServer/Pages/Profile/ProfilePersonalData.razor.rz.scp.css */
/* Reutilizamos tarjeta base */
.profile-card[b-8e7c41zszi] {
    background-color: #FFFFFF;
    border: 1px solid var(--palette-gray-light);
    border-radius: 4px;
    padding: 2rem;
    box-shadow: 0 4px 20px rgba(0,0,0,0.05);
    max-width: 700px;
    margin: 0 auto;
}

.profile-header[b-8e7c41zszi] {
    margin-bottom: 2rem;
    border-bottom: 1px solid #E5E7EB;
    padding-bottom: 1rem;
}

.profile-title[b-8e7c41zszi] {
    font-family: 'Montserrat', sans-serif;
    font-weight: 700;
    color: var(--palette-carbon-deep);
    font-size: 1.5rem;
    margin: 0;
}

.profile-subtitle[b-8e7c41zszi] {
    color: var(--palette-gray-mid);
    font-size: 0.9rem;
    margin-top: 0.5rem;
}

.info-block[b-8e7c41zszi] {
    margin-bottom: 2rem;
    color: var(--palette-carbon-deep);
    line-height: 1.5;
}

/* Preview de Datos */
.data-preview[b-8e7c41zszi] {
    background-color: #F9FAFB;
    border: 1px solid #E5E7EB;
    padding: 1rem;
    border-radius: 2px;
    margin-bottom: 2rem;
}

    .data-preview h5[b-8e7c41zszi] {
        margin-top: 0;
        color: var(--palette-primary);
        font-size: 0.9rem;
        text-transform: uppercase;
    }

.data-list[b-8e7c41zszi] {
    list-style: none;
    padding: 0;
    margin: 0;
}

    .data-list li[b-8e7c41zszi] {
        font-size: 0.9rem;
        margin-bottom: 0.4rem;
        color: var(--palette-gray-mid);
    }

    .data-list strong[b-8e7c41zszi] {
        color: var(--palette-carbon-deep);
    }

/* Botones Principales */
.actions-row[b-8e7c41zszi] {
    display: flex;
    gap: 1rem;
    flex-wrap: wrap;
}

.btn-download[b-8e7c41zszi] {
    background-color: var(--palette-primary);
    color: white;
    border: none;
    padding: 0.8rem 1.5rem;
    border-radius: 2px;
    cursor: pointer;
    font-weight: 600;
}

    .btn-download:disabled[b-8e7c41zszi] {
        opacity: 0.6;
        cursor: default;
        background-color: var(--palette-gray-mid);
    }

.btn-delete[b-8e7c41zszi] {
    background-color: transparent;
    border: 1px solid var(--palette-danger);
    color: var(--palette-danger);
    padding: 0.8rem 1.5rem;
    border-radius: 2px;
    cursor: pointer;
    font-weight: 600;
}

    .btn-delete:hover[b-8e7c41zszi] {
        background-color: var(--palette-danger);
        color: white;
    }

/* Caja de Confirmación (Zona de Peligro) */
.delete-confirmation-box[b-8e7c41zszi] {
    margin-top: 2rem;
    border: 1px solid var(--palette-danger);
    background-color: rgba(229, 62, 62, 0.05);
    padding: 1.5rem;
    border-radius: 4px;
}

.warning-header[b-8e7c41zszi] {
    display: flex;
    align-items: center;
    gap: 0.8rem;
    color: var(--palette-danger);
    margin-bottom: 1rem;
}

    .warning-header i[b-8e7c41zszi] {
        font-size: 1.5rem;
    }

    .warning-header h3[b-8e7c41zszi] {
        margin: 0;
        font-size: 1.1rem;
        font-weight: 800;
        text-transform: uppercase;
    }

.form-control[b-8e7c41zszi] {
    width: 100%;
    padding: 0.8rem;
    border: 1px solid var(--palette-gray-light);
    border-radius: 2px;
    margin-top: 0.5rem;
}

.confirm-actions[b-8e7c41zszi] {
    display: flex;
    justify-content: flex-end;
    gap: 1rem;
    margin-top: 1.5rem;
}

.btn-danger-solid[b-8e7c41zszi] {
    background-color: var(--palette-danger);
    color: white;
    border: none;
    padding: 0.6rem 1.2rem;
    border-radius: 2px;
    cursor: pointer;
    font-weight: 700;
}

    .btn-danger-solid:disabled[b-8e7c41zszi] {
        opacity: 0.5;
        cursor: not-allowed;
    }

.btn-cancel[b-8e7c41zszi] {
    background: transparent;
    border: 1px solid var(--palette-gray-mid);
    color: var(--palette-gray-mid);
    padding: 0.6rem 1.2rem;
    border-radius: 2px;
    cursor: pointer;
}

.animate-fade-in[b-8e7c41zszi] {
    animation: fadeIn-b-8e7c41zszi 0.4s ease-out;
}

@keyframes fadeIn-b-8e7c41zszi {
    from {
        opacity: 0;
        transform: translateY(10px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}
/* _content/ImagineTheFuture.BlazorServer/Pages/Profile/ProfileTwoFactor.razor.rz.scp.css */
/* Estilo Base */
.profile-card[b-94dryf6ljr] {
    background-color: #FFFFFF;
    border: 1px solid var(--palette-gray-light);
    border-radius: 4px;
    padding: 2rem;
    box-shadow: 0 4px 20px rgba(0,0,0,0.05);
    max-width: 700px;
    margin: 0 auto;
}

.profile-header[b-94dryf6ljr] {
    margin-bottom: 2rem;
    border-bottom: 1px solid #E5E7EB;
    padding-bottom: 1rem;
}

.profile-title[b-94dryf6ljr] {
    font-family: 'Montserrat', sans-serif;
    font-weight: 700;
    color: var(--palette-carbon-deep);
    font-size: 1.5rem;
    margin: 0;
}

.profile-subtitle[b-94dryf6ljr] {
    color: var(--palette-gray-mid);
    font-size: 0.9rem;
    margin-top: 0.5rem;
}

/* Status Badge */
.status-section[b-94dryf6ljr] {
    display: flex;
    align-items: center;
    gap: 1rem;
    margin-bottom: 2rem;
    font-family: 'Montserrat', sans-serif;
    font-weight: 600;
    color: var(--palette-carbon-deep);
}

.badge-status[b-94dryf6ljr] {
    padding: 0.3rem 0.8rem;
    border-radius: 50px;
    font-size: 0.8rem;
    text-transform: uppercase;
}

    .badge-status.active[b-94dryf6ljr] {
        background-color: rgba(38, 176, 80, 0.1);
        color: #26b050;
        border: 1px solid #26b050;
    }

    .badge-status.inactive[b-94dryf6ljr] {
        background-color: #F3F4F6;
        color: var(--palette-gray-mid);
        border: 1px solid #E5E7EB;
    }

/* Grid de Acciones (Enabled) */
.actions-grid[b-94dryf6ljr] {
    display: grid;
    grid-template-columns: 1fr;
    gap: 1.5rem;
}

@media (min-width: 600px) {
    .actions-grid[b-94dryf6ljr] {
        grid-template-columns: 1fr 1fr;
    }
}

.action-card[b-94dryf6ljr] {
    background-color: #F9FAFB;
    border: 1px solid #E5E7EB;
    padding: 1.5rem;
    border-radius: 4px;
}

    .action-card h4[b-94dryf6ljr] {
        margin: 0 0 0.5rem 0;
        font-size: 1rem;
        font-weight: 700;
        color: var(--palette-primary);
    }

    .action-card p[b-94dryf6ljr] {
        font-size: 0.9rem;
        color: var(--palette-gray-mid);
        margin-bottom: 1rem;
    }

.danger-zone[b-94dryf6ljr] {
    border-color: rgba(229, 62, 62, 0.3);
    background-color: rgba(229, 62, 62, 0.02);
}

    .danger-zone h4[b-94dryf6ljr] {
        color: var(--palette-danger);
    }

/* Códigos */
.codes-display[b-94dryf6ljr] {
    margin-top: 1rem;
    background-color: #FFFFFF;
    padding: 1rem;
    border: 1px dashed var(--palette-gray-mid);
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
}

.code-pill[b-94dryf6ljr] {
    font-family: 'Consolas', monospace;
    background-color: #E5E7EB;
    padding: 2px 6px;
    border-radius: 2px;
    font-size: 0.9rem;
}

/* Setup Flow */
.setup-section[b-94dryf6ljr] {
    border-top: 1px solid #E5E7EB;
    padding-top: 1.5rem;
}

.setup-steps[b-94dryf6ljr] {
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
}

.step[b-94dryf6ljr] {
    display: flex;
    gap: 1rem;
    align-items: flex-start;
}

.step-num[b-94dryf6ljr] {
    background-color: var(--palette-primary);
    color: white;
    width: 24px;
    height: 24px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 0.8rem;
    font-weight: 700;
    flex-shrink: 0;
}

.key-box[b-94dryf6ljr] {
    background-color: #F3F4F6;
    padding: 1rem;
    border-radius: 4px;
    text-align: center;
    margin-left: 2.5rem; /* Indentación visual */
}

    .key-box label[b-94dryf6ljr] {
        display: block;
        font-size: 0.75rem;
        text-transform: uppercase;
        color: var(--palette-gray-mid);
        margin-bottom: 0.5rem;
    }

    .key-box code[b-94dryf6ljr] {
        font-family: 'Consolas', monospace;
        font-size: 1.2rem;
        letter-spacing: 2px;
        color: var(--palette-carbon-deep);
    }

.verify-form[b-94dryf6ljr] {
    margin-left: 2.5rem;
    display: flex;
    gap: 0.5rem;
    flex-wrap: wrap;
}

.code-input[b-94dryf6ljr] {
    max-width: 150px;
    text-align: center;
    letter-spacing: 0.2em;
    font-size: 1.1rem;
    padding: 0.5rem;
    border: 1px solid var(--palette-gray-mid);
    border-radius: 2px;
}

/* Botones */
.btn-primary-custom[b-94dryf6ljr], .btn-save[b-94dryf6ljr] {
    background-color: var(--palette-primary);
    color: white;
    border: none;
    padding: 0.6rem 1.2rem;
    border-radius: 2px;
    cursor: pointer;
    font-weight: 600;
}

.btn-secondary-custom[b-94dryf6ljr], .btn-cancel[b-94dryf6ljr] {
    background-color: transparent;
    border: 1px solid var(--palette-gray-mid);
    color: var(--palette-gray-mid);
    padding: 0.6rem 1.2rem;
    border-radius: 2px;
    cursor: pointer;
}

.btn-danger-custom[b-94dryf6ljr] {
    background-color: transparent;
    border: 1px solid var(--palette-danger);
    color: var(--palette-danger);
    padding: 0.6rem 1.2rem;
    border-radius: 2px;
    cursor: pointer;
}

    .btn-danger-custom:hover[b-94dryf6ljr] {
        background-color: var(--palette-danger);
        color: white;
    }

.spinner-container[b-94dryf6ljr] {
    text-align: center;
    padding: 2rem;
}

.animate-fade-in[b-94dryf6ljr] {
    animation: fadeIn-b-94dryf6ljr 0.4s ease-out;
}

@keyframes fadeIn-b-94dryf6ljr {
    from {
        opacity: 0;
        transform: translateY(10px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}
/* _content/ImagineTheFuture.BlazorServer/Pages/Profile/ResetPassword.razor.rz.scp.css */
/* =================================================================
   RESET PASSWORD - Estilo Unificado (Energy Edition)
   ================================================================= */

/* Contenedor de Página Completa */
.auth-page-container[b-yzgmkghwt0] {
    display: flex;
    justify-content: center;
    align-items: center;
    min-height: 85vh;
    padding: 1rem;
    background-color: transparent;
}

/* Tarjeta Principal */
.auth-card[b-yzgmkghwt0] {
    width: 100%;
    max-width: 450px;
    background-color: rgba(18, 18, 18, 0.95);
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-radius: 4px;
    padding: 2.5rem 2rem;
    box-shadow: 0 20px 50px rgba(0,0,0,0.7);
    position: relative;
    backdrop-filter: blur(10px);
}

    .auth-card[b-yzgmkghwt0]::before {
        content: '';
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 3px;
        background: var(--palette-primary);
        box-shadow: 0 0 10px var(--palette-primary);
    }

/* Animación */
.animate-fade-in[b-yzgmkghwt0] {
    animation: fadeIn-b-yzgmkghwt0 0.5s ease-out forwards;
}

@keyframes fadeIn-b-yzgmkghwt0 {
    from {
        opacity: 0;
        transform: translateY(10px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* --- Títulos --- */
.auth-title[b-yzgmkghwt0] {
    text-align: center;
    font-size: 1.8rem;
    font-weight: 800;
    color: var(--palette-white);
    margin-bottom: 0.5rem;
    font-family: 'Montserrat', sans-serif;
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

.auth-subtitle[b-yzgmkghwt0] {
    text-align: center;
    color: var(--palette-gray-light);
    margin-bottom: 2rem;
    font-size: 0.9rem;
    font-family: 'Montserrat', sans-serif;
    opacity: 0.8;
}

/* --- Inputs --- */
.form-group[b-yzgmkghwt0] {
    margin-bottom: 1.25rem;
}

    .form-group label[b-yzgmkghwt0] {
        display: block;
        margin-bottom: 0.4rem;
        color: var(--palette-primary);
        font-size: 0.8rem;
        font-weight: 600;
        text-transform: uppercase;
        letter-spacing: 0.05em;
    }

[b-yzgmkghwt0] .form-control {
    width: 100%;
    padding: 0.8rem 1rem;
    background-color: rgba(0, 0, 0, 0.3);
    border: 1px solid rgba(255, 255, 255, 0.15);
    border-radius: 2px;
    color: var(--palette-white);
    font-family: 'Montserrat', sans-serif;
    font-size: 1rem;
    transition: all 0.3s ease;
}

    [b-yzgmkghwt0] .form-control:focus {
        border-color: var(--palette-primary);
        background-color: rgba(0, 0, 0, 0.5);
        box-shadow: 0 0 0 2px rgba(0, 163, 224, 0.2);
        outline: none;
    }

    [b-yzgmkghwt0] .form-control::placeholder {
        color: rgba(255, 255, 255, 0.3);
    }

    /* Input deshabilitado (Correo bloqueado) */
    [b-yzgmkghwt0] .form-control:disabled {
        background-color: rgba(255, 255, 255, 0.05);
        color: var(--palette-gray-light);
        cursor: not-allowed;
        border-style: dashed;
    }

[b-yzgmkghwt0] .validation-message {
    color: var(--palette-danger);
    font-size: 0.8rem;
    margin-top: 0.3rem;
    font-weight: 500;
}

/* --- Botones --- */
.form-actions-auth[b-yzgmkghwt0] {
    margin-top: 1.5rem;
}

.btn-primary-custom[b-yzgmkghwt0] {
    width: 100%;
    padding: 0.9rem;
    border-radius: 2px;
    border: none;
    font-family: 'Montserrat', sans-serif;
    font-weight: 700;
    cursor: pointer;
    background-color: var(--palette-primary);
    color: var(--palette-white);
    font-size: 1rem;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    transition: all 0.3s ease;
    box-shadow: 0 4px 15px rgba(0,0,0,0.3);
}

    .btn-primary-custom:hover:not(:disabled)[b-yzgmkghwt0] {
        background-color: #0088BE;
        transform: translateY(-2px);
        box-shadow: 0 6px 20px rgba(0, 163, 224, 0.4);
    }

    .btn-primary-custom:disabled[b-yzgmkghwt0] {
        opacity: 0.6;
        cursor: not-allowed;
        background-color: var(--palette-gray-mid);
        transform: none;
        box-shadow: none;
    }

.btn-secondary-custom[b-yzgmkghwt0] {
    background-color: transparent;
    border: 1px solid var(--palette-gray-light);
    color: var(--palette-white);
    font-family: 'Montserrat', sans-serif;
    font-weight: 600;
    border-radius: 2px;
    cursor: pointer;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    transition: all 0.3s ease;
}

    .btn-secondary-custom:hover[b-yzgmkghwt0] {
        background-color: rgba(255, 255, 255, 0.1);
        border-color: var(--palette-white);
    }

/* --- Alertas --- */
.alert[b-yzgmkghwt0] {
    padding: 0.75rem 1rem;
    border-radius: 2px;
    margin-bottom: 1rem;
    font-size: 0.9rem;
}

.alert-danger[b-yzgmkghwt0] {
    background-color: rgba(229, 62, 62, 0.15);
    color: #ff6b6b;
    border: 1px solid #e53e3e;
    border-left: 3px solid #e53e3e;
}

.alert-success[b-yzgmkghwt0] {
    background-color: rgba(38, 176, 80, 0.1);
    color: #4ade80;
    border: 1px solid #26b050;
    border-radius: 4px;
}

.text-success[b-yzgmkghwt0] {
    color: #4ade80 !important;
}

.alert-warning[b-yzgmkghwt0] {
    background-color: rgba(245, 158, 11, 0.1);
    color: #fbbf24;
    border: 1px solid #d97706;
    border-radius: 4px;
}

.text-warning[b-yzgmkghwt0] {
    color: #fbbf24 !important;
}

/* Spinner */
.spinner-border-sm[b-yzgmkghwt0] {
    width: 1.2rem;
    height: 1.2rem;
    border: 2px solid rgba(255,255,255,0.3);
    border-top: 2px solid white;
    border-radius: 50%;
    animation: spin-b-yzgmkghwt0 0.75s linear infinite;
    margin-right: 0.5rem;
}

@keyframes spin-b-yzgmkghwt0 {
    to {
        transform: rotate(360deg);
    }
}

/* Responsive */
@media (max-width: 576px) {
    .auth-card[b-yzgmkghwt0] {
        padding: 1.5rem;
    }

    .auth-title[b-yzgmkghwt0] {
        font-size: 1.5rem;
    }
}
/* _content/ImagineTheFuture.BlazorServer/Shared/AdminLayout.razor.rz.scp.css */
/*
 * AdminLayout.razor.css
 * Estilos aislados para el layout principal del Admin (Industrial Edition)
*/

/* === ESTRUCTURA PRINCIPAL === */
.admin-layout[b-xdf8uxu81o] {
    display: flex;
    background-color: var(--palette-carbon-deep); /* Fondo industrial */
    color: var(--palette-soft-white);
    min-height: 100vh;
}

.page-container[b-xdf8uxu81o] {
    flex-grow: 1;
    display: flex;
    flex-direction: column;
    /* margin-left: 260px; */ /* Versión expandida (Descomentar si prefieres) */
    margin-left: 78px; /* Versión colapsada por defecto */
    transition: margin-left 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.app-main-content[b-xdf8uxu81o] {
    flex-grow: 1;
    overflow-y: auto;
    padding: 2rem;
    /* Scrollbar técnico sutil */
    scrollbar-width: thin;
    scrollbar-color: var(--palette-gray-mid) var(--palette-carbon-deep);
}

/* === INTERACCIÓN CON SIDEBAR === */
/* .admin-layout.sidebar-collapsed .page-container { margin-left: 78px; } */

/* === OVERLAY PARA NAVEGACIÓN MÓVIL === */
.mobile-nav-overlay[b-xdf8uxu81o] {
    position: fixed;
    inset: 0;
    background-color: rgba(0, 0, 0, 0.8); /* Más oscuro para enfoque */
    backdrop-filter: blur(4px);
    z-index: 1099;
    animation: fadeInOverlay-b-xdf8uxu81o 0.3s;
}

@keyframes fadeInOverlay-b-xdf8uxu81o {
    from {
        opacity: 0;
    }

    to {
        opacity: 1;
    }
}

/* === LÓGICA RESPONSIVA (MÓVIL) === */
@media (max-width: 992px) {
    .page-container[b-xdf8uxu81o],
    .admin-layout.sidebar-collapsed .page-container[b-xdf8uxu81o] {
        margin-left: 0;
    }

    .app-main-content[b-xdf8uxu81o] {
        padding: calc(60px + 1rem) 1rem 1rem; /* Ajuste para header móvil */
    }
}
/* _content/ImagineTheFuture.BlazorServer/Shared/AdminNotificationDropdown.razor.rz.scp.css */
/* 1. BACKDROP (CORREGIDO) */
.notification-backdrop[b-6oc4vd5qic] {
    position: fixed;
    /* Usamos inset: 0 en lugar de width/height 100vw para evitar scroll horizontal */
    inset: 0;
    z-index: 2000;
    background-color: rgba(0, 0, 0, 0.05);
    cursor: default;
}

/* 2. WRAPPER DEL PANEL */
.notification-panel-wrapper[b-6oc4vd5qic] {
    position: absolute;
    z-index: 2001;
    animation: slideIn-b-6oc4vd5qic 0.2s ease-out;
    background-color: var(--palette-carbon-dark);
    border: 1px solid var(--palette-gray-dark);
    border-radius: 4px;
    box-shadow: 0 10px 40px rgba(0,0,0,0.5);
    overflow: hidden;
    display: flex;
    flex-direction: column;
}

    /* 3. POSICIONAMIENTO DESKTOP (Ajustado) */
    .notification-panel-wrapper.desktop[b-6oc4vd5qic] {
        top: 70px;
        right: 80px; /* Alineación original a la campana */
        width: 360px;
        max-height: 80vh;
    }

    /* 4. POSICIONAMIENTO MÓVIL */
    .notification-panel-wrapper.mobile[b-6oc4vd5qic] {
        top: 65px;
        left: 10px;
        right: 10px;
        width: auto;
        max-width: 450px;
        margin: 0 auto;
        max-height: 70vh;
    }

@keyframes slideIn-b-6oc4vd5qic {
    from {
        opacity: 0;
        transform: translateY(-10px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}
/* _content/ImagineTheFuture.BlazorServer/Shared/AdminSidebar.razor.rz.scp.css */
/*
 * AdminSidebar.razor.css
 * Barra lateral técnica (Industrial Edition) - Animación Refinada
*/

/* === ESTADO BASE (EXPANDIDO) === */
.sidebar[b-3794y0onjt] {
    width: 260px;
    background-color: var(--palette-black); /* Fondo más oscuro que el content */
    border-right: 1px solid var(--palette-gray-dark);
    position: fixed;
    top: 0;
    left: 0;
    height: 100vh;
    transition: width 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    font-family: 'Montserrat', sans-serif;
    z-index: 1100;
    display: flex;
    flex-direction: column;
    overflow-x: hidden; /* Vital para esconder textos al colapsar */
    user-select: none;
}

.sidebar-header[b-3794y0onjt] {
    padding: 1.25rem 0.75rem;
    border-bottom: 1px solid rgba(255,255,255,0.05);
}

    .sidebar-header a[b-3794y0onjt] {
        display: flex;
        align-items: center;
        text-decoration: none;
        color: inherit;
        height: 40px;
    }

    .sidebar-header .icon-placeholder[b-3794y0onjt] {
        width: 63px; /* Ajustado para coincidir con logov2 */
        flex-shrink: 0;
        text-align: left;
        padding-left: .8rem;
    }

    .sidebar-header img[b-3794y0onjt] {
        height: 30px; /* Altura ajustada para logov2 */
        vertical-align: middle;
    }

    .sidebar-header .logo-font[b-3794y0onjt] {
        font-family: 'Montserrat', sans-serif;
        font-weight: 800; /* Extra Bold */
        text-transform: uppercase;
        letter-spacing: 0.1em;
        font-size: 1rem;
        color: var(--palette-white);
        padding-top: 2px;
        /* [ANIMACIÓN] Igual que ClientSidebar */
        transition: opacity 0.2s ease-out 0.1s, transform 0.2s ease-out 0.1s;
        white-space: nowrap;
    }

.sidebar-nav[b-3794y0onjt] {
    flex-grow: 1;
    overflow-y: auto;
    overflow-x: hidden;
    padding-top: 1rem;
    display: flex;
    flex-direction: column;
    scrollbar-width: thin;
    scrollbar-color: var(--palette-gray-dark) transparent;
}

.nav-section[b-3794y0onjt] {
    padding: 0 0.5rem;
    display: flex;
    flex-direction: column;
}

.nav-footer[b-3794y0onjt] {
    margin-top: auto;
    padding-bottom: 1rem;
    border-top: 1px solid rgba(255,255,255,0.05);
    padding-top: 1rem;
}

/* Divisor visual */
.menu-divider[b-3794y0onjt] {
    height: 1px;
    background-color: rgba(255, 255, 255, 0.05);
    margin: 0.5rem 0;
}

[b-3794y0onjt] .nav-link {
    display: flex;
    align-items: center;
    text-decoration: none;
    color: var(--palette-gray-light);
    padding: 0.85rem 0;
    border-radius: 4px;
    margin-bottom: 0.25rem;
    transition: all 0.2s ease-in-out;
}

[b-3794y0onjt] .icon-placeholder {
    width: 55px;
    flex-shrink: 0;
    text-align: center;
    font-size: 1.1rem;
    color: var(--palette-gray-mid);
    transition: color 0.2s;
}

[b-3794y0onjt] .link-text {
    white-space: nowrap;
    opacity: 1;
    font-weight: 500;
    font-size: 0.9rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    /* [ANIMACIÓN] Igual que ClientSidebar */
    transition: opacity 0.2s ease-out 0.1s, transform 0.2s ease-out 0.1s;
}

[b-3794y0onjt] .nav-link:hover {
    background-color: var(--palette-gray-darker);
    color: var(--palette-white);
}

    [b-3794y0onjt] .nav-link:hover .icon-placeholder {
        color: var(--palette-white);
    }

[b-3794y0onjt] .nav-link.active {
    background-color: rgba(0, 163, 224, 0.15);
    color: var(--palette-primary);
    border-left: 3px solid var(--palette-primary);
    border-radius: 0 4px 4px 0;
}

    [b-3794y0onjt] .nav-link.active .icon-placeholder {
        color: var(--palette-primary);
    }

/* --- ESTADO COLAPSADO --- */
.admin-layout.sidebar-collapsed .sidebar[b-3794y0onjt] {
    width: 78px;
}

.admin-layout.sidebar-collapsed .link-text[b-3794y0onjt],
.admin-layout.sidebar-collapsed .logo-font[b-3794y0onjt] {
    opacity: 0;
    pointer-events: none;
    transform: translateX(-10px); /* Efecto slide-out */
}

/* --- ESTADO MÓVIL (RESPONSIVE) --- */
@media (max-width: 992px) {
    .sidebar[b-3794y0onjt] {
        transform: translateX(-100%);
        transition: transform 0.3s ease-in-out;
        box-shadow: 4px 0 15px rgba(0,0,0,0.5);
    }

    .admin-layout.mobile-nav-open .sidebar[b-3794y0onjt] {
        transform: translateX(0);
        width: 260px;
    }

    .admin-layout.mobile-nav-open .link-text[b-3794y0onjt],
    .admin-layout.mobile-nav-open .logo-font[b-3794y0onjt] {
        opacity: 1;
        pointer-events: auto;
        display: inline-block;
        transform: none;
    }
}
/* _content/ImagineTheFuture.BlazorServer/Shared/AdminTopBar.razor.rz.scp.css */
/*
 * AdminTopBar.razor.css
 * Barra superior administrativa (Industrial Edition)
 */

/* =================================================================
   1. BARRA SUPERIOR (ESCRITORIO)
   ================================================================= */
.app-top-bar[b-ugwz8to5xl] {
    position: sticky;
    top: 0;
    z-index: 1050;
    height: 70px;
    background-color: var(--palette-carbon-deep); /* O un tono ligeramente más claro */
    border-bottom: 1px solid var(--palette-gray-dark);
    display: flex;
    align-items: center;
    justify-content: flex-end;
    padding: 0 2rem;
    flex-shrink: 0;
    backdrop-filter: blur(10px);
    user-select: none;
}

.top-bar-actions[b-ugwz8to5xl] {
    display: flex;
    align-items: center;
    gap: 1.5rem;
}

/* =================================================================
   2. BOTÓN DE NOTIFICACIONES
   ================================================================= */
.notification-wrapper[b-ugwz8to5xl] {
    position: relative;
    display: flex;
    align-items: center;
}

.notification-btn[b-ugwz8to5xl] {
    background: none;
    border: none;
    cursor: pointer;
    position: relative;
    padding: 0.5rem;
    color: var(--palette-gray-light);
    font-size: 1.2rem;
    transition: color 0.2s ease, transform 0.2s ease;
    display: flex;
    align-items: center;
    justify-content: center;
}

    .notification-btn:hover[b-ugwz8to5xl] {
        color: var(--palette-primary); /* Azul al hover */
        transform: scale(1.05);
    }

.notification-badge[b-ugwz8to5xl] {
    position: absolute;
    top: 2px;
    right: 2px;
    background-color: var(--palette-danger); /* Rojo de alerta */
    color: white;
    font-size: 0.65rem;
    font-weight: 700;
    border-radius: 2px; /* Badge cuadrado técnico */
    padding: 0 4px;
    min-width: 16px;
    height: 16px;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 2px 4px rgba(0,0,0,0.5);
}

/* =================================================================
   3. BOTÓN DE USUARIO (TRIGGER)
   ================================================================= */
.user-menu-container[b-ugwz8to5xl] {
    position: relative;
}

.user-menu-button[b-ugwz8to5xl] {
    background: transparent;
    border: 1px solid transparent;
    display: flex;
    align-items: center;
    gap: 0.75rem;
    cursor: pointer;
    padding: 0.4rem 0.8rem;
    border-radius: 4px; /* Industrial */
    transition: all 0.2s ease;
    font-family: inherit;
    color: var(--palette-soft-white);
}

    .user-menu-button:hover[b-ugwz8to5xl] {
        background-color: rgba(255, 255, 255, 0.05);
        border-color: rgba(255, 255, 255, 0.1);
    }

.user-name[b-ugwz8to5xl] {
    font-weight: 600;
    font-family: 'Montserrat', sans-serif;
    font-size: 0.9rem;
}

.user-avatar[b-ugwz8to5xl] {
    display: flex;
    align-items: center;
}

/* Distintivo visual para Admin */
.badge-admin[b-ugwz8to5xl] {
    font-size: 0.6rem;
    background-color: var(--palette-primary);
    color: var(--palette-black); /* Contraste alto */
    padding: 2px 6px;
    border-radius: 2px;
    font-weight: 800;
    letter-spacing: 0.5px;
    margin-right: 5px;
    text-transform: uppercase;
}

/* =================================================================
   4. RESPONSIVIDAD MÓVIL
   ================================================================= */
.mobile-header[b-ugwz8to5xl] {
    display: none;
}

@media (max-width: 992px) {
    .app-top-bar[b-ugwz8to5xl] {
        display: none;
    }

    .mobile-header[b-ugwz8to5xl] {
        display: flex;
        align-items: center;
        justify-content: space-between;
        height: 60px;
        padding: 0 1rem;
        background-color: var(--palette-carbon-deep);
        border-bottom: 1px solid var(--palette-gray-dark);
        position: fixed;
        top: 0;
        left: 0;
        width: 100%;
        z-index: 1050;
    }

    .mobile-menu-toggle[b-ugwz8to5xl] {
        background: none;
        border: none;
        font-size: 1.5rem;
        color: var(--palette-soft-white);
        cursor: pointer;
    }

    .mobile-actions[b-ugwz8to5xl] {
        display: flex;
        align-items: center;
        gap: 0.5rem;
    }

        .mobile-actions .user-name[b-ugwz8to5xl] {
            display: none;
        }

        .mobile-actions .badge-admin[b-ugwz8to5xl] {
            display: none;
        }

        .mobile-actions .user-menu-button[b-ugwz8to5xl] {
            padding: 0;
            border: none;
        }
}
/* _content/ImagineTheFuture.BlazorServer/Shared/AdminUserDropdown.razor.rz.scp.css */
/* 1. BACKDROP (CORREGIDO) */
.user-menu-backdrop[b-yqyl65pqme] {
    position: fixed;
    /* Usamos inset: 0 para evitar que el scroll se mueva */
    inset: 0;
    z-index: 2000;
    cursor: default;
    background-color: rgba(0, 0, 0, 0.05);
}

/* 2. PANEL DEL MENÚ */
.user-menu-panel[b-yqyl65pqme] {
    position: absolute;
    top: 75px;
    right: 20px; /* Alineación original al avatar */
    width: 280px;
    background-color: var(--palette-carbon-dark);
    border: 1px solid var(--palette-gray-dark);
    border-radius: 8px; /* Mantengo 8px si prefieres suavidad, o 4px para industrial */
    box-shadow: 0 5px 25px rgba(0,0,0,0.5);
    display: flex;
    flex-direction: column;
    padding: 0.5rem 0;
    animation: slideIn-b-yqyl65pqme 0.2s ease-out;
    overflow: hidden;
}

/* 3. ÍTEMS DE MENÚ */
.btn-menu-item[b-yqyl65pqme] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 0.75rem 1.25rem;
    width: 100%;
    background: none;
    border: none;
    font-family: 'Montserrat', sans-serif;
    font-size: 0.95rem;
    color: var(--palette-soft-white);
    text-decoration: none;
    text-align: left;
    cursor: pointer;
    transition: background-color 0.2s;
}

    .btn-menu-item:hover[b-yqyl65pqme] {
        background-color: var(--palette-gray-darker);
        color: var(--palette-primary);
    }

    .btn-menu-item.disabled[b-yqyl65pqme] {
        opacity: 0.6;
        cursor: default;
    }

.btn-logout-reset[b-yqyl65pqme] {
    margin: 0;
    border-radius: 0;
    color: var(--palette-danger);
}

    .btn-logout-reset:hover[b-yqyl65pqme] {
        background-color: rgba(229, 62, 62, 0.1);
        color: var(--palette-danger);
    }

/* Iconos */
.icon-width[b-yqyl65pqme] {
    width: 20px;
    text-align: center;
    color: var(--palette-gray-mid);
}

.btn-menu-item:hover .icon-width[b-yqyl65pqme] {
    color: var(--palette-primary);
}

/* 4. ESTRUCTURA INTERNA */
.menu-header-profile[b-yqyl65pqme] {
    padding: 0.75rem 1.25rem;
    display: flex;
    flex-direction: column;
    background-color: rgba(0,0,0,0.2);
    border-bottom: 1px solid rgba(255,255,255,0.05);
    margin-bottom: 0.5rem;
}

.profile-name[b-yqyl65pqme] {
    font-weight: 600;
    color: var(--palette-white);
    font-size: 0.95rem;
}

.profile-subtext[b-yqyl65pqme] {
    font-size: 0.75rem;
    margin-top: 2px;
    font-weight: 600;
    letter-spacing: 0.5px;
    color: var(--palette-primary) !important;
    text-transform: uppercase;
}

.menu-header[b-yqyl65pqme] {
    padding: 0.25rem 0;
}

.menu-divider[b-yqyl65pqme] {
    height: 1px;
    background-color: var(--palette-gray-dark);
    margin: 0.5rem 0;
}

/* 5. LISTA DE RELOJES */
.scrollable-list[b-yqyl65pqme] {
    max-height: 300px;
    overflow-y: auto;
    scrollbar-width: thin;
    scrollbar-color: var(--palette-gray-dark) transparent;
}

.watch-item[b-yqyl65pqme] {
    justify-content: flex-start;
}

    .watch-item.active[b-yqyl65pqme] {
        background-color: rgba(0, 163, 224, 0.1);
        border-left: 2px solid var(--palette-primary);
    }

.mini-avatar[b-yqyl65pqme] {
    width: 30px;
    height: 30px;
    border-radius: 50%;
    background-color: var(--palette-gray-darker);
    overflow: hidden;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    border: 1px solid rgba(255,255,255,0.1);
}

    .mini-avatar img[b-yqyl65pqme] {
        width: 100%;
        height: 100%;
        object-fit: cover;
    }

    .mini-avatar i[b-yqyl65pqme] {
        font-size: 1.2rem;
        color: var(--palette-gray-mid);
    }

.item-text[b-yqyl65pqme] {
    flex-grow: 1;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.check-icon[b-yqyl65pqme] {
    color: var(--palette-primary);
    font-size: 0.9rem;
}

@keyframes slideIn-b-yqyl65pqme {
    from {
        opacity: 0;
        transform: translateY(-10px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* RESPONSIVO */
@media (max-width: 992px) {
    .user-menu-panel[b-yqyl65pqme] {
        top: 65px;
        right: 10px;
        left: 10px;
        width: auto;
        max-width: 400px;
        margin: 0 auto;
    }
}
/* _content/ImagineTheFuture.BlazorServer/Shared/ClientLayout.razor.rz.scp.css */
/*
 * ClientLayout.razor.css
 * Estilos aislados para el layout principal del cliente
 * TEMA: Light / Engineering Blueprint (Fondo Claro, Texto Oscuro)
*/

/* === ESTRUCTURA PRINCIPAL === */
.client-layout[b-m1n1hp5li0] {
    display: flex;
    /* CAMBIO: Fondo claro técnico para el área de cliente */
    background-color: var(--palette-soft-white);
    /* CAMBIO: Texto oscuro para contraste sobre fondo claro */
    color: var(--palette-carbon-deep);
    /* Candado de seguridad para evitar desbordamiento horizontal global */
    width: 100%;
    overflow-x: hidden;
    position: relative;
    min-height: 100vh;
}

.page-container[b-m1n1hp5li0] {
    flex-grow: 1;
    display: flex;
    flex-direction: column;
    /* margin-left: 260px; */ /* Versión expandida (Descomentar si prefieres) */
    margin-left: 78px; /* Ancho del sidebar colapsado versión por defecto */
    transition: margin-left 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    /* Aseguramos que el contenedor no exceda el ancho disponible */
    width: 100%;
    max-width: 100%;
}

.app-main-content[b-m1n1hp5li0] {
    flex-grow: 1;
    overflow-y: auto;
    /* Padding de escritorio amplio */
    padding: 0 2rem 2rem 2rem;
    width: 100%;
    /* Scrollbar técnico para fondo claro */
    scrollbar-width: thin;
    scrollbar-color: var(--palette-gray-light) var(--palette-soft-white);
}

/* === OVERLAY PARA NAVEGACIÓN MÓVIL === */
.mobile-nav-overlay[b-m1n1hp5li0] {
    position: fixed;
    inset: 0;
    /* Mantenemos fondo oscuro semitransparente para enfocar el menú */
    background-color: rgba(0, 0, 0, 0.6);
    backdrop-filter: blur(2px);
    z-index: 1099;
    animation: fadeInOverlay-b-m1n1hp5li0 0.3s;
}

@keyframes fadeInOverlay-b-m1n1hp5li0 {
    from {
        opacity: 0;
    }

    to {
        opacity: 1;
    }
}

/* === LÓGICA RESPONSIVA (MÓVIL) === */
@media (max-width: 992px) {
    .page-container[b-m1n1hp5li0],
    .client-layout.sidebar-collapsed .page-container[b-m1n1hp5li0] {
        margin-left: 0;
    }

    .app-main-content[b-m1n1hp5li0] {
        /* CORRECCIÓN CRÍTICA:
           - Top: 60px (Para no quedar debajo de la Topbar Móvil)
           - Laterales: 0.75rem (12px) para aprovechar espacio en pantallas pequeñas.
           - Bottom: 1.5rem
        */
        padding: 60px 0.75rem 1.5rem;
    }
}

/*
============================================
EXCEPCIÓN PARA "MODO CINEMÁTICO"
(Quita el padding para portadas inmersivas o visores de mapas full-screen)
============================================
*/

/* 1. (Escritorio) Elimina prácticamente TODO el padding */
.client-layout.cinematic-mode .app-main-content[b-m1n1hp5li0] {
    padding: 0; /* Full edge-to-edge */
}

/* 2. (Móvil) Elimina el padding lateral/inferior,
      PERO MANTIENE el padding-top de 60px
      (para que el contenido no quede *detrás* de la barra móvil flotante) */
@media (max-width: 992px) {
    .client-layout.cinematic-mode .app-main-content[b-m1n1hp5li0] {
        padding: 60px 0 0 0;
    }
}
/* _content/ImagineTheFuture.BlazorServer/Shared/ClientSidebar.razor.rz.scp.css */
/*
 * ClientSidebar.razor.css
 * Estilos aislados para la barra lateral del cliente
 * TEMA: Light / Engineering Blueprint (Fondo Blanco, Acentos Azules)
*/

/* === ESTADO BASE (EXPANDIDO) === */
.sidebar[b-lx6u0mh8o7] {
    width: 260px;
    background-color: #FFFFFF; /* Fondo Blanco Puro */
    border-right: 1px solid #E5E7EB; /* Borde gris sutil */
    position: fixed;
    top: 0;
    left: 0;
    height: 100vh;
    transition: width 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    font-family: 'Montserrat', sans-serif;
    z-index: 1100;
    display: flex;
    flex-direction: column;
    overflow-x: hidden;
    color: var(--palette-carbon-deep); /* Texto base oscuro */
    box-shadow: 2px 0 10px rgba(0,0,0,0.03); /* Sombra muy sutil */
    user-select: none;
}

.sidebar-header[b-lx6u0mh8o7] {
    padding: 1.25rem 0.75rem;
    border-bottom: 1px solid #E5E7EB;
}

    .sidebar-header a[b-lx6u0mh8o7] {
        display: flex;
        align-items: center;
        text-decoration: none;
        color: inherit;
        height: 40px;
    }

    .sidebar-header .icon-placeholder[b-lx6u0mh8o7] {
        width: 63px;
        flex-shrink: 0;
        text-align: left;
        padding-left: .8rem;
    }

    .sidebar-header img[b-lx6u0mh8o7] {
        height: 30px;
        vertical-align: middle;
    }

    /* Logo Industrial: Montserrat Bold Azul */
    .sidebar-header .logo-font[b-lx6u0mh8o7] {
        font-family: 'Montserrat', sans-serif;
        font-weight: 800; /* Extra Bold */
        font-size: 1.1rem;
        color: var(--palette-primary); /* Azul Eléctrico */
        text-transform: uppercase;
        letter-spacing: 0.05em;
        padding-top: 2px;
        transition: opacity 0.2s ease-out 0.1s, transform 0.2s ease-out 0.1s;
        white-space: nowrap;
    }

.sidebar-nav[b-lx6u0mh8o7] {
    flex-grow: 1;
    padding-top: 1rem;
    display: flex;
    flex-direction: column;
}

.nav-section[b-lx6u0mh8o7] {
    padding: 0 0.75rem;
    display: flex;
    flex-direction: column;
}

.nav-footer[b-lx6u0mh8o7] {
    margin-top: auto; /* Empuja esta sección al fondo */
    padding-bottom: 1rem;
    border-top: 1px solid #E5E7EB;
    padding-top: 1rem;
}

[b-lx6u0mh8o7] .nav-link {
    display: flex;
    align-items: center;
    text-decoration: none;
    color: var(--palette-gray-mid); /* Gris medio para items inactivos */
    padding: 0.85rem 0;
    border-radius: 4px; /* Borde técnico */
    margin-bottom: 0.25rem;
    transition: all 0.2s ease-in-out;
}

    [b-lx6u0mh8o7] .nav-link .icon-placeholder {
        width: 55px;
        flex-shrink: 0;
        text-align: center;
        font-size: 1.2rem;
        color: #9CA3AF; /* Icono gris suave */
        transition: color 0.2s;
    }

    [b-lx6u0mh8o7] .nav-link .link-text {
        white-space: nowrap;
        opacity: 1;
        font-weight: 600; /* Peso medio */
        font-size: 0.9rem;
        transition: opacity 0.2s ease-out 0.1s, transform 0.2s ease-out 0.1s;
    }

    /* Hover: Fondo gris muy pálido */
    [b-lx6u0mh8o7] .nav-link:hover {
        background-color: #F3F4F6;
        color: var(--palette-carbon-deep);
    }

        [b-lx6u0mh8o7] .nav-link:hover .icon-placeholder {
            color: var(--palette-primary);
        }

    /* Activo: Fondo azul tenue + Borde + Texto Azul */
    [b-lx6u0mh8o7] .nav-link.active {
        background-color: rgba(0, 163, 224, 0.08);
        color: var(--palette-primary);
        font-weight: 700;
        border-right: 3px solid var(--palette-primary); /* Indicador derecho técnico */
        border-radius: 4px 0 0 4px; /* Pegado a la derecha */
    }

        [b-lx6u0mh8o7] .nav-link.active .icon-placeholder {
            color: var(--palette-primary);
        }

/* --- ESTADO COLAPSADO --- */
.client-layout.sidebar-collapsed .sidebar[b-lx6u0mh8o7] {
    width: 78px;
}

.client-layout.sidebar-collapsed .link-text[b-lx6u0mh8o7] {
    opacity: 0;
    pointer-events: none;
    transform: translateX(-10px);
}

/* --- ESTADO MÓVIL (RESPONSIVE) --- */
@media (max-width: 992px) {
    .sidebar[b-lx6u0mh8o7] {
        transform: translateX(-100%);
        transition: transform 0.3s ease-in-out;
        box-shadow: 4px 0 15px rgba(0,0,0,0.1);
        border-right: none;
    }

    .client-layout.mobile-nav-open .sidebar[b-lx6u0mh8o7] {
        transform: translateX(0);
        width: 260px;
    }

    .client-layout.mobile-nav-open .link-text[b-lx6u0mh8o7] {
        opacity: 1;
        pointer-events: auto;
        display: inline-block;
    }
}
/* _content/ImagineTheFuture.BlazorServer/Shared/ClientTopBar.razor.rz.scp.css */
/*
 * ClientTopBar.razor.css
 * Barra superior del cliente - TEMA: Light / Engineering Blueprint
 * (Fondo Blanco, Texto Oscuro, Detalles Azules)
 */

/* =================================================================
   1. BARRA SUPERIOR (ESCRITORIO)
   ================================================================= */
.app-top-bar[b-gqhg2s8l0o] {
    position: sticky;
    top: 0;
    /* Z-INDEX 1050: Por encima del contenido */
    z-index: 1050;
    height: 70px;
    /* CAMBIO: Fondo blanco técnico */
    background-color: #FFFFFF;
    /* CAMBIO: Borde inferior sutil */
    border-bottom: 1px solid #E5E7EB;
    display: flex;
    align-items: center;
    padding: 0 2rem;
    flex-shrink: 0;
    transition: background-color 0.3s ease;
    /* Sombra muy sutil para separar del contenido */
    box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.05);
    user-select: none;
}

/* 1.1 Distribución en 3 Columnas */
.top-bar-left[b-gqhg2s8l0o] {
    flex: 1;
    display: flex;
    align-items: center;
}

.top-bar-center[b-gqhg2s8l0o] {
    flex: 0 1 500px;
    display: flex;
    justify-content: center;
    margin: 0 1rem;
}

.top-bar-actions[b-gqhg2s8l0o] {
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 1.5rem;
}

/* =================================================================
   2. BOTÓN DE NOTIFICACIONES (Trigger)
   ================================================================= */

.notification-wrapper[b-gqhg2s8l0o] {
    position: relative;
    display: flex;
    align-items: center;
}

.notification-btn[b-gqhg2s8l0o] {
    background: none;
    border: none;
    cursor: pointer;
    position: relative;
    padding: 0.5rem;
    /* CAMBIO: Icono gris medio sobre fondo claro */
    color: var(--palette-gray-mid);
    font-size: 1.3rem;
    transition: color 0.2s ease, transform 0.2s ease;
    display: flex;
    align-items: center;
    justify-content: center;
}

    .notification-btn:hover[b-gqhg2s8l0o] {
        color: var(--palette-primary); /* Azul al hover */
        transform: scale(1.05);
        background-color: #F3F4F6; /* Fondo gris muy tenue al hover */
        border-radius: 50%;
    }

/* El puntito rojo con número */
.notification-badge[b-gqhg2s8l0o] {
    position: absolute;
    top: 2px;
    right: 2px;
    background-color: var(--palette-danger);
    color: white;
    font-size: 0.65rem;
    font-weight: 700;
    border-radius: 10px;
    padding: 0 4px;
    min-width: 16px;
    height: 16px;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 1px 2px rgba(0,0,0,0.2);
    border: 2px solid #FFFFFF; /* Borde blanco para separar del icono */
}

/* =================================================================
   3. BOTÓN DE USUARIO (Trigger)
   ================================================================= */

.user-menu-container[b-gqhg2s8l0o] {
    position: relative;
    /* CAMBIO: Fondo "Pastilla" Gris Claro */
    background-color: #F3F4F6;
    border-radius: 50px;
    transition: background-color 0.2s ease, box-shadow 0.2s ease;
    border: 1px solid transparent;
}

    .user-menu-container:hover[b-gqhg2s8l0o] {
        background-color: #E5E7EB; /* Gris un poco más oscuro al hover */
        border-color: #D1D5DB;
    }

.user-menu-button[b-gqhg2s8l0o] {
    background: none;
    border: none;
    display: flex;
    align-items: center;
    gap: 0.75rem;
    cursor: pointer;
    padding: 0.3rem 0.3rem 0.3rem 1rem; /* Ajuste para el avatar a la derecha */
    border-radius: 50px;
    font-family: inherit;
    /* CAMBIO: Texto oscuro */
    color: var(--palette-carbon-deep);
}

.user-name[b-gqhg2s8l0o] {
    font-weight: 600;
    font-family: 'Montserrat', sans-serif;
    color: var(--palette-carbon-deep);
    margin-bottom: 0.1rem;
    font-size: 0.9rem;
}

.user-avatar[b-gqhg2s8l0o] {
    display: flex;
    align-items: center;
}

/* =================================================================
   4. RESPONSIVIDAD MÓVIL
   ================================================================= */
.mobile-header[b-gqhg2s8l0o] {
    display: none;
}

@media (max-width: 992px) {
    .app-top-bar[b-gqhg2s8l0o] {
        display: none;
    }

    .mobile-header[b-gqhg2s8l0o] {
        display: flex;
        align-items: center;
        justify-content: space-between;
        height: 60px;
        padding: 0 1rem;
        /* CAMBIO: Fondo Blanco sólido para móvil */
        background-color: #FFFFFF;
        border-bottom: 1px solid #E5E7EB;
        position: fixed;
        top: 0;
        left: 0;
        width: 100%;
        z-index: 1050;
        box-shadow: 0 1px 3px rgba(0,0,0,0.05);
    }

    .mobile-menu-toggle[b-gqhg2s8l0o] {
        background: none;
        border: none;
        font-size: 1.5rem;
        /* CAMBIO: Icono oscuro */
        color: var(--palette-carbon-deep);
        cursor: pointer;
        padding: 0.5rem;
    }

    .mobile-actions[b-gqhg2s8l0o] {
        display: flex;
        align-items: center;
        gap: 0.5rem;
    }

    /* --- BÚSQUEDA MÓVIL --- */
    .mobile-search-section[b-gqhg2s8l0o] {
        display: flex;
        align-items: center;
    }

    /* Trigger (Lupita) */
    .mobile-search-trigger[b-gqhg2s8l0o] {
        background: none;
        border: none;
        color: var(--palette-gray-mid);
        font-size: 1.3rem;
        cursor: pointer;
        padding: 0.5rem;
        transition: color 0.2s;
    }

        .mobile-search-trigger:hover[b-gqhg2s8l0o] {
            color: var(--palette-primary);
        }

    /* Wrapper del componente real */
    .mobile-search-component-wrapper[b-gqhg2s8l0o] {
        display: none;
    }

        .mobile-search-component-wrapper.active[b-gqhg2s8l0o] {
            display: block;
        }

    /* Ajustes específicos para el botón de usuario en móvil */
    .mobile-actions .user-name[b-gqhg2s8l0o] {
        display: none;
    }

    .mobile-actions .user-menu-button[b-gqhg2s8l0o] {
        padding: 0;
        gap: 0;
    }

    .mobile-actions .user-menu-container[b-gqhg2s8l0o] {
        background-color: transparent;
        border: none;
    }

        .mobile-actions .user-menu-container:hover[b-gqhg2s8l0o] {
            background-color: transparent;
        }
}

/* =================================================================
   5. UTILIDADES
   ================================================================= */

/* Overlay de seguridad */
.click-away-overlay[b-gqhg2s8l0o] {
    position: fixed;
    inset: 0;
    z-index: 1040;
    cursor: default;
    background-color: transparent; /* No oscurecer en modo light */
}
/* _content/ImagineTheFuture.BlazorServer/Shared/EmployeeLayout.razor.rz.scp.css */
/*
 * EmployeeLayout.razor.css
 * Estilos aislados para el layout del empleado (Staff)
 * TEMA: Operational / Cool Tech (Fondo Azulado Pálido, Contraste Técnico)
*/

/* === ESTRUCTURA PRINCIPAL === */
.employee-layout[b-3l5iqgy2d1] {
    display: flex;
    /* CAMBIO: Usamos el fondo operativo (azul muy pálido) */
    background-color: var(--employee-bg);
    /* Texto oscuro técnico */
    color: var(--employee-text-main);
    width: 100%;
    overflow-x: hidden;
    position: relative;
    min-height: 100vh;
}

.page-container[b-3l5iqgy2d1] {
    flex-grow: 1;
    display: flex;
    flex-direction: column;
    /* margin-left: 260px; */ /* Versión expandida */
    margin-left: 78px; /* Versión colapsada por defecto */
    transition: margin-left 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    width: 100%;
    max-width: 100%;
}

.app-main-content[b-3l5iqgy2d1] {
    flex-grow: 1;
    overflow-y: auto;
    /* Padding de escritorio */
    padding: 0 2rem 2rem 2rem;
    width: 100%;
    /* Scrollbar técnico azulado */
    scrollbar-width: thin;
    scrollbar-color: var(--employee-border) var(--employee-bg);
}

/* === OVERLAY PARA NAVEGACIÓN MÓVIL === */
.mobile-nav-overlay[b-3l5iqgy2d1] {
    position: fixed;
    inset: 0;
    /* Fondo oscuro semitransparente con tinte azul */
    background-color: rgba(10, 25, 40, 0.6);
    backdrop-filter: blur(2px);
    z-index: 1099;
    animation: fadeInOverlay-b-3l5iqgy2d1 0.3s;
}

@keyframes fadeInOverlay-b-3l5iqgy2d1 {
    from {
        opacity: 0;
    }

    to {
        opacity: 1;
    }
}

/* === LÓGICA RESPONSIVA (MÓVIL) === */
@media (max-width: 992px) {
    .page-container[b-3l5iqgy2d1],
    .employee-layout.sidebar-collapsed .page-container[b-3l5iqgy2d1] {
        margin-left: 0;
    }

    .app-main-content[b-3l5iqgy2d1] {
        /* Ajuste para header móvil */
        padding: 60px 0.75rem 1.5rem;
    }
}

/*
============================================
EXCEPCIÓN PARA "MODO CINEMÁTICO"
(Quita el padding para visualización inmersiva)
============================================
*/

/* 1. Escritorio */
.employee-layout.cinematic-mode .app-main-content[b-3l5iqgy2d1] {
    padding: 0;
}

/* 2. Móvil */
@media (max-width: 992px) {
    .employee-layout.cinematic-mode .app-main-content[b-3l5iqgy2d1] {
        padding: 60px 0 0 0;
    }
}
/* _content/ImagineTheFuture.BlazorServer/Shared/EmployeeSidebar.razor.rz.scp.css */
/*
 * EmployeeSidebar.razor.css
 * Estilos aislados para la barra lateral del empleado (Staff)
 * TEMA: Operational / Cool Tech (Fondo Blanco, Acentos Azulados Fuertes)
*/

/* === ESTADO BASE (EXPANDIDO) === */
.sidebar[b-kwj2gd1pk4] {
    width: 260px;
    background-color: var(--employee-sidebar-bg); /* Blanco */
    border-right: 1px solid var(--employee-sidebar-border); /* Gris Azulado */
    position: fixed;
    top: 0;
    left: 0;
    height: 100vh;
    transition: width 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    font-family: 'Montserrat', sans-serif;
    z-index: 1100;
    display: flex;
    flex-direction: column;
    overflow-x: hidden;
    color: var(--employee-text-main);
    box-shadow: 2px 0 10px rgba(0, 163, 224, 0.05); /* Sombra azulada sutil */
    user-select: none;
}

.sidebar-header[b-kwj2gd1pk4] {
    padding: 1.25rem 0.75rem;
    border-bottom: 1px solid var(--employee-border);
}

    .sidebar-header a[b-kwj2gd1pk4] {
        display: flex;
        align-items: center;
        text-decoration: none;
        color: inherit;
        height: 40px;
    }

    .sidebar-header .logo-wrapper[b-kwj2gd1pk4] {
        position: relative; /* Contexto para el posicionamiento absoluto */
        height: 40px; /* Altura fija igual que el original */
        display: block; /* Para que ocupe el ancho */
    }

    .logo-wrapper .logo-content[b-kwj2gd1pk4] {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        display: flex;
        align-items: center;
        transition: opacity 0.3s ease-in-out, transform 0.3s ease-in-out;
        backface-visibility: hidden; /* Previene parpadeos */
    }

        /* Icono del estado hover */
    .logo-wrapper .logo-hover .icon-placeholder[b-kwj2gd1pk4] {
        color: var(--palette-primary);
        font-size: 1.4rem;
    }

    /* El estado hover empieza invisible y un poco movido */
    .logo-wrapper .logo-hover[b-kwj2gd1pk4] {
        opacity: 0;
        transform: scale(0.95);
    }

    /* En el hover del link... */
    .logo-wrapper:hover .logo-default[b-kwj2gd1pk4] {
        opacity: 0;
        transform: scale(0.95);
    }

    .logo-wrapper:hover .logo-hover[b-kwj2gd1pk4] {
        opacity: 1;
        transform: scale(1);
    }

    .sidebar-header .icon-placeholder[b-kwj2gd1pk4] {
        width: 63px;
        flex-shrink: 0;
        text-align: left;
        padding-left: .8rem;
    }

    .sidebar-header img[b-kwj2gd1pk4] {
        height: 30px;
        vertical-align: middle;
    }

    /* Logo Industrial: Montserrat Bold Azul */
    .sidebar-header .logo-font[b-kwj2gd1pk4] {
        font-family: 'Montserrat', sans-serif;
        font-weight: 800; /* Extra Bold */
        font-size: 1.1rem;
        color: var(--palette-primary);
        text-transform: uppercase;
        letter-spacing: 0.05em;
        padding-top: 2px;
        transition: opacity 0.2s ease-out 0.1s, transform 0.2s ease-out 0.1s;
        white-space: nowrap;
    }

.sidebar-nav[b-kwj2gd1pk4] {
    flex-grow: 1;
    padding-top: 1rem;
    display: flex;
    flex-direction: column;
}

.nav-section[b-kwj2gd1pk4] {
    padding: 0 0.75rem;
    display: flex;
    flex-direction: column;
}

.nav-footer[b-kwj2gd1pk4] {
    margin-top: auto;
    padding-bottom: 1rem;
    border-top: 1px solid var(--employee-border);
    padding-top: 1rem;
}

[b-kwj2gd1pk4] .nav-link {
    display: flex;
    align-items: center;
    text-decoration: none;
    color: var(--employee-text-secondary); /* Gris medio técnico */
    padding: 0.85rem 0;
    border-radius: 4px;
    margin-bottom: 0.25rem;
    transition: all 0.2s ease-in-out;
}

    [b-kwj2gd1pk4] .nav-link .icon-placeholder {
        width: 55px;
        flex-shrink: 0;
        text-align: center;
        font-size: 1.2rem;
        color: #9CA3AF;
        transition: color 0.2s;
    }

    [b-kwj2gd1pk4] .nav-link .link-text {
        white-space: nowrap;
        opacity: 1;
        font-weight: 600;
        font-size: 0.9rem;
        transition: opacity 0.2s ease-out 0.1s, transform 0.2s ease-out 0.1s;
    }

    /* Hover: Fondo azul muy pálido (Operativo) */
    [b-kwj2gd1pk4] .nav-link:hover {
        background-color: var(--employee-primary-hover);
        color: var(--palette-primary);
    }

        [b-kwj2gd1pk4] .nav-link:hover .icon-placeholder {
            color: var(--palette-primary);
        }

    /* Activo: Fondo azul sólido + Texto Blanco (Alto Contraste Operativo) */
    [b-kwj2gd1pk4] .nav-link.active {
        background-color: var(--palette-primary); /* Azul Eléctrico Sólido */
        color: #FFFFFF; /* Texto Blanco */
        font-weight: 700;
        border-radius: 4px; /* Botón completo */
        box-shadow: 0 2px 5px rgba(0, 163, 224, 0.3);
    }

        [b-kwj2gd1pk4] .nav-link.active .icon-placeholder {
            color: #FFFFFF; /* Icono blanco */
        }

/* --- ESTADO COLAPSADO --- */
.employee-layout.sidebar-collapsed .sidebar[b-kwj2gd1pk4] {
    width: 78px;
}

.employee-layout.sidebar-collapsed .link-text[b-kwj2gd1pk4] {
    opacity: 0;
    pointer-events: none;
    transform: translateX(-10px);
}

/* --- ESTADO MÓVIL (RESPONSIVE) --- */
@media (max-width: 992px) {
    .sidebar[b-kwj2gd1pk4] {
        transform: translateX(-100%);
        transition: transform 0.3s ease-in-out;
        box-shadow: 4px 0 15px rgba(0,0,0,0.1);
        border-right: none;
    }

    .employee-layout.mobile-nav-open .sidebar[b-kwj2gd1pk4] {
        transform: translateX(0);
        width: 260px;
    }

    .employee-layout.mobile-nav-open .link-text[b-kwj2gd1pk4] {
        opacity: 1;
        pointer-events: auto;
        display: inline-block;
    }
}
/* _content/ImagineTheFuture.BlazorServer/Shared/EmployeeTopBar.razor.rz.scp.css */
/*
 * EmployeeTopBar.razor.css
 * Barra superior del empleado - TEMA: Operational / Cool Tech
 * (Fondo Blanco, Bordes Azulados, Badge Staff)
 */

/* =================================================================
   1. BARRA SUPERIOR (ESCRITORIO)
   ================================================================= */
.app-top-bar[b-8k3ostj4a7] {
    position: sticky;
    top: 0;
    z-index: 1050;
    height: 70px;
    /* CAMBIO: Fondo blanco */
    background-color: #FFFFFF;
    /* CAMBIO: Borde azulado técnico (variable global) */
    border-bottom: 1px solid var(--employee-border);
    display: flex;
    align-items: center;
    padding: 0 2rem;
    flex-shrink: 0;
    transition: background-color 0.3s ease;
    /* Sombra azulada sutil */
    box-shadow: 0 1px 3px 0 rgba(0, 163, 224, 0.05);
    user-select: none;
}

.top-bar-left[b-8k3ostj4a7] {
    flex: 1;
    display: flex;
    align-items: center;
}

.top-bar-center[b-8k3ostj4a7] {
    flex: 0 1 500px;
    display: flex;
    justify-content: center;
    margin: 0 1rem;
}

.top-bar-actions[b-8k3ostj4a7] {
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 1.5rem;
}

/* =================================================================
   2. BOTÓN DE NOTIFICACIONES
   ================================================================= */

.notification-wrapper[b-8k3ostj4a7] {
    position: relative;
    display: flex;
    align-items: center;
}

.notification-btn[b-8k3ostj4a7] {
    background: none;
    border: none;
    cursor: pointer;
    position: relative;
    padding: 0.5rem;
    /* Icono gris medio */
    color: var(--palette-gray-mid);
    font-size: 1.3rem;
    transition: color 0.2s ease, transform 0.2s ease;
    display: flex;
    align-items: center;
    justify-content: center;
}

    .notification-btn:hover[b-8k3ostj4a7] {
        color: var(--palette-primary);
        transform: scale(1.05);
        background-color: var(--employee-primary-hover); /* Fondo azul tenue */
        border-radius: 50%;
    }

.notification-badge[b-8k3ostj4a7] {
    position: absolute;
    top: 2px;
    right: 2px;
    background-color: var(--palette-danger);
    color: white;
    font-size: 0.65rem;
    font-weight: 700;
    border-radius: 10px;
    padding: 0 4px;
    min-width: 16px;
    height: 16px;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 1px 2px rgba(0,0,0,0.2);
    border: 2px solid #FFFFFF;
}

/* =================================================================
   3. BOTÓN DE USUARIO
   ================================================================= */

.user-menu-container[b-8k3ostj4a7] {
    position: relative;
    /* Fondo Azul Muy Pálido */
    background-color: var(--employee-primary-hover);
    border-radius: 50px;
    transition: background-color 0.2s ease, box-shadow 0.2s ease;
    border: 1px solid transparent;
}

    .user-menu-container:hover[b-8k3ostj4a7] {
        /* Borde azul al hover */
        border-color: var(--palette-primary);
        background-color: #fff;
    }

.user-menu-button[b-8k3ostj4a7] {
    background: none;
    border: none;
    display: flex;
    align-items: center;
    gap: 0.75rem;
    cursor: pointer;
    padding: 0.3rem 0.3rem 0.3rem 1rem;
    border-radius: 50px;
    font-family: inherit;
    color: var(--palette-carbon-deep);
}

.user-name[b-8k3ostj4a7] {
    font-weight: 600;
    font-family: 'Montserrat', sans-serif;
    color: var(--palette-carbon-deep);
    margin-bottom: 0.1rem;
    font-size: 0.9rem;
}

/* Badge STAFF Exclusivo */
.badge-staff[b-8k3ostj4a7] {
    font-size: 0.6rem;
    background-color: var(--palette-primary);
    color: #FFFFFF;
    padding: 2px 6px;
    border-radius: 2px;
    font-weight: 800;
    letter-spacing: 0.5px;
    margin-right: 5px;
    margin-left: 5px;
    text-transform: uppercase;
    box-shadow: 0 2px 4px rgba(0, 163, 224, 0.3);
}

.user-avatar[b-8k3ostj4a7] {
    display: flex;
    align-items: center;
}

/* =================================================================
   4. RESPONSIVIDAD MÓVIL
   ================================================================= */
.mobile-header[b-8k3ostj4a7] {
    display: none;
}

@media (max-width: 992px) {
    .app-top-bar[b-8k3ostj4a7] {
        display: none;
    }

    .mobile-header[b-8k3ostj4a7] {
        display: flex;
        align-items: center;
        justify-content: space-between;
        height: 60px;
        padding: 0 1rem;
        background-color: #FFFFFF;
        border-bottom: 1px solid var(--employee-border);
        position: fixed;
        top: 0;
        left: 0;
        width: 100%;
        z-index: 1050;
        box-shadow: 0 1px 3px rgba(0,0,0,0.05);
    }

    .mobile-menu-toggle[b-8k3ostj4a7] {
        background: none;
        border: none;
        font-size: 1.5rem;
        color: var(--palette-carbon-deep);
        cursor: pointer;
        padding: 0.5rem;
    }

    .mobile-actions[b-8k3ostj4a7] {
        display: flex;
        align-items: center;
        gap: 0.5rem;
    }

    /* Búsqueda */
    .mobile-search-section[b-8k3ostj4a7] {
        display: flex;
        align-items: center;
    }

    .mobile-search-trigger[b-8k3ostj4a7] {
        background: none;
        border: none;
        color: var(--palette-gray-mid);
        font-size: 1.3rem;
        cursor: pointer;
        padding: 0.5rem;
        transition: color 0.2s;
    }

        .mobile-search-trigger:hover[b-8k3ostj4a7] {
            color: var(--palette-primary);
        }

    .mobile-search-component-wrapper[b-8k3ostj4a7] {
        display: none;
    }

        .mobile-search-component-wrapper.active[b-8k3ostj4a7] {
            display: block;
        }

    /* Ajustes móviles usuario */
    .mobile-actions .user-name[b-8k3ostj4a7] {
        display: none;
    }

    .mobile-actions .badge-staff[b-8k3ostj4a7] {
        display: none;
    }
    /* Ocultar badge en móvil */

    .mobile-actions .user-menu-button[b-8k3ostj4a7] {
        padding: 0;
        gap: 0;
    }

    .mobile-actions .user-menu-container[b-8k3ostj4a7] {
        background-color: transparent;
        border: none;
    }

        .mobile-actions .user-menu-container:hover[b-8k3ostj4a7] {
            background-color: transparent;
            border: none;
        }
}

/* =================================================================
   5. UTILIDADES
   ================================================================= */
.click-away-overlay[b-8k3ostj4a7] {
    position: fixed;
    inset: 0;
    z-index: 1040;
    cursor: default;
    background-color: transparent;
}
/* _content/ImagineTheFuture.BlazorServer/Shared/EmptyAuthLayout.razor.rz.scp.css */
/* =================================================================
   LAYOUT DE AUTENTICACIÓN (VACÍO/OSCURO - ENERGY EDITION)
   ================================================================= */

.empty-auth-layout[b-my00aqd8bn] {
    /* Ocupa toda la pantalla forzosamente */
    min-height: 100vh;
    width: 100%;
    /* FONDO PREMIUM INDUSTRIAL:
       Mismo degradado técnico que en LoginPage para continuidad.
       Oscuro con un toque muy sutil de azul en la esquina superior.
    */
    background-color: #050505;
    background-image: radial-gradient(circle at top right, #1a2530 0%, #0a0a0a 100%);
    display: flex;
    flex-direction: column;
    justify-content: space-between; /* Empuja el footer al final */
}

/* Área donde se renderiza el @Body (Login/Register) */
.auth-content-area[b-my00aqd8bn] {
    flex-grow: 1;
    display: flex;
    flex-direction: column;
    justify-content: center; /* Ayuda a centrar verticalmente si la página no lo hace */
    width: 100%;
}

/* Footer Minimalista */
.auth-layout-footer[b-my00aqd8bn] {
    padding: 1.5rem;
    text-align: center;
    opacity: 0.6;
    transition: opacity 0.3s;
}

    .auth-layout-footer:hover[b-my00aqd8bn] {
        opacity: 1;
    }

.footer-content[b-my00aqd8bn] {
    display: flex;
    flex-direction: column;
    gap: 0.3rem;
    align-items: center;
}

.brand-text[b-my00aqd8bn] {
    font-family: 'Montserrat', sans-serif; /* Cambio de Cursiva a Sans-Serif Industrial */
    font-weight: 800; /* Extra Bold */
    letter-spacing: 0.2em; /* Tracking amplio */
    color: var(--palette-primary); /* Azul Eléctrico */
    font-size: 1.2rem;
    margin: 0;
    text-transform: uppercase;
}

.copyright[b-my00aqd8bn] {
    font-family: 'Montserrat', sans-serif;
    font-size: 0.75rem;
    color: var(--palette-gray-mid); /* Gris medio técnico */
    margin: 0;
    text-transform: uppercase;
    letter-spacing: 0.05em;
}
/* _content/ImagineTheFuture.BlazorServer/Shared/EmptyLayout.razor.rz.scp.css */
.empty-layout-container[b-00yne75vdh] {
    display: flex;
    justify-content: center;
    align-items: center;
    min-height: 100vh;
    background-color: var(--color-background-paper); /* Mantiene el color de fondo del sitio */
    padding: 2rem;
}
/* _content/ImagineTheFuture.BlazorServer/Shared/MainLayout.razor.rz.scp.css */
/*
 MainLayout Styles
 Aplica 'user-select: none' a componentes clave de la interfaz.
 Esto previene que el texto del men� y elementos interactivos 
 se seleccionen accidentalmente.
*/

/* Deep selector para alcanzar componentes hijos encapsulados */
[b-0xcsvly932] header,
[b-0xcsvly932] .hero-carousel,
[b-0xcsvly932] .no-select-zone {
    -webkit-user-select: none; /* Safari */
    -ms-user-select: none; /* IE 10+ */
    user-select: none; /* Est�ndar */
}

/* Estilo funcional local para la transici�n suave de entrada.
   Esto evita que la p�gina aparezca "de golpe" tras el LoadingScreen.
*/
.layout-fade-in[b-0xcsvly932] {
    animation: layoutFadeIn-b-0xcsvly932 0.8s ease-out forwards;
    width: 100%; /* Asegura que ocupe el ancho en estructuras flex */
}

/* Animaci�n de entrada */
@keyframes layoutFadeIn-b-0xcsvly932 {
    from {
        opacity: 0;
        transform: translateY(10px); /* Un peque�o slide hacia arriba sutil */
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* Si no est�s usando Tailwind, necesitamos asegurar que el footer
   se vaya al fondo. Estas clases soportan el HTML del razor.
*/
.min-h-screen[b-0xcsvly932] {
    min-height: 100vh;
}

.flex[b-0xcsvly932] {
    display: flex;
}

.flex-col[b-0xcsvly932] {
    flex-direction: column;
}

.flex-grow[b-0xcsvly932] {
    flex-grow: 1;
}

.antialiased[b-0xcsvly932] {
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

/* --- LANDING FOOTER (DARK THEME) --- */
.landing-footer[b-0xcsvly932] {
    background-color: #050505; /* Fondo negro profundo */
    border-top: 1px solid rgba(255, 255, 255, 0.1); /* L�nea sutil */
    padding: 3rem 2rem;
    margin-top: auto;
    position: relative;
    z-index: 10;
}

.footer-container[b-0xcsvly932] {
    max-width: 1400px;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
}

.footer-brand-col[b-0xcsvly932] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    align-items: center;
}

.brand-text[b-0xcsvly932] {
    font-family: 'Montserrat', sans-serif;
    font-weight: 800; /* Extra Bold */
    letter-spacing: 0.2em;
    color: var(--palette-primary, #00A3E0); /* Azul El�ctrico */
    font-size: 1.5rem;
    margin: 0;
    text-transform: uppercase;
    text-shadow: 0 0 20px rgba(0, 163, 224, 0.3); /* Glow sutil */
}

.copyright[b-0xcsvly932] {
    font-family: 'Montserrat', sans-serif;
    font-size: 0.8rem;
    color: #666; /* Gris oscuro para no distraer */
    margin: 0;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    transition: color 0.3s;
}

.landing-footer:hover .copyright[b-0xcsvly932] {
    color: #999; /* Se ilumina ligeramente al pasar el mouse */
}
/* _content/ImagineTheFuture.BlazorServer/Shared/MainTopBar.razor.rz.scp.css */
/* ESTILOS BASE DEL CONTENEDOR 
   (Los estilos específicos de menús están en sus propios componentes)
*/

.top-bar-base[b-v743tbc9wt] {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    /* AJUSTE: Aumentado de 5rem a 6rem para dar aire y magnitud */
    height: 6rem;
    z-index: 50;
    background-color: transparent;
    border-bottom: 1px solid transparent;
    transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
    user-select: none;
}

    .top-bar-base.scrolled[b-v743tbc9wt] {
        background-color: rgba(18, 18, 18, 0.95); /* Más sólido para lectura técnica */
        backdrop-filter: blur(12px);
        border-bottom: 1px solid rgba(255, 255, 255, 0.1);
        box-shadow: 0 4px 20px rgba(0, 0, 0, 0.6);
        /* AJUSTE: Compactamos al hacer scroll pero manteniendo presencia */
        height: 5rem;
    }

.top-bar-nav[b-v743tbc9wt] {
    max-width: 1400px;
    height: 100%;
    margin: 0 auto;
    padding: 0 2rem;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.logo-container[b-v743tbc9wt] {
    cursor: pointer;
    flex-shrink: 0;
    /* Permitimos que ocupe espacio para no cortar el logo */
    max-width: 60%;
    display: flex;
    align-items: center;
}

.logo-img[b-v743tbc9wt] {
    /* AJUSTE: Logo más grande y "sabroso" */
    height: 5.2rem;
    width: auto;
    transition: height 0.3s ease;
    /* Sombra sutil para despegarlo del fondo */
    filter: drop-shadow(0 4px 6px rgba(0,0,0,0.4));
}

.top-bar-base.scrolled .logo-img[b-v743tbc9wt] {
    /* AJUSTE: Reducción suave al hacer scroll */
    height: 4rem;
}

.right-content-container[b-v743tbc9wt] {
    display: flex;
    align-items: center;
    gap: 1.5rem;
    flex-shrink: 0;
}

/* Separador entre menú y usuario */
.nav-separator[b-v743tbc9wt] {
    display: none;
    width: 1px;
    height: 2rem; /* Ligeramente más alto */
    background-color: rgba(255, 255, 255, 0.2);
}

@media (min-width: 978px) {
    .nav-separator[b-v743tbc9wt] {
        display: block;
    }
}

@media (max-width: 480px) {
    .top-bar-nav[b-v743tbc9wt] {
        padding: 0 1rem;
    }

    .top-bar-base[b-v743tbc9wt] {
        height: 5rem;
    }

    .logo-img[b-v743tbc9wt] {
        height: 4rem;
    }
}
/* _content/ImagineTheFuture.BlazorServer/Shared/NotificationDropdown.razor.rz.scp.css */
/*
 * NotificationDropdown.razor.css
 * Contenedor de notificaciones para CLIENTE
 * TEMA: Light / Engineering Blueprint (Fondo Blanco, Detalles Azules)
 */

/* 1. BACKDROP (Fondo invisible/tenue) */
.notification-backdrop[b-oiexcbglfb] {
    position: fixed;
    /* Usamos inset: 0 para cubrir todo sin problemas de scroll */
    inset: 0;
    z-index: 2000; /* Encima de todo */
    background-color: rgba(0, 0, 0, 0.05); /* Sutil, solo para capturar clicks */
    cursor: default;
}

/* 2. WRAPPER DEL PANEL 
   Este div posiciona el componente NotificationList en la pantalla.
*/
.notification-panel-wrapper[b-oiexcbglfb] {
    position: absolute;
    z-index: 2001;
    /* Animación de entrada técnica */
    animation: slideIn-b-oiexcbglfb 0.2s cubic-bezier(0.4, 0, 0.2, 1);
    /* --- ESTILO INDUSTRIAL LIGHT --- */
    background-color: #FFFFFF; /* Fondo Blanco Puro */
    border: 1px solid #E5E7EB; /* Borde gris sutil */
    border-top: 3px solid var(--palette-primary); /* Acento superior Azul */
    border-radius: 4px; /* Bordes técnicos */
    /* Sombra para profundidad en modo claro */
    box-shadow: 0 10px 40px rgba(0, 0, 0, 0.15);
    /* Texto base oscuro para el contenido heredado */
    color: var(--palette-carbon-deep);
    overflow: hidden;
    display: flex;
    flex-direction: column;
}

    /* 3. POSICIONAMIENTO DESKTOP */
    .notification-panel-wrapper.desktop[b-oiexcbglfb] {
        top: 70px; /* Altura de TopBar */
        right: 80px; /* Alineado a la izquierda del grupo de usuario */
        width: 360px;
        max-height: 80vh;
    }

    /* 4. POSICIONAMIENTO MÓVIL */
    .notification-panel-wrapper.mobile[b-oiexcbglfb] {
        top: 65px; /* Altura de Mobile Header */
        left: 10px;
        right: 10px;
        width: auto;
        max-width: 450px;
        margin: 0 auto; /* Centrado */
        max-height: 70vh;
    }

@keyframes slideIn-b-oiexcbglfb {
    from {
        opacity: 0;
        transform: translateY(-10px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}
/* _content/ImagineTheFuture.BlazorServer/Shared/NotificationList.razor.rz.scp.css */
/* Contenedor Principal */
.notification-dropdown-panel[b-cfdyxgwxcf] {
    width: 100%; /* El ancho lo controla el wrapper padre */
    background-color: transparent;
    display: flex;
    flex-direction: column;
    pointer-events: auto !important;
    max-height: 100%;
}

.notification-header[b-cfdyxgwxcf] {
    padding: 0.8rem 1rem;
    border-bottom: 1px solid var(--palette-gray-dark);
    display: flex;
    justify-content: space-between;
    align-items: center;
    background-color: var(--palette-carbon-deep);
}

    .notification-header h6[b-cfdyxgwxcf] {
        margin: 0;
        color: var(--palette-primary); /* Título Azul */
        font-family: 'Montserrat', sans-serif;
        font-weight: 700;
        text-transform: uppercase;
        font-size: 0.85rem;
        letter-spacing: 0.05em;
    }

.btn-mark-all[b-cfdyxgwxcf] {
    background: none;
    border: none;
    color: var(--palette-gray-light);
    cursor: pointer;
    transition: color 0.2s;
}

    .btn-mark-all:hover[b-cfdyxgwxcf] {
        color: var(--palette-white);
    }

/* Lista Scrollable */
.notification-items-container[b-cfdyxgwxcf] {
    flex-grow: 1;
    overflow-y: auto;
    scrollbar-width: thin;
    scrollbar-color: var(--palette-gray-dark) transparent;
}

.notification-item[b-cfdyxgwxcf] {
    display: flex;
    align-items: flex-start; /* Alineación superior para mejor lectura */
    gap: 0.8rem;
    padding: 1rem;
    border-bottom: 1px solid rgba(255,255,255,0.05);
    cursor: pointer;
    user-select: none;
    transition: background-color 0.2s;
    background-color: transparent;
}

    .notification-item:hover[b-cfdyxgwxcf] {
        background-color: rgba(255,255,255,0.03);
    }

    .notification-item.unread[b-cfdyxgwxcf] {
        background-color: rgba(0, 163, 224, 0.08); /* Tinte Azul muy sutil */
        border-left: 3px solid var(--palette-primary); /* Indicador izquierdo */
    }

/* Avatar + Badge */
.notif-avatar[b-cfdyxgwxcf] {
    position: relative;
    flex-shrink: 0;
}

    .notif-avatar img[b-cfdyxgwxcf], .avatar-placeholder[b-cfdyxgwxcf] {
        width: 36px;
        height: 36px;
        border-radius: 4px; /* Avatares cuadrados técnicos */
        object-fit: cover;
    }

.avatar-placeholder[b-cfdyxgwxcf] {
    background-color: var(--palette-gray-darker);
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--palette-gray-light);
    border: 1px solid var(--palette-gray-dark);
}

.action-badge[b-cfdyxgwxcf] {
    position: absolute;
    bottom: -4px;
    right: -4px;
    width: 18px;
    height: 18px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    color: white;
    font-size: 0.6rem;
    border: 2px solid var(--palette-carbon-dark);
    box-shadow: 0 2px 4px rgba(0,0,0,0.5);
}

/* Colores de Badges Industrializados */
.bg-danger[b-cfdyxgwxcf] {
    background-color: var(--palette-danger);
}

.bg-info[b-cfdyxgwxcf] {
    background-color: #3182ce;
}

.bg-gold[b-cfdyxgwxcf] {
    background-color: var(--palette-primary);
}
/* Gold -> Primary */
.bg-success[b-cfdyxgwxcf] {
    background-color: #38a169;
}

.bg-gray[b-cfdyxgwxcf] {
    background-color: #718096;
}

/* Contenido Texto */
.notif-content[b-cfdyxgwxcf] {
    flex-grow: 1;
    font-family: 'Montserrat', sans-serif;
    font-size: 0.85rem;
    color: var(--palette-gray-light);
    line-height: 1.4;
}

    .notif-content strong[b-cfdyxgwxcf] {
        color: var(--palette-white);
        font-weight: 600;
    }

.notif-time[b-cfdyxgwxcf] {
    display: block;
    font-size: 0.7rem;
    color: var(--palette-gray-mid);
    margin-top: 0.3rem;
    font-weight: 500;
}

/* Miniatura */
.notif-thumbnail[b-cfdyxgwxcf] {
    flex-shrink: 0;
}

    .notif-thumbnail img[b-cfdyxgwxcf] {
        width: 45px;
        height: 45px;
        object-fit: cover;
        border-radius: 2px;
        border: 1px solid rgba(255,255,255,0.1);
    }

/* Empty State */
.empty-notifications[b-cfdyxgwxcf] {
    padding: 3rem 2rem;
    text-align: center;
    color: var(--palette-gray-mid);
}

    .empty-notifications i[b-cfdyxgwxcf] {
        font-size: 2rem;
        margin-bottom: 1rem;
        opacity: 0.5;
        color: var(--palette-primary);
    }

    .empty-notifications p[b-cfdyxgwxcf] {
        margin: 0;
        font-size: 0.9rem;
    }

/* Botón Cargar Más */
.load-more-container[b-cfdyxgwxcf] {
    padding: 0.75rem;
    text-align: center;
    border-top: 1px solid rgba(255,255,255,0.05);
}

.btn-load-more[b-cfdyxgwxcf] {
    background: none;
    border: 1px solid var(--palette-gray-dark);
    color: var(--palette-primary);
    padding: 0.5rem 1.5rem;
    border-radius: 2px;
    font-size: 0.8rem;
    cursor: pointer;
    transition: all 0.2s;
    font-family: 'Montserrat', sans-serif;
    text-transform: uppercase;
    font-weight: 600;
}

    .btn-load-more:hover:not(:disabled)[b-cfdyxgwxcf] {
        background-color: var(--palette-primary);
        color: var(--palette-black);
        border-color: var(--palette-primary);
    }

    .btn-load-more:disabled[b-cfdyxgwxcf] {
        opacity: 0.5;
        cursor: default;
    }
/* _content/ImagineTheFuture.BlazorServer/Shared/PartialViews/AboutSection.razor.rz.scp.css */
/* --- CONFIGURACIÓN DE SECCIÓN --- */
.energy-about-section[b-wivytxgljr] {
    position: relative;
    width: 100%;
    min-height: 100vh; /* Ocupa al menos toda la pantalla para impacto */
    padding: 6rem 1.5rem;
    overflow: hidden;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: var(--palette-carbon-deep);
}

/* --- FONDO CINEMÁTICO --- */
.parallax-bg[b-wivytxgljr] {
    position: absolute;
    inset: 0;
    /* REEMPLAZAR CON TU IMAGEN DE ALTA TENSIÓN / PLANTA */
    background-image: url('/images/about/aboutUs.jpg');
    background-size: cover;
    background-position: center;
    background-attachment: fixed; /* Efecto Parallax simple y robusto */
    z-index: 0;
}

.bg-overlay[b-wivytxgljr] {
    position: absolute;
    inset: 0;
    /* Gradiente oscuro para asegurar legibilidad del texto */
    background: linear-gradient( 135deg, rgba(18, 18, 18, 0.95) 0%, rgba(18, 18, 18, 0.8) 50%, rgba(18, 18, 18, 0.9) 100% );
    z-index: 1;
}

.relative-z[b-wivytxgljr] {
    position: relative;
    z-index: 2; /* Contenido sobre el overlay */
    max-width: 1100px; /* Ancho contenido para lectura cómoda */
}

/* --- ENCABEZADO --- */
.section-header[b-wivytxgljr] {
    text-align: center;
    margin-bottom: 4rem;
}

.section-title[b-wivytxgljr] {
    font-family: 'Montserrat', sans-serif;
    font-weight: 800;
    font-size: 2.5rem;
    color: var(--palette-primary); /* Dorado */
    text-transform: uppercase;
    letter-spacing: 0.1em;
    margin-bottom: 1rem;
}

.title-bar[b-wivytxgljr] {
    width: 60px;
    height: 4px;
    background-color: var(--palette-white);
    margin: 0 auto 1.5rem auto;
    opacity: 0.3;
}

.section-subtitle[b-wivytxgljr] {
    font-family: 'Montserrat', sans-serif;
    font-weight: 300;
    font-size: 1.2rem;
    color: var(--palette-soft-white);
    max-width: 600px;
    margin: 0 auto;
}

/* --- GRID DE HISTORIA (TARJETAS) --- */
.history-grid[b-wivytxgljr] {
    display: grid;
    grid-template-columns: 1fr;
    gap: 2rem;
}

@media (min-width: 992px) {
    .history-grid[b-wivytxgljr] {
        grid-template-columns: repeat(3, 1fr); /* 3 Columnas en escritorio */
    }
}

/* --- TARJETA DE CRISTAL INDUSTRIAL --- */
.history-card[b-wivytxgljr] {
    background: rgba(255, 255, 255, 0.03); /* Casi transparente */
    backdrop-filter: blur(10px); /* Efecto vidrio */
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-left: 4px solid var(--palette-primary); /* Acento dorado vertical */
    padding: 2rem;
    transition: transform 0.3s ease, background-color 0.3s ease;
}

    .history-card:hover[b-wivytxgljr] {
        transform: translateY(-5px);
        background: rgba(255, 255, 255, 0.07);
        box-shadow: 0 10px 30px rgba(0,0,0,0.3);
    }

.card-icon[b-wivytxgljr] {
    font-size: 2rem;
    color: var(--palette-primary);
    margin-bottom: 1.5rem;
    opacity: 0.8;
}

.card-content h3[b-wivytxgljr] {
    font-family: 'Montserrat', sans-serif;
    font-weight: 700;
    font-size: 1.25rem;
    color: var(--palette-white);
    margin-bottom: 1rem;
}

.card-content p[b-wivytxgljr] {
    font-family: 'Montserrat', sans-serif;
    font-weight: 300;
    font-size: 0.95rem;
    line-height: 1.6;
    color: var(--palette-gray-light);
    margin: 0;
}

/* --- ACTION FOOTER --- */
.action-footer[b-wivytxgljr] {
    text-align: center;
    margin-top: 5rem;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 1rem;
}

.btn-corporate-outline[b-wivytxgljr] {
    display: inline-flex;
    align-items: center;
    gap: 1rem;
    padding: 1rem 3rem;
    border: 1px solid var(--palette-gray-light);
    color: var(--palette-white);
    text-decoration: none;
    font-family: 'Montserrat', sans-serif;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    font-size: 0.9rem;
    transition: all 0.3s ease;
}

    .btn-corporate-outline:hover[b-wivytxgljr] {
        border-color: var(--palette-primary);
        color: var(--palette-primary);
        background-color: rgba(192, 164, 124, 0.05);
    }

    .btn-corporate-outline .btn-icon[b-wivytxgljr] {
        transition: transform 0.3s ease;
    }

    .btn-corporate-outline:hover .btn-icon[b-wivytxgljr] {
        transform: translateX(5px);
    }

.small-text-pdf[b-wivytxgljr] {
    font-family: 'Montserrat', sans-serif;
    font-size: 0.8rem;
    color: var(--palette-gray-mid);
    font-style: italic;
}

/* --- ANIMACIONES DE SCROLL --- */
.reveal-on-scroll[b-wivytxgljr] {
    opacity: 0;
    transform: translateY(30px);
    transition: opacity 0.8s ease-out, transform 0.8s ease-out;
}

    .reveal-on-scroll.is-visible[b-wivytxgljr] {
        opacity: 1;
        transform: translateY(0);
    }

/* Retardos para efecto cascada */
.delay-1[b-wivytxgljr] {
    transition-delay: 0.2s;
}

.delay-2[b-wivytxgljr] {
    transition-delay: 0.4s;
}

.delay-3[b-wivytxgljr] {
    transition-delay: 0.6s;
}
/* _content/ImagineTheFuture.BlazorServer/Shared/PartialViews/AttendanceMapViewer.razor.rz.scp.css */
/* * AttendanceMapViewer.razor.css
 * Estilo base para el visor de mapa operativo.
 * Garantiza que el mapa llene su contenedor padre.
 */

.attendance-map[b-bkil1kj41y] {
    width: 100%;
    height: 100%;
    /* Altura mínima de seguridad por si el contenedor padre colapsa */
    min-height: 100px;
    /* Fondo placeholder industrial (Gris técnico) mientras carga Google Maps */
    background-color: #E5E7EB;
    /* Posicionamiento relativo para que los elementos absolutos de Google se anclen bien */
    position: relative;
    /* Heredar bordes redondeados si el padre los tiene */
    border-radius: inherit;
    overflow: hidden;
}
/* _content/ImagineTheFuture.BlazorServer/Shared/PartialViews/ContactSection.razor.rz.scp.css */
/*
 * ContactSection.razor.css
 * Versión Vertical "Waterfall" - Industrial Edition (Fixed Layout)
 */

.energy-contact-section[b-wi5d4mdkfm] {
    position: relative;
    width: 100%;
    /* CORRECCIÓN: Padding solo arriba, abajo lo maneja el margin-bottom del contenido */
    padding: 6rem 0 0 0;
    background-color: var(--palette-carbon-deep);
    /* IMPORTANTE: Visible para que el dropdown no se corte */
    overflow: visible;
    display: flex;
    flex-direction: column;
    align-items: center;
}

.parallax-bg[b-wi5d4mdkfm] {
    position: absolute;
    inset: 0;
    background-image: url('/images/contact/contact-bg.jpg');
    background-size: cover;
    background-position: center;
    background-attachment: fixed;
    z-index: 0;
}

.bg-overlay[b-wi5d4mdkfm] {
    position: absolute;
    inset: 0;
    /* Gradiente oscuro muy fuerte para legibilidad */
    background: linear-gradient(180deg, rgba(10, 15, 30, 0.95) 0%, rgba(18, 18, 18, 0.98) 100%);
    z-index: 1;
}

.relative-z[b-wi5d4mdkfm] {
    position: relative;
    z-index: 2;
}

/* === CONTENEDOR APILADO (LA CASCADA) === */
.content-stack[b-wi5d4mdkfm] {
    width: 100%;
    max-width: 1000px;
    padding: 0 1.5rem; /* Margen lateral para el contenido */
    display: flex;
    flex-direction: column;
    gap: 4rem; /* Aire entre bloques */
    margin-bottom: 5rem;
}

/* === 1. ENCABEZADO === */
.section-header[b-wi5d4mdkfm] {
    text-align: center;
}

.section-title[b-wi5d4mdkfm] {
    font-family: 'Montserrat', sans-serif;
    font-weight: 800;
    font-size: 2.8rem;
    color: var(--palette-primary);
    text-transform: uppercase;
    letter-spacing: 0.1em;
    margin-bottom: 1rem;
}

.title-bar[b-wi5d4mdkfm] {
    width: 60px;
    height: 4px;
    background-color: var(--palette-white);
    margin: 0 auto 1.5rem auto;
    opacity: 0.3;
}

.section-subtitle[b-wi5d4mdkfm] {
    font-family: 'Montserrat', sans-serif;
    font-weight: 300;
    font-size: 1.2rem;
    color: var(--palette-soft-white);
    max-width: 600px;
    margin: 0 auto;
}

/* === 2. PERFIL DIRECTIVO (CENTRADO Y GRANDE) === */
.profile-center-stage[b-wi5d4mdkfm] {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
}

.profile-image-ring[b-wi5d4mdkfm] {
    /* CORRECCIÓN: Aumentado a 220px para presencia real */
    width: 220px;
    height: 220px;
    border-radius: 50%;
    padding: 6px;
    background: linear-gradient(135deg, var(--palette-primary), transparent 80%);
    margin-bottom: 1.5rem;
    box-shadow: 0 0 40px rgba(0, 163, 224, 0.3);
}

    .profile-image-ring img[b-wi5d4mdkfm] {
        width: 100%;
        height: 100%;
        object-fit: cover;
        border-radius: 50%;
        border: 4px solid var(--palette-carbon-deep);
        background-color: #000;
    }

.profile-text h3[b-wi5d4mdkfm] {
    margin: 0;
    font-family: 'Montserrat', sans-serif;
    font-weight: 700;
    color: var(--palette-white);
    font-size: 1.8rem;
    text-transform: uppercase;
}

.position-badge[b-wi5d4mdkfm] {
    display: inline-block;
    background-color: rgba(255, 255, 255, 0.1);
    color: var(--palette-primary);
    font-size: 0.9rem;
    font-weight: 700;
    padding: 0.4rem 1rem;
    border-radius: 50px;
    margin-top: 0.8rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    border: 1px solid rgba(255, 255, 255, 0.1);
}

/* === 3. GRID DE INFORMACIÓN === */
.contact-info-grid[b-wi5d4mdkfm] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 1.5rem;
}

.info-card[b-wi5d4mdkfm] {
    background-color: rgba(255, 255, 255, 0.03);
    border: 1px solid rgba(255, 255, 255, 0.05);
    border-radius: 4px;
    padding: 2.5rem 1.5rem;
    text-align: center;
    transition: transform 0.3s ease;
    display: flex;
    flex-direction: column;
    align-items: center;
}

    .info-card:hover[b-wi5d4mdkfm] {
        transform: translateY(-5px);
        border-color: var(--palette-primary);
        background-color: rgba(255, 255, 255, 0.05);
    }

.icon-circle[b-wi5d4mdkfm] {
    width: 60px;
    height: 60px;
    border-radius: 50%;
    background-color: rgba(0, 163, 224, 0.1);
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--palette-primary);
    font-size: 1.6rem;
    margin-bottom: 1.5rem;
}

.info-card h4[b-wi5d4mdkfm] {
    font-family: 'Montserrat', sans-serif;
    font-weight: 700;
    color: var(--palette-white);
    font-size: 1.1rem;
    margin-bottom: 1rem;
    text-transform: uppercase;
}

.info-card p[b-wi5d4mdkfm], .link-item[b-wi5d4mdkfm] {
    font-size: 1rem;
    color: var(--palette-soft-white);
    margin: 0;
    line-height: 1.5;
    text-decoration: none;
    transition: color 0.2s;
}

    .link-item:hover[b-wi5d4mdkfm] {
        color: var(--palette-primary);
    }

.sub-text[b-wi5d4mdkfm] {
    display: block;
    font-size: 0.85rem;
    color: var(--palette-gray-light);
    margin-top: 0.3rem;
}

/* === 4. FORMULARIO INDUSTRIAL === */
.form-container-wide[b-wi5d4mdkfm] {
    background-color: rgba(0, 0, 0, 0.4);
    border: 1px solid var(--palette-gray-dark);
    border-radius: 4px;
    padding: 3rem;
    box-shadow: 0 10px 40px rgba(0,0,0,0.5);
    /* Permitir overflow para el dropdown */
    overflow: visible;
}

.form-header[b-wi5d4mdkfm] {
    text-align: center;
    margin-bottom: 2.5rem;
}

    .form-header h3[b-wi5d4mdkfm] {
        color: var(--palette-white);
        font-family: 'Montserrat', sans-serif;
        font-weight: 700;
        text-transform: uppercase;
        margin-bottom: 0.5rem;
    }

    .form-header p[b-wi5d4mdkfm] {
        color: var(--palette-gray-light);
    }

.industrial-form-grid[b-wi5d4mdkfm] {
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
}

.grid-row-2[b-wi5d4mdkfm] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1.5rem;
}

/* Inputs */
[b-wi5d4mdkfm] label {
    font-family: 'Montserrat', sans-serif;
    font-weight: 600;
    font-size: 0.8rem;
    color: var(--palette-primary);
    text-transform: uppercase;
    letter-spacing: 0.05em;
    display: block;
    margin-bottom: 0.5rem;
}

[b-wi5d4mdkfm] .input-element {
    width: 100%;
    padding: 1rem;
    background-color: rgba(255, 255, 255, 0.05);
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-radius: 2px;
    color: var(--palette-white);
    font-family: 'Montserrat', sans-serif;
    font-size: 1rem;
    transition: all 0.3s ease;
    outline: none;
}

    [b-wi5d4mdkfm] .input-element:focus {
        border-color: var(--palette-primary);
        background-color: rgba(0, 0, 0, 0.5);
        box-shadow: 0 0 0 1px var(--palette-primary);
    }

    [b-wi5d4mdkfm] .input-element::placeholder {
        color: rgba(255, 255, 255, 0.3);
    }

[b-wi5d4mdkfm] .textarea-lg {
    min-height: 150px;
    resize: vertical;
}

/* Botón Grande Centrado */
.form-actions-centered[b-wi5d4mdkfm] {
    display: flex;
    justify-content: center;
    margin-top: 2rem;
}

[b-wi5d4mdkfm] .btn-primary-industrial-lg {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 1rem;
    padding: 1rem 4rem;
    background-color: var(--palette-primary);
    color: var(--palette-white);
    font-family: 'Montserrat', sans-serif;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    font-size: 1rem;
    border: none;
    cursor: pointer;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    border-radius: 2px;
    box-shadow: 0 4px 20px rgba(0, 163, 224, 0.3);
    width: 100%;
    max-width: 400px;
}

    [b-wi5d4mdkfm] .btn-primary-industrial-lg:hover {
        background-color: #0088BE;
        transform: translateY(-3px);
        box-shadow: 0 8px 30px rgba(0, 163, 224, 0.5);
    }

/* === 5. MAPA FINAL (FULL WIDTH) === */
.full-width-map-section[b-wi5d4mdkfm] {
    position: relative;
    width: 100%;
    z-index: 1;
}

.map-wrapper-final[b-wi5d4mdkfm] {
    height: 450px;
    width: 100%;
    border-top: 1px solid var(--palette-primary);
    border-bottom: 1px solid var(--palette-gray-dark);
}

    .map-wrapper-final[b-wi5d4mdkfm]  .map-viewer-wrapper {
        border-radius: 0;
        height: 100%;
    }

    .map-wrapper-final[b-wi5d4mdkfm]  .map-container {
        height: 100% !important;
    }

.map-placeholder-bar[b-wi5d4mdkfm] {
    height: 150px;
    background-color: #000;
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--palette-gray-mid);
    gap: 1rem;
    font-family: 'Montserrat', sans-serif;
    text-transform: uppercase;
    letter-spacing: 0.1em;
}

/* === RESPONSIVIDAD === */
@media (max-width: 768px) {
    .section-title[b-wi5d4mdkfm] {
        font-size: 2rem;
    }

    /* En móvil, el grid se hace columna */
    .contact-info-grid[b-wi5d4mdkfm] {
        grid-template-columns: 1fr;
    }

    .grid-row-2[b-wi5d4mdkfm] {
        grid-template-columns: 1fr;
    }

    .form-container-wide[b-wi5d4mdkfm] {
        padding: 1.5rem;
    }

    .btn-primary-industrial-lg[b-wi5d4mdkfm] {
        padding: 1rem; /* Full width en móvil */
        width: 100%;
    }

    .map-wrapper-final[b-wi5d4mdkfm] {
        height: 300px;
    }
}

/* Ajustes para pantallas muy pequeñas (390px) */
@media (max-width: 400px) {
    .section-title[b-wi5d4mdkfm] {
        font-size: 1.8rem;
    }
    /* Ajuste de imagen en móvil */
    .profile-image-ring[b-wi5d4mdkfm] {
        width: 150px;
        height: 150px;
    }

    .profile-text h3[b-wi5d4mdkfm] {
        font-size: 1.3rem;
    }
}

.reveal-on-scroll[b-wi5d4mdkfm] {
    opacity: 0;
    transform: translateY(30px);
    transition: opacity 0.8s ease-out, transform 0.8s ease-out;
}

    .reveal-on-scroll.is-visible[b-wi5d4mdkfm] {
        opacity: 1;
        transform: translateY(0);
    }

.delay-1[b-wi5d4mdkfm] {
    transition-delay: 0.2s;
}

.delay-2[b-wi5d4mdkfm] {
    transition-delay: 0.4s;
}

.delay-3[b-wi5d4mdkfm] {
    transition-delay: 0.6s;
}
/* _content/ImagineTheFuture.BlazorServer/Shared/PartialViews/EmployeeScheduleManager.razor.rz.scp.css */
/*
 * EmployeeScheduleManager.razor.css
 * Industrial Edition
 */

.schedule-manager-container[b-rlbfcagq1e] {
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
}

.section-block[b-rlbfcagq1e] {
    background-color: rgba(255, 255, 255, 0.02);
    border: 1px solid var(--palette-gray-dark);
    border-radius: 4px;
    padding: 1.5rem;
}

.manager-header[b-rlbfcagq1e] {
    display: flex;
    align-items: center;
    border-bottom: 1px solid var(--palette-gray-dark);
    padding-bottom: 0.5rem;
    margin-bottom: 1rem;
}

    .manager-header h5[b-rlbfcagq1e] {
        margin: 0;
        font-family: 'Montserrat', sans-serif;
        color: var(--palette-primary);
        text-transform: uppercase;
        font-size: 0.85rem;
        font-weight: 700;
        letter-spacing: 0.05em;
        display: flex;
        gap: 0.5rem;
        align-items: center;
    }

/* Card de Horario Actual */
.current-schedule-card[b-rlbfcagq1e] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    background-color: rgba(0, 163, 224, 0.1);
    border: 1px solid var(--palette-primary);
    padding: 1rem;
    border-radius: 2px;
}

.schedule-name[b-rlbfcagq1e] {
    display: block;
    color: var(--palette-white);
    font-weight: 700;
    font-size: 1rem;
}

.text-muted[b-rlbfcagq1e] {
    color: var(--palette-gray-light);
    font-size: 0.8rem;
}

/* Formulario */
.assign-form[b-rlbfcagq1e], .add-worksite-form[b-rlbfcagq1e] {
    display: flex;
    gap: 0.5rem;
}

.form-control[b-rlbfcagq1e] {
    flex-grow: 1;
    padding: 0.6rem 1rem;
    background-color: rgba(0, 0, 0, 0.3);
    border: 1px solid var(--palette-gray-mid);
    border-radius: 2px;
    color: white;
    font-size: 0.9rem;
    appearance: none;
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%2300A3E0' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M2 5l6 6 6-6'/%3e%3c/svg%3e");
    background-repeat: no-repeat;
    background-position: right 1rem center;
    background-size: 12px;
}

.btn-action[b-rlbfcagq1e] {
    background-color: var(--palette-primary);
    color: white;
    border: none;
    padding: 0 1.2rem;
    border-radius: 2px;
    cursor: pointer;
    font-weight: 600;
    font-size: 0.85rem;
    text-transform: uppercase;
}

    .btn-action:disabled[b-rlbfcagq1e] {
        opacity: 0.5;
        background-color: var(--palette-gray-mid);
    }

.btn-danger-outline[b-rlbfcagq1e] {
    background: transparent;
    border: 1px solid var(--palette-danger);
    color: var(--palette-danger);
    padding: 0.4rem 0.8rem;
    border-radius: 2px;
    cursor: pointer;
    font-size: 0.8rem;
}

    .btn-danger-outline:hover[b-rlbfcagq1e] {
        background-color: rgba(229, 62, 62, 0.1);
    }

/* Worksites List */
.worksites-list[b-rlbfcagq1e] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
    margin-bottom: 1rem;
}

.worksite-item[b-rlbfcagq1e] {
    background-color: var(--palette-gray-darker);
    border: 1px solid var(--palette-gray-mid);
    padding: 0.3rem 0.6rem 0.3rem 0.8rem;
    border-radius: 15px; /* Pastilla */
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-size: 0.85rem;
    color: var(--palette-soft-white);
}

.btn-icon-remove[b-rlbfcagq1e] {
    background: none;
    border: none;
    color: var(--palette-gray-light);
    cursor: pointer;
    font-size: 1rem;
    line-height: 1;
    padding: 0;
}

    .btn-icon-remove:hover[b-rlbfcagq1e] {
        color: var(--palette-danger);
    }

.btn-icon-add[b-rlbfcagq1e] {
    background-color: var(--palette-gray-darker);
    border: 1px solid var(--palette-primary);
    color: var(--palette-primary);
    width: 38px;
    display: flex;
    justify-content: center;
    align-items: center;
    cursor: pointer;
    border-radius: 2px;
}

    .btn-icon-add:hover[b-rlbfcagq1e] {
        background-color: var(--palette-primary);
        color: white;
    }

.local-loader[b-rlbfcagq1e] {
    text-align: center;
    color: var(--palette-gray-light);
    font-style: italic;
}

.mt-4[b-rlbfcagq1e] {
    margin-top: 1.5rem;
}

.mt-2[b-rlbfcagq1e] {
    margin-top: 0.5rem;
}
/* _content/ImagineTheFuture.BlazorServer/Shared/PartialViews/EventTypeDropdown.razor.rz.scp.css */
/*
 * EventTypeDropdown.razor.css
 * Adaptación Industrial del Dropdown de Usuario para Formularios
 */

.dropdown-wrapper[b-dp07s164cb] {
    position: relative;
    width: 100%;
}

/* --- TRIGGER (ESTILO INPUT INDUSTRIAL) --- */
.dropdown-trigger[b-dp07s164cb] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 100%;
    padding: 1rem; /* Mismo padding que tus inputs */
    /* Estilos base de input industrial */
    background-color: rgba(255, 255, 255, 0.05);
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-radius: 2px;
    color: var(--palette-white);
    font-family: 'Montserrat', sans-serif;
    font-size: 1rem;
    cursor: pointer;
    transition: all 0.3s ease;
    text-align: left;
}

    /* Hover */
    .dropdown-trigger:hover:not(:disabled)[b-dp07s164cb] {
        background-color: rgba(255, 255, 255, 0.1);
        border-color: var(--palette-primary);
    }

    /* Active (Abierto) */
    .dropdown-trigger.active[b-dp07s164cb] {
        border-color: var(--palette-primary);
        background-color: rgba(0, 0, 0, 0.5);
        box-shadow: 0 0 0 1px var(--palette-primary);
    }

    /* Disabled */
    .dropdown-trigger:disabled[b-dp07s164cb] {
        opacity: 0.6;
        cursor: not-allowed;
    }

.placeholder-text[b-dp07s164cb] {
    color: rgba(255, 255, 255, 0.3);
}

.selected-text[b-dp07s164cb] {
    color: var(--palette-white);
    font-weight: 500;
}

.caret-icon[b-dp07s164cb] {
    width: 1.2rem;
    height: 1.2rem;
    color: var(--palette-primary);
    transition: transform 0.2s ease;
}

    .caret-icon.open[b-dp07s164cb] {
        transform: rotate(180deg);
    }

/* --- MENÚ DESPLEGABLE (Igual que UserMenu) --- */
.dropdown-menu-list[b-dp07s164cb] {
    position: absolute;
    top: calc(100% + 5px);
    left: 0;
    width: 100%;
    z-index: 1000; /* Flota sobre todo */

    background-color: var(--palette-carbon-deep);
    border: 1px solid var(--palette-primary);
    box-shadow: 0 10px 40px rgba(0, 0, 0, 0.8);
    padding: 0.5rem 0;
    animation: slideIn-b-dp07s164cb 0.2s ease-out;
    /* Scroll para listas largas */
    max-height: 250px;
    overflow-y: auto;
    scrollbar-width: thin;
    scrollbar-color: var(--palette-primary) var(--palette-carbon-deep);
}

/* Ítems del menú */
.dropdown-item[b-dp07s164cb] {
    display: block;
    width: 100%;
    text-align: left;
    padding: 0.8rem 1rem;
    background: transparent;
    border: none;
    border-bottom: 1px solid rgba(255, 255, 255, 0.05);
    color: var(--palette-soft-white);
    font-family: 'Montserrat', sans-serif;
    font-size: 0.9rem;
    cursor: pointer;
    transition: all 0.2s;
}

    .dropdown-item:last-child[b-dp07s164cb] {
        border-bottom: none;
    }

    .dropdown-item:hover[b-dp07s164cb] {
        background-color: rgba(0, 163, 224, 0.1);
        color: var(--palette-primary);
        padding-left: 1.5rem; /* Efecto deslizamiento */
    }

    /* Item seleccionado actualmente */
    .dropdown-item.highlight[b-dp07s164cb] {
        font-weight: 700;
        color: var(--palette-primary);
        background-color: rgba(0, 163, 224, 0.05);
    }

/* Click Catcher */
.click-catcher[b-dp07s164cb] {
    position: fixed;
    inset: 0;
    z-index: 900; /* Debajo del menú (1000) pero encima del resto */
    background: transparent;
}

@keyframes slideIn-b-dp07s164cb {
    from {
        opacity: 0;
        transform: translateY(-5px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}
/* _content/ImagineTheFuture.BlazorServer/Shared/PartialViews/HeroCarousel.razor.rz.scp.css */
/* --- CONTENEDOR PRINCIPAL --- */
.hero-carousel[b-76m7fjru11] {
    position: relative;
    width: 100vw;
    height: 100vh;
    overflow: hidden;
    background-color: var(--palette-black); /* Fondo negro de seguridad */
}

/* --- OVERLAY MEJORADO (Gradiente Energético) --- */
.overlay-gradient[b-76m7fjru11] {
    position: absolute;
    inset: 0;
    /* Gradiente: Oscuro abajo/izquierda para leer texto, más claro arriba para ver la foto */
    background: linear-gradient( to bottom, rgba(0, 0, 0, 0.2) 0%, rgba(0, 0, 0, 0.5) 50%, rgba(0, 0, 0, 0.9) 100% );
    z-index: 2;
    pointer-events: none; /* Deja pasar clicks si hubiera algo interactivo abajo */
}

/* --- SISTEMA DE SLIDES --- */
/* Ambas capas (imágenes y texto) ocupan todo el espacio */
.slides-container[b-76m7fjru11] {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
}

    .slides-container.images[b-76m7fjru11] {
        z-index: 1;
    }

/* Wrapper para centrar contenido, z-index mayor para estar sobre el overlay */
.hero-content-wrapper[b-76m7fjru11] {
    position: absolute;
    inset: 0;
    z-index: 3;
    pointer-events: none; /* Permite clicks pasantes salvo en botones */
}

.slides-container.texts[b-76m7fjru11] {
    width: 100%;
    height: 100%;
}

/* --- ITEM GENÉRICO DE SLIDE --- */
.slide-item[b-76m7fjru11] {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    opacity: 0;
    transition: opacity 1.5s ease-in-out;
}

    .slide-item.active[b-76m7fjru11] {
        opacity: 1;
    }

/* --- ESTILOS DE IMAGEN --- */
.image-layer[b-76m7fjru11] {
    object-fit: cover;
    /* Un zoom muuuuy lento para dar efecto cinemático */
    transform: scale(1);
    transition: opacity 1.5s ease-in-out, transform 6s ease;
}

    .image-layer.active[b-76m7fjru11] {
        transform: scale(1.05); /* Zoom sutil al activarse */
    }

/* --- ESTILOS DE TEXTO (TEXT LAYER) --- */
.text-layer[b-76m7fjru11] {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center; /* Centrado para impacto */
    text-align: center;
    padding: 0 2rem;
    /* Al estar oculto, lo desplazamos un poco abajo para animarlo al entrar */
    transform: translateY(20px);
    transition: opacity 1s ease-in-out, transform 1s ease-out;
}

    /* Cuando se activa, sube a su posición original */
    .text-layer.active[b-76m7fjru11] {
        transform: translateY(0);
        pointer-events: auto; /* Permitir click en botón */
    }

/* --- TIPOGRAFÍA CORPORATIVA --- */
.hero-title[b-76m7fjru11] {
    font-family: 'Montserrat', sans-serif;
    font-weight: 800; /* Extra Bold - Seriedad y Fuerza */
    font-size: 3.5rem;
    color: var(--palette-white);
    text-transform: uppercase;
    letter-spacing: 0.05em; /* Espaciado premium */
    line-height: 1.1;
    margin: 0;
    text-shadow: 0 4px 10px rgba(0,0,0,0.5);
    /* Animación propia escalonada */
    opacity: 0;
    transform: translateY(20px);
}

.slide-item.active .hero-title[b-76m7fjru11] {
    animation: fadeInUp-b-76m7fjru11 0.8s ease-out forwards 0.3s; /* Delay 0.3s */
}

/* Separador Dorado */
.hero-divider[b-76m7fjru11] {
    width: 80px;
    height: 4px;
    background-color: var(--palette-primary); /* El dorado de tu marca */
    margin: 1.5rem 0;
    opacity: 0;
    transform: scaleX(0);
}

.slide-item.active .hero-divider[b-76m7fjru11] {
    animation: expandLine-b-76m7fjru11 0.8s ease-out forwards 0.5s; /* Delay 0.5s */
}

.hero-subtitle[b-76m7fjru11] {
    font-family: 'Montserrat', sans-serif;
    font-weight: 400; /* Regular */
    font-size: 1.25rem;
    color: var(--palette-soft-white);
    max-width: 700px;
    margin-bottom: 2.5rem;
    line-height: 1.6;
    opacity: 0;
    transform: translateY(20px);
}

.slide-item.active .hero-subtitle[b-76m7fjru11] {
    animation: fadeInUp-b-76m7fjru11 0.8s ease-out forwards 0.7s; /* Delay 0.7s */
}

/* --- BOTÓN DE LLAMADA A LA ACCIÓN --- */
.btn-energy-cta[b-76m7fjru11] {
    display: inline-block;
    padding: 1rem 2.5rem;
    background-color: transparent;
    color: var(--palette-white);
    border: 2px solid var(--palette-primary);
    font-family: 'Montserrat', sans-serif;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    text-decoration: none;
    transition: all 0.3s ease;
    opacity: 0;
    transform: translateY(20px);
}

.slide-item.active .btn-energy-cta[b-76m7fjru11] {
    animation: fadeInUp-b-76m7fjru11 0.8s ease-out forwards 0.9s; /* Delay 0.9s */
}

.btn-energy-cta:hover[b-76m7fjru11] {
    background-color: var(--palette-primary);
    color: var(--palette-black);
    box-shadow: 0 0 15px var(--palette-primary-fade);
}

/* --- KEYFRAMES --- */
@keyframes fadeInUp-b-76m7fjru11 {
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@keyframes expandLine-b-76m7fjru11 {
    to {
        opacity: 1;
        transform: scaleX(1);
    }
}

/* --- RESPONSIVE --- */
@media (max-width: 768px) {
    .hero-title[b-76m7fjru11] {
        font-size: 2.2rem;
    }

    .hero-subtitle[b-76m7fjru11] {
        font-size: 1rem;
    }

    .btn-energy-cta[b-76m7fjru11] {
        padding: 0.8rem 2rem;
        font-size: 0.9rem;
    }
}
/* _content/ImagineTheFuture.BlazorServer/Shared/PartialViews/ImagePreviewer.razor.rz.scp.css */
/* ImagePreviewer.razor.css */

.image-previewer-wrapper[b-40613w18jw] {
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 1rem;
    overflow: hidden;
}

/* El "Marco": define la forma, recorta, y contiene todo. */
.aspect-ratio-viewport[b-40613w18jw] {
    position: relative;
    overflow: hidden; /* Clave para recortar la imagen cuando se hace zoom/paneo */
    background-color: #000000;
    border-radius: 8px;
    display: flex;
    align-items: center;
    justify-content: center;
    /* Lógica de escalado dinámico (ContainerWidth) */
    max-width: calc(100% * var(--container-scale, 1));
    max-height: calc(60vh * var(--container-scale, 1));
    transition: all 0.2s ease;
}

.skeleton-loader[b-40613w18jw] {
    position: absolute;
    inset: 0;
    background: linear-gradient(110deg, #2c2c2c 25%, #444444 50%, #2c2c2c 75%);
    background-size: 200% 100%;
    animation: skeleton-loading-b-40613w18jw 1.8s infinite linear;
    z-index: 1;
    opacity: 1;
    transition: opacity 0.5s ease;
}

/* La "Obra de Arte": se adapta al 100% del marco. */
.image-preview[b-40613w18jw] {
    width: 100%;
    height: 100%;
    /* object-fit y transform se inyectan desde C# */
    transition: transform 0.1s ease; /* Transición rápida para que los sliders se sientan fluidos */
    position: relative;
    z-index: 2;
    opacity: 0;
    display: block;
}

/* Lógica de carga visual */
.aspect-ratio-viewport.image-loaded .image-preview[b-40613w18jw] {
    opacity: 1;
}

.aspect-ratio-viewport.image-loaded .skeleton-loader[b-40613w18jw] {
    opacity: 0;
    pointer-events: none;
}

@keyframes skeleton-loading-b-40613w18jw {
    to {
        background-position: -200% 0;
    }
}
/* _content/ImagineTheFuture.BlazorServer/Shared/PartialViews/LoadingComponent.razor.rz.scp.css */
/*
 * LoadingComponent.razor.css
 * Estilo: Light / Operational
 */

/* Fondo del componente (Local) */
.luxury-loader-overlay[b-mptko6tohj] {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    /* Fondo claro semitransparente para el tema operacional */
    background-color: rgba(240, 247, 250, 0.85); /* --employee-bg con alpha */
    backdrop-filter: blur(4px);
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 50;
    border-radius: inherit;
    overflow: hidden;
}

.loader-content[b-mptko6tohj] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    position: relative;
    transform: scale(0.8);
}

/* --- EL REACTOR (Turbina Azul) --- */
.sun-clock[b-mptko6tohj] {
    width: 100px;
    height: 100px;
    position: relative;
    margin-bottom: 1.5rem;
}

/* Anillo Exterior */
.orbit-ring[b-mptko6tohj] {
    position: absolute;
    inset: 0;
    border: 2px solid rgba(0, 0, 0, 0.05); /* Borde oscuro sutil */
    border-top: 2px solid var(--palette-primary); /* Azul */
    border-radius: 50%;
    animation: spin-b-mptko6tohj 1.5s linear infinite;
    box-shadow: 0 0 15px rgba(0, 163, 224, 0.2);
}

    /* Anillo Interior */
    .orbit-ring.inner[b-mptko6tohj] {
        inset: 12px;
        border: 1px dashed rgba(0, 0, 0, 0.2);
        border-left: 2px solid var(--employee-text-main); /* Borde oscuro principal */
        animation: spin-reverse-b-mptko6tohj 2.5s linear infinite;
    }

/* Núcleo de Energía */
.sun-core[b-mptko6tohj] {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 8px;
    height: 8px;
    background-color: var(--palette-primary); /* Núcleo azul */
    border-radius: 50%;
    box-shadow: 0 0 20px 5px var(--palette-primary);
    animation: pulse-glow-b-mptko6tohj 2s ease-in-out infinite;
}

/* Rayos (Ondas) */
.light-rays[b-mptko6tohj] {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 120px;
    height: 120px;
    background: radial-gradient(circle, rgba(0, 163, 224, 0.1) 0%, transparent 70%);
    border-radius: 50%;
    animation: breathe-b-mptko6tohj 3s ease-in-out infinite;
}

/* --- TIPOGRAFÍA --- */
.loading-title[b-mptko6tohj] {
    font-family: 'Montserrat', sans-serif;
    color: var(--employee-text-main); /* Texto oscuro */
    font-size: 1.5rem;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    margin: 0;
    opacity: 0;
    animation: fadeInUp-b-mptko6tohj 0.5s ease-out forwards 0.2s;
}

.loading-message[b-mptko6tohj] {
    font-family: 'Montserrat', sans-serif;
    color: var(--employee-text-secondary); /* Texto secundario oscuro */
    font-size: 0.8rem;
    margin-top: 0.5rem;
    letter-spacing: 0.05em;
    min-height: 1.5em;
    text-align: center;
    text-transform: uppercase;
    animation: textFade-b-mptko6tohj 2.5s infinite;
    padding: 0 1rem;
}

/* --- ANIMACIONES (Sin cambios) --- */
@keyframes spin-b-mptko6tohj {
    0% {
        transform: rotate(0deg);
    }

    100% {
        transform: rotate(360deg);
    }
}

@keyframes spin-reverse-b-mptko6tohj {
    0% {
        transform: rotate(360deg);
    }

    100% {
        transform: rotate(0deg);
    }
}

@keyframes pulse-glow-b-mptko6tohj {
    0%, 100% {
        transform: translate(-50%, -50%) scale(1);
        opacity: 0.8;
    }

    50% {
        transform: translate(-50%, -50%) scale(1.5);
        opacity: 1;
    }
}

@keyframes breathe-b-mptko6tohj {
    0%, 100% {
        transform: translate(-50%, -50%) scale(0.8);
        opacity: 0.2;
    }

    50% {
        transform: translate(-50%, -50%) scale(1.1);
        opacity: 0.5;
    }
}

@keyframes fadeInUp-b-mptko6tohj {
    from {
        opacity: 0;
        transform: translateY(10px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@keyframes textFade-b-mptko6tohj {
    0% {
        opacity: 0;
        transform: translateY(2px);
    }

    20% {
        opacity: 1;
        transform: translateY(0);
    }

    80% {
        opacity: 1;
        transform: translateY(0);
    }

    100% {
        opacity: 0;
        transform: translateY(-2px);
    }
}
/* _content/ImagineTheFuture.BlazorServer/Shared/PartialViews/LoadingScreen.razor.rz.scp.css */
/* * LoadingScreen.razor.css
 * Estilo: Industrial / Energy (Adaptado de Luxury Loader)
 */

/* Fondo de inmersión total */
.luxury-loader-overlay[b-orhyqf59eo] {
    position: fixed;
    top: 0;
    left: 0;
    width: 100vw;
    height: 100vh;
    /* Fondo Carbon Deep solido con un leve gradiente */
    background: radial-gradient(circle at center, #1a222e 0%, #0a0a0a 100%);
    display: flex;
    justify-content: center;
    align-items: center;
    /* Z-Index: Cubre todo, respetando convenciones del sistema */
    z-index: 10000;
    overflow: hidden;
}

.loader-content[b-orhyqf59eo] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    position: relative;
    transform: scale(1.1); /* Ligeramente más grande para impacto */
}

/* --- EL REACTOR (ANTES RELOJ) --- */
.sun-clock[b-orhyqf59eo] {
    width: 120px;
    height: 120px;
    position: relative;
    margin-bottom: 2.5rem;
}

/* Anillo Exterior (Estator) */
.orbit-ring[b-orhyqf59eo] {
    position: absolute;
    inset: 0;
    border: 2px solid rgba(255, 255, 255, 0.05);
    /* Azul Eléctrico */
    border-top: 2px solid var(--palette-primary);
    border-bottom: 2px solid var(--palette-primary);
    border-radius: 50%;
    animation: spin-b-orhyqf59eo 2s linear infinite; /* Más rápido, más mecánico */
    box-shadow: 0 0 20px rgba(0, 163, 224, 0.2);
}

    /* Anillo Interior (Rotor) */
    .orbit-ring.inner[b-orhyqf59eo] {
        inset: 15px;
        border: 2px dashed rgba(255, 255, 255, 0.1); /* Dashed para look técnico */
        border-bottom: none;
        border-left: 2px solid #fff;
        animation: spin-reverse-b-orhyqf59eo 3s linear infinite;
    }

/* Núcleo de Energía (Antes Sol) */
.sun-core[b-orhyqf59eo] {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 12px;
    height: 12px;
    background-color: #fff;
    border-radius: 50%;
    /* Glow Azul intenso */
    box-shadow: 0 0 25px 5px var(--palette-primary);
    animation: pulse-glow-b-orhyqf59eo 1.5s ease-in-out infinite;
}

/* Rayos (Ondas de energía) */
.light-rays[b-orhyqf59eo] {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 140px;
    height: 140px;
    /* Gradiente radial azulado sutil */
    background: radial-gradient(circle, rgba(0, 163, 224, 0.1) 0%, transparent 70%);
    border-radius: 50%;
    animation: breathe-b-orhyqf59eo 3s ease-in-out infinite;
    border: 1px solid rgba(0, 163, 224, 0.05);
}

/* --- TIPOGRAFÍA --- */
.loading-title[b-orhyqf59eo] {
    font-family: 'Montserrat', sans-serif; /* Adiós Cursiva */
    color: var(--palette-white);
    font-size: 2rem;
    font-weight: 800; /* Extra Bold */
    text-transform: uppercase;
    letter-spacing: 0.2em; /* Tracking amplio */
    margin: 0;
    opacity: 0;
    animation: fadeInUp-b-orhyqf59eo 0.8s ease-out forwards 0.2s;
}

.loading-message[b-orhyqf59eo] {
    font-family: 'Montserrat', sans-serif; /* Consola técnica */
    color: var(--palette-gray-light);
    font-size: 0.85rem;
    margin-top: 0.8rem;
    letter-spacing: 0.05em;
    min-height: 1.5em;
    text-align: center;
    text-transform: uppercase;
    animation: textFade-b-orhyqf59eo 2.5s infinite;
    padding: 0 1rem;
}

/* --- ANIMACIONES --- */
@keyframes spin-b-orhyqf59eo {
    0% {
        transform: rotate(0deg);
    }

    100% {
        transform: rotate(360deg);
    }
}

@keyframes spin-reverse-b-orhyqf59eo {
    0% {
        transform: rotate(360deg);
    }

    100% {
        transform: rotate(0deg);
    }
}

@keyframes pulse-glow-b-orhyqf59eo {
    0%, 100% {
        transform: translate(-50%, -50%) scale(1);
        opacity: 0.8;
        box-shadow: 0 0 20px 2px var(--palette-primary);
    }

    50% {
        transform: translate(-50%, -50%) scale(1.3);
        opacity: 1;
        box-shadow: 0 0 40px 10px var(--palette-primary);
    }
}

@keyframes breathe-b-orhyqf59eo {
    0%, 100% {
        transform: translate(-50%, -50%) scale(0.8);
        opacity: 0.1;
    }

    50% {
        transform: translate(-50%, -50%) scale(1.1);
        opacity: 0.4;
    }
}

@keyframes fadeInUp-b-orhyqf59eo {
    from {
        opacity: 0;
        transform: translateY(20px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@keyframes textFade-b-orhyqf59eo {
    0% {
        opacity: 0;
        transform: translateY(5px);
    }

    20% {
        opacity: 1;
        transform: translateY(0);
    }

    80% {
        opacity: 1;
        transform: translateY(0);
    }

    100% {
        opacity: 0;
        transform: translateY(-5px);
    }
}

/* --- AJUSTE MÓVIL --- */
@media (max-width: 768px) {
    .loader-content[b-orhyqf59eo] {
        transform: scale(0.8);
    }

    .loading-title[b-orhyqf59eo] {
        font-size: 1.5rem;
    }
}
/* _content/ImagineTheFuture.BlazorServer/Shared/PartialViews/LocationMapViewer.razor.rz.scp.css */
/*
 * LocationMapViewer.razor.css
 * Estilos locales para el motor del mapa y controles de búsqueda - Industrial Light
*/

.map-viewer-wrapper[b-prcxjwgjmd] {
    display: flex;
    flex-direction: column;
    width: 100%;
    height: 100%; /* Se adapta al nuevo tamaño (90vh) del Popover padre */
    background-color: #FFFFFF;
    border-radius: 4px; /* Borde técnico */
    overflow: hidden;
}

/* --- Controles de Búsqueda --- */
.map-search-controls[b-prcxjwgjmd] {
    display: flex;
    gap: 0.75rem;
    padding: 1rem;
    background-color: #F8FAFC;
    border-bottom: 1px solid #E2E8F0;
    z-index: 5;
    flex-shrink: 0; /* Evita que los controles se aplasten */
}

.map-search-input-wrapper[b-prcxjwgjmd] {
    position: relative;
    flex: 1;
    display: flex;
}

.map-search-input[b-prcxjwgjmd] {
    width: 100%;
    background-color: #FFFFFF;
    border: 1px solid #CBD5E1;
    color: var(--palette-carbon-deep);
    padding: 0.75rem 2.75rem 0.75rem 1rem;
    border-radius: 2px; /* Cuadrado */
    font-family: 'Montserrat', sans-serif;
    font-size: 0.95rem;
    transition: all 0.2s ease;
    outline: none;
}

    .map-search-input:focus[b-prcxjwgjmd] {
        border-color: var(--palette-primary);
        box-shadow: 0 0 0 3px rgba(0, 163, 224, 0.1); /* Resplandor azul claro */
    }

    .map-search-input[b-prcxjwgjmd]::placeholder {
        color: #94A3B8;
    }

/* Botón 'X' para limpiar */
.btn-clear-search[b-prcxjwgjmd] {
    position: absolute;
    right: 0.5rem;
    top: 50%;
    transform: translateY(-50%);
    width: 2rem;
    height: 2rem;
    border: none;
    background-color: transparent;
    color: #94A3B8;
    font-size: 1.4rem;
    line-height: 1;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: color 0.2s ease;
}

    .btn-clear-search:hover[b-prcxjwgjmd] {
        color: #DC2626; /* Rojo de peligro */
    }

/* Botón Buscar */
.btn-map-search[b-prcxjwgjmd] {
    padding: 0 1.5rem;
    font-family: 'Montserrat', sans-serif;
    font-weight: 700;
    font-size: 0.9rem;
    border-radius: 2px; /* Cuadrado */
    border: 1px solid var(--palette-primary);
    cursor: pointer;
    background-color: var(--palette-primary);
    color: var(--palette-white);
    display: flex;
    align-items: center;
    gap: 0.5rem;
    transition: all 0.2s ease;
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

    .btn-map-search:hover[b-prcxjwgjmd] {
        background-color: #0088BE; /* Azul oscuro */
        box-shadow: 0 4px 10px rgba(0, 163, 224, 0.2);
    }

/* --- Contenedor del Mapa --- */
.map-container[b-prcxjwgjmd] {
    flex: 1; /* Esto es lo que permite que el mapa llene el Popover de 90vh */
    position: relative;
    width: 100%;
    min-height: 0; /* Permite que el flex-grow funcione correctamente */
    background-color: #E2E8F0; /* Fondo gris claro antes de cargar el mapa */
}

/* Loader del Mapa */
.map-loader[b-prcxjwgjmd] {
    position: absolute;
    inset: 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    background-color: #F8FAFC;
    z-index: 2;
    color: var(--palette-carbon-deep);
    font-family: 'Montserrat', sans-serif;
    gap: 1rem;
    text-transform: uppercase;
    font-size: 0.9rem;
    font-weight: 600;
    letter-spacing: 0.05em;
}

/* Spinner Industrial */
.energy-spinner-small[b-prcxjwgjmd] {
    width: 35px;
    height: 35px;
    border: 3px solid rgba(0, 163, 224, 0.1);
    border-top: 3px solid var(--palette-primary);
    border-radius: 50%;
    animation: spin-b-prcxjwgjmd 1s linear infinite;
}

@keyframes spin-b-prcxjwgjmd {
    to {
        transform: rotate(360deg);
    }
}

/* Ocultar el loader cuando el mapa de Google ya está listo */
.map-container:has(.gm-style) .map-loader[b-prcxjwgjmd] {
    display: none;
}
/* _content/ImagineTheFuture.BlazorServer/Shared/PartialViews/LoginForm.razor.rz.scp.css */
/*
 * LoginForm.razor.css
 * Diseño Mobile-First & Universal (Funciona en Dark Page y Light Modal)
 */

.auth-form-wrapper[b-37o0mrrgb3] {
    display: flex;
    flex-direction: column;
    gap: 0.8rem;
    animation: fadeIn-b-37o0mrrgb3 0.4s ease-out forwards;
    padding: 0.5rem;
    width: 100%;
}

@keyframes fadeIn-b-37o0mrrgb3 {
    from {
        opacity: 0;
        transform: translateY(5px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* --- Títulos --- */
.auth-title[b-37o0mrrgb3] {
    font-size: 1.8rem;
    font-weight: 800;
    color: var(--palette-primary); /* Azul (Visible siempre) */
    margin-bottom: 0.2rem;
    font-family: 'Montserrat', sans-serif;
    text-align: center;
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

.auth-subtitle[b-37o0mrrgb3] {
    color: var(--palette-gray-mid); /* Gris medio (Visible siempre) */
    font-size: 0.9rem;
    font-family: 'Montserrat', sans-serif;
    margin: 0;
    text-align: center;
    opacity: 0.8;
}

/* --- Botón Google --- */
.btn-google-tasty[b-37o0mrrgb3] {
    width: 100%;
    background-color: #ffffff;
    color: #3c4043;
    border: 1px solid #ddd; /* Borde sutil */
    border-radius: 2px;
    padding: 2px;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    font-family: 'Roboto', 'Montserrat', sans-serif;
    font-weight: 500;
    font-size: 1rem;
    cursor: pointer;
    box-shadow: 0 1px 3px rgba(0,0,0,0.1);
    transition: all 0.2s ease;
    height: 44px;
    margin-bottom: 0.5rem;
}

    .btn-google-tasty:hover[b-37o0mrrgb3] {
        box-shadow: 0 2px 5px rgba(0,0,0,0.2);
        background-color: #f8faff;
    }

.google-icon-wrapper[b-37o0mrrgb3] {
    width: 40px;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: white;
    border-radius: 2px;
    margin-right: 12px;
}

    .google-icon-wrapper img[b-37o0mrrgb3] {
        width: 18px;
        height: 18px;
    }

.btn-text[b-37o0mrrgb3] {
    flex-grow: 1;
    text-align: center;
    padding-right: 40px;
}

/* --- Divisor --- */
.auth-divider[b-37o0mrrgb3] {
    display: flex;
    align-items: center;
    text-align: center;
    margin: 0.8rem 0;
    color: var(--palette-gray-mid); /* Color visible universal */
    opacity: 0.8;
}

    .auth-divider[b-37o0mrrgb3]::before,
    .auth-divider[b-37o0mrrgb3]::after {
        content: '';
        flex: 1;
        border-bottom: 1px solid var(--palette-gray-light);
    }

    .auth-divider span[b-37o0mrrgb3] {
        padding: 0 10px;
        font-size: 0.75rem;
        text-transform: uppercase;
        letter-spacing: 0.1em;
        font-weight: 600;
    }

/* --- Inputs --- */
.form-group[b-37o0mrrgb3] {
    margin-bottom: 1rem;
}

    .form-group label[b-37o0mrrgb3] {
        display: block;
        margin-bottom: 0.4rem;
        color: var(--palette-primary);
        font-size: 0.8rem;
        font-weight: 700;
        text-align: left;
        text-transform: uppercase;
        letter-spacing: 0.05em;
    }

[b-37o0mrrgb3] .form-control {
    width: 100%;
    padding: 0.75rem 1rem;
    /* [FIX]: Fondo oscuro sólido para que resalte en el modal blanco */
    background-color: var(--palette-carbon-deep);
    border: 1px solid var(--palette-gray-mid);
    border-radius: 2px;
    color: var(--palette-white);
    font-family: 'Montserrat', sans-serif;
    font-size: 1rem;
    transition: all 0.3s ease;
}

    [b-37o0mrrgb3] .form-control:focus {
        border-color: var(--palette-primary);
        /* Fondo negro al foco */
        background-color: var(--palette-black);
        box-shadow: 0 0 0 2px rgba(0, 163, 224, 0.2);
        outline: none;
    }

    [b-37o0mrrgb3] .form-control::placeholder {
        color: rgba(255, 255, 255, 0.4);
    }

/* --- Opciones --- */
.options-stack[b-37o0mrrgb3] {
    display: flex;
    flex-direction: column;
    gap: 0.8rem;
    margin-bottom: 1.5rem;
    align-items: flex-start;
}

.checkbox-container[b-37o0mrrgb3] {
    display: flex;
    align-items: center;
    gap: 0.6rem;
    cursor: pointer;
}

/* [FIX]: Checkbox Visible en Blanco y Negro */
[b-37o0mrrgb3] .form-check-input {
    background-color: transparent;
    /* Borde gris medio para que se vea en blanco */
    border: 2px solid var(--palette-gray-mid);
    width: 1.2em;
    height: 1.2em;
    flex-shrink: 0;
    appearance: none;
    border-radius: 2px;
    cursor: pointer;
    margin: 0;
    position: relative;
    transition: all 0.2s ease;
}

    [b-37o0mrrgb3] .form-check-input:checked {
        background-color: var(--palette-primary);
        border-color: var(--palette-primary);
        background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3e%3cpath fill='none' stroke='%23fff' stroke-linecap='round' stroke-linejoin='round' stroke-width='3' d='M6 10l3 3l6-6'/%3e%3c/svg%3e");
        background-size: 70%;
        background-position: center;
        background-repeat: no-repeat;
    }

/* [FIX]: Texto del checkbox visible en modal blanco */
.checkbox-label[b-37o0mrrgb3] {
    color: var(--palette-gray-mid); /* Gris medio universal */
    font-size: 0.9rem;
    cursor: pointer;
    user-select: none;
    font-weight: 500;
}

.forgot-link[b-37o0mrrgb3] {
    color: var(--palette-gray-mid);
    font-size: 0.85rem;
    opacity: 0.9;
    text-decoration: none;
    transition: color 0.2s;
    margin-left: 2px;
}

    .forgot-link:hover[b-37o0mrrgb3] {
        color: var(--palette-primary);
        text-decoration: underline;
    }

/* --- Botones --- */
.btn-primary-custom[b-37o0mrrgb3] {
    width: 100%;
    padding: 0.9rem;
    border-radius: 2px;
    border: none;
    font-family: 'Montserrat', sans-serif;
    font-weight: 700;
    cursor: pointer;
    background-color: var(--palette-primary);
    color: var(--palette-white);
    font-size: 1rem;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    transition: all 0.2s;
    box-shadow: 0 4px 15px rgba(0,0,0,0.2);
}

    .btn-primary-custom:hover[b-37o0mrrgb3] {
        background-color: #0088BE;
        transform: translateY(-2px);
    }

    .btn-primary-custom:disabled[b-37o0mrrgb3] {
        opacity: 0.6;
        cursor: not-allowed;
        background-color: var(--palette-gray-mid);
        transform: none;
    }

/* --- Footer --- */
.auth-footer[b-37o0mrrgb3] {
    margin-top: 2rem;
}

.text-link[b-37o0mrrgb3] {
    color: var(--palette-primary) !important;
    text-decoration: none;
    display: inline-block;
}

    .text-link:hover[b-37o0mrrgb3] {
        text-decoration: underline !important;
    }

/* Alertas */
.alert[b-37o0mrrgb3] {
    padding: 0.75rem 1rem;
    border-radius: 2px;
    margin-bottom: 1rem;
    font-size: 0.9rem;
}

.alert-danger[b-37o0mrrgb3] {
    background-color: rgba(229, 62, 62, 0.1);
    color: #ff6b6b;
    border: 1px solid var(--palette-danger);
    border-left: 3px solid var(--palette-danger);
}

.spinner-border-sm[b-37o0mrrgb3] {
    width: 1.2rem;
    height: 1.2rem;
    border: 2px solid rgba(255,255,255,0.3);
    border-top: 2px solid white;
    border-radius: 50%;
    animation: spin-b-37o0mrrgb3 0.75s linear infinite;
    margin-right: 0.5rem;
}

@keyframes spin-b-37o0mrrgb3 {
    to {
        transform: rotate(360deg);
    }
}

[b-37o0mrrgb3] .validation-message {
    color: var(--palette-danger);
    font-size: 0.8rem;
    margin-top: 0.3rem;
    font-weight: 600;
}
/* _content/ImagineTheFuture.BlazorServer/Shared/PartialViews/OperationalWall.razor.rz.scp.css */
/* Muro */
.staff-security-wall[b-y1huq150y7] {
    display: flex;
    justify-content: center;
    align-items: center;
    height: 100%;
    padding: 2rem;
}

.wall-content[b-y1huq150y7] {
    background-color: #FFFFFF;
    border: 2px dashed #E5E7EB;
    border-radius: 6px;
    padding: 3rem;
    text-align: center;
}

.wall-icon-wrapper.warning[b-y1huq150y7] {
    color: #F59E0B;
    font-size: 3rem;
    margin-bottom: 1rem;
}

.wall-title[b-y1huq150y7] {
    font-size: 1.5rem;
    margin-bottom: 0.5rem;
    color: var(--employee-text-main);
}

.wall-message[b-y1huq150y7] {
    color: var(--employee-text-secondary);
    margin-bottom: 2rem;
}

.btn-secondary[b-y1huq150y7] {
    background-color: #E2E8F0;
    color: var(--employee-text-main);
    padding: 0.6rem 1.2rem;
    text-decoration: none;
    border-radius: 4px;
    font-weight: 600;
}

.animate-fade-in[b-y1huq150y7] {
    animation: fadeIn-b-y1huq150y7 0.4s ease-out;
}

@keyframes fadeIn-b-y1huq150y7 {
    from {
        opacity: 0;
        transform: translateY(10px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}
/* _content/ImagineTheFuture.BlazorServer/Shared/PartialViews/OrganigramTab.razor.rz.scp.css */
/*
 * OrganigramTab.razor.css
 * El Lienzo Principal (Canvas) - Industrial Edition
 */

/* --- CONTENEDOR MAESTRO --- */
.tactical-board-container[b-0qccr9lgun] {
    display: flex;
    flex-direction: column;
    height: calc(100vh - 260px); /* Ajuste para el nuevo header expandido */
    width: 100%; /* Garantizar que ocupe todo el nuevo espacio fluido */
    background-color: #F8FAFC;
    border: 1px solid var(--employee-border);
    border-radius: 6px;
    overflow: hidden;
    position: relative;
    box-shadow: var(--employee-shadow);
}

/* --- TOOLBAR SUPERIOR --- */
.tactical-toolbar[b-0qccr9lgun] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 1rem 1.5rem;
    background-color: #FFFFFF;
    border-bottom: 1px solid var(--employee-border);
    z-index: 10;
    flex-wrap: wrap;
    gap: 1rem;
}

.toolbar-info[b-0qccr9lgun] {
    font-size: 1.1rem;
    font-weight: 700;
    color: var(--employee-text-main);
    display: flex;
    align-items: center;
    gap: 0.5rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

    .toolbar-info i[b-0qccr9lgun] {
        color: var(--palette-primary);
    }

.toolbar-actions[b-0qccr9lgun] {
    display: flex;
    align-items: center;
    gap: 1rem;
}

.time-machine-label[b-0qccr9lgun] {
    font-size: 0.8rem;
    font-weight: 700;
    color: var(--employee-text-secondary);
    text-transform: uppercase;
}

.time-machine-input[b-0qccr9lgun] {
    padding: 0.4rem 0.8rem;
    border: 1px solid #CBD5E1;
    border-radius: 4px;
    font-family: 'Consolas', monospace;
    font-weight: 700;
    color: var(--employee-text-main);
    background-color: #F8FAFC;
    outline: none;
    transition: all 0.2s;
}

    .time-machine-input:focus[b-0qccr9lgun] {
        border-color: var(--palette-primary);
        box-shadow: 0 0 0 2px rgba(0, 163, 224, 0.1);
    }

    .time-machine-input:disabled[b-0qccr9lgun] {
        opacity: 0.6;
        cursor: not-allowed;
    }

/* --- ESPACIO DE TRABAJO Y LIENZO --- */
.tactical-workspace[b-0qccr9lgun] {
    display: flex;
    flex: 1;
    overflow: hidden;
    position: relative;
    background-image: radial-gradient(rgba(203, 213, 225, 0.4) 1px, transparent 1px);
    background-size: 20px 20px; /* Patrón de puntos técnicos estilo "Blueprint" */
}

.canvas-area[b-0qccr9lgun] {
    flex: 1;
    overflow: auto; /* Fundamental para Pan & Scroll del árbol */
    padding: 3rem;
    transition: margin-right 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    display: flex;
    justify-content: center; /* Centra el árbol raíz horizontalmente */
    align-items: flex-start;
}

    /* Reducción dinámica del lienzo cuando se abre el panel lateral (Desktop) */
    .canvas-area.panel-open[b-0qccr9lgun] {
        margin-right: 360px;
    }

/* --- LA RAÍZ DEL ÁRBOL --- */
.tree-root[b-0qccr9lgun] {
    display: flex;
    justify-content: center;
    gap: 3rem; /* Espacio generoso entre directores/gerencias */
}

/* ¡VITAL! Quitar los "cuernos" o líneas superiores a los nodos que no tienen padre */
[b-0qccr9lgun] .tree-root > .tree-node-wrapper::before,
[b-0qccr9lgun] .tree-root > .tree-node-wrapper::after {
    display: none;
}

/* --- ESTADOS VACÍOS Y CARGA --- */
.loading-canvas[b-0qccr9lgun], .empty-canvas[b-0qccr9lgun] {
    text-align: center;
    color: #94A3B8;
    padding-top: 5rem;
}

    .loading-canvas i[b-0qccr9lgun], .empty-canvas i[b-0qccr9lgun] {
        font-size: 3rem;
        margin-bottom: 1rem;
        color: var(--palette-primary);
    }

    .loading-canvas p[b-0qccr9lgun], .empty-canvas p[b-0qccr9lgun] {
        font-weight: 600;
        font-size: 1rem;
        font-family: 'Montserrat', sans-serif;
    }

.animate-fade-in[b-0qccr9lgun] {
    animation: fadeIn-b-0qccr9lgun 0.4s ease-out;
}

@keyframes fadeIn-b-0qccr9lgun {
    from {
        opacity: 0;
    }

    to {
        opacity: 1;
    }
}

/* --- RESPONSIVE --- */
@media (max-width: 900px) {
    /* En móvil, el panel lateral cubrirá todo el lienzo, no empuja el margen */
    .canvas-area.panel-open[b-0qccr9lgun] {
        margin-right: 0;
    }
}
/* _content/ImagineTheFuture.BlazorServer/Shared/PartialViews/PortfolioImageCard.razor.rz.scp.css */
/* PortfolioImageCard.razor.css - EDICIÓN INDUSTRIAL */

.gallery-card[b-7owy28ig8y] {
    display: flex;
    flex-direction: column;
    border: 1px solid var(--palette-gray-dark);
    border-radius: 4px; /* Bordes más rectos */
    background-color: var(--palette-carbon-dark); /* Fondo oscuro técnico */
    overflow: hidden;
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.3);
    transition: transform 0.2s ease, box-shadow 0.2s ease, border-color 0.2s ease;
    height: 100%;
    cursor: grab; /* Indica movible */
}

    .gallery-card:active[b-7owy28ig8y] {
        cursor: grabbing;
        background-color: rgba(255,255,255,0.02);
    }

    .gallery-card:hover[b-7owy28ig8y] {
        transform: translateY(-2px);
        box-shadow: 0 10px 20px rgba(0, 0, 0, 0.5);
        border-color: var(--palette-primary); /* Borde Azul al hover */
    }

.card-image-wrapper[b-7owy28ig8y] {
    width: 100%;
    position: relative;
    overflow: hidden;
    background-color: var(--palette-black);
    border-bottom: 1px solid var(--palette-gray-dark);
}

/* Badge de Orden */
.badge-order-overlay[b-7owy28ig8y] {
    position: absolute;
    top: 0.5rem;
    right: 0.5rem;
    background-color: rgba(0, 0, 0, 0.8);
    color: var(--palette-primary);
    font-size: 0.7rem;
    font-weight: 700;
    padding: 0.2rem 0.5rem;
    border-radius: 2px; /* Cuadrado */
    border: 1px solid var(--palette-primary);
    z-index: 5;
    box-shadow: 0 2px 4px rgba(0,0,0,0.5);
    pointer-events: none;
    font-family: 'Montserrat', sans-serif;
}

/* ============================================================
   BADGE DE VÍNCULO (PORTAL) - Adaptado a Industrial
   ============================================================ */

.ceremony-portal-overlay[b-7owy28ig8y] {
    position: absolute;
    top: 0.5rem;
    left: 0.5rem;
    z-index: 6;
    display: flex;
    align-items: center;
    justify-content: center;
    pointer-events: none;
    filter: drop-shadow(0 2px 4px rgba(0,0,0,0.8));
    transition: transform 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275);
}

.gallery-card:hover .ceremony-portal-overlay[b-7owy28ig8y] {
    transform: scale(1.1);
}

/* Icono pequeño de link */
.portal-link-icon[b-7owy28ig8y] {
    position: absolute;
    bottom: -4px;
    right: -4px;
    background-color: var(--palette-primary);
    color: var(--palette-black); /* Texto negro sobre azul */
    width: 18px;
    height: 18px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 0.6rem;
    border: 1.5px solid var(--palette-black);
    box-shadow: 0 2px 4px rgba(0,0,0,0.5);
}

/* ============================================================
   CONTENIDO Y ACCIONES
   ============================================================ */

.card-content[b-7owy28ig8y] {
    padding: 0.75rem;
    flex-grow: 1;
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}

    .card-content h5[b-7owy28ig8y] {
        margin: 0;
        font-family: 'Montserrat', sans-serif;
        font-size: 0.85rem;
        font-weight: 700;
        color: var(--palette-white);
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
        text-transform: uppercase;
        letter-spacing: 0.02em;
    }

/* Etiqueta informativa del vínculo */
.linked-ceremony-tag[b-7owy28ig8y] {
    font-size: 0.65rem;
    color: var(--palette-primary);
    display: flex;
    align-items: center;
    gap: 0.3rem;
    margin-top: 0.4rem;
    opacity: 0.9;
    font-weight: 600;
    text-transform: uppercase;
}

.description-text[b-7owy28ig8y] {
    font-size: 0.75rem;
    color: var(--palette-gray-light);
    margin: 0;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    line-height: 1.3;
}

.card-actions[b-7owy28ig8y] {
    display: flex;
    gap: 0.5rem;
    padding: 0.5rem;
    border-top: 1px solid var(--palette-gray-dark);
    background-color: rgba(0,0,0,0.2);
}

.btn-action[b-7owy28ig8y] {
    flex-grow: 1;
    padding: 0.4rem;
    border-radius: 2px; /* Botones cuadrados */
    border: 1px solid transparent;
    cursor: pointer;
    transition: all 0.2s ease;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 0.9rem;
}

.btn-edit[b-7owy28ig8y] {
    background-color: transparent;
    color: var(--palette-gray-light);
    border: 1px solid var(--palette-gray-mid);
}

    .btn-edit:hover[b-7owy28ig8y] {
        background-color: var(--palette-gray-darker);
        color: var(--palette-white);
        border-color: var(--palette-gray-light);
    }

.btn-delete[b-7owy28ig8y] {
    background-color: transparent;
    color: var(--palette-danger);
    border: 1px solid transparent;
}

    .btn-delete:hover[b-7owy28ig8y] {
        background-color: rgba(229, 62, 62, 0.1);
        border-color: var(--palette-danger);
    }
/* _content/ImagineTheFuture.BlazorServer/Shared/PartialViews/PortfolioImageEditorModal.razor.rz.scp.css */
/*
 * PortfolioImageEditorModal.razor.css
 * Diseño de editor dual (Visual/Controles) - Industrial Edition
 * Ajustado a la identidad corporativa de Valan / ImagineTheFuture
*/

/* ==============================
 * 1. ESTRUCTURA DEL MODAL
 * ==============================
 */

.modal-backdrop[b-y4zdkz833w] {
    position: fixed;
    top: 0;
    left: 0;
    width: 100vw;
    height: 100vh;
    background-color: rgba(0, 0, 0, 0.85); /* Más oscuro para enfoque total */
    z-index: 1040;
    backdrop-filter: blur(5px);
}

.modal-panel[b-y4zdkz833w] {
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    z-index: 1050;
    width: 95%;
    max-width: 1100px; /* Un poco más ancho para monitores de ingeniería */
    background-color: var(--palette-carbon-deep);
    border: 1px solid var(--palette-gray-dark);
    border-radius: 4px; /* Borde técnico */
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.9);
    display: flex;
    flex-direction: column;
    max-height: 90vh;
    overflow: hidden;
}

    /* Decoración superior */
    .modal-panel[b-y4zdkz833w]::before {
        content: '';
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 3px;
        background: var(--palette-primary);
    }

.modal-header[b-y4zdkz833w] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 1rem 1.5rem;
    border-bottom: 1px solid var(--palette-gray-dark);
    background-color: var(--palette-carbon-dark);
}

    .modal-header h4[b-y4zdkz833w] {
        margin: 0;
        font-family: 'Montserrat', sans-serif;
        font-weight: 700;
        color: var(--palette-white);
        letter-spacing: 0.05em;
        text-transform: uppercase;
        font-size: 1.1rem;
    }

.header-actions-group[b-y4zdkz833w] {
    display: flex;
    align-items: center;
    gap: 1rem;
}

/* Botón de acción en header (Download) */
.btn-icon-action[b-y4zdkz833w] {
    background: transparent;
    border: 1px solid var(--palette-gray-mid);
    color: var(--palette-gray-light);
    width: 32px;
    height: 32px;
    border-radius: 4px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: all 0.2s;
}

    .btn-icon-action:hover:not(:disabled)[b-y4zdkz833w] {
        border-color: var(--palette-primary);
        color: var(--palette-primary);
        background-color: rgba(0, 163, 224, 0.1);
    }

.btn-close[b-y4zdkz833w] {
    background: none;
    border: none;
    font-size: 1.8rem;
    color: var(--palette-gray-mid);
    cursor: pointer;
    line-height: 1;
    transition: color 0.2s;
}

    .btn-close:hover[b-y4zdkz833w] {
        color: var(--palette-danger);
    }

/* ==============================
 * 2. CUERPO DEL MODAL (Layout Dual)
 * ==============================
 */

.modal-body[b-y4zdkz833w] {
    display: flex;
    flex-direction: row;
    flex-grow: 1;
    overflow: hidden;
    min-height: 500px;
}

@media (max-width: 900px) {
    .modal-body[b-y4zdkz833w] {
        flex-direction: column;
        overflow-y: auto;
    }
}

/* --- SECCIÓN VISUAL (IZQUIERDA) --- */
.editor-visual-area[b-y4zdkz833w] {
    flex: 1;
    display: flex;
    flex-direction: column;
    padding: 1.5rem;
    background-color: #050505; /* Casi negro */
    border-right: 1px solid var(--palette-gray-dark);
}

.previewer-section[b-y4zdkz833w] {
    flex-grow: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    background-image: linear-gradient(45deg, #111 25%, transparent 25%), linear-gradient(-45deg, #111 25%, transparent 25%), linear-gradient(45deg, transparent 75%, #111 75%), linear-gradient(-45deg, transparent 75%, #111 75%);
    background-size: 20px 20px;
    background-position: 0 0, 0 10px, 10px -10px, -10px 0px;
    background-color: #080808;
    border: 1px solid var(--palette-gray-dark);
    border-radius: 4px;
    overflow: hidden;
}

/* Dropzone de Reemplazo */
.dropzone-area-wrapper[b-y4zdkz833w] {
    margin-top: 1rem;
    border: 2px dashed var(--palette-gray-mid);
    border-radius: 4px;
    background-color: rgba(255,255,255,0.01);
    transition: all 0.2s;
}

    .dropzone-area-wrapper:hover[b-y4zdkz833w] {
        border-color: var(--palette-primary);
        background-color: rgba(0, 163, 224, 0.05);
    }

.dropzone-content[b-y4zdkz833w] {
    display: block;
    padding: 1rem;
    text-align: center;
    color: var(--palette-gray-light);
    cursor: pointer;
    font-size: 0.85rem;
    font-family: 'Montserrat', sans-serif;
}

    .dropzone-content i[b-y4zdkz833w] {
        color: var(--palette-primary);
        display: block;
        margin-bottom: 0.5rem;
        font-size: 1.2rem;
    }

    .dropzone-content strong[b-y4zdkz833w] {
        color: var(--palette-white);
    }

[b-y4zdkz833w] .hidden-file-input {
    display: none;
}

/* --- SECCIÓN CONTROLES (DERECHA) --- */
.editor-controls-area[b-y4zdkz833w] {
    flex: 1;
    display: flex;
    flex-direction: column;
    padding: 1.5rem;
    background-color: var(--palette-carbon-deep);
    overflow-y: auto;
}

    /* Scrollbar técnica */
    .editor-controls-area[b-y4zdkz833w]::-webkit-scrollbar {
        width: 6px;
    }

    .editor-controls-area[b-y4zdkz833w]::-webkit-scrollbar-thumb {
        background: var(--palette-gray-mid);
        border-radius: 2px;
    }

    .editor-controls-area[b-y4zdkz833w]::-webkit-scrollbar-track {
        background: var(--palette-carbon-dark);
    }

.controls-header[b-y4zdkz833w] {
    display: flex;
    gap: 1rem;
    margin-bottom: 1.5rem;
    border-bottom: 1px solid var(--palette-gray-dark);
    position: sticky;
    top: 0;
    background-color: var(--palette-carbon-deep);
    z-index: 10;
    padding-bottom: 0.5rem;
}

.btn-toggle-view[b-y4zdkz833w] {
    padding: 0.5rem 0.5rem;
    background: transparent;
    border: none;
    border-bottom: 2px solid transparent;
    color: var(--palette-gray-light);
    font-weight: 600;
    text-transform: uppercase;
    font-size: 0.8rem;
    cursor: pointer;
    transition: all 0.2s;
    font-family: 'Montserrat', sans-serif;
}

    .btn-toggle-view:hover[b-y4zdkz833w] {
        color: var(--palette-white);
    }

    .btn-toggle-view.active[b-y4zdkz833w] {
        color: var(--palette-primary);
        border-bottom-color: var(--palette-primary);
    }

/* Sliders y Selectores */
.version-selector-container[b-y4zdkz833w] {
    display: flex;
    gap: 0.5rem;
    flex-wrap: wrap;
    margin-bottom: 1.5rem;
}

.version-button[b-y4zdkz833w] {
    flex: 1;
    padding: 0.6rem;
    font-size: 0.75rem;
    background: var(--palette-gray-darker);
    color: var(--palette-gray-light);
    border: 1px solid var(--palette-gray-dark);
    border-radius: 2px;
    cursor: pointer;
    text-transform: uppercase;
    font-weight: 600;
    transition: all 0.2s;
}

    .version-button:hover[b-y4zdkz833w] {
        border-color: var(--palette-gray-light);
        color: var(--palette-white);
    }

    .version-button.active[b-y4zdkz833w] {
        background: rgba(0, 163, 224, 0.1);
        color: var(--palette-primary);
        border-color: var(--palette-primary);
        box-shadow: 0 0 10px rgba(0, 163, 224, 0.1);
    }

.transform-controls[b-y4zdkz833w] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1.5rem;
}

.control-group label[b-y4zdkz833w] {
    font-size: 0.7rem;
    color: var(--palette-primary); /* Label técnico azul */
    margin-bottom: 0.4rem;
    display: block;
    text-transform: uppercase;
    font-weight: 700;
    letter-spacing: 0.05em;
}

.control-group input[type="range"][b-y4zdkz833w] {
    width: 100%;
    accent-color: var(--palette-primary);
    cursor: pointer;
}

/* Aspect Ratio Dropdown */
.action-controls[b-y4zdkz833w] {
    margin-top: 1.5rem;
    display: flex;
    gap: 0.5rem;
}

.custom-dropdown-container[b-y4zdkz833w] {
    flex: 1;
    position: relative;
}

.custom-dropdown[b-y4zdkz833w] {
    background: var(--palette-gray-darker);
    border: 1px solid var(--palette-gray-dark);
    padding: 0.6rem 1rem;
    border-radius: 2px;
    cursor: pointer;
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-size: 0.9rem;
    color: var(--palette-white);
    font-family: 'Montserrat', sans-serif;
}

.dropdown-options[b-y4zdkz833w] {
    position: absolute;
    bottom: 100%;
    left: 0;
    width: 100%;
    background: var(--palette-carbon-dark);
    border: 1px solid var(--palette-primary);
    border-radius: 2px;
    list-style: none;
    padding: 0;
    margin-bottom: 4px;
    z-index: 1060;
    box-shadow: 0 5px 20px rgba(0,0,0,0.5);
}

.dropdown-option[b-y4zdkz833w] {
    padding: 0.6rem 1rem;
    cursor: pointer;
    color: var(--palette-soft-white);
    font-size: 0.9rem;
    border-bottom: 1px solid rgba(255,255,255,0.05);
}

    .dropdown-option:hover[b-y4zdkz833w] {
        background: rgba(0, 163, 224, 0.1);
        color: var(--palette-primary);
    }

.btn-reset-adjustments[b-y4zdkz833w] {
    background: var(--palette-gray-darker);
    border: 1px solid var(--palette-gray-dark);
    color: var(--palette-gray-light);
    padding: 0 1rem;
    border-radius: 2px;
    cursor: pointer;
    transition: all 0.2s;
}

    .btn-reset-adjustments:hover:not(:disabled)[b-y4zdkz833w] {
        background-color: var(--palette-gray-dark);
        color: var(--palette-white);
    }

    .btn-reset-adjustments:disabled[b-y4zdkz833w] {
        opacity: 0.5;
        cursor: not-allowed;
    }

/* ==============================
 * 3. FORMULARIO METADATOS Y PICKER
 * ==============================
 */

[b-y4zdkz833w] .form-group label {
    display: block;
    font-size: 0.8rem;
    color: var(--palette-primary);
    margin-bottom: 0.4rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    font-weight: 600;
}

/* Inputs Técnicos */
[b-y4zdkz833w] .form-control {
    width: 100%;
    background-color: rgba(0,0,0,0.3);
    border: 1px solid var(--palette-gray-dark);
    color: var(--palette-white);
    padding: 0.75rem;
    border-radius: 2px; /* Cuadrado */
    font-family: 'Montserrat', sans-serif;
    font-size: 0.9rem;
    transition: all 0.2s;
}

    [b-y4zdkz833w] .form-control:focus {
        border-color: var(--palette-primary);
        box-shadow: 0 0 0 1px rgba(0, 163, 224, 0.2);
        outline: none;
        background-color: rgba(0,0,0,0.5);
    }

    [b-y4zdkz833w] .form-control::placeholder {
        color: rgba(255,255,255,0.2);
    }

.separator-mini[b-y4zdkz833w] {
    border: 0;
    border-top: 1px solid var(--palette-gray-dark);
    margin: 1.5rem 0;
    opacity: 0.5;
}

/* --- CEREMONY PICKER (PORTAL) --- */

.text-accent-gold[b-y4zdkz833w] {
    color: var(--palette-primary) !important; /* Forzar azul aunque la clase diga gold */
}

.help-text-dark[b-y4zdkz833w] {
    font-size: 0.8rem;
    color: var(--palette-gray-mid);
    margin-bottom: 1rem;
    line-height: 1.4;
}

.search-picker-wrapper[b-y4zdkz833w] {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
    background-color: rgba(0,0,0,0.2);
    padding: 1rem;
    border-radius: 4px;
    border: 1px solid var(--palette-gray-dark);
}

.input-with-icon[b-y4zdkz833w] {
    position: relative;
    width: 100%;
}

    .input-with-icon i[b-y4zdkz833w] {
        position: absolute;
        left: 1rem;
        top: 50%;
        transform: translateY(-50%);
        color: var(--palette-primary);
        opacity: 0.8;
    }

.search-input[b-y4zdkz833w] {
    padding-left: 2.5rem !important;
    background-color: var(--palette-black) !important;
}

/* Listado de resultados */
.ceremony-results-list[b-y4zdkz833w] {
    max-height: 220px;
    overflow-y: auto;
    display: flex;
    flex-direction: column;
    gap: 4px;
    padding-right: 4px;
    /* Scrollbar fino */
    scrollbar-width: thin;
    scrollbar-color: var(--palette-gray-mid) transparent;
}

/* Ítem de la lista */
.ceremony-item[b-y4zdkz833w] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 0.6rem;
    border-radius: 2px;
    cursor: pointer;
    transition: all 0.2s ease;
    border: 1px solid transparent;
    background-color: transparent;
}

    .ceremony-item:hover[b-y4zdkz833w] {
        background-color: rgba(255, 255, 255, 0.03);
        border-color: rgba(255, 255, 255, 0.05);
    }

    .ceremony-item.selected[b-y4zdkz833w] {
        background-color: rgba(0, 163, 224, 0.1);
        border-color: var(--palette-primary);
    }

.mini-avatar-placeholder[b-y4zdkz833w] {
    width: 45px;
    height: 45px;
    border-radius: 2px;
    background-color: var(--palette-gray-darker);
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--palette-gray-light);
    flex-shrink: 0;
}

.item-info[b-y4zdkz833w] {
    display: flex;
    flex-direction: column;
    overflow: hidden;
    flex-grow: 1;
}

    .item-info .title[b-y4zdkz833w] {
        font-size: 0.9rem;
        font-weight: 600;
        color: var(--palette-white);
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
    }

    .item-info .subtitle[b-y4zdkz833w] {
        font-size: 0.75rem;
        color: var(--palette-gray-light);
        opacity: 0.7;
    }

/* ==============================
 * 4. FOOTER
 * ==============================
 */

.modal-footer-sticky[b-y4zdkz833w] {
    padding: 1rem 1.5rem;
    border-top: 1px solid var(--palette-gray-dark);
    display: flex;
    justify-content: flex-end;
    gap: 0.75rem;
    background-color: var(--palette-carbon-deep);
    margin-top: auto;
}

.btn-cancel[b-y4zdkz833w], .btn-save[b-y4zdkz833w] {
    padding: 0.7rem 1.5rem;
    border-radius: 2px; /* Botones cuadrados */
    font-weight: 700;
    cursor: pointer;
    font-family: 'Montserrat', sans-serif;
    border: none;
    text-transform: uppercase;
    font-size: 0.85rem;
    letter-spacing: 0.05em;
    transition: all 0.2s;
}

.btn-cancel[b-y4zdkz833w] {
    background-color: transparent;
    color: var(--palette-gray-light);
    border: 1px solid var(--palette-gray-mid);
}

    .btn-cancel:hover[b-y4zdkz833w] {
        background-color: var(--palette-gray-darker);
        color: var(--palette-white);
    }

.btn-save[b-y4zdkz833w] {
    background-color: var(--palette-primary);
    color: var(--palette-white); /* Texto blanco para contraste */
    box-shadow: 0 4px 10px rgba(0,0,0,0.3);
}

    .btn-save:hover:not(:disabled)[b-y4zdkz833w] {
        background-color: #0088BE; /* Azul oscuro al hover */
        transform: translateY(-1px);
        box-shadow: 0 6px 15px rgba(0, 163, 224, 0.4);
    }

    .btn-save:disabled[b-y4zdkz833w] {
        opacity: 0.5;
        cursor: not-allowed;
        background-color: var(--palette-gray-mid);
        box-shadow: none;
    }

    .btn-save.is-loading[b-y4zdkz833w]::after {
        content: "";
        width: 1rem;
        height: 1rem;
        border: 2px solid rgba(255,255,255,0.3);
        border-top-color: #fff;
        border-radius: 50%;
        display: inline-block;
        animation: spin-b-y4zdkz833w 0.8s linear infinite;
        margin-left: 0.5rem;
    }

@keyframes spin-b-y4zdkz833w {
    to {
        transform: rotate(360deg);
    }
}
/* _content/ImagineTheFuture.BlazorServer/Shared/PartialViews/PortfolioManager.razor.rz.scp.css */
/*
 * PortfolioManager.razor.css
 * Gestor de carga y ordenamiento de imágenes - Industrial Edition
 */

.portfolio-manager[b-9cykp2vzps] {
    width: 100%;
}

/* Dropzone (Zona de Carga) */
.dropzone-area[b-9cykp2vzps] {
    position: relative;
    border: 2px dashed var(--palette-gray-mid);
    border-radius: 4px; /* Borde técnico */
    background-color: rgba(255, 255, 255, 0.02);
    cursor: pointer;
    min-height: 140px;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.2s ease;
}

    .dropzone-area:hover[b-9cykp2vzps] {
        border-color: var(--palette-primary); /* Azul al hover */
        background-color: rgba(0, 163, 224, 0.05);
    }

    .dropzone-area.is-disabled[b-9cykp2vzps] {
        opacity: 0.5;
        cursor: not-allowed;
        border-color: var(--palette-gray-dark);
    }

[b-9cykp2vzps] .dropzone-input {
    position: absolute;
    inset: 0;
    opacity: 0;
    cursor: pointer;
    z-index: 2;
}

.dropzone-content[b-9cykp2vzps] {
    text-align: center;
    color: var(--palette-gray-light);
}

    .dropzone-content i[b-9cykp2vzps] {
        color: var(--palette-primary);
        margin-bottom: 0.5rem;
        display: block;
    }

    .dropzone-content p[b-9cykp2vzps] {
        color: var(--palette-white);
        margin: 0;
        font-weight: 600;
        font-family: 'Montserrat', sans-serif;
        text-transform: uppercase;
        font-size: 0.9rem;
    }

    .dropzone-content span[b-9cykp2vzps] {
        font-size: 0.8rem;
        opacity: 0.7;
    }

/* Progress List (Subidas en curso) */
.upload-progress-list[b-9cykp2vzps] {
    background: var(--palette-carbon-deep);
    padding: 1rem;
    border-radius: 2px;
    border-left: 3px solid var(--palette-primary); /* Indicador azul */
    border: 1px solid var(--palette-gray-dark);
    border-left-width: 3px;
    margin-bottom: 1.5rem;
}

    .upload-progress-list h5[b-9cykp2vzps] {
        margin: 0 0 0.5rem 0;
        font-size: 0.9rem;
        color: var(--palette-primary);
        font-weight: 600;
        text-transform: uppercase;
    }

.upload-progress-item[b-9cykp2vzps] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0.5rem 0;
    font-size: 0.85rem;
    border-bottom: 1px solid rgba(255,255,255,0.05);
    color: var(--palette-soft-white);
}

    .upload-progress-item:last-child[b-9cykp2vzps] {
        border-bottom: none;
    }

/* Header de la Galería */
.manager-header[b-9cykp2vzps] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0.8rem 1rem;
    background: rgba(255,255,255,0.03);
    border: 1px solid var(--palette-gray-dark);
    border-radius: 2px;
    margin-bottom: 1.5rem;
    font-size: 0.85rem;
}

    .manager-header .info[b-9cykp2vzps] {
        color: var(--palette-gray-light);
        display: flex;
        align-items: center;
    }

    .manager-header i[b-9cykp2vzps] {
        color: var(--palette-primary);
        margin-right: 0.5rem;
        font-size: 1rem;
    }

    .manager-header .counter[b-9cykp2vzps] {
        color: var(--palette-white);
        font-family: 'Montserrat', sans-serif;
    }

/* Grid de Imágenes */
.portfolio-grid[b-9cykp2vzps] {
    display: grid;
    gap: 1.5rem;
    /* Las columnas se definen inline en el HTML, pero aquí aseguramos el comportamiento */
}

/* Sortable Ghost (estilo mientras arrastras) */
[b-9cykp2vzps] .sortable-ghost {
    opacity: 0.4;
    transform: scale(0.95);
    border: 2px solid var(--palette-primary) !important;
    background-color: rgba(0, 163, 224, 0.1);
}

/* Empty State */
.empty-state-container[b-9cykp2vzps] {
    text-align: center;
    padding: 5rem 0;
    opacity: 0.6;
    border: 2px dashed var(--palette-gray-dark);
    border-radius: 4px;
}

.empty-text[b-9cykp2vzps] {
    font-size: 1rem;
    color: var(--palette-gray-light);
    margin-bottom: 0.5rem;
}

.empty-icon[b-9cykp2vzps] {
    font-size: 3rem;
    margin-top: 1rem;
    color: var(--palette-gray-mid);
}

/* Loading State */
.loading-state[b-9cykp2vzps] {
    text-align: center;
    padding: 3rem;
    color: var(--palette-primary);
}

.loader[b-9cykp2vzps] {
    width: 2rem;
    height: 2rem;
    border: 3px solid rgba(255,255,255,0.1);
    border-top-color: var(--palette-primary);
    border-radius: 50%;
    animation: spin-b-9cykp2vzps 1s linear infinite;
    margin: 0 auto 1rem;
}

@keyframes spin-b-9cykp2vzps {
    to {
        transform: rotate(360deg);
    }
}
/* _content/ImagineTheFuture.BlazorServer/Shared/PartialViews/PortfolioSection.razor.rz.scp.css */
/*
 * PortfolioSection.razor.css
 * Diseño visual de Landing - Industrial Edition
 */

.portfolio-section-wrapper[b-wyg5lwwtqr] {
    width: 100%;
    padding: 6rem 1.5rem;
    background-color: var(--palette-carbon-deep); /* Fondo oscuro principal */
    /* Patrón de grilla técnica sutil de fondo */
    background-image: linear-gradient(rgba(255, 255, 255, 0.03) 1px, transparent 1px), linear-gradient(90deg, rgba(255, 255, 255, 0.03) 1px, transparent 1px);
    background-size: 40px 40px;
    color: var(--palette-soft-white);
    scroll-margin-top: 80px; /* Compensación TopBar */
    position: relative;
    border-top: 1px solid var(--palette-gray-dark);
}

/* --- ENCABEZADO --- */
.section-header[b-wyg5lwwtqr] {
    text-align: center;
    margin-bottom: 4rem;
    padding: 0 1rem;
}

.section-title[b-wyg5lwwtqr] {
    font-family: 'Montserrat', sans-serif;
    color: var(--palette-white);
    font-size: 2.5rem;
    line-height: 1.2;
    font-weight: 800; /* Extra Bold Industrial */
    text-transform: uppercase;
    letter-spacing: 0.1em;
    margin: 0;
}

.title-bar-tech[b-wyg5lwwtqr] {
    width: 60px;
    height: 4px;
    background-color: var(--palette-primary); /* Azul Eléctrico */
    margin: 1.5rem auto;
}

.section-description[b-wyg5lwwtqr] {
    font-family: 'Montserrat', sans-serif;
    color: var(--palette-gray-light);
    font-size: 1rem;
    max-width: 700px;
    margin: 0 auto;
    line-height: 1.6;
    font-weight: 400;
}

/* --- GRID MOSAICO (Masonry mantenido pero industrializado) --- */
.portfolio-grid[b-wyg5lwwtqr] {
    display: grid;
    /* Minmax ajustado para tarjetas más anchas/técnicas */
    grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
    grid-auto-rows: 250px;
    grid-auto-flow: dense;
    gap: 1rem; /* Espacio más apretado */
    max-width: 1400px;
    margin: 0 auto;
}

/* Patrones Masonry (Se mantienen para dinamismo visual) */
.portfolio-gallery-item:nth-child(5n - 2)[b-wyg5lwwtqr] {
    grid-column: span 2;
    grid-row: span 2;
}

.portfolio-gallery-item:nth-child(7n - 3)[b-wyg5lwwtqr] {
    grid-row: span 2;
}

.portfolio-gallery-item:nth-child(11n - 7)[b-wyg5lwwtqr] {
    grid-column: span 2;
}

/* --- LA TARJETA (ASSET) --- */
.portfolio-image-card[b-wyg5lwwtqr] {
    position: relative;
    width: 100%;
    height: 100%;
    border-radius: 2px; /* Cuadrado técnico */
    overflow: hidden;
    cursor: pointer;
    background-color: var(--palette-gray-darker);
    border: 1px solid transparent;
    transition: transform 0.3s cubic-bezier(0.25, 0.8, 0.25, 1), border-color 0.3s ease;
}

    .portfolio-image-card:hover[b-wyg5lwwtqr] {
        transform: translateY(-4px);
        z-index: 10;
        box-shadow: 0 15px 30px rgba(0,0,0,0.5);
        border-color: var(--palette-primary); /* Borde Azul al hover */
    }

.image-container[b-wyg5lwwtqr] {
    width: 100%;
    height: 100%;
}

.portfolio-img[b-wyg5lwwtqr] {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    transition: transform 0.5s ease;
    filter: grayscale(20%); /* Desaturación inicial para look serio */
}

.portfolio-image-card:hover .portfolio-img[b-wyg5lwwtqr] {
    transform: scale(1.05);
    filter: grayscale(0%); /* Color completo al hover */
}

/* --- BADGE DE PORTAL (TECH TAG) --- */
.tech-badge-container[b-wyg5lwwtqr] {
    position: absolute;
    top: 0.8rem;
    left: 0.8rem;
    z-index: 5;
    pointer-events: none;
}

.tech-tag[b-wyg5lwwtqr] {
    background: rgba(0, 0, 0, 0.8);
    color: var(--palette-primary);
    padding: 0.3rem 0.8rem;
    border-radius: 2px;
    font-size: 0.7rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    border: 1px solid var(--palette-primary);
    display: flex;
    align-items: center;
    gap: 0.4rem;
    box-shadow: 0 4px 10px rgba(0,0,0,0.5);
}

/* --- OVERLAY INFORMACIÓN --- */
.portfolio-overlay[b-wyg5lwwtqr] {
    position: absolute;
    inset: 0;
    /* Gradiente oscuro vertical */
    background: linear-gradient(to top, rgba(0, 0, 0, 0.9) 0%, rgba(0,0,0,0.4) 50%, rgba(0,0,0,0.1) 100%);
    opacity: 0;
    transition: opacity 0.3s ease-out;
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 1.5rem;
    z-index: 2;
}

.portfolio-image-card:hover .portfolio-overlay[b-wyg5lwwtqr] {
    opacity: 1;
}

/* Contenedor interno del overlay */
.overlay-inner[b-wyg5lwwtqr] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 100%;
}

/* Icono de Acción Central */
.overlay-action[b-wyg5lwwtqr] {
    width: 50px;
    height: 50px;
    border-radius: 50%;
    background-color: var(--palette-primary);
    color: var(--palette-black); /* Contraste alto */
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.2rem;
    transform: scale(0.5);
    opacity: 0;
    transition: all 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275);
    margin-bottom: 1rem;
    box-shadow: 0 0 15px rgba(0, 163, 224, 0.6);
}

.portfolio-image-card:hover .overlay-action[b-wyg5lwwtqr] {
    transform: scale(1);
    opacity: 1;
}

.image-info[b-wyg5lwwtqr] {
    text-align: center;
    position: absolute;
    bottom: 1.5rem;
    left: 1rem;
    right: 1rem;
    transform: translateY(10px);
    transition: all 0.3s ease 0.1s;
    opacity: 0;
}

.portfolio-image-card:hover .image-info[b-wyg5lwwtqr] {
    transform: translateY(0);
    opacity: 1;
}

.image-title[b-wyg5lwwtqr] {
    font-family: 'Montserrat', sans-serif;
    font-weight: 700;
    font-size: 0.95rem;
    color: var(--palette-white);
    text-transform: uppercase;
    display: block;
    letter-spacing: 0.05em;
    margin-bottom: 0.2rem;
}

.image-subtitle[b-wyg5lwwtqr] {
    font-size: 0.75rem;
    color: var(--palette-primary);
    font-weight: 600;
    display: block;
    text-transform: uppercase;
}

/* --- RESPONSIVIDAD --- */
@media (max-width: 768px) {
    .section-title[b-wyg5lwwtqr] {
        font-size: 2rem;
    }

    .portfolio-grid[b-wyg5lwwtqr] {
        grid-template-columns: repeat(2, 1fr);
        grid-auto-rows: 180px;
        gap: 0.5rem;
    }

    /* Reset de Masonry complejo en móvil para evitar huecos raros */
    .portfolio-gallery-item:nth-child(5n - 2)[b-wyg5lwwtqr],
    .portfolio-gallery-item:nth-child(7n - 3)[b-wyg5lwwtqr],
    .portfolio-gallery-item:nth-child(11n - 7)[b-wyg5lwwtqr] {
        grid-column: auto;
        grid-row: auto;
    }

    /* Un patrón más simple para móvil: cada 3 ítems, uno grande */
    .portfolio-gallery-item:nth-child(3n)[b-wyg5lwwtqr] {
        grid-column: span 2;
        grid-row: span 2;
    }
}
/* _content/ImagineTheFuture.BlazorServer/Shared/PartialViews/ProfileAvatar.razor.rz.scp.css */
/* Estilos para el componente ProfileAvatar (Industrial Style) */
.profile-picture-container[b-jr5shzkej8] {
    position: relative;
    flex-shrink: 0;
    overflow: hidden;
    border-radius: 50%;
    /* Fondo base técnico */
    background-color: var(--palette-gray-darker);
    display: inline-block;
    /* Borde sutil oscuro */
    border: 2px solid rgba(255,255,255,0.05);
}

/* El fondo animado (esqueleto) - Gradiente Gris/Azulado */
.skeleton-loader[b-jr5shzkej8] {
    position: absolute;
    inset: 0;
    background: linear-gradient(110deg, rgba(255, 255, 255, 0.05) 25%, rgba(0, 163, 224, 0.1) 50%, /* Destello azul sutil */
    rgba(255, 255, 255, 0.05) 75%);
    background-size: 200% 100%;
    animation: skeleton-loading-b-jr5shzkej8 1.5s infinite linear;
    z-index: 1;
}

@keyframes skeleton-loading-b-jr5shzkej8 {
    to {
        background-position: -200% 0;
    }
}

/* La imagen de perfil */
.profile-picture[b-jr5shzkej8] {
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 50%;
    position: relative;
    z-index: 2;
    background-color: transparent;
    opacity: 0;
    transition: opacity 0.5s ease-in-out;
}

    .profile-picture.loaded[b-jr5shzkej8] {
        opacity: 1;
    }

/* Sombras y Bordes según tamaño */

.profile-picture-container.xlarge[b-jr5shzkej8] {
    /* Efecto "Glow" técnico en lugar de sombra blanca */
    box-shadow: 0 0 0 4px rgba(255,255,255,0.05), 0 10px 30px rgba(0,0,0,0.5);
}

.profile-picture-container.large[b-jr5shzkej8] {
    box-shadow: 0 0 0 3px rgba(255,255,255,0.05), 0 5px 20px rgba(0,0,0,0.4);
}

.profile-picture-container.small[b-jr5shzkej8] {
    box-shadow: 0 0 0 2px rgba(255,255,255,0.05);
}

.profile-picture-container.xsmall[b-jr5shzkej8] {
    box-shadow: 0 0 0 1px rgba(255,255,255,0.1);
}
/* _content/ImagineTheFuture.BlazorServer/Shared/PartialViews/QuickRegistrationForm.razor.rz.scp.css */
/*
 * QuickRegistrationForm.razor.css
 * Wizard de "Fast Track" para registro de usuario.
 * Nota: Los estilos de Login y Register ahora viven en sus propios componentes.
 */

.loading-container[b-sz935ckzsx] {
    text-align: center;
    padding: 2rem;
    color: var(--color-accent-gold);
}

.loading-text[b-sz935ckzsx] {
    margin-top: 1rem;
    font-family: 'Montserrat', sans-serif;
    font-style: italic;
}

/* --- Contenedor Principal --- */
.quick-reg-wrapper[b-sz935ckzsx] {
    width: 100%;
    max-width: 500px;
    background-color: var(--color-dark-carbon);
    border: 1px solid var(--color-section-border-reloj-de-luz);
    border-radius: 8px;
    padding: 2rem;
    box-shadow: 0 10px 30px rgba(0,0,0,0.5);
    margin: 0 auto;
    position: relative;
}

/* --- Animaciones --- */
.fade-in[b-sz935ckzsx] {
    animation: fadeIn-b-sz935ckzsx 0.4s ease-out forwards;
}

@keyframes fadeIn-b-sz935ckzsx {
    from {
        opacity: 0;
        transform: translateY(10px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* --- Header y Pasos --- */
.wizard-header[b-sz935ckzsx] {
    text-align: center;
    margin-bottom: 2rem;
}

.wizard-title[b-sz935ckzsx] {
    font-family: 'Montserrat', sans-serif;
    font-weight: 600;
    color: var(--color-text-reloj-de-luz);
    margin-bottom: 1.5rem;
    font-size: 1.5rem;
}

/* Track de Progreso */
.progress-track[b-sz935ckzsx] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
}

.step-dot[b-sz935ckzsx] {
    width: 30px;
    height: 30px;
    border-radius: 50%;
    background-color: var(--color-form-background-input-reloj-de-luz);
    border: 2px solid var(--color-form-border-reloj-de-luz);
    color: var(--color-form-label-reloj-de-luz);
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 700;
    font-size: 0.9rem;
    transition: all 0.3s ease;
}

.step-line[b-sz935ckzsx] {
    width: 40px;
    height: 2px;
    background-color: var(--color-form-border-reloj-de-luz);
    transition: all 0.3s ease;
}

/* Estados del Progreso */
.step-dot.active[b-sz935ckzsx] {
    background-color: var(--color-accent-gold);
    border-color: var(--color-accent-gold);
    color: #000;
    transform: scale(1.1);
}

.step-dot.completed[b-sz935ckzsx] {
    background-color: #198754; /* Verde */
    border-color: #198754;
    color: white;
}

.step-line.completed[b-sz935ckzsx] {
    background-color: #198754;
}

/* --- Contenido Genérico --- */
.step-desc[b-sz935ckzsx] {
    text-align: center;
    color: var(--color-form-label-reloj-de-luz);
    margin-bottom: 1.5rem;
    font-size: 0.95rem;
}

/* --- Form Groups (Inputs para Pasos 1 y 2) --- */
.form-group[b-sz935ckzsx] {
    margin-bottom: 1.25rem;
}

    .form-group label[b-sz935ckzsx] {
        display: block;
        margin-bottom: 0.4rem;
        color: var(--color-accent-gold);
        font-size: 0.9rem;
        font-weight: 500;
    }

[b-sz935ckzsx] .form-control {
    width: 100%;
    padding: 0.7rem;
    background-color: var(--color-form-background-input-reloj-de-luz);
    border: 1px solid var(--color-section-border-reloj-de-luz);
    border-radius: 4px;
    color: var(--color-text-reloj-de-luz);
    font-family: 'Montserrat', sans-serif;
}

    [b-sz935ckzsx] .form-control:focus {
        border-color: var(--color-accent-gold);
        outline: none;
        box-shadow: 0 0 0 2px rgba(192, 164, 124, 0.2);
    }

/* Grid para inputs dobles */
.row[b-sz935ckzsx] {
    --bs-gutter-x: 1rem;
}

/* --- Paso 3: Imagen --- */
.upload-center[b-sz935ckzsx] {
    display: flex;
    justify-content: center;
    align-items: center;
    margin: 2rem 0;
    position: relative;
}

/* Forzamos tamaño bonito para WatchImageViewer */
[b-sz935ckzsx] .watch-image-wrapper {
    width: 150px;
    height: 150px;
    position: relative;
    overflow: visible;
}

.text-muted-small[b-sz935ckzsx] {
    text-align: center;
    font-size: 0.8rem;
    color: var(--color-form-label-reloj-de-luz);
    margin-top: -1rem;
    margin-bottom: 1.5rem;
    font-style: italic;
}

/* --- Botones --- */
.wizard-actions[b-sz935ckzsx] {
    display: flex;
    justify-content: center;
    margin-top: 2rem;
}

/* [CORRECCIÓN]: Agregado .btn-gold-fill para coincidir con el HTML */
.btn-next[b-sz935ckzsx], .btn-finish[b-sz935ckzsx], .btn-primary-custom[b-sz935ckzsx], .btn-gold-fill[b-sz935ckzsx] {
    width: 100%;
    padding: 0.8rem;
    border-radius: 4px;
    border: none;
    font-family: 'Montserrat', sans-serif;
    font-weight: 700;
    cursor: pointer;
    transition: filter 0.2s ease;
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 0.5rem;
}

.btn-next[b-sz935ckzsx], .btn-primary-custom[b-sz935ckzsx], .btn-gold-fill[b-sz935ckzsx] {
    background-color: var(--color-accent-gold);
    color: #121212;
}

.btn-finish[b-sz935ckzsx] {
    background-color: #198754; /* Verde */
    color: white;
}

    .btn-next:hover[b-sz935ckzsx], .btn-finish:hover[b-sz935ckzsx], .btn-primary-custom:hover[b-sz935ckzsx], .btn-gold-fill:hover[b-sz935ckzsx] {
        filter: brightness(1.1);
    }

.btn-next:disabled[b-sz935ckzsx], .btn-primary-custom:disabled[b-sz935ckzsx], .btn-gold-fill:disabled[b-sz935ckzsx] {
    opacity: 0.7;
    cursor: not-allowed;
}

/* Spinner botón */
.spinner-border-sm[b-sz935ckzsx] {
    width: 1.2rem;
    height: 1.2rem;
    border: 2px solid currentColor;
    border-right-color: transparent;
    border-radius: 50%;
    animation: spin-b-sz935ckzsx 0.75s linear infinite;
}

/* Mensajes Validación */
[b-sz935ckzsx] .validation-message {
    color: #e53e3e;
    font-size: 0.8rem;
    margin-top: 0.2rem;
}

/* Alertas Globales (Top) */
.alert[b-sz935ckzsx] {
    padding: 0.75rem 1rem;
    border-radius: 4px;
    margin-bottom: 1.5rem;
    font-size: 0.9rem;
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.alert-danger[b-sz935ckzsx] {
    background-color: rgba(229, 62, 62, 0.1);
    color: #e53e3e;
    border: 1px solid #e53e3e;
}

.alert-success[b-sz935ckzsx] {
    background-color: rgba(25, 135, 84, 0.1);
    color: #198754;
    border: 1px solid #198754;
}

@keyframes spin-b-sz935ckzsx {
    to {
        transform: rotate(360deg);
    }
}

@keyframes bounce-b-sz935ckzsx {
    0%, 20%, 50%, 80%, 100% {
        transform: translateY(0);
    }

    40% {
        transform: translateY(-20px);
    }

    60% {
        transform: translateY(-10px);
    }
}

.animate-bounce[b-sz935ckzsx] {
    animation: bounce-b-sz935ckzsx 2s infinite;
}
/* _content/ImagineTheFuture.BlazorServer/Shared/PartialViews/RegisterForm.razor.rz.scp.css */
/* RegisterForm.razor.css - Universal Industrial Style */

.auth-form-wrapper[b-a5bmn46m4h] {
    display: flex;
    flex-direction: column;
    gap: 0.8rem;
    animation: fadeIn-b-a5bmn46m4h 0.4s ease-out forwards;
    padding: 0.5rem;
    width: 100%;
}

/* Títulos */
.auth-title[b-a5bmn46m4h] {
    font-size: 1.8rem;
    font-weight: 800;
    color: var(--palette-primary);
    margin-bottom: 0.2rem;
    font-family: 'Montserrat', sans-serif;
    text-align: center;
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

.auth-subtitle[b-a5bmn46m4h] {
    color: var(--palette-gray-mid);
    font-size: 0.9rem;
    font-family: 'Montserrat', sans-serif;
    margin: 0;
    text-align: center;
    opacity: 0.8;
}

/* Botón Google */
.btn-google-tasty[b-a5bmn46m4h] {
    width: 100%;
    background-color: #ffffff;
    color: #3c4043;
    border: 1px solid #ddd;
    border-radius: 2px;
    padding: 2px;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    font-family: 'Roboto', sans-serif;
    font-weight: 500;
    font-size: 1rem;
    cursor: pointer;
    box-shadow: 0 1px 3px rgba(0,0,0,0.1);
    transition: all 0.2s ease;
    height: 44px;
    margin-bottom: 0.5rem;
}

    .btn-google-tasty:hover[b-a5bmn46m4h] {
        box-shadow: 0 2px 8px rgba(0,0,0,0.2);
        background-color: #f8faff;
    }

.google-icon-wrapper[b-a5bmn46m4h] {
    width: 40px;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: white;
    border-radius: 2px;
    margin-right: 12px;
}

    .google-icon-wrapper img[b-a5bmn46m4h] {
        width: 18px;
        height: 18px;
    }

.btn-text[b-a5bmn46m4h] {
    flex-grow: 1;
    text-align: center;
    padding-right: 40px;
}

/* Divisor */
.auth-divider[b-a5bmn46m4h] {
    display: flex;
    align-items: center;
    text-align: center;
    margin: 0.8rem 0;
    color: var(--palette-gray-mid);
    opacity: 0.8;
}

    .auth-divider[b-a5bmn46m4h]::before, .auth-divider[b-a5bmn46m4h]::after {
        content: '';
        flex: 1;
        border-bottom: 1px solid var(--palette-gray-light);
    }

    .auth-divider span[b-a5bmn46m4h] {
        padding: 0 10px;
        font-size: 0.75rem;
        text-transform: uppercase;
        letter-spacing: 0.1em;
        font-weight: 600;
    }

/* Inputs - Aplicamos ::deep para penetrar el EditForm */
[b-a5bmn46m4h] .form-group {
    margin-bottom: 1rem;
}

[b-a5bmn46m4h] label {
    display: block;
    margin-bottom: 0.4rem;
    color: var(--palette-primary);
    font-size: 0.8rem;
    font-weight: 700;
    text-align: left;
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

[b-a5bmn46m4h] .form-control {
    width: 100%;
    padding: 0.75rem 1rem;
    background-color: var(--palette-white);
    border: 1px solid var(--palette-gray-mid);
    border-radius: 2px;
    color: var(--palette-black);
    font-family: 'Montserrat', sans-serif;
    font-size: 1rem;
    transition: all 0.3s ease;
}

    [b-a5bmn46m4h] .form-control:focus {
        border-color: var(--palette-primary);
        background-color: var(--palette-white);
        box-shadow: 0 0 0 1px var(--palette-primary);
        outline: none;
        color: var(--palette-black);
    }

    [b-a5bmn46m4h] .form-control::placeholder {
        color: var(--palette-gray-mid);
        font-size: .9rem;
    }

[b-a5bmn46m4h] .validation-message {
    color: var(--palette-danger);
    font-size: 0.8rem;
    margin-top: 0.25rem;
    font-weight: 600;
}

/* Botón Primario */
[b-a5bmn46m4h] .btn-primary-custom {
    width: 100%;
    padding: 0.9rem;
    border-radius: 2px;
    border: none;
    font-family: 'Montserrat', sans-serif;
    font-weight: 700;
    cursor: pointer;
    background-color: var(--palette-primary);
    color: var(--palette-white);
    font-size: 1rem;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
    box-shadow: 0 4px 10px rgba(0, 163, 224, 0.3);
}

    [b-a5bmn46m4h] .btn-primary-custom:hover {
        background-color: #0088BE;
        transform: translateY(-2px);
    }

    [b-a5bmn46m4h] .btn-primary-custom:disabled {
        opacity: 0.6;
        cursor: not-allowed;
        background-color: var(--palette-gray-mid);
        transform: none;
    }

/* Footer */
.auth-footer[b-a5bmn46m4h] {
    margin-top: 2rem;
}

.text-link[b-a5bmn46m4h] {
    color: var(--palette-primary) !important;
    text-decoration: none;
    cursor: pointer;
}

    .text-link:hover[b-a5bmn46m4h] {
        text-decoration: underline !important;
    }

.auth-footer .text-muted[b-a5bmn46m4h] {
    color: var(--palette-gray-mid) !important;
}

/* Alertas */
.alert[b-a5bmn46m4h] {
    padding: 0.75rem 1rem;
    border-radius: 2px;
    margin-bottom: 1rem;
    font-size: 0.9rem;
}

.alert-danger[b-a5bmn46m4h] {
    background-color: rgba(229, 62, 62, 0.15);
    color: #ff6b6b;
    border: 1px solid #e53e3e;
    border-left: 3px solid #e53e3e;
}

/* Spinner */
.spinner-border-sm[b-a5bmn46m4h] {
    width: 1.2rem;
    height: 1.2rem;
    border: 2px solid rgba(255,255,255,0.3);
    border-top: 2px solid white;
    border-radius: 50%;
    animation: spin-b-a5bmn46m4h 0.75s linear infinite;
    margin-right: 0.5rem;
}

@keyframes spin-b-a5bmn46m4h {
    to {
        transform: rotate(360deg);
    }
}

@keyframes fadeIn-b-a5bmn46m4h {
    from {
        opacity: 0;
        transform: translateY(5px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}
/* _content/ImagineTheFuture.BlazorServer/Shared/PartialViews/ScheduleDayEditPartial.razor.rz.scp.css */
/*
 * ScheduleDayEditPartial.razor.css
 * Estilos para el sub-editor de días (Drill-down) - Industrial Edition
 */

.day-editor-container[b-hz0b5a1tyd] {
    display: flex;
    flex-direction: column;
    height: 100%;
}

/* --- HEADER DEL DÍA --- */
.day-editor-header[b-hz0b5a1tyd] {
    border-bottom: 1px solid #E2E8F0;
    padding-bottom: 1rem;
    margin-bottom: 1.5rem;
}

    .day-editor-header h4[b-hz0b5a1tyd] {
        margin: 0.5rem 0 0 0;
        color: var(--palette-primary);
        font-family: 'Montserrat', sans-serif;
        font-weight: 800;
        font-size: 1.5rem;
        text-transform: uppercase;
        letter-spacing: 0.05em;
    }

.btn-back[b-hz0b5a1tyd] {
    background: none;
    border: none;
    color: #64748B;
    cursor: pointer;
    font-size: 0.85rem;
    font-weight: 700;
    padding: 0;
    display: flex;
    align-items: center;
    gap: 0.4rem;
    text-transform: uppercase;
    transition: color 0.2s ease;
}

    .btn-back:hover[b-hz0b5a1tyd] {
        color: var(--palette-primary);
    }

/* --- CUERPO DEL EDITOR --- */
.day-editor-body[b-hz0b5a1tyd] {
    flex-grow: 1;
    display: flex;
    flex-direction: column;
}

/* --- TOGGLE SWITCH (Activo/Descanso) --- */
.toggle-wrapper[b-hz0b5a1tyd] {
    display: flex;
    align-items: center;
    gap: 1rem;
    background-color: #F8FAFC;
    padding: 1rem;
    border: 1px solid #E2E8F0;
    border-radius: 4px;
}

.toggle-switch[b-hz0b5a1tyd] {
    position: relative;
    display: inline-block;
    width: 50px;
    height: 26px;
}

    .toggle-switch input[b-hz0b5a1tyd] {
        opacity: 0;
        width: 0;
        height: 0;
    }

.slider[b-hz0b5a1tyd] {
    position: absolute;
    cursor: pointer;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: #CBD5E1;
    transition: .3s;
    border-radius: 26px;
}

    .slider[b-hz0b5a1tyd]:before {
        position: absolute;
        content: "";
        height: 18px;
        width: 18px;
        left: 4px;
        bottom: 4px;
        background-color: white;
        transition: .3s;
        border-radius: 50%;
        box-shadow: 0 2px 4px rgba(0,0,0,0.2);
    }

input:checked + .slider[b-hz0b5a1tyd] {
    background-color: #10B981; /* Verde de éxito */
}

    input:checked + .slider[b-hz0b5a1tyd]:before {
        transform: translateX(24px);
    }

.toggle-label[b-hz0b5a1tyd] {
    font-weight: 800;
    font-size: 0.95rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    transition: color 0.3s;
}

.text-primary[b-hz0b5a1tyd] {
    color: var(--palette-primary);
}

.text-muted[b-hz0b5a1tyd] {
    color: #94A3B8;
}

/* --- GRUPOS DE CONFIGURACIÓN --- */
.config-group[b-hz0b5a1tyd] {
    background-color: #F8FAFC;
    border: 1px solid #E2E8F0;
    padding: 1.5rem;
    border-radius: 4px;
    margin-bottom: 1.5rem;
    box-shadow: 0 2px 5px rgba(0,0,0,0.02);
}

.group-title[b-hz0b5a1tyd] {
    margin: 0 0 1rem 0;
    font-size: 0.9rem;
    font-weight: 800;
    color: var(--employee-text-main);
    text-transform: uppercase;
    border-bottom: 1px solid #E2E8F0;
    padding-bottom: 0.5rem;
    letter-spacing: 0.05em;
}

    .group-title i[b-hz0b5a1tyd] {
        color: var(--palette-primary);
        margin-right: 0.5rem;
    }

/* Formularios internos */
.grid-2[b-hz0b5a1tyd] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1.5rem;
}

.form-group[b-hz0b5a1tyd] {
    margin-bottom: 0; /* Controlado por el grid en su mayoría */
}

[b-hz0b5a1tyd] label {
    display: block;
    margin-bottom: 0.4rem;
    font-weight: 700;
    font-size: 0.75rem;
    color: var(--employee-text-secondary);
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

[b-hz0b5a1tyd] .form-control {
    width: 100%;
    padding: 0.7rem 1rem;
    border: 1px solid #CBD5E1;
    border-radius: 2px;
    background-color: #FFFFFF;
    color: #1E293B;
    font-size: 1rem;
    font-family: 'Consolas', monospace; /* Monospace para números y tiempos */
    transition: all 0.2s;
    font-weight: 600;
}

    [b-hz0b5a1tyd] .form-control:focus {
        border-color: var(--palette-primary);
        box-shadow: 0 0 0 3px rgba(0, 163, 224, 0.1);
        outline: none;
    }

/* Casillas de verificación inline */
.check-inline[b-hz0b5a1tyd] {
    display: flex;
    align-items: center;
    gap: 0.6rem;
    background-color: #FFFFFF;
    padding: 0.8rem;
    border: 1px solid #E2E8F0;
    border-radius: 2px;
}

    .check-inline input[type="checkbox"][b-hz0b5a1tyd] {
        width: 1.2rem;
        height: 1.2rem;
        accent-color: var(--palette-primary);
        cursor: pointer;
    }

    .check-inline label[b-hz0b5a1tyd] {
        margin: 0;
        text-transform: none;
        font-weight: 600;
        font-size: 0.85rem;
        color: var(--employee-text-main);
        letter-spacing: normal;
        cursor: pointer;
    }

.help-text-dark[b-hz0b5a1tyd] {
    display: block;
    font-size: 0.75rem;
    color: #64748B;
    margin-top: 0.5rem;
    font-style: italic;
}

/* --- BOTÓN MÁGICO (CLONAR) --- */
.magic-action-box[b-hz0b5a1tyd] {
    background-color: #F0F9FF;
    border: 1px dashed #7DD3FC;
    border-radius: 4px;
    padding: 1.5rem;
    display: flex;
    gap: 1.5rem;
    align-items: center;
    color: #0369A1;
    margin-top: 1rem;
    transition: background-color 0.2s;
}

    .magic-action-box:hover[b-hz0b5a1tyd] {
        background-color: #E0F2FE;
    }

    .magic-action-box i[b-hz0b5a1tyd] {
        font-size: 2.5rem;
        color: var(--palette-primary);
    }

.magic-content strong[b-hz0b5a1tyd] {
    display: block;
    font-size: 0.95rem;
    margin-bottom: 0.2rem;
    font-weight: 800;
    text-transform: uppercase;
}

.magic-content p[b-hz0b5a1tyd] {
    margin: 0 0 0.8rem 0;
    font-size: 0.85rem;
    color: #0C4A6E;
}

.btn-link[b-hz0b5a1tyd] {
    background-color: var(--palette-primary);
    color: white;
    border: none;
    font-weight: 700;
    padding: 0.6rem 1.2rem;
    border-radius: 2px;
    cursor: pointer;
    font-size: 0.8rem;
    text-transform: uppercase;
    box-shadow: 0 2px 5px rgba(0, 163, 224, 0.3);
    transition: background-color 0.2s;
}

    .btn-link:hover[b-hz0b5a1tyd] {
        background-color: #0088BE;
    }

/* --- ESTADO VACÍO (DÍA LIBRE) --- */
.empty-state-card[b-hz0b5a1tyd] {
    background-color: #F8FAFC;
    border: 2px dashed #CBD5E1;
    border-radius: 4px;
    padding: 4rem 2rem;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}

    .empty-state-card p[b-hz0b5a1tyd] {
        font-size: 1rem;
        font-weight: 600;
    }

/* --- FOOTER DEL SUB-EDITOR --- */
.day-editor-footer[b-hz0b5a1tyd] {
    margin-top: 2rem;
    padding-top: 1.5rem;
    border-top: 1px solid #E2E8F0;
}

.btn-save-day[b-hz0b5a1tyd] {
    width: 100%;
    background-color: var(--palette-primary);
    color: white;
    border: none;
    padding: 1rem;
    border-radius: 4px;
    font-weight: 800;
    font-size: 1rem;
    text-transform: uppercase;
    cursor: pointer;
    box-shadow: 0 4px 15px rgba(0,163,224,0.3);
    transition: all 0.2s ease;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
}

    .btn-save-day:hover[b-hz0b5a1tyd] {
        background-color: #0088BE;
        transform: translateY(-2px);
        box-shadow: 0 6px 20px rgba(0,163,224,0.4);
    }

/* --- ANIMACIONES --- */
.animate-fade-in[b-hz0b5a1tyd] {
    animation: fadeIn-b-hz0b5a1tyd 0.3s ease-out;
}

@keyframes fadeIn-b-hz0b5a1tyd {
    from {
        opacity: 0;
        transform: translateY(10px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* --- RESPONSIVIDAD --- */
@media (max-width: 640px) {
    .grid-2[b-hz0b5a1tyd] {
        grid-template-columns: 1fr;
        gap: 1rem;
    }

    .magic-action-box[b-hz0b5a1tyd] {
        flex-direction: column;
        text-align: center;
        gap: 1rem;
    }
}
/* _content/ImagineTheFuture.BlazorServer/Shared/PartialViews/ScheduleManagerPartial.razor.rz.scp.css */
/*
 * ScheduleManagerPartial.razor.css
 * Estilos aislados para la vista maestra de Plantillas de Horario (Tarjetas)
 */

.partial-container[b-r1yydqlfbz] {
    padding: 1rem 0;
}

/* --- ACCIONES SUPERIORES --- */
.partial-actions[b-r1yydqlfbz] {
    display: flex;
    justify-content: flex-end;
    margin-bottom: 1.5rem;
}

.btn-create[b-r1yydqlfbz] {
    background-color: var(--palette-primary);
    color: white;
    border: none;
    padding: 0.6rem 1.2rem;
    border-radius: 2px; /* Borde recto técnico */
    font-family: 'Montserrat', sans-serif;
    font-weight: 700;
    text-transform: uppercase;
    cursor: pointer;
    display: flex;
    gap: 0.5rem;
    align-items: center;
    box-shadow: 0 4px 10px rgba(0, 163, 224, 0.3);
    transition: all 0.2s ease;
    font-size: 0.85rem;
}

    .btn-create:hover[b-r1yydqlfbz] {
        background-color: #0088BE;
        transform: translateY(-1px);
    }

/* --- GRID DE TARJETAS --- */
.cards-grid[b-r1yydqlfbz] {
    display: grid;
    /* Grid responsivo automático */
    grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
    gap: 1.5rem;
}

.op-card[b-r1yydqlfbz] {
    background-color: #FFFFFF;
    border: 1px solid var(--employee-border, #E2E8F0);
    border-radius: 4px;
    padding: 1.5rem;
    display: flex;
    gap: 1rem;
    align-items: center;
    box-shadow: var(--employee-shadow, 0 2px 10px rgba(0,0,0,0.05));
    transition: all 0.2s ease;
}

    .op-card:hover[b-r1yydqlfbz] {
        border-color: var(--palette-primary);
        transform: translateY(-2px);
        box-shadow: 0 8px 20px rgba(0, 163, 224, 0.1);
    }

.card-icon[b-r1yydqlfbz] {
    width: 50px;
    height: 50px;
    border-radius: 50%;
    background-color: #F0F9FF; /* Tinte azul muy suave */
    color: var(--palette-primary);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.5rem;
    flex-shrink: 0;
}

.card-info[b-r1yydqlfbz] {
    flex-grow: 1;
    overflow: hidden;
}

    .card-info h4[b-r1yydqlfbz] {
        margin: 0;
        font-family: 'Montserrat', sans-serif;
        font-size: 1rem;
        font-weight: 700;
        color: var(--employee-text-main, #1E293B);
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
        text-transform: uppercase;
    }

    .card-info p[b-r1yydqlfbz] {
        margin: 0.3rem 0;
        font-size: 0.85rem;
        color: var(--employee-text-secondary, #64748B);
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
    }

.badge-count[b-r1yydqlfbz] {
    display: inline-block;
    font-size: 0.75rem;
    background-color: #F1F5F9;
    padding: 2px 6px;
    border-radius: 2px;
    color: #475569;
    font-weight: 600;
    margin-top: 0.3rem;
}

/* --- ACCIONES DE TARJETA --- */
.card-actions[b-r1yydqlfbz] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.btn-icon[b-r1yydqlfbz] {
    background: transparent;
    border: 1px solid transparent;
    color: #94A3B8;
    cursor: pointer;
    transition: all 0.2s ease;
    width: 32px;
    height: 32px;
    border-radius: 2px;
    display: flex;
    align-items: center;
    justify-content: center;
}

    .btn-icon:hover[b-r1yydqlfbz] {
        background-color: rgba(0, 163, 224, 0.1);
        color: var(--palette-primary);
        border-color: var(--palette-primary);
    }

    .btn-icon.danger:hover[b-r1yydqlfbz] {
        background-color: rgba(229, 62, 62, 0.1);
        color: var(--palette-danger);
        border-color: var(--palette-danger);
    }

/* --- ESTADO VACÍO --- */
.empty-state-card[b-r1yydqlfbz] {
    grid-column: 1 / -1; /* Ocupar todo el ancho disponible */
    background-color: #F8FAFC;
    border: 2px dashed #CBD5E1;
    border-radius: 4px;
    padding: 4rem 2rem;
    text-align: center;
    color: #94A3B8;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}

    .empty-state-card i[b-r1yydqlfbz] {
        font-size: 3rem;
        margin-bottom: 1rem;
        opacity: 0.5;
    }

    .empty-state-card p[b-r1yydqlfbz] {
        margin: 0;
        font-family: 'Montserrat', sans-serif;
        font-weight: 500;
    }

/* --- ANIMACIONES --- */
.animate-fade-in[b-r1yydqlfbz] {
    animation: fadeIn-b-r1yydqlfbz 0.4s ease-out forwards;
}

@keyframes fadeIn-b-r1yydqlfbz {
    from {
        opacity: 0;
        transform: translateY(10px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}
/* _content/ImagineTheFuture.BlazorServer/Shared/PartialViews/ScheduleTemplateEditorPartial.razor.rz.scp.css */
/*
 * ScheduleTemplateEditorPartial.razor.css
 * Slide-over Panel & Day Editor - Industrial Edition
 */

/* --- SLIDE-OVER PANEL (FONDO Y CONTENEDOR) --- */
.slideover-backdrop[b-ziyfrajik1] {
    position: fixed;
    inset: 0;
    background-color: rgba(15, 23, 42, 0.7); /* Oscuro técnico */
    backdrop-filter: blur(3px);
    z-index: 2000;
}

.slideover-panel[b-ziyfrajik1] {
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    width: 100%;
    max-width: 600px; /* Ancho cómodo para el editor */
    background-color: #FFFFFF;
    z-index: 2010;
    box-shadow: -10px 0 40px rgba(0,0,0,0.2);
    display: flex;
    flex-direction: column;
    border-left: 1px solid var(--employee-border);
}

/* --- HEADER DEL PANEL --- */
.slideover-header[b-ziyfrajik1] {
    padding: 1.5rem 2rem;
    border-bottom: 1px solid #E2E8F0;
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    background-color: #F8FAFC;
    flex-shrink: 0;
}

    .slideover-header h3[b-ziyfrajik1] {
        margin: 0;
        font-family: 'Montserrat', sans-serif;
        font-weight: 800;
        color: var(--employee-text-main);
        font-size: 1.5rem;
        text-transform: uppercase;
    }

    .slideover-header .subtitle[b-ziyfrajik1] {
        font-size: 0.75rem;
        font-weight: 700;
        color: var(--palette-primary);
        letter-spacing: 0.1em;
        margin-bottom: 0.3rem;
        display: block;
    }

.btn-close-icon[b-ziyfrajik1] {
    background: none;
    border: none;
    font-size: 1.5rem;
    color: #94A3B8;
    cursor: pointer;
    transition: color 0.2s;
    padding: 0;
}

    .btn-close-icon:hover[b-ziyfrajik1] {
        color: var(--palette-danger);
    }

/* --- CUERPO DEL PANEL --- */
.slideover-body[b-ziyfrajik1] {
    flex-grow: 1;
    padding: 2rem;
    overflow-y: auto;
    background-color: #FFFFFF;
    /* Scrollbar técnica */
    scrollbar-width: thin;
    scrollbar-color: #CBD5E1 transparent;
}

/* --- FORMULARIOS BASE --- */
.form-section[b-ziyfrajik1] {
    margin-bottom: 2rem;
}

    .form-section h5[b-ziyfrajik1] {
        margin: 0 0 1rem 0;
        font-size: 1rem;
        color: var(--employee-text-main);
        font-weight: 700;
        text-transform: uppercase;
        border-bottom: 1px solid #F1F5F9;
        padding-bottom: 0.5rem;
    }

.section-help[b-ziyfrajik1] {
    font-size: 0.85rem;
    color: var(--employee-text-secondary);
    margin-bottom: 1.5rem;
}

.form-group[b-ziyfrajik1] {
    margin-bottom: 1.25rem;
}

.mt-4[b-ziyfrajik1] {
    margin-top: 2rem;
}

[b-ziyfrajik1] label {
    display: block;
    font-size: 0.75rem;
    font-weight: 700;
    color: var(--employee-text-secondary);
    text-transform: uppercase;
    margin-bottom: 0.4rem;
}

[b-ziyfrajik1] .form-control {
    width: 100%;
    padding: 0.7rem 1rem;
    border: 1px solid #CBD5E1;
    border-radius: 4px;
    background-color: #FFFFFF;
    color: #1E293B;
    font-size: 0.95rem;
    font-family: 'Montserrat', sans-serif;
    transition: all 0.2s;
}

    [b-ziyfrajik1] .form-control:focus {
        border-color: var(--palette-primary);
        outline: none;
        box-shadow: 0 0 0 3px rgba(0, 163, 224, 0.1);
    }

/* --- WEEK GRID (TARJETAS DE DÍAS) --- */
.week-grid[b-ziyfrajik1] {
    display: grid;
    /* Apilable responsivo dentro del panel */
    grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
    gap: 1rem;
}

.day-card[b-ziyfrajik1] {
    border: 1px solid #E2E8F0;
    border-radius: 4px;
    padding: 1rem;
    display: flex;
    flex-direction: column;
    cursor: pointer;
    transition: all 0.2s;
    position: relative;
    overflow: hidden;
}

    .day-card:hover[b-ziyfrajik1] {
        border-color: var(--palette-primary);
        box-shadow: 0 4px 12px rgba(0,0,0,0.05);
        transform: translateY(-2px);
    }

    .day-card.active[b-ziyfrajik1] {
        background-color: #FFFFFF;
        border-left: 3px solid var(--palette-primary);
    }

    .day-card.inactive[b-ziyfrajik1] {
        background-color: #F8FAFC;
        border-style: dashed;
        opacity: 0.8;
    }

.day-header[b-ziyfrajik1] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 0.8rem;
}

.day-name[b-ziyfrajik1] {
    font-weight: 800;
    color: var(--employee-text-main);
    font-size: 1rem;
}

.icon-off[b-ziyfrajik1] {
    color: #94A3B8;
    font-size: 1.2rem;
}

.time-block[b-ziyfrajik1] {
    display: flex;
    flex-direction: column;
    margin-bottom: 0.5rem;
}

    .time-block .label[b-ziyfrajik1] {
        font-size: 0.65rem;
        text-transform: uppercase;
        color: var(--employee-text-secondary);
        font-weight: 700;
    }

    .time-block .value[b-ziyfrajik1] {
        font-size: 1.1rem;
        font-family: 'Consolas', monospace;
        font-weight: 700;
        color: var(--palette-primary);
    }

    .time-block.sub .value[b-ziyfrajik1] {
        font-size: 0.8rem;
        font-family: 'Montserrat', sans-serif;
        color: var(--employee-text-secondary);
        font-weight: 500;
    }

.status-off[b-ziyfrajik1] {
    font-size: 0.9rem;
    color: #64748B;
    font-style: italic;
    font-weight: 600;
}

/* Hover Overlay para indicar edición */
.edit-overlay[b-ziyfrajik1] {
    position: absolute;
    inset: 0;
    background: rgba(0, 163, 224, 0.9);
    color: white;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    font-weight: 700;
    text-transform: uppercase;
    opacity: 0;
    transition: opacity 0.2s;
    backdrop-filter: blur(2px);
}

.day-card:hover .edit-overlay[b-ziyfrajik1] {
    opacity: 1;
}

/* --- FOOTER DEL PANEL --- */
.slideover-footer[b-ziyfrajik1] {
    padding: 1.5rem 2rem;
    border-top: 1px solid #E2E8F0;
    background-color: #F8FAFC;
    display: flex;
    justify-content: flex-end;
    gap: 1rem;
    flex-shrink: 0;
}

/* Botones genéricos Footer */
.btn-save[b-ziyfrajik1] {
    background-color: var(--palette-primary);
    color: white;
    border: none;
    padding: 0.8rem 1.5rem;
    border-radius: 2px;
    font-weight: 700;
    text-transform: uppercase;
    cursor: pointer;
    transition: background-color 0.2s;
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

    .btn-save:hover:not(:disabled)[b-ziyfrajik1] {
        background-color: #0088BE;
    }

    .btn-save:disabled[b-ziyfrajik1] {
        opacity: 0.6;
        cursor: not-allowed;
    }

.btn-cancel[b-ziyfrajik1] {
    background: transparent;
    color: var(--palette-gray-mid);
    border: 1px solid var(--palette-gray-mid);
    padding: 0.8rem 1.5rem;
    border-radius: 2px;
    cursor: pointer;
    font-weight: 700;
    text-transform: uppercase;
    transition: all 0.2s;
}

    .btn-cancel:hover[b-ziyfrajik1] {
        background: #F1F5F9;
        color: var(--employee-text-main);
    }

/* --- ANIMACIONES --- */
.animate-fade-in[b-ziyfrajik1] {
    animation: fadeIn-b-ziyfrajik1 0.3s ease-out;
}

.animate-slide-in-right[b-ziyfrajik1] {
    animation: slideInRight-b-ziyfrajik1 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

@keyframes fadeIn-b-ziyfrajik1 {
    from {
        opacity: 0;
    }

    to {
        opacity: 1;
    }
}

@keyframes slideInRight-b-ziyfrajik1 {
    from {
        transform: translateX(100%);
    }

    to {
        transform: translateX(0);
    }
}

/* Spinner */
.spinner-border[b-ziyfrajik1] {
    width: 1rem;
    height: 1rem;
    border: 2px solid rgba(255,255,255,0.3);
    border-top: 2px solid white;
    border-radius: 50%;
    animation: spin-b-ziyfrajik1 0.8s linear infinite;
}

@keyframes spin-b-ziyfrajik1 {
    to {
        transform: rotate(360deg);
    }
}

/* Responsive para pantallas muy pequeñas */
@media (max-width: 640px) {
    .slideover-panel[b-ziyfrajik1] {
        max-width: 100%; /* Ocupa toda la pantalla en móviles */
    }

    .slideover-header[b-ziyfrajik1], .slideover-footer[b-ziyfrajik1] {
        padding: 1rem 1.5rem;
    }

    .slideover-body[b-ziyfrajik1] {
        padding: 1.5rem;
    }
}
/* _content/ImagineTheFuture.BlazorServer/Shared/PartialViews/TeamMembersManager.razor.rz.scp.css */
/*
 * TeamMembersManager.razor.css
 * Industrial Edition
 */

.members-manager-container[b-ghf8cunoty] {
    background-color: rgba(255, 255, 255, 0.02);
    border: 1px solid var(--palette-gray-dark);
    border-radius: 4px;
    padding: 1.5rem;
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
}

/* Header */
.manager-header[b-ghf8cunoty] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    border-bottom: 1px solid var(--palette-gray-dark);
    padding-bottom: 0.5rem;
}

    .manager-header h5[b-ghf8cunoty] {
        margin: 0;
        font-family: 'Montserrat', sans-serif;
        color: var(--palette-primary);
        text-transform: uppercase;
        font-size: 0.9rem;
        font-weight: 700;
        letter-spacing: 0.05em;
    }

.badge-count[b-ghf8cunoty] {
    font-size: 0.75rem;
    color: var(--palette-gray-light);
    background-color: rgba(255, 255, 255, 0.05);
    padding: 2px 8px;
    border-radius: 2px;
}

/* Formulario de Agregar */
.add-member-form[b-ghf8cunoty] {
    display: flex;
    flex-direction: column;
}

.input-group[b-ghf8cunoty] {
    display: flex;
    gap: 0.5rem;
}

.form-control[b-ghf8cunoty] {
    flex-grow: 1;
    padding: 0.6rem 1rem;
    background-color: rgba(0, 0, 0, 0.3);
    border: 1px solid var(--palette-gray-mid);
    border-radius: 2px;
    color: var(--palette-white);
    font-size: 0.9rem;
    /* Flecha select custom */
    appearance: none;
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%2300A3E0' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M2 5l6 6 6-6'/%3e%3c/svg%3e");
    background-repeat: no-repeat;
    background-position: right 1rem center;
    background-size: 12px;
}

    .form-control:focus[b-ghf8cunoty] {
        border-color: var(--palette-primary);
        outline: none;
        box-shadow: 0 0 0 1px var(--palette-primary);
    }

.btn-add[b-ghf8cunoty] {
    background-color: var(--palette-gray-darker);
    border: 1px solid var(--palette-primary);
    color: var(--palette-primary);
    padding: 0 1.2rem;
    border-radius: 2px;
    cursor: pointer;
    font-weight: 600;
    text-transform: uppercase;
    font-size: 0.8rem;
    transition: all 0.2s;
}

    .btn-add:hover:not(:disabled)[b-ghf8cunoty] {
        background-color: var(--palette-primary);
        color: white;
    }

    .btn-add:disabled[b-ghf8cunoty] {
        opacity: 0.5;
        cursor: not-allowed;
        border-color: var(--palette-gray-mid);
        color: var(--palette-gray-mid);
    }

/* Lista */
.members-list[b-ghf8cunoty] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    max-height: 300px;
    overflow-y: auto;
    padding-right: 0.5rem;
}
    /* Scrollbar */
    .members-list[b-ghf8cunoty]::-webkit-scrollbar {
        width: 4px;
    }

    .members-list[b-ghf8cunoty]::-webkit-scrollbar-thumb {
        background: var(--palette-gray-mid);
        border-radius: 2px;
    }

.member-card[b-ghf8cunoty] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    background-color: rgba(255, 255, 255, 0.03);
    padding: 0.8rem 1rem;
    border-radius: 2px;
    border-left: 2px solid transparent;
    transition: background-color 0.2s;
}

    .member-card:hover[b-ghf8cunoty] {
        background-color: rgba(255, 255, 255, 0.06);
        border-left-color: var(--palette-primary);
    }

.member-info[b-ghf8cunoty] {
    display: flex;
    align-items: center;
    gap: 0.8rem;
    color: var(--palette-soft-white);
    font-size: 0.9rem;
}

    .member-info i[b-ghf8cunoty] {
        color: var(--palette-gray-light);
    }

.btn-icon-remove[b-ghf8cunoty] {
    background: transparent;
    border: none;
    color: var(--palette-gray-light);
    cursor: pointer;
    font-size: 0.9rem;
    transition: color 0.2s;
    padding: 0.4rem;
}

    .btn-icon-remove:hover[b-ghf8cunoty] {
        color: var(--palette-danger);
    }

    .btn-icon-remove:disabled[b-ghf8cunoty] {
        opacity: 0.5;
        cursor: default;
    }

/* Utils */
.text-muted[b-ghf8cunoty] {
    color: var(--palette-gray-mid);
    font-style: italic;
}

.local-loader[b-ghf8cunoty] {
    color: var(--palette-primary);
    text-align: center;
    font-size: 0.9rem;
    padding: 1rem;
}
/* _content/ImagineTheFuture.BlazorServer/Shared/PartialViews/TeamTacticalPanel.razor.rz.scp.css */
/*
 * TeamTacticalPanel.razor.css
 * Panel Lateral Táctico - Industrial Edition
 */

.tactical-side-panel[b-waozyfrhd8] {
    position: absolute;
    top: 0;
    right: -360px; /* Escondido a la derecha por defecto */
    width: 360px;
    height: 100%;
    background-color: #FFFFFF;
    border-left: 1px solid var(--employee-border);
    box-shadow: -4px 0 15px rgba(0,0,0,0.05);
    transition: right 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    display: flex;
    flex-direction: column;
    z-index: 20;
}

    /* Estado Activo */
    .tactical-side-panel.open[b-waozyfrhd8] {
        right: 0;
    }

/* --- HEADER --- */
.panel-header[b-waozyfrhd8] {
    padding: 1.5rem;
    border-bottom: 1px solid var(--employee-border);
    position: relative;
    background-color: #F8FAFC;
    flex-shrink: 0;
}

.btn-close-panel[b-waozyfrhd8] {
    position: absolute;
    top: 1rem;
    right: 1rem;
    background: none;
    border: none;
    font-size: 1.2rem;
    color: #94A3B8;
    cursor: pointer;
    transition: color 0.2s;
}

    .btn-close-panel:hover[b-waozyfrhd8] {
        color: #DC2626;
    }

.panel-header h3[b-waozyfrhd8] {
    margin: 0 0 0.5rem 0;
    font-size: 1.2rem;
    font-weight: 800;
    color: var(--palette-primary);
    text-transform: uppercase;
}

.leader-subtitle[b-waozyfrhd8] {
    margin: 0;
    font-size: 0.85rem;
    color: #64748B;
    font-weight: 600;
    display: flex;
    align-items: center;
    gap: 0.4rem;
}

    .leader-subtitle i[b-waozyfrhd8] {
        color: #F59E0B;
    }

/* --- ACCIONES (BOTONES GRANDES) --- */
.panel-actions[b-waozyfrhd8] {
    padding: 1rem 1.5rem;
    display: flex;
    gap: 0.5rem;
    border-bottom: 1px solid var(--employee-border);
    flex-shrink: 0;
}

.btn-action[b-waozyfrhd8] {
    flex: 1;
    padding: 0.8rem 0.5rem;
    border: none;
    border-radius: 4px;
    font-size: 0.85rem;
    font-weight: 700;
    cursor: pointer;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.3rem;
    transition: all 0.2s;
    color: white;
    text-transform: uppercase;
}

    .btn-action i[b-waozyfrhd8] {
        font-size: 1.2rem;
    }

    .btn-action:disabled[b-waozyfrhd8] {
        opacity: 0.6;
        cursor: not-allowed;
        filter: grayscale(100%);
    }

.btn-schedule[b-waozyfrhd8] {
    background-color: #0EA5E9;
}

    .btn-schedule:hover:not(:disabled)[b-waozyfrhd8] {
        background-color: #0284C7;
        transform: translateY(-1px);
        box-shadow: 0 4px 10px rgba(14, 165, 233, 0.3);
    }

.btn-worksite[b-waozyfrhd8] {
    background-color: #10B981;
}

    .btn-worksite:hover:not(:disabled)[b-waozyfrhd8] {
        background-color: #059669;
        transform: translateY(-1px);
        box-shadow: 0 4px 10px rgba(16, 185, 129, 0.3);
    }

/* --- SECCIÓN DE MIEMBROS --- */
.panel-members-section[b-waozyfrhd8] {
    flex: 1;
    overflow-y: auto;
    padding: 1.5rem;
    scrollbar-width: thin;
    scrollbar-color: #CBD5E1 transparent;
}

    .panel-members-section h4[b-waozyfrhd8] {
        font-size: 0.95rem;
        margin: 0 0 1rem 0;
        color: #334155;
        border-bottom: 2px solid var(--employee-border);
        padding-bottom: 0.5rem;
        text-transform: uppercase;
        font-weight: 700;
    }

.empty-members[b-waozyfrhd8] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    color: #94A3B8;
    text-align: center;
    padding-top: 3rem;
}

    .empty-members i[b-waozyfrhd8] {
        font-size: 3rem;
        margin-bottom: 1rem;
        opacity: 0.5;
    }

    .empty-members p[b-waozyfrhd8] {
        font-style: italic;
        font-size: 0.9rem;
        margin: 0;
    }

.members-list[b-waozyfrhd8] {
    display: flex;
    flex-direction: column;
    gap: 0.8rem;
}

.member-item[b-waozyfrhd8] {
    display: flex;
    align-items: center;
    gap: 0.8rem;
    padding: 0.8rem;
    border: 1px solid var(--employee-border);
    border-radius: 6px;
    background-color: white;
    transition: border-color 0.2s;
}

    .member-item:hover[b-waozyfrhd8] {
        border-color: var(--palette-primary);
        background-color: #F8FAFC;
    }

.member-avatar[b-waozyfrhd8] {
    width: 36px;
    height: 36px;
    border-radius: 50%;
    background-color: #E0F2FE;
    color: #0369A1;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 800;
    font-size: 1.1rem;
    flex-shrink: 0;
}

.member-info[b-waozyfrhd8] {
    flex: 1;
    display: flex;
    flex-direction: column;
    overflow: hidden;
}

.member-name[b-waozyfrhd8] {
    font-size: 0.9rem;
    font-weight: 700;
    color: #1E293B;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.member-position[b-waozyfrhd8] {
    font-size: 0.75rem;
    color: #64748B;
}

.member-tools[b-waozyfrhd8] {
    flex-shrink: 0;
}

.btn-icon-tool[b-waozyfrhd8] {
    background: none;
    border: none;
    color: #94A3B8;
    cursor: pointer;
    padding: 0.4rem;
    border-radius: 4px;
    transition: all 0.2s;
}

    .btn-icon-tool:hover[b-waozyfrhd8] {
        background-color: #F1F5F9;
        color: var(--palette-primary);
    }

/* --- RESPONSIVE --- */
@media (max-width: 900px) {
    .tactical-side-panel[b-waozyfrhd8] {
        right: -100%; /* Totalmente oculto en móvil */
        width: 100%; /* Ocupa toda la pantalla en móvil */
        border-left: none;
    }
}
/* _content/ImagineTheFuture.BlazorServer/Shared/PartialViews/TeamTreeNode.razor.rz.scp.css */
/*
 * TeamTreeNode.razor.css
 * Motor Visual del Organigrama y Diseño de Tarjeta (Industrial Edition)
 */

.tree-node-wrapper[b-15cd4awgev] {
    display: flex;
    flex-direction: column;
    align-items: center;
    position: relative;
    padding-top: 20px;
}

.tree-children[b-15cd4awgev] {
    display: flex;
    justify-content: center;
    padding-top: 20px;
    position: relative;
}

    /* =========================================================
   LA MAGIA DEL ÁRBOL (FLEX-TREE LÍNEAS CONECTORAS)
   ========================================================= */

    /* Línea vertical que baja del padre hacia los hijos */
    .tree-children[b-15cd4awgev]::before {
        content: '';
        position: absolute;
        top: 0;
        left: 50%;
        width: 0;
        height: 20px;
        border-left: 2px solid #CBD5E1; /* Gris técnico */
    }

/* Líneas horizontales sobre cada hijo */
.tree-node-wrapper[b-15cd4awgev]::before, .tree-node-wrapper[b-15cd4awgev]::after {
    content: '';
    position: absolute;
    top: 0;
    right: 50%;
    border-top: 2px solid #CBD5E1;
    width: 50%;
    height: 20px;
}

.tree-node-wrapper[b-15cd4awgev]::after {
    right: auto;
    left: 50%;
    border-left: 2px solid #CBD5E1; /* La gotita vertical que conecta con la tarjeta */
}

/* Limpieza de bordes extremos (No dibujar líneas sobrantes a los lados) */
.tree-children > .tree-node-wrapper:first-child[b-15cd4awgev]::before,
.tree-children > .tree-node-wrapper:last-child[b-15cd4awgev]::after {
    border: 0 none;
}

/* Si un nodo es hijo único, no necesita las ramas horizontales */
.tree-children > .tree-node-wrapper:only-child[b-15cd4awgev]::before,
.tree-children > .tree-node-wrapper:only-child[b-15cd4awgev]::after {
    display: none;
}

.tree-children > .tree-node-wrapper:only-child[b-15cd4awgev] {
    padding-top: 0;
}

/* =========================================================
   LA TARJETA DEL NODO (TEAM CARD)
   ========================================================= */

.team-card[b-15cd4awgev] {
    background: white;
    border: 1px solid #CBD5E1;
    border-radius: 6px;
    width: 220px;
    box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.05);
    cursor: pointer;
    transition: all 0.2s ease;
    position: relative;
    z-index: 2; /* Para estar por encima de las líneas */
    margin: 0 10px; /* Margen de respiro lateral entre nodos hermanos */
}

    .team-card:hover[b-15cd4awgev] {
        transform: translateY(-3px);
        box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1);
        border-color: #94A3B8;
    }

    .team-card.selected[b-15cd4awgev] {
        border-color: var(--palette-primary);
        box-shadow: 0 0 0 3px rgba(0, 163, 224, 0.2);
    }

.team-card-header[b-15cd4awgev] {
    background-color: #F1F5F9;
    padding: 0.8rem;
    border-radius: 5px 5px 0 0;
    border-bottom: 1px solid #E2E8F0;
    text-align: center;
    transition: background-color 0.2s, color 0.2s;
}

.team-card.selected .team-card-header[b-15cd4awgev] {
    background-color: var(--palette-primary);
    color: white;
}

.team-name[b-15cd4awgev] {
    margin: 0;
    font-size: 0.95rem;
    font-weight: 700;
}

.team-card-body[b-15cd4awgev] {
    padding: 1rem;
    text-align: center;
}

.leader-info[b-15cd4awgev] {
    font-size: 0.85rem;
    color: #475569;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.3rem;
}

    .leader-info i[b-15cd4awgev] {
        color: #94A3B8;
        font-size: 1.2rem;
    }

.team-card-footer[b-15cd4awgev] {
    padding: 0.8rem;
    border-top: 1px solid #E2E8F0;
    display: flex;
    justify-content: space-between;
    align-items: center;
    background-color: #F8FAFC;
    border-radius: 0 0 5px 5px;
}

.member-badge[b-15cd4awgev] {
    background-color: #E0F2FE;
    color: #0369A1;
    font-size: 0.75rem;
    font-weight: 700;
    padding: 0.3rem 0.6rem;
    border-radius: 12px;
}

.btn-add-child[b-15cd4awgev] {
    background: none;
    border: none;
    color: #94A3B8;
    cursor: pointer;
    border-radius: 50%;
    width: 24px;
    height: 24px;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.2s;
}

    .btn-add-child:hover[b-15cd4awgev] {
        background-color: #E2E8F0;
        color: #334155;
    }
/* _content/ImagineTheFuture.BlazorServer/Shared/PartialViews/ThumbnailViewer.razor.rz.scp.css */
/*
 * ThumbnailViewer.razor.css
 */

/* Contenedor exterior que respeta el tamaño del padre */
.image-editor-wrapper-outer[b-jq90gj4hor] {
    position: relative;
    width: 100%;
    height: 100%;
    overflow: hidden;
}

/* Contenedor de la Imagen (Fondo) */
.image-preview-container[b-jq90gj4hor] {
    position: relative;
    width: 100%;
    height: 100%;
    overflow: hidden;
    background-color: var(--color-image-background-container, #000);
    display: flex;
    align-items: center;
    justify-content: center;
}

/* Skeleton Loader */
.skeleton-loader[b-jq90gj4hor] {
    position: absolute;
    inset: 0;
    background: linear-gradient(110deg, #2c2c2c 25%, #444444 50%, #2c2c2c 75%);
    background-size: 200% 100%;
    animation: skeleton-loading-b-jq90gj4hor 1.8s infinite linear;
    z-index: 1;
    opacity: 1;
    transition: opacity 0.5s ease;
}

@keyframes skeleton-loading-b-jq90gj4hor {
    to {
        background-position: -200% 0;
    }
}

/* Imagen Final */
.image-preview[b-jq90gj4hor] {
    width: 100%;
    height: 100%;
    /* NOTA: object-fit se define en C# (inline style) */
    transition: transform 0.3s ease, opacity 0.5s ease;
    position: relative;
    z-index: 2;
    opacity: 0;
    display: block;
}

/* Lógica de carga */
.image-preview-container.loaded .image-preview[b-jq90gj4hor] {
    opacity: 1;
}

.image-preview-container.loaded .skeleton-loader[b-jq90gj4hor] {
    opacity: 0;
    pointer-events: none;
}
/* _content/ImagineTheFuture.BlazorServer/Shared/PartialViews/WatchImageViewer.razor.rz.scp.css */
/*
 * WatchImageViewer.razor.css
 * Estilos para el visor de foto de perfil del Reloj - Industrial Edition
*/

/* --- 1. Contenedor Principal --- */
.watch-image-wrapper[b-7m3zi3dpk2] {
    position: relative;
    /* El tamaño lo define el contenedor padre mediante width/height */
    width: 100%;
    height: 100%;
    flex-shrink: 0;
}

/* --- 2. Contenedor de Imagen (Circular) --- */
.image-preview-container[b-7m3zi3dpk2] {
    position: relative;
    width: 100%;
    height: 100%;
    overflow: hidden;
    border-radius: 50%;
    /* Borde técnico sutil */
    border: 3px solid var(--palette-gray-light);
    background-color: #F3F4F6; /* Fondo claro mientras carga */
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 4px 10px rgba(0,0,0,0.1);
}

/* --- 3. Skeleton Loader (Circular) --- */
.skeleton-loader[b-7m3zi3dpk2] {
    position: absolute;
    inset: 0;
    /* Gradiente gris claro para tema light */
    background: linear-gradient(110deg, #ececec 8%, #f5f5f5 18%, #ececec 33%);
    background-size: 200% 100%;
    animation: skeleton-loading-b-7m3zi3dpk2 1.5s infinite linear;
    z-index: 1;
    opacity: 1;
    transition: opacity 0.5s ease;
}

@keyframes skeleton-loading-b-7m3zi3dpk2 {
    to {
        background-position: -200% 0;
    }
}

/* --- 4. Imagen --- */
.image-preview[b-7m3zi3dpk2] {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: opacity 0.5s ease;
    position: relative;
    z-index: 2;
    opacity: 0; /* Empieza invisible hasta cargar */
}

/* --- 5. Lógica de Carga Visual --- */
.image-preview-container.loaded .image-preview[b-7m3zi3dpk2] {
    opacity: 1;
}

.image-preview-container.loaded .skeleton-loader[b-7m3zi3dpk2] {
    opacity: 0;
    pointer-events: none;
}

/* --- 6. Loader de Subida (Overlay) --- */
.upload-loader[b-7m3zi3dpk2] {
    position: absolute;
    inset: 0;
    z-index: 10;
    background-color: rgba(255, 255, 255, 0.7); /* Overlay blanco */
    backdrop-filter: blur(2px);
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
}

    .upload-loader .spinner-border[b-7m3zi3dpk2] {
        color: var(--palette-primary);
        width: 2rem;
        height: 2rem;
        border: 3px solid rgba(0, 163, 224, 0.2);
        border-top-color: var(--palette-primary);
        border-radius: 50%;
        animation: spin-b-7m3zi3dpk2 1s linear infinite;
    }

@keyframes spin-b-7m3zi3dpk2 {
    to {
        transform: rotate(360deg);
    }
}

/* --- 7. Botón de "Camarita" (Industrial) --- */
.edit-photo-btn[b-7m3zi3dpk2] {
    position: absolute;
    bottom: 0;
    right: 0;
    z-index: 11;
    width: 32px;
    height: 32px;
    /* Fondo azul sólido */
    background-color: var(--palette-primary);
    color: #FFFFFF;
    border: 2px solid #FFFFFF; /* Borde blanco para separar */
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: all 0.2s ease;
    box-shadow: 0 2px 5px rgba(0,0,0,0.2);
}

    .edit-photo-btn:hover[b-7m3zi3dpk2] {
        background-color: #0088BE; /* Azul más oscuro */
        transform: scale(1.1);
    }

    .edit-photo-btn .fas[b-7m3zi3dpk2] {
        font-size: 0.9rem;
    }

.is-uploading .edit-photo-btn[b-7m3zi3dpk2] {
    opacity: 0.5;
    cursor: not-allowed;
    pointer-events: none;
}

/* --- 8. InputFile Oculto --- */
[b-7m3zi3dpk2] .hidden-file-input {
    display: none;
}
/* _content/ImagineTheFuture.BlazorServer/Shared/PartialViews/WorksiteEditorPartial.razor.rz.scp.css */
/*
 * WorksiteEditorPartial.razor.css
 * Slide-over Panel para Lugares de Trabajo - Industrial Edition
 */

/* --- SLIDE-OVER PANEL --- */
.slideover-backdrop[b-qfl7rky1ll] {
    position: fixed;
    inset: 0;
    background-color: rgba(15, 23, 42, 0.7);
    backdrop-filter: blur(3px);
    z-index: 2000;
}

.slideover-panel[b-qfl7rky1ll] {
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    width: 100%;
    max-width: 550px;
    background-color: #FFFFFF;
    z-index: 2010;
    box-shadow: -10px 0 40px rgba(0,0,0,0.2);
    border-left: 1px solid var(--employee-border);
}

.slideover-header[b-qfl7rky1ll] {
    padding: 1.5rem 2rem;
    border-bottom: 1px solid #E2E8F0;
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    background-color: #F8FAFC;
    flex-shrink: 0;
}

    .slideover-header h3[b-qfl7rky1ll] {
        margin: 0;
        font-family: 'Montserrat', sans-serif;
        font-weight: 800;
        color: var(--employee-text-main);
        font-size: 1.5rem;
        text-transform: uppercase;
    }

    .slideover-header .subtitle[b-qfl7rky1ll] {
        font-size: 0.75rem;
        font-weight: 700;
        color: var(--palette-primary);
        letter-spacing: 0.1em;
        margin-bottom: 0.3rem;
        display: block;
    }

.btn-close-icon[b-qfl7rky1ll] {
    background: none;
    border: none;
    font-size: 1.5rem;
    color: #94A3B8;
    cursor: pointer;
    transition: color 0.2s;
    padding: 0;
}

    .btn-close-icon:hover[b-qfl7rky1ll] {
        color: #DC2626;
    }

.slideover-body[b-qfl7rky1ll] {
    flex-grow: 1;
    padding: 2rem;
    overflow-y: auto;
    background-color: #FFFFFF;
    scrollbar-width: thin;
    scrollbar-color: #CBD5E1 transparent;
}

.slideover-footer[b-qfl7rky1ll] {
    padding: 1.5rem 2rem;
    border-top: 1px solid #E2E8F0;
    background-color: #F8FAFC;
    display: flex;
    justify-content: flex-end;
    gap: 1rem;
    flex-shrink: 0;
}

/* --- FORMULARIOS --- */
.form-section[b-qfl7rky1ll] {
    margin-bottom: 2rem;
}

    .form-section h5[b-qfl7rky1ll] {
        margin: 0 0 1rem 0;
        font-size: 1rem;
        color: var(--employee-text-main);
        font-weight: 700;
        text-transform: uppercase;
        border-bottom: 1px solid #F1F5F9;
        padding-bottom: 0.5rem;
    }

.form-group[b-qfl7rky1ll] {
    margin-bottom: 1.25rem;
}

.mt-4[b-qfl7rky1ll] {
    margin-top: 2rem;
}

.mt-3[b-qfl7rky1ll] {
    margin-top: 1rem;
}

[b-qfl7rky1ll] label {
    display: block;
    font-size: 0.75rem;
    font-weight: 700;
    color: var(--employee-text-secondary);
    text-transform: uppercase;
    margin-bottom: 0.4rem;
}

[b-qfl7rky1ll] .form-control {
    width: 100%;
    padding: 0.7rem 1rem;
    border: 1px solid #CBD5E1;
    border-radius: 4px;
    background-color: #FFFFFF;
    color: #1E293B;
    font-size: 0.95rem;
    font-family: 'Montserrat', sans-serif;
    transition: all 0.2s;
}

    [b-qfl7rky1ll] .form-control:focus {
        border-color: var(--palette-primary);
        outline: none;
        box-shadow: 0 0 0 3px rgba(0, 163, 224, 0.1);
    }

/* --- MAPA E INPUTS BLOQUEADOS --- */
.map-input-group[b-qfl7rky1ll] {
    display: flex;
    gap: 0.5rem;
    align-items: stretch;
}

.input-wrapper[b-qfl7rky1ll] {
    position: relative;
    flex-grow: 1;
}

.lock-icon[b-qfl7rky1ll] {
    position: absolute;
    right: 10px;
    top: 12px;
    color: var(--palette-gray-mid);
    font-size: 0.9rem;
    opacity: 0.7;
}

[b-qfl7rky1ll] .form-control.locked-input,
[b-qfl7rky1ll] .form-control[readonly],
[b-qfl7rky1ll] .form-control:disabled {
    background-color: #F8FAFC;
    color: var(--palette-gray-mid);
    border-color: #E2E8F0;
    cursor: not-allowed;
    font-family: 'Consolas', monospace;
    font-size: 0.9rem;
}

.btn-map-trigger[b-qfl7rky1ll] {
    background-color: var(--palette-primary);
    color: white;
    border: none;
    border-radius: 4px;
    padding: 0 1rem;
    cursor: pointer;
    font-family: 'Montserrat', sans-serif;
    font-weight: 700;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 0.3rem;
    transition: background 0.2s;
    min-width: 90px;
}

    .btn-map-trigger:hover:not(:disabled)[b-qfl7rky1ll] {
        background-color: #0088BE;
    }

    .btn-map-trigger:disabled[b-qfl7rky1ll] {
        opacity: 0.6;
        cursor: not-allowed;
    }

    .btn-map-trigger i[b-qfl7rky1ll] {
        font-size: 1.2rem;
    }

    .btn-map-trigger span[b-qfl7rky1ll] {
        font-size: 0.65rem;
        text-transform: uppercase;
    }

.help-text[b-qfl7rky1ll] {
    font-size: 0.75rem;
    color: var(--palette-gray-mid);
    margin-top: 0.4rem;
    display: block;
    font-style: italic;
}

.grid-2[b-qfl7rky1ll] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1rem;
}

/* --- BOTONES FOOTER --- */
.btn-save[b-qfl7rky1ll] {
    background-color: var(--palette-primary);
    color: white;
    border: none;
    padding: 0.8rem 1.5rem;
    border-radius: 2px;
    font-weight: 700;
    text-transform: uppercase;
    cursor: pointer;
    transition: background-color 0.2s;
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

    .btn-save:hover:not(:disabled)[b-qfl7rky1ll] {
        background-color: #0088BE;
    }

    .btn-save:disabled[b-qfl7rky1ll] {
        opacity: 0.6;
        cursor: not-allowed;
    }

.btn-cancel[b-qfl7rky1ll] {
    background: transparent;
    color: var(--palette-gray-mid);
    border: 1px solid var(--palette-gray-mid);
    padding: 0.8rem 1.5rem;
    border-radius: 2px;
    cursor: pointer;
    font-weight: 700;
    text-transform: uppercase;
    transition: all 0.2s;
}

    .btn-cancel:hover[b-qfl7rky1ll] {
        background: #F1F5F9;
        color: var(--employee-text-main);
    }

[b-qfl7rky1ll] .validation-message {
    color: var(--palette-danger);
    font-size: 0.75rem;
    margin-top: 0.25rem;
    font-weight: 500;
}

/* Animaciones */
.animate-fade-in[b-qfl7rky1ll] {
    animation: fadeIn-b-qfl7rky1ll 0.3s ease-out;
}

.animate-slide-in-right[b-qfl7rky1ll] {
    animation: slideInRight-b-qfl7rky1ll 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

@keyframes fadeIn-b-qfl7rky1ll {
    from {
        opacity: 0;
    }

    to {
        opacity: 1;
    }
}

@keyframes slideInRight-b-qfl7rky1ll {
    from {
        transform: translateX(100%);
    }

    to {
        transform: translateX(0);
    }
}

/* Spinner */
.spinner-border[b-qfl7rky1ll] {
    width: 1rem;
    height: 1rem;
    border: 2px solid rgba(255,255,255,0.3);
    border-top: 2px solid white;
    border-radius: 50%;
    animation: spin-b-qfl7rky1ll 0.8s linear infinite;
}

@keyframes spin-b-qfl7rky1ll {
    to {
        transform: rotate(360deg);
    }
}

/* Responsive */
@media (max-width: 640px) {
    .slideover-panel[b-qfl7rky1ll] {
        max-width: 100%;
    }

    .map-input-group[b-qfl7rky1ll] {
        flex-direction: column;
    }

    .btn-map-trigger[b-qfl7rky1ll] {
        padding: 0.8rem;
        flex-direction: row;
    }
}
/* _content/ImagineTheFuture.BlazorServer/Shared/PartialViews/WorksiteManagerPartial.razor.rz.scp.css */
/*
 * WorksiteManagerPartial.razor.css
 * Estilos aislados para la vista maestra de Lugares (Tarjetas)
 */

.partial-container[b-qjhi0bzr3w] {
    padding: 1rem 0;
}

/* --- ACCIONES SUPERIORES --- */
.partial-actions[b-qjhi0bzr3w] {
    display: flex;
    justify-content: flex-end;
    margin-bottom: 1.5rem;
}

.btn-create[b-qjhi0bzr3w] {
    background-color: var(--palette-primary);
    color: white;
    border: none;
    padding: 0.6rem 1.2rem;
    border-radius: 2px;
    font-family: 'Montserrat', sans-serif;
    font-weight: 700;
    text-transform: uppercase;
    cursor: pointer;
    display: flex;
    gap: 0.5rem;
    align-items: center;
    box-shadow: 0 4px 10px rgba(0, 163, 224, 0.3);
    transition: all 0.2s ease;
    font-size: 0.85rem;
}

    .btn-create:hover[b-qjhi0bzr3w] {
        background-color: #0088BE;
        transform: translateY(-1px);
    }

/* --- GRID DE TARJETAS --- */
.cards-grid[b-qjhi0bzr3w] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
    gap: 1.5rem;
}

.op-card[b-qjhi0bzr3w] {
    background-color: #FFFFFF;
    border: 1px solid var(--employee-border, #E2E8F0);
    border-radius: 4px;
    padding: 1.5rem;
    display: flex;
    gap: 1rem;
    align-items: center;
    box-shadow: var(--employee-shadow, 0 2px 10px rgba(0,0,0,0.05));
    transition: all 0.2s ease;
}

    .op-card:hover[b-qjhi0bzr3w] {
        border-color: var(--palette-primary);
        transform: translateY(-2px);
        box-shadow: 0 8px 20px rgba(0, 163, 224, 0.1);
    }

.card-icon[b-qjhi0bzr3w] {
    width: 50px;
    height: 50px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.5rem;
    flex-shrink: 0;
}

    .card-icon.blue[b-qjhi0bzr3w] {
        background-color: #F0F9FF; /* Tinte azul muy suave */
        color: var(--palette-primary);
    }

.card-info[b-qjhi0bzr3w] {
    flex-grow: 1;
    overflow: hidden;
}

    .card-info h4[b-qjhi0bzr3w] {
        margin: 0;
        font-family: 'Montserrat', sans-serif;
        font-size: 1rem;
        font-weight: 700;
        color: var(--employee-text-main, #1E293B);
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
        text-transform: uppercase;
    }

    .card-info .address[b-qjhi0bzr3w] {
        margin: 0.3rem 0;
        font-size: 0.85rem;
        color: var(--employee-text-secondary, #64748B);
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
    }

.badge-tech[b-qjhi0bzr3w] {
    display: inline-block;
    font-size: 0.75rem;
    background-color: #F1F5F9;
    padding: 2px 6px;
    border-radius: 2px;
    color: #475569;
    font-weight: 600;
    margin-top: 0.3rem;
    font-family: 'Consolas', monospace;
}

/* --- ACCIONES DE TARJETA --- */
.card-actions[b-qjhi0bzr3w] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.btn-icon[b-qjhi0bzr3w] {
    background: transparent;
    border: 1px solid transparent;
    color: #94A3B8;
    cursor: pointer;
    transition: all 0.2s ease;
    width: 32px;
    height: 32px;
    border-radius: 2px;
    display: flex;
    align-items: center;
    justify-content: center;
}

    .btn-icon:hover[b-qjhi0bzr3w] {
        background-color: rgba(0, 163, 224, 0.1);
        color: var(--palette-primary);
        border-color: var(--palette-primary);
    }

    .btn-icon.danger:hover[b-qjhi0bzr3w] {
        background-color: rgba(229, 62, 62, 0.1);
        color: var(--palette-danger);
        border-color: var(--palette-danger);
    }

/* --- ESTADO VACÍO --- */
.empty-state-card[b-qjhi0bzr3w] {
    grid-column: 1 / -1;
    background-color: #F8FAFC;
    border: 2px dashed #CBD5E1;
    border-radius: 4px;
    padding: 4rem 2rem;
    text-align: center;
    color: #94A3B8;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}

    .empty-state-card i[b-qjhi0bzr3w] {
        font-size: 3rem;
        margin-bottom: 1rem;
        opacity: 0.5;
    }

    .empty-state-card p[b-qjhi0bzr3w] {
        margin: 0;
        font-family: 'Montserrat', sans-serif;
        font-weight: 500;
    }

/* --- ANIMACIONES --- */
.animate-fade-in[b-qjhi0bzr3w] {
    animation: fadeIn-b-qjhi0bzr3w 0.4s ease-out forwards;
}

@keyframes fadeIn-b-qjhi0bzr3w {
    from {
        opacity: 0;
        transform: translateY(10px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}
/* _content/ImagineTheFuture.BlazorServer/Shared/Popovers/ConfirmationModal.razor.rz.scp.css */
/*
 * ConfirmationModal.razor.css
 * Modal de confirmación global con tema oscuro.
 */

.modal-backdrop[b-1r3b854kc6] {
    position: fixed;
    top: 0;
    left: 0;
    width: 100vw;
    height: 100vh;
    background-color: rgba(0, 0, 0, 0.75);
    backdrop-filter: blur(4px); /* Efecto difuminado moderno */
    z-index: 2000; /* Por encima de todo, incluso del Toast */
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 1rem;
}

.modal-card[b-1r3b854kc6] {
    background-color: var(--color-dark-carbon, #1a1a1a);
    border: 1px solid var(--color-section-border-reloj-de-luz, #333);
    border-radius: 12px;
    width: 100%;
    max-width: 400px;
    padding: 2rem;
    box-shadow: 0 10px 25px rgba(0, 0, 0, 0.5);
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    transform: translateY(0);
    transition: transform 0.3s ease;
}

/* === Variaciones por Tipo === */
.type-danger[b-1r3b854kc6] {
    border-top: 4px solid var(--color-danger, #dc3545);
}

    .type-danger .modal-icon-wrapper[b-1r3b854kc6] {
        color: var(--color-danger, #dc3545);
        background-color: rgba(220, 53, 69, 0.1);
    }

    .type-danger .btn-confirm[b-1r3b854kc6] {
        background-color: var(--color-danger, #dc3545);
        color: white;
    }

        .type-danger .btn-confirm:hover[b-1r3b854kc6] {
            background-color: #bb2d3b;
        }

.type-warning[b-1r3b854kc6] {
    border-top: 4px solid var(--color-accent-gold, #d4af37);
}

    .type-warning .modal-icon-wrapper[b-1r3b854kc6] {
        color: var(--color-accent-gold, #d4af37);
        background-color: rgba(212, 175, 55, 0.1);
    }

    .type-warning .btn-confirm[b-1r3b854kc6] {
        background-color: var(--color-accent-gold, #d4af37);
        color: #121212; /* Texto oscuro para contraste con dorado */
    }

        .type-warning .btn-confirm:hover[b-1r3b854kc6] {
            opacity: 0.9;
        }

.type-info[b-1r3b854kc6] {
    border-top: 4px solid #0dcaf0;
}

    .type-info .modal-icon-wrapper[b-1r3b854kc6] {
        color: #0dcaf0;
        background-color: rgba(13, 202, 240, 0.1);
    }

    .type-info .btn-confirm[b-1r3b854kc6] {
        background-color: #0dcaf0;
        color: #121212;
    }

/* === Contenido === */
.modal-icon-wrapper[b-1r3b854kc6] {
    width: 60px;
    height: 60px;
    border-radius: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 1.75rem;
    margin-bottom: 1.5rem;
}

.modal-title[b-1r3b854kc6] {
    font-family: 'Montserrat', sans-serif;
    font-size: 1.25rem;
    font-weight: 600;
    color: var(--color-text-reloj-de-luz, #e0e0e0);
    margin: 0 0 0.5rem 0;
}

.modal-message[b-1r3b854kc6] {
    font-family: 'Montserrat', sans-serif;
    font-size: 0.95rem;
    color: var(--color-form-label-reloj-de-luz, #aaa);
    margin: 0 0 2rem 0;
    line-height: 1.5;
}

/* === Botones === */
.modal-actions[b-1r3b854kc6] {
    display: flex;
    gap: 1rem;
    width: 100%;
}

.btn-cancel[b-1r3b854kc6], .btn-confirm[b-1r3b854kc6] {
    flex: 1;
    padding: 0.75rem 1rem;
    border-radius: 6px;
    font-family: 'Montserrat', sans-serif;
    font-weight: 600;
    font-size: 0.9rem;
    cursor: pointer;
    border: none;
    transition: all 0.2s ease;
}

.btn-cancel[b-1r3b854kc6] {
    background-color: transparent;
    border: 1px solid var(--color-section-border-reloj-de-luz, #444);
    color: var(--color-text-reloj-de-luz, #ccc);
}

    .btn-cancel:hover[b-1r3b854kc6] {
        background-color: rgba(255, 255, 255, 0.05);
        border-color: #666;
    }

/* === Animaciones === */
.animate-fade-in[b-1r3b854kc6] {
    animation: fadeIn-b-1r3b854kc6 0.2s ease-out forwards;
}

@keyframes fadeIn-b-1r3b854kc6 {
    from {
        opacity: 0;
    }

    to {
        opacity: 1;
    }
}
/* _content/ImagineTheFuture.BlazorServer/Shared/Popovers/LocationMapPopover.razor.rz.scp.css */
/*
 * LocationMapPopover.razor.css
 * Versión Industrial Light: Fondo blanco, texto oscuro, acentos azules.
*/

.popover-overlay[b-mmx71xl3pt] {
    position: fixed;
    inset: 0;
    z-index: 2500; /* Elevado para asegurar prioridad sobre cualquier otro modal */
    background-color: rgba(15, 23, 42, 0.6); /* Oscuro técnico semitransparente */
    backdrop-filter: blur(3px);
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 1rem;
    animation: fadeIn-b-mmx71xl3pt 0.3s ease;
}

.popover-content-wrapper[b-mmx71xl3pt] {
    width: 98%;
    max-width: 1350px; /* Aumentado para aprovechar pantallas grandes */
    height: 92vh; /* Aumentado para aprovechar el alto de la pantalla */
    /* CAMBIO AL MODO CLARO */
    background-color: #FFFFFF;
    border: 1px solid #E2E8F0;
    border-radius: 4px; /* Borde técnico */
    box-shadow: 0 20px 40px rgba(0, 0, 0, 0.15);
    display: flex;
    flex-direction: column;
    overflow: hidden;
    animation: fadeIn-b-mmx71xl3pt 0.4s ease-out;
}

/* --- Encabezado --- */
.popover-header[b-mmx71xl3pt] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 1rem 1.5rem;
    background-color: #F8FAFC; /* Gris muy claro */
    border-bottom: 1px solid #E2E8F0;
    flex-shrink: 0;
}

    .popover-header h4[b-mmx71xl3pt] {
        margin: 0;
        font-family: 'Montserrat', sans-serif;
        font-weight: 800;
        font-size: 1.1rem;
        color: var(--palette-carbon-deep); /* Texto oscuro */
        display: flex;
        align-items: center;
        gap: 0.75rem;
        text-transform: uppercase;
        letter-spacing: 0.05em;
    }

.text-accent[b-mmx71xl3pt] {
    color: var(--palette-primary); /* Azul Eléctrico */
}

/* --- Cuerpo (Contenedor del Mapa) --- */
.popover-body[b-mmx71xl3pt] {
    flex: 1;
    min-height: 0; /* Permite que el contenedor colapse y crezca correctamente en Flex */
    position: relative;
    background-color: #E2E8F0; /* Fondo gris en caso de que el mapa tarde en cargar */
    display: flex;
}

    /* Forzamos al hijo (LocationMapViewer) a ocupar el 100% del espacio */
    .popover-body[b-mmx71xl3pt]  .map-viewer-wrapper {
        display: flex;
        flex-direction: column;
        width: 100%;
        height: 100%;
        border: none;
        border-radius: 0;
    }

    .popover-body[b-mmx71xl3pt]  .map-container {
        flex: 1;
        height: 100% !important;
    }

/* --- Pie de Página --- */
.popover-footer[b-mmx71xl3pt] {
    display: flex;
    justify-content: flex-end;
    padding: 1rem 1.5rem;
    background-color: #F8FAFC;
    border-top: 1px solid #E2E8F0;
    flex-shrink: 0;
}

/* Botón de Guardar Estilo Industrial */
.btn-save[b-mmx71xl3pt] {
    padding: 0.7rem 2rem;
    font-family: 'Montserrat', sans-serif;
    font-weight: 700;
    font-size: 0.9rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    border-radius: 2px; /* Cuadrado */
    border: none;
    cursor: pointer;
    background-color: var(--palette-primary); /* Azul */
    color: var(--palette-white); /* Contraste blanco */
    display: inline-flex;
    align-items: center;
    gap: 0.6rem;
    transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
    box-shadow: 0 4px 10px rgba(0, 163, 224, 0.3);
}

    .btn-save:hover:not(:disabled)[b-mmx71xl3pt] {
        background-color: #0088BE; /* Azul oscuro */
        transform: translateY(-2px);
        box-shadow: 0 6px 15px rgba(0, 163, 224, 0.5);
    }

    .btn-save:disabled[b-mmx71xl3pt] {
        opacity: 0.5;
        cursor: not-allowed;
        background-color: var(--palette-gray-mid);
        box-shadow: none;
    }

/* --- Botón de Cierre (X) --- */
.btn-close[b-mmx71xl3pt] {
    width: 32px;
    height: 32px;
    border: none;
    background-color: transparent;
    color: #64748B; /* Gris medio/oscuro */
    border-radius: 4px;
    font-size: 1.5rem;
    line-height: 1;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.2s ease;
}

    .btn-close:hover[b-mmx71xl3pt] {
        background-color: #FEE2E2;
        color: #DC2626; /* Rojo */
    }

/* --- Animaciones --- */
@keyframes fadeIn-b-mmx71xl3pt {
    from {
        opacity: 0;
    }

    to {
        opacity: 1;
    }
}
/* _content/ImagineTheFuture.BlazorServer/Shared/Popovers/ScheduleEntryPopover.razor.rz.scp.css */
/* * ScheduleEntryPopover.razor.css
 * Estilo: Technical Blueprint (Industrial Light)
 */

.popover-overlay[b-sr6rfegcor] {
    position: fixed;
    inset: 0;
    z-index: 2000; /* Encima de todo */
    background-color: rgba(10, 25, 40, 0.7); /* Azul oscuro semitransparente */
    backdrop-filter: blur(4px);
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 1rem;
}

.popover-card[b-sr6rfegcor] {
    background-color: #FFFFFF;
    width: 100%;
    max-width: 600px; /* Ancho máximo controlado para legibilidad */
    border-radius: 4px;
    box-shadow: 0 20px 60px rgba(0,0,0,0.3);
    border: 1px solid var(--employee-border);
    display: flex;
    flex-direction: column;
    max-height: 90vh; /* Para evitar desborde vertical */
    overflow: hidden;
}

/* HEADER */
.popover-header[b-sr6rfegcor] {
    background-color: var(--employee-bg);
    padding: 1.5rem;
    border-bottom: 1px solid var(--employee-border);
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
}

.header-content[b-sr6rfegcor] {
    display: flex;
    flex-direction: column;
}

.subtitle[b-sr6rfegcor] {
    font-size: 0.8rem;
    text-transform: uppercase;
    color: var(--palette-gray-mid);
    letter-spacing: 0.05em;
    font-weight: 700;
}

.title[b-sr6rfegcor] {
    margin: 0;
    font-family: 'Montserrat', sans-serif;
    font-weight: 800;
    color: var(--palette-primary);
    font-size: 2rem;
    line-height: 1;
}

.btn-close[b-sr6rfegcor] {
    background: transparent;
    border: none;
    font-size: 1.5rem;
    color: var(--palette-gray-mid);
    cursor: pointer;
    transition: color 0.2s;
}

    .btn-close:hover[b-sr6rfegcor] {
        color: var(--palette-danger);
    }

/* BODY */
.popover-body[b-sr6rfegcor] {
    padding: 1.5rem;
    overflow-y: auto;
    flex-grow: 1;
}

/* Day Off Banner */
.day-off-banner[b-sr6rfegcor] {
    text-align: center;
    padding: 3rem;
    background-color: #F8FAFC;
    border: 2px dashed #CBD5E1;
    border-radius: 4px;
    color: #94A3B8;
}

    .day-off-banner i[b-sr6rfegcor] {
        font-size: 3rem;
        margin-bottom: 1rem;
    }

    .day-off-banner h3[b-sr6rfegcor] {
        color: var(--employee-text-main);
        margin-bottom: 0.5rem;
    }

/* Grid de Detalles */
.details-grid[b-sr6rfegcor] {
    display: grid;
    grid-template-columns: 1fr;
    gap: 1.5rem;
}

@media (min-width: 500px) {
    .details-grid[b-sr6rfegcor] {
        grid-template-columns: 1fr 1fr;
    }
}

.detail-section[b-sr6rfegcor] {
    background-color: #FFFFFF;
    border: 1px solid #E2E8F0;
    padding: 1rem;
    border-radius: 2px;
}

    .detail-section h4[b-sr6rfegcor] {
        margin: 0 0 1rem 0;
        font-size: 0.9rem;
        font-weight: 700;
        color: var(--employee-text-main);
        text-transform: uppercase;
        border-bottom: 1px solid #F1F5F9;
        padding-bottom: 0.5rem;
    }

        .detail-section h4 i[b-sr6rfegcor] {
            color: var(--palette-primary);
            margin-right: 0.5rem;
        }

/* Filas de Datos */
.data-row[b-sr6rfegcor] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 0.5rem;
    font-size: 0.9rem;
}

    .data-row label[b-sr6rfegcor] {
        color: var(--employee-text-secondary);
    }

    .data-row.highlight[b-sr6rfegcor] {
        background-color: var(--employee-bg);
        padding: 0.4rem;
        border-radius: 2px;
        font-weight: 700;
        margin-top: 0.5rem;
    }

.value-mono[b-sr6rfegcor] {
    font-family: 'Consolas', monospace;
    color: var(--employee-text-main);
    font-weight: 600;
}

/* Badges */
.badge-success[b-sr6rfegcor] {
    background-color: rgba(38, 176, 80, 0.1);
    color: #26b050;
    font-size: 0.7rem;
    padding: 2px 6px;
    border-radius: 2px;
    font-weight: 700;
    text-transform: uppercase;
}

.badge-neutral[b-sr6rfegcor] {
    background-color: #F1F5F9;
    color: var(--palette-gray-mid);
    font-size: 0.7rem;
    padding: 2px 6px;
    border-radius: 2px;
    font-weight: 700;
    text-transform: uppercase;
}

/* Reglas */
.rule-box[b-sr6rfegcor] {
    display: flex;
    align-items: center;
    gap: 0.8rem;
    margin-bottom: 0.8rem;
    background-color: #F8FAFC;
    padding: 0.5rem;
    border-left: 3px solid #26b050;
}

    .rule-box.warning[b-sr6rfegcor] {
        border-left-color: #ffc107;
    }

.rule-val[b-sr6rfegcor] {
    font-family: 'Consolas', monospace;
    font-weight: 700;
    font-size: 1.1rem;
    color: var(--employee-text-main);
}

.rule-desc[b-sr6rfegcor] {
    font-size: 0.75rem;
    color: var(--employee-text-secondary);
    line-height: 1.2;
}

.rules-list[b-sr6rfegcor] {
    padding-left: 1.2rem;
    margin: 0;
    font-size: 0.85rem;
    color: var(--employee-text-main);
}

    .rules-list li[b-sr6rfegcor] {
        margin-bottom: 0.4rem;
    }

/* FOOTER */
.popover-footer[b-sr6rfegcor] {
    padding: 1rem 1.5rem;
    background-color: var(--employee-bg);
    border-top: 1px solid var(--employee-border);
    display: flex;
    justify-content: flex-end;
}

.btn-action[b-sr6rfegcor] {
    background-color: var(--palette-primary);
    color: white;
    border: none;
    padding: 0.8rem 2rem;
    border-radius: 2px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    cursor: pointer;
    transition: background 0.2s;
}

    .btn-action:hover[b-sr6rfegcor] {
        background-color: #0088BE;
    }

.animate-fade-in[b-sr6rfegcor] {
    animation: fadeIn-b-sr6rfegcor 0.3s ease-out;
}

@keyframes fadeIn-b-sr6rfegcor {
    from {
        opacity: 0;
        transform: scale(0.98);
    }

    to {
        opacity: 1;
        transform: scale(1);
    }
}
/* _content/ImagineTheFuture.BlazorServer/Shared/Popovers/ScheduleTimelineModal.razor.rz.scp.css */
/*
 * ScheduleTimelineModal.razor.css
 * Enterprise Timeline UI
 */

.timeline-modal-backdrop[b-qk08m0z96h] {
    position: fixed;
    top: 0;
    left: 0;
    width: 100vw;
    height: 100vh;
    background-color: rgba(15, 23, 42, 0.6);
    backdrop-filter: blur(4px);
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 1000;
}

.timeline-modal-content[b-qk08m0z96h] {
    background-color: #FFFFFF;
    width: 900px;
    max-width: 95vw;
    border-radius: 8px;
    box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04);
    display: flex;
    flex-direction: column;
    overflow: hidden;
    font-family: 'Segoe UI', Roboto, sans-serif;
}

/* --- HEADER --- */
.modal-header[b-qk08m0z96h] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    padding: 1.5rem;
    background-color: #F8FAFC;
    border-bottom: 1px solid #E2E8F0;
}

.modal-title[b-qk08m0z96h] {
    margin: 0;
    font-size: 1.25rem;
    font-weight: 800;
    color: var(--palette-primary);
    text-transform: uppercase;
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.modal-subtitle[b-qk08m0z96h] {
    margin: 0.25rem 0 0 0;
    font-size: 0.95rem;
    color: #475569;
}

.btn-close[b-qk08m0z96h] {
    background: none;
    border: none;
    font-size: 1.5rem;
    color: #94A3B8;
    cursor: pointer;
    transition: color 0.2s;
}

    .btn-close:hover[b-qk08m0z96h] {
        color: #DC2626;
    }

/* --- TOOLBAR DE TIEMPO --- */
.timeline-toolbar[b-qk08m0z96h] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 1rem 1.5rem;
    background-color: #FFFFFF;
    border-bottom: 1px solid #E2E8F0;
}

.btn-nav[b-qk08m0z96h] {
    background-color: #F1F5F9;
    border: 1px solid #CBD5E1;
    color: #475569;
    padding: 0.5rem 1rem;
    border-radius: 4px;
    font-weight: 600;
    font-size: 0.85rem;
    cursor: pointer;
    transition: all 0.2s;
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

    .btn-nav:hover:not(:disabled)[b-qk08m0z96h] {
        background-color: #E2E8F0;
        color: #1E293B;
    }

    .btn-nav:disabled[b-qk08m0z96h] {
        opacity: 0.5;
        cursor: not-allowed;
    }

.current-period[b-qk08m0z96h] {
    font-weight: 700;
    color: #1E293B;
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-size: 1.05rem;
}

    .current-period i[b-qk08m0z96h] {
        color: var(--palette-primary);
    }

/* --- EL LIENZO (GRID) --- */
.timeline-canvas[b-qk08m0z96h] {
    padding: 1.5rem;
    background-color: #FFFFFF;
}

.timeline-grid-header[b-qk08m0z96h] {
    display: grid;
    grid-template-columns: repeat(7, 1fr);
    border-bottom: 2px solid #E2E8F0;
    padding-bottom: 0.5rem;
    margin-bottom: 1rem;
}

.day-column[b-qk08m0z96h] {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 0.5rem;
    position: relative;
    cursor: pointer;
    border-radius: 4px;
    transition: background-color 0.2s;
}

    .day-column:hover[b-qk08m0z96h] {
        background-color: #F8FAFC;
    }

    /* Línea vertical tenue que baja por el track */
    .day-column[b-qk08m0z96h]::after {
        content: '';
        position: absolute;
        top: 100%;
        left: 50%;
        width: 1px;
        height: 100px;
        background-color: #F1F5F9;
        z-index: 0;
    }

.day-name[b-qk08m0z96h] {
    font-size: 0.75rem;
    font-weight: 700;
    color: #64748B;
    letter-spacing: 0.05em;
}

.day-number[b-qk08m0z96h] {
    font-size: 1.25rem;
    font-weight: 800;
    color: #1E293B;
}

.day-column.is-today .day-name[b-qk08m0z96h], .day-column.is-today .day-number[b-qk08m0z96h] {
    color: var(--palette-primary);
}

.today-indicator[b-qk08m0z96h] {
    position: absolute;
    top: -10px;
    background-color: var(--palette-primary);
    color: white;
    font-size: 0.6rem;
    font-weight: 800;
    padding: 0.1rem 0.4rem;
    border-radius: 10px;
}

/* --- EL TRACK DEL HORARIO --- */
.timeline-track[b-qk08m0z96h] {
    display: grid;
    grid-template-columns: repeat(7, 1fr);
    height: 60px;
    position: relative;
    align-items: center;
}

.track-loading[b-qk08m0z96h], .track-empty[b-qk08m0z96h] {
    grid-column: 1 / -1;
    text-align: center;
    color: #94A3B8;
    font-style: italic;
    font-size: 0.9rem;
    z-index: 1;
}

.schedule-block[b-qk08m0z96h] {
    position: relative;
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    z-index: 2;
    padding: 0 4px; /* Pequeño gap entre bloques si chocan */
}

/* La Barra Visual */
.block-bar[b-qk08m0z96h] {
    height: 12px;
    background-color: #0EA5E9;
    border-radius: 0;
    position: relative;
    display: flex;
    align-items: center;
    justify-content: space-between;
    box-shadow: 0 2px 4px rgba(14, 165, 233, 0.2);
}

    .block-bar.starts[b-qk08m0z96h] {
        border-top-left-radius: 6px;
        border-bottom-left-radius: 6px;
    }

    .block-bar.ends[b-qk08m0z96h] {
        border-top-right-radius: 6px;
        border-bottom-right-radius: 6px;
    }

    /* Gradientes para indicar continuidad si la regla viene de otra semana o sigue al infinito */
    .block-bar.continues-left[b-qk08m0z96h] {
        background: linear-gradient(to right, rgba(14, 165, 233, 0.3), #0EA5E9 20%);
    }

    .block-bar.continues-right[b-qk08m0z96h] {
        background: linear-gradient(to left, rgba(14, 165, 233, 0.3), #0EA5E9 20%);
    }

.start-arrow[b-qk08m0z96h], .end-arrow[b-qk08m0z96h] {
    color: white;
    font-size: 0.8rem;
    text-shadow: 0 1px 2px rgba(0,0,0,0.3);
}

.start-arrow[b-qk08m0z96h] {
    margin-left: 2px;
}

.end-arrow[b-qk08m0z96h] {
    margin-right: 2px;
}

/* El texto debajo de la barra */
.block-label[b-qk08m0z96h] {
    text-align: center;
    font-size: 0.85rem;
    font-weight: 700;
    color: #0369A1;
    margin-top: 6px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* --- FOOTER / ACCIÓN --- */
.modal-footer[b-qk08m0z96h] {
    padding: 1.5rem;
    background-color: #F8FAFC;
    border-top: 1px solid #E2E8F0;
}

.assignment-form[b-qk08m0z96h] {
    display: flex;
    align-items: flex-end;
    gap: 1rem;
    flex-wrap: wrap;
}

.form-group[b-qk08m0z96h] {
    display: flex;
    flex-direction: column;
    gap: 0.4rem;
    flex: 1;
    min-width: 200px;
}

    .form-group label[b-qk08m0z96h] {
        font-size: 0.85rem;
        font-weight: 700;
        color: #475569;
    }

.form-control[b-qk08m0z96h] {
    padding: 0.6rem 0.8rem;
    border: 1px solid #CBD5E1;
    border-radius: 4px;
    font-size: 0.95rem;
    font-family: inherit;
    font-weight: 600;
    color: #1E293B;
}

    .form-control:focus[b-qk08m0z96h] {
        outline: none;
        border-color: var(--palette-primary);
        box-shadow: 0 0 0 2px rgba(0, 163, 224, 0.1);
    }

.btn-execute[b-qk08m0z96h] {
    background-color: var(--palette-primary);
    color: white;
    border: none;
    padding: 0.6rem 1.5rem;
    height: 42px;
    font-size: 0.95rem;
    font-weight: 700;
    border-radius: 4px;
    cursor: pointer;
    transition: all 0.2s;
    display: flex;
    align-items: center;
    gap: 0.5rem;
    text-transform: uppercase;
}

    .btn-execute:hover:not(:disabled)[b-qk08m0z96h] {
        background-color: #0284C7;
        transform: translateY(-1px);
        box-shadow: 0 4px 10px rgba(0, 163, 224, 0.3);
    }

    .btn-execute:disabled[b-qk08m0z96h] {
        background-color: #94A3B8;
        cursor: not-allowed;
    }

.animate-fade-in[b-qk08m0z96h] {
    animation: fadeIn-b-qk08m0z96h 0.2s ease-out;
}

@keyframes fadeIn-b-qk08m0z96h {
    from {
        opacity: 0;
        transform: scale(0.98);
    }

    to {
        opacity: 1;
        transform: scale(1);
    }
}
/* _content/ImagineTheFuture.BlazorServer/Shared/Popovers/Toast.razor.rz.scp.css */
.toast-container[b-yvgpazei6t] {
    position: fixed;
    top: 1.5rem;
    right: 1.5rem;
    z-index: 1050; /* Un z-index alto para que aparezca sobre todo */
    min-width: 280px;
}

.toast[b-yvgpazei6t] {
    display: flex;
    align-items: center;
    padding: 0.75rem 1.25rem;
    margin-bottom: 1rem;
    border: 1px solid transparent;
    border-radius: 0.375rem;
    box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15);
    opacity: 0;
    transform: translateX(100%);
    transition: opacity 0.4s ease, transform 0.4s ease;
    color: white;
}

    .toast.show[b-yvgpazei6t] {
        opacity: 1;
        transform: translateX(0);
    }

.toast-body[b-yvgpazei6t] {
    font-family: 'Montserrat', sans-serif;
    font-weight: 500;
}

/* Variaciones de color según el nivel del toast */
.toast-success[b-yvgpazei6t] {
    background-color: #16a34a; /* Verde */
    border-color: #15803d;
}

.toast-error[b-yvgpazei6t] {
    background-color: #dc2626; /* Rojo */
    border-color: #b91c1c;
}

.toast-warning[b-yvgpazei6t] {
    background-color: #f59e0b; /* Ámbar */
    border-color: #d97706;
    color: #1f2937; /* Texto oscuro para mejor contraste */
}

.toast-info[b-yvgpazei6t] {
    background-color: #2563eb; /* Azul */
    border-color: #1d4ed8;
}
/* _content/ImagineTheFuture.BlazorServer/Shared/ProfileSidebar.razor.rz.scp.css */
/*
 * ProfileSidebar.razor.css
 * Barra lateral para configuración de cuenta
 */

.sidebar[b-owfvbghag8] {
    width: 260px;
    background-color: #FFFFFF;
    border-right: 1px solid #E5E7EB;
    position: fixed;
    top: 0;
    left: 0;
    height: 100vh;
    transition: width 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    font-family: 'Montserrat', sans-serif;
    z-index: 1100;
    display: flex;
    flex-direction: column;
    overflow-x: hidden;
    color: var(--palette-carbon-deep);
    box-shadow: 2px 0 10px rgba(0,0,0,0.03);
    user-select: none;
}

.sidebar-header[b-owfvbghag8] {
    padding: 1.25rem 0.75rem;
    border-bottom: 1px solid #E5E7EB;
}

    .sidebar-header a[b-owfvbghag8] {
        display: block;
        text-decoration: none;
        color: inherit;
        height: 40px;
        position: relative;
    }

    .logo-wrapper .logo-content[b-owfvbghag8] {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        display: flex;
        align-items: center;
        transition: opacity 0.3s ease-in-out, transform 0.3s ease-in-out;
        backface-visibility: hidden; /* Previene parpadeos */
    }

    /* Icono del estado hover */
    .logo-wrapper .logo-hover .icon-placeholder[b-owfvbghag8] {
        color: var(--palette-primary);
        font-size: 1.4rem;
    }
    
    .logo-wrapper .logo-hover .logo-font[b-owfvbghag8] {
        color: var(--palette-primary);
    }

    /* El estado hover empieza invisible y un poco movido */
    .logo-wrapper .logo-hover[b-owfvbghag8] {
        opacity: 0;
        transform: scale(0.95);
    }

    /* En el hover del link... */
    .logo-wrapper:hover .logo-default[b-owfvbghag8] {
        opacity: 0;
        transform: scale(0.95);
    }

    .logo-wrapper:hover .logo-hover[b-owfvbghag8] {
        opacity: 1;
        transform: scale(1);
    }

    .sidebar-header .icon-placeholder[b-owfvbghag8] {
        width: 63px;
        flex-shrink: 0;
        text-align: left;
        padding-left: .8rem;
    }

    .sidebar-header img[b-owfvbghag8] {
        height: 30px;
        vertical-align: middle;
        filter: grayscale(100%); /* Logo gris para indicar modo configuración */
        opacity: 0.8;
    }

    .sidebar-header .logo-font[b-owfvbghag8] {
        font-family: 'Montserrat', sans-serif;
        font-weight: 700;
        font-size: 0.9rem;
        color: var(--palette-gray-mid);
        text-transform: uppercase;
        letter-spacing: 0.1em;
        padding-top: 2px;
        transition: opacity 0.2s;
        white-space: nowrap;
    }

.sidebar-nav[b-owfvbghag8] {
    flex-grow: 1;
    padding-top: 1rem;
    display: flex;
    flex-direction: column;
}

.nav-section[b-owfvbghag8] {
    padding: 0 0.75rem;
    display: flex;
    flex-direction: column;
}

.nav-footer[b-owfvbghag8] {
    margin-top: auto;
    padding-bottom: 1rem;
    border-top: 1px solid #E5E7EB;
    padding-top: 1rem;
}

[b-owfvbghag8] .nav-link {
    display: flex;
    align-items: center;
    text-decoration: none;
    color: var(--palette-gray-mid);
    padding: 0.85rem 0;
    border-radius: 4px;
    margin-bottom: 0.25rem;
    transition: all 0.2s ease-in-out;
}

    [b-owfvbghag8] .nav-link .icon-placeholder {
        width: 55px;
        flex-shrink: 0;
        text-align: center;
        font-size: 1.2rem;
        color: #9CA3AF;
        transition: color 0.2s;
    }

    [b-owfvbghag8] .nav-link .link-text {
        white-space: nowrap;
        opacity: 1;
        font-weight: 500;
        font-size: 0.9rem;
        transition: opacity 0.2s;
    }

    /* Hover */
    [b-owfvbghag8] .nav-link:hover {
        background-color: #F3F4F6;
        color: var(--palette-carbon-deep);
    }

        [b-owfvbghag8] .nav-link:hover .icon-placeholder {
            color: var(--palette-carbon-deep);
        }

    /* Activo */
    [b-owfvbghag8] .nav-link.active {
        background-color: rgba(0, 0, 0, 0.05);
        color: var(--palette-carbon-deep);
        font-weight: 700;
        border-left: 3px solid var(--palette-carbon-deep); /* Indicador izquierdo negro */
        border-radius: 0 4px 4px 0;
    }

        [b-owfvbghag8] .nav-link.active .icon-placeholder {
            color: var(--palette-carbon-deep);
        }

/* Botón de Retorno */
[b-owfvbghag8] .return-link {
    color: var(--palette-primary);
}

    [b-owfvbghag8] .return-link .icon-placeholder {
        color: var(--palette-primary);
    }

    [b-owfvbghag8] .return-link:hover {
        background-color: rgba(0, 163, 224, 0.05);
    }

/* --- ESTADO COLAPSADO --- */
.profile-layout.sidebar-collapsed .sidebar[b-owfvbghag8] {
    width: 78px;
}

.profile-layout.sidebar-collapsed .link-text[b-owfvbghag8] {
    opacity: 0;
    pointer-events: none;
}

/* --- MÓVIL --- */
@media (max-width: 992px) {
    .sidebar[b-owfvbghag8] {
        transform: translateX(-100%);
        transition: transform 0.3s;
        box-shadow: 4px 0 15px rgba(0,0,0,0.1);
        border-right: none;
    }

    .profile-layout.mobile-nav-open .sidebar[b-owfvbghag8] {
        transform: translateX(0);
        width: 260px;
    }

    .profile-layout.mobile-nav-open .link-text[b-owfvbghag8] {
        opacity: 1;
        pointer-events: auto;
    }
}
/* _content/ImagineTheFuture.BlazorServer/Shared/ProfileTopBar.razor.rz.scp.css */
/*
 * ProfileTopBar.razor.css
 * Cabecera limpia para el perfil - TEMA: Light / Engineering Blueprint
 */

.app-top-bar[b-djmhyf3vn6] {
    position: sticky;
    top: 0;
    z-index: 1050;
    height: 70px;
    background-color: #FFFFFF;
    border-bottom: 1px solid #E5E7EB;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0 2rem;
    box-shadow: 0 1px 2px rgba(0,0,0,0.03);
    user-select: none;
}

.section-label[b-djmhyf3vn6] {
    font-family: 'Montserrat', sans-serif;
    font-weight: 700;
    color: var(--palette-carbon-deep);
    font-size: 1.1rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

/* --- Trigger de Usuario (Desktop) --- */
.user-menu-container[b-djmhyf3vn6] {
    position: relative;
}

.user-display-btn[b-djmhyf3vn6] {
    display: flex;
    align-items: center;
    gap: 1rem;
    background: transparent;
    border: 1px solid transparent;
    padding: 0.4rem 0.8rem;
    border-radius: 4px;
    cursor: pointer;
    transition: all 0.2s ease;
}

    .user-display-btn:hover[b-djmhyf3vn6] {
        background-color: #F3F4F6;
        border-color: #E5E7EB;
    }

.user-name[b-djmhyf3vn6] {
    font-weight: 600;
    color: var(--palette-gray-mid);
    font-size: 0.9rem;
    font-family: 'Montserrat', sans-serif;
}

.user-avatar[b-djmhyf3vn6] {
    display: flex;
    align-items: center;
    border-radius: 50%;
    border: 1px solid #E5E7EB;
}

.chevron-icon[b-djmhyf3vn6] {
    font-size: 0.8rem;
    color: #D1D5DB;
    transition: transform 0.2s;
}

.user-display-btn:hover .chevron-icon[b-djmhyf3vn6] {
    color: var(--palette-primary);
}

/* --- MÓVIL --- */
.mobile-header[b-djmhyf3vn6] {
    display: none;
}

@media (max-width: 992px) {
    .app-top-bar[b-djmhyf3vn6] {
        display: none;
    }

    .mobile-header[b-djmhyf3vn6] {
        display: flex;
        align-items: center;
        justify-content: space-between;
        height: 60px;
        padding: 0 1rem;
        background-color: #FFFFFF;
        border-bottom: 1px solid #E5E7EB;
        position: fixed;
        top: 0;
        left: 0;
        width: 100%;
        z-index: 1050;
        box-shadow: 0 1px 3px rgba(0,0,0,0.05);
    }

    .mobile-menu-toggle[b-djmhyf3vn6] {
        background: none;
        border: none;
        font-size: 1.5rem;
        color: var(--palette-carbon-deep);
        cursor: pointer;
        padding: 0.5rem;
    }

    .mobile-label[b-djmhyf3vn6] {
        font-family: 'Montserrat', sans-serif;
        font-weight: 700;
        color: var(--palette-carbon-deep);
        font-size: 1rem;
        text-transform: uppercase;
    }

    /* Contenedor móvil para el dropdown */
    .user-menu-container-mobile[b-djmhyf3vn6] {
        position: relative;
    }

    .user-avatar-btn[b-djmhyf3vn6] {
        background: none;
        border: none;
        padding: 0;
        cursor: pointer;
        display: flex;
        align-items: center;
    }
}
/* _content/ImagineTheFuture.BlazorServer/Shared/TopBarDesktopMenu.razor.rz.scp.css */
/* Muestra solo en escritorio (min 978px) */
.desktop-menu-container[b-2jdc81ehbz] {
    display: none;
    align-items: center;
    gap: 2.5rem;
}

@media (min-width: 978px) {
    .desktop-menu-container[b-2jdc81ehbz] {
        display: flex;
    }
}

/* Links Generales */
.nav-link-style[b-2jdc81ehbz] {
    position: relative;
    color: var(--palette-soft-white);
    text-decoration: none;
    font-weight: 600;
    font-family: 'Montserrat', sans-serif;
    font-size: 0.95rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    transition: color 0.3s ease;
    background: none;
    border: none;
    cursor: pointer;
    display: flex;
    align-items: center;
    gap: 0.4rem;
    padding: 0.5rem 0;
}

    .nav-link-style:hover[b-2jdc81ehbz] {
        color: var(--palette-primary);
    }

    /* ESTADO ACTIVO (Para botones principales y el Trigger del Dropdown) */
    .nav-link-style.active[b-2jdc81ehbz] {
        color: var(--palette-primary);
    }

/* Dropdown Wrapper */
.portfolio-dropdown-wrapper[b-2jdc81ehbz] {
    position: relative;
}

.caret-icon[b-2jdc81ehbz] {
    width: 0.8rem;
    height: 0.8rem;
    transition: transform 0.3s ease;
}

    .caret-icon.open[b-2jdc81ehbz] {
        transform: rotate(180deg);
        color: var(--palette-primary);
    }

/* Menú Flotante */
.dropdown-menu[b-2jdc81ehbz] {
    position: absolute;
    top: 100%;
    left: 50%;
    transform: translateX(-50%) translateY(10px);
    z-index: 100;
    min-width: 220px;
    background-color: var(--palette-carbon-deep);
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-top: 3px solid var(--palette-primary);
    box-shadow: 0 10px 40px rgba(0, 0, 0, 0.5);
    padding: 0.5rem 0;
    opacity: 0;
    visibility: hidden;
    transition: all 0.2s ease;
    pointer-events: none;
}

    .dropdown-menu.show[b-2jdc81ehbz] {
        opacity: 1;
        visibility: visible;
        transform: translateX(-50%) translateY(0);
        pointer-events: auto;
    }

.dropdown-item[b-2jdc81ehbz] {
    display: block;
    padding: 0.8rem 1.5rem;
    color: var(--palette-soft-white);
    text-decoration: none;
    font-family: 'Montserrat', sans-serif;
    font-size: 0.9rem;
    transition: all 0.2s ease;
    border-left: 3px solid transparent;
}

    .dropdown-item:hover[b-2jdc81ehbz] {
        background-color: rgba(255, 255, 255, 0.05);
        color: var(--palette-white);
        border-left-color: var(--palette-primary);
        padding-left: 1.8rem;
    }

    /* --- ESTO FALTABA --- */
    /* Estado Activo para el ítem del dropdown (Cuando el ScrollSpy lo detecta) */
    .dropdown-item.active[b-2jdc81ehbz] {
        background-color: rgba(255, 255, 255, 0.05);
        color: var(--palette-primary); /* Se pone azul */
        border-left-color: var(--palette-primary); /* Borde azul */
        padding-left: 1.8rem; /* Se desliza igual que el hover */
        font-weight: 700;
    }

/* Click Catcher (Invisible overlay) */
.click-catcher[b-2jdc81ehbz] {
    position: fixed;
    inset: 0;
    z-index: 90;
    background: transparent;
}
/* _content/ImagineTheFuture.BlazorServer/Shared/TopBarMobileOverlay.razor.rz.scp.css */
.mobile-overlay[b-fhizbw8sl0] {
    position: fixed;
    inset: 0;
    z-index: 100;
    background-color: var(--palette-carbon-deep);
    display: flex;
    flex-direction: column;
    animation: fadeIn-b-fhizbw8sl0 0.3s ease-out;
}

.close-btn[b-fhizbw8sl0] {
    position: absolute;
    top: 1.5rem;
    right: 1.5rem;
    background: none;
    border: none;
    color: var(--palette-white);
    cursor: pointer;
}

    .close-btn:hover[b-fhizbw8sl0] {
        color: var(--palette-primary);
    }

.icon[b-fhizbw8sl0] {
    width: 2.5rem;
    height: 2.5rem;
}

.overlay-content[b-fhizbw8sl0] {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    width: 100%;
    padding: 2rem;
    overflow-y: auto;
}

.mobile-logo[b-fhizbw8sl0] {
    height: 4rem;
    margin-bottom: 3rem;
}

.links-area[b-fhizbw8sl0] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 1.5rem;
    width: 100%;
}

.mobile-link[b-fhizbw8sl0] {
    color: var(--palette-soft-white);
    font-family: 'Montserrat', sans-serif;
    font-size: 1.5rem;
    text-decoration: none;
    transition: color 0.2s;
}

    .mobile-link:hover[b-fhizbw8sl0] {
        color: var(--palette-primary);
    }

.mobile-group[b-fhizbw8sl0] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.5rem;
    padding: 1rem 0;
    border-top: 1px solid rgba(255,255,255,0.1);
    border-bottom: 1px solid rgba(255,255,255,0.1);
    width: 100%;
}

.group-title[b-fhizbw8sl0] {
    color: var(--palette-gray-light);
    text-transform: uppercase;
    font-size: 0.9rem;
    letter-spacing: 0.1em;
}

.mobile-link.sub[b-fhizbw8sl0] {
    font-size: 1.2rem;
}

@keyframes fadeIn-b-fhizbw8sl0 {
    from {
        opacity: 0;
    }

    to {
        opacity: 1;
    }
}
/* _content/ImagineTheFuture.BlazorServer/Shared/TopBarMobileToggle.razor.rz.scp.css */
.mobile-toggle-wrapper[b-tpc4x7qbkm] {
    display: flex;
    align-items: center;
}

/* MAGIA: Ocultar en escritorio (min-width: 978px) */
@media (min-width: 978px) {
    .mobile-toggle-wrapper[b-tpc4x7qbkm] {
        display: none;
    }
}

.hamburger-btn[b-tpc4x7qbkm] {
    background: none;
    border: none;
    color: var(--palette-white);
    padding: 0.5rem;
    cursor: pointer;
    display: flex;
    align-items: center;
    transition: color 0.3s;
}

    .hamburger-btn:hover[b-tpc4x7qbkm] {
        color: var(--palette-primary);
    }

.icon[b-tpc4x7qbkm] {
    width: 2rem;
    height: 2rem;
}
/* _content/ImagineTheFuture.BlazorServer/Shared/TopBarUserMenu.razor.rz.scp.css */
.user-menu-wrapper[b-9bi8syoo4g] {
    position: relative;
    display: flex;
    align-items: center;
}

/* Grupo de botones unificado */
.user-actions-group[b-9bi8syoo4g] {
    display: flex;
    align-items: center;
    background-color: rgba(255, 255, 255, 0.08);
    border: 1px solid rgba(255, 255, 255, 0.15);
    border-radius: 4px;
    transition: all 0.3s ease;
}

    .user-actions-group:hover[b-9bi8syoo4g] {
        background-color: rgba(255, 255, 255, 0.15);
        border-color: var(--palette-primary);
    }

    .user-actions-group.simple[b-9bi8syoo4g] {
        border: none;
        background: transparent;
    }

/* Botones individuales */
.action-btn[b-9bi8syoo4g] {
    background: none;
    border: none;
    color: var(--palette-white);
    padding: 0.6rem 0.8rem;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: color 0.2s;
}

.dashboard-link[b-9bi8syoo4g] {
    border-right: 1px solid rgba(255, 255, 255, 0.1);
}

    .dashboard-link i[b-9bi8syoo4g] {
        color: var(--palette-primary);
        font-size: 1.1rem;
    }

.user-icon[b-9bi8syoo4g] {
    width: 1.5rem;
    height: 1.5rem;
}

.caret-icon[b-9bi8syoo4g] {
    width: 1rem;
    height: 1rem;
    transition: transform 0.2s;
}

    .caret-icon.open[b-9bi8syoo4g] {
        transform: rotate(180deg);
    }

/* Dropdown de Usuario (Alineado a la derecha) */
.user-dropdown[b-9bi8syoo4g] {
    position: absolute;
    top: calc(100% + 10px);
    right: 0;
    z-index: 100;
    width: 300px;
    background-color: var(--palette-carbon-deep);
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-top: 3px solid var(--palette-primary);
    box-shadow: 0 10px 40px rgba(0, 0, 0, 0.5);
    padding: 0.5rem;
    animation: slideIn-b-9bi8syoo4g 0.2s ease-out;
}

.dropdown-header[b-9bi8syoo4g] {
    padding: 0.8rem;
    font-size: 0.8rem;
    color: var(--palette-gray-light);
    border-bottom: 1px solid rgba(255, 255, 255, 0.1);
    margin-bottom: 0.5rem;
    text-align: center;
}

.dropdown-item[b-9bi8syoo4g] {
    display: block;
    width: 100%;
    text-align: left;
    padding: 0.8rem 1rem;
    background: transparent;
    border: none;
    color: var(--palette-soft-white);
    font-family: 'Montserrat', sans-serif;
    font-size: 0.9rem;
    cursor: pointer;
    text-decoration: none;
    transition: all 0.2s;
}

    .dropdown-item:hover[b-9bi8syoo4g] {
        background-color: rgba(255, 255, 255, 0.05);
        color: var(--palette-primary);
        padding-left: 1.2rem;
    }

    .dropdown-item.highlight[b-9bi8syoo4g] {
        font-weight: 600;
        color: var(--palette-primary);
    }

/* Click Catcher */
.click-catcher[b-9bi8syoo4g] {
    position: fixed;
    inset: 0;
    z-index: 90;
    background: transparent;
}

@keyframes slideIn-b-9bi8syoo4g {
    from {
        opacity: 0;
        transform: translateY(-5px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}
/* _content/ImagineTheFuture.BlazorServer/Shared/UserDropdown.razor.rz.scp.css */
/*
 * UserDropdown.razor.css
 * Menú de usuario y switcher para CLIENTE
 * TEMA: Light / Engineering Blueprint (Fondo Blanco, Texto Oscuro)
 */

/* 1. BACKDROP (El fondo invisible/tenue que cubre todo) */
.user-menu-backdrop[b-jo7vyyd8fc] {
    position: fixed;
    /* Usamos inset: 0 para evitar problemas de scroll */
    inset: 0;
    z-index: 2000; /* Encima de todo */
    cursor: default;
    background-color: rgba(0, 0, 0, 0.05); /* Sutil */
}

/* 2. EL PANEL (La cajita del menú) */
.user-menu-panel[b-jo7vyyd8fc] {
    position: absolute;
    /* Posición relativa a la ventana (Fixed) para que no dependa del scroll del padre */
    top: 75px; /* Ajustar según la altura de tu TopBar */
    right: 20px;
    width: 320px; /* Ancho cómodo para el login in-place */
    /* ESTILO LIGHT */
    background-color: #FFFFFF; /* Fondo Blanco Puro */
    border: 1px solid #E5E7EB; /* Borde gris sutil */
    border-top: 3px solid var(--palette-primary); /* Acento superior Azul */
    border-radius: 4px; /* Bordes técnicos */
    /* Sombra para profundidad en modo claro */
    box-shadow: 0 10px 40px rgba(0, 0, 0, 0.15);
    display: flex;
    flex-direction: column;
    padding: 0.5rem 0;
    animation: slideIn-b-jo7vyyd8fc 0.2s cubic-bezier(0.4, 0, 0.2, 1);
    /* Texto base oscuro */
    color: var(--palette-carbon-deep);
    overflow: hidden;
}

/* 3. ELEMENTOS DEL MENÚ (Links y Botones) */

/* Clase base para TODO ítem (<a> o <button>) */
.btn-menu-item[b-jo7vyyd8fc] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 0.8rem 1.25rem;
    width: 100%;
    /* Reset de estilos de botón nativo */
    background: none;
    border: none;
    font-family: 'Montserrat', sans-serif;
    font-size: 0.95rem;
    /* Texto oscuro técnico */
    color: var(--palette-gray-mid);
    text-decoration: none;
    text-align: left;
    cursor: pointer;
    transition: all 0.2s ease;
}

    .btn-menu-item:hover[b-jo7vyyd8fc] {
        background-color: #F9FAFB; /* Gris muy pálido al hover */
        color: var(--palette-primary); /* Azul al hover */
    }

    .btn-menu-item.disabled[b-jo7vyyd8fc] {
        opacity: 0.5;
        cursor: not-allowed;
        background-color: #F3F4F6;
    }

/* Iconos con ancho fijo */
.icon-width[b-jo7vyyd8fc] {
    width: 20px;
    text-align: center;
    color: #9CA3AF; /* Gris suave por defecto */
    transition: color 0.2s;
}

.btn-menu-item:hover .icon-width[b-jo7vyyd8fc] {
    color: var(--palette-primary);
}

.gold-icon[b-jo7vyyd8fc] {
    color: var(--palette-primary); /* Reemplazamos "gold" por Primary */
}

/* [FIX] RESET ESPECÍFICO PARA BOTÓN LOGOUT */
.btn-logout-reset[b-jo7vyyd8fc] {
    margin: 0;
    border-radius: 0;
    color: var(--palette-danger); /* Logout en rojo sutil */
}

    .btn-logout-reset:hover[b-jo7vyyd8fc] {
        background-color: rgba(229, 62, 62, 0.05);
        color: var(--palette-danger);
    }

        .btn-logout-reset:hover .icon-width[b-jo7vyyd8fc] {
            color: var(--palette-danger);
        }

/* 4. CABECERAS Y SEPARADORES */

.menu-header-profile[b-jo7vyyd8fc] {
    padding: 0.8rem 1.25rem;
    display: flex;
    flex-direction: column;
    background-color: #F9FAFB; /* Header gris claro */
    border-bottom: 1px solid #E5E7EB;
}

.profile-name[b-jo7vyyd8fc] {
    font-weight: 700;
    color: var(--palette-carbon-deep); /* Texto fuerte */
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    font-size: 0.95rem;
}

.profile-subtext[b-jo7vyyd8fc] {
    font-size: 0.75rem;
    color: var(--palette-gray-mid);
    margin-top: 2px;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    font-weight: 600;
}

.menu-header[b-jo7vyyd8fc] {
    padding: 0.25rem 0;
}

.menu-divider[b-jo7vyyd8fc] {
    height: 1px;
    background-color: #E5E7EB; /* Divisor gris claro */
    margin: 0.5rem 0;
}

/* 5. LISTA DE RELOJES (Scrollable) */
.scrollable-list[b-jo7vyyd8fc] {
    max-height: 300px;
    overflow-y: auto;
    scrollbar-width: thin;
    scrollbar-color: var(--palette-gray-light) #FFFFFF;
}

/* Ítem de Reloj */
.watch-item[b-jo7vyyd8fc] {
    justify-content: flex-start;
}

    /* Reloj Activo */
    .watch-item.active[b-jo7vyyd8fc] {
        background-color: rgba(0, 163, 224, 0.08); /* Fondo azul tenue */
        color: var(--palette-carbon-deep);
        font-weight: 600;
        border-left: 3px solid var(--palette-primary); /* Indicador izquierdo */
        padding-left: calc(1.25rem - 3px); /* Compensar borde */
    }

.mini-avatar[b-jo7vyyd8fc] {
    width: 32px;
    height: 32px;
    border-radius: 4px; /* Avatar cuadrado técnico */
    background-color: #F3F4F6;
    overflow: hidden;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    border: 1px solid #E5E7EB;
}

    .mini-avatar img[b-jo7vyyd8fc] {
        width: 100%;
        height: 100%;
        object-fit: cover;
    }

    .mini-avatar i[b-jo7vyyd8fc] {
        font-size: 1.2rem;
        color: #9CA3AF;
    }

.item-text[b-jo7vyyd8fc] {
    flex-grow: 1;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.check-icon[b-jo7vyyd8fc] {
    color: var(--palette-primary);
    font-size: 0.9rem;
}

/* 6. CONTENEDOR DE AUTH (Login/Registro In-Place) */
.dropdown-auth-container[b-jo7vyyd8fc] {
    padding: 0.5rem 1rem 1rem 1rem;
    max-height: 70vh;
    overflow-y: auto;
    /* Fondo ligeramente diferente para distinguir el área de form */
    background-color: #FFFFFF;
}

/* Animación */
@keyframes slideIn-b-jo7vyyd8fc {
    from {
        opacity: 0;
        transform: translateY(-10px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* RESPONSIVO */
@media (max-width: 992px) {
    .user-menu-panel[b-jo7vyyd8fc] {
        top: 65px;
        right: 10px;
        left: 10px; /* Ancho completo con margenes */
        width: auto;
        max-width: 400px;
        margin: 0 auto; /* Centrado */
    }
}
/* _content/ImagineTheFuture.BlazorServer/Shared/UserProfileDropdown.razor.rz.scp.css */
/* * UserProfileDropdown.razor.css
 * Menú desplegable para el Layout de Perfil
 * TEMA: Light / Engineering Blueprint
 */

/* 1. BACKDROP */
.user-menu-backdrop[b-tswj3viony] {
    position: fixed;
    inset: 0;
    z-index: 2000;
    cursor: default;
    background-color: rgba(0, 0, 0, 0.05);
}

/* 2. PANEL DEL MENÚ */
.user-menu-panel[b-tswj3viony] {
    position: absolute;
    top: 75px;
    right: 20px;
    width: 320px;
    /* ESTILO LIGHT */
    background-color: #FFFFFF;
    border: 1px solid #E5E7EB;
    border-top: 3px solid var(--palette-primary);
    border-radius: 4px;
    box-shadow: 0 10px 40px rgba(0, 0, 0, 0.15);
    display: flex;
    flex-direction: column;
    padding: 0.5rem 0;
    animation: slideIn-b-tswj3viony 0.2s cubic-bezier(0.4, 0, 0.2, 1);
    color: var(--palette-carbon-deep);
    overflow: hidden;
}

/* 3. ÍTEMS DE MENÚ */
.btn-menu-item[b-tswj3viony] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 0.8rem 1.25rem;
    width: 100%;
    background: none;
    border: none;
    font-family: 'Montserrat', sans-serif;
    font-size: 0.95rem;
    color: var(--palette-gray-mid);
    text-decoration: none;
    text-align: left;
    cursor: pointer;
    transition: all 0.2s ease;
}

    .btn-menu-item:hover[b-tswj3viony] {
        background-color: #F9FAFB;
        color: var(--palette-primary);
    }

    .btn-menu-item.disabled[b-tswj3viony] {
        opacity: 0.5;
        cursor: not-allowed;
        background-color: #F3F4F6;
    }

/* Enlace especial de Retorno */
.return-link[b-tswj3viony] {
    color: var(--palette-primary);
    font-weight: 600;
}

    .return-link:hover[b-tswj3viony] {
        background-color: rgba(0, 163, 224, 0.05);
    }

/* Logout */
.btn-logout-reset[b-tswj3viony] {
    margin: 0;
    border-radius: 0;
    color: var(--palette-danger);
}

    .btn-logout-reset:hover[b-tswj3viony] {
        background-color: rgba(229, 62, 62, 0.05);
        color: var(--palette-danger);
    }

        .btn-logout-reset:hover .icon-width[b-tswj3viony] {
            color: var(--palette-danger);
        }

/* Iconos */
.icon-width[b-tswj3viony] {
    width: 20px;
    text-align: center;
    color: #9CA3AF;
    transition: color 0.2s;
}

.btn-menu-item:hover .icon-width[b-tswj3viony] {
    color: var(--palette-primary);
}

/* 4. CABECERAS */
.menu-header-profile[b-tswj3viony] {
    padding: 0.8rem 1.25rem;
    display: flex;
    flex-direction: column;
    background-color: #F9FAFB;
    border-bottom: 1px solid #E5E7EB;
}

.profile-name[b-tswj3viony] {
    font-weight: 700;
    color: var(--palette-carbon-deep);
    font-size: 0.95rem;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.profile-subtext[b-tswj3viony] {
    font-size: 0.75rem;
    color: var(--palette-gray-mid);
    margin-top: 2px;
    text-transform: uppercase;
    font-weight: 600;
}

.menu-header[b-tswj3viony] {
    padding: 0.25rem 0;
}

.menu-divider[b-tswj3viony] {
    height: 1px;
    background-color: #E5E7EB;
    margin: 0.5rem 0;
}

/* 5. LISTA DE RELOJES */
.scrollable-list[b-tswj3viony] {
    max-height: 300px;
    overflow-y: auto;
    scrollbar-width: thin;
    scrollbar-color: var(--palette-gray-light) #FFFFFF;
}

.watch-item[b-tswj3viony] {
    justify-content: flex-start;
}

    .watch-item.active[b-tswj3viony] {
        background-color: rgba(0, 163, 224, 0.08);
        color: var(--palette-carbon-deep);
        font-weight: 600;
        border-left: 3px solid var(--palette-primary);
        padding-left: calc(1.25rem - 3px);
    }

.mini-avatar[b-tswj3viony] {
    width: 32px;
    height: 32px;
    border-radius: 4px;
    background-color: #F3F4F6;
    overflow: hidden;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    border: 1px solid #E5E7EB;
}

    .mini-avatar img[b-tswj3viony] {
        width: 100%;
        height: 100%;
        object-fit: cover;
    }

    .mini-avatar i[b-tswj3viony] {
        font-size: 1.2rem;
        color: #9CA3AF;
    }

.item-text[b-tswj3viony] {
    flex-grow: 1;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.check-icon[b-tswj3viony] {
    color: var(--palette-primary);
    font-size: 0.9rem;
}

/* 6. AUTH */
.dropdown-auth-container[b-tswj3viony] {
    padding: 0.5rem 1rem 1rem 1rem;
    max-height: 70vh;
    overflow-y: auto;
    background-color: #FFFFFF;
}

@keyframes slideIn-b-tswj3viony {
    from {
        opacity: 0;
        transform: translateY(-10px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@media (max-width: 992px) {
    .user-menu-panel[b-tswj3viony] {
        top: 65px;
        right: 10px;
        left: 10px;
        width: auto;
        max-width: 400px;
        margin: 0 auto;
    }
}
/* _content/ImagineTheFuture.BlazorServer/Shared/UserProfileLayout.razor.rz.scp.css */
/*
 * UserProfileLayout.razor.css
 * Estilos para el entorno de configuración de cuenta
 * TEMA: Light / Clean Configuration
*/

.profile-layout[b-vbn20lvtq4] {
    display: flex;
    /* Fondo muy claro para descansar la vista en formularios */
    background-color: var(--palette-soft-white);
    color: var(--palette-carbon-deep);
    width: 100%;
    overflow-x: hidden;
    position: relative;
    min-height: 100vh;
}

.page-container[b-vbn20lvtq4] {
    flex-grow: 1;
    display: flex;
    flex-direction: column;
    margin-left: 78px; /* Ancho colapsado */
    transition: margin-left 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    width: 100%;
    max-width: 100%;
    min-height: 100vh; /* Asegura altura para el sticky footer */
}

.app-main-content[b-vbn20lvtq4] {
    flex-grow: 1;
    overflow-y: auto;
    padding: 2rem; /* Espaciado cómodo */
    width: 100%;
    /* Scrollbar sutil */
    scrollbar-width: thin;
    scrollbar-color: var(--palette-gray-light) var(--palette-soft-white);
}

/* --- OVERLAY MÓVIL --- */
.mobile-nav-overlay[b-vbn20lvtq4] {
    position: fixed;
    inset: 0;
    background-color: rgba(0, 0, 0, 0.5);
    backdrop-filter: blur(2px);
    z-index: 1099;
    animation: fadeInOverlay-b-vbn20lvtq4 0.3s;
}

@keyframes fadeInOverlay-b-vbn20lvtq4 {
    from {
        opacity: 0;
    }

    to {
        opacity: 1;
    }
}

/* --- FOOTER INTEGRADO (Estilo Claro) --- */
.profile-footer[b-vbn20lvtq4] {
    padding: 2rem 1.5rem;
    text-align: center;
    margin-top: auto; /* Sticky footer behavior */
    border-top: 1px solid rgba(0,0,0,0.05); /* Separador muy sutil */
    background-color: var(--palette-soft-white);
}

.footer-content[b-vbn20lvtq4] {
    display: flex;
    flex-direction: column;
    gap: 0.3rem;
    align-items: center;
    opacity: 0.6;
    transition: opacity 0.3s;
}

    .footer-content:hover[b-vbn20lvtq4] {
        opacity: 1;
    }

.brand-text[b-vbn20lvtq4] {
    font-family: 'Montserrat', sans-serif;
    font-weight: 800;
    letter-spacing: 0.2em;
    color: var(--palette-primary);
    font-size: 1rem;
    margin: 0;
    text-transform: uppercase;
}

.copyright[b-vbn20lvtq4] {
    font-family: 'Montserrat', sans-serif;
    font-size: 0.75rem;
    color: var(--palette-gray-mid);
    margin: 0;
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

/* --- RESPONSIVIDAD --- */
@media (max-width: 992px) {
    .page-container[b-vbn20lvtq4],
    .profile-layout.sidebar-collapsed .page-container[b-vbn20lvtq4] {
        margin-left: 0;
    }

    .app-main-content[b-vbn20lvtq4] {
        /* Ajuste para no chocar con la TopBar móvil */
        padding: 80px 1rem 2rem;
    }
}