/* Global styles for the WayTickets application */

:root .lpx-brand-logo {
    --lpx-logo: url('/images/logo/leptonx/logo-light.png');
    --lpx-logo-icon: url('/images/logo/leptonx/logo-light-thumbnail.png');
}

.spinner {
    width: 40px;
    height: 40px;
    display: block;
    position: fixed;
    top: calc( 50% - ( 40px / 2) );
    right: calc( 50% - ( 40px / 2) );
}

.double-bounce1, .double-bounce2 {
    width: 100%;
    height: 100%;
    border-radius: 50%;
    background-color: #333;
    opacity: 0.6;
    position: absolute;
    top: 0;
    left: 0;
    -webkit-animation: sk-bounce 2.0s infinite ease-in-out;
    animation: sk-bounce 2.0s infinite ease-in-out;
}

.double-bounce2 {
    -webkit-animation-delay: -1.0s;
    animation-delay: -1.0s;
}

@-webkit-keyframes sk-bounce {
    0%, 100% {
        -webkit-transform: scale(0.0)
    }

    50% {
        -webkit-transform: scale(1.0)
    }
}

@keyframes sk-bounce {
    0%, 100% {
        transform: scale(0.0);
        -webkit-transform: scale(0.0);
    }

    50% {
        transform: scale(1.0);
        -webkit-transform: scale(1.0);
    }
}

#ApplicationContainer > div:first-child:not(:only-child) {
    display: none !important;
}

/* ── Graphik font ─────────────────────────────────────────────────────────── */
/* Mismos archivos que usa Denuncia Segura (C:\Users\pedro\DenunciaSegura), mismo dueño. */

@font-face {
    font-family: 'Graphik';
    src: url('/fonts/Graphik-Regular.ttf') format('truetype');
    font-weight: 400;
    font-display: swap;
}

@font-face {
    font-family: 'Graphik';
    src: url('/fonts/Graphik-Medium.ttf') format('truetype');
    font-weight: 600;
    font-display: swap;
}

/* ── Reset / base ─────────────────────────────────────────────────────────── */

*, *::before, *::after { box-sizing: border-box; }

html, body {
    margin: 0;
    padding: 0;
    height: 100%;
    font-family: 'Graphik', 'Segoe UI', system-ui, -apple-system, sans-serif;
    font-size: 14px;
    -webkit-font-smoothing: antialiased;
}

a { text-decoration: none; color: inherit; }
button { font-family: inherit; }

/*
 * Tokens de estructura (radio, sombra, semánticos) — NO se toca --wt-primary acá:
 * ese vive en MainLayout.razor.css y se resuelve dinámicamente por tenant
 * (ver MainLayout.razor.cs, _theme/MudTheme construido en runtime desde
 * ConfiguracionTenant.ColorPrimario). Mezclar un --mud-palette-primary fijo acá
 * pisaría ese mecanismo ya verificado funcionando.
 */
:root {
    --wt-radius-sm: 6px;
    --wt-radius-md: 10px;
    --wt-radius-lg: 14px;
    --wt-shadow-sm: 0 1px 4px rgba(26,32,64,.05);
    --wt-shadow-md: 0 2px 12px rgba(26,32,64,.08);
    --wt-shadow-lg: 0 4px 24px rgba(26,32,64,.12);
    --wt-success: #10b981;
    --wt-warning: #f59e0b;
    --wt-error: #ef4444;
    --wt-info: #3b82f6;

    /* MudBlazor — todo lo que no depende del color de marca */
    --mud-default-borderradius:         var(--wt-radius-sm);
    --mud-elevation-1:                  var(--wt-shadow-sm);
    --mud-elevation-2:                  var(--wt-shadow-sm);
    --mud-elevation-4:                  var(--wt-shadow-md);
    --mud-elevation-8:                  var(--wt-shadow-md);
    --mud-typography-default-family:    'Graphik','Segoe UI',system-ui,sans-serif;
    --mud-typography-body1-family:      'Graphik','Segoe UI',system-ui,sans-serif;
    --mud-typography-body2-family:      'Graphik','Segoe UI',system-ui,sans-serif;
    --mud-typography-button-family:     'Graphik','Segoe UI',system-ui,sans-serif;
    --mud-typography-h5-family:         'Graphik','Segoe UI',system-ui,sans-serif;
    --mud-typography-h6-family:         'Graphik','Segoe UI',system-ui,sans-serif;
    --mud-typography-subtitle1-family:  'Graphik','Segoe UI',system-ui,sans-serif;
    --mud-typography-subtitle2-family:  'Graphik','Segoe UI',system-ui,sans-serif;
    --mud-typography-caption-family:    'Graphik','Segoe UI',system-ui,sans-serif;
}

/* ── Scrollbars ───────────────────────────────────────────────────────────── */

::-webkit-scrollbar { width: 5px; height: 5px; }
::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb { background: #d0d7e8; border-radius: 10px; }
::-webkit-scrollbar-thumb:hover { background: #b0bcd4; }

/* ══════════════════════════════════════════════════════════════════════════
   MUDBLAZOR OVERRIDES — estructura (radio/sombra/tipografía), no color primario
   ══════════════════════════════════════════════════════════════════════════ */

/* Cards & Paper */
.mud-card,
.mud-paper {
    border-radius: var(--wt-radius-lg) !important;
    box-shadow: var(--wt-shadow-md) !important;
    border: none !important;
}

.mud-paper-outlined {
    box-shadow: none !important;
    border-radius: var(--wt-radius-md) !important;
}

.mud-elevation-0 { box-shadow: none !important; }

/* Tables */
.mud-table-root {
    border-radius: var(--wt-radius-lg) !important;
    overflow: hidden !important;
    box-shadow: none !important;
}

.mud-table-head .mud-table-row .mud-table-cell {
    background: #f7f9fc !important;
    font-size: 11px !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.06em !important;
    padding: 10px 16px !important;
}

.mud-table-body .mud-table-row .mud-table-cell {
    padding: 10px 16px !important;
    font-size: 13px !important;
}

.mud-table-body .mud-table-row:last-child .mud-table-cell { border-bottom: none !important; }
.mud-table-body .mud-table-row:hover { background: #f7f9fc !important; }

/* Buttons */
.mud-button-root {
    border-radius: var(--wt-radius-sm) !important;
    font-weight: 600 !important;
    letter-spacing: 0.01em !important;
    text-transform: none !important;
    font-size: 13px !important;
}

.mud-button-root.mud-button-size-small {
    height: 30px !important;
    font-size: 12px !important;
    padding: 0 10px !important;
    min-width: 0 !important;
}

.mud-icon-button.mud-button-size-small {
    padding: 4px !important;
    height: 30px !important;
    width: 30px !important;
}

/* Inputs */
.mud-input-root { border-radius: var(--wt-radius-sm) !important; font-size: 13px !important; }

/* Dialogs */
.mud-dialog { border-radius: var(--wt-radius-lg) !important; box-shadow: var(--wt-shadow-lg) !important; overflow: hidden !important; }
.mud-dialog-title { font-size: 15px !important; font-weight: 600 !important; padding: 20px 24px 0 !important; }
.mud-dialog-content { padding: 16px 24px !important; }
.mud-dialog-actions { padding: 12px 20px 16px !important; }

/* Tabs */
.mud-tab { font-size: 13px !important; font-weight: 500 !important; text-transform: none !important; letter-spacing: 0 !important; }
.mud-tab.mud-tab-active { font-weight: 600 !important; }
.mud-tab-slider { height: 2px !important; }

/* Chips */
.mud-chip { border-radius: 20px !important; font-size: 12px !important; font-weight: 600 !important; height: 24px !important; }

/* Typography */
.mud-typography-h6 { font-size: 15px !important; font-weight: 600 !important; letter-spacing: -0.01em !important; }
.mud-typography-subtitle2 { font-size: 12px !important; }

/* Alerts */
.mud-alert { border-radius: var(--wt-radius-md) !important; font-size: 13px !important; }

/* Estilo leptonx heredado del template, sin uso real */
.lpx-language-switch,
.abp-language-switch { display: none !important; }
