/*
 * JamaGO Locales — DashCode-inspired compatibility skin
 *
 * This file intentionally sits on top of the existing Bootstrap/AdminPress
 * assets. It changes presentation only and keeps the current Blade markup,
 * Firebase hooks, DataTables and server-side authorization untouched.
 */

:root {
    --jg-primary: #184998;
    --jg-primary-strong: #10366f;
    --jg-primary-soft: #eaf1ff;
    --jg-accent: #ff5a1f;
    --jg-accent-soft: #fff0e9;
    --jg-success: #16a34a;
    --jg-warning: #f59e0b;
    --jg-danger: #e11d48;
    --jg-info: #0284c7;
    --jg-canvas: #f6f8fc;
    --jg-surface: #ffffff;
    --jg-surface-muted: #f8fafc;
    --jg-sidebar: #0f172a;
    --jg-sidebar-muted: #94a3b8;
    --jg-text: #172033;
    --jg-text-muted: #64748b;
    --jg-border: #e2e8f0;
    --jg-border-strong: #cbd5e1;
    --jg-ring: rgba(24, 73, 152, .18);
    --jg-shadow-sm: 0 1px 2px rgba(15, 23, 42, .04), 0 1px 3px rgba(15, 23, 42, .06);
    --jg-shadow: 0 10px 30px rgba(15, 23, 42, .07);
    --jg-shadow-lg: 0 24px 60px rgba(15, 23, 42, .14);
    --jg-radius-sm: 8px;
    --jg-radius: 12px;
    --jg-radius-lg: 18px;
    --jg-header-height: 84px;
    --jg-sidebar-width: 256px;
    --jg-sidebar-mini: 78px;
}

html[data-jamago-theme="dark"] {
    --jg-canvas: #0b1120;
    --jg-surface: #111827;
    --jg-surface-muted: #182235;
    --jg-sidebar: #070d19;
    --jg-text: #e5edf8;
    --jg-text-muted: #94a3b8;
    --jg-border: #263247;
    --jg-border-strong: #334155;
    --jg-primary-soft: rgba(59, 130, 246, .16);
    --jg-accent-soft: rgba(255, 90, 31, .14);
    --jg-ring: rgba(96, 165, 250, .24);
    --jg-shadow-sm: 0 1px 3px rgba(0, 0, 0, .28);
    --jg-shadow: 0 16px 36px rgba(0, 0, 0, .24);
    --jg-shadow-lg: 0 24px 60px rgba(0, 0, 0, .36);
}

html {
    scroll-behavior: smooth;
}

body.jamago-dashcode,
body.jamago-auth-page {
    font-family: "Urbanist", "Nunito", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    color: var(--jg-text);
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
}

body.jamago-dashcode {
    min-height: 100vh;
    overflow-x: hidden;
    background: var(--jg-canvas);
}

.jamago-dashcode *,
.jamago-auth-page * {
    scrollbar-color: var(--jg-border-strong) transparent;
    scrollbar-width: thin;
}

.jamago-dashcode *::-webkit-scrollbar,
.jamago-auth-page *::-webkit-scrollbar {
    width: 7px;
    height: 7px;
}

.jamago-dashcode *::-webkit-scrollbar-thumb,
.jamago-auth-page *::-webkit-scrollbar-thumb {
    border-radius: 999px;
    background: var(--jg-border-strong);
}

.jamago-dashcode a,
.jamago-auth-page a {
    color: var(--jg-primary);
    transition: color .18s ease, background-color .18s ease, border-color .18s ease, box-shadow .18s ease, transform .18s ease;
}

.jamago-dashcode a:hover,
.jamago-auth-page a:hover {
    color: var(--jg-primary-strong);
    text-decoration: none;
}

.jamago-dashcode :focus-visible,
.jamago-auth-page :focus-visible {
    outline: 3px solid var(--jg-ring);
    outline-offset: 2px;
}

/* Application shell ------------------------------------------------------ */

.jamago-dashcode #app,
.jamago-dashcode #main-wrapper {
    background: transparent;
}

.jamago-dashcode main.py-4 {
    min-height: 100vh;
    padding: 0 !important;
    background: var(--jg-canvas);
}

.jamago-dashcode .topbar {
    position: fixed !important;
    inset: 0 0 auto 0;
    z-index: 1035;
    height: var(--jg-header-height);
    background: var(--jg-surface) !important;
    border-bottom: 1px solid var(--jg-border);
    box-shadow: var(--jg-shadow-sm);
}

.jamago-dashcode .topbar .top-navbar {
    min-height: var(--jg-header-height);
    height: var(--jg-header-height);
    padding: 0;
    background: transparent;
}

.jamago-dashcode .topbar .navbar-header {
    display: flex;
    flex: 0 0 var(--jg-sidebar-width);
    align-items: center;
    justify-content: center;
    width: var(--jg-sidebar-width);
    height: var(--jg-header-height);
    padding: 0 22px;
    background: var(--jg-sidebar);
    transition: width .22s ease, flex-basis .22s ease;
}

.jamago-dashcode .topbar .navbar-brand {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 100%;
    margin: 0;
    padding: 10px 0;
}

.jamago-dashcode .topbar .navbar-brand b {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
}

.jamago-dashcode .topbar .navbar-brand .dark-logo {
    display: block;
    width: auto !important;
    max-width: 172px;
    max-height: 46px;
    object-fit: contain;
}

.jamago-dashcode .topbar .navbar-brand .light-logo {
    display: none;
    width: 40px;
    height: 40px;
    object-fit: contain;
}

.jamago-dashcode .topbar .navbar-collapse {
    display: flex !important;
    align-items: center;
    min-width: 0;
    height: var(--jg-header-height);
    padding: 0 20px;
    background: var(--jg-surface);
}

.jamago-dashcode .topbar .navbar-nav {
    align-items: center;
}

.jamago-dashcode .topbar .navbar-nav .nav-link {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 42px;
    min-height: 42px;
    margin: 0 2px;
    padding: 9px 11px;
    color: var(--jg-text-muted) !important;
    border-radius: 10px;
}

.jamago-dashcode .topbar .navbar-nav .nav-link:hover,
.jamago-dashcode .topbar .navbar-nav .nav-link:focus {
    color: var(--jg-primary) !important;
    background: var(--jg-primary-soft);
}

.jamago-dashcode .topbar .navbar-nav .nav-link i {
    font-size: 21px;
    line-height: 1;
}

.jamago-dashcode .topbar .profile-pic {
    width: 38px;
    height: 38px;
    margin: 0;
    object-fit: cover;
    border: 2px solid var(--jg-surface);
    border-radius: 12px;
    box-shadow: 0 0 0 2px var(--jg-primary-soft);
}

.jamago-dashcode .jamago-workspace-label {
    align-items: center;
    gap: 9px;
    margin-left: 10px;
    padding: 8px 12px;
    color: var(--jg-text-muted);
    font-size: 13px;
    font-weight: 700;
    letter-spacing: .02em;
    background: var(--jg-surface-muted);
    border: 1px solid var(--jg-border);
    border-radius: 999px;
}

.jamago-dashcode .jamago-workspace-label i {
    color: var(--jg-accent);
    font-size: 16px;
}

.jamago-dashcode .jamago-theme-toggle {
    appearance: none;
    cursor: pointer;
    border: 0;
    background: transparent;
}

.jamago-dashcode .language-list {
    margin-right: 12px;
    color: var(--jg-text-muted) !important;
}

.jamago-dashcode .language-options .form-control,
.jamago-dashcode #jamago-switch-vendor-form .form-control {
    height: 40px;
    min-width: 178px;
    padding: 6px 34px 6px 12px;
    color: var(--jg-text);
    font-weight: 600;
    background-color: var(--jg-surface-muted);
    border-color: var(--jg-border);
}

.jamago-dashcode .left-sidebar {
    position: fixed !important;
    top: var(--jg-header-height) !important;
    bottom: 0;
    left: 0;
    z-index: 1030;
    width: var(--jg-sidebar-width);
    padding: 14px 12px 22px;
    overflow: hidden;
    background: var(--jg-sidebar) !important;
    box-shadow: 10px 0 28px rgba(3, 7, 18, .08);
    transition: width .22s ease, transform .22s ease;
}

[dir="rtl"] .jamago-dashcode .left-sidebar {
    right: 0;
    left: auto;
}

.jamago-dashcode .left-sidebar .scroll-sidebar,
.jamago-dashcode .left-sidebar .slimScrollDiv {
    width: 100% !important;
    height: 100% !important;
    overflow-y: auto !important;
    overflow-x: hidden !important;
}

.jamago-dashcode .sidebar-nav {
    padding: 0;
    background: transparent !important;
    border: 0 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
}

.jamago-dashcode .sidebar-nav #sidebarnav {
    margin: 0;
    padding: 0;
}

.jamago-dashcode .sidebar-nav ul li {
    margin: 3px 0;
}

.jamago-dashcode .sidebar-nav ul li a,
.jamago-dashcode .sidebar-nav ul li a.has-arrow {
    display: flex;
    align-items: center;
    min-height: 46px;
    padding: 10px 12px;
    color: var(--jg-sidebar-muted) !important;
    font-size: 14px;
    font-weight: 650;
    letter-spacing: .005em;
    border: 0 !important;
    border-radius: 10px;
    transition: color .18s ease, background-color .18s ease, transform .18s ease;
}

.jamago-dashcode .sidebar-nav ul li a i {
    display: inline-flex;
    flex: 0 0 28px;
    align-items: center;
    justify-content: flex-start;
    width: 28px;
    margin: 0 8px 0 0;
    color: #718096 !important;
    font-size: 20px;
    transition: color .18s ease;
}

.jamago-dashcode .sidebar-nav ul li a:hover,
.jamago-dashcode .sidebar-nav ul li a:focus {
    color: #fff !important;
    background: rgba(255, 255, 255, .07);
    transform: translateX(2px);
}

.jamago-dashcode .sidebar-nav ul li a:hover i,
.jamago-dashcode .sidebar-nav ul li a:focus i {
    color: #fff !important;
}

.jamago-dashcode .sidebar-nav ul li.active > a,
.jamago-dashcode .sidebar-nav ul li > a.active {
    color: #fff !important;
    background: linear-gradient(135deg, var(--jg-primary), #2563a9) !important;
    box-shadow: 0 9px 18px rgba(24, 73, 152, .34);
}

.jamago-dashcode .sidebar-nav ul li.active > a i,
.jamago-dashcode .sidebar-nav ul li > a.active i {
    color: #fff !important;
}

.jamago-dashcode .sidebar-nav .collapse,
.jamago-dashcode .sidebar-nav .collapsing {
    background: transparent;
}

.jamago-dashcode .sidebar-nav .collapse a {
    min-height: 38px;
    padding-left: 48px;
    font-size: 13px;
}

.jamago-dashcode .sidebar-nav .has-arrow::after {
    border-color: currentColor !important;
}

.jamago-dashcode .sidebar-nav .web_version {
    margin: 24px 12px 0;
    color: #94a3b8;
    font-size: 11px;
}

.jamago-sidebar-backdrop {
    position: fixed;
    inset: var(--jg-header-height) 0 0 0;
    z-index: 1025;
    display: none;
    background: rgba(2, 6, 23, .55);
    backdrop-filter: blur(2px);
}

/* Main content ----------------------------------------------------------- */

.jamago-dashcode .page-wrapper,
.jamago-dashcode main > #main-wrapper.page-wrapper {
    min-height: 100vh !important;
    margin-left: var(--jg-sidebar-width);
    padding: calc(var(--jg-header-height) + 26px) 28px 36px !important;
    background: var(--jg-canvas) !important;
    transition: margin-left .22s ease, padding .22s ease;
}

[dir="rtl"] .jamago-dashcode .page-wrapper,
[dir="rtl"] .jamago-dashcode main > #main-wrapper.page-wrapper {
    margin-right: var(--jg-sidebar-width);
    margin-left: 0;
}

body.jamago-dashcode.sticky .page-wrapper {
    padding-top: calc(var(--jg-header-height) + 26px) !important;
}

.jamago-dashcode .container-fluid {
    width: 100%;
    max-width: 1680px;
    margin: 0 auto;
    padding: 0;
}

.jamago-dashcode .page-titles {
    align-items: center;
    min-height: auto;
    margin: 0 0 22px;
    padding: 0;
    background: transparent;
    border: 0;
    box-shadow: none;
}

.jamago-dashcode .page-titles h1,
.jamago-dashcode .page-titles h2,
.jamago-dashcode .page-titles h3,
.jamago-dashcode .page-titles h4,
.jamago-dashcode .page-titles .text-themecolor {
    margin: 0;
    color: var(--jg-text) !important;
    font-size: clamp(22px, 2vw, 30px);
    font-weight: 750;
    letter-spacing: -.025em;
}

.jamago-dashcode .page-titles .breadcrumb {
    margin: 7px 0 0;
    padding: 0;
    color: var(--jg-text-muted);
    background: transparent;
}

.jamago-dashcode h1,
.jamago-dashcode h2,
.jamago-dashcode h3,
.jamago-dashcode h4,
.jamago-dashcode h5,
.jamago-dashcode h6 {
    color: var(--jg-text);
    font-family: inherit;
    font-weight: 700;
}

.jamago-dashcode .text-muted,
.jamago-dashcode small,
.jamago-dashcode .form-text {
    color: var(--jg-text-muted) !important;
}

/* Cards and dashboard modules ------------------------------------------- */

.jamago-dashcode .card,
.jamago-dashcode .card-group,
.jamago-dashcode .white-box,
.jamago-dashcode .well {
    color: var(--jg-text);
    background: var(--jg-surface);
    border: 1px solid var(--jg-border);
    border-radius: var(--jg-radius);
    box-shadow: var(--jg-shadow-sm);
}

.jamago-dashcode .card {
    margin-bottom: 22px;
    overflow: visible;
}

.jamago-dashcode .card-header {
    min-height: 60px;
    padding: 18px 20px;
    background: transparent;
    border-bottom: 1px solid var(--jg-border);
    border-radius: var(--jg-radius) var(--jg-radius) 0 0;
}

.jamago-dashcode .card-header.no-border {
    border-bottom: 0;
}

.jamago-dashcode .card-header .card-title,
.jamago-dashcode .card-title {
    margin: 0;
    color: var(--jg-text);
    font-size: 17px;
    font-weight: 750;
}

.jamago-dashcode .card-body {
    padding: 22px;
}

.jamago-dashcode .card-footer {
    padding: 16px 20px;
    background: var(--jg-surface-muted);
    border-top: 1px solid var(--jg-border);
    border-radius: 0 0 var(--jg-radius) var(--jg-radius);
}

.jamago-dashcode .business-analytics > .card-body {
    padding: 24px;
}

.jamago-dashcode .business-analytics_list .card-box {
    position: relative;
    min-height: 150px;
    padding: 24px;
    overflow: hidden;
    cursor: pointer;
    background: linear-gradient(145deg, var(--jg-surface) 15%, var(--jg-primary-soft) 125%);
    border: 1px solid var(--jg-border);
    border-radius: var(--jg-radius);
    box-shadow: var(--jg-shadow-sm);
    transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease;
}

.jamago-dashcode .business-analytics_list .card-box::after {
    position: absolute;
    right: -32px;
    bottom: -42px;
    width: 120px;
    height: 120px;
    content: "";
    background: var(--jg-primary-soft);
    border-radius: 50%;
}

.jamago-dashcode .business-analytics_list .card-box:hover {
    border-color: rgba(24, 73, 152, .28);
    box-shadow: var(--jg-shadow);
    transform: translateY(-3px);
}

.jamago-dashcode .business-analytics_list .card-box h5 {
    max-width: calc(100% - 52px);
    margin: 0 0 18px;
    color: var(--jg-text-muted);
    font-size: 13px;
    font-weight: 700;
    letter-spacing: .045em;
    text-transform: uppercase;
}

.jamago-dashcode .business-analytics_list .card-box h2 {
    margin: 0;
    color: var(--jg-text);
    font-size: 30px;
    font-weight: 800;
}

.jamago-dashcode .business-analytics_list .card-box > i {
    position: absolute;
    top: 22px;
    right: 22px;
    z-index: 1;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 44px;
    height: 44px;
    color: #fff;
    font-size: 23px;
    background: linear-gradient(135deg, var(--jg-primary), #2e69c4);
    border-radius: 12px;
    box-shadow: 0 10px 20px rgba(24, 73, 152, .22);
}

.jamago-dashcode .order-status {
    display: flex;
    align-items: center;
    justify-content: space-between;
    min-height: 96px;
    margin-bottom: 18px;
    padding: 18px;
    color: var(--jg-text) !important;
    background: var(--jg-surface);
    border: 1px solid var(--jg-border);
    border-radius: var(--jg-radius);
    box-shadow: var(--jg-shadow-sm);
    transition: transform .2s ease, box-shadow .2s ease;
}

.jamago-dashcode .order-status:hover {
    color: var(--jg-text) !important;
    box-shadow: var(--jg-shadow);
    transform: translateY(-2px);
}

.jamago-dashcode .order-status .data {
    display: flex;
    align-items: center;
    min-width: 0;
}

.jamago-dashcode .order-status .data > i {
    display: inline-flex;
    flex: 0 0 42px;
    align-items: center;
    justify-content: center;
    width: 42px;
    height: 42px;
    margin-right: 12px;
    color: var(--jg-primary);
    font-size: 22px;
    background: var(--jg-primary-soft);
    border-radius: 12px;
}

.jamago-dashcode .order-status .status {
    margin: 0;
    color: var(--jg-text-muted);
    font-size: 13px;
    font-weight: 700;
}

.jamago-dashcode .order-status .count {
    margin-left: 10px;
    color: var(--jg-text);
    font-size: 24px;
    font-weight: 800;
}

.jamago-dashcode .order-status.confirmed .data > i,
.jamago-dashcode .order-status.delivered .data > i {
    color: var(--jg-success);
    background: rgba(22, 163, 74, .10);
}

.jamago-dashcode .order-status.packaging .data > i,
.jamago-dashcode .order-status.pending .data > i {
    color: var(--jg-warning);
    background: rgba(245, 158, 11, .12);
}

.jamago-dashcode .order-status.canceled .data > i,
.jamago-dashcode .order-status.failed .data > i {
    color: var(--jg-danger);
    background: rgba(225, 29, 72, .10);
}

/* Forms ------------------------------------------------------------------ */

.jamago-dashcode label,
.jamago-auth-page label {
    color: var(--jg-text);
    font-size: 13px;
    font-weight: 700;
}

.jamago-dashcode .form-group,
.jamago-auth-page .form-group {
    margin-bottom: 18px;
}

.jamago-dashcode .form-control,
.jamago-dashcode .custom-select,
.jamago-auth-page .form-control,
.jamago-auth-page .custom-select {
    min-height: 44px;
    padding: 9px 12px;
    color: var(--jg-text);
    font-family: inherit;
    font-size: 14px;
    background: var(--jg-surface);
    border: 1px solid var(--jg-border-strong);
    border-radius: var(--jg-radius-sm);
    box-shadow: none;
    transition: border-color .18s ease, box-shadow .18s ease, background-color .18s ease;
}

.jamago-dashcode textarea.form-control,
.jamago-auth-page textarea.form-control {
    min-height: 110px;
}

.jamago-dashcode .form-control:focus,
.jamago-dashcode .custom-select:focus,
.jamago-auth-page .form-control:focus,
.jamago-auth-page .custom-select:focus {
    color: var(--jg-text);
    background: var(--jg-surface);
    border-color: var(--jg-primary);
    box-shadow: 0 0 0 3px var(--jg-ring);
}

.jamago-dashcode .form-control:disabled,
.jamago-dashcode .form-control[readonly],
.jamago-auth-page .form-control:disabled,
.jamago-auth-page .form-control[readonly] {
    color: var(--jg-text-muted);
    background: var(--jg-surface-muted);
}

.jamago-dashcode .form-material .form-control,
.jamago-auth-page .form-material .form-control {
    padding: 9px 12px;
    background-image: none !important;
    border: 1px solid var(--jg-border-strong);
}

.jamago-dashcode .input-group-text,
.jamago-auth-page .input-group-text {
    color: var(--jg-text-muted);
    background: var(--jg-surface-muted);
    border-color: var(--jg-border-strong);
}

.jamago-dashcode .select2-container .select2-selection--single,
.jamago-auth-page .select2-container .select2-selection--single {
    height: 44px;
    color: var(--jg-text);
    background: var(--jg-surface);
    border: 1px solid var(--jg-border-strong);
    border-radius: var(--jg-radius-sm);
}

.jamago-dashcode .select2-container--default .select2-selection--single .select2-selection__rendered,
.jamago-auth-page .select2-container--default .select2-selection--single .select2-selection__rendered {
    padding: 7px 34px 7px 12px;
    color: var(--jg-text);
    line-height: 28px;
}

.jamago-dashcode .select2-dropdown,
.jamago-auth-page .select2-dropdown,
.jamago-dashcode .chosen-container .chosen-drop,
.jamago-auth-page .chosen-container .chosen-drop {
    color: var(--jg-text);
    background: var(--jg-surface);
    border-color: var(--jg-border);
    border-radius: var(--jg-radius-sm);
    box-shadow: var(--jg-shadow);
}

.jamago-dashcode .restaurant_payout_create-inner fieldset,
.jamago-auth-page .restaurant_payout_create-inner fieldset,
.jamago-dashcode fieldset.form-material,
.jamago-auth-page fieldset.form-material {
    margin-bottom: 22px;
    padding: 22px;
    background: var(--jg-surface);
    border: 1px solid var(--jg-border) !important;
    border-radius: var(--jg-radius);
}

.jamago-dashcode .restaurant_payout_create-inner fieldset legend,
.jamago-auth-page .restaurant_payout_create-inner fieldset legend,
.jamago-dashcode fieldset.form-material legend,
.jamago-auth-page fieldset.form-material legend {
    width: auto;
    margin: 0 0 14px;
    padding: 0 8px;
    color: var(--jg-text) !important;
    font-size: 16px;
    font-weight: 750;
    background: transparent !important;
}

.jamago-dashcode .error,
.jamago-auth-page .error,
.jamago-dashcode .invalid-feedback,
.jamago-auth-page .invalid-feedback {
    color: var(--jg-danger) !important;
    font-size: 12px;
    font-weight: 650;
}

/* Buttons ---------------------------------------------------------------- */

.jamago-dashcode .btn,
.jamago-auth-page .btn,
.jamago-dashcode button,
.jamago-auth-page button {
    font-family: inherit;
}

.jamago-dashcode .btn,
.jamago-auth-page .btn {
    min-height: 40px;
    padding: 9px 16px;
    font-size: 13px;
    font-weight: 750;
    line-height: 1.25;
    letter-spacing: .01em;
    border-radius: var(--jg-radius-sm);
    box-shadow: none;
    transition: transform .16s ease, box-shadow .16s ease, background-color .16s ease, border-color .16s ease;
}

.jamago-dashcode .btn:hover,
.jamago-auth-page .btn:hover {
    transform: translateY(-1px);
}

.jamago-dashcode .btn-primary,
.jamago-auth-page .btn-primary,
.jamago-dashcode .btn-info {
    color: #fff !important;
    background: linear-gradient(135deg, var(--jg-primary), #2563a9) !important;
    border-color: var(--jg-primary) !important;
    box-shadow: 0 8px 16px rgba(24, 73, 152, .16);
}

.jamago-dashcode .btn-primary:hover,
.jamago-auth-page .btn-primary:hover,
.jamago-dashcode .btn-info:hover,
.jamago-dashcode .btn-primary:focus,
.jamago-auth-page .btn-primary:focus,
.jamago-dashcode .btn-info:focus {
    color: #fff !important;
    background: linear-gradient(135deg, var(--jg-primary-strong), var(--jg-primary)) !important;
    border-color: var(--jg-primary-strong) !important;
    box-shadow: 0 0 0 3px var(--jg-ring), 0 8px 18px rgba(24, 73, 152, .20) !important;
}

.jamago-dashcode .btn-warning,
.jamago-auth-page .btn-warning {
    color: #fff !important;
    background: var(--jg-accent) !important;
    border-color: var(--jg-accent) !important;
}

.jamago-dashcode .btn-success,
.jamago-auth-page .btn-success {
    color: #fff !important;
    background: var(--jg-success) !important;
    border-color: var(--jg-success) !important;
}

.jamago-dashcode .btn-danger,
.jamago-auth-page .btn-danger {
    color: #fff !important;
    background: var(--jg-danger) !important;
    border-color: var(--jg-danger) !important;
}

.jamago-dashcode .btn-secondary,
.jamago-auth-page .btn-secondary,
.jamago-dashcode .btn-light,
.jamago-auth-page .btn-light,
.jamago-dashcode .btn-outline-secondary,
.jamago-auth-page .btn-outline-secondary {
    color: var(--jg-text) !important;
    background: var(--jg-surface) !important;
    border-color: var(--jg-border-strong) !important;
}

.jamago-dashcode .btn-secondary:hover,
.jamago-auth-page .btn-secondary:hover,
.jamago-dashcode .btn-light:hover,
.jamago-auth-page .btn-light:hover,
.jamago-dashcode .btn-outline-secondary:hover,
.jamago-auth-page .btn-outline-secondary:hover {
    color: var(--jg-primary) !important;
    background: var(--jg-primary-soft) !important;
    border-color: rgba(24, 73, 152, .35) !important;
}

.jamago-dashcode .btn-sm,
.jamago-auth-page .btn-sm {
    min-height: 34px;
    padding: 7px 11px;
    font-size: 12px;
}

.jamago-dashcode .btn-lg,
.jamago-auth-page .btn-lg {
    min-height: 48px;
    padding: 12px 20px;
    font-size: 14px;
}

.jamago-dashcode .btn-tool {
    color: var(--jg-text-muted) !important;
    background: transparent !important;
    border: 0 !important;
}

/* Tables and data plugins ------------------------------------------------ */

.jamago-dashcode .table-responsive {
    border-radius: var(--jg-radius-sm);
}

.jamago-dashcode .table,
.jamago-dashcode table.dataTable {
    width: 100% !important;
    margin: 0 !important;
    color: var(--jg-text);
    background: transparent;
    border-collapse: separate !important;
    border-spacing: 0;
}

.jamago-dashcode .table thead th,
.jamago-dashcode table.dataTable thead th {
    padding: 13px 14px !important;
    color: var(--jg-text-muted);
    font-size: 11px;
    font-weight: 800;
    letter-spacing: .055em;
    text-transform: uppercase;
    white-space: nowrap;
    background: var(--jg-surface-muted);
    border-top: 1px solid var(--jg-border) !important;
    border-bottom: 1px solid var(--jg-border) !important;
}

.jamago-dashcode .table tbody td,
.jamago-dashcode table.dataTable tbody td {
    padding: 14px !important;
    color: var(--jg-text);
    font-size: 13px;
    vertical-align: middle;
    background: var(--jg-surface);
    border-top: 0 !important;
    border-bottom: 1px solid var(--jg-border) !important;
}

.jamago-dashcode .table-striped tbody tr:nth-of-type(odd) td,
.jamago-dashcode table.dataTable.stripe tbody tr.odd td {
    background: color-mix(in srgb, var(--jg-surface-muted) 58%, var(--jg-surface));
}

@supports not (background: color-mix(in srgb, white, black)) {
    .jamago-dashcode .table-striped tbody tr:nth-of-type(odd) td,
    .jamago-dashcode table.dataTable.stripe tbody tr.odd td {
        background: var(--jg-surface-muted);
    }
}

.jamago-dashcode .table-hover tbody tr:hover td,
.jamago-dashcode table.dataTable tbody tr:hover td {
    background: var(--jg-primary-soft) !important;
}

.jamago-dashcode .dataTables_wrapper {
    color: var(--jg-text-muted);
}

.jamago-dashcode .dataTables_wrapper .dataTables_length,
.jamago-dashcode .dataTables_wrapper .dataTables_filter {
    margin: 0 0 16px;
    color: var(--jg-text-muted);
    font-size: 12px;
    font-weight: 700;
}

.jamago-dashcode .dataTables_wrapper .dataTables_filter input,
.jamago-dashcode .dataTables_wrapper .dataTables_length select {
    min-height: 38px;
    margin-left: 8px;
    padding: 7px 10px;
    color: var(--jg-text);
    background: var(--jg-surface);
    border: 1px solid var(--jg-border-strong);
    border-radius: var(--jg-radius-sm);
}

.jamago-dashcode .dataTables_wrapper .dataTables_info {
    padding-top: 18px;
    color: var(--jg-text-muted);
    font-size: 12px;
}

.jamago-dashcode .dataTables_wrapper .dataTables_paginate {
    padding-top: 14px;
}

.jamago-dashcode .dataTables_wrapper .dataTables_paginate .paginate_button,
.jamago-dashcode .pagination .page-link {
    min-width: 36px;
    margin: 0 2px;
    padding: 8px 10px;
    color: var(--jg-text-muted) !important;
    background: var(--jg-surface) !important;
    border: 1px solid var(--jg-border) !important;
    border-radius: 8px !important;
}

.jamago-dashcode .dataTables_wrapper .dataTables_paginate .paginate_button.current,
.jamago-dashcode .dataTables_wrapper .dataTables_paginate .paginate_button.current:hover,
.jamago-dashcode .pagination .page-item.active .page-link {
    color: #fff !important;
    background: var(--jg-primary) !important;
    border-color: var(--jg-primary) !important;
}

.jamago-dashcode .dt-buttons .dt-button {
    min-height: 38px;
    margin: 0 6px 12px 0;
    padding: 8px 12px;
    color: var(--jg-text) !important;
    font-family: inherit;
    font-size: 12px;
    font-weight: 700;
    background: var(--jg-surface) !important;
    border: 1px solid var(--jg-border-strong) !important;
    border-radius: 8px;
}

/* Feedback, navigation and overlays ------------------------------------- */

.jamago-dashcode .alert,
.jamago-auth-page .alert {
    padding: 14px 16px;
    color: var(--jg-text);
    border: 1px solid transparent;
    border-radius: var(--jg-radius-sm);
}

.jamago-dashcode .alert-info,
.jamago-auth-page .alert-info {
    color: #075985;
    background: #e0f2fe;
    border-color: #bae6fd;
}

.jamago-dashcode .alert-warning,
.jamago-auth-page .alert-warning {
    color: #92400e;
    background: #fff7ed;
    border-color: #fed7aa;
}

.jamago-dashcode .alert-success,
.jamago-auth-page .alert-success {
    color: #166534;
    background: #f0fdf4;
    border-color: #bbf7d0;
}

.jamago-dashcode .alert-danger,
.jamago-auth-page .alert-danger {
    color: #9f1239;
    background: #fff1f2;
    border-color: #fecdd3;
}

html[data-jamago-theme="dark"] .jamago-dashcode .alert,
html[data-jamago-theme="dark"] .jamago-auth-page .alert {
    color: var(--jg-text);
    background: var(--jg-surface-muted);
    border-color: var(--jg-border);
}

.jamago-dashcode .badge,
.jamago-auth-page .badge {
    padding: 6px 9px;
    font-size: 10px;
    font-weight: 800;
    letter-spacing: .035em;
    border-radius: 999px;
}

.jamago-dashcode .badge-primary,
.jamago-auth-page .badge-primary,
.jamago-dashcode .badge-info {
    color: var(--jg-primary);
    background: var(--jg-primary-soft);
}

.jamago-dashcode .badge-success,
.jamago-auth-page .badge-success {
    color: #15803d;
    background: #dcfce7;
}

.jamago-dashcode .badge-warning,
.jamago-auth-page .badge-warning {
    color: #a16207;
    background: #fef3c7;
}

.jamago-dashcode .badge-danger,
.jamago-auth-page .badge-danger {
    color: #be123c;
    background: #ffe4e6;
}

.jamago-dashcode .nav-tabs {
    gap: 5px;
    padding: 5px;
    background: var(--jg-surface-muted);
    border: 1px solid var(--jg-border);
    border-radius: 10px;
}

.jamago-dashcode .nav-tabs .nav-item {
    margin: 0;
}

.jamago-dashcode .nav-tabs .nav-link {
    padding: 9px 13px;
    color: var(--jg-text-muted);
    font-size: 13px;
    font-weight: 700;
    background: transparent;
    border: 0;
    border-radius: 8px;
}

.jamago-dashcode .nav-tabs .nav-link:hover {
    color: var(--jg-primary);
    background: var(--jg-primary-soft);
}

.jamago-dashcode .nav-tabs .nav-item.show .nav-link,
.jamago-dashcode .nav-tabs .nav-link.active,
.jamago-dashcode .nav-tabs.card-header-tabs .active.nav-item .nav-link {
    color: var(--jg-primary) !important;
    background: var(--jg-surface) !important;
    box-shadow: var(--jg-shadow-sm);
}

.jamago-dashcode .dropdown-menu {
    min-width: 220px;
    padding: 8px;
    color: var(--jg-text);
    background: var(--jg-surface);
    border: 1px solid var(--jg-border);
    border-radius: 12px;
    box-shadow: var(--jg-shadow-lg);
}

.jamago-dashcode .dropdown-menu .divider {
    margin: 6px 0;
    border-color: var(--jg-border);
}

.jamago-dashcode .dropdown-menu a,
.jamago-dashcode .topbar ul.dropdown-user li a {
    display: flex;
    align-items: center;
    gap: 9px;
    min-height: 39px;
    padding: 9px 10px;
    color: var(--jg-text-muted) !important;
    font-size: 13px;
    font-weight: 650;
    border-radius: 8px;
}

.jamago-dashcode .dropdown-menu a:hover,
.jamago-dashcode .topbar ul.dropdown-user li a:hover {
    color: var(--jg-primary) !important;
    background: var(--jg-primary-soft);
}

.jamago-dashcode .dw-user-box {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 10px;
}

.jamago-dashcode .dw-user-box .u-text h4 {
    margin: 0;
    font-size: 14px;
}

.jamago-dashcode .modal-content {
    color: var(--jg-text);
    background: var(--jg-surface);
    border: 1px solid var(--jg-border);
    border-radius: var(--jg-radius-lg);
    box-shadow: var(--jg-shadow-lg);
}

.jamago-dashcode .modal-header,
.jamago-dashcode .modal-footer {
    padding: 18px 20px;
    border-color: var(--jg-border);
}

.jamago-dashcode .modal-body {
    padding: 22px 20px;
}

.jamago-dashcode .modal-header .close {
    color: var(--jg-text-muted);
    text-shadow: none;
}

.jamago-dashcode .list-group-item {
    color: var(--jg-text);
    background: var(--jg-surface);
    border-color: var(--jg-border);
}

.jamago-dashcode .page-overlay {
    position: fixed !important;
    inset: 0;
    z-index: 9999;
    background: rgba(248, 250, 252, .76);
    backdrop-filter: blur(3px);
}

html[data-jamago-theme="dark"] .jamago-dashcode .page-overlay {
    background: rgba(2, 6, 23, .72);
}

.jamago-dashcode .page-overlay .overlay-text {
    position: absolute;
    top: 50%;
    left: 50%;
    padding: 18px;
    background: var(--jg-surface);
    border: 1px solid var(--jg-border);
    border-radius: 16px;
    box-shadow: var(--jg-shadow);
    transform: translate(-50%, -50%);
}

.jamago-dashcode .toast,
.jamago-dashcode .jq-toast-wrap .jq-toast-single {
    color: var(--jg-text);
    background: var(--jg-surface);
    border: 1px solid var(--jg-border);
    border-radius: 10px;
    box-shadow: var(--jg-shadow);
}

/* Authentication -------------------------------------------------------- */

body.jamago-auth-page {
    min-height: 100vh;
    margin: 0;
    background: linear-gradient(105deg, var(--jg-primary-strong) 0%, var(--jg-primary) 42%, var(--jg-canvas) 42.1%, var(--jg-canvas) 100%) !important;
}

body.jamago-auth-page::after {
    position: fixed;
    right: -110px;
    bottom: -120px;
    z-index: -1;
    width: 360px;
    height: 360px;
    content: "";
    background: rgba(255, 90, 31, .08);
    border-radius: 50%;
}

.jamago-auth-page #app {
    min-height: 100vh;
    background: transparent;
}

.jamago-auth-page #app > main.py-4 {
    min-height: 100vh;
    margin-left: 42%;
    padding: 46px 4vw !important;
}

.jamago-auth-page #app > main.py-4::before {
    position: fixed;
    top: 50%;
    left: 4vw;
    width: 34vw;
    max-width: 390px;
    height: 160px;
    content: "";
    background: url("../images/logo_web_claro_sinfondo.png") center / contain no-repeat;
    transform: translateY(-70%);
}

.jamago-auth-page #app > main.py-4::after {
    position: fixed;
    top: calc(50% + 66px);
    left: 6vw;
    width: 30vw;
    max-width: 330px;
    color: rgba(255, 255, 255, .78);
    content: "Gestiona tu local, pedidos y crecimiento en un solo lugar.";
    font-size: 15px;
    font-weight: 650;
    line-height: 1.6;
    text-align: center;
}

.jamago-auth-page #app > main.py-4 > .container {
    max-width: 860px;
    margin: 0 auto;
    padding: 0;
}

.jamago-auth-page #app .page-titles {
    margin: 0 0 18px;
    padding: 0;
    background: transparent;
}

.jamago-auth-page #app .page-titles h1,
.jamago-auth-page #app .page-titles h2,
.jamago-auth-page #app .page-titles h3,
.jamago-auth-page #app .page-titles h4 {
    color: var(--jg-text);
    font-size: 28px;
    font-weight: 800;
    letter-spacing: -.025em;
}

.jamago-auth-page #app .card,
.jamago-auth-page #app .card-body,
.jamago-auth-page #app > main > .container > .card-body {
    color: var(--jg-text);
    background: var(--jg-surface);
    border-radius: var(--jg-radius-lg);
}

.jamago-auth-page #app > main > .container > .card-body {
    padding: 30px;
    border: 1px solid var(--jg-border);
    box-shadow: var(--jg-shadow-lg);
}

.jamago-auth-page #app .restaurant_payout_create {
    margin: 0;
}

.jamago-auth-page #app .restaurant_payout_create > [class*="col-"] {
    width: 100%;
    max-width: 100%;
    flex: 0 0 100%;
    padding: 0;
}

.jamago-auth-page #app .width-50 {
    width: 100% !important;
}

.jamago-auth-page #wrapper,
.jamago-auth-page .login-register {
    min-height: 100vh;
}

.jamago-auth-page .login-register {
    display: grid;
    grid-template-columns: 42% 58%;
    align-items: center;
    width: 100%;
    padding: 44px 4vw !important;
    background: linear-gradient(105deg, var(--jg-primary-strong) 0%, var(--jg-primary) 42%, var(--jg-canvas) 42.1%, var(--jg-canvas) 100%) !important;
}

.jamago-auth-page .login-logo {
    grid-column: 1;
    width: 100%;
    margin: 0 !important;
    padding: 0 3vw !important;
}

.jamago-auth-page .login-logo a {
    max-width: 100% !important;
    padding: 0 !important;
    background: transparent !important;
    border-radius: 0 !important;
}

.jamago-auth-page .jamago-logo-login,
.jamago-auth-page .login-logo img {
    width: min(340px, 100%) !important;
    max-width: 100% !important;
    height: auto;
    margin: 0 auto;
    object-fit: contain;
}

.jamago-auth-page .login-box {
    grid-column: 2;
    width: min(480px, calc(100% - 48px));
    margin: 0 auto !important;
    overflow: hidden;
    color: var(--jg-text);
    background: var(--jg-surface);
    border: 1px solid var(--jg-border);
    border-radius: var(--jg-radius-lg);
    box-shadow: var(--jg-shadow-lg);
}

.jamago-auth-page .login-box .card-body {
    padding: 34px;
    background: var(--jg-surface);
}

.jamago-auth-page .login-box .box-title {
    margin: 0 0 26px;
    color: var(--jg-text);
    font-size: 27px;
    font-weight: 800;
    letter-spacing: -.025em;
    text-align: left;
}

.jamago-auth-page .login-box .form-control {
    min-height: 48px;
    font-size: 14px;
    background-image: none !important;
}

.jamago-auth-page .login-box .btn-block {
    min-height: 48px;
}

.jamago-auth-page .forgot-password {
    margin: -4px 0 18px;
    text-align: right;
}

.jamago-auth-page .standard-link {
    color: var(--jg-primary) !important;
    font-size: 13px;
    font-weight: 750;
}

.jamago-auth-page .or-line {
    position: relative;
    margin-top: 22px;
    padding-top: 24px;
}

.jamago-auth-page .or-line::before {
    position: absolute;
    top: 10px;
    right: 0;
    left: 0;
    height: 1px;
    content: "";
    background: var(--jg-border);
}

.jamago-auth-page .or-line > span {
    position: absolute;
    top: 0;
    left: 50%;
    z-index: 1;
    padding: 0 10px;
    color: var(--jg-text-muted);
    font-size: 11px;
    font-weight: 800;
    background: var(--jg-surface);
    transform: translateX(-50%);
}

.jamago-auth-page #googleBtn {
    display: flex;
    justify-content: center;
    min-height: 44px;
}

.jamago-auth-page .jamago-marca-agua {
    right: auto !important;
    bottom: 32px !important;
    left: 32px;
    width: 150px !important;
    opacity: .08 !important;
}

.jamago-auth-page .totp-reto {
    color: var(--jg-text);
    background: rgba(2, 6, 23, .72);
    backdrop-filter: blur(8px);
}

.jamago-auth-page .totp-reto-caja {
    background: var(--jg-surface);
    border: 1px solid var(--jg-border);
    border-radius: var(--jg-radius-lg);
    box-shadow: var(--jg-shadow-lg);
}

/* Mini sidebar and responsive states ------------------------------------ */

body.jamago-dashcode.mini-sidebar .topbar .navbar-header {
    flex-basis: var(--jg-sidebar-mini);
    width: var(--jg-sidebar-mini);
    padding: 0 13px;
}

body.jamago-dashcode.mini-sidebar .topbar .navbar-brand .dark-logo {
    display: none;
}

body.jamago-dashcode.mini-sidebar .topbar .navbar-brand .light-logo {
    display: block;
}

body.jamago-dashcode.mini-sidebar .left-sidebar {
    width: var(--jg-sidebar-mini);
    padding-right: 9px;
    padding-left: 9px;
}

body.jamago-dashcode.mini-sidebar .page-wrapper,
body.jamago-dashcode.mini-sidebar main > #main-wrapper.page-wrapper {
    margin-left: var(--jg-sidebar-mini);
}

[dir="rtl"] body.jamago-dashcode.mini-sidebar .page-wrapper,
[dir="rtl"] body.jamago-dashcode.mini-sidebar main > #main-wrapper.page-wrapper {
    margin-right: var(--jg-sidebar-mini);
    margin-left: 0;
}

body.jamago-dashcode.mini-sidebar .sidebar-nav .hide-menu,
body.jamago-dashcode.mini-sidebar .sidebar-nav .has-arrow::after,
body.jamago-dashcode.mini-sidebar .sidebar-nav .web_version {
    display: none !important;
}

body.jamago-dashcode.mini-sidebar .sidebar-nav ul li a {
    justify-content: center;
    padding: 10px;
}

body.jamago-dashcode.mini-sidebar .sidebar-nav ul li a i {
    flex-basis: auto;
    justify-content: center;
    width: 24px;
    margin: 0;
}

@media (min-width: 1170px) {
    body.jamago-dashcode.mini-sidebar .left-sidebar:hover {
        width: var(--jg-sidebar-width);
        padding-right: 12px;
        padding-left: 12px;
    }

    body.jamago-dashcode.mini-sidebar .left-sidebar:hover .hide-menu {
        display: inline !important;
    }

    body.jamago-dashcode.mini-sidebar .left-sidebar:hover .sidebar-nav ul li a {
        justify-content: flex-start;
        padding: 10px 12px;
    }

    body.jamago-dashcode.mini-sidebar .left-sidebar:hover .sidebar-nav ul li a i {
        flex-basis: 28px;
        justify-content: flex-start;
        width: 28px;
        margin-right: 8px;
    }
}

@media (max-width: 1169.98px) {
    .jamago-dashcode .jamago-workspace-label {
        display: none !important;
    }
}

@media (max-width: 767.98px) {
    :root {
        --jg-header-height: 64px;
    }

    .jamago-dashcode .topbar,
    .jamago-dashcode .topbar .top-navbar,
    .jamago-dashcode .topbar .navbar-header,
    .jamago-dashcode .topbar .navbar-collapse {
        height: var(--jg-header-height);
        min-height: var(--jg-header-height);
    }

    .jamago-dashcode .topbar .navbar-header,
    body.jamago-dashcode.mini-sidebar .topbar .navbar-header {
        flex-basis: 68px;
        width: 68px;
        padding: 0 12px;
    }

    .jamago-dashcode .topbar .navbar-brand .dark-logo {
        display: none;
    }

    .jamago-dashcode .topbar .navbar-brand .light-logo {
        display: block;
        width: 38px;
        height: 38px;
    }

    .jamago-dashcode .topbar .navbar-collapse {
        padding: 0 8px;
    }

    .jamago-dashcode .topbar .navbar-nav .nav-link {
        min-width: 38px;
        min-height: 38px;
        padding: 8px;
    }

    .jamago-dashcode #jamago-switch-vendor-form .form-control {
        width: 132px;
        min-width: 0;
        max-width: 32vw;
    }

    .jamago-dashcode .language-list {
        display: none !important;
    }

    .jamago-dashcode .left-sidebar,
    body.jamago-dashcode.mini-sidebar .left-sidebar {
        top: var(--jg-header-height) !important;
        width: min(286px, 84vw);
        padding: 14px 12px 22px;
        transform: translateX(-105%);
    }

    [dir="rtl"] .jamago-dashcode .left-sidebar,
    [dir="rtl"] body.jamago-dashcode.mini-sidebar .left-sidebar {
        transform: translateX(105%);
    }

    body.jamago-dashcode.show-sidebar .left-sidebar {
        transform: translateX(0);
    }

    body.jamago-dashcode.show-sidebar .jamago-sidebar-backdrop {
        display: block;
    }

    body.jamago-dashcode.mini-sidebar .sidebar-nav .hide-menu {
        display: inline !important;
    }

    body.jamago-dashcode.mini-sidebar .sidebar-nav .has-arrow::after {
        display: block !important;
    }

    body.jamago-dashcode.mini-sidebar .sidebar-nav ul li a {
        justify-content: flex-start;
        padding: 10px 12px;
    }

    body.jamago-dashcode.mini-sidebar .sidebar-nav ul li a i {
        flex-basis: 28px;
        justify-content: flex-start;
        width: 28px;
        margin-right: 8px;
    }

    .jamago-dashcode .page-wrapper,
    .jamago-dashcode main > #main-wrapper.page-wrapper,
    body.jamago-dashcode.mini-sidebar .page-wrapper,
    body.jamago-dashcode.mini-sidebar main > #main-wrapper.page-wrapper {
        margin-right: 0;
        margin-left: 0;
        padding: calc(var(--jg-header-height) + 18px) 14px 28px !important;
    }

    body.jamago-dashcode.sticky .page-wrapper {
        padding-top: calc(var(--jg-header-height) + 18px) !important;
    }

    .jamago-dashcode .card-body {
        padding: 17px;
    }

    .jamago-dashcode .business-analytics > .card-body {
        padding: 17px;
    }

    .jamago-dashcode .dataTables_wrapper .dataTables_filter,
    .jamago-dashcode .dataTables_wrapper .dataTables_length {
        float: none;
        text-align: left;
    }

    .jamago-dashcode .dataTables_wrapper .dataTables_filter input {
        width: calc(100% - 70px);
    }

    body.jamago-auth-page {
        background: var(--jg-canvas) !important;
    }

    .jamago-auth-page .login-register {
        display: block;
        padding: 28px 16px 34px !important;
        background: linear-gradient(180deg, var(--jg-primary-strong) 0, var(--jg-primary) 210px, var(--jg-canvas) 210px) !important;
    }

    .jamago-auth-page .login-logo {
        min-height: 138px;
        padding: 12px 34px 24px !important;
    }

    .jamago-auth-page .login-box {
        width: 100%;
        max-width: 520px;
    }

    .jamago-auth-page .login-box .card-body {
        padding: 25px 20px;
    }

    .jamago-auth-page .jamago-marca-agua {
        display: none;
    }

    .jamago-auth-page #app > main.py-4 {
        margin: 0;
        padding: 118px 14px 28px !important;
        background: linear-gradient(180deg, var(--jg-primary-strong) 0, var(--jg-primary) 92px, var(--jg-canvas) 92px);
    }

    .jamago-auth-page #app > main.py-4::before {
        top: 17px;
        left: 50%;
        width: 210px;
        height: 60px;
        transform: translateX(-50%);
    }

    .jamago-auth-page #app > main.py-4::after {
        display: none;
    }

    .jamago-auth-page #app > main > .container > .card-body {
        padding: 22px 17px;
    }

    .jamago-auth-page #app .form-group.row > label,
    .jamago-auth-page #app .form-group.row > [class*="col-"] {
        width: 100%;
        max-width: 100%;
        flex: 0 0 100%;
    }

    .jamago-auth-page #app .form-group.row > label {
        margin-bottom: 7px;
    }
}

@media (max-width: 479.98px) {
    .jamago-dashcode #jamago-switch-vendor-form {
        display: none;
    }

    .jamago-dashcode .page-titles h1,
    .jamago-dashcode .page-titles h2,
    .jamago-dashcode .page-titles h3,
    .jamago-dashcode .page-titles h4 {
        font-size: 22px;
    }

    .jamago-dashcode .card-header {
        padding: 15px 16px;
    }

    .jamago-auth-page .login-box .box-title {
        font-size: 23px;
    }
}

@media (prefers-reduced-motion: reduce) {
    .jamago-dashcode *,
    .jamago-auth-page * {
        scroll-behavior: auto !important;
        transition-duration: .01ms !important;
        animation-duration: .01ms !important;
        animation-iteration-count: 1 !important;
    }
}

@media print {
    .jamago-dashcode .topbar,
    .jamago-dashcode .left-sidebar,
    .jamago-dashcode .jamago-sidebar-backdrop {
        display: none !important;
    }

    .jamago-dashcode .page-wrapper,
    body.jamago-dashcode.mini-sidebar .page-wrapper {
        margin: 0 !important;
        padding: 0 !important;
        background: #fff !important;
    }

    .jamago-dashcode .card {
        box-shadow: none !important;
    }
}

/* ============================================================
   HOTFIX menu (2026-08-27): doble scroll, logo, hamburguesa
   ============================================================ */

/* #3 Un solo scroll en el sidebar. El tema usa slimScroll y el skin
   agrego overflow:auto a .scroll-sidebar -> DOS barras. Dejamos SOLO
   .scroll-sidebar como scroller y matamos los artefactos de slimScroll. */
.jamago-dashcode .left-sidebar .slimScrollDiv {
    height: auto !important;
    overflow: visible !important;
}
.jamago-dashcode .left-sidebar .slimScrollBar,
.jamago-dashcode .left-sidebar .slimScrollRail {
    display: none !important;
}
.jamago-dashcode .left-sidebar .scroll-sidebar {
    scrollbar-width: thin;
    scrollbar-color: rgba(255, 255, 255, .18) transparent;
}
.jamago-dashcode .left-sidebar .scroll-sidebar::-webkit-scrollbar {
    width: 6px;
}
.jamago-dashcode .left-sidebar .scroll-sidebar::-webkit-scrollbar-thumb {
    background: rgba(255, 255, 255, .18);
    border-radius: 4px;
}
.jamago-dashcode .left-sidebar .scroll-sidebar::-webkit-scrollbar-track {
    background: transparent;
}

/* #4 Logo mas grande en el header expandido (el PNG es casi cuadrado;
   lo llevamos al maximo que cabe en el header de 72px). */
.jamago-dashcode .topbar .navbar-brand .dark-logo,
.jamago-dashcode .topbar .navbar-brand #logo_web {
    width: auto !important;
    max-width: 220px !important;
    height: 62px !important;
    max-height: 62px !important;
    object-fit: contain;
}

/* #1 Hamburguesa mas visible en movil (existe y abre el menu, pero
   pasaba desapercibida por ser gris y chica). */
@media (max-width: 767.98px) {
    .jamago-dashcode .topbar .nav-toggler {
        color: var(--jg-primary) !important;
        min-width: 44px;
        min-height: 44px;
    }
    .jamago-dashcode .topbar .nav-toggler i {
        font-size: 26px;
    }
}

/* ============================================================
   HOTFIX register (2026-08-27): el form de register es ancho y
   NO le queda el split del login (panel azul + margin-left:42%).
   Lo pasamos a full-width centrado, fondo claro, sin panel.
   Scoped por .restaurant_payout_create (solo register; reset/
   confirm/verify siguen con el split del login, que si les queda).
   ============================================================ */
body.jamago-auth-page:has(.restaurant_payout_create) {
    background: var(--jg-canvas) !important;
}
body.jamago-auth-page:has(.restaurant_payout_create)::after {
    display: none !important;
}
.jamago-auth-page #app > main.py-4:has(.restaurant_payout_create) {
    margin-left: 0 !important;
    padding: 40px 4vw 48px !important;
}
.jamago-auth-page #app > main.py-4:has(.restaurant_payout_create)::before,
.jamago-auth-page #app > main.py-4:has(.restaurant_payout_create)::after {
    display: none !important;
}
.jamago-auth-page #app > main.py-4:has(.restaurant_payout_create) > .container {
    max-width: 640px;
    margin: 0 auto;
}

/* ---- Register: tarjeta branded (page-titles=card, col titulo=banda azul) ---- */
.jamago-auth-page #app > main.py-4:has(.restaurant_payout_create) {
    padding-top: 48px !important;
}
.jamago-auth-page #app > main.py-4:has(.restaurant_payout_create) > .container {
    max-width: 600px !important;
}
.jamago-auth-page #app > main.py-4:has(.restaurant_payout_create) .page-titles {
    display: block !important;
    margin: 0 !important;
    padding: 0 !important;
    background: var(--jg-surface) !important;
    border: 1px solid var(--jg-border) !important;
    border-radius: var(--jg-radius-lg) !important;
    box-shadow: 0 20px 45px rgba(2, 6, 23, .10) !important;
    overflow: hidden;
}
.jamago-auth-page #app > main.py-4:has(.restaurant_payout_create) .page-titles > .col-md-12 {
    margin: 0 !important;
    padding: 30px 28px 24px !important;
    background: linear-gradient(105deg, var(--jg-primary-strong), var(--jg-primary)) !important;
    text-align: center !important;
}
.jamago-auth-page #app > main.py-4:has(.restaurant_payout_create) .page-titles > .col-md-12::before {
    display: block;
    height: 44px;
    margin: 0 auto 12px;
    content: "";
    background: url("../images/logo_web_claro_sinfondo.png") center / contain no-repeat;
}
.jamago-auth-page #app > main.py-4:has(.restaurant_payout_create) .page-titles > .col-md-12 h3 {
    margin: 0 !important;
    color: #fff !important;
    font-size: 25px !important;
    font-weight: 800 !important;
}
.jamago-auth-page #app > main.py-4:has(.restaurant_payout_create) .page-titles > .card-body {
    margin: 0 !important;
    border: 0 !important;
    box-shadow: none !important;
    border-radius: 0 !important;
    background: var(--jg-surface) !important;
    padding: 26px 30px 6px !important;
}
.jamago-auth-page #app > main.py-4:has(.restaurant_payout_create) .page-titles > .form-group.col-12 {
    margin: 0 !important;
    padding: 4px 30px 30px !important;
}

/* ---- Register: campos a ancho completo + logo de banda mas grande ---- */
.jamago-auth-page #app > main.py-4:has(.restaurant_payout_create) .restaurant_payout_create {
    max-width: 100% !important;
    width: 100% !important;
    display: block !important;
    margin: 0 !important;
}
.jamago-auth-page #app > main.py-4:has(.restaurant_payout_create) .restaurant_payout_create-inner {
    width: 100% !important;
    max-width: 100% !important;
}
.jamago-auth-page #app > main.py-4:has(.restaurant_payout_create) .page-titles > .col-md-12::before {
    height: 60px !important;
    margin-bottom: 14px !important;
}

/* ---- Register: campo Telefono (select2 pais como prefijo integrado) ---- */
.jamago-auth-page #app .phone-box { display: block !important; }
.jamago-auth-page #app .phone-box .select2-container {
    position: absolute !important;
    left: 1px !important;
    top: 1px !important;
    bottom: 1px !important;
    width: 100px !important;
    height: auto !important;
    z-index: 3;
}
.jamago-auth-page #app .phone-box .select2-container .select2-selection--single {
    height: 100% !important;
    min-height: 42px !important;
    display: flex !important;
    align-items: center !important;
    border: 0 !important;
    border-right: 1px solid var(--jg-border) !important;
    border-radius: 8px 0 0 8px !important;
    background: #f8fafc !important;
    padding: 0 22px 0 12px !important;
    outline: none !important;
}
.jamago-auth-page #app .phone-box .select2-selection__clear { display: none !important; }
.jamago-auth-page #app .phone-box .select2-selection__rendered {
    padding: 0 !important;
    margin: 0 !important;
    color: var(--jg-text) !important;
    font-weight: 600 !important;
    font-size: 14px !important;
    line-height: 1.2 !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
}
.jamago-auth-page #app .phone-box .select2-selection__rendered > span {
    display: inline-flex !important;
    align-items: center !important;
    gap: 7px !important;
}
.jamago-auth-page #app .phone-box .img-flag {
    width: 22px !important;
    height: 15px !important;
    object-fit: cover;
    border-radius: 3px;
    box-shadow: 0 0 0 1px rgba(0, 0, 0, .08);
    vertical-align: middle;
}
.jamago-auth-page #app .phone-box .select2-selection__arrow {
    height: 100% !important;
    top: 0 !important;
    right: 6px !important;
}
.jamago-auth-page #app .phone-box .user_phone {
    padding-left: 114px !important;
}

/* ocultar la X de allowClear del select2 del telefono a prueba de balas */
.jamago-auth-page #app .phone-box .select2-container .select2-selection__clear,
.jamago-auth-page #app .phone-box span.select2-selection__clear {
    display: none !important;
    visibility: hidden !important;
    width: 0 !important;
    height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: hidden !important;
    position: absolute !important;
    pointer-events: none !important;
}

/* ============================================================
   HOTFIX 2026-08-28: (4) menu lateral scrollea; (3) tablas con aire
   ============================================================ */

/* (4) El sidebar recortaba los items de abajo: .left-sidebar tenia overflow:hidden y el
   .scroll-sidebar quedaba mas alto que el sidebar (no scrolleaba). Ahora scrollea el .left-sidebar. */
.jamago-dashcode .left-sidebar {
    height: calc(100vh - var(--jg-header-height)) !important;
    overflow-y: auto !important;
    overflow-x: hidden !important;
    scrollbar-width: thin;
    scrollbar-color: rgba(255, 255, 255, .18) transparent;
}
.jamago-dashcode .left-sidebar .scroll-sidebar,
.jamago-dashcode .left-sidebar .slimScrollDiv {
    height: auto !important;
    overflow: visible !important;
}
.jamago-dashcode .left-sidebar::-webkit-scrollbar { width: 6px; }
.jamago-dashcode .left-sidebar::-webkit-scrollbar-thumb { background: rgba(255, 255, 255, .18); border-radius: 4px; }
.jamago-dashcode .left-sidebar::-webkit-scrollbar-track { background: transparent; }

/* (3) Tablas (Pedidos recientes y DataTables en general): mas padding, header prolijo, hover.
   Antes el texto quedaba pegado a los bordes y sin jerarquia visual. */
.jamago-dashcode .table thead th,
.jamago-dashcode table.dataTable thead th {
    padding: 12px 18px !important;
    font-size: 11px !important;
    font-weight: 700 !important;
    letter-spacing: .04em;
    text-transform: uppercase;
    color: #64748b !important;
    border-bottom: 1px solid var(--jg-border) !important;
    white-space: nowrap;
}
.jamago-dashcode .table td,
.jamago-dashcode table.dataTable td {
    padding: 13px 18px !important;
    vertical-align: middle !important;
    border-top: 1px solid var(--jg-border) !important;
}
.jamago-dashcode table.dataTable tbody tr:hover td {
    background: rgba(24, 73, 152, .03);
}
/* En pantallas chicas la tabla scrollea horizontal en su contenedor, sin desbordar la card. */
.jamago-dashcode .dataTables_wrapper {
    overflow-x: auto;
}

/* HOTFIX Pedidos recientes: la .card-body es .p-0 (el template la deja sin padding para que el
   DataTable ocupe todo), asi que los controles (Mostrar/Buscar/Mostrando/paginacion) y la tabla
   quedaban pegados al borde. Damos el margen en el wrapper y alineamos 1a/ultima celda con ellos. */
.jamago-dashcode .card-body.p-0 .dataTables_wrapper {
    padding: 6px 22px 12px;
}
.jamago-dashcode .card-body.p-0 table.dataTable th:first-child,
.jamago-dashcode .card-body.p-0 table.dataTable td:first-child {
    padding-left: 0 !important;
}
.jamago-dashcode .card-body.p-0 table.dataTable th:last-child,
.jamago-dashcode .card-body.p-0 table.dataTable td:last-child {
    padding-right: 0 !important;
}

/* ============================================================
   RONDA DE COMPONENTES — 2026-09-03
   Defectos verificados en el DOM, no supuestos. Todo por CSS:
   ninguna vista cambia.
   ============================================================ */

/* (1) Casillas de verificacion --------------------------------------------
   CORRECCION de la ronda anterior. El template YA dibuja la casilla:
   `style.css:18159` esconde el input nativo (position:absolute, left:-9999px,
   opacity:0) y `[type=checkbox] + label` reserva 35px de padding para pintarla
   con pseudo-elementos. Funciona siempre que el label vaya pegado al input.

   En la ronda anterior le di cuerpo al input creyendo que faltaba, y provoque
   dos cosas: la casilla oculta paso a `position:static` y empezo a ocupar 18px
   de hueco al lado de la caja dibujada (medido en la tabla de Pedidos), y al
   poner `padding-left:0` en el label le quite justo los 35px donde se pinta la
   caja. Se revierte: el input no se toca.

   El defecto real es solo el ancho del label. El template le pone
   `class="col-3 control-label"`, y `col-3` es rejilla: flex 0 0 25%, 119px
   medidos. Cualquier texto de mas de unos quince caracteres se parte en dos,
   tres o cuatro lineas ("Bueno para / cenar / (deshabili / tado)"). 75 usos. */
.jamago-dashcode .form-check > label,
.jamago-dashcode .form-check > .control-label {
    flex: 0 1 auto !important;
    width: auto !important;
    max-width: none !important;
    margin-bottom: 0;
    font-weight: 500;
    color: var(--jg-text);
}

/* Casilla suelta, sin label al lado: el patron del template la deja invisible
   porque no hay quien la dibuje. Pasa en Sucursales, donde el interruptor de
   notificaciones por sucursal no se ve ni se puede pulsar, mientras el texto
   de la pantalla explica que esta ahi. Se le devuelve cuerpo propio. */
.jamago-dashcode input[type="checkbox"].jamago-notify-toggle {
    position: static !important;
    left: auto !important;
    opacity: 1 !important;
    appearance: none;
    -webkit-appearance: none;
    width: 18px;
    height: 18px;
    margin: 0;
    background-color: var(--jg-surface);
    border: 1.5px solid var(--jg-border-strong);
    border-radius: 5px;
    cursor: pointer;
    transition: background-color .15s ease, border-color .15s ease, box-shadow .15s ease;
}
.jamago-dashcode input[type="checkbox"].jamago-notify-toggle:checked {
    background-color: var(--jg-primary);
    border-color: var(--jg-primary);
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='%23fff' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3.5 8.5l3 3 6-6'/%3E%3C/svg%3E");
    background-size: 78%;
    background-position: center;
    background-repeat: no-repeat;
}
.jamago-dashcode input[type="checkbox"].jamago-notify-toggle:focus-visible {
    outline: none;
    box-shadow: 0 0 0 3px var(--jg-ring);
    border-color: var(--jg-primary);
}

/* (2) Etiquetas de estado -------------------------------------------------
   `badge-success` venia con texto verde oscuro sobre fondo verde puro:
   contraste 1.6:1, el texto no se leia. Se pasa a fondo suave con texto
   oscuro del mismo tono, que cumple AA y encaja con el panel. */
.jamago-dashcode .badge,
.jamago-dashcode .label {
    display: inline-flex;
    align-items: center;
    padding: .34em .72em;
    font-size: .72rem;
    font-weight: 600;
    line-height: 1.45;
    letter-spacing: .01em;
    border-radius: 999px;
    border: 1px solid transparent;
    vertical-align: middle;
}
.jamago-dashcode .badge-success, .jamago-dashcode .label-success { background: #dcfce7; color: #166534; border-color: #bbf7d0; }
.jamago-dashcode .badge-danger,  .jamago-dashcode .label-danger  { background: #ffe4e6; color: #9f1239; border-color: #fecdd3; }
.jamago-dashcode .badge-warning, .jamago-dashcode .label-warning { background: #fef3c7; color: #92400e; border-color: #fde68a; }
.jamago-dashcode .badge-info,    .jamago-dashcode .label-info    { background: #e0f2fe; color: #075985; border-color: #bae6fd; }
.jamago-dashcode .badge-primary, .jamago-dashcode .label-primary { background: var(--jg-primary-soft); color: var(--jg-primary-strong); border-color: rgba(24,73,152,.18); }
.jamago-dashcode .badge-secondary { background: var(--jg-surface-muted); color: var(--jg-text-muted); border-color: var(--jg-border); }
.jamago-dashcode .badge-dark    { background: #e2e8f0; color: #1e293b; border-color: #cbd5e1; }

/* (3) Interruptores -------------------------------------------------------
   El tema los pinta `red` apagado y `green` encendido, colores puros que
   desentonan; ademas solo estaban definidos dentro de `.table td`, asi que
   fuera de una tabla salian como un circulo naranja. */
.jamago-dashcode .switch {
    position: relative;
    display: inline-block;
    width: 46px;
    height: 26px;
    vertical-align: middle;
    margin: 0;
}
.jamago-dashcode .switch input { opacity: 0; width: 0; height: 0; position: absolute; }
.jamago-dashcode .switch .slider,
.jamago-dashcode .table tr td .switch .slider {
    position: absolute;
    inset: 0;
    cursor: pointer;
    background-color: var(--jg-border-strong);
    border-radius: 999px;
    transition: background-color .2s ease, box-shadow .2s ease;
    /* El marcado es `<span class="slider round">` y `style.css` define un `.round`
       global para avatares (50x50, line-height 48, redondo entero). Fuera de una
       tabla esa clase ganaba y el interruptor salia como un circulo. */
    width: auto;
    height: auto;
    line-height: normal;
    font-size: 0;
}
.jamago-dashcode .switch .slider::before,
.jamago-dashcode .table tr td .switch .slider::before {
    content: "";
    position: absolute;
    height: 20px;
    width: 20px;
    left: 3px;
    bottom: 3px;
    background-color: #fff;
    border-radius: 50%;
    box-shadow: 0 1px 3px rgba(15, 23, 42, .25);
    transition: transform .2s ease;
}
.jamago-dashcode .switch input:checked + .slider,
.jamago-dashcode .table tr td .switch input:checked + .slider { background-color: var(--jg-success); }
.jamago-dashcode .switch input:checked + .slider::before,
.jamago-dashcode .table tr td .switch input:checked + .slider::before { transform: translateX(20px); }
.jamago-dashcode .switch input:focus-visible + .slider { box-shadow: 0 0 0 3px var(--jg-ring); }
.jamago-dashcode .switch input:disabled + .slider { opacity: .5; cursor: not-allowed; }

/* (4) Campo de archivo ----------------------------------------------------
   `<input type="file">` salia con el control nativo del navegador, gris y
   cuadrado, rompiendo la linea del resto del formulario. */
.jamago-dashcode input[type="file"],
.jamago-dashcode .form-control-file {
    display: block;
    width: 100%;
    padding: .45rem .6rem;
    font-size: .86rem;
    color: var(--jg-text-muted);
    background-color: var(--jg-surface-muted);
    border: 1px dashed var(--jg-border-strong);
    border-radius: var(--jg-radius-sm);
    cursor: pointer;
}
.jamago-dashcode input[type="file"]::file-selector-button {
    margin-right: .75rem;
    padding: .35rem .8rem;
    font-size: .82rem;
    font-weight: 600;
    color: var(--jg-primary-strong);
    background: var(--jg-primary-soft);
    border: 0;
    border-radius: 999px;
    cursor: pointer;
    transition: background-color .15s ease;
}
.jamago-dashcode input[type="file"]:hover { border-color: var(--jg-primary); }
.jamago-dashcode input[type="file"]::file-selector-button:hover { background: rgba(24, 73, 152, .16); }

/* (5) Botones de cierre ---------------------------------------------------
   La "x" de modales y avisos era gris palido de 1rem, sin area de click
   comoda: dificil de ver y de acertar, sobre todo en movil. */
.jamago-dashcode .close,
.jamago-dashcode .modal-header .close,
.jamago-dashcode .alert .close {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    padding: 0;
    margin: -4px -6px -4px 0;
    font-size: 1.35rem;
    line-height: 1;
    color: var(--jg-text-muted);
    opacity: 1;
    border: 0;
    border-radius: 50%;
    background: transparent;
    text-shadow: none;
    transition: background-color .15s ease, color .15s ease;
}
.jamago-dashcode .close:hover,
.jamago-dashcode .close:focus-visible {
    color: var(--jg-text);
    background: var(--jg-surface-muted);
    outline: none;
}
.jamago-dashcode .close:focus-visible { box-shadow: 0 0 0 3px var(--jg-ring); }

/* (6) Grupos de campo -----------------------------------------------------
   Los complementos ($ / USD) tenian radio 4px mientras el campo usa 8px:
   la union se veia escalonada. */
.jamago-dashcode .input-group-text {
    background-color: var(--jg-surface-muted);
    border-color: var(--jg-border-strong);
    color: var(--jg-text-muted);
    font-weight: 600;
    font-size: .85rem;
    padding: .45rem .8rem;
}
.jamago-dashcode .input-group > .input-group-prepend > .input-group-text {
    border-top-left-radius: var(--jg-radius-sm);
    border-bottom-left-radius: var(--jg-radius-sm);
}
.jamago-dashcode .input-group > .input-group-append > .input-group-text {
    border-top-right-radius: var(--jg-radius-sm);
    border-bottom-right-radius: var(--jg-radius-sm);
}
.jamago-dashcode .input-group > .form-control:not(:first-child) { border-top-left-radius: 0; border-bottom-left-radius: 0; }
.jamago-dashcode .input-group > .form-control:not(:last-child) { border-top-right-radius: 0; border-bottom-right-radius: 0; }

/* (7) Paginacion ----------------------------------------------------------
   Los numeros iban apretados y el activo era un cuadrado, unico angulo recto
   en un panel donde todo lo demas va redondeado. */
.jamago-dashcode .pagination { gap: .3rem; }
.jamago-dashcode .pagination .page-link {
    min-width: 36px;
    height: 36px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0 .7rem;
    border-radius: var(--jg-radius-sm);
    border: 1px solid var(--jg-border);
    color: var(--jg-text);
    background: var(--jg-surface);
    font-size: .85rem;
    font-weight: 500;
}
.jamago-dashcode .pagination .page-item.active .page-link {
    background: var(--jg-primary);
    border-color: var(--jg-primary);
    color: #fff;
    font-weight: 600;
}
.jamago-dashcode .pagination .page-item.disabled .page-link { color: var(--jg-text-muted); background: var(--jg-surface-muted); }
.jamago-dashcode .pagination .page-link:hover { border-color: var(--jg-border-strong); background: var(--jg-surface-muted); }
.jamago-dashcode .pagination .page-link:focus-visible { outline: none; box-shadow: 0 0 0 3px var(--jg-ring); }

/* (8) Tablas: respiro en los extremos ------------------------------------
   La primera y la ultima celda quedaban pegadas al borde de la tarjeta. */
.jamago-dashcode .table > thead > tr > th:first-child,
.jamago-dashcode .table > tbody > tr > td:first-child { padding-left: 1.1rem; }
.jamago-dashcode .table > thead > tr > th:last-child,
.jamago-dashcode .table > tbody > tr > td:last-child { padding-right: 1.1rem; }
/* La columna de acciones respira entre botones y no se parte en dos lineas. */
.jamago-dashcode .table td .btn + .btn { margin-left: .35rem; }
.jamago-dashcode .table td .btn-sm { white-space: nowrap; }

/* (9) Etiqueta de estado dentro de tablas --------------------------------
   `style.css:23010` trae `.table tr td > span.badge-success { background: green }`
   con mas especificidad que la paleta del skin, asi que en TODAS las tablas del
   panel el estado "Entregado" salia verde oscuro sobre verde: contraste 1.6:1,
   ilegible. Es la etiqueta mas usada (13 apariciones en las vistas). */
.jamago-dashcode .table tr td > span.badge-success,
.jamago-dashcode .table tr td > span.badge.badge-success {
    background: #dcfce7;
    color: #166534;
    border-color: #bbf7d0;
}

/* (10) Etiqueta primaria: contraste ---------------------------------------
   Usaba los tokens --jg-primary-soft / --jg-primary-strong, que se invierten
   en modo oscuro: fondo azul translucido con texto azul marino daba 3.21:1,
   por debajo del minimo AA. Se fija con colores propios como el resto. */
.jamago-dashcode .badge-primary,
.jamago-dashcode .label-primary {
    background: #dbeafe;
    color: #1e40af;
    border-color: #bfdbfe;
}

/* (11) Avisos en modo oscuro ---------------------------------------------
   En oscuro los cuatro tipos quedaban del mismo gris: el aviso de error se
   leia igual que el de exito y se perdia el codigo de color. Se recupera con
   un tinte de fondo y una barra lateral del color del estado. */
html[data-jamago-theme="dark"] .jamago-dashcode .alert {
    border-left: 3px solid transparent;
    color: var(--jg-text);
}
html[data-jamago-theme="dark"] .jamago-dashcode .alert-success { background: rgba(22, 163, 74, .14); border-left-color: #22c55e; }
html[data-jamago-theme="dark"] .jamago-dashcode .alert-danger  { background: rgba(225, 29, 72, .14); border-left-color: #fb7185; }
html[data-jamago-theme="dark"] .jamago-dashcode .alert-warning { background: rgba(245, 158, 11, .14); border-left-color: #fbbf24; }
html[data-jamago-theme="dark"] .jamago-dashcode .alert-info    { background: rgba(2, 132, 199, .14); border-left-color: #38bdf8; }

/* ============================================================
   RONDA 2 — plugins: select2, DataTables y SweetAlert2
   ============================================================ */

/* (12) select2 ------------------------------------------------------------
   El desplegable simple ya seguia al skin, pero el resto no: el multiple
   conservaba el aspecto de fabrica (alto 40 frente a los 44 del resto, radio
   4 frente a 8, borde #aaa), las pastillas eran grises con esquinas rectas y
   la opcion resaltada usaba el azul propio de select2 (#5897fb) en vez del
   azul JamaGO. Son 48 usos repartidos por el panel. */
.jamago-dashcode .select2-container--default .select2-selection--single,
.jamago-auth-page .select2-container--default .select2-selection--single {
    font-size: .875rem;
    border-color: var(--jg-border);
}
.jamago-dashcode .select2-container--default .select2-selection--multiple,
.jamago-auth-page .select2-container--default .select2-selection--multiple {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    min-height: 44px;
    height: auto;
    padding: .15rem .4rem;
    background-color: var(--jg-surface);
    border: 1px solid var(--jg-border);
    border-radius: var(--jg-radius-sm);
    font-size: .875rem;
}
.jamago-dashcode .select2-container--default.select2-container--focus .select2-selection--multiple,
.jamago-dashcode .select2-container--default.select2-container--open .select2-selection--single,
.jamago-dashcode .select2-container--default.select2-container--open .select2-selection--multiple {
    border-color: var(--jg-primary);
    box-shadow: 0 0 0 3px var(--jg-ring);
}
/* Pastillas de seleccion: mismo lenguaje que las etiquetas de estado. */
.jamago-dashcode .select2-container--default .select2-selection--multiple .select2-selection__choice {
    display: inline-flex;
    align-items: center;
    gap: .35rem;
    margin: .18rem .3rem .18rem 0;
    padding: .18rem .6rem;
    background: var(--jg-primary-soft);
    color: var(--jg-primary-strong);
    border: 1px solid rgba(24, 73, 152, .16);
    border-radius: 999px;
    font-size: .78rem;
    font-weight: 600;
    line-height: 1.5;
}
.jamago-dashcode .select2-container--default .select2-selection--multiple .select2-selection__choice__remove {
    order: 2;
    margin: 0;
    color: var(--jg-primary-strong);
    opacity: .65;
    font-size: 1rem;
    line-height: 1;
    border: 0;
    background: none;
}
.jamago-dashcode .select2-container--default .select2-selection--multiple .select2-selection__choice__remove:hover { opacity: 1; }
/* Opcion resaltada con el azul del panel, no el de la libreria. */
.jamago-dashcode .select2-container--default .select2-results__option--highlighted[aria-selected],
.jamago-auth-page .select2-container--default .select2-results__option--highlighted[aria-selected] {
    background-color: var(--jg-primary);
    color: #fff;
}
.jamago-dashcode .select2-container--default .select2-results__option[aria-selected="true"] {
    background-color: var(--jg-primary-soft);
    color: var(--jg-primary-strong);
    font-weight: 600;
}
.jamago-dashcode .select2-results__option { padding: .5rem .75rem; font-size: .875rem; }
.jamago-dashcode .select2-search--dropdown .select2-search__field {
    border: 1px solid var(--jg-border);
    border-radius: var(--jg-radius-sm);
    padding: .4rem .6rem;
    font-size: .875rem;
}
.jamago-dashcode .select2-search--dropdown .select2-search__field:focus {
    outline: none;
    border-color: var(--jg-primary);
    box-shadow: 0 0 0 3px var(--jg-ring);
}

/* (13) SweetAlert2 --------------------------------------------------------
   El panel manda TODAS las notificaciones por SweetAlert2: `toastr.*` esta
   redirigido a el en el layout, asi que estos estilos cubren tanto los avisos
   flotantes como los dialogos de confirmacion (45 llamadas a Swal.fire).
   El aviso flotante salia en `top-end`, pegado al borde superior: se montaba
   encima de la cabecera fija y tapaba la marca. Se baja por debajo de ella. */
.swal2-container.swal2-top-end,
.swal2-container.swal2-top-right { padding-top: calc(var(--jg-header-height, 84px) + 12px); padding-right: 18px; }
.swal2-popup.swal2-toast {
    border-radius: var(--jg-radius);
    box-shadow: var(--jg-shadow);
    border: 1px solid var(--jg-border);
    padding: .7rem .9rem;
}
.swal2-popup.swal2-toast .swal2-title { font-size: .9rem; font-weight: 600; color: var(--jg-text); margin: 0; }
.swal2-popup.swal2-toast .swal2-timer-progress-bar { background: var(--jg-primary); }

/* Dialogos: mismo radio, sombra y botones que el resto del panel. */
.swal2-popup {
    border-radius: var(--jg-radius-lg);
    box-shadow: var(--jg-shadow-lg);
    font-family: inherit;
}
.swal2-popup .swal2-title { font-size: 1.15rem; font-weight: 700; color: var(--jg-text); }
.swal2-popup .swal2-html-container { font-size: .92rem; color: var(--jg-text-muted); }
.swal2-popup .swal2-actions { gap: .5rem; }
.swal2-popup .swal2-styled {
    border-radius: var(--jg-radius-sm);
    padding: .55rem 1.15rem;
    font-size: .88rem;
    font-weight: 600;
    box-shadow: none;
}
.swal2-popup .swal2-styled.swal2-confirm { background: var(--jg-primary); }
.swal2-popup .swal2-styled.swal2-confirm:focus-visible { box-shadow: 0 0 0 3px var(--jg-ring); }
.swal2-popup .swal2-styled.swal2-cancel {
    background: var(--jg-surface);
    color: var(--jg-text);
    border: 1px solid var(--jg-border-strong);
}
/* En modo oscuro el dialogo salia blanco sobre el panel oscuro. */
[data-jamago-theme="dark"] .swal2-popup {
    background: var(--jg-surface);
    color: var(--jg-text);
    border: 1px solid var(--jg-border);
}
[data-jamago-theme="dark"] .swal2-popup .swal2-title { color: var(--jg-text); }
[data-jamago-theme="dark"] .swal2-popup .swal2-html-container { color: var(--jg-text-muted); }
[data-jamago-theme="dark"] .swal2-popup .swal2-styled.swal2-cancel { background: var(--jg-surface-muted); color: var(--jg-text); }

/* (14) DataTables ---------------------------------------------------------
   El buscador y el selector de "mostrar N" usaban un borde mas oscuro que el
   de los campos del formulario, y no tenian estado de foco: al tabular no se
   veia donde estabas. 22 vistas montan DataTables. */
.jamago-dashcode .dataTables_wrapper .dataTables_filter input,
.jamago-dashcode .dataTables_wrapper .dataTables_length select {
    border: 1px solid var(--jg-border);
    border-radius: var(--jg-radius-sm);
    padding: .35rem .6rem;
    font-size: .86rem;
    color: var(--jg-text);
    background-color: var(--jg-surface);
}
.jamago-dashcode .dataTables_wrapper .dataTables_filter input:focus,
.jamago-dashcode .dataTables_wrapper .dataTables_length select:focus {
    outline: none;
    border-color: var(--jg-primary);
    box-shadow: 0 0 0 3px var(--jg-ring);
}
.jamago-dashcode .dataTables_wrapper .dataTables_filter { margin-bottom: .5rem; }
.jamago-dashcode .dataTables_wrapper .dataTables_info,
.jamago-dashcode .dataTables_wrapper .dataTables_length label,
.jamago-dashcode .dataTables_wrapper .dataTables_filter label { color: var(--jg-text-muted); font-size: .82rem; }
/* Los botones de pagina de DataTables no son .pagination, asi que no heredaban
   el estilo de la paginacion del panel. */
.jamago-dashcode .dataTables_wrapper .dataTables_paginate .paginate_button {
    min-width: 34px;
    padding: .3rem .6rem !important;
    margin-left: .25rem;
    border-radius: var(--jg-radius-sm) !important;
    border: 1px solid var(--jg-border) !important;
    background: var(--jg-surface) !important;
    color: var(--jg-text) !important;
    font-size: .82rem;
}
.jamago-dashcode .dataTables_wrapper .dataTables_paginate .paginate_button.current {
    background: var(--jg-primary) !important;
    border-color: var(--jg-primary) !important;
    color: #fff !important;
    font-weight: 600;
}
.jamago-dashcode .dataTables_wrapper .dataTables_paginate .paginate_button.disabled {
    color: var(--jg-text-muted) !important;
    background: var(--jg-surface-muted) !important;
    opacity: .7;
}
.jamago-dashcode .dataTables_wrapper .dataTables_paginate .paginate_button:hover:not(.current):not(.disabled) {
    background: var(--jg-surface-muted) !important;
    border-color: var(--jg-border-strong) !important;
}

/* (15) select2 en modo oscuro --------------------------------------------
   Dos fallos que solo salen con el tema oscuro:
   - La opcion ya seleccionada usaba los tokens primary-soft/primary-strong,
     que en oscuro dan azul marino sobre azul translucido: 3.21:1, por debajo
     de AA. Es el mismo tropiezo que tuvo la etiqueta primaria.
   - El campo de busqueda del desplegable heredaba texto y borde negros sobre
     fondo oscuro: se escribia a ciegas. */
html[data-jamago-theme="dark"] .jamago-dashcode .select2-container--default .select2-results__option[aria-selected="true"] {
    background-color: rgba(59, 130, 246, .22);
    color: #dbeafe;
}
html[data-jamago-theme="dark"] .jamago-dashcode .select2-search--dropdown .select2-search__field,
html[data-jamago-theme="dark"] .jamago-dashcode .select2-container--default .select2-selection--single .select2-selection__rendered,
html[data-jamago-theme="dark"] .jamago-dashcode .select2-selection--multiple .select2-search__field {
    background-color: var(--jg-surface-muted);
    border-color: var(--jg-border);
    color: var(--jg-text);
}
html[data-jamago-theme="dark"] .jamago-dashcode .select2-search--dropdown .select2-search__field::placeholder { color: var(--jg-text-muted); }

/* (16) Estados de pedido -------------------------------------------------
   El panel no usa `badge-*` para los estados, sino clases propias que
   `style.css` pinta en blanco sobre color saturado. Medido en produccion,
   ninguna llega al minimo AA de 4.5:1 y la peor es la mas frecuente:

     .order_placed    blanco sobre #ffc107  ->  1.63:1   (ilegible)
     .order_pending   blanco sobre #17a2b8  ->  2.6:1
     .order_accepted  blanco sobre #007bff  ->  3.1:1
     .order_rejected  blanco sobre rojo     ->  4.0:1

   Pasan al mismo sistema de pastilla suave que las demas etiquetas, que ya
   estaba verificado entre 6.4 y 7.2:1. Ademas el estado deja de gritar: en
   una lista de treinta pedidos, treinta rectangulos rojos y ambar saturados
   cansan y no jerarquizan nada. */
.jamago-dashcode .order_placed,
.jamago-dashcode .order_accepted,
.jamago-dashcode .order_rejected,
.jamago-dashcode .order_completed,
.jamago-dashcode .order_shipped,
.jamago-dashcode .order_pending,
.jamago-dashcode .order_cancelled,
.jamago-dashcode .order_inTransit {
    display: inline-flex;
    align-items: center;
    padding: .3em .72em !important;
    border-radius: 999px !important;
    font-size: .74rem;
    font-weight: 600;
    line-height: 1.5;
    letter-spacing: .01em;
    border: 1px solid transparent;
    white-space: nowrap;
}
.jamago-dashcode .order_placed    { background-color: #fef3c7 !important; color: #92400e !important; border-color: #fde68a; }
.jamago-dashcode .order_pending   { background-color: #e0f2fe !important; color: #075985 !important; border-color: #bae6fd; }
.jamago-dashcode .order_accepted  { background-color: #dbeafe !important; color: #1e40af !important; border-color: #bfdbfe; }
.jamago-dashcode .order_shipped,
.jamago-dashcode .order_inTransit { background-color: #ede9fe !important; color: #5b21b6 !important; border-color: #ddd6fe; }
.jamago-dashcode .order_completed { background-color: #dcfce7 !important; color: #166534 !important; border-color: #bbf7d0; }
.jamago-dashcode .order_rejected,
.jamago-dashcode .order_cancelled { background-color: #ffe4e6 !important; color: #9f1239 !important; border-color: #fecdd3; }

/* (17) Chosen -------------------------------------------------------------
   Tercer plugin de seleccion del panel, ademas de select2 y los <select>
   normales: se usa en 8 vistas con 14 inicializaciones, entre ellas
   Mi restaurante, Crear/editar producto y Reportes. Nunca se habia estilado,
   asi que salia con el aspecto de fabrica y desentonaba al lado de todo lo
   demas. Medido en produccion:

     caja Chosen   29px de alto, radio 0,  borde #aaa, fuente 13px
     campo normal  44px de alto, radio 8,  borde #e2e8f0, fuente 14px

   Se alinea con el resto de campos y con las pastillas de select2. */
.jamago-dashcode .chosen-container { width: 100% !important; font-size: .875rem; }
.jamago-dashcode .chosen-container-single .chosen-single,
.jamago-dashcode .chosen-container-multi .chosen-choices {
    min-height: 44px;
    height: auto;
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: .3rem;
    padding: .3rem .6rem;
    background: var(--jg-surface);
    background-image: none;
    border: 1px solid var(--jg-border);
    border-radius: var(--jg-radius-sm);
    box-shadow: none;
    color: var(--jg-text);
}
.jamago-dashcode .chosen-container-active .chosen-single,
.jamago-dashcode .chosen-container-active .chosen-choices {
    border-color: var(--jg-primary);
    box-shadow: 0 0 0 3px var(--jg-ring);
}
/* Pastillas: el mismo lenguaje que las de select2 y las etiquetas de estado. */
.jamago-dashcode .chosen-container-multi .chosen-choices li.search-choice {
    margin: 0;
    padding: .18rem 1.5rem .18rem .6rem;
    background: var(--jg-primary-soft);
    background-image: none;
    color: var(--jg-primary-strong);
    border: 1px solid rgba(24, 73, 152, .16);
    border-radius: 999px;
    box-shadow: none;
    font-size: .78rem;
    font-weight: 600;
    line-height: 1.5;
}
.jamago-dashcode .chosen-container-multi .chosen-choices li.search-choice .search-choice-close {
    top: 50%;
    right: .45rem;
    transform: translateY(-50%);
    background: none;
    opacity: .6;
}
.jamago-dashcode .chosen-container-multi .chosen-choices li.search-choice .search-choice-close::before {
    content: "×";
    font-size: 1rem;
    line-height: 1;
    color: var(--jg-primary-strong);
}
.jamago-dashcode .chosen-container-multi .chosen-choices li.search-choice .search-choice-close:hover { opacity: 1; }
.jamago-dashcode .chosen-container-multi .chosen-choices li.search-field input[type="text"] {
    height: auto;
    font-size: .875rem;
    color: var(--jg-text);
    font-family: inherit;
}
/* Desplegable: mismo radio, sombra y resaltado que select2. */
.jamago-dashcode .chosen-container .chosen-drop {
    border: 1px solid var(--jg-border);
    border-radius: var(--jg-radius-sm);
    box-shadow: var(--jg-shadow);
    background: var(--jg-surface);
    margin-top: .25rem;
}
.jamago-dashcode .chosen-container .chosen-results li { padding: .5rem .75rem; font-size: .875rem; color: var(--jg-text); }
.jamago-dashcode .chosen-container .chosen-results li.highlighted { background: var(--jg-primary); background-image: none; color: #fff; }
.jamago-dashcode .chosen-container .chosen-results li.result-selected {
    background: var(--jg-primary-soft);
    color: var(--jg-primary-strong);
    font-weight: 600;
}
.jamago-dashcode .chosen-container .chosen-search input[type="text"] {
    border: 1px solid var(--jg-border);
    border-radius: var(--jg-radius-sm);
    padding: .4rem .6rem;
    background-color: var(--jg-surface);
    color: var(--jg-text);
    font-size: .875rem;
}
/* El caret del single: el sprite de fabrica no encaja con el resto. */
.jamago-dashcode .chosen-container-single .chosen-single div b { background: none; position: relative; }
.jamago-dashcode .chosen-container-single .chosen-single div b::after {
    content: "";
    position: absolute;
    top: 50%; right: 4px;
    width: 7px; height: 7px;
    border-right: 1.6px solid var(--jg-text-muted);
    border-bottom: 1.6px solid var(--jg-text-muted);
    transform: translateY(-70%) rotate(45deg);
}
html[data-jamago-theme="dark"] .jamago-dashcode .chosen-container .chosen-results li.result-selected {
    background: rgba(59, 130, 246, .22);
    color: #dbeafe;
}

/* (18) Vistas sin .page-wrapper -------------------------------------------
   Contratos, historias, onboarding y firma SRI cuelgan directo de
   <main class="py-4"><div class="container">, asi que no reciben el
   desplazamiento del menu lateral: el contenido queda 126px por debajo del
   aside y las etiquetas se pierden. Se les da el mismo marco que a
   .page-wrapper. */

.jamago-dashcode main.py-4 > .container,
.jamago-dashcode main.py-4 > .container-fluid {
    max-width: none;
    width: auto;
    margin-right: 0;
    margin-left: var(--jg-sidebar-width);
    padding: calc(var(--jg-header-height) + 26px) 28px 36px;
    transition: margin-left .22s ease, padding .22s ease;
}

[dir="rtl"] .jamago-dashcode main.py-4 > .container,
[dir="rtl"] .jamago-dashcode main.py-4 > .container-fluid {
    margin-right: var(--jg-sidebar-width);
    margin-left: 0;
}

body.jamago-dashcode.mini-sidebar main.py-4 > .container,
body.jamago-dashcode.mini-sidebar main.py-4 > .container-fluid {
    margin-left: var(--jg-sidebar-mini);
}

[dir="rtl"] body.jamago-dashcode.mini-sidebar main.py-4 > .container,
[dir="rtl"] body.jamago-dashcode.mini-sidebar main.py-4 > .container-fluid {
    margin-right: var(--jg-sidebar-mini);
    margin-left: 0;
}

@media (max-width: 767.98px) {
    .jamago-dashcode main.py-4 > .container,
    .jamago-dashcode main.py-4 > .container-fluid,
    body.jamago-dashcode.mini-sidebar main.py-4 > .container,
    body.jamago-dashcode.mini-sidebar main.py-4 > .container-fluid {
        margin-right: 0;
        margin-left: 0;
        padding: calc(var(--jg-header-height) + 18px) 14px 28px;
    }
}

@media print {
    .jamago-dashcode main.py-4 > .container,
    .jamago-dashcode main.py-4 > .container-fluid,
    body.jamago-dashcode.mini-sidebar main.py-4 > .container,
    body.jamago-dashcode.mini-sidebar main.py-4 > .container-fluid {
        margin: 0 !important;
        padding: 0 !important;
    }
}
