@charset "UTF-8";

:root {
    --brand: #ee5a19;
    --brand-dark: #ce4210;
    --brand-soft: #fff0e9;
    --ink: #191a1d;
    --muted: #6e737c;
    --line: #e7e5e2;
    --canvas: #f6f5f2;
    --surface: #ffffff;
    --sidebar: #151619;
    --success: #16805c;
    --warning: #d88a08;
    --danger: #c73c3c;
    --radius: 14px;
    --shadow: 0 10px 32px rgba(31, 25, 20, .07);
    --font: Inter, Aptos, "Segoe UI", system-ui, -apple-system, sans-serif;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; color: var(--ink); font-family: var(--font); -webkit-font-smoothing: antialiased; }
button, input, select, textarea { font: inherit; }
a { color: inherit; text-decoration: none; }
.text-brand { color: var(--brand) !important; }
.bg-brand-soft { background: var(--brand-soft) !important; }
.eyebrow { color: var(--brand); font-size: .69rem; font-weight: 800; letter-spacing: .16em; }
.eyebrow.light { color: #ffb797; }
.btn { border-radius: 9px; font-weight: 700; }
.btn-brand { display: inline-flex; align-items: center; justify-content: center; gap: .75rem; border-color: var(--brand); background: var(--brand); color: #fff; box-shadow: 0 8px 18px rgba(238, 90, 25, .2); }
.btn-brand:hover, .btn-brand:focus { border-color: var(--brand-dark); background: var(--brand-dark); color: #fff; transform: translateY(-1px); }
.btn-outline-brand { border-color: #f3a582; color: var(--brand-dark); background: #fff; }
.btn-outline-brand:hover { border-color: var(--brand); background: var(--brand-soft); color: var(--brand-dark); }
.form-control, .form-select { min-height: 43px; border-color: #dcdad6; border-radius: 9px; font-size: .9rem; }
.form-control:focus, .form-select:focus { border-color: #f49b72; box-shadow: 0 0 0 .2rem rgba(238,90,25,.12); }
.form-label { margin-bottom: .45rem; color: #404248; font-size: .82rem; font-weight: 700; }

/* Login */
.auth-body { min-height: 100vh; background: #fff; }
.auth-shell { display: grid; min-height: 100vh; grid-template-columns: minmax(480px, 1.08fr) minmax(440px, .92fr); }
.auth-story { position: relative; display: flex; min-height: 100vh; padding: 42px 55px 30px; overflow: hidden; flex-direction: column; color: #fff; background: #151619; }
.auth-story::before { position: absolute; inset: 0; opacity: .11; background-image: linear-gradient(rgba(255,255,255,.2) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.2) 1px, transparent 1px); background-size: 48px 48px; content: ""; mask-image: linear-gradient(to bottom right, #000, transparent 72%); }
.auth-story::after { position: absolute; right: -140px; bottom: -210px; width: 610px; height: 610px; border: 1px solid rgba(255,255,255,.11); border-radius: 50%; content: ""; box-shadow: 0 0 0 80px rgba(255,255,255,.025), 0 0 0 160px rgba(255,255,255,.018); }
.auth-glow { position: absolute; border-radius: 50%; filter: blur(10px); pointer-events: none; }
.auth-glow-one { top: 18%; left: 25%; width: 280px; height: 280px; background: rgba(238,90,25,.18); }
.auth-glow-two { right: -80px; bottom: 15%; width: 240px; height: 240px; background: rgba(237,183,68,.08); }
.story-top, .story-copy, .story-footer { position: relative; z-index: 1; }
.story-top { display: flex; align-items: center; justify-content: space-between; }
.story-logo { display: grid; width: 94px; height: 70px; padding: 7px; overflow: hidden; place-items: center; border-radius: 10px; background: #fff; }
.story-logo img { width: 100%; height: 100%; object-fit: contain; }
.story-product { padding: 7px 12px; border: 1px solid rgba(255,255,255,.2); border-radius: 99px; color: #c9c9ca; font-size: .62rem; font-weight: 800; letter-spacing: .18em; }
.story-copy { width: min(660px, 95%); margin: auto 0; }
.story-copy h1 { margin: 22px 0; font-family: Georgia, "Times New Roman", serif; font-size: clamp(2.6rem, 4.5vw, 4.8rem); font-weight: 400; line-height: 1.02; letter-spacing: -.045em; }
.story-copy h1 em { color: var(--brand); font-weight: 400; }
.story-copy > p { max-width: 580px; color: #b9babd; font-size: 1.05rem; line-height: 1.7; }
.story-metrics { display: flex; gap: 1px; width: max-content; margin-top: 42px; overflow: hidden; border: 1px solid rgba(255,255,255,.12); border-radius: 11px; background: rgba(255,255,255,.09); }
.story-metrics div { display: flex; min-width: 135px; padding: 17px 22px; flex-direction: column; background: #191a1d; }
.story-metrics strong { color: #fff; font-size: 1.03rem; }
.story-metrics span { margin-top: 4px; color: #85878b; font-size: .7rem; }
.story-footer { display: flex; padding-top: 18px; align-items: center; justify-content: space-between; border-top: 1px solid rgba(255,255,255,.1); color: #777a7e; font-size: .65rem; letter-spacing: .08em; }
.story-footer span:first-child { font-weight: 900; letter-spacing: .23em; }
.auth-panel { position: relative; display: grid; min-height: 100vh; padding: 50px; place-items: center; background: #fff; }
.auth-card-wrap { width: min(410px, 100%); }
.auth-page-actions { position: absolute; top: 25px; right: 30px; left: 30px; display: flex; align-items: center; justify-content: space-between; }
.auth-page-actions a { color: #656970; font-size: .75rem; font-weight: 750; }
.auth-page-actions a:hover { color: var(--brand); }
.customer-access-link { position: absolute; top: 30px; right: 34px; color: #656970; font-size: .78rem; font-weight: 700; }
.customer-access-link:hover { color: var(--brand); }
.auth-brand-mobile { display: none; }
.auth-heading { margin-bottom: 30px; }
.auth-heading h2 { margin: 8px 0 8px; font-family: Georgia, "Times New Roman", serif; font-size: 2.3rem; letter-spacing: -.035em; }
.auth-heading p { color: var(--muted); font-size: .88rem; }
.input-with-icon { position: relative; }
.domain-email { position: relative; display: flex; align-items: center; }
.domain-email > i { position: absolute; z-index: 2; left: 14px; color: #989a9e; }
.domain-email .form-control { height: 49px; padding-right: 170px; padding-left: 42px; }
.domain-email > span { position: absolute; right: 13px; color: #777a80; font-size: .76rem; font-weight: 700; pointer-events: none; }
.input-with-icon > i { position: absolute; z-index: 2; top: 50%; left: 14px; color: #989a9e; transform: translateY(-50%); }
.input-with-icon .form-control { height: 49px; padding-right: 42px; padding-left: 42px; }
.password-toggle { position: absolute; top: 50%; right: 8px; width: 34px; height: 34px; border: 0; color: #929499; transform: translateY(-50%); background: transparent; }
.link-button { padding: 0; border: 0; color: var(--brand); font-size: .74rem; font-weight: 700; background: transparent; }
.auth-check { display: flex; gap: .55rem; color: #62656b; font-size: .79rem; align-items: center; }
.auth-check .form-check-input { width: 17px; height: 17px; margin: 0; }
.auth-form .btn-lg { min-height: 50px; font-size: .86rem; }
.demo-credentials { display: flex; gap: 12px; margin-top: 22px; padding: 13px 15px; border-radius: 9px; color: #62656a; background: #f6f5f2; font-size: .71rem; line-height: 1.5; }
.demo-credentials i { color: var(--success); font-size: 1.05rem; }
.demo-credentials span { display: flex; flex-direction: column; }
.demo-credentials strong { color: #33353a; }
.auth-legal { margin-top: 28px; color: #a2a2a4; font-size: .65rem; text-align: center; }

/* Application shell */
.app-body { min-height: 100vh; overflow-x: hidden; background: var(--canvas); }
.app-layout { display: flex; min-height: 100vh; }
.sidebar { position: fixed; z-index: 1040; top: 0; bottom: 0; left: 0; display: flex; width: 244px; padding: 0 14px 16px; overflow-y: auto; flex-direction: column; color: #d5d5d6; background: var(--sidebar); transition: width .22s ease, transform .22s ease; scrollbar-width: thin; }
.sidebar-brand { display: flex; height: 84px; gap: 11px; padding: 14px 8px; align-items: center; color: #fff; }
.sidebar-brand img { width: 53px; height: 50px; padding: 4px; object-fit: contain; border-radius: 7px; background: #fff; }
.sidebar-brand > span { display: flex; white-space: nowrap; flex-direction: column; }
.sidebar-brand strong { font-size: .9rem; letter-spacing: .18em; }
.sidebar-brand small { margin-top: 3px; color: var(--brand); font-size: .51rem; font-weight: 800; letter-spacing: .16em; }
.sidebar-nav { display: flex; flex: 1; flex-direction: column; }
.nav-section { margin: 20px 12px 8px; color: #66686c; font-size: .55rem; font-weight: 800; letter-spacing: .15em; white-space: nowrap; }
.sidebar-nav a { position: relative; display: flex; min-height: 42px; gap: 12px; margin: 2px 0; padding: 0 12px; align-items: center; border-radius: 8px; color: #989b9f; font-size: .8rem; font-weight: 600; white-space: nowrap; transition: .15s; }
.sidebar-nav a i { width: 20px; font-size: 1rem; text-align: center; }
.sidebar-nav a:hover { color: #fff; background: rgba(255,255,255,.05); }
.sidebar-nav a.active { color: #fff; background: rgba(238,90,25,.15); }
.sidebar-nav a.active::before { position: absolute; top: 9px; bottom: 9px; left: -14px; width: 3px; border-radius: 0 4px 4px 0; background: var(--brand); content: ""; }
.sidebar-nav a.active i { color: #ff7b43; }
.sidebar-nav kbd { margin-left: auto; border: 1px solid #434549; color: #74767a; background: transparent; font-size: .55rem; }
.nav-alert { display: inline-grid; min-width: 19px; height: 19px; margin-left: auto; padding: 0 5px; color: #fff; place-items: center; border-radius: 10px; background: var(--brand); font-size: .57rem; font-weight: 800; line-height: 1; }
.nav-alert[data-state="ok"] { background: #288a61; }
.nav-alert[data-state="loading"] { color: #85878b; background: #34363a; }
.sidebar-foot { padding-top: 14px; border-top: 1px solid #2a2b2f; }
.store-status { display: flex; gap: 9px; padding: 5px 10px 14px; align-items: center; }
.store-status > span { width: 7px; height: 7px; border-radius: 50%; background: #42bd83; box-shadow: 0 0 0 4px rgba(66,189,131,.1); }
.store-status div { display: flex; flex-direction: column; }
.store-status strong { color: #b9babc; font-size: .68rem; }
.store-status small { margin-top: 2px; color: #606266; font-size: .56rem; }
.sidebar-collapse { display: grid; width: 38px; height: 38px; margin: 0 auto; padding: 0; border: 0; border-radius: 8px; color: #75777b; place-items: center; background: transparent; font-size: 1rem; }
.sidebar-collapse:hover { color: #fff; background: #202125; }
.workspace { width: calc(100% - 244px); min-height: 100vh; margin-left: 244px; transition: width .22s ease, margin .22s ease; }
.app-body.sidebar-collapsed .sidebar { width: 78px; padding-right: 10px; padding-left: 10px; }
.app-body.sidebar-collapsed .workspace { width: calc(100% - 78px); margin-left: 78px; }
.app-body.sidebar-collapsed .sidebar-brand { padding-right: 2px; padding-left: 2px; justify-content: center; }
.app-body.sidebar-collapsed .sidebar-brand > span,
.app-body.sidebar-collapsed .nav-section,
.app-body.sidebar-collapsed .sidebar-nav a > span:not(.nav-alert),
.app-body.sidebar-collapsed .sidebar-nav kbd,
.app-body.sidebar-collapsed .store-status div { display: none; }
.app-body.sidebar-collapsed .sidebar-nav { padding-top: 10px; }
.app-body.sidebar-collapsed .sidebar-nav a { min-height: 44px; padding: 0; justify-content: center; }
.app-body.sidebar-collapsed .sidebar-nav a i { width: auto; }
.app-body.sidebar-collapsed .sidebar-nav a.active::before { left: -10px; }
.app-body.sidebar-collapsed .nav-alert { position: absolute; top: 3px; right: 2px; min-width: 16px; height: 16px; padding: 0 4px; font-size: .49rem; }
.app-body.sidebar-collapsed .store-status { padding: 6px 0 13px; justify-content: center; }
.topbar { position: sticky; z-index: 1020; top: 0; display: flex; height: 68px; padding: 0 30px; align-items: center; justify-content: space-between; border-bottom: 1px solid var(--line); background: rgba(255,255,255,.94); backdrop-filter: blur(12px); }
.topbar-left, .topbar-actions, .user-menu { display: flex; align-items: center; }
.page-crumb { display: flex; gap: 9px; align-items: center; color: #a1a2a5; font-size: .75rem; }
.page-crumb i { font-size: .55rem; }
.page-crumb strong { color: #34363b; font-weight: 700; }
.topbar-actions { gap: 10px; }
.global-search { position: relative; display: flex; width: 260px; align-items: center; }
.global-search > i { position: absolute; left: 12px; color: #999b9f; font-size: .85rem; }
.global-search input { width: 100%; height: 36px; padding: 0 47px 0 34px; border: 1px solid #e4e2df; border-radius: 8px; outline: none; background: #f8f7f5; font-size: .73rem; }
.global-search input:focus { border-color: #efac8e; background: #fff; }
.global-search kbd { position: absolute; right: 8px; border: 1px solid #dedbd6; color: #a0a1a4; background: #fff; font-size: .52rem; }
.icon-button { display: grid; width: 36px; height: 36px; border: 0; border-radius: 8px; color: #62656a; place-items: center; background: transparent; }
.icon-button:hover { color: #222; background: #f0efec; }
.notification-dot { position: absolute; top: 7px; right: 8px; width: 6px; height: 6px; border: 2px solid #fff; border-radius: 50%; background: var(--brand); }
.topbar .vr { height: 27px; color: #ddd; }
.user-menu { gap: 9px; padding: 3px 2px 3px 4px; border: 0; color: inherit; background: transparent; }
.avatar { display: grid; width: 34px; height: 34px; color: #fff; place-items: center; border-radius: 9px; background: linear-gradient(145deg, #fa7a42, #d9470c); font-size: .78rem; font-weight: 800; }
.user-copy { display: flex; min-width: 105px; text-align: left; flex-direction: column; }
.user-copy strong { font-size: .72rem; }
.user-copy small { color: #8d8f94; font-size: .6rem; }
.user-menu > i { color: #a4a5a8; font-size: .6rem; }
.mobile-menu { display: none; margin-right: 7px; }
.content { min-height: calc(100vh - 68px); padding: 27px 30px 40px; }
.page-loader { display: grid; min-height: 62vh; color: #9a9b9f; place-items: center; align-content: center; gap: 13px; font-size: .8rem; }
.page-loader .spinner-border { width: 1.5rem; height: 1.5rem; border-width: 2px; }
.min-vh-75 { min-height: 75vh; }

/* Shared page components */
.page-head { display: flex; gap: 20px; margin-bottom: 24px; align-items: flex-end; justify-content: space-between; }
.page-head h1 { margin: 4px 0 5px; font-family: Georgia, "Times New Roman", serif; font-size: 1.82rem; letter-spacing: -.025em; }
.page-head p { margin: 0; color: var(--muted); font-size: .79rem; }
.page-actions { display: flex; gap: 8px; }
.page-actions .btn { min-height: 39px; padding: 8px 15px; font-size: .75rem; }
.surface { border: 1px solid var(--line); border-radius: var(--radius); background: var(--surface); box-shadow: 0 3px 15px rgba(30,27,23,.025); }
.surface-head { display: flex; min-height: 62px; padding: 17px 20px; align-items: center; justify-content: space-between; border-bottom: 1px solid #eeece9; }
.surface-head h2 { margin: 0; font-size: .9rem; font-weight: 800; }
.surface-head p { margin: 3px 0 0; color: #909297; font-size: .65rem; }
.surface-body { padding: 20px; }
.metric-grid { display: grid; gap: 15px; margin-bottom: 18px; grid-template-columns: repeat(4, 1fr); }
.metric-card { position: relative; min-height: 132px; padding: 20px; overflow: hidden; }
.metric-top { display: flex; margin-bottom: 15px; align-items: flex-start; justify-content: space-between; }
.metric-icon { display: grid; width: 38px; height: 38px; color: var(--brand); place-items: center; border-radius: 10px; background: var(--brand-soft); }
.metric-icon.green { color: var(--success); background: #e8f6f0; }
.metric-icon.blue { color: #3e6db1; background: #eaf1fb; }
.metric-icon.gold { color: #a97513; background: #fff6dc; }
.metric-change { padding: 3px 7px; border-radius: 99px; color: var(--success); background: #e8f7ef; font-size: .6rem; font-weight: 800; }
.metric-label { display: block; margin-bottom: 4px; color: #85878b; font-size: .67rem; font-weight: 700; text-transform: uppercase; letter-spacing: .05em; }
.metric-value { display: block; font-family: Georgia, serif; font-size: 1.7rem; line-height: 1; letter-spacing: -.02em; }
.metric-context { display: block; margin-top: 7px; color: #a1a2a5; font-size: .61rem; }
.dashboard-grid { display: grid; gap: 17px; grid-template-columns: minmax(0, 1.65fr) minmax(285px, .75fr); }
.chart-wrap { height: 225px; padding: 12px 3px 0; }
.bar-chart { display: flex; height: 100%; gap: clamp(10px, 2.3vw, 32px); padding: 10px 8px 0; align-items: flex-end; justify-content: space-around; border-bottom: 1px solid #e9e7e4; background-image: linear-gradient(to bottom, #eceae7 1px, transparent 1px); background-size: 100% 25%; }
.bar-column { display: flex; width: 100%; height: 100%; max-width: 48px; align-items: center; justify-content: flex-end; flex-direction: column; }
.bar-value { margin-bottom: 5px; color: #6d7075; font-size: .55rem; font-weight: 700; opacity: 0; transition: .15s; }
.bar-column:hover .bar-value { opacity: 1; }
.bar { width: 100%; min-height: 3px; border-radius: 5px 5px 0 0; background: linear-gradient(180deg, #ff8751, var(--brand)); transition: height .5s ease; }
.bar-column:nth-child(-n+4) .bar { background: #e7dfd9; }
.bar-label { position: absolute; margin-top: 19px; color: #929499; font-size: .58rem; }
.table { margin: 0; --bs-table-bg: transparent; }
.table thead th { padding: 11px 16px; border-bottom: 1px solid #eae8e5; color: #8a8c90; background: #faf9f7; font-size: .59rem; font-weight: 800; letter-spacing: .05em; text-transform: uppercase; white-space: nowrap; }
.table tbody td { padding: 12px 16px; border-bottom-color: #efedea; color: #4c4f54; font-size: .72rem; vertical-align: middle; }
.table tbody tr:last-child td { border-bottom: 0; }
.table tbody tr:hover { --bs-table-bg: #fcfbfa; }
.table .primary-cell { color: #27292d; font-weight: 750; }
.table .sub-cell { display: block; margin-top: 2px; color: #989a9e; font-size: .61rem; }
.status-badge { display: inline-flex; gap: 5px; padding: 4px 8px; align-items: center; border-radius: 99px; font-size: .6rem; font-weight: 800; }
.status-badge::before { width: 5px; height: 5px; border-radius: 50%; background: currentColor; content: ""; }
.status-completada, .status-correcto, .status-active { color: #197454; background: #e8f6ef; }
.status-cancelada, .status-agotado, .status-inactive { color: #b83b3b; background: #fcecec; }
.status-bajo, .status-parcialmente_devuelta, .status-pendiente { color: #a86d09; background: #fff4d7; }
.status-devuelta { color: #5d65a8; background: #eeeeff; }
.link-arrow { border: 0; color: var(--brand); background: transparent; font-size: .67rem; font-weight: 800; }
.product-mini-list { padding: 4px 20px 15px; }
.product-mini { display: grid; gap: 10px; padding: 13px 0; align-items: center; border-bottom: 1px solid #efedea; grid-template-columns: 43px 1fr auto; }
.product-mini:last-child { border-bottom: 0; }
.product-mini img { width: 43px; height: 43px; object-fit: cover; border-radius: 8px; background: #f1efec; }
.product-mini strong { display: block; overflow: hidden; font-size: .69rem; text-overflow: ellipsis; white-space: nowrap; }
.product-mini small { color: #96989b; font-size: .59rem; }
.product-mini > span { color: var(--brand); font-size: .7rem; font-weight: 800; }
.insight-strip { display: grid; gap: 14px; margin-top: 17px; grid-template-columns: repeat(3,1fr); }
.insight-card { display: flex; gap: 13px; padding: 15px 18px; align-items: center; }
.insight-card i { display: grid; width: 35px; height: 35px; flex: 0 0 auto; color: var(--brand); place-items: center; border-radius: 50%; background: var(--brand-soft); }
.insight-card strong { display: block; font-size: .72rem; }
.insight-card span { color: #8d8f93; font-size: .62rem; }

/* Product, POS and data views */
.filterbar { display: flex; gap: 10px; margin-bottom: 16px; padding: 12px; align-items: center; }
.filterbar .search-field { position: relative; flex: 1; }
.search-field i { position: absolute; top: 50%; left: 12px; color: #9b9da0; transform: translateY(-50%); }
.search-field input { padding-left: 35px; }
.filterbar .form-select { width: 170px; }
.catalog-grid { display: grid; gap: 15px; grid-template-columns: repeat(3, 1fr); }
.product-card { overflow: hidden; transition: transform .18s, box-shadow .18s; }
.product-card:hover { transform: translateY(-2px); box-shadow: var(--shadow); }
.product-image { position: relative; height: 184px; overflow: hidden; background: #f1eeea; }
.product-image img { width: 100%; height: 100%; object-fit: cover; transition: transform .4s; }
.product-card:hover .product-image img { transform: scale(1.035); }
.product-tag { position: absolute; top: 11px; left: 11px; padding: 4px 8px; border-radius: 99px; color: #fff; background: rgba(21,22,25,.83); backdrop-filter: blur(5px); font-size: .56rem; font-weight: 800; }
.product-card-body { padding: 15px; }
.product-card-title { display: flex; align-items: flex-start; justify-content: space-between; }
.product-card h3 { margin: 0; font-size: .83rem; font-weight: 800; }
.product-card .price { color: var(--brand-dark); font-family: Georgia, serif; font-size: 1rem; font-weight: 700; white-space: nowrap; }
.product-card p { height: 32px; margin: 7px 0 12px; overflow: hidden; color: #898b8f; font-size: .64rem; line-height: 1.5; }
.size-row { display: flex; gap: 5px; align-items: center; }
.size-chip { display: inline-flex; min-width: 28px; height: 25px; padding: 0 6px; align-items: center; justify-content: center; border: 1px solid #e3e0dc; border-radius: 6px; color: #5d6065; background: #faf9f7; font-size: .58rem; font-weight: 700; }
.stock-line { display: flex; margin-top: 12px; padding-top: 11px; align-items: center; justify-content: space-between; border-top: 1px solid #eeece9; color: #85878c; font-size: .61rem; }
.stock-line strong { color: #4f5257; }
.product-inactive { opacity: .72; }
.product-inactive .product-image img { filter: grayscale(.8); }
.product-actions { display: flex; gap: 7px; margin-top: 12px; }
.product-actions .btn { flex: 1; font-size: .62rem; }
.pos-layout { display: grid; min-height: calc(100vh - 145px); gap: 17px; grid-template-columns: minmax(0, 1.55fr) 360px; }
.pos-catalog { min-width: 0; }
.pos-products { display: grid; gap: 12px; grid-template-columns: repeat(3, 1fr); }
.pos-product { position: relative; overflow: hidden; cursor: pointer; }
.pos-product .product-image { height: 135px; }
.pos-product .product-card-body { padding: 11px; }
.pos-product p { height: auto; margin: 4px 0 10px; }
.pos-product:hover { border-color: #efa07c; }
.pos-cart { position: sticky; top: 85px; display: flex; max-height: calc(100vh - 105px); flex-direction: column; }
.cart-head { display: flex; padding: 17px 18px; align-items: center; justify-content: space-between; border-bottom: 1px solid var(--line); }
.cart-head h2 { margin: 0; font-size: .9rem; }
.cart-number { color: #a0a2a6; font-size: .61rem; }
.cart-customer { padding: 12px 15px; border-bottom: 1px solid var(--line); background: #fbfaf8; }
.cart-customer .form-select { min-height: 39px; font-size: .7rem; }
.cart-items { min-height: 160px; padding: 8px 15px; overflow-y: auto; flex: 1; }
.empty-cart { display: grid; height: 190px; color: #9b9da0; place-items: center; text-align: center; align-content: center; }
.empty-cart i { margin-bottom: 8px; color: #d3d0cb; font-size: 2rem; }
.empty-cart strong { color: #777a7e; font-size: .75rem; }
.empty-cart span { margin-top: 5px; font-size: .61rem; }
.cart-item { display: grid; gap: 9px; padding: 12px 0; align-items: center; border-bottom: 1px solid #efedea; grid-template-columns: 1fr auto; }
.cart-item strong { display: block; font-size: .69rem; }
.cart-item small { color: #939599; font-size: .59rem; }
.cart-item-price { color: #303237; font-size: .7rem; font-weight: 800; }
.qty-control { display: inline-flex; gap: 4px; margin-top: 7px; align-items: center; }
.qty-control button { display: grid; width: 23px; height: 23px; padding: 0; border: 1px solid #e0deda; border-radius: 5px; place-items: center; background: #fff; font-size: .7rem; }
.qty-control span { width: 22px; text-align: center; font-size: .68rem; font-weight: 700; }
.cart-remove { margin-left: 6px; border: 0 !important; color: #b8b8ba; background: transparent !important; }
.cart-summary { padding: 14px 18px 18px; border-top: 1px solid var(--line); background: #fbfaf8; }
.summary-row { display: flex; margin-bottom: 8px; align-items: center; justify-content: space-between; color: #77797e; font-size: .67rem; }
.summary-row.total { margin: 13px 0; padding-top: 12px; border-top: 1px dashed #d9d6d2; color: #24262a; font-size: .82rem; font-weight: 800; }
.summary-row.total strong { font-family: Georgia, serif; font-size: 1.32rem; }
.summary-row.redeemed { margin-top: 10px; color: #96600b; }
.summary-row.redeemed i { margin-right: 4px; color: #cf8a12; }
.loyalty-redemption { margin: 12px 0; padding: 12px; border: 1px solid #f0d397; border-radius: 10px; background: #fff9e9; }
.loyalty-redemption-head { display: flex; margin-bottom: 9px; align-items: center; justify-content: space-between; color: #75500e; font-size: .65rem; }
.loyalty-redemption-head span { font-weight: 800; }
.loyalty-redemption-head i { margin-right: 4px; color: #d58b0d; }
.loyalty-redemption-head strong { font-size: .6rem; }
.loyalty-redemption-control { display: grid; gap: 6px; align-items: center; grid-template-columns: minmax(0,1fr) auto auto auto; }
.loyalty-redemption-control .form-control { min-height: 36px; font-size: .72rem; }
.loyalty-redemption-control > span { color: #8d6b2f; font-size: .6rem; font-weight: 800; }
.loyalty-redemption-control button { min-height: 36px; padding: 0 9px; border: 1px solid #e6bc67; border-radius: 7px; color: #8a5906; background: #fff; font-size: .58rem; font-weight: 800; }
.loyalty-redemption-control button:disabled { opacity: .45; }
.loyalty-redemption > small { display: block; margin-top: 7px; color: #9b7c43; font-size: .55rem; line-height: 1.45; }
.loyalty-earned-preview { display: flex; gap: 8px; margin: 10px 0; padding: 10px 11px; align-items: flex-start; border: 1px solid #f0d397; border-radius: 9px; color: #76500f; background: #fff9e9; font-size: .58rem; line-height: 1.45; }
.loyalty-earned-preview i { color: #d58b0d; font-size: .85rem; }
.loyalty-earned-preview.muted { color: var(--muted); border-color: var(--line); background: var(--paper); }
.loyalty-earned-preview.muted i { color: var(--muted); }
.payment-title { margin-top: 11px; color: #6f7175; font-size: .6rem; font-weight: 800; text-transform: uppercase; letter-spacing: .05em; }
.payment-title small { margin-left: 4px; color: #9a9b9e; font-size: .53rem; font-weight: 600; letter-spacing: 0; text-transform: none; }
.cart-payment { display: grid; gap: 7px; margin: 11px 0; grid-template-columns: repeat(3,1fr); }
.payment-option { position: relative; min-width: 0; padding: 8px 4px; border: 1px solid #ddd9d5; border-radius: 7px; color: #797b7f; text-align: center; background: #fff; font-size: .58rem; cursor: pointer; transition: border-color .18s ease, background-color .18s ease, color .18s ease; }
.payment-option i { display: block; margin-bottom: 3px; font-size: .9rem; }
.payment-option.active { border-color: var(--brand); color: var(--brand-dark); background: var(--brand-soft); box-shadow: inset 0 0 0 1px rgba(235,83,20,.08); }
.payment-option.active::after { position: absolute; top: 4px; right: 5px; width: 12px; height: 12px; color: #fff; border-radius: 50%; background: var(--brand); content: "✓"; font-size: .48rem; font-weight: 900; line-height: 12px; }
.payment-split { display: grid; gap: 8px; margin: 10px 0; padding: 11px; border: 1px solid #f1c4b0; border-radius: 9px; background: #fff8f4; grid-template-columns: minmax(0,1fr) minmax(0,1fr); }
.payment-split-head { display: flex; gap: 3px 10px; grid-column: 1/-1; align-items: center; justify-content: space-between; }
.payment-split-head span { color: var(--brand-dark); font-size: .64rem; font-weight: 800; }
.payment-split-head i { margin-right: 4px; }
.payment-split-head small { color: #9a7565; font-size: .52rem; text-align: right; }
.payment-split label { min-width: 0; margin: 0; }
.payment-split label > span, .payment-split-result > span { display: block; margin-bottom: 4px; color: var(--muted); font-size: .56rem; font-weight: 700; }
.payment-split .form-control, .payment-split .input-group-text { min-width: 0; min-height: 35px; font-size: .68rem; }
.payment-split-result { min-width: 0; padding: 7px 9px; border: 1px solid #eadbd4; border-radius: 7px; background: rgba(255,255,255,.8); }
.payment-split-result strong { display: block; overflow: hidden; color: var(--ink); font-size: .78rem; text-overflow: ellipsis; white-space: nowrap; }
.payment-split > button { grid-column: 1/-1; min-height: 32px; border: 1px solid #e5a98d; border-radius: 7px; color: var(--brand-dark); background: #fff; font-size: .57rem; font-weight: 800; }
.payment-detail { margin: 10px 0; padding: 11px; border: 1px solid #e5e1dc; border-radius: 9px; background: #fff; }
.payment-detail .form-label { margin-bottom: 5px; font-size: .65rem; }
.payment-detail .form-control, .payment-detail .input-group-text { min-height: 36px; font-size: .72rem; }
.payment-detail small { display: block; margin-top: 6px; color: var(--muted); font-size: .58rem; }
.cash-change { display: flex; margin-top: 8px; align-items: center; justify-content: space-between; color: var(--muted); font-size: .64rem; }
.cash-change strong { color: var(--success); font-size: .8rem; }
.cash-result { display: grid; gap: 10px; margin: 15px 0 0; padding: 13px; border-radius: 10px; background: #f6f5f2; grid-template-columns: 1fr 1fr; }
.cash-result span { display: block; color: var(--muted); font-size: .62rem; }
.cash-result strong { font-size: 1rem; }
.points-payment-complete { display: flex; gap: 10px; margin: 11px 0; padding: 11px; align-items: center; border: 1px solid #cce8da; border-radius: 9px; color: #236b4c; background: #effaf5; }
.points-payment-complete > i { font-size: 1.15rem; }
.points-payment-complete strong, .points-payment-complete span { display: block; }
.points-payment-complete strong { font-size: .67rem; }
.points-payment-complete span { margin-top: 2px; color: #5d8874; font-size: .57rem; }
.redemption-result { display: flex; margin: 15px 0 9px; padding: 12px; align-items: center; justify-content: space-between; border-radius: 9px; color: #85570b; background: #fff7df; font-size: .67rem; }
.redemption-result strong { font-size: .82rem; }
.payment-result-list { margin: 13px 0 0; padding: 3px 12px; border: 1px solid var(--line); border-radius: 9px; background: #faf9f7; }
.payment-result-list > div { display: flex; padding: 8px 0; align-items: center; justify-content: space-between; color: var(--muted); font-size: .64rem; }
.payment-result-list > div + div { border-top: 1px solid var(--line); }
.payment-result-list strong { color: var(--ink); font-size: .73rem; }
.data-toolbar { display: flex; gap: 8px; padding: 12px 15px; align-items: center; border-bottom: 1px solid var(--line); }
.data-toolbar .search-field { max-width: 330px; flex: 1; }
.data-toolbar .form-control, .data-toolbar .form-select { min-height: 37px; font-size: .7rem; }
.data-toolbar .form-select { width: 155px; }
.stock-kpis { display: grid; gap: 13px; margin-bottom: 16px; grid-template-columns: repeat(4,1fr); }
.stock-kpi { display: flex; gap: 12px; padding: 15px 18px; align-items: center; }
.stock-kpi i { display: grid; width: 38px; height: 38px; place-items: center; border-radius: 9px; color: var(--brand); background: var(--brand-soft); }
.stock-kpi strong { display: block; font-size: 1rem; }
.stock-kpi small { color: #8b8d91; font-size: .61rem; }
.item-photo { width: 38px; height: 38px; object-fit: cover; border-radius: 7px; background: #eee; }
.customer-avatar { display: grid; width: 34px; height: 34px; margin-right: 9px; color: #98502e; place-items: center; border-radius: 50%; background: #ffe7dc; font-size: .67rem; font-weight: 800; }
.loyalty-balance { color: #9b6814; font-weight: 800; }
.tier-badge { display: inline-flex; gap: 4px; padding: 4px 8px; align-items: center; border-radius: 99px; font-size: .58rem; font-weight: 800; }
.tier-icon { color: #9c6e20; background: #fff2d2; }
.tier-orange { color: #ba4a19; background: #ffe9df; }
.tier-black { color: #fff; background: #26272a; }
.action-button { width: 30px; height: 30px; padding: 0; border: 1px solid #e2dfdb; border-radius: 7px; color: #696c70; background: #fff; }
.action-button:hover { border-color: #efaa8b; color: var(--brand); }
.action-button:disabled { opacity: .4; cursor: not-allowed; }
.stock-actions { display: inline-flex; gap: 5px; }
.empty-state { padding: 55px 20px; color: #96989c; text-align: center; }
.empty-state i { display: block; margin-bottom: 10px; color: #d2cfca; font-size: 2.2rem; }
.empty-state strong { display: block; color: #5e6065; font-size: .8rem; }
.empty-state span { font-size: .66rem; }
.report-grid { display: grid; gap: 16px; grid-template-columns: repeat(2,1fr); }
.donut-wrap { display: flex; min-height: 240px; gap: 30px; align-items: center; justify-content: center; }
.donut { position: relative; display: grid; width: 150px; height: 150px; place-items: center; border-radius: 50%; background: conic-gradient(var(--brand) 0 60%, #24262a 60% 85%, #f4bd53 85%); }
.donut::before { position: absolute; width: 92px; height: 92px; border-radius: 50%; background: #fff; content: ""; }
.donut span { z-index: 1; font-family: Georgia,serif; font-size: 1.2rem; }
.legend { display: grid; gap: 11px; }
.legend span { display: flex; gap: 8px; align-items: center; color: #74767b; font-size: .67rem; }
.legend i { width: 8px; height: 8px; border-radius: 50%; background: var(--brand); }
.legend span:nth-child(2) i { background:#24262a; }.legend span:nth-child(3) i{background:#f4bd53;}
.report-period-control { display: flex; min-width: 220px; gap: 9px; padding: 6px 8px 6px 12px; align-items: center; border: 1px solid var(--line); border-radius: 9px; background: var(--surface); }
.report-period-control label { display: flex; gap: 6px; margin: 0; align-items: center; color: var(--muted); font-size: .64rem; font-weight: 800; white-space: nowrap; }
.report-period-control .form-select { min-height: 34px; border: 0; font-size: .68rem; box-shadow: none; }
.report-period-summary { display: flex; margin-bottom: 15px; padding: 11px 15px; align-items: center; justify-content: space-between; border: 1px solid #e8dfd9; border-radius: 10px; color: #775443; background: #fff9f5; }
.report-period-summary span { font-size: .68rem; font-weight: 800; }
.report-period-summary i { margin-right: 6px; color: var(--brand); }
.report-period-summary small { color: #9b8175; font-size: .6rem; }
.report-chart { overflow-x: auto; }
.report-chart .bar-chart { min-width: 520px; }
.bar.negative { background: #be5a4b !important; }
.payment-impact-list { display: grid; padding: 8px 18px 18px; }
.payment-impact-list > div { display: grid; gap: 10px; padding: 12px 0; align-items: center; border-bottom: 1px solid var(--line); grid-template-columns: 34px minmax(0,1fr) auto; }
.payment-impact-list > div:last-child { border-bottom: 0; }
.payment-impact-icon { display: grid; width: 32px; height: 32px; place-items: center; border-radius: 8px; color: var(--brand); background: var(--brand-soft); }
.payment-impact-list strong, .payment-impact-list small { display: block; }
.payment-impact-list strong { font-size: .7rem; }
.payment-impact-list small { margin-top: 2px; color: var(--muted); font-size: .56rem; }
.payment-impact-list b { font-size: .76rem; }
.flow-filter-card { margin-bottom: 15px; padding: 14px; }
.flow-filter { display: grid; gap: 10px; align-items: end; grid-template-columns: minmax(220px,1.6fr) minmax(140px,.65fr) minmax(140px,.65fr) auto; }
.flow-filter label { min-width: 0; margin: 0; }
.flow-filter label > span { display: block; margin-bottom: 5px; color: var(--muted); font-size: .61rem; font-weight: 800; }
.flow-filter .form-control, .flow-filter .form-select, .flow-filter .btn { min-height: 39px; font-size: .68rem; }
.flow-filter-error { grid-column: 1/-1; color: var(--danger); font-size: .65rem; font-weight: 700; }
.product-flow-head { display: grid; gap: 15px; margin-bottom: 15px; padding: 16px 18px; align-items: center; grid-template-columns: 58px minmax(0,1fr) auto; }
.product-flow-head img { width: 58px; height: 58px; object-fit: cover; border-radius: 10px; }
.product-flow-head h2 { margin: 2px 0 3px; font-family: Georgia,serif; font-size: 1.15rem; }
.product-flow-head p { margin: 0; color: var(--muted); font-size: .62rem; }
.product-flow-head > strong { color: var(--brand-dark); font-family: Georgia,serif; font-size: 1.45rem; text-align: right; }
.product-flow-head > strong small { display: block; color: var(--muted); font-family: inherit; font-size: .56rem; font-weight: 500; }
.product-flow-table { min-width: 920px; }
.movement-type { display: inline-flex; padding: 4px 7px; border-radius: 99px; color: #4d5960; background: #eef1f2; font-size: .56rem; font-weight: 800; }
.movement-venta { color: #9c392c; background: #fff0ed; }
.movement-devolucion, .movement-entrada { color: #24704f; background: #eaf8f1; }
.movement-cancelacion { color: #876016; background: #fff6dc; }
.movement-devolucion_sin_stock { color: #7b5b25; background: #fff6dc; }
.history-period-note { display: flex; grid-column: 1/-1; gap: 6px; color: var(--muted); font-size: .58rem; align-items: center; }
.history-period-note i { color: var(--brand); }
.history-kpis { margin-bottom: 15px; }
.history-summary-strip { display: grid; margin-bottom: 15px; padding: 0 16px; grid-template-columns: repeat(5,minmax(0,1fr)); }
.history-summary-strip > div { display: grid; min-width: 0; gap: 2px; padding: 14px 13px; border-right: 1px solid var(--line); grid-template-columns: 24px minmax(0,1fr); }
.history-summary-strip > div:last-child { border-right: 0; }
.history-summary-strip i { color: var(--brand); grid-row: 1/3; align-self: center; font-size: 1rem; }
.history-summary-strip span { overflow: hidden; color: var(--muted); font-size: .55rem; text-overflow: ellipsis; white-space: nowrap; }
.history-summary-strip strong { font-size: .76rem; }
.stock-history-table { min-width: 1080px; }
.arrival-history-table { min-width: 760px; }
.history-day-row > td { vertical-align: middle; }
.history-toggle { display: inline-flex; min-width: 104px; gap: 7px; align-items: center; justify-content: center; white-space: nowrap; }
.history-detail-row > td { padding: 0 !important; background: #faf9f7; }
.history-detail-list { display: grid; padding: 7px 14px 14px 24px; }
.history-detail-item { display: grid; min-width: 830px; gap: 13px; padding: 11px 8px; align-items: center; border-bottom: 1px solid var(--line); grid-template-columns: 66px minmax(175px,1.2fr) minmax(140px,1fr) 76px 120px minmax(120px,.8fr); }
.history-detail-item:last-child { border-bottom: 0; }
.history-detail-item time { color: var(--muted); font-size: .58rem; font-weight: 750; }
.history-detail-product { display: flex; min-width: 0; gap: 9px; align-items: center; }
.history-detail-product img { width: 38px; height: 38px; object-fit: cover; border-radius: 8px; background: #fff; }
.history-detail-product strong,
.history-detail-product small,
.history-detail-reason,
.history-detail-meta strong,
.history-detail-meta small { display: block; }
.history-detail-product strong,
.history-detail-meta strong { overflow: hidden; font-size: .64rem; text-overflow: ellipsis; white-space: nowrap; }
.history-detail-product small,
.history-detail-reason,
.history-detail-meta small { margin-top: 3px; color: var(--muted); font-size: .53rem; }
.history-detail-item > b { font-size: .66rem; white-space: nowrap; }
.history-detail-stock { font-size: .61rem; white-space: nowrap; }
.history-detail-stock i { margin: 0 4px; color: var(--muted); }
.history-no-stock { color: #876016; font-size: .55rem; font-weight: 750; }
.history-detail-empty { display: flex; gap: 7px; padding: 20px; color: var(--muted); font-size: .63rem; align-items: center; justify-content: center; }
.return-preview { overflow: hidden; border: 1px solid var(--line); border-radius: 11px; background: #faf9f7; }
.return-preview-loading, .return-preview-empty { padding: 22px; color: var(--muted); text-align: center; font-size: .68rem; }
.return-preview-totals { display: grid; gap: 1px; padding: 11px; background: #f0ede9; grid-template-columns: repeat(3,1fr); }
.return-preview-totals > div { padding: 8px 10px; border-right: 1px solid #ddd8d2; }
.return-preview-totals > div:last-child { border: 0; }
.return-preview-totals span, .return-preview-totals strong { display: block; }
.return-preview-totals span { color: var(--muted); font-size: .56rem; }
.return-preview-totals strong { margin-top: 3px; font-size: .78rem; }
.return-preview-totals .net strong { color: var(--brand-dark); font-family: Georgia,serif; font-size: 1rem; }
.return-preview-totals.compact { margin: 14px 0; grid-template-columns: 1fr 1fr; border-radius: 9px; }
.return-preview-title { display: flex; gap: 10px; padding: 12px 14px 4px; align-items: center; justify-content: space-between; }
.return-preview-title strong { font-size: .67rem; }
.return-preview-title small { color: var(--muted); font-size: .55rem; text-align: right; }
.return-affected-list { display: grid; padding: 5px 13px 12px; }
.return-affected-list > div { display: grid; gap: 9px; padding: 9px 0; align-items: center; border-bottom: 1px solid var(--line); grid-template-columns: 30px minmax(0,1fr) auto auto; }
.return-affected-list > div:last-child { border-bottom: 0; }
.return-method-icon { display: grid; width: 29px; height: 29px; place-items: center; border-radius: 7px; color: var(--brand); background: var(--brand-soft); }
.return-affected-list strong, .return-affected-list small { display: block; }
.return-affected-list strong { font-size: .66rem; }
.return-affected-list small { margin-top: 2px; color: var(--muted); font-size: .53rem; }
.return-affected-list b { font-size: .72rem; white-space: nowrap; }
.return-status { padding: 3px 6px; border-radius: 99px; color: #286e50; background: #e8f7ef; font-size: .5rem; font-style: normal; font-weight: 800; white-space: nowrap; }
.return-status-pendiente { color: #896113; background: #fff3d2; }
.return-history { margin-top: 14px; }
.return-history-title { display: flex; margin-bottom: 8px; align-items: center; justify-content: space-between; }
.return-history-title strong { font-size: .72rem; }
.return-history-title span { display: grid; width: 23px; height: 23px; place-items: center; border-radius: 50%; color: var(--brand-dark); background: var(--brand-soft); font-size: .58rem; font-weight: 800; }
.return-history article { margin-bottom: 8px; padding: 12px; border: 1px solid var(--line); border-radius: 10px; background: #faf9f7; }
.return-history-head, .return-discount-line { display: flex; gap: 12px; align-items: center; justify-content: space-between; }
.return-history-head strong, .return-history-head small { display: block; }
.return-history-head strong { font-size: .68rem; }
.return-history-head small { margin-top: 2px; color: var(--muted); font-size: .55rem; }
.return-history-head > div:last-child { text-align: right; }
.return-history-head > div:last-child span { font-size: .8rem; font-weight: 800; }
.return-discount-line { margin-top: 8px; padding: 6px 8px; border-radius: 6px; color: var(--muted); background: #f0ede9; font-size: .54rem; }
.return-success { text-align: center; }
.return-success-icon { display: grid; width: 58px; height: 58px; margin: 0 auto 10px; place-items: center; border-radius: 50%; color: #fff; background: var(--success); font-size: 1.45rem; }
.return-success p { margin: 0; color: var(--muted); font-size: .62rem; }
.return-success h3 { margin: 4px 0 0; font-family: Georgia,serif; font-size: 1.8rem; }
.return-success > span:last-child { color: var(--muted); font-size: .6rem; }
.settings-layout { display: grid; gap: 17px; grid-template-columns: 220px 1fr; }
.settings-nav { align-self: start; padding: 8px; }
.settings-nav button { display: flex; width: 100%; gap: 9px; padding: 10px 11px; border: 0; border-radius: 7px; color: #75777c; background: transparent; font-size: .69rem; text-align: left; }
.settings-nav button.active { color: var(--brand-dark); background: var(--brand-soft); font-weight: 800; }
.settings-card { overflow: hidden; }
.settings-logo { width: 58px; height: 45px; object-fit: contain; border-radius: 7px; background: #fff; }
.settings-pane-icon { color: var(--brand); font-size: 1.35rem; }
.settings-note { display: flex; gap: 10px; padding: 14px 16px; align-items: flex-start; border: 1px solid #e8e4df; border-radius: 10px; color: #73767b; background: #faf9f7; font-size: .72rem; line-height: 1.5; }
.settings-note i { color: var(--brand); font-size: 1rem; }
.loyalty-config-block { overflow: hidden; border: 1px solid var(--line); border-radius: 12px; background: var(--surface); }
.loyalty-config-head { display: flex; gap: 16px; padding: 15px 17px; align-items: center; justify-content: space-between; border-bottom: 1px solid var(--line); }
.loyalty-config-head strong { display: block; font-size: .75rem; }
.loyalty-config-head small { display: block; margin-top: 3px; color: var(--muted); font-size: .6rem; }
#loyaltyRulesEditor,
#loyaltyLevelsEditor { display: grid; gap: 10px; padding: 14px; }
.loyalty-rule-row { display: grid; gap: 10px; padding: 12px; align-items: end; border: 1px solid var(--line); border-radius: 10px; grid-template-columns: repeat(3,minmax(0,1fr)) 38px; }
.loyalty-level-row { display: grid; gap: 10px; padding: 12px; border: 1px solid var(--line); border-radius: 10px; }
.loyalty-level-fields { display: grid; gap: 10px; align-items: end; grid-template-columns: minmax(150px,1fr) minmax(130px,.65fr) 80px 38px; }
.loyalty-rule-row label,
.loyalty-level-row label { min-width: 0; }
.loyalty-rule-row label>span,
.loyalty-level-row label>span { display: block; margin-bottom: 5px; color: var(--muted); font-size: .58rem; font-weight: 750; }
.loyalty-level-row textarea { resize: vertical; }
.level-color-field .form-control-color { width: 100%; min-height: 42px; padding: 5px; }
.settings-subhead { display: flex; margin-top: 8px; padding-top: 18px; align-items: center; justify-content: space-between; border-top: 1px solid var(--line); }
.settings-subhead div, .provider-list-head div { display: flex; flex-direction: column; }
.settings-subhead strong, .provider-list-head strong { font-size: .78rem; }
.settings-subhead small, .provider-list-head small { margin-top: 3px; color: var(--muted); font-size: .63rem; }
.provider-list-head { display: flex; margin-top: 8px; align-items: center; justify-content: space-between; }
.provider-list { display: grid; gap: 8px; margin-top: 10px; }
.provider-row { display: grid; gap: 10px; padding: 12px; align-items: center; border: 1px solid var(--line); border-radius: 10px; grid-template-columns: 36px minmax(0,1fr) auto auto; }
.provider-row > div { min-width: 0; }
.provider-row strong { display: block; font-size: .72rem; }
.provider-row small { display: block; margin-top: 3px; overflow: hidden; color: var(--muted); font-size: .58rem; text-overflow: ellipsis; white-space: nowrap; }
.provider-actions { display: flex; gap: 7px; align-items: center; }
.provider-logo { display: grid; width: 34px; height: 34px; place-items: center; border-radius: 8px; color: var(--brand); background: var(--brand-soft); }
.settings-save { display: flex; min-height: 74px; gap: 18px; padding: 14px 20px; align-items: center; justify-content: space-between; border-top: 1px solid var(--line); background: #faf9f7; }
.settings-save span { color: #777a7e; font-size: .69rem; }
.settings-save span i { margin-right: 5px; color: var(--success); }
.audit-event { display: flex; gap: 12px; }
.audit-icon { display: grid; width: 30px; height: 30px; flex: 0 0 auto; color: #65686c; place-items: center; border-radius: 50%; background: #f0efec; }

/* Modals */
.modal-content { overflow: hidden; border: 0; border-radius: 15px; box-shadow: 0 22px 70px rgba(25,20,15,.22); }
.modal-header { padding: 18px 22px; border-bottom-color: #eceae7; }
.modal-title { font-family: Georgia,serif; font-size: 1.25rem; }
.modal-body { padding: 21px 22px; }
.modal-footer { padding: 14px 22px; border-top-color: #eceae7; background: #faf9f7; }
.modal-footer .btn { font-size: .73rem; }
.modal-section-title { margin: 6px 0 13px; color: #777a7e; font-size: .63rem; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.variant-builder { padding: 12px; border: 1px solid #e7e4e0; border-radius: 9px; background: #faf9f7; }
.variant-row { display: grid; gap: 7px; margin-bottom: 7px; grid-template-columns: .55fr 1.05fr 1fr .65fr .65fr .8fr 30px; }
.variant-row .form-control { min-height: 36px; font-size: .68rem; }
.inventory-product-summary, .permission-user-summary { display: flex; gap: 12px; padding: 14px; align-items: center; border: 1px solid var(--line); border-radius: 10px; background: #faf9f7; }
.inventory-product-summary .item-photo { width: 48px; height: 48px; }
.inventory-product-summary strong, .permission-user-summary strong { display: block; font-size: .75rem; }
.inventory-product-summary small, .permission-user-summary small { display: block; margin-top: 4px; color: var(--muted); font-size: .62rem; }
.permission-user-summary { margin-bottom: 15px; }
.permission-groups { display: grid; gap: 12px; grid-template-columns: repeat(2,minmax(0,1fr)); }
.permission-group { min-width: 0; padding: 12px; border: 1px solid var(--line); border-radius: 10px; }
.permission-group legend { width: auto; margin: 0 0 7px; padding: 0 5px; color: var(--brand-dark); font-size: .64rem; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.permission-option { display: flex; gap: 12px; padding: 8px 4px; align-items: center; justify-content: space-between; cursor: pointer; }
.permission-option + .permission-option { border-top: 1px solid var(--line); }
.permission-option strong { display: block; font-size: .68rem; }
.permission-option small { display: block; margin-top: 2px; color: var(--muted); font-size: .55rem; }
.permission-option .form-check-input { flex: 0 0 auto; }
.receipt-head { padding: 20px; color:#fff; background:#1d1e21; }
.receipt-head strong { font-family:Georgia,serif; font-size:1.25rem; }
.receipt-total { font-family:Georgia,serif; font-size:1.6rem; }

/* Customer portal */
.portal-body { min-height: 100vh; background: #f7f5f1; }
.portal-header { display: flex; height: 72px; padding: 0 max(24px, calc((100% - 1120px)/2)); align-items: center; justify-content: space-between; border-bottom: 1px solid #e7e3dc; background: #fff; }
.portal-actions { display: flex; gap: 10px; align-items: center; }
.portal-brand { display: flex; gap: 12px; align-items: center; font-size: .7rem; font-weight: 900; letter-spacing: .16em; }
.portal-brand img { width: 55px; height: 48px; object-fit: contain; }
.portal-staff-link { color: #77797e; font-size: .7rem; font-weight: 700; }
.portal-hero { display: grid; min-height: calc(100vh - 130px); padding: 50px max(24px, calc((100% - 1120px)/2)); align-items: center; grid-template-columns: 1fr 440px; }
.portal-pitch { padding-right: 80px; }
.portal-pitch h1 { max-width: 580px; margin: 15px 0 18px; font-family:Georgia,serif; font-size:clamp(2.6rem,5vw,4.8rem); line-height:1.02; letter-spacing:-.045em; }
.portal-pitch h1 em { color:var(--brand); font-weight:400; }
.portal-pitch p { max-width:530px; color:#707278; line-height:1.7; }
.portal-benefits { display:grid; gap:12px; margin-top:30px; grid-template-columns:repeat(3,1fr); }
.portal-benefits div { padding:15px; border:1px solid #e5e1da; border-radius:10px; background:rgba(255,255,255,.7); }
.portal-benefits i { color:var(--brand); }.portal-benefits strong{display:block;margin:7px 0 3px;font-size:.7rem}.portal-benefits small{color:#949599;font-size:.6rem}
.portal-login-card { padding:32px; border:1px solid #e4e0da; border-radius:18px; background:#fff; box-shadow:var(--shadow); }
.portal-login-card h2 { margin:6px 0 7px; font-family:Georgia,serif; font-size:1.8rem; }
.portal-login-card > p { margin-bottom:24px;color:#85878c;font-size:.72rem; }
.privacy-note { display:flex;gap:9px;margin-top:16px;color:#9a9b9e;font-size:.59rem;line-height:1.5; }
.portal-footer { display:flex;height:58px;padding:0 max(24px, calc((100% - 1120px)/2));align-items:center;justify-content:space-between;color:#9b9c9f;font-size:.6rem; }
.portal-dashboard { max-width:1120px;min-height:calc(100vh - 130px);margin:auto;padding:35px 24px 60px; }
.portal-welcome { display:flex;margin-bottom:25px;align-items:end;justify-content:space-between; }.portal-welcome h1{margin:5px 0;font-family:Georgia,serif;font-size:2rem}.portal-welcome p{margin:0;color:#7e8084;font-size:.75rem}
.loyalty-card { position:relative;overflow:hidden;min-height:220px;padding:28px;color:#fff;background:#1b1c1f; }
.loyalty-card::after{position:absolute;right:-70px;bottom:-120px;width:280px;height:280px;border:40px solid rgba(238,90,25,.35);border-radius:50%;content:""}.loyalty-card>*{position:relative;z-index:1}.loyalty-card .points{display:block;margin-top:32px;font-family:Georgia,serif;font-size:3rem}.loyalty-card small{color:#a8aaad}.loyalty-progress{height:5px;margin:18px 0 8px;overflow:hidden;border-radius:9px;background:#3b3c3f}.loyalty-progress span{display:block;height:100%;background:var(--brand)}
.loyalty-card-title { display:flex;gap:12px;align-items:center;justify-content:space-between; }
.loyalty-tier-badge { display:inline-flex;gap:5px;padding:6px 10px;align-items:center;border:1px solid color-mix(in srgb,var(--level-color) 70%,#fff);border-radius:99px;color:#fff;background:var(--level-color);font-size:.58rem;font-weight:850;letter-spacing:.03em; }
.loyalty-benefits { margin-top:20px;padding-top:16px;border-top:1px solid rgba(255,255,255,.14); }
.loyalty-benefits strong { display:block;margin-bottom:8px;font-size:.63rem;text-transform:uppercase;letter-spacing:.08em; }
.loyalty-benefits ul { display:grid;gap:6px;margin:0;padding:0;list-style:none; }
.loyalty-benefits li { display:flex;gap:7px;align-items:flex-start;color:#d2d3d5;font-size:.62rem;line-height:1.4; }
.loyalty-benefits li i { color:#ff8755; }
.portal-grid{display:grid;gap:17px;grid-template-columns:360px 1fr}.portal-grid .surface{overflow:hidden}.portal-sale{display:flex;padding:16px 20px;align-items:center;justify-content:space-between;border-bottom:1px solid #eeece9}.portal-sale:last-child{border-bottom:0}.portal-sale strong{font-size:.75rem}.portal-sale small{display:block;margin-top:4px;color:#929498;font-size:.61rem}.portal-sale .amount{font-family:Georgia,serif;font-size:1rem;font-weight:700;text-align:right}
.timeline{padding:10px 20px}.timeline-item{position:relative;display:grid;gap:12px;padding:12px 0 12px 23px;grid-template-columns:1fr auto;border-bottom:1px solid #efedea}.timeline-item::before{position:absolute;top:17px;left:2px;width:8px;height:8px;border-radius:50%;background:var(--brand);content:""}.timeline-item strong{font-size:.68rem}.timeline-item small{display:block;color:#999a9d;font-size:.58rem}.timeline-points{font-size:.68rem;font-weight:800}.timeline-points.negative{color:var(--danger)}.timeline-points.positive{color:var(--success)}

.sidebar-backdrop { display: none; }
@media (max-width: 1199px) {
    .metric-grid { grid-template-columns: repeat(2,1fr); }
    .catalog-grid, .pos-products { grid-template-columns: repeat(2,1fr); }
    .insight-strip { grid-template-columns: 1fr; }
    .auth-story { padding: 38px; }
    .story-metrics div { min-width: 115px; padding: 15px; }
}
@media (max-width: 991px) {
    .auth-shell { grid-template-columns: 1fr; }
    .auth-story { display: none; }
    .auth-panel { padding: 70px 24px 35px; }
    .auth-brand-mobile { display: block; margin-bottom: 24px; }
    .auth-brand-mobile img { width: 95px; }
    .sidebar { transform: translateX(-100%); }
    .sidebar.open { transform: translateX(0); }
    .sidebar-collapse { display: none; }
    .sidebar-backdrop.show { position: fixed; z-index: 1035; inset: 0; display: block; background: rgba(10,11,12,.48); }
    .workspace { width: 100%; margin-left: 0; }
    .mobile-menu { display: grid; }
    .dashboard-grid, .portal-grid { grid-template-columns: 1fr; }
    .pos-layout { grid-template-columns: 1fr; }
    .pos-cart { position: relative; top: auto; max-height: none; }
    .portal-hero { grid-template-columns:1fr;gap:35px; }.portal-pitch{padding-right:0}.portal-login-card{max-width:520px;width:100%;}
}
@media (max-width: 767px) {
    .topbar { height: 60px; padding: 0 15px; }
    .content { padding: 20px 15px 30px; }
    .global-search, .topbar .vr, .user-copy, .user-menu > i, .page-crumb span, .page-crumb > i { display: none; }
    .page-head { align-items: flex-start; flex-direction: column; }
    .page-actions { width: 100%; }.page-actions .btn{flex:1}
    .metric-grid, .stock-kpis, .report-grid { grid-template-columns: 1fr 1fr; }
    .metric-card { min-height: 120px; }
    .catalog-grid, .pos-products { grid-template-columns: 1fr 1fr; }
    .filterbar, .data-toolbar { flex-wrap: wrap; }
    .filterbar .form-select, .data-toolbar .form-select { width: calc(50% - 5px); }
    .table-responsive { font-size: .9em; }
    .settings-layout { grid-template-columns:1fr }.settings-nav{display:flex;overflow-x:auto}.settings-nav button{white-space:nowrap}
    .permission-groups { grid-template-columns: 1fr; }
    .provider-row { grid-template-columns: 36px minmax(0,1fr) auto; }
    .provider-row .btn { grid-column: 2 / -1; }
    .provider-row .provider-actions { grid-column: 2 / -1; justify-content: flex-end; }
    .flow-filter { grid-template-columns: 1fr 1fr; }
    .flow-filter label:first-child, .flow-filter .btn { grid-column: 1/-1; }
    .report-period-summary { gap: 6px; align-items: flex-start; flex-direction: column; }
    .portal-hero{padding-top:35px}.portal-pitch h1{font-size:2.7rem}.portal-benefits{grid-template-columns:1fr}.portal-header,.portal-footer{padding-left:18px;padding-right:18px}.portal-staff-link{font-size:0}.portal-staff-link i{font-size:1rem}
}
@media (max-width: 520px) {
    .metric-grid, .stock-kpis, .catalog-grid, .pos-products, .report-grid { grid-template-columns: 1fr; }
    .loyalty-rule-row,
    .loyalty-level-fields { grid-template-columns: 1fr; }
    .loyalty-rule-row .remove-loyalty-rule,
    .loyalty-level-fields .remove-loyalty-level { justify-self: end; }
    .product-image { height: 210px; }
    .auth-heading h2 { font-size: 2rem; }
    .customer-access-link { top: 22px; right: 20px; }
    .story-metrics { width: 100%; }.story-metrics div{min-width:0;flex:1}
    .modal-dialog { margin: 0; min-height:100%; }.modal-content{min-height:100vh;border-radius:0}
    .variant-row{grid-template-columns:1fr 1fr}.variant-row .remove-variant{grid-column:2;justify-self:end}
    .provider-row { grid-template-columns: 34px minmax(0,1fr); }
    .provider-row .status-badge { grid-column: 2; justify-self: start; }
    .provider-row .provider-actions { grid-column: 1 / -1; justify-content: stretch; }
    .provider-row .provider-actions .btn { flex: 1; }
    .flow-filter { grid-template-columns: 1fr; }
    .flow-filter label:first-child, .flow-filter .btn { grid-column: auto; }
    .product-flow-head { grid-template-columns: 48px minmax(0,1fr); }
    .product-flow-head img { width: 48px; height: 48px; }
    .product-flow-head > strong { grid-column: 1/-1; text-align: left; }
    .return-preview-totals { grid-template-columns: 1fr; }
    .return-preview-totals > div { border-right: 0; border-bottom: 1px solid #ddd8d2; }
    .return-affected-list > div { grid-template-columns: 30px minmax(0,1fr) auto; }
    .return-status { grid-column: 2/-1; justify-self: start; }
    .report-period-control { width: 100%; }
    .portal-login-card{padding:24px}.portal-welcome{align-items:flex-start;flex-direction:column;gap:12px}
}

/* Dark themes: public customer portal and private administration */
html[data-theme="dark"] {
    color-scheme: dark;
    --ink: #f3f0eb;
    --muted: #aaa8a4;
    --line: #343538;
    --canvas: #111214;
    --surface: #1b1c1f;
    --brand-soft: #3a2118;
    --shadow: 0 14px 40px rgba(0,0,0,.28);
}
html[data-theme="dark"] body { color: var(--ink); }
html[data-theme="dark"] .app-body,
html[data-theme="dark"] .portal-body { background: var(--canvas); }
html[data-theme="dark"] .surface,
html[data-theme="dark"] .auth-panel,
html[data-theme="dark"] .auth-body,
html[data-theme="dark"] .portal-login-card,
html[data-theme="dark"] .portal-header { color: var(--ink); border-color: var(--line); background: var(--surface); }
html[data-theme="dark"] .topbar { border-color: var(--line); background: rgba(27,28,31,.94); }
html[data-theme="dark"] .page-crumb strong,
html[data-theme="dark"] .surface-head h2,
html[data-theme="dark"] .table .primary-cell,
html[data-theme="dark"] .product-card h3,
html[data-theme="dark"] .stock-line strong,
html[data-theme="dark"] .empty-state strong,
html[data-theme="dark"] .form-label,
html[data-theme="dark"] .demo-credentials strong,
html[data-theme="dark"] .portal-benefits strong { color: #f0ede8; }
html[data-theme="dark"] .surface-head,
html[data-theme="dark"] .table thead th,
html[data-theme="dark"] .table tbody td,
html[data-theme="dark"] .stock-line,
html[data-theme="dark"] .portal-sale,
html[data-theme="dark"] .timeline-item,
html[data-theme="dark"] .cart-head,
html[data-theme="dark"] .cart-customer,
html[data-theme="dark"] .cart-summary,
html[data-theme="dark"] .data-toolbar,
html[data-theme="dark"] .modal-header,
html[data-theme="dark"] .modal-footer { border-color: var(--line); }
html[data-theme="dark"] .table thead th,
html[data-theme="dark"] .table tbody tr:hover,
html[data-theme="dark"] .cart-customer,
html[data-theme="dark"] .cart-summary,
html[data-theme="dark"] .modal-footer,
html[data-theme="dark"] .settings-save,
html[data-theme="dark"] .settings-note,
html[data-theme="dark"] .variant-builder { background: #202125; }
html[data-theme="dark"] .table tbody td { color: #c5c3bf; }
html[data-theme="dark"] .form-control,
html[data-theme="dark"] .form-select,
html[data-theme="dark"] .global-search input,
html[data-theme="dark"] .global-search kbd,
html[data-theme="dark"] .qty-control button,
html[data-theme="dark"] .payment-option,
html[data-theme="dark"] .action-button { color: #e4e1dc; border-color: #44464a; background-color: #242529; }
html[data-theme="dark"] .payment-detail,
html[data-theme="dark"] .payment-split,
html[data-theme="dark"] .payment-result-list,
html[data-theme="dark"] .inventory-product-summary,
html[data-theme="dark"] .permission-user-summary,
html[data-theme="dark"] .permission-group,
html[data-theme="dark"] .provider-row { color: var(--ink); border-color: var(--line); background: #202125; }
html[data-theme="dark"] .cash-result { background: #242529; }
html[data-theme="dark"] .report-period-summary { color: #efc1aa; border-color: #554038; background: #2b221e; }
html[data-theme="dark"] .report-period-summary small { color: #b89a8c; }
html[data-theme="dark"] .return-preview,
html[data-theme="dark"] .return-history article { background: #202125; }
html[data-theme="dark"] .return-preview-totals,
html[data-theme="dark"] .return-discount-line { background: #292a2e; }
html[data-theme="dark"] .return-preview-totals > div { border-color: #3c3d41; }
html[data-theme="dark"] .movement-type { color: #c8c5c0; background: #303135; }
html[data-theme="dark"] .movement-venta { color: #ff9d8f; background: #392622; }
html[data-theme="dark"] .movement-devolucion,
html[data-theme="dark"] .movement-entrada { color: #83d2ad; background: #203128; }
html[data-theme="dark"] .movement-cancelacion { color: #e7c879; background: #342e20; }
html[data-theme="dark"] .movement-devolucion_sin_stock { color: #e7c879; background: #342e20; }
html[data-theme="dark"] .history-detail-row > td { background: #202125; }
html[data-theme="dark"] .history-detail-product img { background: #fff; }
html[data-theme="dark"] .history-no-stock { color: #e7c879; }
html[data-theme="dark"] .payment-option.active { color: #ffb594; border-color: var(--brand); background: #35251f; }
html[data-theme="dark"] .payment-split { border-color: #684535; background: #2d2420; }
html[data-theme="dark"] .payment-split-head span { color: #ffb594; }
html[data-theme="dark"] .payment-split-head small { color: #b89382; }
html[data-theme="dark"] .payment-split-result { border-color: #4d413c; background: #242529; }
html[data-theme="dark"] .payment-split > button { color: #ffb594; border-color: #74503f; background: #242529; }
html[data-theme="dark"] .loyalty-redemption { border-color: #685126; background: #2b271e; }
html[data-theme="dark"] .loyalty-redemption-head { color: #f0c873; }
html[data-theme="dark"] .loyalty-redemption-control button { color: #efc46c; border-color: #70572a; background: #242529; }
html[data-theme="dark"] .loyalty-redemption > small { color: #b79b63; }
html[data-theme="dark"] .loyalty-earned-preview { color: #efc46c; border-color: #685126; background: #2b271e; }
html[data-theme="dark"] .loyalty-earned-preview.muted { color: var(--muted); border-color: var(--line); background: #202125; }
html[data-theme="dark"] .points-payment-complete { color: #7ed3aa; border-color: #315d49; background: #1e2b25; }
html[data-theme="dark"] .points-payment-complete span { color: #8eae9f; }
html[data-theme="dark"] .redemption-result { color: #efc46c; background: #2b271e; }
html[data-theme="dark"] .domain-email > span { color: #aaa8a4; }
html[data-theme="dark"] .form-control::placeholder,
html[data-theme="dark"] .global-search input::placeholder { color: #77797e; }
html[data-theme="dark"] .form-control:focus,
html[data-theme="dark"] .form-select:focus,
html[data-theme="dark"] .global-search input:focus { color: #fff; border-color: var(--brand); background-color: #292a2e; }
html[data-theme="dark"] .icon-button:hover { color: #fff; background: #303135; }
html[data-theme="dark"] .dropdown-menu,
html[data-theme="dark"] .modal-content { color: var(--ink); border-color: var(--line); background: #1b1c1f; }
html[data-theme="dark"] .dropdown-item { color: #d8d5d0; }
html[data-theme="dark"] .dropdown-item:hover { color: #fff; background: #292a2e; }
html[data-theme="dark"] .demo-credentials { color: #aaa8a4; background: #242529; }
html[data-theme="dark"] .btn-light,
html[data-theme="dark"] .btn-outline-secondary { color: #e5e2dd; border-color: #484a4f; background: #25262a; }
html[data-theme="dark"] .btn-outline-brand { background: transparent; }
html[data-theme="dark"] .portal-pitch p,
html[data-theme="dark"] .portal-welcome p,
html[data-theme="dark"] .portal-login-card > p { color: #aaa8a4; }
html[data-theme="dark"] .portal-benefits div { border-color: #38393d; background: rgba(255,255,255,.025); }
html[data-theme="dark"] .portal-footer { color: #77797e; }
html[data-theme="dark"] .donut::before { background: var(--surface); }
html[data-theme="dark"] .bar-chart { border-color: #38393d; background-image: linear-gradient(to bottom, #303135 1px, transparent 1px); }
html[data-theme="dark"] .bar-column:nth-child(-n+4) .bar { background: #494a4e; }

@media (max-width: 600px) {
    .auth-page-actions { top: 18px; right: 18px; left: 18px; }
    .settings-save { align-items: stretch; flex-direction: column; }
    .settings-save .btn { width: 100%; }
    .portal-actions .portal-staff-link { display: none; }
}

@media (max-width: 991px) {
    .history-summary-strip { grid-template-columns: repeat(3,minmax(0,1fr)); }
    .history-summary-strip > div:nth-child(3) { border-right: 0; }
    .history-summary-strip > div:nth-child(n+4) { border-top: 1px solid var(--line); }
}

@media (max-width: 767px) {
    .history-summary-strip { grid-template-columns: repeat(2,minmax(0,1fr)); }
    .history-summary-strip > div:nth-child(3) { border-right: 1px solid var(--line); }
    .history-summary-strip > div:nth-child(even) { border-right: 0; }
    .history-summary-strip > div:nth-child(n+3) { border-top: 1px solid var(--line); }
    .history-summary-strip > div:last-child { grid-column: 1/-1; }
    .history-filter-card { padding: 12px; }
}

.field-error {
    margin-top: 6px;
    color: #bd3e2d;
    font-size: .72rem;
    font-weight: 650;
    line-height: 1.35;
}

html[data-theme="dark"] .field-error {
    color: #ff9b78;
}

.form-control.is-invalid,
.form-select.is-invalid {
    border-color: #bd3e2d;
    background-image: none;
}

.confirm-dialog-copy {
    display: flex;
    gap: 16px;
    align-items: center;
}

.confirm-dialog-copy p {
    margin: 0;
    color: var(--muted);
    font-size: .86rem;
    line-height: 1.6;
}

.confirm-dialog-icon {
    display: grid;
    width: 50px;
    height: 50px;
    border-radius: 50%;
    color: var(--brand);
    place-items: center;
    background: var(--brand-soft);
    flex: 0 0 auto;
}

.confirm-dialog-icon.danger {
    color: #bd3e2d;
    background: rgba(189, 62, 45, .12);
}

.invoice-detail-button {
    display: inline-flex;
    min-height: 30px;
    gap: 6px;
    margin-top: 9px;
    padding: 0 10px;
    align-items: center;
    border: 1px solid var(--line);
    border-radius: 7px;
    color: var(--ink);
    background: var(--surface);
    font-size: .62rem;
    font-weight: 750;
}

.invoice-detail-button:hover {
    border-color: var(--brand);
    color: var(--brand);
}

.portal-invoice-modal .modal-dialog {
    max-width: 940px;
}

.portal-invoice-modal .modal-content {
    overflow: hidden;
    border: 0;
    border-radius: 16px;
    color: var(--ink);
    background: var(--surface);
    box-shadow: 0 24px 75px rgba(20, 18, 16, .24);
}

.invoice-modal-header {
    gap: 18px;
    padding: 20px 28px;
    border-color: var(--line);
}

.invoice-modal-header h2 {
    margin-top: 3px;
    font-family: Georgia, serif;
    font-size: 1.4rem;
}

.invoice-modal-identity {
    display: flex;
    min-width: 0;
    gap: 13px;
    align-items: center;
}

.invoice-modal-identity img {
    width: 54px;
    height: 50px;
    padding: 2px;
    object-fit: contain;
    border: 1px solid var(--line);
    border-radius: 9px;
    background: #fff;
}

.invoice-modal-identity>div {
    min-width: 0;
}

.invoice-modal-identity small {
    display: block;
    max-width: 560px;
    margin-top: 4px;
    overflow: hidden;
    color: var(--muted);
    font-size: .6rem;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.invoice-modal-status {
    margin-left: auto;
}

.invoice-modal-body {
    padding: 0 28px 28px;
    background: var(--surface);
}

.invoice-loading {
    display: flex;
    min-height: 320px;
    gap: 13px;
    align-items: center;
    justify-content: center;
    color: var(--muted);
    flex-direction: column;
    font-size: .78rem;
}

.invoice-contact-strip {
    display: flex;
    gap: 18px;
    padding: 13px 0;
    align-items: center;
    border-bottom: 1px solid var(--line);
    color: var(--muted);
    font-size: .6rem;
}

.invoice-contact-strip span {
    display: inline-flex;
    gap: 6px;
    align-items: center;
}

.invoice-contact-strip i {
    color: var(--brand);
}

.invoice-meta {
    display: grid;
    gap: 35px;
    padding: 24px 0;
    border-bottom: 1px solid var(--line);
    grid-template-columns: 1fr 1fr;
}

.invoice-meta>div {
    display: flex;
    flex-direction: column;
}

.invoice-meta span,
.invoice-payments>span {
    margin-bottom: 5px;
    color: var(--muted);
    font-size: .52rem;
    font-weight: 850;
    letter-spacing: .09em;
    text-transform: uppercase;
}

.invoice-meta strong {
    font-size: .75rem;
}

.invoice-meta small {
    margin-top: 4px;
    color: var(--muted);
    font-size: .6rem;
}

.invoice-table-wrap {
    width: 100%;
    margin-top: 24px;
    overflow-x: auto;
}

.invoice-table {
    width: 100%;
    border-collapse: collapse;
}

.invoice-table th {
    padding: 10px 9px;
    color: var(--muted);
    border-bottom: 1px solid var(--line);
    text-align: right;
    font-size: .53rem;
    letter-spacing: .06em;
    text-transform: uppercase;
}

.invoice-table th:first-child,
.invoice-table td:first-child {
    text-align: left;
}

.invoice-table td {
    padding: 14px 9px;
    border-bottom: 1px solid var(--line);
    text-align: right;
    font-size: .66rem;
}

.invoice-table td strong,
.invoice-table td small,
.invoice-table td em {
    display: block;
}

.invoice-table td small {
    margin-top: 3px;
    color: var(--muted);
    font-size: .53rem;
}

.invoice-table td em {
    width: max-content;
    margin-top: 5px;
    padding: 2px 6px;
    color: #9b5720;
    border-radius: 99px;
    background: rgba(199, 119, 47, .12);
    font-size: .48rem;
    font-style: normal;
}

.invoice-summary {
    display: grid;
    gap: 45px;
    margin-top: 26px;
    align-items: start;
    grid-template-columns: 1fr 280px;
}

.invoice-payments>div,
.invoice-totals>div {
    display: flex;
    padding: 7px 0;
    align-items: center;
    justify-content: space-between;
    color: var(--muted);
    font-size: .62rem;
}

.invoice-payments>div {
    max-width: 260px;
    border-bottom: 1px solid var(--line);
    color: var(--ink);
}

.invoice-payments>div b {
    font-family: Georgia, serif;
}

.invoice-grand-total {
    margin-top: 6px;
    padding-top: 13px !important;
    color: var(--ink) !important;
    border-top: 2px solid var(--ink);
}

.invoice-grand-total strong {
    font-family: Georgia, serif;
    font-size: 1.25rem;
}

.invoice-returns,
.invoice-cancelled {
    margin-top: 25px;
    padding: 14px 16px;
    border: 1px solid #e2b988;
    border-radius: 8px;
    color: #86511b;
    background: #fff8ed;
    font-size: .62rem;
}

.invoice-returns>strong,
.invoice-cancelled>strong {
    display: block;
    margin-bottom: 8px;
}

.invoice-returns>div,
.invoice-returns article>div {
    display: flex;
    padding-top: 7px;
    align-items: center;
    justify-content: space-between;
    border-top: 1px solid rgba(134, 81, 27, .18);
}
.invoice-returns article + article { margin-top: 8px; }
.invoice-returns article > small { display: block; margin: 5px 0; color: inherit; opacity: .78; }
.invoice-returns ul { display: grid; gap: 4px; margin: 6px 0 0; padding: 7px 0 0; border-top: 1px dashed rgba(134,81,27,.22); list-style: none; }
.invoice-returns li { display: flex; align-items: center; justify-content: space-between; }

.invoice-cancelled {
    display: flex;
    border-color: #e5a79e;
    color: #9d3325;
    background: #fff2f0;
    flex-direction: column;
}

.invoice-footer {
    display: flex;
    gap: 7px;
    margin-top: 35px;
    padding-top: 18px;
    align-items: center;
    border-top: 1px solid var(--line);
    color: var(--muted);
    flex-direction: column;
    font-size: .56rem;
}

html[data-theme="dark"] .invoice-returns {
    border-color: #765c3d;
    color: #e8bb80;
    background: #2a241c;
}

html[data-theme="dark"] .invoice-cancelled {
    border-color: #74433c;
    color: #f09a8e;
    background: #2d211f;
}

@media (max-width: 700px) {
    .loyalty-config-head { align-items: stretch; flex-direction: column; }
    .loyalty-config-head .btn { align-self: flex-start; }
    .loyalty-rule-row { grid-template-columns: 1fr 1fr; }
    .loyalty-rule-row .remove-loyalty-rule { align-self: center; }
    .loyalty-level-fields { grid-template-columns: 1fr 1fr; }
    .loyalty-level-fields .remove-loyalty-level { align-self: center; }
    .invoice-modal-header { gap: 10px; padding: 15px 18px; }
    .invoice-modal-header h2 { font-size: 1rem; }
    .invoice-modal-identity { gap: 9px; }
    .invoice-modal-identity img { width: 44px; height: 42px; }
    .invoice-modal-identity small { max-width: 190px; }
    .invoice-modal-status { display: none; }
    .invoice-modal-body { padding: 0 18px 20px; }
    .invoice-contact-strip { gap: 8px; align-items: flex-start; flex-direction: column; }
    .invoice-meta { gap: 18px; grid-template-columns: 1fr; }
    .invoice-summary { gap: 25px; grid-template-columns: 1fr; }
    .invoice-table { min-width: 560px; }
    .portal-sale { gap: 16px; align-items: flex-start; }
}
/* Tiendas CLM shared identity and language control */
.platform-wordmark {
    display: inline-flex;
    align-items: center;
    gap: .55rem;
    color: #173b36;
    white-space: nowrap;
}
.platform-wordmark > i {
    width: 2.35rem;
    height: 2.35rem;
    display: grid;
    place-items: center;
    color: #fff;
    background: #173b36;
    border-radius: .65rem .65rem .85rem .65rem;
    box-shadow: .22rem .22rem 0 #b7d0bd;
}
.platform-wordmark b {
    font-family: Georgia, "Times New Roman", serif;
    font-size: 1.15rem;
    font-weight: 500;
    letter-spacing: -.04em;
}
.platform-wordmark em {
    color: #ed6848;
    font-family: Inter, "Segoe UI", sans-serif;
    font-size: .92em;
    font-style: normal;
    font-weight: 800;
}
.platform-wordmark.compact > i {
    width: 2rem;
    height: 2rem;
    box-shadow: none;
}
.platform-wordmark.compact b {
    display: none;
}
.auth-story .platform-wordmark {
    color: #fff;
}
.auth-story .platform-wordmark > i {
    color: #173b36;
    background: #b7d0bd;
}
.auth-brand-mobile .platform-wordmark {
    justify-content: center;
}
.sidebar-brand > .platform-wordmark {
    flex: 0 0 auto;
}
.portal-brand > .platform-wordmark {
    margin-right: .35rem;
}
.platform-language-wrap {
    min-height: 2.25rem;
    padding: 0 .55rem;
    display: inline-flex;
    align-items: center;
    gap: .35rem;
    color: var(--text-secondary, #60706d);
    border: 1px solid var(--border, #dfe4de);
    background: var(--surface, #fff);
    border-radius: .55rem;
}
.platform-language-wrap select {
    max-width: 3.6rem;
    border: 0;
    color: inherit;
    background: transparent;
    font-size: .68rem;
    font-weight: 800;
    outline: none;
}
[data-theme="dark"] .platform-wordmark,
[data-theme="dark"] .platform-language-wrap {
    color: #f7f2e8;
}
@media (max-width: 620px) {
    .platform-language-wrap > i { display: none; }
    .platform-language-wrap { padding: 0 .3rem; }
    .portal-brand > span:last-child { display: none; }
    .portal-brand .platform-wordmark b { font-size: 1rem; }
}