.app-icon { width:1.25em; height:1.25em; display:inline-block; flex:0 0 auto; vertical-align:-.2em; }

/* SVG fallbacks for the most visible actions. They remain legible even when an icon font is blocked by the browser. */
.ti-user::before,.ti-user-cog::before,.ti-shopping-cart-plus::before,.ti-lock::before,.ti-lock-check::before,.ti-lock-open::before,.ti-file-type-pdf::before,.ti-list-check::before,.ti-receipt::before,.ti-report-analytics::before {
    content:""; display:inline-block; width:1em; height:1em; background-color:currentColor;
    -webkit-mask-image:var(--jar-icon-svg); mask-image:var(--jar-icon-svg);
    -webkit-mask-position:center; mask-position:center; -webkit-mask-size:contain; mask-size:contain; -webkit-mask-repeat:no-repeat; mask-repeat:no-repeat;
}
.ti-user::before,.ti-user-cog::before { --jar-icon-svg:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cg fill='none' stroke='black' stroke-width='2' stroke-linecap='round'%3E%3Ccircle cx='12' cy='7' r='4'/%3E%3Cpath d='M6 21v-2a4 4 0 0 1 4-4h4a4 4 0 0 1 4 4v2'/%3E%3C/g%3E%3C/svg%3E"); }
.ti-shopping-cart-plus::before { --jar-icon-svg:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cg fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 4h2l2 11h8l2-7H7M16 19h6M19 16v6'/%3E%3Ccircle cx='9' cy='19' r='1'/%3E%3C/g%3E%3C/svg%3E"); }
.ti-lock::before,.ti-lock-check::before,.ti-lock-open::before { --jar-icon-svg:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cg fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='5' y='11' width='14' height='10' rx='2'/%3E%3Cpath d='M8 11V7a4 4 0 0 1 8 0v4M9 16l2 2 4-4'/%3E%3C/g%3E%3C/svg%3E"); }
.ti-file-type-pdf::before { --jar-icon-svg:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cg fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 3h8l4 4v5M6 3v9M14 3v4h4M4 15v6M4 15h2a2 2 0 0 1 0 4H4M11 15v6h1a2 2 0 0 0 2-2v-2a2 2 0 0 0-2-2h-1M18 21v-6h3M18 18h2'/%3E%3C/g%3E%3C/svg%3E"); }
.ti-list-check::before,.ti-receipt::before,.ti-report-analytics::before { --jar-icon-svg:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cg fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M9 5h10M9 9h10M9 13h6M5 5v.01M5 9v.01M4 19l2 2 4-4M14 19h6'/%3E%3C/g%3E%3C/svg%3E"); }

html, body {
    font-family: Inter, "Segoe UI", Arial, sans-serif;
    background: #f6f7f9;
    color: #202124;
}

a, .btn-link {
    color: #b65e00;
}

.btn-primary {
    color: #fff;
    font-weight: 700;
}
.touch-target { min-height: 48px; min-width: 48px; padding: .75rem 1.25rem; }
.hero-jarochita { display: grid; grid-template-columns: 1.5fr .7fr; gap: 2rem; align-items: center; min-height: 420px; padding: clamp(2rem, 6vw, 5rem); margin: -1.1rem -1.5rem 2rem; background: linear-gradient(135deg, #fff4e6 0%, #fffaf4 55%, #fbd3a3 100%); border-radius: 0 0 2rem 2rem; }
.hero-jarochita h1 { color: #1f3a5f; font-size: clamp(3rem, 8vw, 6rem); line-height: .95; font-weight: 900; }
.hero-jarochita p { max-width: 620px; font-size: 1.3rem; color: #5b6573; }
.eyebrow { color: #b65e00; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.hero-mark { justify-self: center; display: grid; place-items: center; width: min(28vw, 230px); aspect-ratio: 1; border-radius: 42% 58% 55% 45%; background: #f99823; transform: rotate(-5deg); box-shadow: 0 24px 60px rgba(31,58,95,.18); }
.hero-mark img { width: 88%; height: 88%; object-fit: contain; transform: rotate(5deg); }
.feature-grid, .metric-grid, .product-grid, .order-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(210px, 1fr)); gap: 1rem; }
.feature-grid article, .metric-card, .product-card, .order-card, .panel { background: #fff; border: 1px solid #e4e7ec; border-radius: 1rem; padding: 1.2rem; box-shadow: 0 8px 24px rgba(31,58,95,.06); }
.feature-grid article { display: grid; gap: .35rem; }
.feature-grid strong { color: #1f3a5f; font-size: 1.1rem; }
.feature-grid span { color: #5b6573; }
.page-title { color: #1f3a5f; font-weight: 850; margin-bottom: .25rem; }
.page-subtitle { color: #667085; margin-bottom: 1.5rem; }
.metric-card strong { display: block; font-size: 2rem; color: #1f3a5f; }
.metric-card span { color: #667085; }
.product-card { border: 0; text-align: left; min-height: 130px; transition: transform .15s, box-shadow .15s; }
.product-card:hover { transform: translateY(-2px); box-shadow: 0 12px 28px rgba(31,58,95,.12); }
.product-price { display: block; color: #b65e00; font-weight: 800; margin-top: .5rem; }
.status-pill { display: inline-flex; align-items: center; gap: .4rem; padding: .3rem .65rem; border-radius: 99px; font-size: .82rem; font-weight: 700; }
.status-Pendiente, .status-Amarillo { background: #fff1c2; color: #7a5200; }
.status-Atendida, .status-Normal { background: #dcfce7; color: #166534; }
.status-Cancelada, .status-Rojo { background: #fee2e2; color: #991b1b; }
.table { vertical-align: middle; }
.table thead th { color: #1f3a5f; background: #fff4e6; border-bottom: 2px solid #f99823; }
.empty-state { padding: 3rem; text-align: center; color: #667085; background: #fff; border: 1px dashed #cbd5e1; border-radius: 1rem; }
.home-access-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(320px, 1fr)); gap: 1rem; margin: 1.25rem 0; }
.dashboard-access-card { display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 1rem; padding: 1.25rem; border: 1px solid #f0c38f; border-radius: 1rem; background: linear-gradient(135deg, #fff8ef, #fff 70%); color: inherit; text-decoration: none; box-shadow: 0 10px 28px rgba(31,58,95,.08); transition: transform .15s, box-shadow .15s, border-color .15s; }
.dashboard-access-card:hover { transform: translateY(-2px); border-color: var(--jar-orange); color: inherit; box-shadow: 0 14px 34px rgba(31,58,95,.13); }
.dashboard-access-icon { display: grid; place-items: center; width: 62px; height: 62px; border-radius: .85rem; background: var(--jar-orange); color: #fff; font-size: 1.9rem; }
.dashboard-access-card > span:nth-child(2) { display: grid; }
.dashboard-access-card small { color: var(--jar-orange-dark); font-weight: 800; letter-spacing: .05em; text-transform: uppercase; }
.dashboard-access-card strong { color: var(--jar-navy); font-size: 1.25rem; }
.dashboard-access-card em { color: #687384; font-style: normal; }
.dashboard-access-arrow { color: var(--jar-orange-dark); font-size: 1.5rem; }

@media (max-width: 640px) {
    .hero-jarochita { grid-template-columns: 1fr; min-height: auto; }
    .hero-mark { width: 150px; }
}

.btn:focus, .btn:active:focus, .btn-link.nav-link:focus {
  box-shadow: 0 0 0 0.1rem white, 0 0 0 0.25rem rgba(249, 152, 35, .45);
}

.content {
    padding-top: 1.1rem;
}

h1:focus {
    outline: none;
}

.valid.modified:not([type=checkbox]) {
    outline: 1px solid #26b050;
}

.invalid {
    outline: 1px solid #e50000;
}

.validation-message {
    color: #e50000;
}

.blazor-error-boundary {
    background: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iNTYiIGhlaWdodD0iNDkiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIG92ZXJmbG93PSJoaWRkZW4iPjxkZWZzPjxjbGlwUGF0aCBpZD0iY2xpcDAiPjxyZWN0IHg9IjIzNSIgeT0iNTEiIHdpZHRoPSI1NiIgaGVpZ2h0PSI0OSIvPjwvY2xpcFBhdGg+PC9kZWZzPjxnIGNsaXAtcGF0aD0idXJsKCNjbGlwMCkiIHRyYW5zZm9ybT0idHJhbnNsYXRlKC0yMzUgLTUxKSI+PHBhdGggZD0iTTI2My41MDYgNTFDMjY0LjcxNyA1MSAyNjUuODEzIDUxLjQ4MzcgMjY2LjYwNiA1Mi4yNjU4TDI2Ny4wNTIgNTIuNzk4NyAyNjcuNTM5IDUzLjYyODMgMjkwLjE4NSA5Mi4xODMxIDI5MC41NDUgOTIuNzk1IDI5MC42NTYgOTIuOTk2QzI5MC44NzcgOTMuNTEzIDI5MSA5NC4wODE1IDI5MSA5NC42NzgyIDI5MSA5Ny4wNjUxIDI4OS4wMzggOTkgMjg2LjYxNyA5OUwyNDAuMzgzIDk5QzIzNy45NjMgOTkgMjM2IDk3LjA2NTEgMjM2IDk0LjY3ODIgMjM2IDk0LjM3OTkgMjM2LjAzMSA5NC4wODg2IDIzNi4wODkgOTMuODA3MkwyMzYuMzM4IDkzLjAxNjIgMjM2Ljg1OCA5Mi4xMzE0IDI1OS40NzMgNTMuNjI5NCAyNTkuOTYxIDUyLjc5ODUgMjYwLjQwNyA1Mi4yNjU4QzI2MS4yIDUxLjQ4MzcgMjYyLjI5NiA1MSAyNjMuNTA2IDUxWk0yNjMuNTg2IDY2LjAxODNDMjYwLjczNyA2Ni4wMTgzIDI1OS4zMTMgNjcuMTI0NSAyNTkuMzEzIDY5LjMzNyAyNTkuMzEzIDY5LjYxMDIgMjU5LjMzMiA2OS44NjA4IDI1OS4zNzEgNzAuMDg4N0wyNjEuNzk1IDg0LjAxNjEgMjY1LjM4IDg0LjAxNjEgMjY3LjgyMSA2OS43NDc1QzI2Ny44NiA2OS43MzA5IDI2Ny44NzkgNjkuNTg3NyAyNjcuODc5IDY5LjMxNzkgMjY3Ljg3OSA2Ny4xMTgyIDI2Ni40NDggNjYuMDE4MyAyNjMuNTg2IDY2LjAxODNaTTI2My41NzYgODYuMDU0N0MyNjEuMDQ5IDg2LjA1NDcgMjU5Ljc4NiA4Ny4zMDA1IDI1OS43ODYgODkuNzkyMSAyNTkuNzg2IDkyLjI4MzcgMjYxLjA0OSA5My41Mjk1IDI2My41NzYgOTMuNTI5NSAyNjYuMTE2IDkzLjUyOTUgMjY3LjM4NyA5Mi4yODM3IDI2Ny4zODcgODkuNzkyMSAyNjcuMzg3IDg3LjMwMDUgMjY2LjExNiA4Ni4wNTQ3IDI2My41NzYgODYuMDU0N1oiIGZpbGw9IiNGRkU1MDAiIGZpbGwtcnVsZT0iZXZlbm9kZCIvPjwvZz48L3N2Zz4=) no-repeat 1rem/1.8rem, #b32121;
    padding: 1rem 1rem 1rem 3.7rem;
    color: white;
}

    .blazor-error-boundary::after {
        content: "An error has occurred."
    }

.darker-border-checkbox.form-check-input {
    border-color: #929292;
}

.dxbl-dropdown,
.dxbl-popup-cell,
.dxbl-dropdown-dialog,
.dxbl-dropdown-container,
.dxbl-dropdown-root,
.dxbl-popup,
.dxbl-popup-dialog,
.dxbl-popup-wrapper,
.dxbl-popup-root,
.dxbl-date-edit-drop-down,
.dxbl-calendar,
.dxbs-popup,
.dxbs-popup-wrapper,
.dxbs-dropdown-area,
.dxbs-dropdown-popup,
.dxbs-calendar,
.datepicker.dropdown-menu { z-index:2140 !important; }