:root {
    --primary: #f47c20;
    --primary-dark: #df6810;
    --purple: #4838d1;
    --price-color: #4838d1;
    --button-add: #4838d1;
    --button-add-text: #ffffff;
    --text: #111111;
    --muted: #7d7d7d;
    --line: #ececec;
    --soft: #f6f6f6;
    --white: #ffffff;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
    margin: 0;
    font-family: 'Poppins', sans-serif;
    color: var(--text);
    background: #fff;
}
body.modal-open { overflow: hidden; }
img { max-width: 100%; display: block; }
a { color: inherit; text-decoration: none; }
button, input, select, textarea { font-family: inherit; }

.container {
    width: min(1320px, calc(100% - 40px));
    margin: 0 auto;
}

.site-header {
    background: #fff;
    border-top: 3px solid var(--purple);
    border-bottom: 1px solid #efefef;
    position: sticky;
    top: 0;
    z-index: 30;
}
.top-header {
    display: grid;
    grid-template-columns: 260px minmax(240px, 1fr) 260px;
    align-items: center;
    gap: 22px;
    min-height: 96px;
}
.brand-area {
    display: flex;
    align-items: center;
    min-height: 56px;
}
.brand-logo-img { max-height: 56px; width: auto; }
.brand-logo-text { font-size: 28px; font-weight: 800; letter-spacing: -0.6px; }
.brand-logo-text span { color: var(--primary); }

.header-search { position: relative; }
.header-search input {
    width: 100%;
    height: 58px;
    border: none;
    background: var(--soft);
    border-radius: 32px;
    padding: 0 62px 0 22px;
    font-size: 16px;
    outline: none;
}
.header-search button {
    position: absolute;
    right: 18px;
    top: 50%;
    transform: translateY(-50%);
    width: 28px;
    height: 28px;
    border: none;
    background: transparent;
    cursor: pointer;
}
.header-search svg, .bag-icon svg, .cart-icon svg, .phone-chip svg { width: 100%; height: 100%; }

.header-actions {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    gap: 14px;
}
.header-cart-btn {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    background: #fff7ef;
    border: 1px solid #f3d3ba;
    padding: 12px 16px;
    border-radius: 18px;
    font-weight: 700;
}
.cart-icon { width: 22px; height: 22px; color: var(--primary); }
.cart-count {
    min-width: 26px;
    height: 26px;
    border-radius: 50%;
    background: var(--purple);
    color: #fff;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 13px;
}
.page-title-inline {
    text-align: center;
    font-size: 20px;
    font-weight: 800;
}
.phone-chip {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    background: linear-gradient(135deg, #fff6ee 0%, #fff 100%);
    border: 1px solid #f4d7c0;
    padding: 12px 16px;
    border-radius: 18px;
}
.phone-chip-icon { width: 20px; height: 20px; color: var(--primary); flex: 0 0 20px; }
.phone-chip small { display: block; color: #666; font-size: 12px; line-height: 1.1; }
.phone-chip strong { display: block; color: var(--primary); font-size: 16px; line-height: 1.1; }

.utility-bar {
    display: flex;
    align-items: center;
    gap: 14px;
    min-height: 52px;
    padding: 0 0 10px;
    flex-wrap: wrap;
}
.utility-link, .last-order-chip {
    background: #f8f8f8;
    border: 1px solid var(--line);
    border-radius: 999px;
    padding: 8px 14px;
    font-size: 14px;
}
.last-order-chip strong { color: var(--primary); }

.main-content, .cart-page, .simple-page { padding: 28px 0 60px; }
.content-grid {
    display: grid;
    grid-template-columns: 310px 1fr;
    gap: 30px;
}
.filter-block {
    border-top: 1px solid var(--line);
    padding-top: 28px;
    margin-top: 28px;
}
.filter-block h3 { margin: 0 0 20px; font-size: 20px; font-weight: 800; }
.range-wrap { position: relative; height: 32px; margin: 26px 0 18px; }
.range-track {
    position: absolute;
    left: 0; right: 0; top: 14px;
    height: 3px; background: linear-gradient(90deg, var(--primary) 0%, var(--primary) 100%);
    border-radius: 10px;
}
.range-wrap input[type="range"] {
    position: absolute; left: 0; top: 7px; width: 100%;
    pointer-events: none; appearance: none; background: transparent;
}
.range-wrap input[type="range"]::-webkit-slider-thumb {
    appearance: none; pointer-events: auto;
    width: 16px; height: 16px; border-radius: 50%;
    background: #fff; border: 2px solid var(--primary); cursor: pointer;
}
.price-row {
    display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap;
}
.price-text { color: #666; font-size: 16px; }
.btn-filter, .btn-primary-inline, .btn-primary-full, .btn-secondary, .btn-light-full, .small-link-btn {
    border: none; cursor: pointer; text-decoration: none; display: inline-flex; align-items: center; justify-content: center;
}
.btn-filter {
    background: var(--purple); color: #fff; border-radius: 24px; padding: 12px 18px; gap: 8px; font-weight: 700; font-size: 15px;
}
.btn-filter span {
    width: 22px; height: 22px; border-radius: 50%; background: #fff; color: var(--purple); display: inline-flex; align-items: center; justify-content: center;
}
.btn-primary-inline, .btn-primary-full, .btn-secondary {
    background: var(--purple); color: #fff; border-radius: 14px; padding: 13px 18px; font-weight: 700; font-size: 15px;
}
.btn-primary-full { width: 100%; min-height: 54px; }
.small-link-btn { padding: 10px 16px; }
.btn-light-full {
    background: #f7f7f7; color: #222; border: 1px solid #e6e6e6; width: 100%; margin-top: 12px; border-radius: 14px; min-height: 52px; font-weight: 700;
}

.category-header { display: flex; align-items: center; justify-content: space-between; }
.mobile-block-toggle {
    display: none; width: 34px; height: 34px; border: 1px solid var(--line); background: #fff; border-radius: 10px;
}
.category-block ul { list-style: none; padding: 0; margin: 0; }
.category-block li a {
    display: flex; align-items: center; justify-content: space-between; gap: 12px;
    padding: 10px 0; color: #555; border-bottom: 1px solid #f4f4f4;
}
.category-block li a.active { color: var(--primary); font-weight: 700; }

.products-toolbar {
    display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-bottom: 22px; flex-wrap: wrap;
}
.order-form select, .checkout-form select, .estado-form select {
    min-height: 46px; padding: 0 14px; border: 1px solid var(--line); border-radius: 12px; background: #fff;
}
.results-text { color: #666; }

.product-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 26px;
}
.product-card { border-radius: 20px; background: #fff; }
.product-image-wrap {
    position: relative;
    border: 1px dashed #efd2c1;
    min-height: 220px;
    border-radius: 18px;
    display: flex; align-items: center; justify-content: center;
    padding: 18px;
}
.product-image { max-height: 180px; width: auto; object-fit: contain; }
.add-cart-btn {
    position: absolute;
    left: 12px; right: 12px; bottom: 12px;
    background: var(--button-add); color: var(--button-add-text);
    border: none; border-radius: 999px; min-height: 44px; cursor: pointer;
    display: inline-flex; align-items: center; justify-content: center; gap: 10px;
    font-weight: 700;
}
.add-cart-btn.icon-only { left: auto; width: 44px; height: 44px; right: 12px; bottom: 12px; border-radius: 50%; }
.add-cart-btn .bag-icon { width: 20px; height: 20px; display: inline-flex; align-items: center; justify-content: center; }
.product-info { padding-top: 14px; }
.product-price { color: var(--price-color); font-size: 22px; font-weight: 800; margin-bottom: 10px; }
.product-title { font-size: 17px; margin: 0 0 8px; font-weight: 800; line-height: 1.25; }
.product-code, .product-line { color: #777; font-size: 14px; margin-bottom: 5px; }

.pager {
    display: flex; gap: 10px; align-items: center; flex-wrap: wrap; margin-top: 28px;
}
.pager a {
    padding: 10px 14px; border: 1px solid var(--line); border-radius: 12px; background: #fff;
}
.pager a.active {
    background: var(--purple); color: #fff; border-color: var(--purple);
}

.empty-state, .simple-card {
    background: #fffaf5; border: 1px solid #f0d4bf; border-radius: 22px; padding: 28px;
}
.empty-state h3, .simple-card h2 { margin-top: 0; }
.empty-actions { display: flex; gap: 12px; flex-wrap: wrap; }

.cart-layout {
    display: grid; grid-template-columns: 1.1fr 380px; gap: 28px;
}
.cart-list-modern { display: flex; flex-direction: column; gap: 18px; }
.cart-item-modern {
    border: 1px solid var(--line); border-radius: 26px; padding: 18px; background: #fff;
}
.cart-item-top, .cart-item-bottom {
    display: flex; align-items: center; justify-content: space-between; gap: 16px;
}
.cart-item-bottom { border-top: 1px solid #f2f2f2; margin-top: 16px; padding-top: 16px; }
.cart-product-modern { display: flex; align-items: center; gap: 16px; min-width: 0; }
.cart-product-modern img {
    width: 88px; height: 88px; object-fit: contain; border: 1px solid var(--line); border-radius: 18px; background: #fff;
}
.cart-product-title { font-size: 18px; display: block; margin-bottom: 6px; }
.cart-code { color: #777; font-size: 14px; }
.remove-icon-btn {
    width: 44px; height: 44px; border-radius: 50%; border: 1px solid #f0c8c8; color: #d25454;
    display: inline-flex; align-items: center; justify-content: center; font-size: 22px;
}
.cart-price-label { color: #666; text-transform: uppercase; font-size: 13px; font-weight: 700; }
.cart-price-value, .cart-subtotal-value { font-size: 20px; font-weight: 800; }
.qty-stepper { display: inline-flex; align-items: center; gap: 10px; }
.qty-step-btn {
    width: 44px; height: 44px; border-radius: 14px; background: var(--purple); color: #fff;
    display: inline-flex; align-items: center; justify-content: center; font-size: 28px;
}
.qty-step-link { text-decoration: none; }
.qty-step-value {
    min-width: 44px; text-align: center; font-size: 24px; font-weight: 700;
}

.cart-summary { border: 1px solid var(--line); border-radius: 26px; padding: 24px; background: #fff; height: fit-content; }
.summary-row {
    display: flex; align-items: center; justify-content: space-between; padding: 12px 0; border-bottom: 1px solid #f2f2f2;
}
.summary-row.total strong { color: var(--primary); font-size: 22px; }
.checkout-form label {
    display: block; font-weight: 700; margin: 14px 0 8px;
}
.checkout-form input, .checkout-form textarea, .consulta-form input, .admin-form input, .admin-form select {
    width: 100%; min-height: 54px; border: 1px solid var(--line); border-radius: 14px; padding: 12px 14px; font-size: 16px;
}
.checkout-form textarea { min-height: 90px; resize: vertical; }
.field-hidden { display: none !important; }

.toast {
    position: fixed; right: 18px; bottom: 18px; background: #111; color: #fff; padding: 14px 18px;
    border-radius: 14px; opacity: 0; visibility: hidden; transform: translateY(10px); transition: .2s ease; z-index: 60;
}
.toast.show { opacity: 1; visibility: visible; transform: translateY(0); }

.product-modal {
    position: fixed; inset: 0; background: rgba(0,0,0,.45); display: none; align-items: center; justify-content: center; z-index: 80;
}
.product-modal.show { display: flex; }
.product-modal-dialog {
    width: min(980px, calc(100% - 24px));
    background: #fff; border-radius: 28px; padding: 26px; position: relative; box-shadow: 0 25px 80px rgba(0,0,0,.18);
}
.product-modal-close {
    position: absolute; right: 18px; top: 18px; width: 44px; height: 44px; border: none; border-radius: 50%;
    background: #f5f5f5; font-size: 36px; line-height: 1; cursor: pointer;
}
.product-modal-overlay { position: absolute; inset: 0; }
.product-modal-body { position: relative; z-index: 2; display: grid; grid-template-columns: 1fr 1fr; gap: 28px; }
.product-modal-media {
    min-height: 320px; border: 1px solid var(--line); border-radius: 22px; display: flex; align-items: center; justify-content: center; padding: 24px;
}
.product-modal-media img { max-height: 260px; width: auto; object-fit: contain; }
.product-modal-price { color: var(--price-color); font-size: 28px; font-weight: 800; margin-bottom: 10px; }
.product-modal-content h3 { font-size: 28px; margin: 0 0 10px; line-height: 1.1; }
.product-modal-meta { color: #666; margin-bottom: 10px; }
.product-modal-text { color: #666; margin: 18px 0; }
.modal-qty-block {
    border: 1px solid var(--line); border-radius: 18px; padding: 16px; display: flex; align-items: center; justify-content: space-between; gap: 16px;
}
.modal-qty-block span { font-size: 18px; font-weight: 700; }
.modal-qty-control { display: flex; align-items: center; gap: 10px; }
.modal-qty-btn {
    width: 44px; height: 44px; border-radius: 14px; border: none; background: var(--purple); color: #fff; font-size: 28px; cursor: pointer;
}
#modalQtyInput {
    width: 80px; height: 44px; border: 1px solid var(--line); border-radius: 12px; text-align: center; font-size: 18px; font-weight: 700;
}
.modal-actions { display: flex; gap: 14px; margin-top: 20px; }
.modal-action-btn { flex: 1 1 0; }

.back-to-top {
    position: fixed; right: 18px; bottom: 18px; width: 46px; height: 46px; border: none; border-radius: 50%;
    background: var(--purple); color: #fff; font-size: 22px; display: none; z-index: 50;
}
.back-to-top.show { display: inline-flex; align-items: center; justify-content: center; }

.form-alert {
    padding: 14px 16px; background: #fff0f0; border: 1px solid #f1caca; color: #9c2e2e; border-radius: 14px; margin-bottom: 16px;
}
.simple-card { background: #fff; border: 1px solid var(--line); }
.simple-page { max-width: 1100px; }
.consulta-form, .admin-form, .estado-form { display: flex; flex-direction: column; gap: 12px; }
.consulta-form { flex-direction: row; align-items: center; margin: 18px 0; }
.consulta-form input { flex: 1 1 auto; }
.pedido-box { margin-top: 18px; border-top: 1px solid var(--line); padding-top: 18px; }
.order-items-box { margin-top: 14px; border-top: 1px dashed var(--line); padding-top: 14px; }
.order-item-row, .admin-order-top, .admin-order-meta {
    display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap;
}
.admin-grid { display: grid; grid-template-columns: 360px 1fr; gap: 24px; }
.admin-orders { display: flex; flex-direction: column; gap: 14px; }
.admin-order-card { border: 1px solid var(--line); border-radius: 18px; padding: 16px; }
.order-total-tag { background: #fff6ee; color: var(--primary); padding: 8px 12px; border-radius: 999px; font-weight: 700; }

@media (max-width: 980px) {
    .top-header { grid-template-columns: 1fr; gap: 14px; padding: 12px 0; }
    .page-title-inline { text-align: left; }
    .header-actions { justify-content: flex-start; }
    .content-grid, .cart-layout, .admin-grid, .product-modal-body { grid-template-columns: 1fr; }
    .product-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 768px) {
    .container { width: min(1320px, calc(100% - 18px)); }
    .site-header { position: static; }
    .mobile-block-toggle { display: inline-flex; align-items: center; justify-content: center; }
    .category-block ul { display: none; }
    .category-block.open ul { display: block; }
    .products-toolbar { align-items: flex-start; }
    .product-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
    .product-image-wrap { min-height: 160px; }
    .product-image { max-height: 110px; }
    .product-title { font-size: 14px; }
    .product-price { font-size: 18px; }
    .add-cart-btn.icon-only { width: 42px; height: 42px; }
    .modal-actions { gap: 10px; }
    .consulta-form { flex-direction: column; }
}
@media (max-width: 520px) {
    .product-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .cart-item-top, .cart-item-bottom { align-items: flex-start; flex-direction: column; }
    .modal-qty-block { flex-direction: column; align-items: stretch; }
    .modal-qty-control { justify-content: space-between; }
    .product-modal-dialog { padding: 16px; border-radius: 22px; }
}


.admin-order-actions{
    display:flex;
    gap:10px;
    flex-wrap:wrap;
    align-items:center;
}

.print-sheet{
    background:#fff;
    border:1px solid var(--line);
    border-radius:24px;
    padding:28px;
}

.letter-sheet{
    max-width:900px;
    margin:0 auto;
}

.print-header{
    display:flex;
    justify-content:space-between;
    gap:20px;
    align-items:flex-start;
    border-bottom:2px solid var(--line);
    padding-bottom:18px;
    margin-bottom:22px;
}

.print-brand img{
    max-height:56px;
    width:auto;
    margin-bottom:10px;
}

.print-header h1{
    margin:0 0 8px;
    font-size:30px;
}

.print-header p{
    margin:0;
    color:#666;
}

.print-order-box{
    min-width:260px;
    background:#faf7f4;
    border:1px solid var(--line);
    border-radius:18px;
    padding:16px;
    display:grid;
    gap:10px;
}

.print-grid{
    display:grid;
    grid-template-columns:1fr 320px;
    gap:18px;
    margin-bottom:22px;
}

.print-card{
    border:1px solid var(--line);
    border-radius:18px;
    padding:18px;
    background:#fff;
}

.print-card h3{
    margin-top:0;
    margin-bottom:12px;
    font-size:18px;
}

.print-card p{
    margin:0 0 10px;
    line-height:1.45;
}

.print-table-wrap{
    border:1px solid var(--line);
    border-radius:18px;
    overflow:hidden;
    margin-bottom:28px;
}

.print-table{
    width:100%;
    border-collapse:collapse;
    font-size:14px;
}

.print-table thead th{
    background:#faf7f4;
    text-align:left;
    padding:12px 10px;
    border-bottom:1px solid var(--line);
}

.print-table tbody td,
.print-table tfoot td{
    padding:12px 10px;
    border-bottom:1px solid #f1f1f1;
    vertical-align:top;
}

.print-table tfoot td{
    font-weight:800;
    border-bottom:none;
}

.tfoot-label{
    text-align:right;
}

.print-signatures{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:28px;
    margin-top:38px;
}

.signature-box{
    border-top:1px solid #999;
    min-height:50px;
    display:flex;
    align-items:flex-end;
    justify-content:center;
    padding-top:10px;
    color:#666;
    font-size:14px;
}

@media (max-width: 980px){
    .print-grid{
        grid-template-columns:1fr;
    }
    .print-header{
        flex-direction:column;
    }
    .print-order-box{
        min-width:0;
        width:100%;
    }
}

@page{
    size: Letter;
    margin: 12mm;
}

@media print{
    body{
        background:#fff;
    }
    .no-print,
    .back-to-top,
    .toast{
        display:none !important;
    }
    .container,
    .simple-page{
        width:100%;
        max-width:none;
        margin:0;
        padding:0;
    }
    .print-sheet{
        border:none;
        border-radius:0;
        padding:0;
        box-shadow:none;
    }
    .letter-sheet{
        max-width:none;
        margin:0;
    }
    .print-table-wrap,
    .print-card,
    .print-order-box{
        break-inside:avoid;
        page-break-inside:avoid;
    }
}


.admin-layout{
    display:grid;
    grid-template-columns:280px 1fr;
    gap:24px;
    align-items:start;
}

.admin-sidebar-card{
    background:#fff;
    border:1px solid var(--line);
    border-radius:22px;
    padding:20px;
    position:sticky;
    top:120px;
}

.admin-sidebar-card h3{
    margin-top:0;
    margin-bottom:16px;
}

.admin-state-menu{
    display:flex;
    flex-direction:column;
    gap:10px;
}

.admin-state-menu a{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
    padding:12px 14px;
    border:1px solid var(--line);
    border-radius:14px;
    background:#fff;
    font-weight:600;
}

.admin-state-menu a span{
    min-width:34px;
    height:34px;
    border-radius:999px;
    background:#f6f6f6;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    font-size:13px;
}

.admin-state-menu a.active{
    background:var(--purple);
    color:#fff;
    border-color:var(--purple);
}

.admin-state-menu a.active span{
    background:rgba(255,255,255,.18);
    color:#fff;
}

.admin-heading{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:16px;
    margin-bottom:16px;
    flex-wrap:wrap;
}

.admin-config-dialog{
    width:min(640px, calc(100% - 24px));
}

.admin-config-body{
    display:block;
}

.admin-config-content h2{
    margin-top:0;
    margin-bottom:16px;
}

.ticket-page-body{
    background:#fff;
}

.ticket-sheet{
    width:80mm;
    max-width:100%;
    margin:0 auto;
    background:#fff;
    border:1px solid var(--line);
    border-radius:16px;
    padding:18px 16px;
    font-size:13px;
    line-height:1.35;
}

.ticket-center{
    text-align:center;
}

.ticket-logo img{
    max-width:160px;
    margin:0 auto 8px;
    max-height:54px;
    width:auto;
}

.ticket-sheet h2{
    margin:0 0 4px;
    font-size:18px;
}

.ticket-divider{
    border-top:1px dashed #999;
    margin:12px 0;
}

.ticket-item{
    margin-bottom:10px;
}

.ticket-item-title{
    font-weight:700;
    margin-bottom:4px;
}

.ticket-item-meta{
    display:flex;
    justify-content:space-between;
    gap:10px;
}

.ticket-total{
    display:flex;
    justify-content:space-between;
    gap:10px;
    font-size:16px;
    font-weight:800;
}

.ticket-footer-note{
    margin-top:18px;
    font-size:12px;
    color:#666;
}

@media (max-width: 980px){
    .admin-layout{
        grid-template-columns:1fr;
    }
    .admin-sidebar-card{
        position:static;
    }
}

@page ticket{
    size: 80mm auto;
    margin: 5mm;
}

@media print{
    .ticket-sheet{
        width:72mm;
        border:none;
        border-radius:0;
        padding:0;
        margin:0 auto;
        box-shadow:none;
    }
    body.ticket-page-body{
        background:#fff;
    }
}


.product-modal-overlay{
    position:absolute;
    inset:0;
    z-index:1;
    cursor:pointer;
}

.product-modal-dialog{
    position:relative;
    z-index:2;
}

.product-modal-close{
    z-index:3;
}

.admin-textarea{
    width:100%;
    min-height:140px;
    border:1px solid var(--line);
    border-radius:14px;
    padding:12px 14px;
    font-size:15px;
    resize:vertical;
}

.input-help-text{
    color:#666;
    font-size:13px;
    margin-top:-2px;
    margin-bottom:8px;
}


/* ===== MODAL RESPONSIVE FIX ===== */
.product-modal-dialog {
    width: min(900px, calc(100% - 24px));
    max-height: 92vh;
    overflow: hidden;
    border-radius: 24px;
}

.product-modal-body {
    max-height: calc(92vh - 40px);
    overflow-y: auto;
    padding-right: 6px;
}

/* ocultar icono grande */
#btnAgregarModal svg {
    display: none;
}

@media (max-width: 768px) {
    .product-modal-dialog {
        width: calc(100% - 16px);
        max-height: 90vh;
        border-radius: 18px;
        padding: 14px;
    }

    .product-modal-body {
        display: grid;
        grid-template-columns: 1fr;
        gap: 16px;
        max-height: calc(90vh - 28px);
        overflow-y: auto;
        padding-right: 4px;
    }

    .product-modal-media {
        min-height: 180px;
        padding: 12px;
    }

    .product-modal-media img {
        max-height: 150px;
    }

    .product-modal-content h3 {
        font-size: 22px;
        line-height: 1.15;
    }

    .product-modal-price {
        font-size: 24px;
    }

    .modal-actions {
        position: sticky;
        bottom: 0;
        background: #fff;
        padding-top: 10px;
    }
}


.form-alert-success{
    background:#eefaf3;
    border-color:#bfe5cd;
    color:#1c7a46;
}

.order-edit-form{
    display:flex;
    flex-direction:column;
    gap:22px;
}

.edit-grid-top{
    display:grid;
    grid-template-columns:repeat(3, minmax(0,1fr));
    gap:16px;
}

.field-block{
    display:flex;
    flex-direction:column;
    gap:8px;
}

.field-block label{
    font-weight:700;
}

.field-block input,
.field-block select,
.field-block textarea{
    width:100%;
    min-height:48px;
    border:1px solid var(--line);
    border-radius:14px;
    padding:10px 12px;
    font-size:15px;
}

.field-block textarea{
    min-height:90px;
    resize:vertical;
}

.field-block-full{
    grid-column:1 / -1;
}

.field-block-wide{
    grid-column:span 2;
}

.edit-section-title{
    font-size:20px;
    font-weight:800;
    margin-top:6px;
}

.edit-items-wrap{
    display:flex;
    flex-direction:column;
    gap:14px;
}

.edit-item-card{
    border:1px solid var(--line);
    border-radius:18px;
    padding:16px;
    background:#fff;
}

.edit-item-grid{
    display:grid;
    grid-template-columns:180px 1fr 120px 120px 1fr 180px;
    gap:14px;
    align-items:end;
}

.edit-item-remove-note{
    margin-top:10px;
    color:#777;
    font-size:13px;
}

.edit-actions-bottom{
    display:flex;
    gap:12px;
    flex-wrap:wrap;
}

.add-product-card{
    margin-top:22px;
}

.product-search-form{
    margin-bottom:18px;
}

.admin-product-search-results{
    display:flex;
    flex-direction:column;
    gap:12px;
}

.admin-product-result-card{
    border:1px solid var(--line);
    border-radius:16px;
    padding:14px;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:16px;
    flex-wrap:wrap;
}

.search-result-info{
    display:flex;
    align-items:center;
    gap:14px;
    min-width:0;
}

.search-result-info img{
    width:70px;
    height:70px;
    object-fit:contain;
    border:1px solid var(--line);
    border-radius:14px;
    background:#fff;
}

.search-result-actions{
    display:flex;
    align-items:center;
    gap:10px;
}

.search-result-actions input{
    width:90px;
    min-height:44px;
    border:1px solid var(--line);
    border-radius:12px;
    padding:8px 10px;
}

@media (max-width: 1100px){
    .edit-item-grid{
        grid-template-columns:repeat(2, minmax(0,1fr));
    }
    .field-block-wide{
        grid-column:span 2;
    }
}

@media (max-width: 768px){
    .edit-grid-top,
    .edit-item-grid{
        grid-template-columns:1fr;
    }
    .field-block-wide,
    .field-block-full{
        grid-column:auto;
    }
    .admin-product-result-card{
        flex-direction:column;
        align-items:stretch;
    }
    .search-result-actions{
        width:100%;
        justify-content:space-between;
    }
}


.edit-section-header{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:16px;
    flex-wrap:wrap;
    margin-bottom:8px;
}

.pedido-edit-row{
    border:1px solid var(--line);
    border-radius:18px;
    padding:16px;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:18px;
    flex-wrap:wrap;
    background:#fff;
}

.pedido-edit-info{
    display:flex;
    align-items:center;
    gap:14px;
    min-width:260px;
    flex:1 1 320px;
}

.pedido-edit-info img{
    width:78px;
    height:78px;
    object-fit:contain;
    border:1px solid var(--line);
    border-radius:16px;
    background:#fff;
}

.pedido-edit-controls{
    display:grid;
    grid-template-columns:160px 140px 160px auto;
    gap:12px;
    align-items:end;
    flex:1 1 560px;
}

.remove-item-btn-admin{
    min-height:48px;
    border:none;
    border-radius:14px;
    background:#ffeaea;
    color:#c44444;
    font-weight:700;
    padding:0 18px;
    cursor:pointer;
}

.add-product-dialog{
    width:min(900px, calc(100% - 24px));
}

.modal-product-list{
    display:flex;
    flex-direction:column;
    gap:12px;
    max-height:55vh;
    overflow-y:auto;
    padding-right:4px;
}

.modal-product-row{
    width:100%;
    border:1px solid var(--line);
    border-radius:16px;
    background:#fff;
    padding:14px;
    display:flex;
    align-items:center;
    gap:14px;
    text-align:left;
    cursor:pointer;
}

.modal-product-row img{
    width:72px;
    height:72px;
    object-fit:contain;
    border:1px solid var(--line);
    border-radius:14px;
    background:#fff;
}

.modal-product-meta{
    display:flex;
    flex-direction:column;
    gap:4px;
}

@media (max-width: 1100px){
    .pedido-edit-controls{
        grid-template-columns:repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 768px){
    .pedido-edit-row{
        flex-direction:column;
        align-items:stretch;
    }
    .pedido-edit-info{
        min-width:0;
    }
    .pedido-edit-controls{
        grid-template-columns:1fr;
    }
    .edit-section-header{
        align-items:stretch;
    }
}


.with-admin-pass{
    align-items:flex-end;
}

.admin-pass-block{
    min-width:320px;
    flex:1 1 320px;
}

.modal-product-search-form{
    margin-bottom:14px;
}

.modal-product-search{
    display:flex;
    gap:10px;
    align-items:center;
}

.modal-product-search input{
    flex:1 1 auto;
}

.compact-empty-state{
    padding:18px;
    margin-bottom:12px;
}

@media (max-width: 768px){
    .with-admin-pass{
        align-items:stretch;
    }
    .admin-pass-block{
        min-width:0;
        flex:1 1 100%;
    }
    .modal-product-search{
        flex-direction:column;
        align-items:stretch;
    }
}


/* Modal search fixes */
.modal-product-search-form{
    margin-bottom:14px;
}

.modal-product-search{
    display:flex;
    gap:12px;
    align-items:center;
    width:100%;
}

.modal-product-search input{
    flex:1 1 auto;
    width:100%;
    min-height:50px;
    border:1px solid var(--line);
    border-radius:14px;
    padding:0 16px;
    font-size:16px;
    outline:none;
    background:#fff;
    box-shadow:none;
    appearance:none;
    -webkit-appearance:none;
}

.modal-product-search input:focus{
    border-color:var(--purple);
    box-shadow:0 0 0 4px rgba(72,56,209,.08);
}

.modal-product-search .btn-primary-inline{
    min-height:50px;
    white-space:nowrap;
    flex:0 0 auto;
}

@media (max-width: 768px){
    .modal-product-search{
        flex-direction:column;
        align-items:stretch;
    }

    .modal-product-search .btn-primary-inline{
        width:100%;
    }
}


.db-error-body{
    min-height:100vh;
    margin:0;
    display:flex;
    align-items:center;
    justify-content:center;
    background:linear-gradient(135deg, #f8f4ff 0%, #fff7ef 100%);
    font-family:'Poppins', sans-serif;
}

.db-error-wrap{
    width:min(100%, 980px);
    padding:24px;
}

.db-error-card{
    max-width:560px;
    margin:0 auto;
    background:#fff;
    border:1px solid #ece6ff;
    border-radius:28px;
    padding:34px 28px;
    box-shadow:0 20px 60px rgba(49, 35, 130, 0.10);
    text-align:center;
}

.db-error-icon{
    width:72px;
    height:72px;
    margin:0 auto 18px;
    border-radius:50%;
    background:linear-gradient(135deg, var(--primary), var(--purple));
    color:#fff;
    display:flex;
    align-items:center;
    justify-content:center;
    font-size:34px;
    font-weight:800;
}

.db-error-card h1{
    margin:0 0 12px;
    font-size:32px;
    line-height:1.1;
}

.db-error-card p{
    margin:0 0 10px;
    color:#666;
    font-size:16px;
    line-height:1.5;
}

.db-error-card .btn-primary-inline{
    margin-top:14px;
}


.admin-login-body{
    min-height:100vh;
    margin:0;
    background:linear-gradient(135deg, #f7f2ff 0%, #fff7ef 100%);
    display:flex;
    align-items:center;
    justify-content:center;
}

.admin-login-wrap{
    width:min(100%, 980px);
    padding:24px;
}

.admin-login-card{
    max-width:620px;
    margin:0 auto;
    background:#fff;
    border:1px solid #ece6ff;
    border-radius:30px;
    padding:34px 28px;
    box-shadow:0 22px 60px rgba(49,35,130,.10);
}

.admin-login-logo{
    display:flex;
    justify-content:center;
    margin-bottom:14px;
}

.brand-center{
    justify-content:center;
}

.admin-login-header{
    text-align:center;
    margin-bottom:18px;
}

.admin-login-header h1{
    margin:0 0 8px;
    font-size:36px;
    line-height:1.1;
}

.admin-login-header p{
    margin:0;
    color:#666;
    font-size:15px;
    line-height:1.5;
}

.admin-login-form{
    gap:14px;
}

.admin-login-form input{
    min-height:56px;
    border-radius:16px;
    background:#f4f7ff;
}

.admin-login-actions{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:12px;
    margin-top:10px;
}

.admin-login-actions .btn-primary-inline,
.admin-login-actions .btn-secondary{
    min-height:54px;
    width:100%;
    border-radius:16px;
}

@media (max-width: 640px){
    .admin-login-card{
        padding:24px 18px;
        border-radius:22px;
    }

    .admin-login-header h1{
        font-size:30px;
    }

    .admin-login-actions{
        grid-template-columns:1fr;
    }
}
