/* ===============================
   SYSTECK BLUE THEME (#03687A)
   Aplica a login, register y dashboard
=================================*/

/* Color institucional */
:root {
    --pf-brand: #03687A;
}

/* Barra superior en toda la app autenticada */
.navbar,
.navbar.navbar-laravel,
header,
.top-nav,
.bg-success,
.bg-primary {
    background-color: var(--pf-brand) !important;
    border-color: var(--pf-brand) !important;
}

/* Botones principales (login, registro, publicar, etc.) */
.btn-primary,
button.btn-primary,
input[type="submit"].btn-primary,
.btn-success,
button.btn-success,
input[type="submit"].btn-success {
    background-color: var(--pf-brand) !important;
    border-color: var(--pf-brand) !important;
    color: #ffffff !important;
}

/* Hover de botones principales */
.btn-primary:hover,
button.btn-primary:hover,
.btn-success:hover,
button.btn-success:hover {
    background-color: #024f5c !important;
    border-color: #024f5c !important;
    color: #ffffff !important;
}

/* Botones outline en azul */
.btn-outline-primary,
.btn-outline-success {
    border-color: var(--pf-brand) !important;
    color: var(--pf-brand) !important;
}

.btn-outline-primary:hover,
.btn-outline-success:hover {
    background-color: var(--pf-brand) !important;
    border-color: var(--pf-brand) !important;
    color: #ffffff !important;
}

/* Paginación activa */
.page-item.active .page-link {
    background-color: var(--pf-brand) !important;
    border-color: var(--pf-brand) !important;
}

/* Stories: anillos activos en azul */
.story-ring,
.avatar-ring,
.profile-photo-ring {
    border-color: var(--pf-brand) !important;
}

/* Inputs en foco (borde azul) */
input:focus,
textarea:focus,
select:focus {
    border-color: var(--pf-brand) !important;
    box-shadow: 0 0 0 0.2rem rgba(3, 104, 122, 0.35) !important;
}

/* Switch / checkbox */
.form-switch .form-check-input:checked {
    background-color: var(--pf-brand) !important;
    border-color: var(--pf-brand) !important;
}

input[type="checkbox"]:checked {
    accent-color: var(--pf-brand) !important;
}

/* Fondo blanco por defecto para evitar restos de imágenes viejas */
body {
    background-color: #ffffff !important;
}