/* Estilos personalizados */

/* Vista de clientes: aumentar tamaño de fuente de los datos */
:root {
    --bs-body-bg: #ffffff;
}

html {
    background: none !important;
    background-color: #eef1f4 !important;
}

body {
    --bs-body-bg: #ffffff;
    background-color: #eef1f4 !important;
}

.clients-table tbody td { font-size: 0.875rem; }

/* Mantener tamaño cómodo para botones en columna de acciones */
.clients-table tbody td.actions-cell .btn { font-size: 0.875rem; }

/* Dashboard: listado de próximos vencimientos */
.proximos-vencimientos-table,
.proximos-vencimientos-table th,
.proximos-vencimientos-table td,
.proximos-vencimientos-table .badge {
    font-size: 14px !important;
}

/* (Servicios) Se usan las mismas clases y layout que en Clientes (d-grid en TD.actions-cell). */

/* Login: fondo con imagen y ajustes visuales */
body.login-page {
    /* Intenta variante-login y cae a fondo-login si no existe (útil si falta el archivo en prod) */
    background: #0d1117 url('../img/variante-login.webp') center/cover no-repeat fixed !important;
    background-image: url('../img/variante-login.webp'), url('../img/fondo-login.webp') !important;
    min-height: 100vh;
}

body.login-page .container {
    min-height: calc(100vh - 64px);
    display: flex;
    align-items: center;
    justify-content: center;
    margin-top: 0 !important;
}

body.login-page .navbar {
    background-color: rgba(33, 37, 41, 0.85) !important;
    backdrop-filter: blur(2px);
}

body.login-page .login-row {
    width: 100%;
}

body.login-page .login-card {
    background-color: rgba(255, 255, 255, 0.9);
    border: none;
    backdrop-filter: blur(2px);
}

.navbar-logo {
    height: 36px;
    width: auto;
    display: block;
    padding-left: 2rem;
}

/* Empuja el contenido del navbar desde el contenedor */
.navbar > .container-fluid {
    padding-left: 2% !important;
    padding-right: 2%;
}

.login-logo {
    max-height: 90px;
    width: auto;
}

.login-password-group .login-password-toggle {
    min-width: 48px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: #495057;
}

.login-password-group .login-password-icon {
    width: 18px;
    height: 18px;
    display: inline-flex;
}

.login-password-group .login-password-icon svg {
    width: 100%;
    height: 100%;
    fill: currentColor;
    display: block;
}

.login-password-group .login-password-fa-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 16px;
    line-height: 1;
}

.login-password-group .login-password-fa-icon.login-password-icon-hide,
.login-password-group .login-password-fa-icon.d-none {
    display: none !important;
}

.login-password-group .login-password-icon {
    display: none !important;
}

.settings-logo-preview {
    max-height: 120px;
    width: auto;
    border-radius: 6px;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.08);
}

/* Separacion del menu principal */
.navbar .navbar-nav.me-auto {
    margin-left: 2% !important;
    padding-left: 2%;
}

.dropdown-item-icon {
    display: flex;
    align-items: center;
    gap: 0.7rem;
}

.dropdown-item-icon-symbol {
    width: 1rem;
    height: 1rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: #495057;
    flex-shrink: 0;
}

.dropdown-item-icon-symbol svg {
    width: 100%;
    height: 100%;
    display: block;
}