/**
 * Paleta de colores Platilio
 * Azul Principal: #243060
 * Azul bajo:      #0b5da9
 * Azul alterno:   #0075fa
 */

:root {
    --platilio-primary: #243060;
    --platilio-secondary: #0b5da9;
    --platilio-accent: #0075fa;
    --platilio-primary-rgb: 36, 48, 96;
    --platilio-secondary-rgb: 11, 93, 169;
    --platilio-accent-rgb: 0, 117, 250;

    /* Compatibilidad con landing y componentes Vue */
    --primary-color: var(--platilio-primary);
    --secondary-color: var(--platilio-secondary);
    --accent-color: var(--platilio-accent);

    --bs-primary: var(--platilio-secondary);
    --bs-primary-rgb: var(--platilio-secondary-rgb);
}

/* Botones */
/* Espaciado entre botones adyacentes */
.btn + .btn,
.btn + .btn-group,
.btn-group + .btn,
.btn-group + .btn-group {
    margin-inline-start: 0.5rem !important;
}

.input-group .btn + .btn,
.input-group .btn + .btn-group,
.input-group .btn-group + .btn,
.input-group .btn-group + .btn-group {
    margin-inline-start: 0 !important;
}

.btn-primary {
    border-color: var(--platilio-secondary) !important;
    background-color: var(--platilio-secondary) !important;
    background-image: none !important;
}

.btn-primary:focus,
.btn-primary:active,
.btn-primary.active {
    border-color: var(--platilio-primary) !important;
    background-color: var(--platilio-primary) !important;
    box-shadow: 0 8px 25px rgba(var(--platilio-secondary-rgb), 0.4) !important;
}

.btn-primary:hover:not(.disabled):not(:disabled) {
    border-color: var(--platilio-accent) !important;
    background-color: var(--platilio-accent) !important;
    box-shadow: 0 8px 25px rgba(var(--platilio-accent-rgb), 0.35) !important;
}

.btn-outline-primary {
    color: var(--platilio-secondary) !important;
    border-color: var(--platilio-secondary) !important;
}

.btn-outline-primary:hover:not(.disabled):not(:disabled),
.btn-outline-primary:focus,
.btn-check:checked + .btn-outline-primary {
    color: #fff !important;
    background-color: var(--platilio-secondary) !important;
    border-color: var(--platilio-secondary) !important;
}

.btn-gradient,
.btn-gradient-primary {
    background: linear-gradient(135deg, var(--platilio-secondary) 0%, var(--platilio-accent) 100%) !important;
    border: none !important;
    color: #fff !important;
}

.btn-gradient:hover,
.btn-gradient-primary:hover {
    background: linear-gradient(135deg, var(--platilio-primary) 0%, var(--platilio-secondary) 100%) !important;
    box-shadow: 0 10px 20px rgba(var(--platilio-secondary-rgb), 0.3) !important;
}

/* Texto y fondos */
.text-primary {
    color: var(--platilio-secondary) !important;
}

.bg-primary {
    background-color: var(--platilio-primary) !important;
}

.border-primary {
    border-color: var(--platilio-secondary) !important;
}

.border-top-primary {
    border-top-color: var(--platilio-secondary) !important;
}

.border-bottom-primary {
    border-bottom-color: var(--platilio-secondary) !important;
}

.border-start-primary {
    border-left-color: var(--platilio-secondary) !important;
}

.border-end-primary {
    border-right-color: var(--platilio-secondary) !important;
}

.bg-light-primary {
    background-color: rgba(var(--platilio-secondary-rgb), 0.12) !important;
    color: var(--platilio-secondary) !important;
}

.badge.badge-light-primary,
.badge-light-primary {
    background-color: rgba(var(--platilio-secondary-rgb), 0.12) !important;
    color: var(--platilio-secondary) !important;
}

.avatar.bg-light-primary {
    color: var(--platilio-secondary) !important;
}

.alert-primary {
    background-color: rgba(var(--platilio-secondary-rgb), 0.12) !important;
    color: var(--platilio-secondary) !important;
}

.table-primary {
    --bs-table-bg: rgba(var(--platilio-secondary-rgb), 0.1);
    --bs-table-striped-bg: rgba(var(--platilio-secondary-rgb), 0.14);
}

/* Formularios */
.form-check-input:checked {
    background-color: var(--platilio-secondary) !important;
    border-color: var(--platilio-secondary) !important;
}

.form-check-primary .form-check-input:checked {
    background-color: var(--platilio-secondary) !important;
    border-color: var(--platilio-secondary) !important;
}

.form-control:focus,
.form-select:focus {
    border-color: var(--platilio-accent) !important;
    box-shadow: 0 0 0 0.2rem rgba(var(--platilio-accent-rgb), 0.25) !important;
}

.form-switch .form-check-input:checked {
    background-color: var(--platilio-secondary) !important;
    border-color: var(--platilio-secondary) !important;
}

/* Navegación horizontal (admin) */
.horizontal-menu .navbar-nav .active > a,
.horizontal-menu .navbar-nav .router-link-active {
    color: var(--platilio-secondary) !important;
}

:deep(.router-link-active),
.router-link-active {
    color: var(--platilio-secondary) !important;
}

/* Menú vertical (tenant) */
body.vertical-layout.vertical-menu-modern .dropdown-item:hover {
    background-color: rgba(var(--platilio-secondary-rgb), 0.12);
    color: var(--platilio-secondary);
}

body.vertical-layout.vertical-menu-modern .navigation .nav-item a:hover {
    background-color: rgba(var(--platilio-secondary-rgb), 0.12);
}

body.vertical-layout.vertical-menu-modern .navigation .nav-item .router-link-active {
    background: linear-gradient(118deg, var(--platilio-secondary), rgba(var(--platilio-secondary-rgb), 0.7));
    box-shadow: 0 0 10px 1px rgba(var(--platilio-secondary-rgb), 0.7);
}

body.vertical-layout.vertical-menu-modern .menu-content li a:hover {
    background-color: rgba(var(--platilio-secondary-rgb), 0.08);
}

/* Dropzone */
.dropzone {
    border-color: var(--platilio-secondary) !important;
}

.dropzone .dz-message {
    color: var(--platilio-secondary) !important;
}

/* Scrollbar */
::-webkit-scrollbar-thumb {
    background: rgba(var(--platilio-secondary-rgb), 0.4);
}

::-webkit-scrollbar-thumb:hover {
    background: rgba(var(--platilio-secondary-rgb), 0.6);
}

/* Pricing cards (público) */
.pricing-card.featured {
    border-color: var(--platilio-secondary) !important;
}

.pricing-card.featured::before {
    background: linear-gradient(135deg, var(--platilio-secondary) 0%, var(--platilio-accent) 100%) !important;
}

/* Wizard / steps */
.step-item.active .step-number {
    background-color: var(--platilio-secondary) !important;
    border-color: var(--platilio-secondary) !important;
    box-shadow: 0 0 0 4px rgba(var(--platilio-secondary-rgb), 0.1) !important;
}

.step-item.active .step-label {
    color: var(--platilio-secondary) !important;
}

/* SweetAlert2 */
.swal2-styled.swal2-confirm {
    background-color: var(--platilio-secondary) !important;
}

.swal2-styled.swal2-confirm:focus {
    box-shadow: 0 0 0 3px rgba(var(--platilio-secondary-rgb), 0.5) !important;
}