@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&display=swap');

:root {
    --ag-dark: #24272d;
    --ag-blue: #1685c1;
    --ag-yellow: #f5a300;
    --ag-yellow-hover: #d98e00;
    --ag-bg: #f4f6f8;
    --ag-border: #d7e0e5;
    --ag-muted: #67717c;
    --bs-primary: #1685c1;
    --bs-primary-rgb: 22, 133, 193;
    --bs-warning: #f5a300;
    --bs-warning-rgb: 245, 163, 0;
}

html, body, main.container-fluid { background: var(--ag-bg) !important; color: var(--ag-dark); }
body, button, input, select, textarea, .btn, .table, .modal {
    font-family: 'Inter', 'Segoe UI', Arial, sans-serif !important;
}
header.bg-orange {
    background: #fff !important;
    color: var(--ag-dark) !important;
    border-bottom: 1px solid var(--ag-border);
    border-top: 4px solid var(--ag-yellow);
    box-shadow: 0 4px 20px rgba(36,39,45,.06);
    padding: 18px 24px !important;
}
header.bg-orange h1 { color: var(--ag-dark) !important; font-size: clamp(1.15rem, 3vw, 1.65rem); font-weight: 800; }
header.bg-orange .text-white { color: var(--ag-dark) !important; }
header.bg-orange img { width: 64px; height: 64px; object-fit: contain; flex-shrink: 0; }
main.container-fluid { max-width: 1440px; padding: 24px !important; margin: 0 auto; }
body:has(.footer-menu) main.container-fluid { padding-bottom: calc(100px + env(safe-area-inset-bottom, 0px)) !important; }
.card, .modal-content, .cart-item, #sectionMenu, .TarjetaMenu {
    background: #fff;
    border: 1px solid var(--ag-border) !important;
    border-radius: 16px !important;
    box-shadow: 0 8px 24px rgba(36,39,45,.05) !important;
}
.card-header, .modal-header { background: #fff !important; color: var(--ag-dark); border-bottom: 1px solid var(--ag-border); }
.card-header { border-radius: 16px 16px 0 0 !important; }
.modal-title { font-weight: 800; }
.form-control, .form-select, .inputLogin {
    border: 1px solid var(--ag-border) !important;
    border-radius: 10px !important;
    min-height: 42px;
    color: var(--ag-dark);
}
.form-control:focus, .form-select:focus, .inputLogin:focus {
    border-color: var(--ag-blue) !important;
    box-shadow: 0 0 0 4px rgba(22,133,193,.15) !important;
}
.form-control[readonly], .form-select:disabled { background-color: #f0f5f7; }
.form-label { font-weight: 600; }
.text-primary { color: var(--ag-blue) !important; }
.btn-primary, .btn-warning, .btn-orange, .btn-orange-prod, #confirm-btn, #btnLogin, .swal2-confirm {
    background: var(--ag-yellow) !important;
    border-color: var(--ag-yellow) !important;
    color: #111 !important;
    font-weight: 700 !important;
    border-radius: 10px !important;
}
.btn-primary:hover, .btn-warning:hover, .btn-orange:hover, .btn-orange-prod:hover, #confirm-btn:hover, #btnLogin:hover, .swal2-confirm:hover {
    background: var(--ag-yellow-hover) !important;
    border-color: var(--ag-yellow-hover) !important;
}
.btn-outline-primary { color: var(--ag-blue); border-color: var(--ag-blue); }
.btn-outline-primary:hover { color: #fff; background: var(--ag-blue); border-color: var(--ag-blue); }
.btn-secondary { background: var(--ag-dark); border-color: var(--ag-dark); }
.btn { border-radius: 10px; }
.btn:disabled { opacity: .6; }
.btn-orange.active { box-shadow: 0 0 0 3px rgba(245,163,0,.2); }
.text-orange { color: var(--ag-blue) !important; }
.footer-menu { background: var(--ag-dark) !important; border-top: 3px solid var(--ag-yellow); box-shadow: 0 -6px 20px rgba(36,39,45,.12); }
.footer-menu a { color: #e4e9ed !important; padding: 8px 16px; border-radius: 10px; }
.footer-menu a.active { background: rgba(245,163,0,.14); color: var(--ag-yellow) !important; }
.footer-menu h4 { font-size: .75rem !important; margin: 8px 0 0; font-weight: 600; }
.footer-menu .text-warning { color: var(--ag-yellow) !important; }
.table thead th { background: var(--ag-dark) !important; color: #fff !important; border: 0; }
.table td { vertical-align: middle; border-color: var(--ag-border); }
.swal2-popup { border-radius: 18px !important; }
.ag-login-shell { min-height: 100vh; display: flex; background: var(--ag-bg); }
.ag-login-brand { width: 50%; display: flex; align-items: center; justify-content: center; background: var(--ag-dark); border-bottom: 8px solid var(--ag-yellow); padding: 48px; }
.ag-login-brand-content { max-width: 420px; color: #fff; }
.ag-login-brand-content img { width: 100px; height: 100px; object-fit: contain; margin-bottom: 32px; }
.ag-login-brand-content h2 { color: #fff; font-size: 2.5rem; font-weight: 800; line-height: 1.15; }
.ag-login-brand-content p { color: #cdd5dc; margin-top: 20px; font-size: 1.05rem; line-height: 1.6; }
.ag-login-form { display: flex; align-items: center; width: 50% !important; max-width: 560px !important; padding: 48px !important; margin: 0 auto; }
.ag-login-form > div { width: 100%; }
.ag-login-form .text-center { text-align: center; }
.ag-login-form h2 { margin: 24px 0 8px; }
.ag-login-form form { margin-top: 28px; }
.ag-login-form form > div { margin-top: 18px; }
.ag-login-form label { display: block; margin-bottom: 8px; font-weight: 600; font-size: .9rem; }
.ag-login-form input { display: block; width: 100%; padding: 10px 12px; }
.ag-login-form #btnLogin, .ag-login-form #btnRegistra { display: block; width: 100%; min-height: 46px; padding: 10px 16px; }
.ag-login-form #btnOlvideContrasena { background: transparent; border: 0; color: var(--ag-blue); }
.ag-login-form .imgcenter { width: 100px !important; height: 100px; object-fit: contain; }
.ag-login-form h2 { font-size: 1.5rem; font-weight: 800; }
.ag-login-form p { color: var(--ag-muted) !important; }
@media (max-width: 767px) {
    header.bg-orange { padding: 12px 16px !important; }
    header.bg-orange img { width: 48px; height: 48px; }
    main.container-fluid { padding: 16px !important; }
    .cart-item img { width: 72px !important; height: 72px !important; }
    .ag-login-brand { display: none; }
    .ag-login-form { width: 100% !important; padding: 32px 24px !important; }
}

/* Colores y menu de AppChecadores, incluidas las pantallas internas. */
:root { --ag-lime:#a7cf00; --ag-green:#5dbb73; --ag-red:#d20a2e; }
body header.bg-orange { border-top:0 !important; border-bottom:4px solid transparent !important; border-image:linear-gradient(90deg,#1685c1 0 36%,#f5a300 36% 54%,#a7cf00 54% 68%,#5dbb73 68% 84%,#d20a2e 84% 100%) 1 !important; }
.repartidor-menu-toggle { background:#eef8fd !important; border-color:#d7e0e5 !important; color:#1685c1 !important; box-shadow:none !important; }
.repartidor-menu-toggle:hover { background:#d4ecf6 !important; color:#0d6fa7 !important; }
.repartidor-sidebar { background:#fff !important; border-right:1px solid #d7e0e5; box-shadow:4px 0 24px rgba(36,39,45,.07) !important; }
.repartidor-sidebar__brand { display:flex; flex-direction:column; align-items:center; gap:12px; padding:12px 0 20px; }
.repartidor-sidebar__brand img { width:82px; height:82px; object-fit:contain; border-radius:50%; box-shadow:0 0 0 4px rgba(22,133,193,.15),0 10px 24px rgba(36,39,45,.14); }
.repartidor-sidebar__brand::after { content:''; height:4px; width:100%; border-radius:3px; background:linear-gradient(90deg,#1685c1 0 30%,#f5a300 30% 47%,#a7cf00 47% 65%,#5dbb73 65% 82%,#d20a2e 82% 100%); }
.repartidor-sidebar__nav a { color:#3e4851 !important; border-radius:7px !important; font-weight:650 !important; }
.repartidor-sidebar__nav a i { color:#1685c1 !important; }
.repartidor-sidebar__nav a:hover,.repartidor-sidebar__nav a.is-active { color:#0d6fa7 !important; background:#eef8fd !important; box-shadow:inset 3px 0 0 #f5a300; }
.repartidor-sidebar__title { color:#24272d !important; }
.repartidor-sidebar__close { color:#1685c1 !important; background:#eef8fd !important; }
.repartidor-sidebar__avatar { border-color:#1685c1 !important; }
.btn-primary,.text-orange { --bs-btn-bg:#f5a300; }
.resumen-ruta,.mensaje-ubicacion,.sin-pedidos-repartidor,.pedido-card { border:1px solid #d7e0e5 !important; border-radius:16px !important; box-shadow:0 8px 24px rgba(36,39,45,.05); }

/* Paleta azul del sistema de Compras. */
:root {
    --ag-dark: #1685c1;
    --ag-dark-2: #39a8d4;
    --ag-bg: #f7f8fa;
    --ag-border: #d8dde2;
    --ag-muted: #6a6d70;
    --ag-yellow: #f4c540;
    --ag-yellow-hover: #d4a820;
    --bs-warning: #f4c540;
    --bs-warning-rgb: 244, 197, 64;
}
header.bg-orange,
.ag-login-brand {
    background: linear-gradient(115deg, #0f78ad 0%, #168fc7 58%, #39a8d4 100%) !important;
    color: #fff !important;
}
header.bg-orange h1,
header.bg-orange .text-white,
.ag-login-brand-content h2,
.ag-login-brand-content p { color: #fff !important; }
.ag-login-form h2,
.card-title,
.modal-title,
#TextMenuTitle,
#TextMenu,
#TextTarjetaMenu { color: var(--ag-blue) !important; }
.repartidor-sidebar,
.footer-menu {
    background: linear-gradient(170deg, #1685c1 0%, #39a8d4 100%) !important;
    color: #fff !important;
}
.repartidor-sidebar__title,
.repartidor-sidebar__nav a,
.repartidor-sidebar__nav a i,
.repartidor-sidebar__user,
.repartidor-sidebar__user-name,
.repartidor-sidebar__user-info { color: #fff !important; }
.repartidor-sidebar__nav a:hover,
.repartidor-sidebar__nav a.is-active {
    color: #fff !important;
    background: rgba(255,255,255,.16) !important;
    box-shadow: inset 3px 0 0 var(--ag-yellow);
}
.repartidor-sidebar__nav a:hover i,
.repartidor-sidebar__nav a.is-active i { color: var(--ag-yellow) !important; }
.repartidor-sidebar__brand img { background: #fff; }
.repartidor-sidebar__avatar { border-color: #fff !important; }
.footer-menu a.active { background: rgba(255,255,255,.16) !important; }
.table thead th,
#sectionMenu::before { background: var(--ag-blue) !important; }
.btn-primary, .btn-warning, .btn-orange, .btn-orange-prod,
#confirm-btn, #btnLogin, .swal2-confirm { color: #24272d !important; }
.repartidor-sidebar__eyebrow { color: #fff !important; }