/* ============================================
   Tema personalizado — Inventario de Renta
   Se carga DESPUÉS de bootstrap.min.css para sobreescribir colores.
   ============================================ */

:root {
    --bs-primary: #1d4e89;
    --bs-primary-rgb: 29, 78, 137;
    --bs-link-color: #1d4e89;
    --bs-link-hover-color: #2e6bb0;

    /* Paleta propia para casos donde Bootstrap no expone variable directa */
    --color-primario: #1d4e89;
    --color-primario-claro: #2e6bb0;
    --color-ok: #1b8a4b;
    --color-alerta: #b3261e;
}

body {
    background-color: #f4f6f9;
}

/* Botones primarios con la paleta azul propia (Bootstrap calcula hover/active a partir de --bs-primary,
   pero forzamos explícitamente para que coincida exacto con el diseño anterior). */
.btn-primary {
    --bs-btn-bg: #1d4e89;
    --bs-btn-border-color: #1d4e89;
    --bs-btn-hover-bg: #2e6bb0;
    --bs-btn-hover-border-color: #2e6bb0;
    --bs-btn-active-bg: #18406f;
    --bs-btn-active-border-color: #18406f;
}

.btn-outline-primary {
    --bs-btn-color: #1d4e89;
    --bs-btn-border-color: #1d4e89;
    --bs-btn-hover-bg: #1d4e89;
    --bs-btn-hover-border-color: #1d4e89;
}

.text-primary { color: #1d4e89 !important; }

/* Navbar / sidebar del panel admin */
.sidebar-admin {
    background-color: #1d4e89;
}

.sidebar-admin .nav-link {
    color: #cfe0f2;
}

.sidebar-admin .nav-link:hover,
.sidebar-admin .nav-link.active {
    color: #fff;
    background-color: #2e6bb0;
}

.sidebar-admin .navbar-brand {
    color: #fff;
}

/* Botones de grupo colapsable en el menú (Pólizas y Rentas, Equipos, etc.) */
.sidebar-admin .grupo-menu-toggle {
    background: transparent;
    border: none;
    color: #cfe0f2;
    font-size: inherit;
    font-weight: 500;
}
.sidebar-admin .grupo-menu-toggle:hover,
.sidebar-admin .grupo-menu-toggle.activo {
    color: #fff;
    background-color: #2e6bb0;
}
.sidebar-admin .flecha-grupo {
    display: inline-block;
    transition: transform 0.2s ease;
    font-size: 0.75rem;
}
.sidebar-admin .grupo-menu-toggle[aria-expanded="true"] .flecha-grupo {
    transform: rotate(180deg);
}
.sidebar-admin .collapse .nav-link,
.sidebar-admin .collapsing .nav-link {
    font-size: 0.92rem;
    padding-top: 0.35rem;
    padding-bottom: 0.35rem;
}

/* El offcanvas-md de Bootstrap se convierte en sidebar fijo a partir de md (≥768px).
   Bootstrap no le da ancho por defecto, así que lo fijamos aquí. */
@media (min-width: 768px) {
    .offcanvas-md.sidebar-admin {
        width: 220px;
        flex-shrink: 0;
    }
}

/* Encabezados de tabla con el azul de marca, más suave */
.table thead th {
    background-color: #eef2f7;
    color: #1d4e89;
    border-bottom-width: 1px;
}

/* Badges de estatus de equipo (públicos y admin) */
.badge-disponible { background-color: #e8f6ee; color: var(--color-ok); }
.badge-rentado { background-color: #fff4e5; color: #a85d00; }
.badge-mantenimiento { background-color: #fdecea; color: var(--color-alerta); }
.badge-fuera { background-color: #ececec; color: #555; }

/* Página pública del equipo: tarjeta centrada y compacta en mobile */
.tarjeta-equipo-publico {
    max-width: 480px;
    margin: 0 auto;
}

.foto-equipo-publico {
    width: 100%;
    max-height: 240px;
    object-fit: cover;
    border-radius: 0.5rem;
}

/* Tarjetas de resumen del dashboard */
.tarjeta-resumen-dash {
    text-decoration: none;
    transition: box-shadow 0.15s ease;
}
.tarjeta-resumen-dash:hover {
    box-shadow: 0 0.5rem 1rem rgba(0,0,0,0.1) !important;
}
.tarjeta-resumen-dash .numero-grande {
    font-size: 2rem;
    font-weight: 700;
    color: #1d4e89;
}

/* Login centrado */
.pagina-login-bg {
    background-color: #f4f6f9;
    min-height: 100vh;
}

/* Barra flotante de contacto en la página pública del equipo */
.barra-contacto-flotante {
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    z-index: 1030;
    background-color: #1d4e89;
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 0.5rem;
    padding: 0.6rem 0.5rem;
    box-shadow: 0 -2px 8px rgba(0,0,0,0.12);
}

.icono-contacto {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 42px;
    height: 42px;
    border-radius: 50%;
    background-color: rgba(255,255,255,0.12);
    color: #fff;
    text-decoration: none;
    transition: background-color 0.15s ease;
}

.icono-contacto:hover {
    background-color: rgba(255,255,255,0.25);
    color: #fff;
}

/* Utilidad: texto en color de éxito/alerta consistente con el resto del sistema */
.texto-ok { color: var(--color-ok) !important; font-weight: 600; }
.texto-alerta { color: var(--color-alerta) !important; font-weight: 600; }
.estatus-rentado-texto { color: #a85d00 !important; font-weight: 600; }

/* En mobile, los botones sueltos de un formulario ocupan el ancho completo;
   los que van dentro de una celda de tabla conservan su tamaño normal. */
@media (max-width: 575.98px) {
    form.formulario-ancho-completo .btn {
        width: 100%;
    }
}

/* Select buscable (combo con filtro de texto, sin librerías externas) */
.select-buscable-wrapper { min-width: 0; }
.select-buscable-oculto { display: none !important; }
.select-buscable-dropdown {
    display: none;
    position: absolute;
    z-index: 1050;
    top: 100%;
    left: 0;
    right: 0;
    background: #fff;
    border: 1px solid #d1d5db;
    border-radius: 6px;
    max-height: 240px;
    overflow-y: auto;
    box-shadow: 0 4px 12px rgba(0,0,0,.12);
    margin-top: 2px;
}
.select-buscable-dropdown.mostrar { display: block; }
.select-buscable-item {
    padding: .4rem .75rem;
    cursor: pointer;
    font-size: .875rem;
}
.select-buscable-item:hover { background: #f1f5f9; }
.select-buscable-item.activo { background: #e0e7ff; font-weight: 600; }
.select-buscable-vacio {
    padding: .5rem .75rem;
    color: #9ca3af;
    font-size: .85rem;
    font-style: italic;
}