:root{--blue:#1187e8;--blue2:#0d78cc;--bg:#eef4f8;--line:#d8e2ea;--text:#263444;--muted:#718096;--green:#39a852;--red:#ef4444;--orange:#f59e0b;--shadow:0 6px 22px rgba(18,58,92,.08)}*{box-sizing:border-box}body{margin:0;font-family:Inter,Arial,sans-serif;color:var(--text);background:var(--bg);font-size:14px}a{text-decoration:none;color:inherit}.topbar{height:56px;background:#147fae;color:#fff;display:flex;align-items:center;padding:0 16px;gap:22px;position:sticky;top:0;z-index:50}.brand{font-weight:800;letter-spacing:1px}.brand span,.login-logo span{background:#ff5b37;color:#fff;padding:3px 6px;border-radius:3px}.desktop-nav{display:flex;height:100%}.desktop-nav a{padding:0 16px;display:flex;align-items:center;font-weight:600}.desktop-nav a.active,.desktop-nav a:hover{background:rgba(0,0,0,.13)}.top-actions{margin-left:auto;display:flex;gap:14px;align-items:center}.page-shell{padding:14px 16px 86px;max-width:1800px;margin:auto}.page-head{display:flex;align-items:center;justify-content:space-between;margin:6px 0 14px}.page-head h1{font-size:22px;margin:0 0 3px}.page-head p{margin:0;color:var(--muted)}.btn{border:1px solid #c9d7e2;background:#fff;color:#35526d;border-radius:6px;padding:10px 14px;cursor:pointer;font-weight:600}.btn.primary{background:var(--blue);border-color:var(--blue);color:#fff}.btn.danger{background:#ef4444;color:#fff;border-color:#ef4444}.btn.wide{width:100%}.panel{background:#fff;border:1px solid var(--line);border-radius:8px;box-shadow:var(--shadow);padding:14px}.filterbar{display:flex;gap:8px;margin-bottom:10px}.filterbar input,.filterbar select,label input,label select,label textarea,.catalog>input{border:1px solid #cbd9e4;border-radius:6px;padding:10px;background:#fff;font:inherit;min-height:40px}.grow{flex:1}.status-tabs{display:flex;gap:2px;margin-bottom:10px;background:#fff;border-radius:7px;overflow:auto;border:1px solid var(--line)}.status-tabs a{padding:11px 18px;min-width:max-content}.status-tabs a.active{background:var(--blue);color:#fff}.table-wrap{overflow:auto}table{width:100%;border-collapse:collapse}th,td{padding:12px 10px;border-bottom:1px solid #e9eef2;text-align:left;white-space:nowrap}th{color:#64748b;font-weight:600;background:#fbfdff}.money{color:#059669;font-weight:700}.debt{color:#ef4444!important}.badge{padding:4px 8px;border-radius:4px;font-size:12px;font-weight:700}.badge.completed{background:#dff6e5;color:#238a3b}.badge.debt{background:#ffe3e3;color:#c53030}.badge.processing{background:#fff2d2;color:#a86900}.badge.cancelled{background:#eceff2;color:#63707d}.empty{text-align:center;color:#94a3b8;padding:40px}.pos-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}.cart-panel label,.modal label,.settings-grid label{display:grid;gap:6px;margin-bottom:10px;color:#617389}.cart-panel select,.settings-grid input,.settings-grid select,.modal input,.modal textarea{width:100%}.cart-row{display:grid;grid-template-columns:1fr 78px 120px 34px;gap:8px;align-items:center;padding:10px 0;border-bottom:1px solid #edf2f5}.cart-row small{display:block;color:#94a3b8}.cart-row input{width:100%;padding:7px}.cart-row button{border:0;background:#fee2e2;color:#b91c1c;border-radius:5px;height:32px}.cart-empty{padding:70px 12px;text-align:center;color:#94a3b8;background:#f5fbfe;border-radius:7px;margin:12px 0}.totals{margin-top:14px;border-top:1px solid var(--line);padding-top:12px}.totals>div{display:flex;justify-content:space-between;margin:8px 0}.totals .grand{font-size:20px}.payment-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin:14px 0}.catalog-tabs{display:flex;gap:4px;margin-bottom:10px;overflow:auto}.catalog-tabs button{border:1px solid var(--line);padding:10px 14px;background:#fff;border-radius:6px;cursor:pointer}.catalog-tabs button.active{background:var(--blue);color:#fff}.catalog>input{width:100%;margin-bottom:10px}.catalog-list{display:grid;grid-template-columns:1fr 1fr;gap:9px;max-height:68vh;overflow:auto}.catalog-item{display:flex;justify-content:space-between;align-items:center;text-align:left;background:#fff;border:1px solid #dbe7ef;border-radius:7px;padding:13px;cursor:pointer}.catalog-item:hover{border-color:var(--blue);background:#f3f9ff}.catalog-item small{display:block;color:#94a3b8;margin-top:5px}.catalog-item strong{color:#008d82}.customer-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1px;background:#e9eef2}.customer-card{background:#fff;padding:14px;display:grid;grid-template-columns:50px 1fr auto;gap:12px;align-items:center}.avatar{width:46px;height:46px;border-radius:50%;display:grid;place-items:center;background:#19a98d;color:#fff;font-weight:800;font-size:18px}.avatar.large{width:90px;height:90px;font-size:30px;margin:auto}.customer-info h3{margin:0 0 5px}.customer-info p,.customer-info small{margin:0;color:#8794a3}.customer-meta{display:flex;flex-direction:column;gap:6px;text-align:right}.stats{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-bottom:12px}.stat{padding:18px;color:#fff;border-radius:8px;box-shadow:var(--shadow)}.stat span{display:block;opacity:.9}.stat strong{font-size:26px;display:block;margin-top:15px}.stat.blue{background:#1e9fe7}.stat.teal{background:#22a89b}.stat.red{background:#ef4b42}.settings-grid{display:grid;grid-template-columns:360px 1fr;gap:12px}.account-card{max-width:460px;text-align:center;margin:auto}.modal{display:none;position:fixed;inset:0;background:rgba(15,23,42,.45);z-index:100;align-items:center;justify-content:center;padding:16px}.modal.show{display:flex}.modal-box{background:#fff;width:min(520px,100%);border-radius:10px;padding:20px;position:relative;box-shadow:0 20px 60px rgba(0,0,0,.22)}.modal-close{position:absolute;right:14px;top:10px;border:0;background:none;font-size:28px;cursor:pointer}.alert{padding:11px 14px;border-radius:7px;margin-bottom:10px}.alert.success{background:#dcfce7;color:#166534}.alert.error{background:#fee2e2;color:#991b1b}.fab{position:fixed;right:22px;bottom:82px;width:58px;height:58px;border-radius:50%;background:var(--blue);color:#fff;display:none;place-items:center;font-size:32px;box-shadow:0 6px 18px rgba(0,0,0,.2)}.mobile-nav{display:none}.login-body{min-height:100vh;display:grid;place-items:center;background:linear-gradient(145deg,#0b8fea,#096fc4)}.login-card{background:#fff;width:min(420px,92vw);padding:34px;border-radius:14px;box-shadow:0 20px 60px rgba(0,0,0,.25)}.login-logo{font-size:24px;font-weight:800;margin-bottom:26px}.login-card h1{margin-bottom:5px}.login-card p{color:var(--muted);margin-top:0}.login-card label{display:grid;gap:6px;margin:14px 0}.login-card input{padding:12px;border:1px solid #cad6df;border-radius:7px}
@media(max-width:767px){body{background:#fff}.topbar{height:64px;justify-content:center;background:#0b87e8}.brand{font-size:18px}.desktop-nav,.top-actions{display:none}.page-shell{padding:12px 12px 88px}.page-head h1{font-size:20px}.page-head p{display:none}.page-head .btn.primary{display:none}.filterbar{flex-wrap:wrap;background:#eef4f8;padding:8px;margin-left:-12px;margin-right:-12px}.filterbar input,.filterbar select{flex:1;min-width:120px}.filterbar .grow{flex-basis:100%}.status-tabs{margin-left:-12px;margin-right:-12px;border-radius:0}.status-tabs a{padding:11px 14px}.panel{border-radius:0;border-left:0;border-right:0;box-shadow:none;padding:8px;margin-left:-12px;margin-right:-12px}.table-wrap table{font-size:13px}.table-wrap th:nth-child(4),.table-wrap td:nth-child(4){display:none}.mobile-nav{position:fixed;display:grid;grid-template-columns:repeat(4,1fr);bottom:0;left:0;right:0;background:#fff;border-top:1px solid #dbe4eb;z-index:80;padding-bottom:env(safe-area-inset-bottom)}.mobile-nav a{height:68px;display:flex;flex-direction:column;align-items:center;justify-content:center;color:#8c959d;font-size:12px;gap:4px}.mobile-nav a span{font-size:22px}.mobile-nav a.active{color:var(--blue);font-weight:700}.fab{display:grid}.pos-grid{grid-template-columns:1fr}.catalog{order:-1}.catalog-list{grid-template-columns:1fr 1fr;max-height:none}.catalog-item{min-height:82px;flex-direction:column;align-items:flex-start;gap:8px}.cart-row{grid-template-columns:1fr 55px 90px 28px}.payment-grid{grid-template-columns:1fr}.customer-grid{grid-template-columns:1fr}.customer-card{grid-template-columns:46px 1fr}.customer-meta{grid-column:2;flex-direction:row;text-align:left}.stats{grid-template-columns:1fr 1fr}.stat:last-child{grid-column:1/-1}.settings-grid{grid-template-columns:1fr}.modal{align-items:flex-end;padding:0}.modal-box{border-radius:16px 16px 0 0;max-height:88vh;overflow:auto}.login-card{box-shadow:none}.page-head{position:relative}.catalog-tabs{position:sticky;top:64px;background:#fff;z-index:4;padding-top:4px}}

/* v0.3 POS */
.mini-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin:0 0 12px}.mini-stats>div{background:#fff;border:1px solid var(--line);border-radius:8px;padding:12px 14px;box-shadow:var(--shadow)}.mini-stats span{display:block;color:var(--muted);font-size:12px;margin-bottom:6px}.mini-stats strong{font-size:20px}.click-row{cursor:pointer}.click-row:hover td{background:#f6fbff}.click-row td small{display:block;color:#94a3b8;margin-top:3px}.customer-picker{display:flex;gap:8px;align-items:end}.customer-picker .btn{margin-bottom:10px;white-space:nowrap}.customer-card-strip{display:flex;gap:16px;align-items:center;background:#eef8ff;border:1px solid #cbe8fb;padding:10px 12px;border-radius:7px;margin:2px 0 12px;color:#4c6b80}.customer-card-strip strong{color:#0b87e8}.customer-card-strip em{margin-left:auto;font-style:normal;font-weight:700;color:#15936f}.cart-head{display:grid;grid-template-columns:1fr 78px 120px 34px;gap:8px;padding:9px 0;color:#718096;font-weight:600;border-bottom:1px solid var(--line)}.payment-title{display:flex;justify-content:space-between;align-items:center;margin-top:14px}.payment-title h3{margin:0}.payment-title span{font-size:12px;color:var(--muted)}.money-card-pay{display:grid;grid-template-columns:1.5fr 1fr;gap:8px;padding:10px;border:1px solid #cfe5d7;background:#f2fbf5;border-radius:8px}.money-card-pay label{margin:0}.money-card-pay small{grid-column:1/-1;color:#27875d}.payment-summary{display:grid;grid-template-columns:1fr auto;gap:7px;border-top:1px dashed #cbd5df;border-bottom:1px dashed #cbd5df;padding:12px 0;margin:12px 0}.payment-summary strong{font-size:16px}.payment-summary .over{color:#dc2626}.order-actions{display:flex;justify-content:flex-end;gap:8px;margin-top:12px}.catalog-search{position:relative}.catalog-search input{width:100%;padding-right:38px}.catalog-search span{position:absolute;right:13px;top:9px;font-size:20px;color:#94a3b8}.detail-grid{display:grid;grid-template-columns:minmax(0,1.7fr) minmax(320px,.7fr);gap:12px}.invoice-top{display:flex;justify-content:space-between;align-items:start;border-bottom:1px solid var(--line);padding-bottom:12px}.invoice-top h2{margin:0 0 4px}.invoice-top p{margin:0;color:var(--muted)}.invoice-meta{display:flex;gap:24px;flex-wrap:wrap;padding:12px 0;color:#718096}.invoice-meta b{color:var(--text);margin-left:6px}.invoice-items small{display:block;color:#94a3b8;margin-top:3px}.invoice-totals{margin-left:auto;width:min(430px,100%);padding-top:12px}.invoice-totals>div{display:flex;justify-content:space-between;padding:5px 0}.invoice-totals .grand{border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:10px 0;margin:5px 0;font-size:18px}.invoice-totals .grand strong{font-size:23px;color:#0b87e8}.invoice-note{background:#fff8e9;border:1px solid #f4ddab;border-radius:7px;padding:10px;margin:12px 0}.payment-history h2{margin-top:0}.pay-row{display:flex;justify-content:space-between;gap:12px;padding:12px 0;border-bottom:1px solid #edf2f5}.pay-row small{display:block;color:#94a3b8;margin-top:4px}.pay-row strong{color:#059669}.empty.compact{padding:24px}.payment-history hr{border:0;border-top:1px solid var(--line);margin:18px 0}.payment-history label{display:grid;gap:6px;margin-bottom:10px;color:#617389}.payment-history input,.payment-history select{width:100%;border:1px solid #cbd9e4;border-radius:6px;padding:10px;background:#fff}.report-grid{display:grid;grid-template-columns:minmax(0,2fr) minmax(280px,.7fr);gap:12px}.pay-stat{display:flex;justify-content:space-between;padding:12px 0;border-bottom:1px solid #edf2f5}.pay-stat strong{color:#059669}
@media(max-width:767px){.mini-stats{grid-template-columns:1fr 1fr;margin-left:-4px;margin-right:-4px}.mini-stats strong{font-size:17px}.order-list-panel .table-wrap table{min-width:720px}.customer-picker{align-items:end}.customer-picker .field{min-width:0}.customer-picker .btn{padding:10px 9px}.customer-card-strip{display:grid;grid-template-columns:1fr auto;gap:4px 10px}.customer-card-strip em{grid-column:1/-1;margin:0}.cart-head{grid-template-columns:1fr 55px 90px 28px;font-size:12px}.money-card-pay{grid-template-columns:1fr}.order-actions{position:sticky;bottom:69px;background:#fff;padding:10px 0;z-index:5}.order-actions .btn{flex:1}.detail-grid,.report-grid{grid-template-columns:1fr}.invoice-meta{display:grid;gap:6px}.invoice-items{font-size:12px}.invoice-items th,.invoice-items td{padding:9px 6px}.invoice-detail,.payment-history{margin-bottom:10px}.customer-meta a{color:var(--blue);font-weight:700}}

/* ========================================================================== 
   Spa Sakura CRM v0.4 — Dashboard + Professional POS
   ========================================================================== */
:root{--blue:#0b8fea;--blue-dark:#0879c8;--nav:#147fae;--ink:#263444;--surface:#fff;--surface-soft:#f7fbfe;--line-strong:#cbd9e4;--purple:#a846c6;--teal:#22a89b;--orange2:#f6a623;--red2:#ef5147}
body{background:#edf3f7}.page-shell{max-width:1920px;padding:14px 14px 92px}.topbar{height:56px;background:var(--nav);padding:0 12px;box-shadow:0 1px 0 rgba(7,67,99,.22)}.brand{font-size:15px;white-space:nowrap}.desktop-nav{gap:0}.desktop-nav a{gap:7px;padding:0 13px;font-size:13px}.desktop-nav a i{font-style:normal;opacity:.92;font-size:15px}.top-actions{gap:8px}.branch-pill,.user-pill{display:flex;align-items:center;gap:8px;padding:6px 9px;border-radius:5px;color:#fff}.branch-pill{background:rgba(255,255,255,.08)}.home-dot{font-size:11px}.user-avatar-mini{width:30px;height:30px;border-radius:50%;background:#e7eef3;color:#496174;display:grid;place-items:center;font-weight:800;border:2px solid rgba(255,255,255,.7)}.logout-link{font-size:20px;padding:6px 8px}.btn{transition:.18s ease;box-shadow:none}.btn:hover{transform:translateY(-1px);border-color:#9fc4dd}.btn.primary:hover{background:#087dcd}.btn.soft{background:#eef7fe;border-color:#cce5f7;color:#1678b8}.btn.danger-soft{background:#fff2ee;border-color:#ffd4c8;color:#d95737}.btn.tiny{padding:6px 9px;font-size:12px}.panel{box-shadow:0 1px 4px rgba(30,73,104,.06);border-color:#d6e2eb}

/* Dashboard */
.dashboard-welcome{display:flex;align-items:center;justify-content:space-between;gap:20px;margin:2px 0 14px;padding:2px 4px}.dashboard-welcome .eyebrow{font-size:11px;font-weight:800;letter-spacing:.13em;color:#0d88d9}.dashboard-welcome h1{margin:4px 0 3px;font-size:25px}.dashboard-welcome p{margin:0;color:#7a8b99}.dashboard-actions{display:flex;gap:8px}.hero-metrics{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-bottom:12px}.hero-metric{min-height:132px;border-radius:8px;color:#fff;padding:18px 20px;display:flex;align-items:center;gap:18px;position:relative;overflow:hidden;box-shadow:0 4px 14px rgba(24,77,113,.09)}.hero-metric:after{content:"";position:absolute;right:-32px;top:-44px;width:150px;height:150px;background:rgba(255,255,255,.12);transform:rotate(38deg)}.hero-metric:hover{filter:brightness(1.02)}.metric-blue{background:linear-gradient(130deg,#1d9fe9,#1288ce)}.metric-orange{background:linear-gradient(130deg,#ffa823,#ef8b16)}.metric-red{background:linear-gradient(130deg,#ef554a,#e23d3d)}.metric-icon{width:58px;height:58px;border-radius:10px;background:rgba(255,255,255,.16);display:grid;place-items:center;font-size:28px;flex:0 0 auto}.hero-metric span{font-size:12px;font-weight:800;letter-spacing:.035em;opacity:.94}.hero-metric strong{display:block;font-size:28px;line-height:1.15;margin:8px 0 5px}.hero-metric small{opacity:.92}.quick-actions-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin-bottom:12px}.quick-actions-grid a{background:linear-gradient(135deg,#b34ac6,#9d3db6);color:#fff;min-height:92px;border-radius:7px;padding:16px;display:flex;align-items:center;gap:14px;box-shadow:0 2px 8px rgba(85,45,112,.12)}.quick-actions-grid a:nth-child(2){background:linear-gradient(135deg,#a64ac2,#9043b2)}.quick-actions-grid a:nth-child(3){background:linear-gradient(135deg,#a446bb,#8f39aa)}.quick-actions-grid a:nth-child(4){background:linear-gradient(135deg,#af4cc3,#9637b0)}.quick-actions-grid a:hover{filter:brightness(1.04)}.quick-icon{font-size:30px;width:48px;text-align:center;border-right:1px solid rgba(255,255,255,.25);padding-right:12px}.quick-actions-grid b,.quick-actions-grid small{display:block}.quick-actions-grid b{font-size:14px;margin-bottom:5px}.quick-actions-grid small{font-size:11px;opacity:.88}.dashboard-grid{display:grid;grid-template-columns:minmax(0,1.8fr) minmax(330px,.7fr);gap:12px;margin-bottom:12px}.dashboard-side{display:grid;gap:12px}.dashboard-panel{padding:0;overflow:hidden}.panel-heading{min-height:58px;padding:12px 15px;border-bottom:1px solid #e4edf3;display:flex;align-items:center;justify-content:space-between;gap:15px;background:#fff}.panel-heading h2{font-size:15px;margin:0 0 3px}.panel-heading p{font-size:12px;color:#8694a1;margin:0}.panel-heading>a{color:#0b87e8;font-size:12px;font-weight:700}.dashboard-order-list{background:#fff}.dashboard-order-row{display:grid;grid-template-columns:38px minmax(0,1fr) auto 86px;gap:11px;align-items:center;padding:12px 15px;border-bottom:1px solid #edf2f5}.dashboard-order-row:hover{background:#f6fbff}.order-mini-icon{width:34px;height:34px;border-radius:7px;background:#eef7fe;color:#0a8fe8;display:grid;place-items:center}.order-main b,.order-main small{display:block}.order-main small{color:#8a98a5;margin-top:3px;font-size:11px}.order-money{text-align:right}.order-money strong,.order-money small{display:block}.order-money strong{color:#118c80}.order-money small{font-size:11px;margin-top:3px}.dashboard-empty{padding:30px;text-align:center;color:#8393a0}.dashboard-empty a{color:#0b87e8;font-weight:700}.payment-breakdown{padding:3px 15px 8px}.payment-breakdown>div{display:flex;align-items:center;justify-content:space-between;padding:11px 0;border-bottom:1px solid #edf2f5}.payment-breakdown>div:last-child{border-bottom:0}.payment-breakdown span{display:flex;align-items:center;gap:9px;color:#5e7181}.payment-breakdown strong{color:#1e3b50}.pay-dot{width:10px;height:10px;border-radius:3px;display:inline-block}.pay-dot.cash{background:#7454e8}.pay-dot.bank{background:#3099e6}.pay-dot.card{background:#e45a9d}.pay-dot.cod{background:#f39c2b}.pay-dot.moneycard{background:#19aa74}.management-mini-grid{display:grid;grid-template-columns:1fr 1fr}.management-mini-grid a{padding:16px;border-right:1px solid #edf2f5;border-bottom:1px solid #edf2f5;text-align:center}.management-mini-grid a:nth-child(even){border-right:0}.management-mini-grid strong,.management-mini-grid span{display:block}.management-mini-grid strong{font-size:18px;color:#1987c7}.management-mini-grid span{font-size:11px;color:#8393a0;margin-top:5px}.latest-customers{display:grid;grid-template-columns:repeat(3,1fr);gap:0}.latest-customer-card{min-width:0;padding:14px 15px;display:grid;grid-template-columns:44px minmax(0,1fr);gap:9px;border-right:1px solid #edf2f5;border-bottom:1px solid #edf2f5;align-items:center}.latest-customer-card .avatar{width:40px;height:40px;font-size:14px}.latest-customer-card b,.latest-customer-card small{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.latest-customer-card small{color:#8493a0;margin-top:3px}.latest-card-balance{grid-column:1/-1;display:flex;justify-content:space-between;font-size:11px;color:#8493a0}.latest-card-balance strong{color:#16976d;font-size:12px}.latest-customer-card>a{grid-column:1/-1;color:#0b87e8;font-size:11px;font-weight:700}

/* POS page shell */
.pos-pagebar{display:flex;align-items:center;justify-content:space-between;gap:16px;background:#fff;border:1px solid #d9e5ed;border-radius:7px;padding:9px 10px;margin-bottom:10px}.pos-title{display:flex;align-items:center;gap:9px}.pos-title-icon{color:#71869a;font-size:20px}.pos-title h1{font-size:16px;margin:0 0 2px}.pos-title p{font-size:11px;color:#8a99a6;margin:0}.pos-page-actions{display:flex;gap:8px}.pos-grid-v4{grid-template-columns:minmax(510px,1fr) minmax(560px,1fr);gap:10px;align-items:stretch}.pos-order-panel,.catalog-v4{padding:0;min-height:calc(100vh - 148px);overflow:visible}.pos-order-panel{display:flex;flex-direction:column}.pos-panel-titlebar{height:50px;border-bottom:1px solid #dae5ed;display:flex;align-items:center;justify-content:space-between;padding:0 13px;background:#fff}.pos-panel-title{display:flex;align-items:center;gap:7px;color:#526b80}.pos-panel-title b{font-size:14px}.order-status-head{display:flex;align-items:center;gap:9px}.order-status-head span{color:#73879a;font-size:12px}.order-status-head b{background:#158fe7;color:#fff;padding:7px 10px;border-radius:4px;font-size:11px}.pos-customer-section{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:8px;padding:11px 12px 8px;border-bottom:1px solid #edf2f5}.customer-selector-v4{position:relative;min-width:0}.customer-selector-button{width:100%;height:58px;background:#fff;border:1px solid #cadbe7;border-radius:7px;display:flex;align-items:center;gap:10px;padding:7px 10px;text-align:left;cursor:pointer;transition:.15s}.customer-selector-button:hover,.customer-selector-button.open{border-color:#4aa9e5;box-shadow:0 0 0 3px rgba(11,143,234,.08)}.customer-selector-avatar{width:38px;height:38px;flex:0 0 auto;border-radius:50%;background:#ebf6fd;color:#138bd7;display:grid;place-items:center;font-weight:800}.customer-selector-copy{min-width:0;display:block;flex:1}.customer-selector-copy small,.customer-selector-copy b,.customer-selector-copy em{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.customer-selector-copy small{color:#8293a0;font-size:10px}.customer-selector-copy b{font-size:14px;margin:1px 0}.customer-selector-copy em{font-style:normal;color:#95a2ad;font-size:10px}.selector-chevron{color:#7990a1;font-size:18px}.customer-add-btn{height:58px;margin:0;display:flex;align-items:center;gap:6px;color:#0e80c9;border-color:#c6ddea;background:#f8fcff}.customer-add-btn span{font-size:19px}.customer-dropdown-v4{display:none;position:absolute;z-index:70;top:64px;left:0;width:min(470px,calc(100vw - 36px));background:#fff;border:1px solid #cbdde9;border-radius:8px;box-shadow:0 14px 38px rgba(29,64,88,.18);overflow:hidden}.customer-dropdown-v4.show{display:block}.customer-dropdown-search{padding:8px;border-bottom:1px solid #e7eef3;position:relative}.customer-dropdown-search span{position:absolute;left:20px;top:19px;color:#8ea0ae}.customer-dropdown-search input{width:100%;height:40px;border:1px solid #cbd9e4;border-radius:6px;padding:8px 10px 8px 34px}.customer-options{max-height:330px;overflow:auto}.customer-option{display:grid;grid-template-columns:34px 1fr auto;gap:9px;align-items:center;padding:9px 11px;border-bottom:1px solid #f0f3f6}.customer-option:hover{background:#f4faff}.customer-option.selected{background:#eaf6fe}.customer-option-avatar{width:31px;height:31px;border-radius:50%;display:grid;place-items:center;background:#e9f4fa;color:#1789d0;font-weight:800;font-size:11px}.customer-option b,.customer-option small{display:block}.customer-option b{font-size:12px}.customer-option small{font-size:10px;color:#8c9aa5;margin-top:2px}.customer-option i{font-style:normal;color:#168bd5;font-weight:800}.selected-customer-summary{margin:0 12px 8px;display:grid;grid-template-columns:1.2fr 1fr .7fr 1fr;border:1px solid #cfe7f7;background:#f2faff;border-radius:6px;overflow:hidden}.selected-customer-summary>div{padding:8px 10px;border-right:1px solid #d9eaf4}.selected-customer-summary>div:last-child{border-right:0}.selected-customer-summary span,.selected-customer-summary strong{display:block}.selected-customer-summary span{font-size:9px;text-transform:uppercase;letter-spacing:.04em;color:#7890a2}.selected-customer-summary strong{font-size:11px;color:#38556b;margin-top:3px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.selected-customer-summary .card-balance-box strong{color:#15946b}.order-meta-strip{display:flex;gap:18px;flex-wrap:wrap;padding:7px 13px;background:#fbfdfe;border-top:1px solid #f0f4f6;border-bottom:1px solid #e7eef3;color:#8493a0;font-size:10px}.order-meta-strip b{color:#567083;margin-left:4px}.cart-table-head{display:grid;grid-template-columns:minmax(0,1fr) 62px 105px 110px 30px;gap:7px;padding:9px 13px;background:#f8fbfd;border-bottom:1px solid #dce8ef;color:#657b8c;font-size:11px;font-weight:700}.cart-empty-v4{min-height:196px;margin:0;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;color:#9aa9b4;background:#f3fbff;border-radius:0;border-bottom:1px solid #e2edf3}.empty-cart-icon{width:58px;height:58px;border-radius:50%;display:grid;place-items:center;background:#e7f4fb;color:#8fbdd6;font-size:27px;margin-bottom:9px}.cart-empty-v4 b{color:#8194a2;font-size:12px}.cart-empty-v4 small{font-size:10px;margin-top:4px}.pos-order-panel #cart:not(.cart-empty-v4){padding:0 13px;min-height:120px}.pos-order-panel .cart-row{grid-template-columns:minmax(0,1fr) 62px 105px 110px 30px;gap:7px;padding:8px 0}.pos-order-panel .cart-row>div b{font-size:12px}.pos-order-panel .cart-row small{font-size:10px}.pos-order-panel .cart-row input{height:34px;border:1px solid #cad9e4;border-radius:5px}.pos-order-panel .cart-row .unit-price{color:#61798a;text-align:right;font-size:11px}.pos-order-panel .cart-row strong{text-align:right;color:#138d82;font-size:12px}.invoice-bottom-area{margin-top:auto;border-top:1px solid #dce7ee;padding:10px 13px 12px;background:#fff}.totals-v4{width:100%}.totals-v4>div,.totals-v4>label{display:grid;grid-template-columns:1fr 170px;align-items:center;margin:0;padding:5px 0;color:#5b7182}.totals-v4>label{margin:0}.totals-v4 strong{text-align:right;color:#138c81}.totals-v4 .grand{font-size:18px;border-top:1px solid #e7eef3;margin-top:3px;padding-top:9px}.totals-v4 .grand strong{font-size:25px;color:#0789e8}.money-input{height:36px;border:1px solid #cad9e4;border-radius:5px;display:flex;align-items:center;background:#fff;overflow:hidden}.money-input input{border:0!important;outline:0;min-width:0;width:100%;height:34px;padding:6px 7px!important;text-align:right;background:transparent!important}.money-input i{font-style:normal;padding:0 8px;color:#8293a0}.payment-box-v4{border-top:1px dashed #ccdbe5;border-bottom:1px dashed #ccdbe5;margin:7px 0 9px}.payment-box-v4>summary{list-style:none;cursor:pointer;display:flex;align-items:center;justify-content:space-between;padding:9px 0}.payment-box-v4>summary::-webkit-details-marker{display:none}.payment-box-v4 summary b,.payment-box-v4 summary small{display:block}.payment-box-v4 summary small{color:#8d9ba6;font-size:10px;margin-top:2px}.payment-grid-v4{grid-template-columns:repeat(2,1fr);gap:7px;margin:0 0 7px}.payment-grid-v4>label{display:grid;grid-template-columns:36px minmax(0,1fr);gap:7px;align-items:center;border:1px solid #d9e4eb;border-radius:6px;padding:7px;background:#fbfdff;margin:0}.payment-grid-v4>label>div>b{font-size:10px;color:#607788}.payment-method-icon{width:31px;height:31px;border-radius:6px;display:grid;place-items:center;color:#fff;font-style:normal}.payment-method-icon.cash{background:#7858dc}.payment-method-icon.bank{background:#328fda}.payment-method-icon.cod{background:#f0a025}.payment-method-icon.card{background:#d75a9e}.payment-method-icon.moneycard{background:#18a775}.payment-grid-v4 .money-input{height:31px;margin-top:4px}.payment-grid-v4 .money-input input{height:29px;font-size:11px}.money-card-pay-v4{display:block;padding:8px;border-color:#cbe9d8;background:#f4fbf6}.money-card-head{display:flex;align-items:center;gap:8px;margin-bottom:7px}.money-card-head b,.money-card-head small{display:block}.money-card-head b{font-size:11px}.money-card-head small{font-size:9px;color:#78918a}.money-card-fields{display:grid;grid-template-columns:1.4fr 1fr;gap:7px}.money-card-fields label{margin:0;font-size:10px}.money-card-fields select{height:34px;padding:4px 7px}.money-card-hint{display:block;color:#1a8f65;margin-top:5px}.payment-summary-v4{display:flex;align-items:center;justify-content:flex-end;gap:18px;border:0;margin:7px 0 0;padding:5px 0;font-size:10px}.payment-summary-v4 span{display:flex;gap:6px;align-items:center}.payment-summary-v4 strong{font-size:13px;color:#178d83}.payment-summary-v4 #remainText{color:#ef5147}.invoice-note-field{display:grid;grid-template-columns:110px 1fr;align-items:center;margin:7px 0!important}.invoice-note-field textarea{min-height:48px!important;resize:vertical}.order-actions-v4{margin-top:8px;padding-top:9px;border-top:1px solid #e9eef2}.order-actions-v4 .checkout-btn{min-width:175px}.catalog-v4{display:flex;flex-direction:column}.catalog-toolbar-v4{padding:9px 10px;border-bottom:1px solid #e1eaf0}.catalog-search-v4{position:relative}.catalog-search-v4 span{left:12px;right:auto;top:9px;font-size:18px}.catalog-search-v4 input{height:40px;padding:8px 12px 8px 37px;border:1px solid #cadce8;border-radius:20px;width:100%;outline:0}.catalog-search-v4 input:focus{border-color:#40a5e5;box-shadow:0 0 0 3px rgba(11,143,234,.08)}.catalog-tabs-v4{display:grid;grid-template-columns:repeat(3,1fr);gap:0;padding:0 10px;margin:0;border-bottom:1px solid #dbe6ed}.catalog-tabs-v4 button{border-radius:0;border:0;border-right:1px solid #dde7ed;padding:11px 8px;background:#fff;color:#667b8c;font-size:11px;font-weight:700}.catalog-tabs-v4 button:first-child{border-left:1px solid #dde7ed}.catalog-tabs-v4 button span{margin-right:6px}.catalog-tabs-v4 button.active{background:#168fe5;color:#fff}.catalog-category-wrap{padding:9px 10px;border-bottom:1px solid #e5edf2;min-height:52px}.catalog-category-row{display:flex;gap:7px;overflow:auto;padding-bottom:1px}.category-chip{white-space:nowrap;border:1px solid #d4e1e9;background:#fff;color:#687f90;border-radius:18px;padding:7px 11px;cursor:pointer;font-size:10px}.category-chip.active{background:#178fe4;color:#fff;border-color:#178fe4}.catalog-list-v4{padding:10px;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;max-height:calc(100vh - 285px)}.catalog-item-v4{min-height:88px;display:grid;grid-template-columns:58px minmax(0,1fr) auto 26px;gap:9px;align-items:center;padding:0;background:#fff;border:1px solid #d6e3eb;border-radius:6px;overflow:hidden}.catalog-item-v4:hover{box-shadow:0 3px 12px rgba(37,98,139,.08);border-color:#62b5e9}.catalog-thumb{height:100%;min-height:86px;background:#f4f7f9;color:#a7b4be;display:grid;place-items:center;font-size:24px}.catalog-thumb.service{color:#69aede;background:#f0f8fd}.catalog-thumb.product{color:#a17dd3;background:#f8f4fd}.catalog-thumb.card{color:#52ac79;background:#f2fbf6}.catalog-copy{min-width:0;text-align:left}.catalog-copy b{display:block;color:#1688de;font-size:11px;line-height:1.35}.catalog-copy small{display:block;font-size:9px;margin-top:7px;color:#94a1ab;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.catalog-price{font-size:11px;color:#0c8c7f!important;white-space:nowrap}.catalog-add{width:23px;height:23px;border-radius:50%;display:grid;place-items:center;background:#e7f5fe;color:#138ce0;font-size:16px;margin-right:7px}.catalog-empty{margin:auto;padding:30px;text-align:center;color:#8797a3}.modal-box-v4{width:min(610px,100%);padding:0;overflow:hidden}.modal-heading{display:flex;align-items:center;gap:12px;padding:17px 20px;border-bottom:1px solid #e5edf2}.modal-heading-icon{width:40px;height:40px;border-radius:8px;background:#eaf6fe;color:#118cdd;display:grid;place-items:center;font-size:20px}.modal-heading h2{font-size:17px;margin:0 0 3px}.modal-heading p{font-size:11px;color:#8695a1;margin:0}.modal-box-v4 form{padding:18px 20px}.form-grid-v4{display:grid;grid-template-columns:1fr 1fr;gap:10px}.form-grid-v4 label{margin:0}.form-grid-v4 label b{color:#ef4444}.form-grid-v4 .span-2{grid-column:1/-1}.modal-actions{display:flex;justify-content:flex-end;gap:8px;border-top:1px solid #edf2f5;margin:18px -20px -18px;padding:12px 20px;background:#fbfdff}

@media(max-width:1100px){.desktop-nav a{padding:0 9px}.branch-pill{display:none}.hero-metrics{grid-template-columns:1fr 1fr}.hero-metric:last-child{grid-column:1/-1}.quick-actions-grid{grid-template-columns:1fr 1fr}.dashboard-grid{grid-template-columns:1fr}.latest-customers{grid-template-columns:1fr 1fr}.pos-grid-v4{grid-template-columns:1fr}.pos-order-panel,.catalog-v4{min-height:auto}.catalog-list-v4{max-height:600px}}
@media(max-width:767px){
  .topbar{height:60px}.page-shell{padding:10px 10px 84px}.mobile-nav{grid-template-columns:repeat(5,1fr)}.mobile-nav a{height:65px;font-size:10px}.mobile-nav a span{font-size:19px}.dashboard-welcome{margin:2px 0 10px}.dashboard-welcome h1{font-size:20px}.dashboard-welcome .eyebrow,.dashboard-actions{display:none}.hero-metrics{grid-template-columns:1fr 1fr;gap:8px}.hero-metric{min-height:102px;padding:12px;gap:9px;border-radius:8px}.hero-metric:last-child{grid-column:1/-1}.metric-icon{width:38px;height:38px;font-size:20px}.hero-metric span{font-size:9px}.hero-metric strong{font-size:18px;margin:5px 0 3px}.hero-metric small{font-size:9px}.quick-actions-grid{grid-template-columns:1fr 1fr;gap:7px}.quick-actions-grid a{min-height:76px;padding:10px}.quick-icon{font-size:22px;width:35px}.quick-actions-grid b{font-size:11px}.quick-actions-grid small{font-size:9px}.dashboard-grid{grid-template-columns:1fr}.dashboard-panel{margin-left:0;margin-right:0;border:1px solid #dbe5ec;border-radius:8px}.dashboard-order-row{grid-template-columns:34px minmax(0,1fr) auto}.dashboard-order-row>.badge{grid-column:2/4;justify-self:start}.order-money{font-size:11px}.latest-customers{grid-template-columns:1fr}.customer-latest-panel{margin-bottom:8px}.pos-pagebar{margin:-2px -10px 8px;border-left:0;border-right:0;border-radius:0;padding:8px 10px}.pos-title h1{font-size:15px}.pos-title p{display:none}.pos-page-actions .soft{display:none}.pos-grid-v4{display:flex;flex-direction:column;gap:8px}.catalog-v4{order:-1;margin:0;border:1px solid #dbe5ec;border-radius:8px}.pos-order-panel{order:2;margin:0;border:1px solid #dbe5ec;border-radius:8px}.catalog-toolbar-v4{padding:8px}.catalog-tabs-v4{position:static;padding:0 8px}.catalog-category-wrap{padding:8px}.catalog-list-v4{grid-template-columns:1fr 1fr;padding:8px;max-height:none}.catalog-item-v4{grid-template-columns:1fr;display:flex;min-height:112px;flex-direction:column;align-items:stretch;gap:4px;padding:8px}.catalog-thumb{height:38px;min-height:38px;border-radius:5px}.catalog-price{text-align:left;margin-top:auto}.catalog-add{position:absolute;align-self:flex-end}.catalog-item-v4{position:relative}.catalog-copy b{font-size:11px}.pos-customer-section{grid-template-columns:1fr auto;padding:8px}.customer-add-btn{width:46px;font-size:0;padding:0;justify-content:center}.customer-add-btn span{font-size:22px}.selected-customer-summary{grid-template-columns:1fr 1fr;margin:0 8px 8px}.selected-customer-summary>div:nth-child(2){border-right:0}.selected-customer-summary>div:nth-child(3),.selected-customer-summary>div:nth-child(4){border-top:1px solid #d9eaf4}.order-meta-strip{padding:6px 9px;gap:8px}.order-meta-strip span:last-child{display:none}.cart-table-head{grid-template-columns:minmax(0,1fr) 48px 82px 25px;padding:8px 9px}.cart-table-head span:nth-child(3){display:none}.pos-order-panel .cart-row{grid-template-columns:minmax(0,1fr) 48px 82px 25px;padding:8px 0}.pos-order-panel .cart-row .unit-price{display:none}.pos-order-panel #cart:not(.cart-empty-v4){padding:0 9px}.cart-empty-v4{min-height:130px}.invoice-bottom-area{padding:8px 9px}.totals-v4>div,.totals-v4>label{grid-template-columns:1fr 135px}.payment-grid-v4{grid-template-columns:1fr 1fr}.payment-method-icon{width:28px;height:28px}.payment-grid-v4>label{grid-template-columns:30px 1fr;padding:6px}.money-card-fields{grid-template-columns:1fr}.payment-summary-v4{display:grid;grid-template-columns:1fr 1fr;gap:6px}.payment-summary-v4 .btn{grid-column:1/-1}.invoice-note-field{grid-template-columns:1fr}.order-actions-v4{position:sticky;bottom:65px;background:#fff;z-index:9;display:grid;grid-template-columns:1fr 1fr}.order-actions-v4 .danger-soft{display:none}.order-actions-v4 .checkout-btn{min-width:0;grid-column:1/-1}.form-grid-v4{grid-template-columns:1fr}.form-grid-v4 .span-2{grid-column:auto}.modal-box-v4{border-radius:16px 16px 0 0}.customer-dropdown-v4{position:fixed;left:10px;right:10px;top:72px;width:auto;max-height:65vh}.customer-options{max-height:55vh}}
.catalog-item-v4.just-added{border-color:#23a573!important;box-shadow:0 0 0 3px rgba(35,165,115,.10)!important;transform:scale(.995)}

/* ===== Spa Sakura CRM v0.5: typography + customer CRM ===== */
html{font-size:16px}body{font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue","Noto Sans",Arial,sans-serif;font-size:15px;line-height:1.48;font-weight:400;letter-spacing:0;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}button,input,select,textarea{font-family:inherit;font-size:inherit}h1,h2,h3,h4,.brand,.login-logo{font-family:inherit;letter-spacing:-.015em}.brand,.login-logo{font-weight:750}.desktop-nav a{font-weight:600}.btn{font-size:14px;line-height:1.25}.page-head h1,.dashboard-welcome h1{font-weight:720}.hero-metric span{font-size:11px;font-weight:700;letter-spacing:.025em}.hero-metric strong{font-size:23px;font-weight:720}.hero-metric small{font-size:11.5px}.quick-actions-grid b{font-size:14px;font-weight:700}.quick-actions-grid small{font-size:11.5px}.catalog-tabs-v4 button{font-size:13px}.category-chip{font-size:12px}.catalog-copy b{font-size:13px;font-weight:700}.catalog-copy small{font-size:11px}.catalog-price{font-size:13px}.customer-selector-copy small{font-size:11px}.customer-selector-copy b{font-size:14px}.customer-selector-copy em{font-size:11px}.payment-grid-v4>label>div>b{font-size:12px}.payment-box-v4 summary small{font-size:11px}.money-card-head b{font-size:13px}.money-card-head small{font-size:11px}.payment-summary-v4{font-size:12px}.payment-summary-v4 strong{font-size:14px}

.customer-page-v5{min-width:0}.customer-page-head{margin-bottom:10px}.customer-page-head .eyebrow{display:block;color:#1489d9;font-size:11px;font-weight:800;letter-spacing:.08em;margin-bottom:3px}.customer-summary-v5{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:9px;margin-bottom:10px}.customer-summary-v5>div{background:#fff;border:1px solid #dbe6ed;border-radius:8px;min-height:78px;padding:12px 14px;box-shadow:0 3px 12px rgba(24,73,107,.05);display:flex;flex-direction:column;justify-content:center}.customer-summary-v5 span{font-size:12px;color:#708393}.customer-summary-v5 strong{font-size:21px;line-height:1.2;color:#243b53;margin-top:5px;font-weight:720}.customer-summary-v5 .debt-card strong{color:#e54b45}
.customer-crm-layout-v5{display:grid;grid-template-columns:320px minmax(440px,1fr) 390px;gap:10px;align-items:start}.customer-crm-layout-v5>.panel{padding:0;overflow:hidden;min-height:690px;max-height:calc(100vh - 205px)}.customer-list-panel-v5,.customer-profile-panel-v5,.customer-activity-panel-v5{display:flex;flex-direction:column}.customer-search-v5{margin:10px;position:relative}.customer-search-v5>span{position:absolute;left:12px;top:9px;color:#8ca0af;font-size:18px}.customer-search-v5 input{width:100%;height:42px;border:1px solid #cadbe6;border-radius:21px;padding:8px 36px 8px 38px;outline:0;background:#fbfdff}.customer-search-v5 input:focus{border-color:#49a9e5;box-shadow:0 0 0 3px rgba(17,135,232,.08);background:#fff}.customer-search-v5>a{position:absolute;right:12px;top:7px;width:28px;height:28px;display:grid;place-items:center;border-radius:50%;color:#708391;font-size:20px}.customer-list-title-v5{display:flex;justify-content:space-between;align-items:center;padding:8px 12px;border-top:1px solid #edf2f5;border-bottom:1px solid #e4ebf0;background:#fbfdff}.customer-list-title-v5 b{font-size:12px}.customer-list-title-v5 span{font-size:11px;color:#8b9aa5}.customer-list-v5{overflow:auto;flex:1}.customer-list-empty-v5{padding:45px 20px;text-align:center;color:#8c9ba7}.customer-list-item-v5{display:grid;grid-template-columns:44px minmax(0,1fr) auto;gap:10px;align-items:center;padding:11px 12px;border-bottom:1px solid #e8eef2;transition:.16s;background:#fff}.customer-list-item-v5:hover{background:#f5fbff}.customer-list-item-v5.active{background:#dff5fb;border-left:3px solid #1391e5;padding-left:9px}.customer-avatar-v5{width:42px;height:42px;border-radius:50%;background:#19a98d;color:#fff;display:grid;place-items:center;font-size:16px;font-weight:750;box-shadow:inset 0 0 0 2px rgba(255,255,255,.5)}.customer-list-item-v5:nth-child(5n+2) .customer-avatar-v5{background:#e0a61d}.customer-list-item-v5:nth-child(5n+3) .customer-avatar-v5{background:#8a67cf}.customer-list-item-v5:nth-child(5n+4) .customer-avatar-v5{background:#328ec8}.customer-list-item-v5:nth-child(5n+5) .customer-avatar-v5{background:#ef7d37}.customer-list-copy-v5{min-width:0}.customer-list-copy-v5 b{display:block;color:#1688dc;font-size:13px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.customer-list-copy-v5 small,.customer-list-copy-v5 em{display:block;font-style:normal;font-size:11px;color:#7f909e;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-top:2px}.customer-list-copy-v5 em{font-size:10.5px;color:#9aa8b2}.customer-list-copy-v5 em i{font-style:normal;color:#e2514b}.customer-card-dot-v5{width:25px;height:25px;border-radius:50%;display:grid;place-items:center;background:#e9f8ef;color:#20a35e;font-weight:700}
.customer-profile-panel-v5{overflow:auto}.customer-profile-head-v5{display:grid;grid-template-columns:80px minmax(0,1fr) auto;gap:14px;align-items:center;padding:18px;border-bottom:1px solid #e5edf2;background:linear-gradient(180deg,#fff,#fbfdff)}.customer-avatar-large-v5{width:76px;height:76px;border-radius:50%;background:#17a68f;color:#fff;display:grid;place-items:center;font-size:28px;font-weight:750}.customer-profile-title-v5{min-width:0}.customer-profile-title-v5>small{color:#1488d8;font-weight:700}.customer-profile-title-v5 h2{margin:2px 0;font-size:21px;font-weight:720}.customer-profile-title-v5 p{margin:0;color:#546b7b;font-size:13px}.customer-profile-title-v5 em{display:block;margin-top:6px;color:#8a9aa5;font-size:11.5px;font-style:normal}.customer-profile-actions-v5{display:flex;gap:7px;align-self:start}.customer-profile-actions-v5 .btn{white-space:nowrap}.btn.soft{background:#eef8fe;border-color:#cfe8f7;color:#177dbb}.btn.small{padding:7px 9px;font-size:12px}.customer-kpis-v5{display:grid;grid-template-columns:repeat(4,1fr);border-bottom:1px solid #e7edf2;background:#fff}.customer-kpis-v5>div{padding:12px 11px;border-right:1px solid #e7edf2;min-width:0}.customer-kpis-v5>div:last-child{border-right:0}.customer-kpis-v5 span{display:block;color:#7e8f9b;font-size:10.5px}.customer-kpis-v5 strong{display:block;color:#1d425f;font-size:16px;margin:4px 0 2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.customer-kpis-v5 small{font-size:10px;color:#9aa8b2}.customer-kpis-v5 .danger strong{color:#e34f47}.customer-kpis-v5 .card-kpi strong{color:#199363}.customer-info-section-v5{padding:16px 18px}.section-title-v5{display:flex;justify-content:space-between;align-items:center;margin-bottom:12px}.section-title-v5 h3{font-size:15px;margin:0 0 2px}.section-title-v5 p{font-size:11px;color:#8b99a4;margin:0}.customer-info-grid-v5{display:grid;grid-template-columns:1fr 1fr;gap:0;border:1px solid #e4ebef;border-radius:8px;overflow:hidden}.customer-info-grid-v5>div{padding:12px 13px;border-bottom:1px solid #e9eef2;border-right:1px solid #e9eef2;min-height:65px}.customer-info-grid-v5>div:nth-child(2n){border-right:0}.customer-info-grid-v5>div:nth-last-child(-n+2){border-bottom:0}.customer-info-grid-v5 span{display:block;color:#84939f;font-size:11px;margin-bottom:4px}.customer-info-grid-v5 b{font-size:13px;font-weight:650;color:#344c5f}.customer-note-v5{margin-top:10px;padding:12px 13px;background:#fff9ea;border:1px solid #f4e7bd;border-radius:8px}.customer-note-v5 span{font-size:11px;color:#a47c20;font-weight:700}.customer-note-v5 p{margin:4px 0 0;font-size:13px;color:#5c5544}.customer-mobile-tabs-v5{display:none}.customer-empty-profile-v5{margin:auto;text-align:center;padding:60px 24px;color:#8799a6}.customer-empty-profile-v5>div{font-size:50px;color:#bdd3df}.customer-empty-profile-v5 h2{margin:8px 0 3px;color:#425b6e}.customer-empty-profile-v5 p{margin:0 0 16px}
.customer-activity-panel-v5{overflow:hidden}.activity-tabs-v5{display:grid;grid-template-columns:repeat(3,1fr);border-bottom:1px solid #dce6ed}.activity-tabs-v5 a{text-align:center;padding:13px 7px;color:#778b9a;font-size:12px;font-weight:650;border-bottom:2px solid transparent}.activity-tabs-v5 a.active{color:#1388d8;border-color:#138ee3;background:#f9fcfe}.activity-heading-v5{display:flex;justify-content:space-between;gap:10px;align-items:center;padding:13px 13px 9px}.activity-heading-v5 h3{font-size:14px;margin:0}.activity-heading-v5 p{font-size:10.5px;color:#8c9ba6;margin:2px 0 0}.activity-heading-v5>a{font-size:11px;color:#1689d7;font-weight:700}.customer-order-history-v5,.money-card-list-v5,.customer-debt-list-v5,.card-transaction-list-v5{overflow:auto}.customer-order-history-v5{padding:0 10px 12px;max-height:calc(100vh - 310px)}.customer-order-item-v5{display:block;border:1px solid #e1e9ee;border-radius:8px;padding:11px;margin-bottom:8px;background:#fff}.customer-order-item-v5:hover{border-color:#acd5ed;background:#fbfdff}.order-history-top-v5{display:flex;justify-content:space-between;align-items:center}.order-history-top-v5 b{font-size:12px;color:#1587d6}.customer-order-item-v5 p{font-size:11.5px;color:#536b7c;margin:7px 0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.customer-order-item-v5>div:nth-of-type(2){display:flex;justify-content:space-between;gap:10px;color:#8c9aa5;font-size:10.5px}.customer-order-item-v5>div:nth-of-type(2) strong{color:#0d8d80;font-size:13px}.customer-order-item-v5>small{display:block;color:#e04d45;margin-top:5px;font-size:10.5px}.activity-empty-v5{margin:12px;padding:28px 12px;text-align:center;border:1px dashed #d8e4ea;border-radius:8px;color:#8999a5;background:#fbfdfe}.activity-empty-v5.success{background:#f4fbf6;border-color:#cee9d6;color:#288147}
.money-card-list-v5{padding:0 10px;max-height:310px}.money-card-v5{background:linear-gradient(135deg,#147fae,#0f99c6);color:#fff;border-radius:10px;padding:13px;margin-bottom:9px;box-shadow:0 6px 16px rgba(20,127,174,.18)}.money-card-v5.locked{background:linear-gradient(135deg,#7f8b95,#697680)}.money-card-v5.closed{background:linear-gradient(135deg,#a3abb1,#858f97);opacity:.8}.money-card-top-v5{display:flex;justify-content:space-between;align-items:start;gap:8px}.money-card-top-v5 span{font-size:9px;letter-spacing:.08em;opacity:.82}.money-card-top-v5 b{display:block;font-size:12px;margin-top:3px}.money-card-status-v5{padding:3px 6px!important;border-radius:4px;background:rgba(255,255,255,.16);font-size:9px!important;letter-spacing:0!important}.money-card-balance-v5{margin:13px 0 10px}.money-card-balance-v5 span{display:block;font-size:10px;opacity:.8}.money-card-balance-v5 strong{display:block;font-size:22px;margin-top:2px;font-weight:720}.money-card-meta-v5{display:grid;grid-template-columns:1fr 1fr;gap:8px;border-top:1px solid rgba(255,255,255,.18);padding-top:8px}.money-card-meta-v5 span{font-size:9.5px;opacity:.85}.money-card-meta-v5 b{display:block;font-size:10.5px;color:#fff;margin-top:2px}.money-card-actions-v5{display:flex;gap:6px;margin-top:10px}.money-card-actions-v5 form{margin:0}.money-card-actions-v5 .btn{border-color:rgba(255,255,255,.35)}.money-card-actions-v5 .btn.soft{background:rgba(255,255,255,.13);color:#fff}.money-card-actions-v5 .btn.primary{background:#fff;color:#147fae;border-color:#fff}.card-history-title-v5{padding:10px 13px 5px;border-top:1px solid #e9eef2}.card-history-title-v5 h3{font-size:13px;margin:0}.card-transaction-list-v5{padding:0 10px 12px;max-height:260px}.card-transaction-v5{display:grid;grid-template-columns:32px minmax(0,1fr) auto;gap:8px;align-items:center;padding:9px 2px;border-bottom:1px solid #edf1f4}.tx-icon{width:29px;height:29px;border-radius:50%;display:grid;place-items:center;font-size:17px;font-weight:700}.tx-icon.spend{background:#ffe9e7;color:#df5149}.tx-icon.topup,.tx-icon.adjust{background:#e6f8ee;color:#1a9a5b}.card-transaction-v5 b{font-size:11px}.card-transaction-v5 p{font-size:10.5px;margin:2px 0;color:#657b8b}.card-transaction-v5 small{font-size:9.5px;color:#94a1aa}.tx-money-v5{text-align:right}.tx-money-v5 strong{font-size:11.5px;display:block}.tx-money-v5 strong.minus{color:#e1534b}.tx-money-v5 strong.plus{color:#17945a}.tx-money-v5 small{font-size:9.5px;color:#8798a4}
.customer-debt-list-v5{padding:0 10px 12px;max-height:calc(100vh - 300px)}.customer-debt-item-v5{border:1px solid #eadfdf;border-radius:8px;padding:11px;margin-bottom:9px;background:#fff}.debt-item-head-v5{display:flex;justify-content:space-between;gap:10px}.debt-item-head-v5 b{display:block;font-size:12px;color:#157fbf}.debt-item-head-v5 small{display:block;font-size:9.5px;color:#8e9ca6;margin-top:2px}.debt-item-head-v5 strong{font-size:14px;color:#e24c45}.debt-progress-v5{height:5px;background:#edf1f3;border-radius:5px;overflow:hidden;margin:10px 0 6px}.debt-progress-v5 span{display:block;height:100%;background:#38a96a}.debt-numbers-v5{display:flex;justify-content:space-between;color:#8b98a2;font-size:9.5px}.debt-collect-v5{margin-top:10px;border-top:1px solid #edf1f4;padding-top:8px}.debt-collect-v5 summary{cursor:pointer;color:#1487d4;font-size:11px;font-weight:700;list-style:none}.debt-collect-v5 summary::-webkit-details-marker{display:none}.debt-collect-v5 form{display:grid;gap:7px;margin-top:9px}.debt-collect-v5 label{font-size:10px;color:#738794;display:grid;gap:3px}.debt-collect-v5 input,.debt-collect-v5 select{width:100%;height:36px;border:1px solid #d4e0e7;border-radius:6px;padding:6px 8px}.debt-detail-link-v5{display:block;text-align:right;color:#6f8392;font-size:10px;margin-top:8px}.topup-note-v5{background:#eff8fd;border:1px solid #d3eaf7;color:#517284;padding:9px 10px;border-radius:7px;font-size:11px;margin-top:10px}

@media(max-width:1250px){.customer-crm-layout-v5{grid-template-columns:280px minmax(400px,1fr) 350px}.customer-kpis-v5{grid-template-columns:1fr 1fr}.customer-kpis-v5>div:nth-child(2){border-right:0}.customer-kpis-v5>div:nth-child(-n+2){border-bottom:1px solid #e7edf2}}
@media(max-width:980px){.customer-summary-v5{grid-template-columns:1fr 1fr}.customer-crm-layout-v5{grid-template-columns:300px 1fr}.customer-crm-layout-v5>.panel{max-height:none;min-height:0}.customer-activity-panel-v5{grid-column:1/-1;min-height:500px!important}.customer-order-history-v5,.customer-debt-list-v5{max-height:520px}.money-card-list-v5,.card-transaction-list-v5{max-height:420px}}
@media(max-width:767px){
  body{font-size:16px;line-height:1.5}.page-shell{padding:10px 10px 90px}.topbar{height:62px}.brand{font-size:19px}.mobile-nav a{font-size:11.5px;font-weight:600;line-height:1.15}.mobile-nav a span{font-size:21px}.btn{font-size:15px;min-height:44px;padding:10px 13px}.page-head h1{font-size:22px}.filterbar input,.filterbar select,label input,label select,label textarea,.catalog>input{font-size:16px;min-height:44px}.table-wrap table{font-size:14px}.badge{font-size:11.5px}.hero-metric span{font-size:11px}.hero-metric strong{font-size:20px}.hero-metric small{font-size:11px}.quick-actions-grid b{font-size:13px}.quick-actions-grid small{font-size:11px}.catalog-tabs-v4 button{font-size:13px;min-height:44px}.category-chip{font-size:12.5px;padding:8px 12px}.catalog-copy b{font-size:13.5px}.catalog-copy small{font-size:11.5px}.catalog-price{font-size:13.5px}.customer-selector-copy small{font-size:12px}.customer-selector-copy b{font-size:15px}.customer-selector-copy em{font-size:12px}.payment-grid-v4>label>div>b{font-size:12.5px}.payment-grid-v4 .money-input input{font-size:14px}.invoice-note-field textarea{font-size:15px}.modal-heading h2{font-size:19px}.modal-heading p{font-size:12.5px}
  .customer-page-head{margin:0 0 8px}.customer-page-head .eyebrow{font-size:10.5px}.customer-page-head p{display:none}.customer-page-head .btn{display:none}.customer-summary-v5{grid-template-columns:1fr 1fr;gap:7px;margin-bottom:8px}.customer-summary-v5>div{min-height:72px;padding:10px 11px}.customer-summary-v5 span{font-size:11.5px}.customer-summary-v5 strong{font-size:18px}.customer-crm-layout-v5{display:flex;flex-direction:column;gap:8px}.customer-crm-layout-v5>.panel{width:100%;margin:0;border:1px solid #dbe5ec;border-radius:9px;max-height:none;min-height:0}.customer-list-panel-v5{order:1}.customer-profile-panel-v5{order:2}.customer-activity-panel-v5{order:3;min-height:0!important}.customer-list-v5{max-height:300px}.customer-search-v5 input{height:46px;border-radius:23px;font-size:15px}.customer-list-item-v5{padding:11px}.customer-list-copy-v5 b{font-size:14px}.customer-list-copy-v5 small{font-size:12px}.customer-list-copy-v5 em{font-size:11px}.customer-profile-head-v5{grid-template-columns:62px minmax(0,1fr);padding:13px;gap:10px}.customer-avatar-large-v5{width:60px;height:60px;font-size:23px}.customer-profile-title-v5 h2{font-size:19px}.customer-profile-title-v5 p{font-size:13px}.customer-profile-title-v5 em{font-size:11px}.customer-profile-actions-v5{grid-column:1/-1;width:100%;display:grid;grid-template-columns:1fr 1fr}.customer-profile-actions-v5 .btn{width:100%}.customer-kpis-v5{grid-template-columns:1fr 1fr}.customer-kpis-v5>div{padding:10px}.customer-kpis-v5 span{font-size:11px}.customer-kpis-v5 strong{font-size:15px}.customer-kpis-v5 small{font-size:10.5px}.customer-info-section-v5{padding:13px}.section-title-v5 h3{font-size:15px}.section-title-v5 p{font-size:11px}.customer-info-grid-v5{grid-template-columns:1fr}.customer-info-grid-v5>div{border-right:0!important;border-bottom:1px solid #e9eef2!important;min-height:58px;padding:10px 11px}.customer-info-grid-v5>div:last-child{border-bottom:0!important}.customer-info-grid-v5 span{font-size:11.5px}.customer-info-grid-v5 b{font-size:14px}.customer-mobile-tabs-v5{display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid #e5edf2}.customer-mobile-tabs-v5 a{text-align:center;padding:12px 5px;font-size:13px;font-weight:700;color:#718593;border-bottom:2px solid transparent}.customer-mobile-tabs-v5 a.active{color:#1488d8;border-color:#1488d8;background:#f8fcff}.activity-tabs-v5{display:none}.activity-heading-v5{padding:13px}.activity-heading-v5 h3{font-size:15px}.activity-heading-v5 p{font-size:11.5px}.activity-heading-v5>a{font-size:12px}.customer-order-history-v5,.money-card-list-v5,.customer-debt-list-v5,.card-transaction-list-v5{max-height:none}.customer-order-item-v5{padding:12px}.order-history-top-v5 b{font-size:13px}.customer-order-item-v5 p{font-size:12.5px}.customer-order-item-v5>div:nth-of-type(2){font-size:11.5px}.customer-order-item-v5>div:nth-of-type(2) strong{font-size:14px}.customer-order-item-v5>small{font-size:11.5px}.money-card-top-v5 span{font-size:10px}.money-card-top-v5 b{font-size:13px}.money-card-balance-v5 span{font-size:11px}.money-card-balance-v5 strong{font-size:24px}.money-card-meta-v5 span{font-size:10.5px}.money-card-meta-v5 b{font-size:11.5px}.money-card-actions-v5 .btn{min-height:38px;font-size:12.5px}.card-transaction-v5 b{font-size:12px}.card-transaction-v5 p{font-size:11.5px}.card-transaction-v5 small,.tx-money-v5 small{font-size:10.5px}.tx-money-v5 strong{font-size:12.5px}.debt-item-head-v5 b{font-size:13px}.debt-item-head-v5 small{font-size:10.5px}.debt-item-head-v5 strong{font-size:15px}.debt-numbers-v5{font-size:10.5px}.debt-collect-v5 summary{font-size:12.5px}.debt-collect-v5 label{font-size:11.5px}.debt-collect-v5 input,.debt-collect-v5 select{height:44px;font-size:15px}.debt-detail-link-v5{font-size:11.5px}.topup-note-v5{font-size:12px}.fab{display:grid}
}

/* ===== Spa Sakura CRM v0.6 - Báo cáo ===== */
.report-page-v6,.report-day-page-v6{max-width:1680px;margin:0 auto}.report-head-v6{display:flex;align-items:flex-end;justify-content:space-between;gap:18px;margin:2px 0 12px}.report-head-v6 .eyebrow{display:block;color:#1787c9;font-size:11px;font-weight:750;letter-spacing:.08em;margin-bottom:3px}.report-head-v6 h1{margin:0;color:#273b4c;font-size:24px;font-weight:720;letter-spacing:-.025em}.report-head-v6 p{margin:4px 0 0;color:#7b8d9a;font-size:13px}.report-export-v6{background:#188bd3!important;border-color:#188bd3!important;color:#fff!important;min-width:122px;text-align:center}
.report-filter-v6{display:flex;justify-content:flex-end;align-items:center;gap:8px;position:relative;margin-bottom:11px}.period-tabs-v6{display:flex;border:1px solid #cfdce5;border-radius:7px;overflow:hidden;background:#fff}.period-tab-v6{border:0;border-right:1px solid #dbe5eb;background:#fff;color:#597082;min-width:64px;height:40px;padding:0 15px;cursor:pointer;font-weight:650}.period-tab-v6:last-child{border-right:0}.period-tab-v6.active{background:#168de0;color:#fff}.report-range-trigger-v6{height:40px;min-width:235px;border:1px solid #cfdde6;background:#fff;border-radius:7px;display:flex;align-items:center;justify-content:center;gap:8px;color:#536c7e;padding:0 12px;cursor:pointer}.report-range-trigger-v6 span{color:#1788cf}.report-range-trigger-v6 b{font-size:13px;font-weight:620}.report-range-trigger-v6 i{font-style:normal;margin-left:auto;color:#8ca0ad}.report-view-btn-v6{min-height:40px!important;height:40px;padding-top:0!important;padding-bottom:0!important}.report-range-popover-v6{position:absolute;right:0;top:48px;width:min(630px,calc(100vw - 32px));z-index:35;background:#fff;border:1px solid #d4e0e7;border-radius:10px;box-shadow:0 18px 42px rgba(26,61,89,.2);padding:14px}.range-inputs-v6{display:grid;grid-template-columns:1fr auto 1fr;gap:10px;align-items:end;border-bottom:1px solid #e5ecf0;padding-bottom:12px}.range-inputs-v6 label{display:grid;gap:5px;color:#6a7f8d;font-size:11px}.range-inputs-v6 input{height:40px;border:1px solid #cad9e3;border-radius:6px;padding:0 10px;font:inherit;color:#344b5d}.range-inputs-v6>span{padding-bottom:10px;color:#9badb8}.range-presets-v6{display:grid;grid-template-columns:1fr 1fr;gap:8px;padding:12px 0}.range-presets-v6 button{height:38px;text-align:left;border:1px solid #d8e3e9;border-radius:6px;background:#fff;color:#587081;padding:0 12px;cursor:pointer}.range-presets-v6 button:hover{background:#eef8ff;border-color:#9dcdee;color:#157db9}.range-actions-v6{display:flex;justify-content:flex-end;gap:8px;border-top:1px solid #e7edf1;padding-top:12px}
.report-metrics-v6{display:grid;grid-template-columns:1.05fr 1.45fr 1.05fr 1fr;gap:10px;margin-bottom:10px}.report-metric-v6{min-height:132px;border-radius:8px;color:#fff;padding:15px 16px;position:relative;overflow:hidden;box-shadow:0 5px 14px rgba(26,68,99,.09)}.report-metric-v6:after{content:"";position:absolute;width:110px;height:110px;border-radius:50%;right:-35px;top:-42px;background:rgba(255,255,255,.09)}.report-metric-v6>span{display:block;font-size:11px;font-weight:740;letter-spacing:.04em;opacity:.94}.report-metric-v6>strong{display:block;font-size:25px;font-weight:720;margin:18px 0 10px;letter-spacing:-.025em}.report-metric-v6>div{font-size:11.5px;opacity:.95}.report-metric-v6>div b{font-weight:700}.metric-sales-v6{background:linear-gradient(135deg,#11a7e6,#1390cf)}.metric-collected-v6{background:linear-gradient(135deg,#4257ba,#3848a3)}.metric-debt-v6{background:linear-gradient(135deg,#fb483b,#ef3f34)}.metric-moneycard-v6{background:linear-gradient(135deg,#d91a62,#bc1558)}
.payment-breakdown-v6{padding:0;margin-bottom:10px}.payment-breakdown-v6 .panel-heading,.report-chart-panel-v6 .panel-heading,.report-table-panel-v6 .panel-heading,.report-day-orders-v6 .panel-heading,.day-payment-panel-v6 .panel-heading{padding:12px 14px;border-bottom:1px solid #e5edf2;margin:0;display:flex;align-items:center;justify-content:space-between;gap:12px}.payment-breakdown-v6 .panel-heading h2,.report-chart-panel-v6 .panel-heading h2,.report-table-panel-v6 .panel-heading h2,.report-day-orders-v6 .panel-heading h2,.day-payment-panel-v6 .panel-heading h2{font-size:14px;margin:0;color:#40596c}.payment-breakdown-v6 .panel-heading p,.report-chart-panel-v6 .panel-heading p,.report-table-panel-v6 .panel-heading p,.report-day-orders-v6 .panel-heading p,.day-payment-panel-v6 .panel-heading p{font-size:10.5px;color:#8b9ba7;margin:2px 0 0}.payment-breakdown-v6 .panel-heading>strong{font-size:18px;color:#168a67}.payment-method-grid-v6{display:grid;grid-template-columns:repeat(4,1fr);padding:12px 14px;gap:8px}.payment-method-grid-v6>div{border:1px solid #e0e8ed;border-radius:7px;padding:10px 12px;display:grid;grid-template-columns:auto 1fr;grid-template-rows:auto auto;column-gap:8px;align-items:center;background:#fbfdfe}.pay-dot{width:9px;height:9px;border-radius:50%;grid-row:1/3}.pay-dot.cash{background:#7651e8}.pay-dot.transfer{background:#1ba9bd}.pay-dot.card{background:#e77c2e}.pay-dot.cod{background:#18a868}.payment-method-grid-v6 p{margin:0;color:#718493;font-size:11px}.payment-method-grid-v6 strong{font-size:14px;color:#31495a;margin-top:2px}
.report-main-grid-v6{display:grid;grid-template-columns:minmax(420px,.8fr) minmax(690px,1.2fr);gap:10px;align-items:start}.report-main-grid-v6>.panel{padding:0;overflow:hidden}.report-chart-wrap-v6{height:405px;position:relative;padding:8px 8px 0;background:#fff}.report-chart-wrap-v6 canvas{display:block;max-width:100%;cursor:crosshair}.chart-legend-v6{display:flex;gap:12px;font-size:10.5px;color:#718593;white-space:nowrap}.chart-legend-v6 span{display:flex;align-items:center;gap:5px}.chart-legend-v6 i{width:10px;height:3px;border-radius:2px}.legend-sales{background:#318bd4}.legend-cash{background:#25a775}.chart-tooltip-v6{position:absolute;background:#fff;border:1px solid #cddce6;border-radius:7px;padding:9px 10px;box-shadow:0 8px 24px rgba(26,65,93,.16);pointer-events:none;z-index:3;min-width:190px;color:#40576a;font-size:11px}.chart-tooltip-v6>b{display:block;font-size:11px;margin-bottom:7px}.chart-tooltip-v6 span{display:grid;grid-template-columns:8px 1fr auto;gap:6px;align-items:center;margin:4px 0}.chart-tooltip-v6 i{width:7px;height:7px;border-radius:50%}.chart-tooltip-v6 i.sales{background:#318bd4}.chart-tooltip-v6 i.cash{background:#25a775}.chart-tooltip-v6 strong{font-size:11.5px;color:#283f50}.table-count-v6{font-size:10.5px;color:#8b9da8}.report-table-v6{overflow:auto;max-height:405px}.report-table-v6 table{font-size:11px}.report-table-v6 th{position:sticky;top:0;z-index:2;background:#f8fbfd;color:#617687;font-size:10.5px;padding:10px 8px}.report-table-v6 td{padding:10px 8px;color:#536b7d}.report-table-v6 td:not(:first-child),.report-table-v6 th:not(:first-child){text-align:right}.report-table-v6 tbody tr[data-href]{cursor:pointer}.report-table-v6 tbody tr[data-href]:hover td{background:#f1f9fe}.report-table-v6 td b{color:#42586a}.report-blue{color:#1789d5!important;font-weight:650}.report-green{color:#2b9c62!important;font-weight:650}.report-red{color:#e54b43!important;font-weight:650}.report-purple{color:#8a4cc6!important;font-weight:650}.report-empty-cell-v6{text-align:center!important;padding:50px!important;color:#91a1ac!important}.mobile-report-list-v6{display:none}.report-empty-v6{padding:55px 18px;text-align:center;color:#8fa0ab}.back-link-v6{display:inline-block;color:#1688d1;font-size:12px;font-weight:650;margin-bottom:7px}
.report-day-metrics-v6{display:grid;grid-template-columns:repeat(4,1fr);gap:9px;margin-bottom:10px}.report-day-metrics-v6>div{background:#fff;border:1px solid #dce6ec;border-radius:8px;padding:13px 15px;box-shadow:var(--shadow)}.report-day-metrics-v6 span{display:block;font-size:10.5px;color:#7c8f9d;margin-bottom:5px}.report-day-metrics-v6 strong{font-size:18px;color:#334c5e}.report-day-orders-v6,.day-payment-panel-v6{padding:0;margin-bottom:10px}.day-order-list-v6{padding:0 12px}.day-order-v6{display:grid;grid-template-columns:36px minmax(0,1fr) auto 18px;gap:10px;align-items:center;padding:12px 2px;border-bottom:1px solid #e9eff3}.day-order-v6:hover{background:#f8fcff}.day-order-icon-v6{width:34px;height:34px;border-radius:7px;display:grid;place-items:center;background:#eaf7ff;color:#1687ce}.day-order-main-v6>b{font-size:11px;color:#1687d1;display:block}.day-order-main-v6>strong{display:block;font-size:13px;color:#334b5c;margin:2px 0}.day-order-main-v6>small{color:#8b9ba7;font-size:10px}.day-order-money-v6{text-align:right}.day-order-money-v6>strong{display:block;color:#178d7d;font-size:14px;margin-bottom:4px}.day-order-money-v6>small{display:block;color:#e15149;font-size:9.5px;margin-top:4px}.day-order-arrow-v6{color:#a4b1ba;font-size:22px}.day-payment-panel-v6 .payment-method-grid-v6{padding-bottom:14px}

@media(max-width:1180px){.report-metrics-v6{grid-template-columns:1fr 1fr}.report-main-grid-v6{grid-template-columns:1fr}.report-chart-wrap-v6{height:380px}.report-table-v6{max-height:none}.report-day-metrics-v6{grid-template-columns:1fr 1fr}}
@media(max-width:767px){
  .report-page-v6,.report-day-page-v6{margin:0}.report-head-v6{align-items:flex-start;margin:0 0 9px}.report-head-v6 .eyebrow{font-size:10.5px}.report-head-v6 h1{font-size:21px}.report-head-v6 p{display:none}.report-head-v6 .report-export-v6{min-width:0;padding:8px 10px!important;font-size:12.5px;min-height:40px}.report-filter-v6{display:grid;grid-template-columns:1fr auto;margin:0 0 8px;gap:7px}.period-tabs-v6{grid-column:1/-1;display:grid;grid-template-columns:repeat(4,1fr);width:100%}.period-tab-v6{min-width:0;height:44px;font-size:13.5px;padding:0}.report-range-trigger-v6{min-width:0;width:100%;height:44px;justify-content:flex-start}.report-range-trigger-v6 b{font-size:13px}.report-view-btn-v6{height:44px!important;min-height:44px!important;padding:0 12px!important}.report-range-popover-v6{position:fixed;left:10px;right:10px;top:auto;bottom:84px;width:auto;max-height:75vh;overflow:auto;border-radius:12px;z-index:85}.range-inputs-v6{grid-template-columns:1fr 1fr}.range-inputs-v6>span{display:none}.range-inputs-v6 input{height:44px;font-size:15px}.range-presets-v6 button{height:44px;font-size:13.5px}.range-actions-v6 .btn{flex:1}.report-metrics-v6{grid-template-columns:1fr 1fr;gap:7px}.report-metric-v6{min-height:112px;padding:12px}.report-metric-v6>span{font-size:10px}.report-metric-v6>strong{font-size:18px;margin:14px 0 8px}.report-metric-v6>div{font-size:10.5px}.payment-breakdown-v6{border:1px solid #dce6ec!important;border-radius:9px!important;margin:0 0 8px!important}.payment-breakdown-v6 .panel-heading,.report-chart-panel-v6 .panel-heading,.report-table-panel-v6 .panel-heading,.report-day-orders-v6 .panel-heading,.day-payment-panel-v6 .panel-heading{padding:11px 12px}.payment-breakdown-v6 .panel-heading h2,.report-chart-panel-v6 .panel-heading h2,.report-table-panel-v6 .panel-heading h2,.report-day-orders-v6 .panel-heading h2,.day-payment-panel-v6 .panel-heading h2{font-size:14px}.payment-breakdown-v6 .panel-heading p,.report-chart-panel-v6 .panel-heading p,.report-table-panel-v6 .panel-heading p{font-size:11px}.payment-breakdown-v6 .panel-heading>strong{font-size:15px}.payment-method-grid-v6{grid-template-columns:1fr 1fr;padding:10px;gap:7px}.payment-method-grid-v6>div{padding:10px}.payment-method-grid-v6 p{font-size:11.5px}.payment-method-grid-v6 strong{font-size:13.5px}.report-main-grid-v6{display:flex;flex-direction:column;gap:8px}.report-main-grid-v6>.panel{width:100%;border:1px solid #dce6ec!important;border-radius:9px!important;margin:0!important}.report-chart-panel-v6{order:1}.report-table-panel-v6{order:2}.chart-legend-v6{display:none}.report-chart-wrap-v6{height:330px;padding:3px 2px 0}.desktop-report-table-v6{display:none}.mobile-report-list-v6{display:block;padding:8px}.mobile-report-card-v6{display:block;border:1px solid #e0e8ed;border-radius:8px;padding:11px;margin-bottom:8px;background:#fff}.mobile-report-date-v6{display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #edf2f5;padding-bottom:8px;margin-bottom:8px}.mobile-report-date-v6 b{display:block;font-size:14px;color:#354c5d}.mobile-report-date-v6 small{display:block;color:#8b9aa5;font-size:11.5px;margin-top:2px}.mobile-report-date-v6>span{font-size:24px;color:#9badb8}.mobile-report-values-v6{display:grid;grid-template-columns:1fr 1fr;gap:8px}.mobile-report-values-v6>div{background:#f8fbfd;border-radius:6px;padding:8px 9px}.mobile-report-values-v6 span{display:block;color:#7a8d9a;font-size:10.5px}.mobile-report-values-v6 strong{display:block;color:#334b5d;font-size:13px;margin-top:2px}.report-day-page-v6 .report-head-v6>.btn{display:none}.back-link-v6{font-size:12.5px}.report-day-metrics-v6{grid-template-columns:1fr 1fr;gap:7px}.report-day-metrics-v6>div{padding:11px}.report-day-metrics-v6 span{font-size:10.5px}.report-day-metrics-v6 strong{font-size:15px}.report-day-orders-v6,.day-payment-panel-v6{border:1px solid #dce6ec!important;border-radius:9px!important;margin:0 0 8px!important}.day-order-list-v6{padding:0 9px}.day-order-v6{grid-template-columns:32px minmax(0,1fr) auto 12px;gap:7px;padding:11px 0}.day-order-icon-v6{width:30px;height:30px}.day-order-main-v6>b{font-size:11.5px}.day-order-main-v6>strong{font-size:13.5px}.day-order-main-v6>small{font-size:10.5px}.day-order-money-v6>strong{font-size:13.5px}.day-order-money-v6 .badge{font-size:10px;padding:3px 5px}.day-order-arrow-v6{font-size:19px}
}
.debt-payments-day-v6{padding:0;margin-bottom:10px}.debt-payments-day-v6 .panel-heading{padding:12px 14px;border-bottom:1px solid #e5edf2;display:flex;justify-content:space-between;align-items:center;gap:12px}.debt-payments-day-v6 .panel-heading h2{font-size:14px;margin:0;color:#40596c}.debt-payments-day-v6 .panel-heading p{font-size:10.5px;color:#8b9ba7;margin:2px 0 0}.debt-payments-day-v6 .panel-heading>strong{color:#178f68;font-size:16px}.debt-payment-list-day-v6{padding:0 12px}.debt-payment-list-day-v6>a{display:grid;grid-template-columns:minmax(0,1fr) auto 16px;gap:10px;align-items:center;padding:11px 2px;border-bottom:1px solid #e9eff3}.debt-payment-list-day-v6>a:hover{background:#f8fcff}.debt-payment-list-day-v6 b{font-size:11.5px;color:#1687d1}.debt-payment-list-day-v6 span{display:block;color:#3f5668;font-size:12.5px;margin:2px 0}.debt-payment-list-day-v6 small{display:block;color:#8c9ba6;font-size:10px}.debt-payment-list-day-v6>a>strong{font-size:13.5px;color:#178f68}.debt-payment-list-day-v6 i{font-style:normal;font-size:20px;color:#9caab4}
@media(max-width:767px){.debt-payments-day-v6{border:1px solid #dce6ec!important;border-radius:9px!important;margin:0 0 8px!important}.debt-payments-day-v6 .panel-heading{padding:11px 12px}.debt-payments-day-v6 .panel-heading h2{font-size:14px}.debt-payments-day-v6 .panel-heading p{font-size:11px}.debt-payment-list-day-v6{padding:0 9px}.debt-payment-list-day-v6>a{padding:10px 0}.debt-payment-list-day-v6 b{font-size:12px}.debt-payment-list-day-v6 span{font-size:13px}.debt-payment-list-day-v6 small{font-size:10.5px}.debt-payment-list-day-v6>a>strong{font-size:13.5px}}

/* ===== Spa Sakura CRM v0.7 - Sổ quỹ Thu/Chi ===== */
.cashbook-page-v7{margin:0}.cashbook-head-v7{display:flex;justify-content:space-between;align-items:flex-end;gap:16px;margin:4px 0 12px}.cashbook-head-v7 .eyebrow{font-size:10.5px;color:#1788d3;font-weight:750;letter-spacing:.07em}.cashbook-head-v7 h1{font-size:23px;margin:2px 0 3px;color:#334b5d}.cashbook-head-v7 p{margin:0;color:#8394a1;font-size:12px}.cashbook-head-actions-v7{display:flex;gap:7px;align-items:center}.income-btn-v7{background:#16a36f!important;border-color:#16a36f!important;color:#fff!important}.expense-btn-v7{background:#ef5a52!important;border-color:#ef5a52!important;color:#fff!important}
.cashbook-filter-v7{display:grid;grid-template-columns:auto 145px 145px 150px 155px 190px minmax(230px,1fr) auto;gap:7px;padding:9px;margin-bottom:9px;align-items:end}.cashbook-filter-v7 select,.cashbook-filter-v7 input{border:1px solid #cddae4;border-radius:6px;background:#fff;height:40px;padding:0 10px;color:#4d6273;min-width:0}.cashbook-periods-v7{display:flex;border:1px solid #cddae4;border-radius:6px;overflow:hidden;height:40px}.cashbook-period-v7{border:0;border-right:1px solid #dbe5eb;background:#fff;color:#52687a;padding:0 15px;cursor:pointer;font-weight:650}.cashbook-period-v7:last-child{border-right:0}.cashbook-period-v7.active{background:#168fe0;color:#fff}.cashbook-date-v7{display:grid;grid-template-columns:auto 1fr;gap:6px;align-items:center;margin:0!important;color:#81919d;font-size:10px}.cashbook-date-v7 input{width:100%}.cashbook-search-v7{position:relative}.cashbook-search-v7 span{position:absolute;left:11px;top:8px;color:#91a1ad;font-size:19px}.cashbook-search-v7 input{width:100%;padding-left:34px}
.cashbook-metrics-v7{display:grid;grid-template-columns:repeat(4,1fr);gap:9px;margin-bottom:9px}.cash-metric-v7{min-height:118px;border-radius:8px;padding:14px 16px;color:#fff;box-shadow:var(--shadow);position:relative;overflow:hidden}.cash-metric-v7:after{content:"";position:absolute;width:90px;height:90px;border-radius:50%;right:-28px;top:-31px;background:rgba(255,255,255,.12)}.cash-metric-v7 span{font-size:10.5px;font-weight:750;letter-spacing:.035em}.cash-metric-v7 strong{display:block;font-size:23px;margin:18px 0 8px;font-weight:730}.cash-metric-v7 small{display:block;font-size:10.5px;opacity:.9}.cash-metric-v7.income{background:linear-gradient(135deg,#1aa981,#0a8f69)}.cash-metric-v7.expense{background:linear-gradient(135deg,#f0645b,#e74c45)}.cash-metric-v7.net{background:linear-gradient(135deg,#258bd5,#1874bd)}.cash-metric-v7.net.negative{background:linear-gradient(135deg,#e6695c,#c84b44)}.cash-metric-v7.outside{background:linear-gradient(135deg,#7254ce,#5c42b8)}
.cashbook-methods-v7,.cashbook-ledger-v7{padding:0;margin-bottom:9px;overflow:hidden}.cashbook-methods-v7 .panel-heading,.cashbook-ledger-v7 .panel-heading{display:flex;justify-content:space-between;align-items:center;padding:11px 14px;border-bottom:1px solid #e4edf3;gap:12px}.cashbook-methods-v7 .panel-heading h2,.cashbook-ledger-v7 .panel-heading h2{font-size:14px;margin:0;color:#40596b}.cashbook-methods-v7 .panel-heading p,.cashbook-ledger-v7 .panel-heading p{font-size:10.5px;color:#8b9ba7;margin:2px 0 0}.cashbook-methods-v7 .panel-heading>strong{font-size:17px;color:#178d68}.cashbook-method-grid-v7{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;padding:11px 13px}.cashbook-method-grid-v7>div{border:1px solid #e0e8ed;border-radius:7px;padding:11px 12px;background:#fbfdfe;display:grid;grid-template-columns:9px 1fr auto;align-items:center;gap:8px}.cashbook-method-grid-v7 i{width:8px;height:8px;border-radius:50%}.cashbook-method-grid-v7 i.cash{background:#7b61d1}.cashbook-method-grid-v7 i.bank{background:#1c9dc1}.cashbook-method-grid-v7 i.card{background:#e1588c}.cashbook-method-grid-v7 i.cod{background:#f5a538}.cashbook-method-grid-v7 span{font-size:11.5px;color:#607586}.cashbook-method-grid-v7 strong{font-size:13.5px;color:#334b5d}.cashbook-method-grid-v7 strong.negative{color:#db4c45}.cashbook-note-v7{font-size:10.5px;color:#7e8f9b;border-top:1px solid #edf2f5;background:#fafcfd;padding:8px 13px}.cashbook-auto-note-v7{font-size:10.5px;color:#78909f;background:#edf7fd;padding:5px 8px;border-radius:5px}
.cashbook-table-v7{max-height:520px}.cashbook-table-v7 table{font-size:11px}.cashbook-table-v7 th{position:sticky;top:0;z-index:2;background:#f8fbfd;color:#617687;font-size:10.5px;padding:10px 8px}.cashbook-table-v7 td{padding:10px 8px;color:#536b7d;vertical-align:middle}.cashbook-table-v7 td b{color:#3c5364}.cashbook-table-v7 td small.auto-tag-v7{display:block;width:max-content;margin-top:3px;color:#1688d1;background:#e9f6ff;border-radius:4px;padding:2px 5px;font-size:8.5px}.cashbook-desc-v7{max-width:280px;overflow:hidden;text-overflow:ellipsis}.cash-type-v7{display:inline-block;min-width:43px;text-align:center;padding:4px 6px;border-radius:4px;font-size:9px;font-weight:800;letter-spacing:.04em}.cash-type-v7.income{background:#def6ec;color:#16815d}.cash-type-v7.expense{background:#ffe4e2;color:#cb463f}.cashbook-amount-v7{font-weight:750;text-align:right}.cashbook-amount-v7.income{color:#168f68}.cashbook-amount-v7.expense{color:#e04d45}.cashbook-actions-v7{text-align:center}.cashbook-actions-v7 a{display:grid;place-items:center;width:27px;height:27px;border-radius:5px;background:#edf6fc;color:#1688d1;font-size:17px}.cashbook-actions-v7 a:hover{background:#dff0fb}.mobile-cashbook-v7{display:none}.cashbook-pagination-v7{display:flex;justify-content:space-between;align-items:center;padding:10px 13px;border-top:1px solid #e9eff3;color:#80919e;font-size:11px}.cashbook-pagination-v7>div{display:flex;gap:6px}
.cashbook-modal-card-v7{background:#fff;width:min(620px,96vw);border-radius:10px;box-shadow:0 22px 60px rgba(18,49,74,.25);overflow:hidden}.cashbook-modal-card-v7 .modal-head{display:flex;justify-content:space-between;align-items:flex-start;padding:15px 17px;border-bottom:1px solid #e3ebf0}.cashbook-modal-card-v7 .modal-head .eyebrow{font-size:9.5px;color:#1688d1;font-weight:750;letter-spacing:.07em}.cashbook-modal-card-v7 .modal-head h2{font-size:18px;margin:2px 0 0;color:#354d5f}.cashbook-modal-card-v7 .modal-head button{border:0;background:transparent;font-size:25px;color:#7c8b95;cursor:pointer}.cashbook-modal-card-v7 form{padding:14px 17px 16px}.cashbook-type-switch-v7{display:grid;grid-template-columns:1fr 1fr;gap:7px;margin-bottom:12px}.cashbook-type-switch-v7 label{margin:0!important}.cashbook-type-switch-v7 input{position:absolute;opacity:0;pointer-events:none}.cashbook-type-switch-v7 span{display:flex;align-items:center;justify-content:center;height:42px;border:1px solid #d5e1e8;border-radius:6px;font-weight:700;color:#617586;cursor:pointer;background:#fff}.cashbook-type-switch-v7 input[value="income"]:checked+span{background:#e8f8f2;border-color:#64c5a4;color:#167e5c}.cashbook-type-switch-v7 input[value="expense"]:checked+span{background:#fff0ef;border-color:#f08f88;color:#c74640}.cashbook-form-grid-v7{display:grid;grid-template-columns:1fr 1fr;gap:9px 10px}.cashbook-form-grid-v7 label{margin:0!important;display:grid;gap:5px;color:#637788;font-size:11.5px}.cashbook-form-grid-v7 label.wide{grid-column:1/-1}.cashbook-form-grid-v7 input,.cashbook-form-grid-v7 select,.cashbook-form-grid-v7 textarea{width:100%;border:1px solid #cfdce5;border-radius:6px;padding:9px 10px;background:#fff;color:#3d5364;min-height:40px}.cashbook-form-grid-v7 textarea{resize:vertical;min-height:76px}.modal-actions-v7{display:flex;justify-content:flex-end;gap:7px;margin-top:13px}.ghost-danger-v7{margin-right:auto;background:#fff!important;color:#d54d45!important;border-color:#efaaa5!important}

@media(max-width:1250px){.cashbook-filter-v7{grid-template-columns:auto 1fr 1fr 1fr 1fr}.cashbook-filter-v7 .cashbook-search-v7{grid-column:1/5}.cashbook-filter-v7>button.btn{grid-column:5}.cashbook-filter-v7 select[name="category"]{grid-column:auto}.cashbook-metrics-v7{grid-template-columns:1fr 1fr}.cashbook-method-grid-v7{grid-template-columns:1fr 1fr}}
@media(max-width:767px){
  .cashbook-page-v7{margin:0}.cashbook-head-v7{align-items:flex-start;margin:0 0 8px}.cashbook-head-v7 .eyebrow{font-size:10px}.cashbook-head-v7 h1{font-size:21px}.cashbook-head-v7 p{display:none}.cashbook-head-actions-v7{gap:5px}.cashbook-head-actions-v7 .btn{font-size:12px;padding:8px 9px;min-height:40px}.cashbook-head-actions-v7 .btn.soft{display:none}.cashbook-filter-v7{display:grid;grid-template-columns:1fr 1fr;padding:8px;gap:7px;border-radius:9px;margin-bottom:8px}.cashbook-periods-v7{grid-column:1/-1;display:grid;grid-template-columns:repeat(4,1fr);height:44px}.cashbook-period-v7{padding:0;font-size:13px}.cashbook-date-v7{grid-template-columns:1fr;gap:2px}.cashbook-date-v7 input{height:44px;font-size:14px}.cashbook-filter-v7 select{height:44px;font-size:13px}.cashbook-filter-v7 select[name="category"]{grid-column:1/-1}.cashbook-search-v7{grid-column:1/-1}.cashbook-search-v7 input{height:44px;font-size:14px}.cashbook-filter-v7>button.btn{grid-column:1/-1;height:44px}.cashbook-metrics-v7{grid-template-columns:1fr 1fr;gap:7px}.cash-metric-v7{min-height:110px;padding:12px}.cash-metric-v7 span{font-size:9.5px}.cash-metric-v7 strong{font-size:18px;margin:14px 0 7px}.cash-metric-v7 small{font-size:9.5px;line-height:1.4}.cashbook-methods-v7,.cashbook-ledger-v7{border:1px solid #dce6ec!important;border-radius:9px!important;margin:0 0 8px!important}.cashbook-methods-v7 .panel-heading,.cashbook-ledger-v7 .panel-heading{padding:11px 12px}.cashbook-methods-v7 .panel-heading h2,.cashbook-ledger-v7 .panel-heading h2{font-size:14px}.cashbook-methods-v7 .panel-heading p,.cashbook-ledger-v7 .panel-heading p{font-size:10.5px}.cashbook-auto-note-v7{display:none}.cashbook-method-grid-v7{grid-template-columns:1fr 1fr;padding:9px;gap:7px}.cashbook-method-grid-v7>div{grid-template-columns:8px 1fr;padding:9px}.cashbook-method-grid-v7 strong{grid-column:2;font-size:13px}.cashbook-method-grid-v7 span{font-size:11.5px}.cashbook-note-v7{font-size:10px;line-height:1.4}.desktop-cashbook-v7{display:none}.mobile-cashbook-v7{display:block;padding:8px}.cashbook-row-mobile-v7{border:1px solid #e0e8ed;border-left:4px solid #17a272;border-radius:8px;padding:10px;margin-bottom:8px;background:#fff}.cashbook-row-mobile-v7.expense{border-left-color:#ef5d54}.cashbook-row-top-v7{display:flex;justify-content:space-between;gap:8px;align-items:flex-start}.cashbook-row-top-v7>div{display:flex;align-items:center;gap:7px;min-width:0}.cashbook-row-top-v7 b{font-size:13px;color:#3d5364;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.cashbook-row-top-v7>strong{font-size:13.5px;color:#168d68;white-space:nowrap}.cashbook-row-mobile-v7.expense .cashbook-row-top-v7>strong{color:#dc4f47}.cashbook-row-info-v7{display:grid;grid-template-columns:1fr 1fr;gap:5px 8px;margin-top:8px;color:#7c8e9a;font-size:10.5px}.cashbook-row-mobile-v7 p{font-size:11.5px;color:#5d7180;background:#f8fbfd;border-radius:5px;padding:7px 8px;margin:8px 0 0}.cashbook-row-actions-v7{display:flex;justify-content:flex-end;margin-top:8px}.cashbook-row-actions-v7 a{font-size:11.5px;color:#1688d1;font-weight:650}.cashbook-pagination-v7{padding:9px}.cashbook-modal-card-v7{width:calc(100vw - 18px);max-height:86vh;overflow:auto;border-radius:12px}.cashbook-modal-card-v7 .modal-head{padding:13px 14px}.cashbook-modal-card-v7 .modal-head h2{font-size:17px}.cashbook-modal-card-v7 form{padding:12px 14px 14px}.cashbook-type-switch-v7 span{height:44px;font-size:13px}.cashbook-form-grid-v7{grid-template-columns:1fr}.cashbook-form-grid-v7 label.wide{grid-column:auto}.cashbook-form-grid-v7 input,.cashbook-form-grid-v7 select{height:44px;font-size:14px}.cashbook-form-grid-v7 textarea{font-size:14px}.modal-actions-v7{position:sticky;bottom:-14px;background:#fff;padding-top:9px}.modal-actions-v7 .btn{min-height:42px}.cashbook-mobile-empty-v7{padding:34px 12px;text-align:center;color:#8d9da8}
}
.report-head-actions-v7{display:flex;gap:7px;align-items:center}.report-head-actions-v7 .btn.soft{background:#fff;color:#177fb8;border-color:#cddce6}
@media(max-width:767px){.report-head-actions-v7{gap:5px}.report-head-actions-v7 .btn{padding:8px 9px!important;font-size:12px!important;min-height:40px!important}.report-head-actions-v7 .btn.soft{display:inline-flex!important}}
@media(min-width:1101px){.quick-actions-grid{grid-template-columns:repeat(5,1fr)}.quick-actions-grid a:nth-child(5){background:linear-gradient(135deg,#7a54c6,#6546b5)}}
@media(max-width:767px){.quick-actions-grid a:nth-child(5){grid-column:1/-1}}

/* ========================================================================
   Spa Sakura CRM v0.7.2 — SalonHero Flat UI
   Mục tiêu: bố cục quen thuộc SalonHero, màu phẳng, không gradient/đổ bóng.
   ======================================================================== */
:root{
  --blue:#1595df;--blue2:#147fae;--header:#147fae;--header-active:#0f6f99;
  --bg:#edf3f7;--line:#cbd9e3;--line-soft:#dfe8ee;--text:#34495e;--muted:#778b9a;
  --teal:#28a99d;--orange:#ffa726;--red:#ef4b42;--purple:#ab47bc;--green:#7cb342;
  --shadow:none!important;
}
body.salonhero-ui{margin:0;background:var(--bg);color:var(--text);font-family:"Segoe UI",Roboto,Arial,sans-serif;font-size:13px;line-height:1.42}
body.salonhero-ui *,body.salonhero-ui *:before,body.salonhero-ui *:after{box-shadow:none!important;background-image:none!important}
body.salonhero-ui .ui-icon{display:inline-block;flex:0 0 auto;vertical-align:-3px}
body.salonhero-ui .topbar{height:52px;background:var(--header);padding:0 10px;gap:0;border:0;color:#fff;position:sticky;top:0;z-index:90}
body.salonhero-ui .brand{height:52px;display:flex;align-items:center;font-size:14px;font-weight:800;letter-spacing:.4px;padding-right:10px;white-space:nowrap}
body.salonhero-ui .brand strong{color:#fff}
body.salonhero-ui .brand span{background:#ff5538;color:#fff;border-radius:1px;padding:2px 5px;margin-left:3px;font-size:13px}
body.salonhero-ui .desktop-nav{display:flex;height:52px;align-items:stretch}
body.salonhero-ui .desktop-nav a{height:52px;padding:0 11px;display:flex;align-items:center;gap:6px;color:#fff;font-size:13px;font-weight:600;border:0}
body.salonhero-ui .desktop-nav a:hover,body.salonhero-ui .desktop-nav a.active{background:var(--header-active)}
body.salonhero-ui .top-actions{margin-left:auto;display:flex;align-items:center;height:52px;gap:0}
body.salonhero-ui .branch-pill,body.salonhero-ui .user-pill,body.salonhero-ui .logout-link{height:52px;display:flex;align-items:center;gap:6px;padding:0 10px;color:#fff;border:0;background:transparent;border-radius:0}
body.salonhero-ui .branch-pill:hover,body.salonhero-ui .user-pill:hover,body.salonhero-ui .logout-link:hover{background:var(--header-active)}
body.salonhero-ui .user-avatar-mini{width:32px;height:32px;border:2px solid rgba(255,255,255,.85);border-radius:50%;display:grid;place-items:center;background:#6f8799;color:#fff;font-size:12px;font-weight:700}
body.salonhero-ui .mobile-title{display:none}
body.salonhero-ui .page-shell{padding:10px 8px 84px;max-width:none;margin:0}

/* Flat foundation */
body.salonhero-ui .panel,body.salonhero-ui .dashboard-panel,body.salonhero-ui .pos-order-panel,body.salonhero-ui .catalog-v4,
body.salonhero-ui .customer-list-panel-v5,body.salonhero-ui .customer-profile-panel-v5,body.salonhero-ui .customer-activity-panel-v5,
body.salonhero-ui .report-filter-v6,body.salonhero-ui .report-chart-panel-v6,body.salonhero-ui .report-table-panel-v6,
body.salonhero-ui .cashbook-filter-v7,body.salonhero-ui .cashbook-methods-v7,body.salonhero-ui .cashbook-ledger-v7{
  background:#fff;border:1px solid var(--line)!important;border-radius:2px!important;box-shadow:none!important
}
body.salonhero-ui .btn{min-height:36px;border:1px solid #bfd0dc;border-radius:2px;background:#fff;color:#526b7d;padding:7px 12px;font:600 13px/1.2 inherit;display:inline-flex;align-items:center;justify-content:center;gap:6px;cursor:pointer}
body.salonhero-ui .btn:hover{background:#f3f8fb;border-color:#9eb9ca}
body.salonhero-ui .btn.primary{background:var(--blue);border-color:var(--blue);color:#fff}
body.salonhero-ui .btn.primary:hover{background:#1187cf;border-color:#1187cf}
body.salonhero-ui .btn.soft{background:#fff;color:#337dad;border-color:#b7cfde}
body.salonhero-ui .btn.danger{background:#ef4b2f;border-color:#ef4b2f;color:#fff}
body.salonhero-ui .btn.danger-soft{background:#fff;color:#df553d;border-color:#e6a292}
body.salonhero-ui input,body.salonhero-ui select,body.salonhero-ui textarea,
body.salonhero-ui .filterbar input,body.salonhero-ui .filterbar select,body.salonhero-ui label input,body.salonhero-ui label select,body.salonhero-ui label textarea{
  border:1px solid #bfcfda!important;border-radius:2px!important;background:#fff;color:#405769;font-family:inherit;font-size:13px;outline:0
}
body.salonhero-ui input:focus,body.salonhero-ui select:focus,body.salonhero-ui textarea:focus{border-color:#42a5e8!important}
body.salonhero-ui .page-head{min-height:42px;margin:0 0 8px;padding:0 6px;display:flex;align-items:center;border-bottom:1px solid var(--line-soft)}
body.salonhero-ui .page-head h1{font-size:18px;font-weight:600;color:#4c6374;margin:0}
body.salonhero-ui .page-head p{font-size:11px;color:#8999a5;margin:2px 0 0}
body.salonhero-ui .eyebrow{font-size:10px;font-weight:700;color:#178fd4;letter-spacing:.02em}
body.salonhero-ui .panel-heading{border-bottom:1px solid var(--line-soft);padding:9px 11px;background:#fff}
body.salonhero-ui .panel-heading h2{font-size:14px!important;color:#51697b!important;font-weight:600!important;margin:0!important}
body.salonhero-ui .panel-heading p{font-size:10.5px!important;color:#8a99a5!important;margin:1px 0 0!important}
body.salonhero-ui table{border-collapse:collapse;background:#fff}
body.salonhero-ui th{background:#f6f9fb!important;color:#60788a!important;font-weight:600!important;border-bottom:1px solid var(--line)!important}
body.salonhero-ui td{border-bottom:1px solid #e3ebf0!important;color:#50697b}
body.salonhero-ui .click-row:hover td{background:#edf8fe!important}
body.salonhero-ui .badge{border-radius:1px;padding:3px 6px;font-size:11px}
body.salonhero-ui .badge.completed{background:#63aa2d;color:#fff}
body.salonhero-ui .badge.debt{background:#e84b45;color:#fff}
body.salonhero-ui .badge.processing{background:#f0a51f;color:#fff}
body.salonhero-ui .badge.cancelled{background:#8795a0;color:#fff}
body.salonhero-ui .alert{border-radius:2px;border:1px solid transparent;margin:0 0 8px}
body.salonhero-ui .alert.success{background:#e9f8ec;border-color:#b9e1c1;color:#25843a}
body.salonhero-ui .alert.error{background:#fff0ef;border-color:#f0c2bd;color:#bd4135}

/* Dashboard — close to SalonHero visual hierarchy */
body.salonhero-ui .dashboard-welcome{display:flex;align-items:center;justify-content:space-between;background:#fff;border:1px solid var(--line);padding:8px 10px;margin-bottom:8px}
body.salonhero-ui .dashboard-welcome h1{font-size:17px;color:#4b6274;margin:1px 0}
body.salonhero-ui .dashboard-welcome p{font-size:11px;color:#8698a5;margin:0}
body.salonhero-ui .dashboard-actions{display:flex;gap:6px}
body.salonhero-ui .hero-metrics{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-bottom:8px}
body.salonhero-ui .hero-metric{min-height:118px;border:0!important;border-radius:0!important;padding:12px 14px;color:#fff;display:flex;align-items:flex-start;gap:11px;position:relative;overflow:hidden}
body.salonhero-ui .hero-metric:after{display:none!important}
body.salonhero-ui .hero-metric.metric-blue{background:var(--teal)!important}
body.salonhero-ui .hero-metric.metric-orange{background:var(--orange)!important}
body.salonhero-ui .hero-metric.metric-red{background:var(--red)!important}
body.salonhero-ui .metric-icon{width:34px;height:34px;border:0;border-radius:0;background:rgba(255,255,255,.12);display:grid;place-items:center;color:#fff}
body.salonhero-ui .hero-metric span{font-size:13px;font-weight:700;color:#fff}
body.salonhero-ui .hero-metric strong{display:block;font-size:25px;color:#fff;margin:12px 0 4px;font-weight:600}
body.salonhero-ui .hero-metric small{font-size:11px;color:#fff}
body.salonhero-ui .quick-actions-grid{display:grid;grid-template-columns:repeat(5,1fr)!important;gap:8px;margin-bottom:8px}
body.salonhero-ui .quick-actions-grid>a,body.salonhero-ui .quick-actions-grid>a:nth-child(5){min-height:88px;background:var(--purple)!important;color:#fff;border:0!important;border-radius:0!important;padding:11px 12px;display:flex;align-items:center;gap:10px}
body.salonhero-ui .quick-actions-grid>a:hover{background:#9a3daa!important}
body.salonhero-ui .quick-icon{width:42px;height:42px;border:0;border-radius:0;background:rgba(255,255,255,.14);display:grid;place-items:center;color:#fff}
body.salonhero-ui .quick-actions-grid b{display:block;color:#fff;font-size:13px}
body.salonhero-ui .quick-actions-grid small{display:block;color:rgba(255,255,255,.92);font-size:10px;margin-top:3px}
body.salonhero-ui .dashboard-grid{display:grid;grid-template-columns:minmax(0,1.7fr) minmax(320px,.8fr);gap:8px;margin-bottom:8px}
body.salonhero-ui .dashboard-panel{padding:0!important;margin:0!important}
body.salonhero-ui .dashboard-order-row{border-bottom:1px solid #e2eaf0;padding:9px 10px}
body.salonhero-ui .order-mini-icon{background:#e7f4fb!important;color:#168ed1!important;border-radius:50%!important}
body.salonhero-ui .payment-breakdown>div{border-bottom:1px solid #e4ebef;padding:8px 11px}
body.salonhero-ui .management-mini-grid{display:grid;grid-template-columns:1fr 1fr;gap:1px;background:#fff;padding:0}
body.salonhero-ui .management-mini-grid>a{background:var(--green)!important;color:#fff!important;border:0!important;border-radius:0!important;min-height:74px;padding:10px;display:flex;flex-direction:column;justify-content:center}
body.salonhero-ui .management-mini-grid>a strong,body.salonhero-ui .management-mini-grid>a span{color:#fff!important}
body.salonhero-ui .latest-customers{padding:8px;display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:#e5edf2}
body.salonhero-ui .latest-customer-card{background:#fff;border:0!important;border-radius:0!important;padding:9px}

/* Order list */
body.salonhero-ui .filterbar{background:#eaf2f7;border:1px solid var(--line);border-radius:0;padding:7px;margin-bottom:7px;gap:6px}
body.salonhero-ui .status-tabs{border:1px solid var(--line);border-radius:0;background:#fff;margin-bottom:7px;gap:0}
body.salonhero-ui .status-tabs a{border-right:1px solid var(--line);padding:9px 15px;color:#5a7182}
body.salonhero-ui .status-tabs a.active{background:var(--blue);color:#fff}
body.salonhero-ui .mini-stats{gap:7px;margin-bottom:7px}
body.salonhero-ui .mini-stats>div{border:1px solid var(--line);border-radius:0;padding:9px 11px;background:#fff}
body.salonhero-ui .mini-stats span{font-size:10.5px}.salonhero-ui .mini-stats strong{font-size:17px}

/* POS */
body.salonhero-ui .pos-pagebar{display:flex;align-items:center;justify-content:space-between;background:#fff;border:1px solid var(--line);min-height:45px;padding:6px 9px;margin-bottom:8px}
body.salonhero-ui .pos-title{display:flex;align-items:center;gap:8px}
body.salonhero-ui .pos-title-icon{color:#597184;background:transparent!important;width:auto;height:auto}
body.salonhero-ui .pos-title h1{font-size:17px;color:#50677a;margin:0}.salonhero-ui .pos-title p{font-size:10px;margin:1px 0 0;color:#8a99a4}
body.salonhero-ui .pos-page-actions{display:flex;gap:6px}
body.salonhero-ui .pos-grid-v4{display:grid;grid-template-columns:1fr 1fr;gap:8px}
body.salonhero-ui .pos-order-panel,body.salonhero-ui .catalog-v4{padding:0!important;overflow:hidden}
body.salonhero-ui .pos-panel-titlebar{min-height:43px;padding:7px 10px;border-bottom:1px solid var(--line);background:#fff;border-radius:0!important}
body.salonhero-ui .pos-panel-title h2{font-size:14px;color:#536b7c;font-weight:600}
body.salonhero-ui .pos-panel-titlebar .badge{background:var(--blue);color:#fff}
body.salonhero-ui .pos-customer-section{padding:9px 10px;border-bottom:1px solid var(--line-soft);background:#fff}
body.salonhero-ui .customer-selector-button{min-height:48px;border:1px solid #bfcfda;border-radius:2px;background:#fff}
body.salonhero-ui .customer-selector-avatar{background:#eff5f8;color:#7890a0;border-radius:50%}
body.salonhero-ui .customer-add-btn{border-radius:2px!important}
body.salonhero-ui .customer-dropdown-v4{border:1px solid #a9c5d7;border-radius:2px;background:#fff}
body.salonhero-ui .customer-option:hover,body.salonhero-ui .customer-option.active{background:#dff4fb}
body.salonhero-ui .selected-customer-summary{background:#e7f6fc;border:1px solid #c1e2f0;border-radius:0;padding:7px 9px}
body.salonhero-ui .order-meta-strip{background:#fff;border-bottom:1px solid #e1e9ee;padding:7px 10px}
body.salonhero-ui .cart-table-head{background:#f5f9fb;border-bottom:1px solid var(--line);padding:7px 10px}
body.salonhero-ui .cart-empty-v4{background:#eaf7fb;border:0;border-radius:0;min-height:155px;margin:0 10px 8px}
body.salonhero-ui .cart-row{border-bottom:1px solid #e2eaf0;padding:8px 10px;margin:0}
body.salonhero-ui .invoice-bottom-area{border-top:1px solid var(--line);padding:9px 10px;background:#fff}
body.salonhero-ui .payment-grid-v4{gap:5px}.salonhero-ui .payment-box-v4{border:1px solid #c8d6df;border-radius:2px;background:#fff;padding:8px}
body.salonhero-ui .payment-box-v4:focus-within{border-color:#48a8e3;background:#f6fbfe}
body.salonhero-ui .totals-v4 .grand{border-top:1px solid var(--line);padding-top:8px}.salonhero-ui .totals-v4 .grand strong{color:#168fe0}
body.salonhero-ui .catalog-search-v4{margin:9px 9px 7px;border:1px solid #bfcfda;border-radius:18px;background:#fff;height:39px}
body.salonhero-ui .catalog-search-v4 input{border:0!important;background:transparent!important;height:37px}
body.salonhero-ui .catalog-tabs-v4{display:grid;grid-template-columns:repeat(3,1fr);gap:0;margin:0 9px 7px;border:1px solid var(--line)}
body.salonhero-ui .catalog-tabs-v4 button{height:38px;border:0;border-right:1px solid var(--line);border-radius:0;background:#fff;color:#5f7383;display:flex;align-items:center;justify-content:center;gap:6px}
body.salonhero-ui .catalog-tabs-v4 button:last-child{border-right:0}.salonhero-ui .catalog-tabs-v4 button.active{background:var(--blue);color:#fff}
body.salonhero-ui .catalog-category-wrap{padding:0 9px 7px;border-bottom:1px solid var(--line-soft)}
body.salonhero-ui .category-chip{border:1px solid #cbd8e0;border-radius:16px;background:#fff;color:#687d8c;padding:6px 12px}
body.salonhero-ui .category-chip.active{background:var(--blue);border-color:var(--blue);color:#fff}
body.salonhero-ui .catalog-list-v4{grid-template-columns:1fr 1fr;gap:7px;padding:8px 9px;max-height:60vh}
body.salonhero-ui .catalog-item-v4{border:1px solid #ccdae3;border-radius:2px;background:#fff;min-height:82px;padding:8px;grid-template-columns:54px 1fr auto auto}
body.salonhero-ui .catalog-item-v4:hover{border-color:#5cb2e5;background:#f6fbfe}
body.salonhero-ui .catalog-thumb{border-radius:0!important;background:#f5f7f9!important;color:#92a2ad!important}
body.salonhero-ui .catalog-copy b{color:#2189dd;font-size:12px}.salonhero-ui .catalog-copy small{font-size:10px;color:#98a5af}
body.salonhero-ui .catalog-price{color:#008f87;font-size:12px;font-weight:700}.salonhero-ui .catalog-add{color:#168fd9}

/* Customers — familiar 3-column CRM */
body.salonhero-ui .customer-page-head{background:#fff;border:1px solid var(--line);padding:7px 9px;margin-bottom:7px}
body.salonhero-ui .customer-page-head h1{font-size:17px;color:#526a7c}.salonhero-ui .customer-page-head p{font-size:10px;color:#8a99a5}
body.salonhero-ui .customer-summary-v5{display:grid;grid-template-columns:repeat(4,1fr);gap:0;background:#fff;border:1px solid var(--line);margin-bottom:7px}
body.salonhero-ui .customer-summary-v5>div{border-right:1px solid var(--line);border-radius:0!important;background:#fff!important;padding:8px 10px}.salonhero-ui .customer-summary-v5>div:last-child{border-right:0}
body.salonhero-ui .customer-summary-v5 span{font-size:10px;color:#718696}.salonhero-ui .customer-summary-v5 strong{font-size:18px;color:#536c7e}.salonhero-ui .customer-summary-v5 .debt-card strong{color:#df4a43}
body.salonhero-ui .customer-crm-layout-v5{display:grid;grid-template-columns:minmax(260px,33%) minmax(420px,42%) minmax(300px,25%);gap:7px}
body.salonhero-ui .customer-list-panel-v5,body.salonhero-ui .customer-profile-panel-v5,body.salonhero-ui .customer-activity-panel-v5{padding:0!important;overflow:hidden}
body.salonhero-ui .customer-search-v5{margin:8px;border:1px solid #bdced9;border-radius:18px;background:#fff;height:37px}
body.salonhero-ui .customer-search-v5 input{border:0!important;background:transparent!important;height:35px}
body.salonhero-ui .customer-list-title-v5{background:#f3f7fa;border-top:1px solid var(--line-soft);border-bottom:1px solid var(--line);padding:7px 9px}
body.salonhero-ui .customer-list-v5{max-height:650px}
body.salonhero-ui .customer-list-item-v5{border-bottom:1px solid #dbe5eb;padding:8px 10px;min-height:64px;border-radius:0!important}
body.salonhero-ui .customer-list-item-v5.active{background:#bdeff7!important;border-left:0!important}.salonhero-ui .customer-list-item-v5:hover{background:#eaf8fc}
body.salonhero-ui .customer-avatar-v5{border-radius:50%!important}
body.salonhero-ui .customer-profile-head-v5{padding:10px;border-bottom:1px solid var(--line)}
body.salonhero-ui .customer-kpis-v5{display:grid;grid-template-columns:repeat(4,1fr);gap:0;border-bottom:1px solid var(--line)}
body.salonhero-ui .customer-kpis-v5>div{background:#fff!important;border:0!important;border-right:1px solid var(--line-soft);border-radius:0!important;padding:9px}.salonhero-ui .customer-kpis-v5>div:last-child{border-right:0}
body.salonhero-ui .customer-info-section-v5{padding:10px}.salonhero-ui .customer-info-grid-v5{border-top:1px solid #e3ebf0}
body.salonhero-ui .customer-info-grid-v5>div{border-bottom:1px solid #e3ebf0;padding:8px 3px}
body.salonhero-ui .activity-tabs-v5,body.salonhero-ui .customer-mobile-tabs-v5{display:grid;grid-template-columns:repeat(3,1fr);gap:0;border-bottom:1px solid var(--line);background:#fff}
body.salonhero-ui .activity-tabs-v5 a,body.salonhero-ui .customer-mobile-tabs-v5 a{border-right:1px solid var(--line);border-radius:0!important;min-height:38px;display:flex;align-items:center;justify-content:center}
body.salonhero-ui .activity-tabs-v5 a.active,body.salonhero-ui .customer-mobile-tabs-v5 a.active{background:var(--blue);color:#fff}
body.salonhero-ui .customer-order-item-v5,body.salonhero-ui .money-card-v5,body.salonhero-ui .customer-debt-item-v5{border:0!important;border-bottom:1px solid #e0e8ed!important;border-radius:0!important;background:#fff!important;margin:0!important;padding:10px}
body.salonhero-ui .money-card-v5{border-left:4px solid #f3a328!important}
body.salonhero-ui .money-card-balance-v5{background:#f6fafc!important;border-radius:0!important}
body.salonhero-ui .debt-collect-v5{border-radius:0!important;background:#f7fafc!important}

/* Reports — SalonHero flat blocks */
body.salonhero-ui .report-head-v6,body.salonhero-ui .cashbook-head-v7{background:#fff;border:1px solid var(--line);padding:7px 9px;margin-bottom:7px}
body.salonhero-ui .report-head-v6 h1,body.salonhero-ui .cashbook-head-v7 h1{font-size:17px;color:#526a7c}.salonhero-ui .report-head-v6 p,.salonhero-ui .cashbook-head-v7 p{font-size:10px;color:#8799a6}
body.salonhero-ui .report-filter-v6,body.salonhero-ui .cashbook-filter-v7{padding:7px;margin-bottom:7px;background:#eaf2f7!important}
body.salonhero-ui .period-tabs-v6,body.salonhero-ui .cashbook-periods-v7{border:1px solid #bfcfda;border-radius:0!important;background:#fff;gap:0}
body.salonhero-ui .period-tab-v6,body.salonhero-ui .cashbook-period-v7{border:0!important;border-right:1px solid #cbd9e2!important;border-radius:0!important;background:#fff!important;color:#617788!important}
body.salonhero-ui .period-tab-v6.active,body.salonhero-ui .cashbook-period-v7.active{background:var(--blue)!important;color:#fff!important}
body.salonhero-ui .report-metrics-v6,body.salonhero-ui .cashbook-metrics-v7{display:grid;grid-template-columns:repeat(4,1fr);gap:7px;margin-bottom:7px}
body.salonhero-ui .report-metric-v6,body.salonhero-ui .cash-metric-v7{min-height:112px;border-radius:0!important;border:0!important;color:#fff;padding:12px 14px;overflow:hidden}
body.salonhero-ui .report-metric-v6:after,body.salonhero-ui .cash-metric-v7:after{display:none!important}
body.salonhero-ui .report-metric-v6.metric-sales-v6{background:#06a8e6!important}.salonhero-ui .report-metric-v6.metric-collected-v6{background:#3f51b5!important}.salonhero-ui .report-metric-v6.metric-debt-v6{background:#f44336!important}.salonhero-ui .report-metric-v6.metric-moneycard-v6{background:#d81b60!important}
body.salonhero-ui .cash-metric-v7.income{background:#06a8e6!important}.salonhero-ui .cash-metric-v7.expense{background:#f44336!important}.salonhero-ui .cash-metric-v7.net{background:#3f51b5!important}.salonhero-ui .cash-metric-v7.net.negative{background:#e64943!important}.salonhero-ui .cash-metric-v7.outside{background:#9c27b0!important}
body.salonhero-ui .report-metric-v6 span,body.salonhero-ui .cash-metric-v7 span{font-size:11px;color:#fff;font-weight:600}.salonhero-ui .report-metric-v6 strong,.salonhero-ui .cash-metric-v7 strong{font-size:22px;color:#fff;font-weight:600}.salonhero-ui .report-metric-v6 small,.salonhero-ui .cash-metric-v7 small{color:#fff}
body.salonhero-ui .report-main-grid-v6{gap:7px}.salonhero-ui .report-chart-panel-v6,.salonhero-ui .report-table-panel-v6{padding:0!important}
body.salonhero-ui .report-chart-wrap-v6{padding:10px;background:#fff}.salonhero-ui .chart-tooltip-v6{border:1px solid #abc5d5;border-radius:2px!important;background:#fff!important}
body.salonhero-ui .payment-breakdown-v6{background:#3f51b5!important;color:#fff;border-radius:0!important}.salonhero-ui .payment-breakdown-v6 *{color:#fff!important}
body.salonhero-ui .report-range-popover-v6{border:1px solid #a9c5d7;border-radius:2px!important;background:#fff!important}
body.salonhero-ui .range-presets-v6 button{border-radius:2px!important;background:#fff!important;border:1px solid #c8d7e0!important}.salonhero-ui .range-presets-v6 button:hover{background:#edf8fd!important}
body.salonhero-ui .cashbook-method-grid-v7>div{border-radius:0!important;background:#fff!important}
body.salonhero-ui .cashbook-auto-note-v7,body.salonhero-ui .cashbook-note-v7{border-radius:0!important}
body.salonhero-ui .cashbook-table-v7 th{background:#f5f9fb!important}

/* Settings/account */
body.salonhero-ui .settings-grid{gap:7px}.salonhero-ui .settings-grid>.panel{border-radius:2px!important}
body.salonhero-ui .account-card{border-radius:2px!important}

/* Modal/login */
body.salonhero-ui .modal{background:rgba(31,56,72,.42)}
body.salonhero-ui .modal-box,body.salonhero-ui .modal-box-v4,body.salonhero-ui .cashbook-modal-card-v7{border:1px solid #9fb9ca!important;border-radius:2px!important;background:#fff!important}
body.salonhero-ui .modal-heading,body.salonhero-ui .modal-head{border-bottom:1px solid var(--line)!important;background:#f7fafc!important}
body.salonhero-ui .modal-close{color:#607989}
.login-body{background:#1188cf!important;font-family:"Segoe UI",Roboto,Arial,sans-serif!important}
.login-card{border:1px solid #c7d7e1!important;border-radius:2px!important;box-shadow:none!important;padding:30px!important}
.login-logo{color:#263d4e!important;letter-spacing:.4px}.login-logo span{background:#ff5538!important;color:#fff!important;border-radius:1px!important;padding:2px 5px!important}
.login-card input{border-radius:2px!important}.login-card .btn{border-radius:2px!important;background:#1595df!important;border-color:#1595df!important}

/* Floating / mobile */
body.salonhero-ui .fab{background:#1595df;border-radius:50%;box-shadow:none!important}
body.salonhero-ui .mobile-nav{box-shadow:none!important}

@media(max-width:1180px){
  body.salonhero-ui .desktop-nav a{padding:0 8px;font-size:12px}.salonhero-ui .desktop-nav a .ui-icon{width:15px;height:15px}
  body.salonhero-ui .branch-pill span{display:none}.salonhero-ui .quick-actions-grid{grid-template-columns:repeat(3,1fr)!important}
}
@media(max-width:767px){
  body.salonhero-ui{background:#fff;font-size:15px;line-height:1.45}
  body.salonhero-ui .topbar{height:58px;justify-content:center;background:#0b87e8;padding:0 12px;border-bottom:0}
  body.salonhero-ui .brand,body.salonhero-ui .desktop-nav,body.salonhero-ui .top-actions{display:none!important}
  body.salonhero-ui .mobile-title{display:flex;align-items:center;justify-content:center;gap:5px;color:#fff;font-size:18px;font-weight:600}
  body.salonhero-ui .page-shell{padding:9px 8px calc(80px + env(safe-area-inset-bottom))}
  body.salonhero-ui .page-head,body.salonhero-ui .dashboard-welcome,body.salonhero-ui .pos-pagebar,body.salonhero-ui .report-head-v6,body.salonhero-ui .cashbook-head-v7{margin:0 0 7px;padding:8px;border:0;border-bottom:1px solid #dce5eb}
  body.salonhero-ui .page-head h1,body.salonhero-ui .dashboard-welcome h1,body.salonhero-ui .pos-title h1,body.salonhero-ui .report-head-v6 h1,body.salonhero-ui .cashbook-head-v7 h1{font-size:19px}
  body.salonhero-ui .page-head p,body.salonhero-ui .dashboard-welcome p,body.salonhero-ui .pos-title p{font-size:12px}
  body.salonhero-ui .btn{min-height:42px;font-size:14px;padding:8px 11px}
  body.salonhero-ui input,body.salonhero-ui select,body.salonhero-ui textarea{font-size:15px!important;min-height:44px}
  body.salonhero-ui .panel{border-left:0!important;border-right:0!important;border-radius:0!important;margin-left:-8px;margin-right:-8px}
  body.salonhero-ui .hero-metrics{grid-template-columns:1fr 1fr;gap:6px}.salonhero-ui .hero-metric{min-height:108px;padding:11px}.salonhero-ui .hero-metric:nth-child(3){grid-column:1/-1}.salonhero-ui .hero-metric span{font-size:12px}.salonhero-ui .hero-metric strong{font-size:20px;margin:9px 0 3px}.salonhero-ui .hero-metric small{font-size:11px}
  body.salonhero-ui .quick-actions-grid{grid-template-columns:1fr 1fr!important;gap:6px}.salonhero-ui .quick-actions-grid>a,.salonhero-ui .quick-actions-grid>a:nth-child(5){min-height:74px;padding:9px}.salonhero-ui .quick-actions-grid>a:nth-child(5){grid-column:1/-1}.salonhero-ui .quick-actions-grid b{font-size:13px}.salonhero-ui .quick-actions-grid small{font-size:11px}
  body.salonhero-ui .dashboard-grid{display:block}.salonhero-ui .dashboard-panel{margin-bottom:7px!important}.salonhero-ui .latest-customers{grid-template-columns:1fr}
  body.salonhero-ui .filterbar{margin:0 -8px 7px;padding:7px 8px;border-left:0;border-right:0;gap:6px}.salonhero-ui .status-tabs{margin:0 -8px 7px;border-left:0;border-right:0;overflow:auto}.salonhero-ui .status-tabs a{font-size:13px;padding:10px 12px}
  body.salonhero-ui .mini-stats{grid-template-columns:1fr 1fr;gap:5px}.salonhero-ui .mini-stats>div{padding:9px}.salonhero-ui .mini-stats strong{font-size:17px}
  body.salonhero-ui .pos-grid-v4{display:flex;flex-direction:column;gap:7px}.salonhero-ui .catalog-v4{order:-1}.salonhero-ui .pos-page-actions .btn.soft{display:none}.salonhero-ui .catalog-search-v4{height:44px}.salonhero-ui .catalog-search-v4 input{height:42px}.salonhero-ui .catalog-tabs-v4 button{height:44px;font-size:14px}.salonhero-ui .category-chip{font-size:12px;padding:7px 11px}.salonhero-ui .catalog-list-v4{grid-template-columns:1fr 1fr;gap:5px;max-height:none}.salonhero-ui .catalog-item-v4{min-height:105px;display:flex;flex-direction:column;align-items:flex-start;gap:5px}.salonhero-ui .catalog-price{margin-top:auto}.salonhero-ui .customer-selector-button{min-height:52px}
  body.salonhero-ui .customer-summary-v5{grid-template-columns:1fr 1fr}.salonhero-ui .customer-summary-v5>div:nth-child(2){border-right:0}.salonhero-ui .customer-summary-v5>div:nth-child(-n+2){border-bottom:1px solid var(--line)}
  body.salonhero-ui .customer-crm-layout-v5{display:block}.salonhero-ui .customer-list-panel-v5,.salonhero-ui .customer-profile-panel-v5,.salonhero-ui .customer-activity-panel-v5{margin-bottom:7px}.salonhero-ui .customer-list-v5{max-height:340px}.salonhero-ui .customer-kpis-v5{grid-template-columns:1fr 1fr}.salonhero-ui .customer-kpis-v5>div:nth-child(2){border-right:0}.salonhero-ui .customer-kpis-v5>div:nth-child(-n+2){border-bottom:1px solid var(--line)}
  body.salonhero-ui .report-metrics-v6,body.salonhero-ui .cashbook-metrics-v7{grid-template-columns:1fr 1fr;gap:5px}.salonhero-ui .report-metric-v6,.salonhero-ui .cash-metric-v7{min-height:105px;padding:10px}.salonhero-ui .report-metric-v6 strong,.salonhero-ui .cash-metric-v7 strong{font-size:18px}.salonhero-ui .report-metric-v6 span,.salonhero-ui .cash-metric-v7 span{font-size:11px}
  body.salonhero-ui .report-chart-panel-v6,body.salonhero-ui .report-table-panel-v6,body.salonhero-ui .cashbook-methods-v7,body.salonhero-ui .cashbook-ledger-v7{margin-left:-8px!important;margin-right:-8px!important;border-left:0!important;border-right:0!important}
  body.salonhero-ui .cashbook-method-grid-v7{grid-template-columns:1fr 1fr}
  body.salonhero-ui .modal{align-items:flex-end;padding:0}.salonhero-ui .modal-box,.salonhero-ui .modal-box-v4,.salonhero-ui .cashbook-modal-card-v7{width:100%;max-width:none;border-radius:0!important;border-left:0!important;border-right:0!important;border-bottom:0!important;max-height:90vh;overflow:auto}
  body.salonhero-ui .mobile-nav{position:fixed;display:grid!important;grid-template-columns:repeat(5,1fr)!important;bottom:0;left:0;right:0;background:#fff;border-top:1px solid #cfdbe3;z-index:100;padding-bottom:env(safe-area-inset-bottom)}
  body.salonhero-ui .mobile-nav a{height:66px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;color:#9a9fa5;font-size:11px;font-weight:500}
  body.salonhero-ui .mobile-nav a .ui-icon{width:22px;height:22px}.salonhero-ui .mobile-nav a.active{color:#0b87e8;font-weight:600;background:#fff}.salonhero-ui .mobile-nav a span{font-size:11px}
  body.salonhero-ui .fab{display:grid;right:14px;bottom:80px;width:54px;height:54px}
  .login-card{width:calc(100vw - 28px)!important;padding:25px 20px!important}.login-card h1{font-size:22px}.login-card p{font-size:13px}.login-card label{font-size:13px}.login-card input{min-height:46px;font-size:15px!important}.login-card .btn{min-height:46px;font-size:15px}
}

/* ===== Spa Sakura CRM v0.8 — Catalog, stock & money-card management ===== */
body.salonhero-ui .desktop-nav-dropdown-v8{position:relative;height:100%;display:flex;align-items:stretch}
body.salonhero-ui .desktop-nav-dropdown-v8>a{height:100%}
body.salonhero-ui .desktop-nav-menu-v8{display:none;position:absolute;top:100%;left:0;width:285px;background:#fff;border:1px solid #b9cbd6;z-index:140;padding:5px 0}
body.salonhero-ui .desktop-nav-dropdown-v8:hover .desktop-nav-menu-v8,body.salonhero-ui .desktop-nav-dropdown-v8:focus-within .desktop-nav-menu-v8{display:block}
body.salonhero-ui .desktop-nav-menu-v8>a{height:auto!important;min-height:54px!important;padding:8px 12px!important;background:#fff!important;color:#526b7d!important;border:0!important;border-bottom:1px solid #e3ebf0!important;display:flex!important;align-items:center!important;gap:10px!important}
body.salonhero-ui .desktop-nav-menu-v8>a:last-child{border-bottom:0!important}
body.salonhero-ui .desktop-nav-menu-v8>a:hover{background:#edf8fd!important;color:#168fd9!important}
body.salonhero-ui .desktop-nav-menu-v8>a>span{display:flex;flex-direction:column;gap:2px}.salonhero-ui .desktop-nav-menu-v8 b{font-size:12px;font-weight:600}.salonhero-ui .desktop-nav-menu-v8 small{font-size:10px;color:#8999a5;font-weight:400}

body.salonhero-ui .settings-home-head-v8{margin-bottom:7px}
body.salonhero-ui .settings-home-v8{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
body.salonhero-ui .settings-home-card-v8{background:#fff;border:1px solid #cbd8e0;min-height:108px;padding:16px;display:grid;grid-template-columns:42px 1fr 18px;align-items:center;gap:10px;color:#536b7d;text-decoration:none}
body.salonhero-ui .settings-home-card-v8:hover{border-color:#4ba9df;background:#f6fbfe}.salonhero-ui .settings-home-card-v8>.ui-icon{color:#178fd8}.salonhero-ui .settings-home-card-v8 div{display:flex;flex-direction:column;gap:5px}.salonhero-ui .settings-home-card-v8 b{font-size:15px}.salonhero-ui .settings-home-card-v8 span{font-size:11px;color:#8697a3}.salonhero-ui .settings-home-card-v8>strong{font-size:24px;font-weight:300;color:#9aa8b2}

body.salonhero-ui .catalog-admin-head-v8{height:54px;background:#fff;border:1px solid var(--line);margin-bottom:7px;padding:0 8px 0 10px;display:flex;align-items:center;justify-content:space-between;gap:12px}
body.salonhero-ui .catalog-admin-head-v8 h1{font-size:17px;color:#536a7b;font-weight:600;display:flex;align-items:center;gap:6px;margin:0}.salonhero-ui .catalog-head-actions-v8{display:flex;align-items:center;gap:6px}.salonhero-ui .catalog-head-actions-v8 .active-tab-v8{background:#18a2de;color:#fff;border-color:#18a2de}
body.salonhero-ui .catalog-admin-layout-v8{display:grid;grid-template-columns:325px minmax(0,1fr);gap:7px;min-height:calc(100vh - 145px)}
body.salonhero-ui .catalog-groups-v8,body.salonhero-ui .catalog-table-panel-v8{padding:0!important;overflow:hidden}
body.salonhero-ui .catalog-groups-v8{display:flex;flex-direction:column;min-height:650px}
body.salonhero-ui .catalog-side-title-v8{height:43px;border-bottom:1px solid var(--line);display:flex;align-items:center;gap:5px;padding:0 12px;color:#596f80;font-size:12px;font-weight:600}
body.salonhero-ui .catalog-group-list-v8{padding:8px;flex:1;overflow:auto}
body.salonhero-ui .catalog-group-list-v8>a,body.salonhero-ui .catalog-group-row-v8{min-height:44px;border-bottom:1px solid #e4ebef;display:flex;align-items:center;color:#657989}
body.salonhero-ui .catalog-group-list-v8>a{padding:0 12px;justify-content:space-between}.salonhero-ui .catalog-group-list-v8>a.active{background:#2196e2;color:#fff;border-bottom-color:#2196e2}
body.salonhero-ui .catalog-group-list-v8 b{font-size:10px;font-weight:500}.salonhero-ui .catalog-group-row-v8>a:first-child{padding:0 10px;flex:1;display:flex;align-items:center;justify-content:space-between;min-height:44px;color:inherit}.salonhero-ui .catalog-group-row-v8.active{background:#eef9fd;color:#168fd8}.salonhero-ui .catalog-group-row-v8 .group-edit-v8{width:34px;height:32px;display:grid;place-items:center;color:#8aa0af}
body.salonhero-ui .catalog-group-create-v8{border-top:1px solid var(--line);padding:8px;display:grid;grid-template-columns:1fr auto;gap:5px}.salonhero-ui .catalog-group-create-v8 input{height:38px;min-height:38px}.salonhero-ui .catalog-group-create-v8 .btn{min-height:38px;padding:6px 10px;font-size:11px}
body.salonhero-ui .catalog-delete-group-v8{border:0;background:transparent;color:#d84f49;font-size:11px;padding:0 10px 9px;cursor:pointer}

body.salonhero-ui .catalog-searchbar-v8{padding:7px;background:#f1f7fa;border-bottom:1px solid var(--line);display:grid;grid-template-columns:minmax(320px,1fr) 180px auto;gap:6px;align-items:center}
body.salonhero-ui .catalog-search-input-v8{height:39px;border:1px solid #bfcfd9;background:#fff;border-radius:18px;display:flex;align-items:center;padding:0 11px;gap:7px;color:#9aabb5}.salonhero-ui .catalog-search-input-v8 input{border:0!important;background:transparent!important;min-height:35px!important;height:35px!important;width:100%;padding:0!important;outline:0!important}
body.salonhero-ui .catalog-searchbar-v8 select{min-height:39px;height:39px}.salonhero-ui .catalog-searchbar-v8 .btn{min-height:39px;height:39px}
body.salonhero-ui .catalog-result-meta-v8{height:34px;padding:0 12px;display:flex;align-items:center;border-bottom:1px solid #e2e9ed;color:#7e8e99;font-size:11px}
body.salonhero-ui .catalog-table-wrap-v8{max-height:calc(100vh - 245px);overflow:auto}.salonhero-ui .catalog-table-v8{min-width:800px}.salonhero-ui .catalog-table-v8 th{position:sticky;top:0;z-index:2;background:#fff;border-bottom:1px solid #bcced9;color:#607686;font-size:11px;font-weight:500;height:42px}.salonhero-ui .catalog-table-v8 td{height:62px;border-bottom:1px solid #dfe7ec;font-size:11px;vertical-align:middle}
body.salonhero-ui .catalog-admin-thumb-v8{width:42px;height:42px;border:1px solid #d9e2e8;background:#f5f7f9;display:grid;place-items:center;color:#a4b1ba;overflow:hidden}.salonhero-ui .catalog-admin-thumb-v8 img{width:100%;height:100%;object-fit:cover}
body.salonhero-ui .catalog-name-link-v8{display:block;color:#168fe0;font-weight:600;font-size:12px;margin-bottom:3px}.salonhero-ui .catalog-table-v8 td small{display:block;color:#9aa6ae;font-size:10px}.salonhero-ui .catalog-sale-price-v8{color:#008f87!important;font-weight:700}.salonhero-ui .stock-link-v8{display:inline-flex;align-items:center;gap:4px;color:#4d6575}.salonhero-ui .stock-link-v8 span{color:#168fd9;font-size:10px}
body.salonhero-ui .catalog-status-v8,body.salonhero-ui .money-card-state-v8{display:inline-flex;min-height:22px;align-items:center;padding:2px 7px;color:#fff;font-size:10px;white-space:nowrap}.salonhero-ui .catalog-status-v8.active,.salonhero-ui .money-card-state-v8.active{background:#69a92e}.salonhero-ui .catalog-status-v8.inactive,.salonhero-ui .money-card-state-v8.closed{background:#858585}.salonhero-ui .money-card-state-v8.locked{background:#16a6b7}
body.salonhero-ui .catalog-row-actions-v8{display:flex;align-items:center;justify-content:flex-end;gap:4px;white-space:nowrap}.salonhero-ui .catalog-row-actions-v8 form{margin:0}.salonhero-ui .btn.tiny{min-height:30px;height:30px;padding:4px 8px;font-size:10px}.salonhero-ui .danger-soft-v8{background:#fff;color:#db554e;border:1px solid #e5aaa7}.salonhero-ui .success-soft-v8{background:#fff;color:#579426;border:1px solid #a8ca8c}.salonhero-ui .empty-table-v8{text-align:center!important;color:#8a9aa5!important;padding:30px!important}

body.salonhero-ui .catalog-modal-v8{z-index:500;background:rgba(20,39,51,.52);align-items:center;padding:26px}
body.salonhero-ui .catalog-modal-card-v8{width:min(790px,95vw);max-height:92vh;overflow:auto;background:#fff;border:1px solid #8faabd;border-radius:2px;box-shadow:none}
body.salonhero-ui .catalog-modal-title-v8{height:52px;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;padding:0 12px;color:#536a7c}.salonhero-ui .catalog-modal-title-v8 h2{font-size:17px;font-weight:500;margin:0}.salonhero-ui .catalog-modal-title-v8 p{margin:3px 0 0;font-size:10px;color:#8b9aa4}.salonhero-ui .catalog-modal-title-v8>a{font-size:25px;color:#6f7f88;font-weight:300;line-height:1}
body.salonhero-ui .catalog-modal-tabs-v8{height:49px;margin:9px 12px 0;display:flex;border-bottom:1px solid #cedae2}.salonhero-ui .catalog-modal-tabs-v8 span{min-width:260px;display:flex;align-items:center;justify-content:center;color:#7c898f;font-size:12px;border:1px solid transparent;border-bottom:0}.salonhero-ui .catalog-modal-tabs-v8 span.active{border-color:#c8d6df;background:#fff;color:#596d7a}
body.salonhero-ui .catalog-form-v8{padding:18px 34px 26px;display:grid;grid-template-columns:minmax(0,1fr) 132px;gap:22px}.salonhero-ui .catalog-form-fields-v8{display:grid;grid-template-columns:1fr;gap:9px}.salonhero-ui .catalog-form-fields-v8>label{display:grid;grid-template-columns:170px minmax(0,1fr);align-items:center;gap:10px;color:#65798a;font-size:11px}.salonhero-ui .catalog-form-fields-v8>label>span em{color:#ed4a40;font-style:normal}.salonhero-ui .catalog-form-fields-v8 input,.salonhero-ui .catalog-form-fields-v8 select{height:38px;min-height:38px}.salonhero-ui .catalog-form-fields-v8 textarea{min-height:100px}.salonhero-ui .catalog-description-v8{align-items:start!important}.salonhero-ui .capacity-fields-v8{display:grid;grid-template-columns:1fr 130px;gap:6px}
body.salonhero-ui .catalog-image-picker-v8{display:flex;flex-direction:column;align-items:center;gap:7px;color:#768895;font-size:11px}.salonhero-ui .catalog-image-preview-v8{width:112px;height:112px;border:1px dashed #c9d4dc;background:#fafbfc;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px;color:#c0c8ce;overflow:hidden}.salonhero-ui .catalog-image-preview-v8 img{width:100%;height:100%;object-fit:cover}.salonhero-ui .catalog-image-preview-v8 small{font-size:9px}.salonhero-ui .catalog-image-picker-v8 input[type=file]{font-size:10px;max-width:130px;min-height:auto!important}.salonhero-ui .catalog-image-picker-v8>b{color:#168fd9;font-size:10px;font-weight:500}
body.salonhero-ui .catalog-modal-footer-v8{min-height:57px;border-top:1px solid var(--line);padding:8px 12px;display:flex;align-items:center;justify-content:space-between;gap:10px;background:#fff}.salonhero-ui .catalog-modal-footer-v8>div{display:flex;gap:6px}.salonhero-ui .status-check-v8{display:flex;align-items:center;gap:6px;font-size:11px;color:#5f7382}.salonhero-ui .status-check-v8 input{min-height:auto!important;width:15px;height:15px}

body.salonhero-ui .stock-modal-card-v8{width:min(980px,96vw)}.salonhero-ui .stock-summary-v8{height:74px;padding:12px 18px;background:#eef8fc;border-bottom:1px solid #d1e2eb;display:flex;align-items:center;justify-content:space-between}.salonhero-ui .stock-summary-v8 span{font-size:12px;color:#657d8c}.salonhero-ui .stock-summary-v8 strong{font-size:24px;color:#008e88}
body.salonhero-ui .stock-adjust-form-v8{padding:12px;display:grid;grid-template-columns:190px 150px minmax(260px,1fr) auto;gap:7px;align-items:end;border-bottom:1px solid #dbe5eb}.salonhero-ui .stock-adjust-form-v8 label{font-size:10px;color:#6d8190}.salonhero-ui .stock-adjust-form-v8 input,.salonhero-ui .stock-adjust-form-v8 select{margin-top:4px;min-height:38px;height:38px}.salonhero-ui .stock-adjust-form-v8 .btn{min-height:38px;height:38px}.salonhero-ui .stock-history-v8 h3{font-size:13px;color:#596f7f;padding:11px 12px;margin:0;border-bottom:1px solid #e0e8ed}.salonhero-ui .stock-history-v8 table{min-width:760px}.salonhero-ui .stock-in-v8{color:#4f9a28!important;font-weight:600}.salonhero-ui .stock-out-v8{color:#e14a43!important;font-weight:600}

body.salonhero-ui .money-card-summary-v8{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-bottom:7px}.salonhero-ui .money-card-summary-v8>div{height:54px;background:#0ca8e5;color:#fff;padding:8px 12px;display:flex;align-items:center;justify-content:space-between}.salonhero-ui .money-card-summary-v8 span{font-size:10px;font-weight:600}.salonhero-ui .money-card-summary-v8 strong{font-size:17px;font-weight:600}.salonhero-ui .money-card-list-panel-v8{padding:0!important}.salonhero-ui .money-card-filter-v8{padding:8px;background:#f1f7fa;border-bottom:1px solid var(--line);display:grid;grid-template-columns:1fr 190px auto;gap:6px}.salonhero-ui .money-card-admin-table-v8{min-width:1050px}.salonhero-ui .money-card-admin-table-v8 th{height:40px;background:#fff;color:#617687;font-size:10px;font-weight:500}.salonhero-ui .money-card-admin-table-v8 td{height:65px;border-bottom:1px solid #dfe7ec;font-size:11px}.salonhero-ui .money-card-admin-table-v8 td small{display:block;color:#929fa8;font-size:10px;margin-top:3px}.salonhero-ui .money-card-admin-table-v8 td a{color:#168fd9}
body.salonhero-ui .card-types-panel-v8{padding:0!important}.salonhero-ui .card-types-head-v8{height:62px;padding:8px 12px;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between}.salonhero-ui .card-types-head-v8 h2{font-size:15px;color:#566e7f;margin:0}.salonhero-ui .card-types-head-v8 p{font-size:10px;color:#8a98a2;margin:4px 0 0}.salonhero-ui .card-type-modal-v8,.salonhero-ui .card-issue-modal-v8{width:min(650px,94vw)}.salonhero-ui .card-type-form-v8{padding:18px;display:grid;grid-template-columns:1fr 1fr;gap:10px}.salonhero-ui .card-type-form-v8 label{font-size:11px;color:#647988}.salonhero-ui .card-type-form-v8 label.wide{grid-column:1/-1}.salonhero-ui .card-type-form-v8 input,.salonhero-ui .card-type-form-v8 select,.salonhero-ui .card-type-form-v8 textarea{margin-top:4px}.salonhero-ui .card-type-form-v8 small{display:block;color:#8c9aa4;margin-top:4px;font-size:9px}

@media(max-width:1050px){
 body.salonhero-ui .catalog-admin-layout-v8{grid-template-columns:250px minmax(0,1fr)}
 body.salonhero-ui .catalog-form-fields-v8>label{grid-template-columns:135px minmax(0,1fr)}
}
@media(max-width:767px){
 body.salonhero-ui .settings-home-v8{grid-template-columns:1fr;gap:6px}.salonhero-ui .settings-home-card-v8{min-height:82px;padding:11px}
 body.salonhero-ui .catalog-admin-head-v8{height:auto;min-height:54px;margin:0 -8px 7px;padding:7px 8px;border-left:0;border-right:0}.salonhero-ui .catalog-admin-head-v8 h1{font-size:17px}.salonhero-ui .catalog-head-actions-v8 .btn.soft{display:none}.salonhero-ui .catalog-head-actions-v8 .btn{font-size:12px;min-height:38px}
 body.salonhero-ui .catalog-admin-layout-v8{display:block;min-height:0}.salonhero-ui .catalog-groups-v8{min-height:0;margin-bottom:7px!important}.salonhero-ui .catalog-side-title-v8{display:none}.salonhero-ui .catalog-group-list-v8{display:flex;overflow:auto;padding:7px;gap:5px}.salonhero-ui .catalog-group-list-v8>a,.salonhero-ui .catalog-group-row-v8{min-height:36px;border:1px solid #cbd7df;white-space:nowrap}.salonhero-ui .catalog-group-list-v8>a{padding:0 10px;gap:7px}.salonhero-ui .catalog-group-row-v8>a:first-child{min-height:34px;padding:0 9px}.salonhero-ui .catalog-group-row-v8 .group-edit-v8{display:none}.salonhero-ui .catalog-group-create-v8{display:none}
 body.salonhero-ui .catalog-table-panel-v8{margin-left:-8px!important;margin-right:-8px!important;border-left:0!important;border-right:0!important}.salonhero-ui .catalog-searchbar-v8{grid-template-columns:1fr 150px;padding:7px 8px}.salonhero-ui .catalog-searchbar-v8 .btn{grid-column:1/-1}.salonhero-ui .catalog-result-meta-v8{padding:0 8px}.salonhero-ui .catalog-table-wrap-v8{max-height:none;overflow:auto}.salonhero-ui .catalog-table-v8{min-width:820px}
 body.salonhero-ui .catalog-modal-v8{align-items:flex-end;padding:0}.salonhero-ui .catalog-modal-card-v8{width:100%;max-width:none;max-height:92vh;border-left:0;border-right:0;border-bottom:0}.salonhero-ui .catalog-modal-tabs-v8{overflow:auto}.salonhero-ui .catalog-modal-tabs-v8 span{min-width:180px}.salonhero-ui .catalog-form-v8{padding:14px 12px 20px;display:block}.salonhero-ui .catalog-form-fields-v8>label{grid-template-columns:1fr;gap:4px;margin-bottom:9px}.salonhero-ui .catalog-image-picker-v8{margin-top:15px}.salonhero-ui .catalog-image-preview-v8{width:120px;height:120px}.salonhero-ui .capacity-fields-v8{grid-template-columns:1fr 115px}.salonhero-ui .catalog-modal-footer-v8{position:sticky;bottom:0;z-index:3}.salonhero-ui .catalog-modal-footer-v8 .btn{min-height:40px}
 body.salonhero-ui .stock-adjust-form-v8{grid-template-columns:1fr 1fr;padding:10px}.salonhero-ui .stock-adjust-form-v8 .wide{grid-column:1/-1}.salonhero-ui .stock-adjust-form-v8 .btn{grid-column:1/-1}.salonhero-ui .stock-summary-v8 strong{font-size:20px}
 body.salonhero-ui .money-card-summary-v8{grid-template-columns:1fr;margin:0 -8px 7px;gap:1px}.salonhero-ui .money-card-summary-v8>div{height:50px}.salonhero-ui .money-card-list-panel-v8{margin-left:-8px!important;margin-right:-8px!important;border-left:0!important;border-right:0!important}.salonhero-ui .money-card-filter-v8{grid-template-columns:1fr}.salonhero-ui .money-card-admin-table-v8{min-width:900px}.salonhero-ui .card-type-form-v8{grid-template-columns:1fr;padding:12px}.salonhero-ui .card-type-form-v8 label.wide{grid-column:auto}
}
body.salonhero-ui .account-admin-links-v8{margin:16px -18px 0;border-top:1px solid #dce5eb}.salonhero-ui .account-admin-links-v8>a{min-height:48px;padding:0 15px;display:grid;grid-template-columns:28px 1fr auto;align-items:center;gap:7px;border-bottom:1px solid #e2e9ed;color:#5b7181}.salonhero-ui .account-admin-links-v8>a .ui-icon{color:#168fd9}.salonhero-ui .account-admin-links-v8>a b{font-size:20px;font-weight:300;color:#a1adb5}

/* ===== v0.9 Tài khoản, hồ sơ cá nhân & thông tin Spa ===== */
body.salonhero-ui .user-avatar-mini.has-image{padding:0;overflow:hidden;background:#fff}.salonhero-ui .user-avatar-mini.has-image img{width:100%;height:100%;object-fit:cover;display:block}
body.salonhero-ui .users-admin-head-v9,.salonhero-ui .spa-settings-head-v9{margin-bottom:7px}
body.salonhero-ui .users-panel-v9{padding:0!important;overflow:hidden}.salonhero-ui .users-filter-v9{display:grid;grid-template-columns:minmax(300px,1fr) 210px auto;gap:7px;padding:9px;border-bottom:1px solid #d8e2e8;background:#f0f7fa}.salonhero-ui .users-filter-v9 select{height:38px}.salonhero-ui .full-access-note-v9{min-height:42px;padding:7px 12px;display:flex;align-items:center;gap:8px;background:#e9f8fc;border-bottom:1px solid #cfe4ec;color:#557382;font-size:11px}.salonhero-ui .full-access-note-v9 .ui-icon{color:#08a9c6}.salonhero-ui .users-table-v9{min-width:1000px}.salonhero-ui .users-table-v9 th{height:38px;background:#fff;color:#657989;font-size:10px;font-weight:500}.salonhero-ui .users-table-v9 td{height:72px;border-top:1px solid #e0e8ed;font-size:11px;vertical-align:middle}.salonhero-ui .users-table-v9 td>b{display:block;color:#51697b}.salonhero-ui .users-table-v9 td small{display:block;margin-top:3px;color:#97a4ad;font-size:9px}.salonhero-ui .table-avatar-v9{width:42px;height:42px;border-radius:50%;display:inline-flex;align-items:center;justify-content:center;background:#23a3dc;color:#fff;font-weight:600;overflow:hidden}.salonhero-ui .table-avatar-v9 img{width:100%;height:100%;object-fit:cover}.salonhero-ui .user-status-v9{display:inline-block;padding:4px 8px;font-size:10px;color:#fff}.salonhero-ui .user-status-v9.active{background:#71b62d}.salonhero-ui .user-status-v9.locked{background:#77838a}
body.salonhero-ui .user-modal-card-v9{width:min(760px,95vw)}.salonhero-ui .user-form-v9{display:grid;grid-template-columns:minmax(0,1fr) 150px;gap:22px;padding:18px 22px 24px}.salonhero-ui .user-form-fields-v9{display:grid;gap:9px}.salonhero-ui .user-form-fields-v9 label{display:grid;grid-template-columns:165px minmax(0,1fr);align-items:center;gap:8px;font-size:11px;color:#62788a}.salonhero-ui .user-form-fields-v9 input{height:38px}.salonhero-ui .user-avatar-picker-v9{display:flex;flex-direction:column;align-items:center;gap:8px;font-size:10px;color:#6f8391;text-align:center}.salonhero-ui .user-modal-avatar-v9{width:95px;height:95px;border-radius:50%;display:flex;align-items:center;justify-content:center;background:#dfe7ec;color:#738894;font-size:30px;overflow:hidden}.salonhero-ui .user-modal-avatar-v9 img{width:100%;height:100%;object-fit:cover}.salonhero-ui .user-avatar-picker-v9 input{max-width:140px;font-size:9px;min-height:auto}
body.salonhero-ui .spa-settings-panel-v9{padding:0!important}.salonhero-ui .spa-settings-grid-v9{padding:12px 18px 24px;display:grid;grid-template-columns:minmax(0,1fr) 220px;gap:45px}.salonhero-ui .spa-settings-fields-v9{display:grid;grid-template-columns:1fr 1fr;gap:10px 18px}.salonhero-ui .spa-settings-fields-v9 label{display:grid;grid-template-columns:150px minmax(0,1fr);gap:8px;align-items:center;color:#617687;font-size:11px}.salonhero-ui .spa-settings-fields-v9 input{height:38px}.salonhero-ui .spa-logo-picker-v9{display:flex;flex-direction:column;align-items:center;gap:9px;color:#6f8190;font-size:10px;text-align:center}.salonhero-ui .spa-logo-preview-v9{width:120px;height:120px;border:1px dashed #cad5dd;background:#fafbfc;display:flex;align-items:center;justify-content:center;color:#c2cbd0;overflow:hidden}.salonhero-ui .spa-logo-preview-v9 img{width:100%;height:100%;object-fit:contain}.salonhero-ui .spa-logo-picker-v9 input{font-size:9px;max-width:185px;min-height:auto}.salonhero-ui .spa-settings-save-v9{padding-right:18px}
body.salonhero-ui .account-layout-v9{display:grid;grid-template-columns:325px minmax(0,1fr);gap:10px;min-height:calc(100vh - 72px)}.salonhero-ui .account-sidebar-v9{padding:0!important;background:#f1f7fa}.salonhero-ui .account-identity-v9{height:270px;background:#fff;border-bottom:1px solid #d7e2e8;display:flex;flex-direction:column;align-items:center;justify-content:center}.salonhero-ui .account-avatar-large-v9{width:160px;height:160px;border-radius:50%;display:flex;align-items:center;justify-content:center;background:#24a6dd;color:#fff;font-size:52px;font-weight:500;overflow:hidden}.salonhero-ui .account-avatar-large-v9 img{width:100%;height:100%;object-fit:cover}.salonhero-ui .account-identity-v9 h2{margin:14px 0 3px;font-size:16px;color:#435d6e;font-weight:500}.salonhero-ui .account-identity-v9>span:last-child{font-size:10px;color:#8b99a2}.salonhero-ui .account-sidebar-v9 nav{padding-top:12px}.salonhero-ui .account-sidebar-v9 nav a{height:44px;padding:0 18px;display:flex;align-items:center;gap:10px;border-bottom:1px solid #dbe5eb;color:#4d6576;font-size:11px}.salonhero-ui .account-sidebar-v9 nav a.active{background:#2499dd;color:#fff}.salonhero-ui .account-main-v9{padding:0!important}.salonhero-ui .account-section-title-v9{min-height:56px;padding:11px 14px;border-bottom:1px solid #d7e2e8}.salonhero-ui .account-section-title-v9 h1{font-size:16px;font-weight:500;color:#536b7d;margin:0}.salonhero-ui .account-section-title-v9 p{font-size:10px;color:#8b9aa5;margin:4px 0 0}.salonhero-ui .account-profile-grid-v9{display:grid;grid-template-columns:minmax(0,1fr) 210px;gap:30px;padding:20px 26px}.salonhero-ui .account-profile-fields-v9{display:grid;grid-template-columns:1fr 1fr;gap:12px 18px}.salonhero-ui .account-profile-fields-v9 label{display:grid;gap:5px;font-size:10px;color:#62798a}.salonhero-ui .account-profile-fields-v9 input{height:40px}.salonhero-ui .account-access-v9{min-height:60px;border-top:1px solid #e1e8ed;padding:9px 0;display:flex;flex-direction:column;justify-content:center}.salonhero-ui .account-access-v9 span{font-size:10px;color:#82929e}.salonhero-ui .account-access-v9 b{margin-top:4px;color:#3d6c8a;font-size:11px}.salonhero-ui .account-access-v9 b.active{color:#64a82d}.salonhero-ui .account-avatar-upload-v9{display:flex;flex-direction:column;align-items:center;gap:9px;color:#697f8e;font-size:10px;text-align:center}.salonhero-ui .account-avatar-upload-preview-v9{width:130px;height:130px;border-radius:50%;display:flex;align-items:center;justify-content:center;background:#e1e8ed;color:#7b8e9a;font-size:42px;overflow:hidden}.salonhero-ui .account-avatar-upload-preview-v9 img{width:100%;height:100%;object-fit:cover}.salonhero-ui .account-avatar-upload-v9 input{font-size:9px;max-width:180px;min-height:auto}.salonhero-ui .account-form-actions-v9{height:58px;border-top:1px solid #d7e2e8;display:flex;align-items:center;justify-content:flex-end;padding:0 14px}.salonhero-ui .password-form-v9{max-width:620px;padding:22px;display:grid;gap:12px}.salonhero-ui .password-form-v9 label{display:grid;grid-template-columns:190px minmax(0,1fr);align-items:center;gap:10px;color:#62798a;font-size:11px}.salonhero-ui .password-form-v9 input{height:40px}.salonhero-ui .password-form-v9>div{display:flex;justify-content:flex-end;padding-top:6px}
@media(max-width:900px){body.salonhero-ui .spa-settings-fields-v9{grid-template-columns:1fr}.salonhero-ui .account-layout-v9{grid-template-columns:260px minmax(0,1fr)}.salonhero-ui .account-profile-fields-v9{grid-template-columns:1fr}}
@media(max-width:767px){body.salonhero-ui .users-filter-v9{grid-template-columns:1fr;padding:8px}.salonhero-ui .users-table-v9{min-width:920px}.salonhero-ui .full-access-note-v9{font-size:12px}.salonhero-ui .user-form-v9{display:block;padding:13px}.salonhero-ui .user-form-fields-v9 label{grid-template-columns:1fr;gap:4px;margin-bottom:9px}.salonhero-ui .user-avatar-picker-v9{margin-top:16px}.salonhero-ui .spa-settings-grid-v9{display:block;padding:12px}.salonhero-ui .spa-settings-fields-v9{display:block}.salonhero-ui .spa-settings-fields-v9 label{grid-template-columns:1fr;gap:4px;margin-bottom:10px;font-size:13px}.salonhero-ui .spa-logo-picker-v9{margin-top:18px}.salonhero-ui .account-layout-v9{display:block;margin:-1px -8px 0;min-height:0}.salonhero-ui .account-sidebar-v9{border-left:0!important;border-right:0!important}.salonhero-ui .account-identity-v9{height:auto;padding:20px 10px}.salonhero-ui .account-avatar-large-v9{width:100px;height:100px;font-size:36px}.salonhero-ui .account-sidebar-v9 nav{display:flex;padding:0;overflow:auto;background:#fff;border-top:1px solid #dce5ea}.salonhero-ui .account-sidebar-v9 nav a{min-width:max-content;height:46px;border-bottom:0;border-right:1px solid #dce5ea;font-size:13px}.salonhero-ui .account-main-v9{margin-top:8px;border-left:0!important;border-right:0!important}.salonhero-ui .account-profile-grid-v9{display:block;padding:14px}.salonhero-ui .account-profile-fields-v9{display:block}.salonhero-ui .account-profile-fields-v9 label{margin-bottom:10px;font-size:13px}.salonhero-ui .account-avatar-upload-v9{margin-top:18px}.salonhero-ui .password-form-v9{padding:14px}.salonhero-ui .password-form-v9 label{grid-template-columns:1fr;gap:4px;font-size:13px}}
body.salonhero-ui .brand-v9 img{max-width:142px;max-height:31px;object-fit:contain;display:block}

/* ===== Spa Sakura CRM v1.0 - stabilization, UX & security UI ===== */
body.salonhero-ui .customer-search-v5{
  position:relative!important;display:flex!important;align-items:center!important;height:40px!important;
  margin:8px!important;padding:0!important;border:1px solid #bdced9!important;border-radius:20px!important;background:#fff!important;overflow:hidden
}
body.salonhero-ui .customer-search-v5>.ui-icon{
  position:absolute!important;left:12px!important;top:50%!important;transform:translateY(-50%)!important;
  color:#718796!important;z-index:2!important;pointer-events:none!important;margin:0!important
}
body.salonhero-ui .customer-search-v5>span:not(.ui-icon){position:absolute!important;left:12px!important;top:50%!important;transform:translateY(-50%)!important;color:#718796!important}
body.salonhero-ui .customer-search-v5 input{
  display:block!important;width:100%!important;height:38px!important;min-height:38px!important;line-height:38px!important;
  margin:0!important;padding:0 38px 0 39px!important;border:0!important;background:transparent!important;border-radius:0!important;
  font-size:13px!important;color:#405769!important;box-shadow:none!important
}
body.salonhero-ui .customer-search-v5 input::placeholder{color:#8b9ba7;opacity:1}
body.salonhero-ui .customer-search-v5 input:focus{border:0!important;outline:0!important;box-shadow:none!important;background:transparent!important}
body.salonhero-ui .customer-search-v5>a{top:50%!important;transform:translateY(-50%)!important;right:6px!important}

/* Consistent icon/search alignment across modules */
body.salonhero-ui .catalog-search-input-v8 .ui-icon{flex:0 0 auto;color:#8296a4;margin:0}
body.salonhero-ui .catalog-search-input-v8 input{line-height:35px!important}
body.salonhero-ui .cashbook-search-v7{display:flex;align-items:center}
body.salonhero-ui .cashbook-search-v7>span{top:50%!important;transform:translateY(-50%)!important;line-height:1!important}

/* Loading state: prevents accidental double-click on financial/admin actions. */
body.salonhero-ui form.is-submitting{opacity:.82;pointer-events:none}
body.salonhero-ui .btn.is-loading{cursor:wait!important;opacity:.8!important}
body.salonhero-ui .btn.is-loading:before{content:"";width:12px;height:12px;border:2px solid currentColor;border-right-color:transparent;border-radius:50%;animation:sakura-spin-v10 .65s linear infinite}
@keyframes sakura-spin-v10{to{transform:rotate(360deg)}}

/* v1.0 backup */
body.salonhero-ui .backup-panel-v10{padding:0!important;max-width:920px;margin:0 auto}
body.salonhero-ui .backup-intro-v10{display:flex;align-items:center;gap:14px;padding:20px;border-bottom:1px solid var(--line)}
body.salonhero-ui .backup-icon-v10{width:56px;height:56px;display:grid;place-items:center;background:#eaf6fc;color:#178fd4;border:1px solid #cfe4ef}
body.salonhero-ui .backup-intro-v10 h2{margin:0 0 5px;font-size:16px;color:#4d6678;font-weight:600}
body.salonhero-ui .backup-intro-v10 p{margin:0;color:#7b8e9b;font-size:12px;line-height:1.55}
body.salonhero-ui .backup-meta-v10{display:grid;grid-template-columns:repeat(3,1fr);border-bottom:1px solid var(--line)}
body.salonhero-ui .backup-meta-v10>div{padding:15px 18px;border-right:1px solid var(--line)}
body.salonhero-ui .backup-meta-v10>div:last-child{border-right:0}
body.salonhero-ui .backup-meta-v10 span{display:block;color:#8798a4;font-size:10px;margin-bottom:5px}
body.salonhero-ui .backup-meta-v10 strong{font-size:14px;color:#496376;font-weight:600}
body.salonhero-ui .backup-warning-v10{margin:16px 18px;padding:11px 13px;background:#fff7df;border:1px solid #ecdba8;color:#756331;font-size:11px;line-height:1.5}
body.salonhero-ui .backup-actions-v10{display:flex;justify-content:flex-end;padding:0 18px 18px}

/* Small UX polish without changing the familiar SalonHero-flat structure. */
body.salonhero-ui input,body.salonhero-ui select,body.salonhero-ui textarea{caret-color:#168fd9}
body.salonhero-ui button:focus-visible,body.salonhero-ui a:focus-visible,body.salonhero-ui input:focus-visible,body.salonhero-ui select:focus-visible,body.salonhero-ui textarea:focus-visible{outline:2px solid #63b7e8!important;outline-offset:1px}
body.salonhero-ui .alert{transition:opacity .2s ease}
body.salonhero-ui .alert.is-hiding{opacity:0}

@media(max-width:767px){
  body.salonhero-ui .customer-search-v5{height:46px!important;border-radius:23px!important}
  body.salonhero-ui .customer-search-v5 input{height:44px!important;min-height:44px!important;line-height:44px!important;font-size:15px!important;padding-left:40px!important}
  body.salonhero-ui .customer-search-v5>.ui-icon{left:13px!important;width:18px!important;height:18px!important}
  body.salonhero-ui .backup-panel-v10{margin:0 -8px;border-left:0!important;border-right:0!important}
  body.salonhero-ui .backup-intro-v10{padding:15px 12px;align-items:flex-start}
  body.salonhero-ui .backup-icon-v10{width:46px;height:46px;flex:0 0 46px}
  body.salonhero-ui .backup-intro-v10 h2{font-size:15px}
  body.salonhero-ui .backup-intro-v10 p{font-size:12px}
  body.salonhero-ui .backup-meta-v10{grid-template-columns:1fr}
  body.salonhero-ui .backup-meta-v10>div{border-right:0;border-bottom:1px solid var(--line);padding:11px 12px}
  body.salonhero-ui .backup-meta-v10>div:last-child{border-bottom:0}
  body.salonhero-ui .backup-warning-v10{margin:12px}
  body.salonhero-ui .backup-actions-v10{padding:0 12px 14px}
  body.salonhero-ui .backup-actions-v10 .btn{width:100%;min-height:44px}
}

/* ===== Spa Sakura CRM v1.0.1 POS hotfix ===== */
/* HTML hidden attribute must win over component display rules. */
[hidden]{display:none!important}
body.salonhero-ui .catalog-category-row[hidden],
body.salonhero-ui .catalog-item-v4[hidden]{display:none!important}

/* POS search: align SVG icon and Vietnamese placeholder on one line. */
body.salonhero-ui .catalog-search-v4{position:relative;display:block}
body.salonhero-ui .catalog-search-v4 .ui-icon{position:absolute;left:12px;top:50%;transform:translateY(-50%);z-index:2;color:#6f8494;pointer-events:none;margin:0}
body.salonhero-ui .catalog-search-v4 input{display:block;box-sizing:border-box;padding:0 14px 0 39px!important;line-height:37px!important;vertical-align:middle}
body.salonhero-ui .catalog-search-v4 input::placeholder{line-height:normal;color:#8294a1;opacity:1}

/* Use uploaded item image when available, otherwise the same SVG icon set as the CRM. */
body.salonhero-ui .catalog-thumb{overflow:hidden}
body.salonhero-ui .catalog-thumb img{width:100%;height:100%;object-fit:cover;display:block}
body.salonhero-ui .catalog-thumb .ui-icon{width:24px;height:24px;display:block}

@media(max-width:760px){
 body.salonhero-ui .catalog-search-v4 input{line-height:42px!important;padding-left:40px!important}
 body.salonhero-ui .catalog-search-v4 .ui-icon{left:13px}
}


/* ===== Spa Sakura CRM v1.1 - Thanh toán & In hóa đơn ===== */
.payment-launch-v11{border-top:1px solid #d7e0e7;border-bottom:1px solid #d7e0e7;padding:11px 0;display:flex;align-items:center;justify-content:space-between;gap:12px;background:#fff}.payment-launch-v11>div:first-child{display:flex;flex-direction:column;gap:2px}.payment-launch-v11 b{color:#374f63}.payment-launch-v11 small{color:#7c8d9a}.payment-launch-v11>div:last-child{display:flex;align-items:center;gap:14px}.payment-launch-v11>div:last-child>span{display:flex;flex-direction:column;font-size:11px;color:#7a8994}.payment-launch-v11>div:last-child strong{font-size:14px;color:#147fae}.payment-launch-v11 #remainText.over{color:#e54b44}
.payment-modal-v11{z-index:90}.payment-modal-card-v11{position:relative;width:min(850px,calc(100vw - 30px));max-height:92vh;overflow:auto;background:#fff;border:1px solid #aebfcb;border-radius:2px}.payment-modal-card-v11>.modal-close{position:absolute;right:13px;top:10px;z-index:2}.payment-modal-head-v11{display:flex;justify-content:space-between;align-items:flex-end;gap:20px;padding:15px 20px;border-bottom:1px solid #d4dde4}.payment-modal-head-v11 h2{margin:0;color:#526b82;font-size:20px;font-weight:500}.payment-modal-head-v11 p{margin:4px 0 0;color:#84929d}.payment-modal-head-v11>strong{font-size:31px;color:#2196e5;font-weight:500;padding-right:28px}.payment-methods-v11{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;padding:16px 20px 10px}.payment-methods-v11 button{height:56px;border:1px solid #b9cbd8;background:#fff;display:grid;grid-template-columns:30px 1fr auto;align-items:center;gap:7px;padding:7px 11px;color:#526a7e;cursor:pointer;text-align:left}.payment-methods-v11 button:hover{border-color:#2196e5}.payment-methods-v11 button.active{background:#2196e5;border-color:#2196e5;color:#fff}.payment-methods-v11 button b{font-size:14px}.payment-methods-v11 button small{font-size:11px;color:inherit;white-space:nowrap}.pay-svg-v11{display:grid;place-items:center}.payment-editor-v11{display:grid;grid-template-columns:1fr 1fr;gap:14px;padding:8px 20px 14px}.payment-editor-v11 label,.money-card-fields-v11 label{font-size:12px;color:#5b7183;display:flex;flex-direction:column;gap:5px}.payment-amount-column-v11>small{display:block;color:#8795a0;margin-top:6px}.money-input.big-v11 input{height:42px;font-size:18px;text-align:right}.cash-tender-v11[hidden]{display:none!important}.cash-suggestions-v11{display:flex;gap:6px;flex-wrap:wrap;margin-top:7px}.cash-suggestions-v11 button{border:1px solid #c6d5df;background:#fff;color:#2389c9;padding:6px 9px;cursor:pointer}.cash-suggestions-v11 button:hover{background:#edf8ff}.money-card-section-v11{margin:14px 20px 0;border:1px solid #d3dfe7;background:#f7fbfd;padding:12px}.money-card-title-v11{display:flex;gap:9px;align-items:center;color:#37627f}.money-card-title-v11>div{display:flex;flex-direction:column}.money-card-title-v11 small{color:#81919d;font-size:11px}.money-card-fields-v11{display:grid;grid-template-columns:1.2fr .8fr;gap:12px;margin-top:10px}.money-card-fields-v11 select,.money-card-fields-v11 input{height:38px}.payment-transfer-qr-v11{margin:0 20px 14px;border:1px solid #b9d9ee;background:#f4fbff;padding:12px;display:grid;grid-template-columns:1fr 145px;grid-template-rows:auto 1fr;column-gap:16px}.payment-transfer-qr-v11[hidden]{display:none!important}.payment-transfer-qr-v11>div{display:flex;flex-direction:column}.payment-transfer-qr-v11>div small{color:#728895;margin-top:3px}.payment-transfer-qr-v11 img{grid-row:1/3;grid-column:2;width:145px;height:145px;object-fit:contain;background:#fff}.payment-transfer-qr-v11 p{display:flex;flex-direction:column;justify-content:flex-end;margin:8px 0 0;color:#557082}.payment-totals-v11{border-top:1px solid #d7e0e7;border-bottom:1px solid #d7e0e7;margin-top:2px;padding:10px 20px;display:grid;grid-template-columns:repeat(4,1fr);gap:14px}.payment-totals-v11>div{display:flex;flex-direction:column;color:#708391}.payment-totals-v11 b,.payment-totals-v11 strong{font-size:18px;color:#2f4f64;margin-top:3px}.payment-totals-v11 .change strong{font-size:28px;color:#2196e5;font-weight:500}.payment-note-v11{display:flex;flex-direction:column;gap:5px;padding:12px 20px;color:#667b8b}.payment-note-v11 textarea{resize:vertical}.payment-modal-footer-v11{display:flex;align-items:center;justify-content:space-between;padding:10px 20px;border-top:1px solid #d5dfe5;background:#f9fbfc}.payment-modal-footer-v11>div{display:flex;gap:8px}.soft-blue-v11{background:#5cb3ea!important;border-color:#5cb3ea!important}.page-head-actions-v11{display:flex;gap:8px}.print-settings-layout-v11{display:grid;grid-template-columns:1fr 1fr;gap:12px}.print-settings-form-v11{padding:18px 22px}.print-setting-row-v11{display:grid;grid-template-columns:1fr 1fr;gap:14px}.print-setting-row-v11 label,.print-bank-grid-v11 label,.wide-v11{display:flex;flex-direction:column;gap:6px;color:#5e7384}.print-setting-checks-v11{display:grid;grid-template-columns:1fr 1fr;gap:4px 28px;margin:18px 0}.print-setting-checks-v11 label,.print-qr-heading-v11 label{display:flex;align-items:center;gap:8px;min-height:32px}.print-setting-checks-v11 input,.print-qr-heading-v11 input{width:17px;height:17px}.wide-v11 textarea{resize:vertical}.print-qr-heading-v11{border-top:1px solid #d7e0e7;margin-top:18px;padding-top:14px;display:flex;justify-content:space-between;gap:15px}.print-qr-heading-v11 small{color:#84929b}.print-bank-grid-v11{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:12px}.print-settings-save-v11{margin:18px -22px -18px;padding:12px 22px}.print-preview-panel-v11{overflow:hidden}.print-preview-title-v11{text-align:center;font-size:18px;color:#526b82;padding:13px;border-bottom:1px solid #d7e0e7}.print-preview-stage-v11{background:#d9d9d9;padding:18px;height:690px;overflow:auto}.print-preview-receipt-v11{width:330px;max-width:100%;margin:0 auto;background:#fff;padding:18px 14px;font:12px/1.35 Arial,sans-serif;color:#344}.print-preview-receipt-v11 header{text-align:center}.print-preview-receipt-v11 header img{max-width:48px;max-height:48px}.print-preview-receipt-v11 header h2{margin:3px 0}.print-preview-receipt-v11 header p{margin:2px}.print-preview-receipt-v11 header>b{display:block;margin-top:15px;font-size:15px}.print-preview-receipt-v11 header small{display:block}.sample-meta-v11{display:grid;grid-template-columns:80px 1fr;gap:2px;margin-top:12px}.print-preview-receipt-v11 table{width:100%;border-collapse:collapse;margin-top:8px}.print-preview-receipt-v11 th,.print-preview-receipt-v11 td{border-top:1px dashed #555;border-bottom:1px dashed #555;padding:3px 1px;text-align:right}.print-preview-receipt-v11 th:first-child,.print-preview-receipt-v11 td:first-child{text-align:left}.sample-total-v11{display:grid;grid-template-columns:1fr auto;gap:4px;margin-top:6px}.sample-qr-v11{display:block;width:165px;margin:12px auto 4px}.print-preview-receipt-v11 footer{text-align:center;font-style:italic;margin-top:12px}.print-settings-form-v11 select:disabled{background:#f4f6f7;color:#788995}.payment-modal-v11 .payment-input[type=hidden]{display:none!important}
@media(max-width:900px){.print-settings-layout-v11{grid-template-columns:1fr}.print-preview-stage-v11{height:auto;max-height:700px}.payment-modal-card-v11{width:calc(100vw - 16px);max-height:94vh}.payment-methods-v11{grid-template-columns:1fr 1fr}.payment-editor-v11{grid-template-columns:1fr}.payment-totals-v11{grid-template-columns:1fr 1fr}.payment-launch-v11{align-items:flex-start;flex-direction:column}.payment-launch-v11>div:last-child{width:100%;justify-content:space-between;flex-wrap:wrap}.payment-transfer-qr-v11{grid-template-columns:1fr 125px}.payment-transfer-qr-v11 img{width:125px;height:125px}}
@media(max-width:560px){.payment-modal-head-v11{align-items:flex-start;flex-direction:column;padding:13px 14px}.payment-modal-head-v11>strong{font-size:25px;padding-right:0}.payment-methods-v11{padding:12px 14px 7px;gap:6px}.payment-methods-v11 button{grid-template-columns:26px 1fr;height:58px;padding:7px}.payment-methods-v11 button small{grid-column:2}.payment-editor-v11,.payment-note-v11{padding-left:14px;padding-right:14px}.money-card-section-v11{margin-left:14px;margin-right:14px}.money-card-fields-v11{grid-template-columns:1fr}.payment-totals-v11{padding:10px 14px;gap:8px}.payment-totals-v11 b,.payment-totals-v11 strong{font-size:16px}.payment-totals-v11 .change strong{font-size:22px}.payment-modal-footer-v11{padding:10px 14px;align-items:stretch;flex-direction:column}.payment-modal-footer-v11>div{display:grid;grid-template-columns:1fr 1fr}.payment-modal-footer-v11 .btn{min-height:44px}.payment-transfer-qr-v11{margin-left:14px;margin-right:14px;grid-template-columns:1fr}.payment-transfer-qr-v11 img{grid-column:1;grid-row:auto;margin:8px auto 0;width:160px;height:160px}.print-setting-row-v11,.print-bank-grid-v11,.print-setting-checks-v11{grid-template-columns:1fr}.print-preview-stage-v11{padding:10px}.print-preview-receipt-v11{width:100%}}

/* ===== Spa Sakura CRM v1.1.3 - Mobile responsive hotfix ===== */
@media (max-width:767px){
  /* Account: force the desktop two-column grid to collapse on phones. */
  body.salonhero-ui .account-layout-v9{
    display:block!important;
    grid-template-columns:none!important;
    width:100%!important;
    min-width:0!important;
    margin:0!important;
    min-height:0!important;
    overflow:visible!important;
  }
  body.salonhero-ui .account-sidebar-v9,
  body.salonhero-ui .account-main-v9{
    display:block!important;
    width:100%!important;
    min-width:0!important;
    max-width:100%!important;
    margin:0!important;
    border-left:0!important;
    border-right:0!important;
    overflow:hidden!important;
  }
  body.salonhero-ui .account-sidebar-v9{background:#fff!important}
  body.salonhero-ui .account-identity-v9{
    width:100%!important;
    height:auto!important;
    min-height:190px!important;
    padding:22px 12px 18px!important;
    box-sizing:border-box!important;
  }
  body.salonhero-ui .account-avatar-large-v9{width:104px!important;height:104px!important;font-size:38px!important}
  body.salonhero-ui .account-identity-v9 h2{font-size:18px!important;margin-top:12px!important}
  body.salonhero-ui .account-identity-v9>span:last-child{font-size:12px!important}
  body.salonhero-ui .account-sidebar-v9 nav{
    display:grid!important;
    grid-template-columns:minmax(0,1.15fr) minmax(0,1fr) 48px!important;
    width:100%!important;
    padding:0!important;
    overflow:visible!important;
    border-top:1px solid #dce5ea!important;
    border-bottom:1px solid #dce5ea!important;
    background:#fff!important;
  }
  body.salonhero-ui .account-sidebar-v9 nav a{
    min-width:0!important;
    width:100%!important;
    height:48px!important;
    padding:0 8px!important;
    justify-content:center!important;
    border-right:1px solid #dce5ea!important;
    border-bottom:0!important;
    white-space:nowrap!important;
    font-size:13px!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
  }
  body.salonhero-ui .account-sidebar-v9 nav a:nth-child(2){border-right:1px solid #dce5ea!important}
  body.salonhero-ui .account-sidebar-v9 nav a:last-child{
    display:flex!important;width:48px!important;min-width:48px!important;padding:0!important;font-size:0!important;gap:0!important
  }
  body.salonhero-ui .account-sidebar-v9 nav a:last-child .ui-icon{width:19px!important;height:19px!important}
  body.salonhero-ui .account-main-v9{margin-top:10px!important}
  body.salonhero-ui .account-section-title-v9{min-height:auto!important;padding:13px 14px!important}
  body.salonhero-ui .account-section-title-v9 h1{font-size:18px!important;line-height:1.25!important}
  body.salonhero-ui .account-section-title-v9 p{font-size:12px!important}
  body.salonhero-ui .account-profile-grid-v9{
    display:flex!important;
    flex-direction:column!important;
    grid-template-columns:none!important;
    width:100%!important;
    min-width:0!important;
    gap:14px!important;
    padding:14px!important;
  }
  body.salonhero-ui .account-profile-fields-v9{
    display:block!important;
    grid-template-columns:none!important;
    width:100%!important;
    min-width:0!important;
  }
  body.salonhero-ui .account-profile-fields-v9 label{
    display:grid!important;
    grid-template-columns:1fr!important;
    gap:6px!important;
    width:100%!important;
    min-width:0!important;
    margin:0 0 12px!important;
    font-size:13px!important;
  }
  body.salonhero-ui .account-profile-fields-v9 input,
  body.salonhero-ui .password-form-v9 input{
    display:block!important;
    width:100%!important;
    min-width:0!important;
    max-width:100%!important;
    height:46px!important;
    font-size:16px!important;
    box-sizing:border-box!important;
  }
  body.salonhero-ui .account-access-v9{min-height:54px!important;padding:10px 0!important}
  body.salonhero-ui .account-access-v9 span{font-size:12px!important}
  body.salonhero-ui .account-access-v9 b{font-size:14px!important}
  body.salonhero-ui .account-avatar-upload-v9{
    width:100%!important;
    max-width:100%!important;
    margin:0!important;
    padding-top:4px!important;
  }
  body.salonhero-ui .account-avatar-upload-preview-v9{width:92px!important;height:92px!important;font-size:32px!important}
  body.salonhero-ui .account-avatar-upload-v9 input{max-width:100%!important;width:100%!important;font-size:12px!important}
  body.salonhero-ui .account-form-actions-v9{
    position:sticky!important;
    bottom:calc(68px + env(safe-area-inset-bottom))!important;
    z-index:4!important;
    height:auto!important;
    padding:10px 14px!important;
    background:#fff!important;
  }
  body.salonhero-ui .account-form-actions-v9 .btn{width:100%!important;min-height:46px!important}
  body.salonhero-ui .password-form-v9{
    display:block!important;
    width:100%!important;
    max-width:none!important;
    min-width:0!important;
    padding:14px!important;
  }
  body.salonhero-ui .password-form-v9 label{
    display:grid!important;
    grid-template-columns:1fr!important;
    width:100%!important;
    min-width:0!important;
    gap:6px!important;
    margin-bottom:12px!important;
    font-size:13px!important;
  }
  body.salonhero-ui .password-form-v9>div{justify-content:stretch!important}
  body.salonhero-ui .password-form-v9>div .btn{width:100%!important;min-height:46px!important}

  /* Reports: on mobile the SalonHero blue wrapper was forcing all text white,
     including the white payment cards. Restore readable flat cards. */
  body.salonhero-ui .payment-breakdown-v6{
    background:#fff!important;
    color:#40596c!important;
    border:1px solid #dce6ec!important;
    border-radius:0!important;
    overflow:hidden!important;
  }
  body.salonhero-ui .payment-breakdown-v6 .panel-heading{
    background:#fff!important;
    color:#40596c!important;
  }
  body.salonhero-ui .payment-breakdown-v6 .panel-heading h2{color:#40596c!important;font-size:15px!important}
  body.salonhero-ui .payment-breakdown-v6 .panel-heading p{color:#8b9ba7!important;font-size:12px!important}
  body.salonhero-ui .payment-breakdown-v6 .panel-heading>strong{color:#168a67!important}
  body.salonhero-ui .payment-method-grid-v6{
    grid-template-columns:1fr 1fr!important;
    gap:8px!important;
    padding:10px!important;
    background:#f5f9fb!important;
  }
  body.salonhero-ui .payment-method-grid-v6>div{
    display:grid!important;
    grid-template-columns:12px minmax(0,1fr)!important;
    grid-template-rows:auto auto!important;
    column-gap:8px!important;
    row-gap:3px!important;
    align-items:center!important;
    min-width:0!important;
    min-height:78px!important;
    padding:11px 10px!important;
    border:1px solid #d6e2e9!important;
    border-radius:6px!important;
    background:#fff!important;
    color:#31495a!important;
  }
  body.salonhero-ui .payment-method-grid-v6 .pay-dot{
    grid-row:1/3!important;
    width:9px!important;
    height:9px!important;
  }
  body.salonhero-ui .payment-method-grid-v6 p{
    display:block!important;
    margin:0!important;
    color:#637989!important;
    font-size:12px!important;
    line-height:1.25!important;
    white-space:normal!important;
  }
  body.salonhero-ui .payment-method-grid-v6 strong{
    display:block!important;
    margin:0!important;
    color:#31495a!important;
    font-size:14px!important;
    line-height:1.25!important;
    white-space:nowrap!important;
  }
  body.salonhero-ui .report-empty-v6{
    min-height:180px!important;
    padding:60px 18px!important;
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    color:#8fa0ab!important;
    font-size:14px!important;
    line-height:1.5!important;
  }
  body.salonhero-ui .report-chart-panel-v6:has(.report-empty-v6) .panel-heading{border-bottom:1px solid #e5edf2!important}
  body.salonhero-ui .report-table-panel-v6 .report-empty-v6{min-height:90px!important;padding:28px 14px!important}

  /* Keep the mobile content inside the viewport without touching the POS layout. */
  body.salonhero-ui .account-layout-v9 *,
  body.salonhero-ui .report-page-v6 *{max-width:100%;box-sizing:border-box}
}

@media (max-width:430px){
  body.salonhero-ui .account-sidebar-v9 nav a{font-size:12.5px!important;padding:0 5px!important;gap:6px!important}
  body.salonhero-ui .payment-method-grid-v6>div{min-height:74px!important;padding:10px 8px!important}
  body.salonhero-ui .payment-method-grid-v6 strong{font-size:13px!important}
  body.salonhero-ui .report-empty-v6{min-height:150px!important;padding:45px 14px!important}
}


/* ===== Spa Sakura CRM v1.1.4 — POS tab polish + negative stock visibility ===== */
body.salonhero-ui .catalog-tabs-v4{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:0;
  margin:7px 10px 5px;
  padding:0;
  border:1px solid #cfdbe6;
  border-radius:3px;
  overflow:hidden;
  background:#fff;
}
body.salonhero-ui .catalog-tabs-v4 button{
  height:40px;
  min-height:40px;
  padding:0 10px;
  margin:0;
  border:0;
  border-right:1px solid #cfdbe6;
  border-radius:0;
  background:#fff;
  color:#5f6f82;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  font-size:13px;
  font-weight:600;
  line-height:1;
  box-shadow:none!important;
}
body.salonhero-ui .catalog-tabs-v4 button:last-child{border-right:0}
body.salonhero-ui .catalog-tabs-v4 button:hover{background:#f7fbff;color:#2f79bd}
body.salonhero-ui .catalog-tabs-v4 button.active{
  background:#4a90e2;
  color:#fff;
}
body.salonhero-ui .catalog-tabs-v4 button svg{width:15px;height:15px;flex:0 0 15px}
body.salonhero-ui .catalog-tabs-v4 button span{margin:0}
body.salonhero-ui .catalog-category-wrap{padding-top:4px}
body.salonhero-ui .stock-negative-v114,
body.salonhero-ui .stock-negative-v114 b,
body.salonhero-ui .catalog-copy small.stock-negative-v114{color:#e23d3d!important;font-weight:700}

@media(max-width:767px){
  body.salonhero-ui .catalog-tabs-v4{margin:6px 8px 4px}
  body.salonhero-ui .catalog-tabs-v4 button{height:42px;min-height:42px;padding:0 6px;font-size:13px;gap:6px}
  body.salonhero-ui .catalog-tabs-v4 button svg{width:15px;height:15px}
}


/* ===== Spa Sakura CRM v1.2 — Báo cáo & quản lý tồn kho ===== */
body.salonhero-ui .inventory-page-v12{display:flex;flex-direction:column;gap:8px}
body.salonhero-ui .inventory-head-v12{min-height:70px;background:#fff;border:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;gap:16px;padding:10px 14px}
body.salonhero-ui .inventory-head-v12 .eyebrow{font-size:10px;color:#168fd9;font-weight:700;letter-spacing:.4px}
body.salonhero-ui .inventory-head-v12 h1{margin:3px 0 2px;display:flex;align-items:center;gap:7px;color:#425d70;font-size:20px;font-weight:600}
body.salonhero-ui .inventory-head-v12 p{margin:0;color:#8b9aa5;font-size:11px}
body.salonhero-ui .inventory-head-actions-v12{display:flex;gap:6px;align-items:center}
body.salonhero-ui .inventory-metrics-v12{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:7px}
body.salonhero-ui .inventory-metrics-v12 article{background:#fff;border:1px solid #d2dfe7;min-height:92px;padding:12px 14px;display:flex;flex-direction:column;justify-content:center;border-top:3px solid #56a9df}
body.salonhero-ui .inventory-metrics-v12 article.ok{border-top-color:#24ae79}.salonhero-ui .inventory-metrics-v12 article.low{border-top-color:#f29b38}.salonhero-ui .inventory-metrics-v12 article.out{border-top-color:#9aa8b1}.salonhero-ui .inventory-metrics-v12 article.negative{border-top-color:#dc2456}
body.salonhero-ui .inventory-metrics-v12 span{font-size:10px;color:#6d8290;font-weight:700}.salonhero-ui .inventory-metrics-v12 strong{font-size:25px;color:#304f62;margin:5px 0 2px}.salonhero-ui .inventory-metrics-v12 small{font-size:10px;color:#9aa6ae}
body.salonhero-ui .inventory-panel-v12{padding:0;overflow:hidden}
body.salonhero-ui .inventory-filter-v12{display:grid;grid-template-columns:215px 230px minmax(280px,1fr) auto;gap:8px;align-items:end;padding:9px 10px;border-bottom:1px solid #d9e4eb;background:#f8fbfd}
body.salonhero-ui .inventory-filter-v12 label{display:flex;flex-direction:column;gap:4px;color:#677e8d;font-size:10px}.salonhero-ui .inventory-filter-v12 select{height:38px;background:#fff;border:1px solid #c5d5df;color:#3e596b;padding:0 9px}
body.salonhero-ui .inventory-branch-v12 b{height:38px;display:flex;align-items:center;padding:0 10px;background:#fff;border:1px solid #c5d5df;color:#168fd9;font-size:12px;font-weight:500}
body.salonhero-ui .inventory-search-v12{height:38px;border:1px solid #c5d5df;background:#fff;display:flex;align-items:center;gap:8px;padding:0 11px;color:#607789}
body.salonhero-ui .inventory-search-v12 input{border:0;outline:0;width:100%;height:100%;background:transparent;font-size:12px;color:#435e70}
body.salonhero-ui .inventory-tabs-v12{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));padding:8px 10px;gap:0;border-bottom:1px solid #dce6ec;background:#fff}
body.salonhero-ui .inventory-tabs-v12 a{height:38px;border:1px solid #cbd8e0;border-right:0;text-decoration:none;color:#465f70;background:#f7f9fb;display:flex;align-items:center;justify-content:center;gap:6px;font-size:11px;font-weight:600}.salonhero-ui .inventory-tabs-v12 a:last-child{border-right:1px solid #cbd8e0}.salonhero-ui .inventory-tabs-v12 a.active{background:#1597e5;color:#fff;border-color:#1597e5}.salonhero-ui .inventory-tabs-v12 a b{font-size:10px;font-weight:700;opacity:.85}
body.salonhero-ui .inventory-table-wrap-v12{max-height:calc(100vh - 390px);overflow:auto}.salonhero-ui .inventory-table-v12{width:100%;min-width:920px;border-collapse:collapse}.salonhero-ui .inventory-table-v12 th{position:sticky;top:0;z-index:2;background:#fff;color:#667b89;font-size:10px;font-weight:500;padding:10px 8px;border-bottom:1px solid #c8d6df;text-align:left}.salonhero-ui .inventory-table-v12 td{padding:8px;border-bottom:1px solid #e0e8ed;color:#566d7d;font-size:11px;vertical-align:middle}.salonhero-ui .inventory-table-v12 td a:not(.btn){color:#168fd9;text-decoration:none}.salonhero-ui .inventory-table-v12 td small{display:block;color:#9aa6ae;margin-top:3px}.salonhero-ui .inventory-thumb-v12{width:42px;height:42px;background:#f5f7f9;border:1px solid #e0e6ea;display:grid;place-items:center;color:#a8b4bc;overflow:hidden}.salonhero-ui .inventory-thumb-v12 img{width:100%;height:100%;object-fit:cover}
body.salonhero-ui .inventory-qty-v12{font-size:15px!important;font-weight:700}.salonhero-ui .inventory-qty-v12.in_stock{color:#159a70}.salonhero-ui .inventory-qty-v12.low{color:#e58b20}.salonhero-ui .inventory-qty-v12.out{color:#7f8f99}.salonhero-ui .inventory-qty-v12.negative{color:#dc2456}
body.salonhero-ui .inventory-status-v12{display:inline-flex;align-items:center;min-height:25px;padding:0 8px;border-radius:2px;font-size:10px;font-weight:600;background:#edf2f5;color:#697d89}.salonhero-ui .inventory-status-v12.in_stock{background:#e7f7f0;color:#198a67}.salonhero-ui .inventory-status-v12.low{background:#fff3e3;color:#d37613}.salonhero-ui .inventory-status-v12.out{background:#edf0f2;color:#687984}.salonhero-ui .inventory-status-v12.negative{background:#ffe8ef;color:#cb1f4d}
body.salonhero-ui .inventory-mobile-list-v12{display:none}
body.salonhero-ui .inventory-threshold-setting-v12{display:flex;align-items:center;justify-content:space-between;gap:18px;padding:12px 14px}.salonhero-ui .inventory-threshold-setting-v12 h2{margin:0 0 3px;color:#4b6272;font-size:14px}.salonhero-ui .inventory-threshold-setting-v12 p{margin:0;color:#8b99a3;font-size:10px}.salonhero-ui .inventory-threshold-setting-v12 form{display:flex;gap:6px;align-items:center}.salonhero-ui .inventory-threshold-setting-v12 input{width:100px;height:38px;border:1px solid #c8d7e0;padding:0 10px}
body.salonhero-ui .inventory-detail-summary-v12{display:grid;grid-template-columns:repeat(3,1fr);border-bottom:1px solid #d7e3e9;background:#f5fafc}.salonhero-ui .inventory-detail-summary-v12>div{min-height:72px;padding:11px 16px;border-right:1px solid #dce6ec;display:flex;flex-direction:column;justify-content:center;gap:5px}.salonhero-ui .inventory-detail-summary-v12>div:last-child{border-right:0}.salonhero-ui .inventory-detail-summary-v12 span{font-size:10px;color:#758996}.salonhero-ui .inventory-detail-summary-v12 strong{font-size:20px;color:#188c69}.salonhero-ui .inventory-detail-summary-v12 strong.low{color:#df841d}.salonhero-ui .inventory-detail-summary-v12 strong.out{color:#7e8d96}.salonhero-ui .inventory-detail-summary-v12 strong.negative{color:#d72555}.salonhero-ui .inventory-history-v12{max-height:390px;overflow:auto}.salonhero-ui .inventory-history-v12 h3{padding:12px 14px 4px;margin:0;color:#526b7b;font-size:13px}.salonhero-ui .inventory-adjust-v12{border-bottom:1px solid #d9e4ea}
body.salonhero-ui .report-dropdown-v12 .desktop-nav-menu-v8{width:300px}

@media(max-width:767px){
  body.salonhero-ui .inventory-page-v12{margin:0 -8px 76px;gap:0;background:#eef4f7;overflow-x:hidden}
  body.salonhero-ui .inventory-head-v12{display:block;min-height:auto;border-left:0;border-right:0;padding:10px 12px;background:#fff}.salonhero-ui .inventory-head-v12 .eyebrow,.salonhero-ui .inventory-head-v12 p{display:none}.salonhero-ui .inventory-head-v12 h1{font-size:18px;justify-content:center;margin:0}.salonhero-ui .inventory-head-actions-v12{margin-top:8px;justify-content:flex-end}.salonhero-ui .inventory-head-actions-v12 .btn.soft{display:none}
  body.salonhero-ui .inventory-metrics-v12{display:none}
  body.salonhero-ui .inventory-panel-v12{border-left:0;border-right:0;border-radius:0;background:#fff}
  body.salonhero-ui .inventory-filter-v12{display:grid;grid-template-columns:1fr 1fr;gap:0;padding:0;background:#fff;border-bottom:1px solid #cfdde5}.salonhero-ui .inventory-filter-v12 label{padding:9px 12px;gap:2px}.salonhero-ui .inventory-filter-v12 label span{display:none}.salonhero-ui .inventory-filter-v12 select,.salonhero-ui .inventory-branch-v12 b{height:38px;border:0;background:#fff;color:#148fd8;font-size:14px;padding:0}.salonhero-ui .inventory-branch-v12 b:before{content:'Lọc';color:#435969;margin-right:15px}.salonhero-ui .inventory-filter-v12 label:nth-child(2){border-left:1px solid #e0e7eb}.salonhero-ui .inventory-filter-v12 .inventory-search-v12{grid-column:1/-1;height:54px;margin:10px 10px 8px;border:1px solid #d5e0e7;background:#fff;padding:0 13px}.salonhero-ui .inventory-search-v12 input{font-size:15px}.salonhero-ui .inventory-filter-v12>.btn{display:none}
  body.salonhero-ui .inventory-tabs-v12{grid-template-columns:repeat(5,minmax(72px,1fr));overflow-x:auto;padding:7px 10px;gap:0;-webkit-overflow-scrolling:touch}.salonhero-ui .inventory-tabs-v12 a{min-width:80px;height:38px;font-size:12px;white-space:nowrap}.salonhero-ui .inventory-tabs-v12 a b{display:none}.salonhero-ui .inventory-tabs-v12 a:first-child{border-radius:18px 0 0 18px}.salonhero-ui .inventory-tabs-v12 a:last-child{border-radius:0 18px 18px 0}
  body.salonhero-ui .inventory-table-wrap-v12{display:none}.salonhero-ui .inventory-mobile-list-v12{display:block;padding:0 10px;background:#fff}.salonhero-ui .inventory-mobile-row-v12{min-height:104px;display:grid;grid-template-columns:66px minmax(0,1fr) 70px;gap:10px;align-items:center;text-decoration:none;border-bottom:1px solid #e0e7eb;color:#40596b;padding:9px 0}.salonhero-ui .inventory-mobile-thumb-v12{width:64px;height:78px;background:#f6f7f8;display:grid;place-items:center;color:#c1c9ce;overflow:hidden}.salonhero-ui .inventory-mobile-thumb-v12 img{width:100%;height:100%;object-fit:cover}.salonhero-ui .inventory-mobile-copy-v12{min-width:0;display:flex;flex-direction:column;gap:4px}.salonhero-ui .inventory-mobile-copy-v12 small{color:#a2a9ae;font-size:12px}.salonhero-ui .inventory-mobile-copy-v12 b{color:#078fe2;font-size:14px;line-height:1.25;white-space:normal}.salonhero-ui .inventory-mobile-copy-v12 span{color:#60727d;font-size:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.salonhero-ui .inventory-mobile-stock-v12{text-align:right;align-self:stretch;display:flex;flex-direction:column;align-items:flex-end;justify-content:center;gap:3px}.salonhero-ui .inventory-mobile-stock-v12 span{font-size:12px;color:#2f3d45}.salonhero-ui .inventory-mobile-stock-v12 strong{font-size:16px;color:#d20f50}.salonhero-ui .inventory-mobile-stock-v12 strong.in_stock{color:#d20f50}.salonhero-ui .inventory-mobile-stock-v12 strong.low{color:#d20f50}.salonhero-ui .inventory-mobile-stock-v12 strong.out{color:#d20f50}.salonhero-ui .inventory-mobile-stock-v12 strong.negative{color:#d20f50}.salonhero-ui .inventory-mobile-stock-v12 small{font-size:10px;color:#9aa5ac}.salonhero-ui .inventory-empty-v12{padding:60px 20px;text-align:center;color:#8c9aa3}
  body.salonhero-ui .inventory-threshold-setting-v12{display:block;border-left:0;border-right:0;border-radius:0;margin-top:8px;padding:12px}.salonhero-ui .inventory-threshold-setting-v12 form{margin-top:10px}.salonhero-ui .inventory-threshold-setting-v12 input{flex:1;width:auto}
  body.salonhero-ui .inventory-modal-v12 .catalog-modal-card-v8{width:100vw!important;max-width:100vw!important;height:100dvh!important;max-height:100dvh!important;border-radius:0!important}.salonhero-ui .inventory-detail-summary-v12{grid-template-columns:1fr 1fr}.salonhero-ui .inventory-detail-summary-v12>div:nth-child(3){grid-column:1/-1;border-top:1px solid #dce6ec}.salonhero-ui .inventory-history-v12{max-height:42vh}.salonhero-ui .inventory-history-v12 .table-wrap{overflow:auto}.salonhero-ui .inventory-history-v12 table{min-width:720px}
}

/* ===== Spa Sakura CRM v1.2.1 — Dashboard quick links + report payment colors ===== */
body.salonhero-ui .quick-actions-grid>a,
body.salonhero-ui .quick-actions-grid>a:nth-child(5){
  background:#5b8fb2!important;
  color:#fff!important;
}
body.salonhero-ui .quick-actions-grid>a:nth-child(2){background:#5f93b5!important}
body.salonhero-ui .quick-actions-grid>a:nth-child(3){background:#568aa9!important}
body.salonhero-ui .quick-actions-grid>a:nth-child(4){background:#6296b8!important}
body.salonhero-ui .quick-actions-grid>a:hover{background:#4f82a4!important}
body.salonhero-ui .quick-icon{
  background:rgba(255,255,255,.16)!important;
}
body.salonhero-ui .quick-actions-grid small{
  color:rgba(255,255,255,.95)!important;
}

body.salonhero-ui .payment-breakdown-v6{
  background:#f4f8fb!important;
  color:#40596c!important;
  border:1px solid #dce6ec!important;
  border-radius:0!important;
  overflow:hidden!important;
}
body.salonhero-ui .payment-breakdown-v6 .panel-heading{
  background:#f4f8fb!important;
  color:#40596c!important;
}
body.salonhero-ui .payment-breakdown-v6 .panel-heading h2{
  color:#40596c!important;
}
body.salonhero-ui .payment-breakdown-v6 .panel-heading p{
  color:#8b9ba7!important;
}
body.salonhero-ui .payment-breakdown-v6 .panel-heading>strong{
  color:#168a67!important;
}
body.salonhero-ui .payment-breakdown-v6 .payment-method-grid-v6{
  background:#eef4f8!important;
  padding:12px 14px!important;
  gap:8px!important;
}
body.salonhero-ui .payment-breakdown-v6 .payment-method-grid-v6>div{
  background:#fff!important;
  border:1px solid #d6e2e9!important;
  color:#31495a!important;
}
body.salonhero-ui .payment-breakdown-v6 .payment-method-grid-v6>div *{
  color:inherit!important;
}
body.salonhero-ui .payment-breakdown-v6 .payment-method-grid-v6 p{
  color:#637989!important;
}
body.salonhero-ui .payment-breakdown-v6 .payment-method-grid-v6 strong{
  color:#31495a!important;
}

/* ========================================================================
   Spa Sakura CRM v1.2.2 — Dashboard palette + SalonHero-like mobile polish
   Mục tiêu: dashboard hài hoà xanh ghi/xanh ngọc, flat UI, mobile dễ thao tác.
   ======================================================================== */
:root{
  --sakura-dashboard-blue:#3b88b4;
  --sakura-dashboard-blue-2:#4a7f9f;
  --sakura-dashboard-teal:#3c9f96;
  --sakura-dashboard-coral:#d96059;
  --sakura-dashboard-slate:#587f98;
  --sakura-dashboard-soft:#f4f8fb;
  --sakura-dashboard-line:#d5e1e8;
}

/* Dashboard: một bảng màu thống nhất, giảm độ gắt và loại bỏ cảm giác nhiều màu rời rạc. */
body.salonhero-ui .dashboard-welcome{
  border-color:var(--sakura-dashboard-line)!important;
  background:#fff!important;
}
body.salonhero-ui .dashboard-welcome .eyebrow{color:#2588bd!important}
body.salonhero-ui .dashboard-welcome h1{color:#405e72!important}
body.salonhero-ui .hero-metric.metric-blue{background:var(--sakura-dashboard-blue)!important}
body.salonhero-ui .hero-metric.metric-orange{background:var(--sakura-dashboard-teal)!important}
body.salonhero-ui .hero-metric.metric-red{background:var(--sakura-dashboard-coral)!important}
body.salonhero-ui .hero-metric .metric-icon{
  background:rgba(255,255,255,.14)!important;
  border:1px solid rgba(255,255,255,.16)!important;
}

body.salonhero-ui .quick-actions-grid>a,
body.salonhero-ui .quick-actions-grid>a:nth-child(2),
body.salonhero-ui .quick-actions-grid>a:nth-child(3),
body.salonhero-ui .quick-actions-grid>a:nth-child(4),
body.salonhero-ui .quick-actions-grid>a:nth-child(5){
  background:var(--sakura-dashboard-slate)!important;
  color:#fff!important;
  border:1px solid rgba(0,0,0,.025)!important;
}
body.salonhero-ui .quick-actions-grid>a:nth-child(2){background:#527b95!important}
body.salonhero-ui .quick-actions-grid>a:nth-child(3){background:#4d8592!important}
body.salonhero-ui .quick-actions-grid>a:nth-child(4){background:#4e7f9e!important}
body.salonhero-ui .quick-actions-grid>a:nth-child(5){background:#5b7d92!important}
body.salonhero-ui .quick-actions-grid>a:hover{background:#47748f!important}
body.salonhero-ui .quick-icon{
  background:rgba(255,255,255,.13)!important;
  border-right:0!important;
}
body.salonhero-ui .quick-actions-grid b{color:#fff!important}
body.salonhero-ui .quick-actions-grid small{color:rgba(255,255,255,.9)!important}

body.salonhero-ui .dashboard-panel{
  border-color:var(--sakura-dashboard-line)!important;
  background:#fff!important;
}
body.salonhero-ui .dashboard-panel .panel-heading{
  background:#f8fbfd!important;
  border-bottom-color:#dce6ec!important;
}
body.salonhero-ui .dashboard-panel .panel-heading h2{color:#405d70!important}
body.salonhero-ui .dashboard-panel .panel-heading p{color:#8496a2!important}
body.salonhero-ui .dashboard-panel .panel-heading>a{color:#1989ca!important}
body.salonhero-ui .dashboard-order-row:hover{background:#f2f9fd!important}
body.salonhero-ui .order-mini-icon{background:#e8f4fb!important;color:#238bc8!important}
body.salonhero-ui .payment-breakdown{background:#fff!important}
body.salonhero-ui .payment-breakdown>div{background:#fff!important}
body.salonhero-ui .payment-breakdown strong{color:#35566b!important}

/* Các ô dữ liệu bán hàng: từ mảng xanh lá lớn sang card trắng, đồng bộ dashboard. */
body.salonhero-ui .management-mini-grid{
  gap:1px!important;
  background:#dfe8ee!important;
}
body.salonhero-ui .management-mini-grid>a{
  min-height:76px!important;
  background:#fff!important;
  color:#4b6678!important;
  border:0!important;
  border-top:3px solid #75a7c3!important;
}
body.salonhero-ui .management-mini-grid>a:nth-child(2){border-top-color:#69a49d!important}
body.salonhero-ui .management-mini-grid>a:nth-child(3){border-top-color:#7f9ab0!important}
body.salonhero-ui .management-mini-grid>a:nth-child(4){border-top-color:#5f91ae!important}
body.salonhero-ui .management-mini-grid>a strong{color:#2f789f!important;font-size:18px!important}
body.salonhero-ui .management-mini-grid>a span{color:#718695!important}
body.salonhero-ui .management-mini-grid>a:hover{background:#f4f9fc!important}
body.salonhero-ui .latest-customers{background:#dfe8ee!important}
body.salonhero-ui .latest-customer-card{background:#fff!important}

/* Report payment box: desktop + mobile đều dùng nền sáng và chữ rõ. */
body.salonhero-ui .payment-breakdown-v6{
  background:#f4f8fb!important;
  color:#40596c!important;
  border:1px solid #dce6ec!important;
}
body.salonhero-ui .payment-breakdown-v6 .panel-heading{background:#f8fbfd!important;color:#40596c!important}
body.salonhero-ui .payment-breakdown-v6 .panel-heading h2{color:#40596c!important}
body.salonhero-ui .payment-breakdown-v6 .panel-heading p{color:#8b9ba7!important}
body.salonhero-ui .payment-breakdown-v6 .panel-heading>strong{color:#168a67!important}
body.salonhero-ui .payment-breakdown-v6 .payment-method-grid-v6{background:#eef4f8!important}
body.salonhero-ui .payment-breakdown-v6 .payment-method-grid-v6>div{
  background:#fff!important;
  color:#31495a!important;
  border-color:#d6e2e9!important;
}
body.salonhero-ui .payment-breakdown-v6 .payment-method-grid-v6 p{color:#637989!important}
body.salonhero-ui .payment-breakdown-v6 .payment-method-grid-v6 strong{color:#31495a!important}

@media(max-width:767px){
  /* Khung app mobile: phẳng, sáng, khoảng cách giống ứng dụng quản lý hơn. */
  body.salonhero-ui{background:#f3f7f9!important;overflow-x:hidden}
  body.salonhero-ui .topbar{
    height:62px!important;
    min-height:62px!important;
    background:#0b87e8!important;
    border-bottom:1px solid #0878cc!important;
    padding:0 14px!important;
  }
  body.salonhero-ui .mobile-title{
    font-size:19px!important;
    font-weight:600!important;
    line-height:1!important;
    letter-spacing:0!important;
  }
  body.salonhero-ui .page-shell{
    padding:8px 10px calc(78px + env(safe-area-inset-bottom))!important;
    max-width:100%!important;
    overflow-x:hidden!important;
  }

  /* Dashboard mobile: card rõ ràng, không sát mép và không dùng mảng màu quá lớn. */
  body.salonhero-ui .dashboard-welcome{
    margin:0 0 8px!important;
    padding:10px 12px!important;
    border:1px solid #d7e2e9!important;
    background:#fff!important;
  }
  body.salonhero-ui .dashboard-welcome h1{font-size:19px!important;margin:0 0 2px!important}
  body.salonhero-ui .dashboard-welcome p{display:block!important;font-size:11.5px!important}
  body.salonhero-ui .hero-metrics{
    grid-template-columns:1fr 1fr!important;
    gap:7px!important;
    margin-bottom:7px!important;
  }
  body.salonhero-ui .hero-metric{
    min-height:104px!important;
    padding:11px 10px!important;
    gap:8px!important;
    align-items:flex-start!important;
  }
  body.salonhero-ui .hero-metric:nth-child(3){grid-column:1/-1!important;min-height:96px!important}
  body.salonhero-ui .metric-icon{width:32px!important;height:32px!important;flex:0 0 32px!important}
  body.salonhero-ui .hero-metric span{font-size:11px!important;line-height:1.25!important}
  body.salonhero-ui .hero-metric strong{font-size:19px!important;margin:8px 0 3px!important;line-height:1.15!important}
  body.salonhero-ui .hero-metric small{font-size:10.5px!important;line-height:1.3!important}

  body.salonhero-ui .quick-actions-grid{
    grid-template-columns:1fr 1fr!important;
    gap:7px!important;
    margin-bottom:8px!important;
  }
  body.salonhero-ui .quick-actions-grid>a,
  body.salonhero-ui .quick-actions-grid>a:nth-child(5){
    min-height:78px!important;
    padding:10px!important;
    gap:9px!important;
    border:0!important;
  }
  body.salonhero-ui .quick-actions-grid>a:nth-child(5){grid-column:1/-1!important}
  body.salonhero-ui .quick-icon{
    width:36px!important;
    height:36px!important;
    flex:0 0 36px!important;
    padding:0!important;
  }
  body.salonhero-ui .quick-actions-grid b{font-size:12.5px!important;line-height:1.25!important;margin:0 0 3px!important}
  body.salonhero-ui .quick-actions-grid small{font-size:10.5px!important;line-height:1.3!important}

  body.salonhero-ui .dashboard-grid{display:block!important;margin-bottom:7px!important}
  body.salonhero-ui .dashboard-panel{
    margin:0 0 7px!important;
    border:1px solid #d7e2e9!important;
    border-radius:0!important;
    overflow:hidden!important;
  }
  body.salonhero-ui .dashboard-panel .panel-heading{
    min-height:52px!important;
    padding:9px 11px!important;
  }
  body.salonhero-ui .dashboard-panel .panel-heading h2{font-size:14px!important}
  body.salonhero-ui .dashboard-panel .panel-heading p{font-size:10.5px!important}
  body.salonhero-ui .dashboard-order-row{
    grid-template-columns:34px minmax(0,1fr) auto!important;
    gap:9px!important;
    padding:10px 11px!important;
    min-width:0!important;
  }
  body.salonhero-ui .dashboard-order-row>.badge{
    grid-column:2/4!important;
    justify-self:start!important;
    margin-top:-2px!important;
  }
  body.salonhero-ui .order-main{min-width:0!important}
  body.salonhero-ui .order-main b,
  body.salonhero-ui .order-main small{overflow:hidden!important;text-overflow:ellipsis!important;white-space:nowrap!important}
  body.salonhero-ui .order-money{white-space:nowrap!important}
  body.salonhero-ui .payment-breakdown>div{padding:10px 11px!important}
  body.salonhero-ui .management-mini-grid>a{min-height:72px!important;padding:9px!important}
  body.salonhero-ui .latest-customers{grid-template-columns:1fr!important;padding:0!important;gap:1px!important}
  body.salonhero-ui .latest-customer-card{padding:11px!important}

  /* Bottom navigation như app: icon rõ, active xanh, không đổ bóng. */
  body.salonhero-ui .mobile-nav{
    min-height:70px!important;
    background:#fff!important;
    border-top:1px solid #cfdbe3!important;
    padding:0 4px env(safe-area-inset-bottom)!important;
  }
  body.salonhero-ui .mobile-nav a{
    height:68px!important;
    min-width:0!important;
    gap:4px!important;
    color:#929aa1!important;
    font-size:11px!important;
    font-weight:500!important;
    background:#fff!important;
    border-top:3px solid transparent!important;
  }
  body.salonhero-ui .mobile-nav a .ui-icon{width:23px!important;height:23px!important}
  body.salonhero-ui .mobile-nav a.active{
    color:#0b87e8!important;
    font-weight:650!important;
    background:#f4f9fc!important;
    border-top-color:#0b87e8!important;
  }
  body.salonhero-ui .mobile-nav a span{
    max-width:100%!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
    white-space:nowrap!important;
  }

  /* Các panel không phải POS giữ nhịp cách nhau như app, tránh dính mép. */
  body.salonhero-ui .report-page-v6 .panel,
  body.salonhero-ui .cashbook-page-v7 .panel,
  body.salonhero-ui .inventory-page-v12 .panel,
  body.salonhero-ui .account-layout-v9 .panel{
    box-shadow:none!important;
  }
}

@media(max-width:430px){
  body.salonhero-ui .hero-metric{padding:10px 9px!important}
  body.salonhero-ui .hero-metric strong{font-size:18px!important}
  body.salonhero-ui .quick-actions-grid b{font-size:12px!important}
  body.salonhero-ui .quick-actions-grid small{font-size:10px!important}
  body.salonhero-ui .mobile-nav a{font-size:10.5px!important}
}

/* ===== Spa Sakura CRM v1.2.3 — Brighter dashboard + product delete ===== */
/* Dashboard quick actions: bright flat palette, no purple, no dark slate. */
body.salonhero-ui .quick-actions-grid>a,
body.salonhero-ui .quick-actions-grid>a:nth-child(5){
  color:#fff!important;
  border:0!important;
  background:#159fe3!important;
}
body.salonhero-ui .quick-actions-grid>a:nth-child(1){background:#159fe3!important}
body.salonhero-ui .quick-actions-grid>a:nth-child(2){background:#25a69a!important}
body.salonhero-ui .quick-actions-grid>a:nth-child(3){background:#f2a42c!important}
body.salonhero-ui .quick-actions-grid>a:nth-child(4){background:#ee6f5b!important}
body.salonhero-ui .quick-actions-grid>a:nth-child(5){background:#5b8fd8!important}
body.salonhero-ui .quick-actions-grid>a:nth-child(1):hover{background:#0d91d3!important}
body.salonhero-ui .quick-actions-grid>a:nth-child(2):hover{background:#1b978c!important}
body.salonhero-ui .quick-actions-grid>a:nth-child(3):hover{background:#e6981f!important}
body.salonhero-ui .quick-actions-grid>a:nth-child(4):hover{background:#df624f!important}
body.salonhero-ui .quick-actions-grid>a:nth-child(5):hover{background:#4f82ca!important}
body.salonhero-ui .quick-actions-grid b{color:#fff!important}
body.salonhero-ui .quick-actions-grid small{color:rgba(255,255,255,.94)!important}
body.salonhero-ui .quick-actions-grid .quick-icon{
  color:#fff!important;
  background:rgba(255,255,255,.17)!important;
  border:0!important;
}

/* Product delete is intentionally available only for inactive products. */
body.salonhero-ui .catalog-row-actions-v8{flex-wrap:wrap}
body.salonhero-ui .product-delete-v123{
  background:#fff!important;
  color:#d84c45!important;
  border:1px solid #e5aaa6!important;
}
body.salonhero-ui .product-delete-v123:hover{
  background:#d84c45!important;
  color:#fff!important;
  border-color:#d84c45!important;
}

/* ===== Spa Sakura CRM v1.2.4 — Quick action cards: light flat palette ===== */
body.salonhero-ui .quick-actions-grid>a,
body.salonhero-ui .quick-actions-grid>a:nth-child(2),
body.salonhero-ui .quick-actions-grid>a:nth-child(3),
body.salonhero-ui .quick-actions-grid>a:nth-child(4),
body.salonhero-ui .quick-actions-grid>a:nth-child(5){
  position:relative;
  min-height:88px;
  background:#fff!important;
  color:#34495e!important;
  border:1px solid #d5e1e8!important;
  border-left-width:4px!important;
  border-radius:0!important;
  padding:12px 14px 12px 12px!important;
  gap:11px!important;
  transition:background-color .15s ease,border-color .15s ease!important;
}
body.salonhero-ui .quick-actions-grid>a:nth-child(1){border-left-color:#1e88e5!important}
body.salonhero-ui .quick-actions-grid>a:nth-child(2){border-left-color:#009688!important}
body.salonhero-ui .quick-actions-grid>a:nth-child(3){border-left-color:#f9a825!important}
body.salonhero-ui .quick-actions-grid>a:nth-child(4){border-left-color:#f4511e!important}
body.salonhero-ui .quick-actions-grid>a:nth-child(5){border-left-color:#546e7a!important}

body.salonhero-ui .quick-actions-grid>a:nth-child(1):hover{background:#f4f9fe!important;border-color:#b9d9f4!important;border-left-color:#1e88e5!important}
body.salonhero-ui .quick-actions-grid>a:nth-child(2):hover{background:#f2fbf9!important;border-color:#b9e1dc!important;border-left-color:#009688!important}
body.salonhero-ui .quick-actions-grid>a:nth-child(3):hover{background:#fffaf0!important;border-color:#f1d996!important;border-left-color:#f9a825!important}
body.salonhero-ui .quick-actions-grid>a:nth-child(4):hover{background:#fff7f4!important;border-color:#f4c8b9!important;border-left-color:#f4511e!important}
body.salonhero-ui .quick-actions-grid>a:nth-child(5):hover{background:#f6f8f9!important;border-color:#cbd5da!important;border-left-color:#546e7a!important}

body.salonhero-ui .quick-actions-grid .quick-icon{
  width:44px!important;
  height:44px!important;
  min-width:44px!important;
  padding:0!important;
  border:0!important;
  display:grid!important;
  place-items:center!important;
  background:#eef5fa!important;
}
body.salonhero-ui .quick-actions-grid>a:nth-child(1) .quick-icon{background:#e9f4fe!important;color:#1e88e5!important}
body.salonhero-ui .quick-actions-grid>a:nth-child(2) .quick-icon{background:#e6f6f4!important;color:#009688!important}
body.salonhero-ui .quick-actions-grid>a:nth-child(3) .quick-icon{background:#fff4d3!important;color:#c48400!important}
body.salonhero-ui .quick-actions-grid>a:nth-child(4) .quick-icon{background:#ffede7!important;color:#f4511e!important}
body.salonhero-ui .quick-actions-grid>a:nth-child(5) .quick-icon{background:#edf1f3!important;color:#546e7a!important}

body.salonhero-ui .quick-actions-grid b{
  color:#34495e!important;
  font-size:13px!important;
  font-weight:700!important;
  margin-bottom:4px!important;
}
body.salonhero-ui .quick-actions-grid small{
  color:#7d8f9c!important;
  font-size:10.5px!important;
  opacity:1!important;
}

@media(max-width:767px){
  body.salonhero-ui .quick-actions-grid>a,
  body.salonhero-ui .quick-actions-grid>a:nth-child(2),
  body.salonhero-ui .quick-actions-grid>a:nth-child(3),
  body.salonhero-ui .quick-actions-grid>a:nth-child(4),
  body.salonhero-ui .quick-actions-grid>a:nth-child(5){
    min-height:76px!important;
    padding:9px 10px!important;
    gap:8px!important;
    border-left-width:3px!important;
  }
  body.salonhero-ui .quick-actions-grid .quick-icon{
    width:38px!important;
    min-width:38px!important;
    height:38px!important;
  }
  body.salonhero-ui .quick-actions-grid b{font-size:12.5px!important;line-height:1.25!important}
  body.salonhero-ui .quick-actions-grid small{font-size:10.5px!important;line-height:1.3!important}
}

/* ===== Spa Sakura CRM v1.2.5 — Quick action cards: pastel palette (Option B) ===== */
body.salonhero-ui .quick-actions-grid>a,
body.salonhero-ui .quick-actions-grid>a:nth-child(2),
body.salonhero-ui .quick-actions-grid>a:nth-child(3),
body.salonhero-ui .quick-actions-grid>a:nth-child(4),
body.salonhero-ui .quick-actions-grid>a:nth-child(5){
  min-height:88px!important;
  color:#30485b!important;
  border:1px solid transparent!important;
  border-left:1px solid transparent!important;
  border-radius:3px!important;
  padding:12px 14px!important;
  gap:11px!important;
  transition:background-color .15s ease,border-color .15s ease!important;
}
body.salonhero-ui .quick-actions-grid>a:nth-child(1){background:#eaf4ff!important;border-color:#cfe4f8!important}
body.salonhero-ui .quick-actions-grid>a:nth-child(2){background:#e8f8f5!important;border-color:#c8eae3!important}
body.salonhero-ui .quick-actions-grid>a:nth-child(3){background:#fff6e5!important;border-color:#f1dfb8!important}
body.salonhero-ui .quick-actions-grid>a:nth-child(4){background:#fff0eb!important;border-color:#f0d2c8!important}
body.salonhero-ui .quick-actions-grid>a:nth-child(5){background:#eef3f6!important;border-color:#d3dfe5!important}

body.salonhero-ui .quick-actions-grid>a:nth-child(1):hover{background:#dceeff!important;border-color:#b8d9f5!important}
body.salonhero-ui .quick-actions-grid>a:nth-child(2):hover{background:#daf2ed!important;border-color:#afdcd3!important}
body.salonhero-ui .quick-actions-grid>a:nth-child(3):hover{background:#ffedc9!important;border-color:#e9cf91!important}
body.salonhero-ui .quick-actions-grid>a:nth-child(4):hover{background:#ffe4db!important;border-color:#e9bdae!important}
body.salonhero-ui .quick-actions-grid>a:nth-child(5):hover{background:#e2ebef!important;border-color:#c0d1da!important}

body.salonhero-ui .quick-actions-grid .quick-icon{
  width:44px!important;
  height:44px!important;
  min-width:44px!important;
  padding:0!important;
  border:0!important;
  border-radius:3px!important;
  display:grid!important;
  place-items:center!important;
}
body.salonhero-ui .quick-actions-grid>a:nth-child(1) .quick-icon{background:#d5eaff!important;color:#1976d2!important}
body.salonhero-ui .quick-actions-grid>a:nth-child(2) .quick-icon{background:#d1f0ea!important;color:#00897b!important}
body.salonhero-ui .quick-actions-grid>a:nth-child(3) .quick-icon{background:#ffe9b8!important;color:#c77f00!important}
body.salonhero-ui .quick-actions-grid>a:nth-child(4) .quick-icon{background:#ffdbcf!important;color:#e64a19!important}
body.salonhero-ui .quick-actions-grid>a:nth-child(5) .quick-icon{background:#dce6eb!important;color:#546e7a!important}

body.salonhero-ui .quick-actions-grid b{
  color:#30485b!important;
  font-size:13px!important;
  font-weight:700!important;
  margin-bottom:4px!important;
}
body.salonhero-ui .quick-actions-grid small{
  color:#708491!important;
  font-size:10.5px!important;
  opacity:1!important;
}

@media(max-width:767px){
  body.salonhero-ui .quick-actions-grid>a,
  body.salonhero-ui .quick-actions-grid>a:nth-child(2),
  body.salonhero-ui .quick-actions-grid>a:nth-child(3),
  body.salonhero-ui .quick-actions-grid>a:nth-child(4),
  body.salonhero-ui .quick-actions-grid>a:nth-child(5){
    min-height:76px!important;
    padding:9px 10px!important;
    gap:8px!important;
    border-left-width:1px!important;
  }
  body.salonhero-ui .quick-actions-grid .quick-icon{
    width:38px!important;
    min-width:38px!important;
    height:38px!important;
  }
  body.salonhero-ui .quick-actions-grid b{font-size:12.5px!important;line-height:1.25!important}
  body.salonhero-ui .quick-actions-grid small{font-size:10.5px!important;line-height:1.3!important}
}


/* ===== Spa Sakura CRM v1.2.6 — sửa hóa đơn đang xử lý ===== */
body.salonhero-ui .edit-order-banner-v126{
  display:flex;align-items:flex-start;gap:10px;margin:0 0 8px;padding:10px 12px;
  background:#fff8e8;border:1px solid #efd79a;color:#6b5623;
}
body.salonhero-ui .edit-order-banner-v126 .ui-icon{color:#d59a1b;margin-top:1px}
body.salonhero-ui .edit-order-banner-v126 b{display:block;color:#66501b;font-size:12px;margin-bottom:2px}
body.salonhero-ui .edit-order-banner-v126 span{display:block;color:#8a7441;font-size:10.5px}
body.salonhero-ui .pos-pagebar.pos-editing-v126{border-color:#e7d69e;background:#fffdf7}
body.salonhero-ui .edit-order-btn-v126{white-space:nowrap}
body.salonhero-ui .processing-actions-v126{display:flex;align-items:center;gap:7px;margin-top:14px}
body.salonhero-ui .processing-actions-v126 form{margin:0}
body.salonhero-ui .processing-actions-v126 .btn{min-width:120px;justify-content:center}

@media(max-width:767px){
  body.salonhero-ui .edit-order-banner-v126{margin:0 -2px 8px;padding:9px 10px}
  body.salonhero-ui .edit-order-banner-v126 span{font-size:11px;line-height:1.4}
  body.salonhero-ui .processing-actions-v126{display:grid;grid-template-columns:1fr 1fr;gap:7px}
  body.salonhero-ui .processing-actions-v126 .btn,body.salonhero-ui .processing-actions-v126 form{width:100%}
  body.salonhero-ui .processing-actions-v126 form .btn{width:100%}
  body.salonhero-ui .page-head-actions-v11 .edit-order-btn-v126{display:inline-flex!important}
}


/* ===== Spa Sakura CRM v1.2.7 — Tự động lưu hóa đơn đang nhập ===== */
body.salonhero-ui .order-autosave-v127{
  margin-left:auto;display:inline-flex;align-items:center;min-height:24px;padding:0 8px;
  border:1px solid #d6e3ea;background:#f7fafc;color:#718592;font-size:10.5px;font-weight:600;white-space:nowrap
}
body.salonhero-ui .order-autosave-v127[data-state="pending"]{background:#fff8e8;border-color:#f1dca5;color:#a06b10}
body.salonhero-ui .order-autosave-v127[data-state="saving"]{background:#eaf6fd;border-color:#b9ddf3;color:#167fb9}
body.salonhero-ui .order-autosave-v127[data-state="saved"]{background:#eaf8f2;border-color:#bfe6d4;color:#17835f}
body.salonhero-ui .order-autosave-v127[data-state="error"]{background:#fff0f0;border-color:#efc6c6;color:#c94848}
body.salonhero-ui .order-exit-v127{background:#fff!important;color:#536b7c!important;border-color:#cbd9e3!important}
@media(max-width:767px){
  body.salonhero-ui .order-meta-strip .order-autosave-v127{grid-column:1/-1;margin-left:0;justify-content:center;min-height:30px;font-size:11px}
}

/* ===== Spa Sakura CRM v1.2.9 — completed-order edit + desktop readability ===== */
body.salonhero-ui .customer-info-grid-v5>div{
  padding:12px 14px!important;
}
body.salonhero-ui .edit-order-banner-v126.completed-edit-v129{
  background:#fff4e8;
  border-color:#efc48f;
  color:#76501d;
}
body.salonhero-ui .edit-order-banner-v126.completed-edit-v129 .ui-icon{color:#d98219}
body.salonhero-ui .completed-actions-v129{margin-top:14px}

@media(min-width:1024px){
  body.salonhero-ui{font-size:14px;line-height:1.48}
  body.salonhero-ui .desktop-nav a{font-size:14px}
  body.salonhero-ui .brand{font-size:15px}
  body.salonhero-ui .branch-pill,body.salonhero-ui .user-pill,body.salonhero-ui .logout-link{font-size:14px}
  body.salonhero-ui .page-head h1{font-size:19px}
  body.salonhero-ui .page-head p{font-size:12px}
  body.salonhero-ui .panel-heading h2{font-size:15px!important}
  body.salonhero-ui .panel-heading p{font-size:11.5px!important}
  body.salonhero-ui .btn{font-size:14px;min-height:38px}
  body.salonhero-ui input,body.salonhero-ui select,body.salonhero-ui textarea,
  body.salonhero-ui .filterbar input,body.salonhero-ui .filterbar select,
  body.salonhero-ui label input,body.salonhero-ui label select,body.salonhero-ui label textarea{font-size:14px}
  body.salonhero-ui th,body.salonhero-ui td{font-size:13.5px}
  body.salonhero-ui .invoice-detail .invoice-top h2{font-size:18px}
  body.salonhero-ui .invoice-meta,body.salonhero-ui .invoice-totals{font-size:14px}
  body.salonhero-ui .invoice-items th,body.salonhero-ui .invoice-items td{font-size:13.5px}
  body.salonhero-ui .payment-history h2{font-size:17px}
  body.salonhero-ui .pay-row b{font-size:13.5px}
  body.salonhero-ui .pay-row small{font-size:11.5px}
  body.salonhero-ui .customer-info-grid-v5 span{font-size:12px}
  body.salonhero-ui .customer-info-grid-v5 b{font-size:14px}
  body.salonhero-ui .customer-list-copy-v5 b{font-size:13.5px}
  body.salonhero-ui .customer-list-copy-v5 small{font-size:11.5px}
  body.salonhero-ui .catalog-copy b{font-size:13.5px}
  body.salonhero-ui .catalog-copy small{font-size:11.5px}
  body.salonhero-ui .quick-actions-grid b{font-size:14px!important}
  body.salonhero-ui .quick-actions-grid small{font-size:11.5px!important}
}

@media(max-width:767px){
  body.salonhero-ui .customer-info-grid-v5>div{padding:12px 13px!important}
  body.salonhero-ui .completed-actions-v129{grid-template-columns:1fr}
}

/* ===== Spa Sakura CRM v1.2.10 — Desktop typography readability pass ===== */
/* Desktop only: increase the small legacy typography without changing mobile. */
@media (min-width:1024px){
  body.salonhero-ui{
    font-size:15.5px!important;
    line-height:1.52!important;
  }

  /* Header / navigation */
  body.salonhero-ui .brand{font-size:16px!important}
  body.salonhero-ui .desktop-nav>a,
  body.salonhero-ui .desktop-nav-dropdown-v8>a{font-size:15px!important;font-weight:650!important}
  body.salonhero-ui .branch-pill,
  body.salonhero-ui .user-pill,
  body.salonhero-ui .logout-link{font-size:14.5px!important}
  body.salonhero-ui .desktop-nav-menu-v8{width:310px!important}
  body.salonhero-ui .report-dropdown-v12 .desktop-nav-menu-v8{width:325px!important}
  body.salonhero-ui .desktop-nav-menu-v8>a{min-height:62px!important;padding:10px 14px!important;gap:11px!important}
  body.salonhero-ui .desktop-nav-menu-v8 b{font-size:14.5px!important;line-height:1.25!important}
  body.salonhero-ui .desktop-nav-menu-v8 small{font-size:12.5px!important;line-height:1.3!important;margin-top:2px!important}

  /* Common headings / helper text */
  body.salonhero-ui .eyebrow{font-size:12.5px!important;line-height:1.3!important;letter-spacing:.035em!important}
  body.salonhero-ui .page-head h1{font-size:22px!important;line-height:1.25!important}
  body.salonhero-ui .page-head p{font-size:13.5px!important;line-height:1.45!important}
  body.salonhero-ui .panel-heading{min-height:64px!important;padding:13px 16px!important}
  body.salonhero-ui .panel-heading h2{font-size:17px!important;line-height:1.3!important}
  body.salonhero-ui .panel-heading p{font-size:13px!important;line-height:1.4!important}
  body.salonhero-ui .panel-heading>a{font-size:13.5px!important}

  /* Buttons / form controls */
  body.salonhero-ui .btn{font-size:14.5px!important;min-height:40px!important;padding:9px 14px!important}
  body.salonhero-ui .btn.tiny{font-size:12px!important;min-height:32px!important;height:32px!important;padding:5px 9px!important}
  body.salonhero-ui input,
  body.salonhero-ui select,
  body.salonhero-ui textarea,
  body.salonhero-ui label,
  body.salonhero-ui .filterbar input,
  body.salonhero-ui .filterbar select{font-size:14.5px!important}

  /* Tables / status badges */
  body.salonhero-ui th{font-size:13.5px!important;line-height:1.35!important}
  body.salonhero-ui td{font-size:14px!important;line-height:1.45!important}
  body.salonhero-ui .badge{font-size:12.5px!important;padding:5px 9px!important}
  body.salonhero-ui .empty{font-size:14px!important}

  /* Customer page — the blocks shown in the user's screenshots */
  body.salonhero-ui .customer-page-head{padding:12px 14px!important}
  body.salonhero-ui .customer-page-head .eyebrow{font-size:12.5px!important;margin-bottom:5px!important}
  body.salonhero-ui .customer-page-head h1{font-size:22px!important;margin-bottom:3px!important}
  body.salonhero-ui .customer-page-head p{font-size:13.5px!important;line-height:1.45!important}
  body.salonhero-ui .customer-summary-v5>div{min-height:94px!important;padding:13px 15px!important}
  body.salonhero-ui .customer-summary-v5 span{font-size:13px!important;line-height:1.35!important}
  body.salonhero-ui .customer-summary-v5 strong{font-size:23px!important;margin-top:5px!important;line-height:1.15!important}
  body.salonhero-ui .customer-list-title-v5{padding:9px 11px!important}
  body.salonhero-ui .customer-list-title-v5 b{font-size:14.5px!important}
  body.salonhero-ui .customer-list-title-v5 span{font-size:12.5px!important}
  body.salonhero-ui .customer-list-copy-v5 b{font-size:14.5px!important;line-height:1.3!important}
  body.salonhero-ui .customer-list-copy-v5 small{font-size:13px!important;line-height:1.35!important}
  body.salonhero-ui .customer-list-copy-v5 em{font-size:12.5px!important;line-height:1.35!important}
  body.salonhero-ui .customer-info-grid-v5 span{font-size:13px!important}
  body.salonhero-ui .customer-info-grid-v5 b{font-size:15px!important}

  /* Cashbook / payment-method summaries */
  body.salonhero-ui .cashbook-methods-v7 .panel-heading h2{font-size:17px!important}
  body.salonhero-ui .cashbook-methods-v7 .panel-heading p{font-size:13px!important}
  body.salonhero-ui .cashbook-methods-v7 .panel-heading>strong{font-size:20px!important}
  body.salonhero-ui .cashbook-method-grid-v7>div{min-height:58px!important;padding:13px 14px!important}
  body.salonhero-ui .cashbook-method-grid-v7 span{font-size:13.5px!important}
  body.salonhero-ui .cashbook-method-grid-v7 strong{font-size:15.5px!important}
  body.salonhero-ui .cashbook-note-v7{font-size:12.5px!important;line-height:1.45!important;padding:10px 14px!important}
  body.salonhero-ui .cashbook-auto-note-v7{font-size:12.5px!important}
  body.salonhero-ui .cash-metric-v7 span{font-size:12px!important}
  body.salonhero-ui .cash-metric-v7 small{font-size:12px!important;line-height:1.4!important}
  body.salonhero-ui .cashbook-form-grid-v7 label{font-size:13.5px!important}

  /* Reports */
  body.salonhero-ui .payment-method-grid-v6 p{font-size:13.5px!important}
  body.salonhero-ui .payment-method-grid-v6 strong{font-size:15.5px!important}
  body.salonhero-ui .report-empty-v6{font-size:14.5px!important}

  /* Dashboard */
  body.salonhero-ui .dashboard-welcome .eyebrow{font-size:12.5px!important}
  body.salonhero-ui .dashboard-welcome h1{font-size:25px!important}
  body.salonhero-ui .dashboard-welcome p{font-size:13.5px!important}
  body.salonhero-ui .hero-metric span{font-size:13px!important}
  body.salonhero-ui .hero-metric small{font-size:12.5px!important}
  body.salonhero-ui .quick-actions-grid b{font-size:15px!important;line-height:1.3!important}
  body.salonhero-ui .quick-actions-grid small{font-size:12.5px!important;line-height:1.4!important}
  body.salonhero-ui .order-main b{font-size:14.5px!important}
  body.salonhero-ui .order-main small,
  body.salonhero-ui .order-money small{font-size:12.5px!important}
  body.salonhero-ui .management-mini-grid span,
  body.salonhero-ui .latest-card-balance,
  body.salonhero-ui .latest-customer-card>a{font-size:12.5px!important}

  /* Product / service administration */
  body.salonhero-ui .catalog-side-title-v8{font-size:14px!important}
  body.salonhero-ui .catalog-group-list-v8>a,
  body.salonhero-ui .catalog-group-row-v8>a{font-size:13.5px!important}
  body.salonhero-ui .catalog-result-meta-v8{font-size:12.5px!important}
  body.salonhero-ui .catalog-copy b{font-size:14.5px!important;line-height:1.3!important}
  body.salonhero-ui .catalog-copy small{font-size:12.5px!important;line-height:1.35!important}
  body.salonhero-ui .catalog-status-v8,
  body.salonhero-ui .money-card-state-v8{font-size:12px!important;min-height:25px!important;padding:3px 8px!important}
  body.salonhero-ui .catalog-modal-title-v8 h2{font-size:19px!important}
  body.salonhero-ui .catalog-modal-title-v8 p{font-size:12.5px!important}
  body.salonhero-ui .catalog-modal-tabs-v8 span{font-size:14px!important}
  body.salonhero-ui .catalog-form-fields-v8>label{font-size:13.5px!important}
  body.salonhero-ui .catalog-image-picker-v8{font-size:12.5px!important}
  body.salonhero-ui .catalog-image-preview-v8 small{font-size:11px!important}
  body.salonhero-ui .catalog-image-picker-v8>b{font-size:12px!important}
  body.salonhero-ui .status-check-v8{font-size:13px!important}

  /* Inventory */
  body.salonhero-ui .inventory-head-v12 .eyebrow{font-size:12.5px!important}
  body.salonhero-ui .inventory-head-v12 p{font-size:13px!important}
  body.salonhero-ui .inventory-metrics-v12 span{font-size:12px!important}
  body.salonhero-ui .inventory-metrics-v12 small{font-size:12px!important}
  body.salonhero-ui .inventory-filter-v12 label{font-size:12.5px!important}
  body.salonhero-ui .inventory-branch-v12 b{font-size:13.5px!important}
  body.salonhero-ui .inventory-search-v12 input{font-size:14px!important}
  body.salonhero-ui .inventory-tabs-v12 a{font-size:13px!important}
  body.salonhero-ui .inventory-tabs-v12 a b{font-size:11.5px!important}
  body.salonhero-ui .inventory-table-v12 th{font-size:12.5px!important}
  body.salonhero-ui .inventory-table-v12 td{font-size:13.5px!important}
  body.salonhero-ui .inventory-status-v12{font-size:12px!important}
  body.salonhero-ui .inventory-threshold-setting-v12 p{font-size:12px!important}
  body.salonhero-ui .inventory-detail-summary-v12 span{font-size:12px!important}
  body.salonhero-ui .inventory-history-v12 h3{font-size:14.5px!important}

  /* Money-card administration */
  body.salonhero-ui .money-card-summary-v8 span{font-size:12px!important}
  body.salonhero-ui .money-card-admin-table-v8 th{font-size:12.5px!important}
  body.salonhero-ui .money-card-admin-table-v8 td{font-size:13.5px!important}
  body.salonhero-ui .money-card-admin-table-v8 td small{font-size:12px!important}
  body.salonhero-ui .card-types-head-v8 p{font-size:12px!important}
  body.salonhero-ui .card-type-form-v8 label{font-size:13px!important}
  body.salonhero-ui .card-type-form-v8 small{font-size:11.5px!important}

  /* POS / invoice / payment history */
  body.salonhero-ui .pos-title h1{font-size:18px!important}
  body.salonhero-ui .pos-title p{font-size:12.5px!important}
  body.salonhero-ui .order-meta-strip{font-size:12.5px!important}
  body.salonhero-ui .cart-table-head{font-size:13.5px!important}
  body.salonhero-ui .cart-row{font-size:14px!important}
  body.salonhero-ui .cart-row small{font-size:12px!important}
  body.salonhero-ui .invoice-detail .invoice-top h2{font-size:20px!important}
  body.salonhero-ui .invoice-meta,
  body.salonhero-ui .invoice-totals{font-size:15px!important}
  body.salonhero-ui .invoice-items th{font-size:13.5px!important}
  body.salonhero-ui .invoice-items td{font-size:14.5px!important}
  body.salonhero-ui .payment-history h2{font-size:19px!important}
  body.salonhero-ui .pay-row b{font-size:14.5px!important}
  body.salonhero-ui .pay-row small{font-size:12.5px!important}

  /* Account / settings pages */
  body.salonhero-ui .account-section-title-v9 h1{font-size:21px!important}
  body.salonhero-ui .account-section-title-v9 p{font-size:13px!important}
  body.salonhero-ui .account-profile-fields-v9 label,
  body.salonhero-ui .password-form-v9 label{font-size:13.5px!important}
  body.salonhero-ui .account-access-v9 span{font-size:13px!important}
  body.salonhero-ui .account-access-v9 b{font-size:15px!important}

  /* Autosave / edit banners: still secondary, but readable on desktop. */
  body.salonhero-ui .edit-order-banner-v126 b{font-size:13.5px!important}
  body.salonhero-ui .edit-order-banner-v126 span{font-size:12.5px!important}
  body.salonhero-ui .order-autosave-v127{font-size:12px!important}
}

/* ===== Spa Sakura CRM v1.2.11 — Inter typography + POS catalog card polish ===== */
body.salonhero-ui,
body.salonhero-ui button,
body.salonhero-ui input,
body.salonhero-ui select,
body.salonhero-ui textarea{
  font-family:"Inter",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif!important;
  font-synthesis:none;
}
body.salonhero-ui{
  font-optical-sizing:auto;
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
  text-rendering:optimizeLegibility;
}
body.salonhero-ui .desktop-nav a,
body.salonhero-ui .btn,
body.salonhero-ui th{
  font-weight:600;
  letter-spacing:-.01em;
}
body.salonhero-ui .desktop-nav-menu-v8 b{font-weight:600;letter-spacing:-.012em}
body.salonhero-ui .desktop-nav-menu-v8 small{font-weight:400;letter-spacing:0}
body.salonhero-ui .page-head h1,
body.salonhero-ui .dashboard-welcome h1,
body.salonhero-ui .pos-title h1{font-weight:600;letter-spacing:-.02em}
body.salonhero-ui .money,
body.salonhero-ui .catalog-price,
body.salonhero-ui .invoice-totals strong{font-variant-numeric:tabular-nums}

/* POS catalog: replace the old full-height placeholder strip with a compact image tile. */
@media (min-width:768px){
  body.salonhero-ui .catalog-item-v4{
    grid-template-columns:68px minmax(0,1fr) auto 38px!important;
    gap:12px!important;
    min-height:98px!important;
    padding:10px 11px!important;
    border:1px solid #d6e2ea!important;
    border-radius:6px!important;
    overflow:visible!important;
    box-shadow:none!important;
  }
  body.salonhero-ui .catalog-item-v4:hover{
    border-color:#8fc9ed!important;
    background:#fafdff!important;
    box-shadow:none!important;
  }
  body.salonhero-ui .catalog-thumb{
    width:66px!important;
    height:66px!important;
    min-height:66px!important;
    align-self:center!important;
    border:1px solid #e0e8ee!important;
    border-radius:6px!important;
    background:#f7f9fb!important;
    color:#95a8b5!important;
  }
  body.salonhero-ui .catalog-thumb.product,
  body.salonhero-ui .catalog-thumb.service,
  body.salonhero-ui .catalog-thumb.card{
    background:#f7f9fb!important;
    color:#95a8b5!important;
  }
  body.salonhero-ui .catalog-thumb .ui-icon{
    width:25px!important;
    height:25px!important;
    stroke-width:1.55;
  }
  body.salonhero-ui .catalog-thumb img{
    border-radius:5px;
  }
  body.salonhero-ui .catalog-copy{
    align-self:center;
  }
  body.salonhero-ui .catalog-copy b{
    color:#147fd1!important;
    font-size:14.5px!important;
    font-weight:600!important;
    line-height:1.35!important;
    letter-spacing:-.01em;
  }
  body.salonhero-ui .catalog-copy small{
    margin-top:5px!important;
    color:#8b9aa6!important;
    font-size:12px!important;
    line-height:1.4!important;
    white-space:normal!important;
    overflow:visible!important;
    text-overflow:clip!important;
  }
  body.salonhero-ui .catalog-copy small.stock-negative-v114{
    color:#e33d3d!important;
  }
  body.salonhero-ui .catalog-price{
    color:#008b7f!important;
    font-size:14px!important;
    font-weight:700!important;
    align-self:center;
    text-align:right;
  }
  body.salonhero-ui .catalog-add{
    width:32px!important;
    height:32px!important;
    margin:0!important;
    align-self:center;
    border:1px solid #badcf1;
    border-radius:50%!important;
    background:#fff!important;
    color:#168bd8!important;
    display:grid!important;
    place-items:center!important;
    transition:background-color .14s ease,border-color .14s ease,color .14s ease;
  }
  body.salonhero-ui .catalog-add .ui-icon{
    width:15px;
    height:15px;
    stroke-width:2;
  }
  body.salonhero-ui .catalog-item-v4:hover .catalog-add{
    background:#168fe5!important;
    border-color:#168fe5!important;
    color:#fff!important;
  }
}

@media (max-width:767px){
  body.salonhero-ui .catalog-item-v4{
    border-radius:6px!important;
    box-shadow:none!important;
  }
  body.salonhero-ui .catalog-thumb{
    width:52px!important;
    height:52px!important;
    min-height:52px!important;
    border:1px solid #e0e8ee!important;
    border-radius:6px!important;
    background:#f7f9fb!important;
    color:#95a8b5!important;
  }
  body.salonhero-ui .catalog-thumb.product,
  body.salonhero-ui .catalog-thumb.service,
  body.salonhero-ui .catalog-thumb.card{background:#f7f9fb!important;color:#95a8b5!important}
  body.salonhero-ui .catalog-add{
    width:30px!important;
    height:30px!important;
    margin:0!important;
    border:1px solid #badcf1!important;
    background:#fff!important;
    color:#168bd8!important;
    border-radius:50%!important;
  }
  body.salonhero-ui .catalog-add .ui-icon{width:14px;height:14px;stroke-width:2}
  body.salonhero-ui .catalog-copy small{white-space:normal!important;text-overflow:clip!important;overflow:visible!important}
}

/* ===== Spa Sakura CRM v1.2.12 — Restore purple quick actions + refined status pills ===== */
/* Dashboard quick actions: restore the original SalonHero-like purple block style. */
body.salonhero-ui .quick-actions-grid>a,
body.salonhero-ui .quick-actions-grid>a:nth-child(2),
body.salonhero-ui .quick-actions-grid>a:nth-child(3),
body.salonhero-ui .quick-actions-grid>a:nth-child(4),
body.salonhero-ui .quick-actions-grid>a:nth-child(5){
  min-height:88px!important;
  background:#ab47bc!important;
  color:#fff!important;
  border:0!important;
  border-left:0!important;
  border-radius:2px!important;
  padding:12px 14px!important;
  gap:11px!important;
  box-shadow:none!important;
  transition:background-color .14s ease!important;
}
body.salonhero-ui .quick-actions-grid>a:hover,
body.salonhero-ui .quick-actions-grid>a:nth-child(2):hover,
body.salonhero-ui .quick-actions-grid>a:nth-child(3):hover,
body.salonhero-ui .quick-actions-grid>a:nth-child(4):hover,
body.salonhero-ui .quick-actions-grid>a:nth-child(5):hover{
  background:#9c3caf!important;
  border:0!important;
}
body.salonhero-ui .quick-actions-grid .quick-icon,
body.salonhero-ui .quick-actions-grid>a:nth-child(1) .quick-icon,
body.salonhero-ui .quick-actions-grid>a:nth-child(2) .quick-icon,
body.salonhero-ui .quick-actions-grid>a:nth-child(3) .quick-icon,
body.salonhero-ui .quick-actions-grid>a:nth-child(4) .quick-icon,
body.salonhero-ui .quick-actions-grid>a:nth-child(5) .quick-icon{
  width:44px!important;
  height:44px!important;
  min-width:44px!important;
  padding:0!important;
  border:0!important;
  border-radius:2px!important;
  background:rgba(255,255,255,.14)!important;
  color:#fff!important;
  display:grid!important;
  place-items:center!important;
}
body.salonhero-ui .quick-actions-grid b{
  color:#fff!important;
  font-weight:650!important;
}
body.salonhero-ui .quick-actions-grid small{
  color:rgba(255,255,255,.88)!important;
  opacity:1!important;
}

/* Recent invoice statuses: compact single-line pill instead of large rectangular labels. */
@media (min-width:768px){
  body.salonhero-ui .dashboard-order-row{
    grid-template-columns:38px minmax(0,1fr) auto 104px!important;
  }
}
body.salonhero-ui .dashboard-order-row>.badge{
  min-width:0!important;
  width:max-content!important;
  max-width:100%!important;
  justify-self:end!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  gap:6px!important;
  white-space:nowrap!important;
  word-break:keep-all!important;
  padding:6px 10px!important;
  border-radius:999px!important;
  border:1px solid transparent!important;
  font-size:12px!important;
  font-weight:650!important;
  line-height:1!important;
  letter-spacing:0!important;
  box-shadow:none!important;
}
body.salonhero-ui .dashboard-order-row>.badge::before{
  content:"";
  width:6px;
  height:6px;
  border-radius:50%;
  flex:0 0 6px;
  background:currentColor;
}
body.salonhero-ui .dashboard-order-row>.badge.processing{
  background:#fff7df!important;
  color:#a66a00!important;
  border-color:#f0d58d!important;
}
body.salonhero-ui .dashboard-order-row>.badge.completed{
  background:#e9f7ed!important;
  color:#2e8545!important;
  border-color:#bfe2c8!important;
}
body.salonhero-ui .dashboard-order-row>.badge.debt{
  background:#fff0f0!important;
  color:#cf3f3f!important;
  border-color:#efc1c1!important;
}
body.salonhero-ui .dashboard-order-row>.badge.cancelled{
  background:#f1f4f6!important;
  color:#667783!important;
  border-color:#d7e0e5!important;
}

@media(max-width:767px){
  body.salonhero-ui .quick-actions-grid>a,
  body.salonhero-ui .quick-actions-grid>a:nth-child(2),
  body.salonhero-ui .quick-actions-grid>a:nth-child(3),
  body.salonhero-ui .quick-actions-grid>a:nth-child(4),
  body.salonhero-ui .quick-actions-grid>a:nth-child(5){
    min-height:76px!important;
    padding:9px 10px!important;
    gap:8px!important;
  }
  body.salonhero-ui .quick-actions-grid .quick-icon{
    width:38px!important;
    min-width:38px!important;
    height:38px!important;
  }
  body.salonhero-ui .dashboard-order-row>.badge{
    justify-self:start!important;
    padding:5px 9px!important;
    font-size:11px!important;
  }
}

/* ===== Spa Sakura CRM v1.2.13 — Fresh multicolor dashboard quick actions ===== */
/* Inspired by SalonHero's bright flat report cards: one fresh solid color per action. */
body.salonhero-ui .quick-actions-grid>a,
body.salonhero-ui .quick-actions-grid>a:nth-child(2),
body.salonhero-ui .quick-actions-grid>a:nth-child(3),
body.salonhero-ui .quick-actions-grid>a:nth-child(4),
body.salonhero-ui .quick-actions-grid>a:nth-child(5){
  color:#fff!important;
  border:0!important;
  border-left:0!important;
  border-radius:3px!important;
  box-shadow:none!important;
  transition:filter .14s ease, transform .14s ease!important;
}
/* Tạo đơn hàng — sky blue */
body.salonhero-ui .quick-actions-grid>a:nth-child(1){background:#42a5e8!important}
/* Danh sách hóa đơn — indigo blue */
body.salonhero-ui .quick-actions-grid>a:nth-child(2){background:#4758c5!important}
/* Khách hàng — teal */
body.salonhero-ui .quick-actions-grid>a:nth-child(3){background:#08a08d!important}
/* Báo cáo theo ngày — coral red */
body.salonhero-ui .quick-actions-grid>a:nth-child(4){background:#f3473d!important}
/* Sổ quỹ Thu/Chi — warm orange */
body.salonhero-ui .quick-actions-grid>a:nth-child(5){background:#f39a24!important}

body.salonhero-ui .quick-actions-grid>a:hover,
body.salonhero-ui .quick-actions-grid>a:nth-child(2):hover,
body.salonhero-ui .quick-actions-grid>a:nth-child(3):hover,
body.salonhero-ui .quick-actions-grid>a:nth-child(4):hover,
body.salonhero-ui .quick-actions-grid>a:nth-child(5):hover{
  filter:brightness(.94)!important;
  transform:translateY(-1px)!important;
}
body.salonhero-ui .quick-actions-grid .quick-icon,
body.salonhero-ui .quick-actions-grid>a:nth-child(1) .quick-icon,
body.salonhero-ui .quick-actions-grid>a:nth-child(2) .quick-icon,
body.salonhero-ui .quick-actions-grid>a:nth-child(3) .quick-icon,
body.salonhero-ui .quick-actions-grid>a:nth-child(4) .quick-icon,
body.salonhero-ui .quick-actions-grid>a:nth-child(5) .quick-icon{
  background:rgba(255,255,255,.16)!important;
  color:#fff!important;
  border:0!important;
}
body.salonhero-ui .quick-actions-grid b{color:#fff!important}
body.salonhero-ui .quick-actions-grid small{color:rgba(255,255,255,.92)!important;opacity:1!important}


/* ===== Spa Sakura CRM v1.2.14 — vivid hero metrics + vivid purple quick actions ===== */
/* User request: top 3 summary cards brighter and more vibrant; 5 quick actions below in vivid purple family, each card a distinct purple tone. */
body.salonhero-ui .hero-metric.metric-blue{
  background:linear-gradient(135deg,#35a9ff,#1594f2)!important;
}
body.salonhero-ui .hero-metric.metric-orange{
  background:linear-gradient(135deg,#28c7b8,#12b3a3)!important;
}
body.salonhero-ui .hero-metric.metric-red{
  background:linear-gradient(135deg,#ff7467,#f15a52)!important;
}
body.salonhero-ui .hero-metric .metric-icon{
  background:rgba(255,255,255,.18)!important;
  border:1px solid rgba(255,255,255,.22)!important;
}
body.salonhero-ui .hero-metric strong,
body.salonhero-ui .hero-metric span,
body.salonhero-ui .hero-metric small{color:#fff!important}

body.salonhero-ui .quick-actions-grid>a,
body.salonhero-ui .quick-actions-grid>a:nth-child(2),
body.salonhero-ui .quick-actions-grid>a:nth-child(3),
body.salonhero-ui .quick-actions-grid>a:nth-child(4),
body.salonhero-ui .quick-actions-grid>a:nth-child(5){
  min-height:88px!important;
  border:0!important;
  border-left:0!important;
  border-radius:6px!important;
  color:#fff!important;
  box-shadow:0 3px 10px rgba(90,64,160,.10)!important;
  transition:transform .15s ease,filter .15s ease,box-shadow .15s ease!important;
}
body.salonhero-ui .quick-actions-grid>a:nth-child(1){background:linear-gradient(135deg,#8b5cf6,#7c3aed)!important}
body.salonhero-ui .quick-actions-grid>a:nth-child(2){background:linear-gradient(135deg,#a855f7,#9333ea)!important}
body.salonhero-ui .quick-actions-grid>a:nth-child(3){background:linear-gradient(135deg,#c026d3,#a21caf)!important}
body.salonhero-ui .quick-actions-grid>a:nth-child(4){background:linear-gradient(135deg,#7c3aed,#6d28d9)!important}
body.salonhero-ui .quick-actions-grid>a:nth-child(5){background:linear-gradient(135deg,#9333ea,#7e22ce)!important}

body.salonhero-ui .quick-actions-grid>a:nth-child(1):hover{filter:brightness(1.04)!important;transform:translateY(-1px)!important}
body.salonhero-ui .quick-actions-grid>a:nth-child(2):hover{filter:brightness(1.04)!important;transform:translateY(-1px)!important}
body.salonhero-ui .quick-actions-grid>a:nth-child(3):hover{filter:brightness(1.04)!important;transform:translateY(-1px)!important}
body.salonhero-ui .quick-actions-grid>a:nth-child(4):hover{filter:brightness(1.04)!important;transform:translateY(-1px)!important}
body.salonhero-ui .quick-actions-grid>a:nth-child(5):hover{filter:brightness(1.04)!important;transform:translateY(-1px)!important}

body.salonhero-ui .quick-actions-grid .quick-icon{
  width:48px!important;
  height:48px!important;
  min-width:48px!important;
  border-radius:8px!important;
  background:rgba(255,255,255,.15)!important;
  color:#fff!important;
  border:1px solid rgba(255,255,255,.12)!important;
  box-shadow:none!important;
}
body.salonhero-ui .quick-actions-grid b{color:#fff!important;font-size:13px!important;font-weight:700!important}
body.salonhero-ui .quick-actions-grid small{color:rgba(255,255,255,.93)!important;font-size:10.5px!important;opacity:1!important}

@media(max-width:767px){
  body.salonhero-ui .quick-actions-grid>a,
  body.salonhero-ui .quick-actions-grid>a:nth-child(2),
  body.salonhero-ui .quick-actions-grid>a:nth-child(3),
  body.salonhero-ui .quick-actions-grid>a:nth-child(4),
  body.salonhero-ui .quick-actions-grid>a:nth-child(5){
    min-height:76px!important;
    padding:10px!important;
    gap:8px!important;
  }
  body.salonhero-ui .quick-actions-grid .quick-icon{
    width:40px!important;
    min-width:40px!important;
    height:40px!important;
    border-radius:7px!important;
  }
}


/* ===== Spa Sakura CRM v1.2.15 — fix quick action hover background conflict ===== */
/* Các rule hover cũ từ palette pastel vẫn còn background !important.
   Ghi đè rõ từng card để khi rê chuột vẫn giữ đúng họ màu tím, chỉ sáng nhẹ. */
body.salonhero-ui .quick-actions-grid>a:nth-child(1):hover{
  background:linear-gradient(135deg,#9367f7,#8247ee)!important;
  filter:none!important;
  transform:translateY(-1px)!important;
  box-shadow:0 5px 14px rgba(124,58,237,.18)!important;
}
body.salonhero-ui .quick-actions-grid>a:nth-child(2):hover{
  background:linear-gradient(135deg,#b060f8,#9b3dec)!important;
  filter:none!important;
  transform:translateY(-1px)!important;
  box-shadow:0 5px 14px rgba(147,51,234,.18)!important;
}
body.salonhero-ui .quick-actions-grid>a:nth-child(3):hover{
  background:linear-gradient(135deg,#ca35dc,#aa24b8)!important;
  filter:none!important;
  transform:translateY(-1px)!important;
  box-shadow:0 5px 14px rgba(162,28,175,.18)!important;
}
body.salonhero-ui .quick-actions-grid>a:nth-child(4):hover{
  background:linear-gradient(135deg,#8550ef,#7332dd)!important;
  filter:none!important;
  transform:translateY(-1px)!important;
  box-shadow:0 5px 14px rgba(109,40,217,.18)!important;
}
body.salonhero-ui .quick-actions-grid>a:nth-child(5):hover{
  background:linear-gradient(135deg,#9d43ec,#862bd1)!important;
  filter:none!important;
  transform:translateY(-1px)!important;
  box-shadow:0 5px 14px rgba(126,34,206,.18)!important;
}

/* ===== Spa Sakura CRM v1.2.16 — revert dashboard cards to fresh solid colors (no gradients) ===== */
/* User request: quick action cards and top summary cards must use fresh vivid SOLID colors like SalonHero-style report blocks, not linear gradients. */
body.salonhero-ui .hero-metric.metric-blue{
  background:#4aa0e6!important;
}
body.salonhero-ui .hero-metric.metric-orange{
  background:#18b3a5!important;
}
body.salonhero-ui .hero-metric.metric-red{
  background:#ff4a3d!important;
}
body.salonhero-ui .hero-metric.metric-blue:hover{
  background:#4297dc!important;
}
body.salonhero-ui .hero-metric.metric-orange:hover{
  background:#13a596!important;
}
body.salonhero-ui .hero-metric.metric-red:hover{
  background:#f34033!important;
}
body.salonhero-ui .hero-metric,
body.salonhero-ui .hero-metric:hover{
  background-image:none!important;
}
body.salonhero-ui .hero-metric .metric-icon{
  background:rgba(255,255,255,.14)!important;
  border:1px solid rgba(255,255,255,.2)!important;
}
body.salonhero-ui .hero-metric strong,
body.salonhero-ui .hero-metric span,
body.salonhero-ui .hero-metric small,
body.salonhero-ui .hero-metric b,
body.salonhero-ui .hero-metric h3{
  color:#fff!important;
}

body.salonhero-ui .quick-actions-grid>a,
body.salonhero-ui .quick-actions-grid>a:nth-child(2),
body.salonhero-ui .quick-actions-grid>a:nth-child(3),
body.salonhero-ui .quick-actions-grid>a:nth-child(4),
body.salonhero-ui .quick-actions-grid>a:nth-child(5){
  background-image:none!important;
  color:#fff!important;
  border:0!important;
  box-shadow:none!important;
}
body.salonhero-ui .quick-actions-grid>a:nth-child(1){background:#4aa0e6!important}
body.salonhero-ui .quick-actions-grid>a:nth-child(2){background:#4b55c6!important}
body.salonhero-ui .quick-actions-grid>a:nth-child(3){background:#08a79c!important}
body.salonhero-ui .quick-actions-grid>a:nth-child(4){background:#ff4a3d!important}
body.salonhero-ui .quick-actions-grid>a:nth-child(5){background:#f2a228!important}

body.salonhero-ui .quick-actions-grid>a:nth-child(1):hover{background:#4297dc!important;filter:none!important;transform:translateY(-1px)!important;box-shadow:none!important}
body.salonhero-ui .quick-actions-grid>a:nth-child(2):hover{background:#434dbc!important;filter:none!important;transform:translateY(-1px)!important;box-shadow:none!important}
body.salonhero-ui .quick-actions-grid>a:nth-child(3):hover{background:#079d93!important;filter:none!important;transform:translateY(-1px)!important;box-shadow:none!important}
body.salonhero-ui .quick-actions-grid>a:nth-child(4):hover{background:#f34033!important;filter:none!important;transform:translateY(-1px)!important;box-shadow:none!important}
body.salonhero-ui .quick-actions-grid>a:nth-child(5):hover{background:#e8961c!important;filter:none!important;transform:translateY(-1px)!important;box-shadow:none!important}

body.salonhero-ui .quick-actions-grid .quick-icon{
  background:rgba(255,255,255,.14)!important;
  color:#fff!important;
  border:1px solid rgba(255,255,255,.16)!important;
}
body.salonhero-ui .quick-actions-grid b,
body.salonhero-ui .quick-actions-grid small{
  color:#fff!important;
  opacity:1!important;
}


/* ===== Spa Sakura CRM v1.2.17 — cache + solid dashboard color hard fix ===== */
/* Final override. Absolutely no gradient on the 3 hero cards or 5 quick action cards. */
body.salonhero-ui .hero-metric.metric-blue{background:#45A7E8!important;background-image:none!important}
body.salonhero-ui .hero-metric.metric-orange{background:#0BA79A!important;background-image:none!important}
body.salonhero-ui .hero-metric.metric-red{background:#F5453B!important;background-image:none!important}
body.salonhero-ui .hero-metric.metric-blue:hover{background:#3B9DDE!important;background-image:none!important}
body.salonhero-ui .hero-metric.metric-orange:hover{background:#079B8F!important;background-image:none!important}
body.salonhero-ui .hero-metric.metric-red:hover{background:#E93D34!important;background-image:none!important}

body.salonhero-ui .quick-actions-grid>a:nth-child(1){background:#45A7E8!important;background-image:none!important}
body.salonhero-ui .quick-actions-grid>a:nth-child(2){background:#4657C8!important;background-image:none!important}
body.salonhero-ui .quick-actions-grid>a:nth-child(3){background:#08A79C!important;background-image:none!important}
body.salonhero-ui .quick-actions-grid>a:nth-child(4){background:#F5453B!important;background-image:none!important}
body.salonhero-ui .quick-actions-grid>a:nth-child(5){background:#F3A126!important;background-image:none!important}
body.salonhero-ui .quick-actions-grid>a:nth-child(1):hover{background:#3B9DDE!important;background-image:none!important;filter:none!important;box-shadow:none!important}
body.salonhero-ui .quick-actions-grid>a:nth-child(2):hover{background:#3D4DBA!important;background-image:none!important;filter:none!important;box-shadow:none!important}
body.salonhero-ui .quick-actions-grid>a:nth-child(3):hover{background:#079B91!important;background-image:none!important;filter:none!important;box-shadow:none!important}
body.salonhero-ui .quick-actions-grid>a:nth-child(4):hover{background:#E93D34!important;background-image:none!important;filter:none!important;box-shadow:none!important}
body.salonhero-ui .quick-actions-grid>a:nth-child(5):hover{background:#E7951C!important;background-image:none!important;filter:none!important;box-shadow:none!important}

/* ===== Spa Sakura CRM v1.2.18 — unique colors for Customer + Daily Report quick cards ===== */
/* Keep all cards solid. Change only the two duplicate-looking quick actions. */
body.salonhero-ui .quick-actions-grid>a:nth-child(3){
  background:#8E44EC!important;
  background-image:none!important;
}
body.salonhero-ui .quick-actions-grid>a:nth-child(4){
  background:#E83E8C!important;
  background-image:none!important;
}
body.salonhero-ui .quick-actions-grid>a:nth-child(3):hover{
  background:#7D39D8!important;
  background-image:none!important;
  filter:none!important;
  box-shadow:none!important;
}
body.salonhero-ui .quick-actions-grid>a:nth-child(4):hover{
  background:#D8317B!important;
  background-image:none!important;
  filter:none!important;
  box-shadow:none!important;
}


/* ===== Spa Sakura CRM v1.2.19 — Dashboard card cleanup ===== */
/* 1) Large Customer summary uses the exact requested yellow.
   2) Remove the duplicate small Customer shortcut in HTML.
   3) Daily Report and Cashbook use the exact requested colors.
   4) Use explicit classes so removing one shortcut cannot shift nth-child colors. */
body.salonhero-ui .hero-metric.metric-orange{
  background:#ffca0a!important;
  background-image:none!important;
  color:#26394a!important;
}
body.salonhero-ui .hero-metric.metric-orange:hover{
  background:#f2bd00!important;
  background-image:none!important;
}
body.salonhero-ui .hero-metric.metric-orange span,
body.salonhero-ui .hero-metric.metric-orange strong,
body.salonhero-ui .hero-metric.metric-orange small,
body.salonhero-ui .hero-metric.metric-orange b,
body.salonhero-ui .hero-metric.metric-orange h3{
  color:#26394a!important;
}
body.salonhero-ui .hero-metric.metric-orange .metric-icon{
  background:rgba(255,255,255,.34)!important;
  border-color:rgba(255,255,255,.42)!important;
  color:#26394a!important;
}

body.salonhero-ui .quick-actions-grid.quick-actions-grid-v1219{
  grid-template-columns:repeat(4,minmax(0,1fr))!important;
}
body.salonhero-ui .quick-actions-grid-v1219>a{
  background-image:none!important;
  border:0!important;
  box-shadow:none!important;
}
body.salonhero-ui .quick-actions-grid-v1219>a.quick-order-v1219{
  background:#45A7E8!important;
  color:#fff!important;
}
body.salonhero-ui .quick-actions-grid-v1219>a.quick-orders-v1219{
  background:#4657C8!important;
  color:#fff!important;
}
body.salonhero-ui .quick-actions-grid-v1219>a.quick-report-v1219{
  background:#3fe0d0!important;
  color:#173c43!important;
}
body.salonhero-ui .quick-actions-grid-v1219>a.quick-cashbook-v1219{
  background:#4169e3!important;
  color:#fff!important;
}
body.salonhero-ui .quick-actions-grid-v1219>a.quick-order-v1219:hover{
  background:#3B9DDE!important;background-image:none!important;filter:none!important;box-shadow:none!important;
}
body.salonhero-ui .quick-actions-grid-v1219>a.quick-orders-v1219:hover{
  background:#3D4DBA!important;background-image:none!important;filter:none!important;box-shadow:none!important;
}
body.salonhero-ui .quick-actions-grid-v1219>a.quick-report-v1219:hover{
  background:#31d2c3!important;background-image:none!important;filter:none!important;box-shadow:none!important;
}
body.salonhero-ui .quick-actions-grid-v1219>a.quick-cashbook-v1219:hover{
  background:#365ed4!important;background-image:none!important;filter:none!important;box-shadow:none!important;
}
body.salonhero-ui .quick-actions-grid-v1219>a.quick-report-v1219 b,
body.salonhero-ui .quick-actions-grid-v1219>a.quick-report-v1219 small{
  color:#173c43!important;
}
body.salonhero-ui .quick-actions-grid-v1219>a.quick-report-v1219 .quick-icon{
  background:rgba(255,255,255,.30)!important;
  border-color:rgba(255,255,255,.38)!important;
  color:#173c43!important;
}
body.salonhero-ui .quick-actions-grid-v1219>a.quick-order-v1219 b,
body.salonhero-ui .quick-actions-grid-v1219>a.quick-order-v1219 small,
body.salonhero-ui .quick-actions-grid-v1219>a.quick-orders-v1219 b,
body.salonhero-ui .quick-actions-grid-v1219>a.quick-orders-v1219 small,
body.salonhero-ui .quick-actions-grid-v1219>a.quick-cashbook-v1219 b,
body.salonhero-ui .quick-actions-grid-v1219>a.quick-cashbook-v1219 small{
  color:#fff!important;
}

@media(max-width:1100px){
  body.salonhero-ui .quick-actions-grid.quick-actions-grid-v1219{grid-template-columns:repeat(2,minmax(0,1fr))!important}
}
@media(max-width:767px){
  body.salonhero-ui .quick-actions-grid.quick-actions-grid-v1219{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  body.salonhero-ui .quick-actions-grid-v1219>a{grid-column:auto!important}
}


/* ===== Spa Sakura CRM v1.2.20 — Debt collection center ===== */
.debt-page-head-v120{align-items:flex-end}.debt-summary-v120{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin:0 0 10px}.debt-summary-v120>div{padding:16px 18px;color:#fff;border-radius:3px}.debt-summary-v120>div:nth-child(1){background:#ff4a3d}.debt-summary-v120>div:nth-child(2){background:#3fe0d0;color:#17474a}.debt-summary-v120>div:nth-child(3){background:#4169e3}.debt-summary-v120 span{display:block;font-size:12px;font-weight:700;margin-bottom:6px}.debt-summary-v120 strong{font-size:25px;line-height:1;font-weight:700}.debt-center-v120{padding:0;overflow:hidden}.debt-tabs-v120{display:flex;border-bottom:1px solid #d8e2ea;background:#fff}.debt-tabs-v120 a{min-width:260px;text-align:center;padding:13px 18px;color:#536a7c;text-decoration:none;font-weight:600;border-right:1px solid #d8e2ea}.debt-tabs-v120 a.active{background:#2196e5;color:#fff}.debt-filters-v120{display:flex;gap:10px;align-items:flex-end;padding:14px;background:#f8fbfd;border-bottom:1px solid #d8e2ea}.debt-filters-v120 label{display:flex;flex-direction:column;gap:5px;min-width:180px;color:#526c80}.debt-filters-v120 label.grow{flex:1}.debt-filters-v120 input,.debt-filters-v120 select{height:42px}.debt-table-wrap-v120{overflow:auto}.debt-table-v120{width:100%;border-collapse:collapse;min-width:1200px}.debt-table-v120 th{background:#f2f6f9;color:#486176;text-align:left;font-weight:600;padding:11px 12px;border-bottom:1px solid #cfdce5;white-space:nowrap}.debt-table-v120 td{padding:12px;border-bottom:1px solid #dce5eb;vertical-align:middle}.debt-table-v120 td b{display:block}.debt-table-v120 td small{display:block;color:#8798a7;margin-top:3px}.debt-table-v120 td a:not(.btn){color:#168be0;text-decoration:none}.money-cell-v120{font-weight:700;white-space:nowrap}.money-cell-v120.paid{color:#009c8e}.money-cell-v120.debt{color:#f44336}.debt-actions-cell-v120{display:flex;gap:6px;white-space:nowrap}.empty-cell-v120{text-align:center!important;color:#94a5b3;padding:30px!important}.debt-history-total-v120{display:flex;justify-content:space-between;align-items:center;background:#08a8e8;color:#fff;padding:10px 15px;font-weight:600}.debt-history-total-v120 strong{font-size:20px}.debt-payment-box-v120{max-width:700px}.debt-payment-form-grid-v120{display:grid;grid-template-columns:1fr 1fr;gap:13px}.debt-payment-form-grid-v120 .span-2{grid-column:1/-1}.debt-payment-form-grid-v120 label{display:flex;flex-direction:column;gap:6px}.debt-modal-remaining-v120{display:flex;justify-content:space-between;align-items:center;padding:12px 14px;background:#fff5f4;border:1px solid #ffc9c5}.debt-modal-remaining-v120 strong{font-size:20px;color:#f44336}.debt-confirm-box-v120{max-width:520px;text-align:left}.debt-confirm-box-v120 h2{margin:0 0 8px}.debt-side-heading-v120{display:flex;justify-content:space-between;align-items:center;gap:10px}.debt-side-heading-v120 a{font-size:12px;color:#168be0;text-decoration:none}.debt-payment-tag-v120{font-size:10px;background:#e9f8f5;color:#0a9687;border:1px solid #bde9e2;border-radius:10px;padding:2px 6px;margin-left:4px}.pay-row-amount-v120{text-align:right}.pay-row-amount-v120 a{display:block;margin-top:5px;font-size:11px;color:#168be0;text-decoration:none}.debt-history-v120 #debtForm{display:grid;gap:10px}.debt-history-v120 #debtForm label{display:flex;flex-direction:column;gap:5px}
@media(max-width:900px){.debt-summary-v120{grid-template-columns:1fr 1fr}.debt-summary-v120>div:first-child{grid-column:1/-1}.debt-tabs-v120 a{min-width:0;flex:1;padding:11px 8px}.debt-filters-v120{flex-wrap:wrap}.debt-filters-v120 label,.debt-filters-v120 label.grow{min-width:calc(50% - 5px);flex:1}.debt-payment-form-grid-v120{grid-template-columns:1fr}.debt-payment-form-grid-v120 .span-2{grid-column:auto}}
@media(max-width:600px){.debt-summary-v120{grid-template-columns:1fr}.debt-summary-v120>div:first-child{grid-column:auto}.debt-summary-v120 strong{font-size:22px}.debt-filters-v120 label,.debt-filters-v120 label.grow{min-width:100%}.debt-filters-v120 .btn{flex:1}.debt-table-v120{min-width:980px}.debt-page-head-v120{align-items:flex-start}.debt-page-head-v120 .btn{width:100%;text-align:center}.debt-confirm-box-v120{width:calc(100vw - 28px)}}

/* ===== Spa Sakura CRM v1.2.21 — debt is a financial condition, not workflow status ===== */
body.salonhero-ui .status-badge-stack-v121,
body.salonhero-ui .invoice-statuses-v121,
body.salonhero-ui .dashboard-order-statuses-v121,
body.salonhero-ui .day-order-statuses-v121{
  display:inline-flex;
  align-items:center;
  gap:6px;
  flex-wrap:nowrap;
  white-space:nowrap;
}
body.salonhero-ui .status-badge-stack-v121 .badge,
body.salonhero-ui .invoice-statuses-v121 .badge,
body.salonhero-ui .day-order-statuses-v121 .badge{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  white-space:nowrap;
}
body.salonhero-ui .debt-condition-v121{
  background:#ffebe9!important;
  color:#e53935!important;
  border:1px solid #ffc5c0!important;
}
body.salonhero-ui .invoice-statuses-v121{justify-content:flex-end}
body.salonhero-ui .dashboard-order-statuses-v121{
  justify-self:end;
  display:flex;
  gap:5px;
}
body.salonhero-ui .dashboard-order-statuses-v121 .badge{
  min-width:0!important;
  width:max-content!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  gap:5px!important;
  white-space:nowrap!important;
  padding:6px 9px!important;
  border-radius:999px!important;
  border:1px solid transparent!important;
  font-size:11.5px!important;
  font-weight:650!important;
  line-height:1!important;
}
body.salonhero-ui .dashboard-order-statuses-v121 .badge.completed{
  background:#e9f7ed!important;
  color:#2e8545!important;
  border-color:#bfe2c8!important;
}
body.salonhero-ui .dashboard-order-statuses-v121 .badge.debt{
  background:#fff0f0!important;
  color:#cf3f3f!important;
  border-color:#efc1c1!important;
}
body.salonhero-ui .dashboard-order-statuses-v121 .badge::before{
  content:"";
  width:6px;
  height:6px;
  border-radius:50%;
  flex:0 0 6px;
  background:currentColor;
}
body.salonhero-ui .debt-main-actions-v121{
  display:flex;
  align-items:center;
  gap:9px;
  flex-wrap:wrap;
}
body.salonhero-ui .debt-main-actions-v121 .btn.danger,
body.salonhero-ui .debt-pay-trigger-v121{
  background:#ff4248!important;
  border-color:#ff4248!important;
  color:#fff!important;
}
body.salonhero-ui .debt-main-actions-v121 .btn.danger:hover,
body.salonhero-ui .debt-pay-trigger-v121:hover{
  background:#ed333a!important;
  border-color:#ed333a!important;
}
body.salonhero-ui .debt-side-cta-v121{
  display:grid;
  gap:11px;
}
body.salonhero-ui .debt-side-cta-v121 b{display:block;color:#334e61;margin-bottom:3px}
body.salonhero-ui .debt-side-cta-v121 small{display:block;color:#8396a5;line-height:1.45}
body.salonhero-ui .debt-payment-box-v121{width:min(620px,100%)}
body.salonhero-ui .debt-modal-summary-v121{
  margin:10px 0 16px;
  padding:13px 15px;
  background:#fff5f4;
  border:1px solid #ffd2ce;
  border-radius:6px;
  display:grid;
  grid-template-columns:1fr auto;
  gap:3px 12px;
  align-items:center;
}
body.salonhero-ui .debt-modal-summary-v121 span{color:#6f8392;font-size:13px}
body.salonhero-ui .debt-modal-summary-v121 strong{color:#ef3f43;font-size:22px}
body.salonhero-ui .debt-modal-summary-v121 small{grid-column:1/-1;color:#8797a3;font-size:12px}

@media (min-width:768px){
  body.salonhero-ui .dashboard-order-row{
    grid-template-columns:38px minmax(0,1fr) auto minmax(150px,max-content)!important;
  }
}
@media (max-width:767px){
  body.salonhero-ui .dashboard-order-statuses-v121{
    grid-column:2/4;
    justify-self:start;
    flex-wrap:wrap;
  }
  body.salonhero-ui .invoice-statuses-v121{gap:4px}
  body.salonhero-ui .status-badge-stack-v121{gap:4px}
  body.salonhero-ui .debt-main-actions-v121{
    display:grid;
    grid-template-columns:1fr;
  }
  body.salonhero-ui .debt-payment-box-v121{border-radius:16px 16px 0 0}
  body.salonhero-ui .debt-modal-summary-v121 strong{font-size:19px}
}

/* ===== Spa Sakura CRM v1.3.0 — Multi Spa Login / database isolation ===== */
.login-body-v13{background:#147fae!important;padding:24px}
.login-card-v13{width:min(560px,94vw)!important;padding:34px 36px!important;border-radius:10px!important;border:0!important;box-shadow:0 18px 50px rgba(10,55,82,.24)!important}
.login-card-v13 .login-logo{margin-bottom:22px}
.login-card-v13 h1{font-size:28px;margin:0 0 6px;color:#20384d}
.login-card-v13>p{font-size:14px;margin-bottom:22px}
.login-branch-title-v13{font-size:13px;font-weight:700;color:#4d6578;margin:2px 0 9px}
.login-branch-grid-v13{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-bottom:18px}
.login-branch-card-v13{position:relative!important;display:grid!important;grid-template-columns:42px 1fr!important;align-items:center;gap:11px!important;margin:0!important;padding:13px!important;border:1px solid #d2dfe8;border-radius:7px;cursor:pointer;background:#fff;color:#2c4459!important;min-height:76px;transition:border-color .15s ease,background .15s ease}
.login-branch-card-v13:hover{border-color:#3c9bd3;background:#f7fcff}
.login-branch-card-v13 input{position:absolute;opacity:0;pointer-events:none;width:1px;height:1px}
.login-branch-card-v13:has(input:checked){border-color:#1595df;background:#eef9ff;box-shadow:inset 0 0 0 1px #1595df}
.login-branch-icon-v13{width:42px;height:42px;display:grid;place-items:center;background:#e9f6fd;color:#1188cf;border-radius:50%;font-size:22px;font-weight:700}
.login-branch-card-v13 b{display:block;font-size:14px;color:#263f53;margin-bottom:3px}
.login-branch-card-v13 small{display:block;color:#8292a0;font-size:11.5px;line-height:1.35}
.login-branch-check-v13{position:absolute;right:8px;top:7px;width:19px;height:19px;border-radius:50%;display:none;place-items:center;background:#1595df;color:#fff;font-size:12px;font-weight:800}
.login-branch-card-v13:has(input:checked) .login-branch-check-v13{display:grid}
.login-multispa-note-v13{margin-top:18px;padding-top:14px;border-top:1px solid #e1e9ef;color:#8a98a5;font-size:11.5px;text-align:center}

.branch-switcher-v13{position:relative;height:100%;display:flex;align-items:center}
.branch-switcher-button-v13{font:inherit;border:0;cursor:pointer;color:#fff}
.branch-switcher-menu-v13{display:none;position:absolute;right:0;top:calc(100% - 2px);width:310px;background:#fff;border:1px solid #cbdbe5;z-index:90;color:#36536b;box-shadow:0 8px 18px rgba(20,70,105,.12);padding:8px}
.branch-switcher-v13:hover .branch-switcher-menu-v13,.branch-switcher-v13:focus-within .branch-switcher-menu-v13{display:block}
.branch-switcher-head-v13{padding:8px 9px 10px;border-bottom:1px solid #e5edf2;margin-bottom:4px}
.branch-switcher-head-v13 b{display:block;font-size:13.5px;color:#24465e}
.branch-switcher-head-v13 small{display:block;margin-top:3px;font-size:11px;color:#8b9ba8}
.branch-switcher-menu-v13 form{margin:0}
.branch-switch-option-v13{width:100%;border:0;background:#fff;display:grid;grid-template-columns:34px 1fr auto;gap:9px;align-items:center;text-align:left;padding:10px 9px;cursor:pointer;color:#36536b;font:inherit}
.branch-switch-option-v13:hover{background:#f0f8fc}
.branch-switch-option-v13.active{background:#e9f6fd}
.branch-switch-option-v13>span:first-child{width:32px;height:32px;border-radius:50%;display:grid;place-items:center;background:#e5f3fa;color:#1284bf}
.branch-switch-option-v13 b{display:block;font-size:13px}
.branch-switch-option-v13 small{display:block;font-size:10.5px;color:#8999a6;margin-top:2px}
.branch-switch-option-v13 em{font-style:normal;color:#1595df;font-weight:800}

.multispa-setup-v13,.multispa-enabled-v13{max-width:1180px;margin:0 auto}
.multispa-setup-intro-v13,.multispa-enabled-head-v13{display:flex;align-items:center;gap:16px;padding:5px 2px 20px;border-bottom:1px solid #dde7ee;margin-bottom:4px}
.multispa-setup-icon-v13,.multispa-ok-v13{width:52px;height:52px;min-width:52px;border-radius:50%;display:grid;place-items:center;background:#1595df;color:#fff;font-size:24px;font-weight:800}
.multispa-ok-v13{background:#20b46b}
.multispa-setup-intro-v13 h2,.multispa-enabled-head-v13 h2{margin:0 0 5px;font-size:20px;color:#29465c}
.multispa-setup-intro-v13 p,.multispa-enabled-head-v13 p{margin:0;color:#7a8e9d;line-height:1.5}
.multispa-step-v13{display:grid;grid-template-columns:44px 1fr;gap:14px;padding:22px 2px;border-bottom:1px solid #e3ebf0}
.multispa-step-v13>span{width:36px;height:36px;border-radius:50%;display:grid;place-items:center;background:#e7f5fd;color:#1187ca;font-weight:800;font-size:15px}
.multispa-step-v13 h3{margin:0 0 5px;font-size:16px;color:#2c485e}
.multispa-step-v13 p{margin:0 0 14px;color:#7e909e;font-size:12.5px}
.multispa-current-choice-v13{display:grid;grid-template-columns:1fr 1fr;gap:10px;max-width:720px}
.multispa-current-choice-v13 label{position:relative;display:block;margin:0;color:#2c475b}
.multispa-current-choice-v13 input{position:absolute;opacity:0}
.multispa-current-choice-v13 label span{display:block;padding:13px 15px;border:1px solid #cedce6;background:#fff;cursor:pointer}
.multispa-current-choice-v13 label input:checked+span{border-color:#1595df;background:#eff9ff;box-shadow:inset 0 0 0 1px #1595df}
.multispa-current-choice-v13 b{display:block;font-size:13.5px}
.multispa-current-choice-v13 small{display:block;margin-top:4px;color:#8293a0;font-size:11.5px}
.multispa-two-col-v13,.multispa-db-grid-v13{display:grid;grid-template-columns:1fr 1fr;gap:12px 14px;max-width:920px}
.multispa-two-col-v13 label,.multispa-db-grid-v13 label,.multispa-owner-input-v13{display:grid;gap:6px;margin:0;color:#60778a;font-size:12.5px}
.multispa-two-col-v13 input,.multispa-db-grid-v13 input,.multispa-owner-input-v13 input{min-height:43px;border:1px solid #cbdbe5;padding:9px 11px;font:inherit;background:#fff}
.multispa-init-check-v13{display:flex!important;align-items:flex-start;gap:10px!important;margin:14px 0 0!important;padding:12px 14px;background:#f5fafc;border:1px solid #dde8ee;max-width:920px;color:#405b70!important}
.multispa-init-check-v13 input{width:17px;height:17px;margin-top:2px}
.multispa-init-check-v13 b{display:block;font-size:12.5px}.multispa-init-check-v13 small{display:block;color:#81929f;font-size:11px;margin-top:3px}
.multispa-owner-input-v13{max-width:520px}
.multispa-final-v13{display:flex;align-items:center;justify-content:space-between;gap:18px;padding:20px 2px 4px}
.multispa-final-v13>div{display:grid;gap:4px}.multispa-final-v13 span{color:#7f919f;font-size:12px}.multispa-final-v13 .btn{min-height:44px;padding-left:22px;padding-right:22px}
.multispa-branch-summary-v13{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:18px}
.multispa-branch-summary-v13 article{position:relative;display:grid;grid-template-columns:48px 1fr auto;gap:13px;align-items:center;border:1px solid #d5e2ea;padding:16px;background:#fbfdfe}
.multispa-branch-badge-v13{width:46px;height:46px;border-radius:50%;display:grid;place-items:center;background:#1595df;color:#fff;font-weight:800;font-size:12px}
.multispa-branch-summary-v13 h3{margin:0 0 4px;font-size:15px;color:#2b465b}.multispa-branch-summary-v13 p{margin:0 0 5px;color:#81919d;font-size:11.5px}.multispa-branch-summary-v13 small{color:#667d90}
.current-branch-v13{padding:5px 8px;background:#e5f7ec;color:#23844b;font-size:10.5px;font-weight:700;border-radius:12px}
.multispa-owner-v13,.multispa-security-v13{margin-top:14px;padding:13px 15px;background:#f5f9fc;border:1px solid #dde8ef;color:#60788a;font-size:12px}
.multispa-owner-v13{display:flex;gap:8px;flex-wrap:wrap}.multispa-owner-v13 b{color:#2d5068}
.multispa-security-v13{line-height:1.55;background:#fff9e8;border-color:#f2dda3;color:#77622a}

@media(max-width:767px){
  .login-body-v13{padding:0;background:#fff!important;align-items:start!important}
  .login-card-v13{width:100%!important;max-width:none!important;padding:28px 18px 36px!important;border-radius:0!important;box-shadow:none!important}
  .login-branch-grid-v13{grid-template-columns:1fr}
  .login-branch-card-v13{min-height:68px}
  .multispa-current-choice-v13,.multispa-two-col-v13,.multispa-db-grid-v13,.multispa-branch-summary-v13{grid-template-columns:1fr}
  .multispa-step-v13{grid-template-columns:34px 1fr;gap:9px;padding:18px 0}.multispa-step-v13>span{width:30px;height:30px}
  .multispa-final-v13{align-items:stretch;flex-direction:column}.multispa-final-v13 .btn{width:100%}
  .branch-switcher-v13{display:none}
}

/* ===== Spa Sakura CRM v1.3.2 — Branch selector refresh only =====
   Giữ nguyên toàn bộ giao diện đăng nhập v1.3.0; chỉ thiết kế lại phần chọn cơ sở. */
.login-branch-select-v132{margin:2px 0 18px}
.login-branch-head-v132{display:flex;align-items:flex-end;justify-content:space-between;gap:12px;margin:0 0 10px}
.login-branch-head-v132>div{display:grid;gap:2px;min-width:0}
.login-branch-head-v132 strong{font-size:13px;line-height:1.25;color:#40596e;font-weight:700}
.login-branch-head-v132 small{font-size:11px;line-height:1.35;color:#91a0ad}
.login-branch-count-v132{display:inline-flex;align-items:center;gap:5px;padding:5px 8px;border:1px solid #dce8ef;border-radius:999px;background:#f7fbfd;color:#6c8799;font-size:10.5px;font-weight:650;white-space:nowrap}
.login-branch-count-v132 svg{width:13px;height:13px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.login-branch-grid-v132{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.login-branch-option-v132{position:relative!important;display:grid!important;grid-template-columns:46px minmax(0,1fr) 22px!important;align-items:center!important;gap:11px!important;min-height:78px!important;margin:0!important;padding:12px 12px!important;border:1px solid #d7e2e9!important;border-radius:9px!important;background:#fff!important;color:#2b4255!important;cursor:pointer!important;overflow:hidden!important;box-shadow:none!important;transition:border-color .15s ease,background-color .15s ease,transform .15s ease!important}
.login-branch-option-v132:hover{border-color:#72b9df!important;background:#fafdff!important;transform:translateY(-1px)!important}
.login-branch-option-v132 input{position:absolute!important;opacity:0!important;pointer-events:none!important;width:1px!important;height:1px!important}
.login-branch-option-v132:has(input:checked){border-color:#168ed2!important;background:#eef8fe!important;box-shadow:inset 0 0 0 1px rgba(22,142,210,.18)!important}
.login-branch-icon-v132{width:46px;height:46px;display:grid;place-items:center;border-radius:10px;background:#f0f6fa;color:#668397;border:1px solid #e0eaf0;transition:background-color .15s ease,border-color .15s ease,color .15s ease}
.login-branch-icon-v132 svg{width:25px;height:25px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.login-branch-option-v132:has(input:checked) .login-branch-icon-v132{background:#fff;color:#168ed2;border-color:#c8e4f4}
.login-branch-copy-v132{min-width:0;display:block}
.login-branch-copy-v132 b{display:block;margin:0 0 4px;color:#213a50;font-size:13.5px;line-height:1.25;font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.login-branch-copy-v132 small{display:block;color:#8495a4;font-size:11px;line-height:1.35;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.login-branch-check-v132{width:21px;height:21px;display:grid;place-items:center;border-radius:50%;background:#168ed2;color:#fff;opacity:0;transform:scale(.75);transition:opacity .15s ease,transform .15s ease}
.login-branch-check-v132 svg{width:13px;height:13px;fill:none;stroke:currentColor;stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round}
.login-branch-option-v132:has(input:checked) .login-branch-check-v132{opacity:1;transform:scale(1)}
@media(max-width:680px){
  .login-branch-grid-v132{grid-template-columns:1fr;gap:8px}
  .login-branch-option-v132{min-height:70px!important;grid-template-columns:42px minmax(0,1fr) 22px!important;padding:10px 11px!important}
  .login-branch-icon-v132{width:42px;height:42px;border-radius:9px}
  .login-branch-icon-v132 svg{width:23px;height:23px}
  .login-branch-count-v132{display:none}
}

/* v1.3.3 login screen refinements */
.login-body-v13{background:#1b74e4!important}
.login-branch-head-v132{align-items:flex-start}
.login-branch-head-v132 strong{font-size:13.5px;color:#2f4860}
.login-branch-head-v132 small{font-size:11.5px;color:#7f91a3}
.login-branch-option-v132{border-color:#d8e2ea!important;border-radius:12px!important;min-height:82px!important;padding:14px 14px!important;grid-template-columns:52px minmax(0,1fr) 24px!important}
.login-branch-option-v132:hover{border-color:#79b2ff!important;background:#f8fbff!important;transform:translateY(-1px)!important;box-shadow:0 6px 18px rgba(27,116,228,.08)!important}
.login-branch-option-v132:has(input:checked){border-color:#1b74e4!important;background:#eef5ff!important;box-shadow:inset 0 0 0 1px rgba(27,116,228,.15),0 8px 22px rgba(27,116,228,.10)!important}
.login-branch-icon-v132{width:52px;height:52px;border-radius:14px;background:#f2f7fb;color:#6f889d;border:1px solid #e2eaf0}
.login-branch-icon-v132 svg{width:28px;height:28px;stroke-width:1.85}
.login-branch-option-v132:has(input:checked) .login-branch-icon-v132{background:#fff;color:#1b74e4;border-color:#cfe0f8}
.login-branch-copy-v132 b{font-size:14px;color:#20354a}
.login-branch-copy-v132 small{font-size:11.5px;color:#7d8f9f}
.login-branch-check-v132{width:24px;height:24px;background:#1b74e4}
@media (max-width:760px){
  .login-body-v13{background:#1b74e4!important}
  .login-branch-option-v132{min-height:74px!important;padding:11px 12px!important;grid-template-columns:46px minmax(0,1fr) 22px!important}
  .login-branch-icon-v132{width:46px;height:46px;border-radius:12px}
  .login-branch-icon-v132 svg{width:25px;height:25px}
}


/* ===== Spa Sakura CRM v1.3.4 — supplied spa SVG + login footer ===== */
.login-body-v13{
  background:#1b74e4!important;
  position:relative!important;
  padding-bottom:62px!important;
}
.login-branch-icon-v132{
  overflow:hidden!important;
  background:#f4f8fb!important;
  border:1px solid #dfe8ef!important;
}
.login-branch-icon-v132 img{
  display:block!important;
  width:31px!important;
  height:31px!important;
  max-width:72%!important;
  max-height:72%!important;
  object-fit:contain!important;
}
.login-branch-option-v132:has(input:checked) .login-branch-icon-v132{
  background:#fff!important;
  border-color:#cbdff8!important;
}
.login-footer-v134{
  position:fixed;
  left:16px;
  right:16px;
  bottom:18px;
  z-index:2;
  text-align:center;
  color:rgba(255,255,255,.9);
  font-size:12px;
  line-height:1.35;
  font-weight:400;
  letter-spacing:.01em;
  pointer-events:none;
}
@media(max-width:767px){
  .login-body-v13{
    background:#1b74e4!important;
    padding-bottom:58px!important;
  }
  .login-branch-icon-v132 img{
    width:28px!important;
    height:28px!important;
  }
  .login-footer-v134{
    left:12px;
    right:12px;
    bottom:14px;
    font-size:11.5px;
  }
}

/* ===== Spa Sakura CRM v1.3.5 — compact branch icon + short login labels ===== */
.login-branch-option-v132{
  grid-template-columns:35px minmax(0,1fr) 24px!important;
  gap:11px!important;
}
.login-branch-icon-v132{
  width:35px!important;
  height:35px!important;
  min-width:35px!important;
  border-radius:9px!important;
}
.login-branch-icon-v132 img{
  width:23px!important;
  height:23px!important;
  max-width:23px!important;
  max-height:23px!important;
  object-fit:contain!important;
}
@media(max-width:767px){
  .login-branch-option-v132{
    grid-template-columns:35px minmax(0,1fr) 22px!important;
  }
  .login-branch-icon-v132{
    width:35px!important;
    height:35px!important;
    min-width:35px!important;
    border-radius:9px!important;
  }
  .login-branch-icon-v132 img{
    width:22px!important;
    height:22px!important;
    max-width:22px!important;
    max-height:22px!important;
  }
}

/* ===== Spa Sakura CRM v1.3.6 — mobile login shell / footer fix ===== */
@media(max-width:767px){
  html{background:#1b74e4!important}
  body.login-body-v13{
    display:flex!important;
    flex-direction:column!important;
    align-items:center!important;
    justify-content:flex-start!important;
    min-height:100vh!important;
    min-height:100svh!important;
    min-height:100dvh!important;
    width:100%!important;
    background:#1b74e4!important;
    padding:14px 12px calc(22px + env(safe-area-inset-bottom))!important;
    overflow-x:hidden!important;
  }
  body.login-body-v13 .login-card-v13{
    width:100%!important;
    max-width:560px!important;
    margin:0 auto!important;
    padding:26px 18px 30px!important;
    border-radius:14px!important;
    background:#fff!important;
    box-shadow:0 10px 30px rgba(8,55,116,.18)!important;
  }
  body.login-body-v13 .login-footer-v134{
    position:static!important;
    left:auto!important;
    right:auto!important;
    bottom:auto!important;
    width:100%!important;
    max-width:560px!important;
    margin:18px auto 0!important;
    padding:2px 8px calc(8px + env(safe-area-inset-bottom))!important;
    color:rgba(255,255,255,.94)!important;
    font-size:11.5px!important;
    line-height:1.45!important;
    text-align:center!important;
    white-space:normal!important;
    pointer-events:auto!important;
  }
}


/* ===== Spa Sakura CRM v1.3.7 — Mobile modal/action-bar safety audit =====
   Fixes action buttons hidden behind the fixed mobile navigation / iOS browser chrome.
   Applied to customer, debt, cashbook, payment, product/service, user, stock and money-card dialogs. */
@media(max-width:767px){
  body.modal-open-v137{
    overflow:hidden!important;
  }
  body.modal-open-v137 .mobile-nav,
  body.modal-open-v137 .fab{
    display:none!important;
  }

  /* Every dialog must sit above the app navigation and use the dynamic viewport. */
  body.salonhero-ui .modal,
  body .modal{
    z-index:3000!important;
    align-items:flex-end!important;
    justify-content:center!important;
    padding:8px 0 0!important;
    overflow:hidden!important;
    overscroll-behavior:contain!important;
  }
  body.salonhero-ui .modal-box,
  body .modal-box{
    width:100%!important;
    max-width:100%!important;
    max-height:calc(100dvh - 8px - env(safe-area-inset-top))!important;
    border-radius:16px 16px 0 0!important;
    overflow-y:auto!important;
    overscroll-behavior:contain!important;
    -webkit-overflow-scrolling:touch!important;
    scroll-padding-bottom:92px!important;
  }

  /* Customer add/edit/top-up dialogs: header fixed in the sheet, body scrolls, actions stay visible. */
  body.salonhero-ui .modal-box-v4,
  body .modal-box-v4{
    display:flex!important;
    flex-direction:column!important;
    overflow:hidden!important;
    max-height:calc(100dvh - 8px - env(safe-area-inset-top))!important;
  }
  body.salonhero-ui .modal-box-v4 .modal-heading,
  body .modal-box-v4 .modal-heading{
    flex:0 0 auto!important;
    padding:14px 14px!important;
  }
  body.salonhero-ui .modal-box-v4>form,
  body .modal-box-v4>form{
    display:flex!important;
    flex:1 1 auto!important;
    min-height:0!important;
    flex-direction:column!important;
    overflow-y:auto!important;
    overscroll-behavior:contain!important;
    -webkit-overflow-scrolling:touch!important;
    padding:14px 14px 0!important;
    scroll-padding-bottom:88px!important;
  }
  body.salonhero-ui .modal-box-v4 .modal-actions,
  body .modal-box-v4 .modal-actions{
    position:sticky!important;
    bottom:0!important;
    z-index:20!important;
    flex:0 0 auto!important;
    margin:16px -14px 0!important;
    padding:10px 14px calc(10px + env(safe-area-inset-bottom))!important;
    background:#fff!important;
    border-top:1px solid #dce6ec!important;
    box-shadow:0 -8px 18px rgba(37,67,87,.08)!important;
  }
  body.salonhero-ui .modal-box-v4 .modal-actions .btn,
  body .modal-box-v4 .modal-actions .btn{
    min-height:44px!important;
  }

  /* Generic dialogs such as debt collection / confirmations. */
  body.salonhero-ui .modal-box:not(.modal-box-v4) .modal-actions,
  body .modal-box:not(.modal-box-v4) .modal-actions{
    position:sticky!important;
    bottom:0!important;
    z-index:20!important;
    background:#fff!important;
    padding-bottom:calc(12px + env(safe-area-inset-bottom))!important;
  }
  body.salonhero-ui .debt-payment-form-grid-v120,
  body .debt-payment-form-grid-v120{
    grid-template-columns:1fr!important;
  }
  body.salonhero-ui .debt-payment-form-grid-v120 .span-2,
  body .debt-payment-form-grid-v120 .span-2{
    grid-column:auto!important;
  }

  /* POS payment dialog. */
  body.salonhero-ui .payment-modal-v11,
  body .payment-modal-v11{
    z-index:3000!important;
  }
  body.salonhero-ui .payment-modal-card-v11,
  body .payment-modal-card-v11{
    width:100%!important;
    max-width:100%!important;
    max-height:calc(100dvh - 8px - env(safe-area-inset-top))!important;
    border-radius:16px 16px 0 0!important;
    overflow-y:auto!important;
    -webkit-overflow-scrolling:touch!important;
    scroll-padding-bottom:96px!important;
  }
  body.salonhero-ui .payment-modal-footer-v11,
  body .payment-modal-footer-v11{
    position:sticky!important;
    bottom:0!important;
    z-index:25!important;
    padding-bottom:calc(10px + env(safe-area-inset-bottom))!important;
    box-shadow:0 -8px 18px rgba(37,67,87,.08)!important;
  }

  /* Product/service, user, stock and money-card dialogs all share catalog-modal-v8. */
  body.salonhero-ui .catalog-modal-v8,
  body .catalog-modal-v8{
    z-index:3000!important;
    padding:8px 0 0!important;
  }
  body.salonhero-ui .catalog-modal-card-v8,
  body .catalog-modal-card-v8{
    width:100%!important;
    max-width:100%!important;
    max-height:calc(100dvh - 8px - env(safe-area-inset-top))!important;
    border-radius:16px 16px 0 0!important;
    overflow-y:auto!important;
    -webkit-overflow-scrolling:touch!important;
    scroll-padding-bottom:92px!important;
  }
  body.salonhero-ui .catalog-modal-footer-v8,
  body .catalog-modal-footer-v8{
    position:sticky!important;
    bottom:0!important;
    z-index:25!important;
    padding-bottom:calc(9px + env(safe-area-inset-bottom))!important;
    background:#fff!important;
    box-shadow:0 -8px 18px rgba(37,67,87,.08)!important;
  }

  /* Cashbook add/edit dialog. */
  body.salonhero-ui .cashbook-modal-card-v7,
  body .cashbook-modal-card-v7{
    width:100%!important;
    max-width:100%!important;
    max-height:calc(100dvh - 8px - env(safe-area-inset-top))!important;
    border-radius:16px 16px 0 0!important;
    overflow-y:auto!important;
    -webkit-overflow-scrolling:touch!important;
    scroll-padding-bottom:88px!important;
  }
  body.salonhero-ui .modal-actions-v7,
  body .modal-actions-v7{
    position:sticky!important;
    bottom:0!important;
    z-index:25!important;
    margin-left:-14px!important;
    margin-right:-14px!important;
    padding:10px 14px calc(10px + env(safe-area-inset-bottom))!important;
    background:#fff!important;
    border-top:1px solid #dce6ec!important;
    box-shadow:0 -8px 18px rgba(37,67,87,.08)!important;
  }

  /* iOS keyboard/short screens: keep enough room to reach the last field and actions. */
  body.modal-open-v137 input,
  body.modal-open-v137 select,
  body.modal-open-v137 textarea{
    scroll-margin-bottom:96px!important;
  }
}

@supports not (height:100dvh){
  @media(max-width:767px){
    body.salonhero-ui .modal-box,
    body .modal-box,
    body.salonhero-ui .modal-box-v4,
    body .modal-box-v4,
    body.salonhero-ui .payment-modal-card-v11,
    body .payment-modal-card-v11,
    body.salonhero-ui .catalog-modal-card-v8,
    body .catalog-modal-card-v8,
    body.salonhero-ui .cashbook-modal-card-v7,
    body .cashbook-modal-card-v7{
      max-height:calc(100vh - 8px)!important;
    }
  }
}

/* ===== Spa Sakura CRM v1.3.8 — mobile order detail + quantity + discount UX ===== */
/* Invoice detail: prevent wide table from forcing the entire mobile page off-screen. */
.detail-grid>*{min-width:0}
.invoice-detail{min-width:0}
.invoice-items-scroll-v138{width:100%;max-width:100%;overflow-x:auto;overflow-y:hidden;-webkit-overflow-scrolling:touch;overscroll-behavior-x:contain;touch-action:pan-x pan-y}
.invoice-items-scroll-v138 .invoice-items{min-width:650px}

/* Per-item discount controls in POS cart. */
.cart-item-main-v138{min-width:0}
.item-discount-control-v138{display:flex;align-items:center;gap:5px;margin-top:6px;min-width:0;color:#8293a0;font-size:10px}
.item-discount-control-v138>span{font-weight:650;color:#61798a;flex:0 0 auto}
.item-discount-control-v138 select{height:28px;min-height:28px!important;width:76px;border:1px solid #d3e0e8;border-radius:5px;background:#fff;color:#536b7e;padding:2px 5px;font-size:10px}
.item-discount-control-v138>div{height:28px;display:flex;align-items:center;border:1px solid #d3e0e8;border-radius:5px;background:#fff;overflow:hidden;width:96px}
.item-discount-control-v138 input{height:26px!important;min-height:26px!important;border:0!important;padding:3px 5px!important;text-align:right!important;min-width:0;background:transparent!important;font-size:10px!important}
.item-discount-control-v138 i{font-style:normal;color:#80919e;padding:0 5px;flex:0 0 auto}
.item-discount-control-v138 em{font-style:normal;white-space:nowrap;color:#98a6b0}
.item-discount-control-v138 em.active{color:#e34b45;font-weight:650}

/* Bill-level discount can be either VND or percentage. */
.discount-input-v138{display:grid;grid-template-columns:96px minmax(0,1fr);gap:6px;align-items:center}
.discount-input-v138 select{height:36px;min-height:36px!important;border:1px solid #cad9e4;border-radius:5px;background:#fff;color:#526b7f;padding:4px 7px;font-size:11px}
.discount-value-wrap-v138{height:36px;border:1px solid #cad9e4;border-radius:5px;display:flex;align-items:center;background:#fff;overflow:hidden}
.discount-value-wrap-v138 input{border:0!important;outline:0!important;width:100%!important;min-width:0!important;height:34px!important;min-height:34px!important;padding:6px 7px!important;text-align:right!important;background:transparent!important}
.discount-value-wrap-v138 i{font-style:normal;padding:0 8px;color:#8293a0;flex:0 0 auto}
.item-discount-summary-v138 strong{color:#e34b45!important}

@media(max-width:767px){
  /* Fix invoice/detail viewport clipping seen on iPhone Safari. */
  body.salonhero-ui .detail-grid,
  body .detail-grid{width:100%!important;max-width:100%!important;min-width:0!important;overflow:visible!important}
  body.salonhero-ui .invoice-detail,
  body .invoice-detail{width:100%!important;max-width:100%!important;min-width:0!important;overflow:hidden!important}
  body.salonhero-ui .invoice-items-scroll-v138,
  body .invoice-items-scroll-v138{display:block!important;width:calc(100% + 0px)!important;max-width:100%!important;overflow-x:auto!important;overflow-y:hidden!important;padding-bottom:6px!important;scrollbar-width:thin!important;touch-action:pan-x pan-y!important}
  body.salonhero-ui .invoice-items-scroll-v138 .invoice-items,
  body .invoice-items-scroll-v138 .invoice-items{width:650px!important;min-width:650px!important;max-width:none!important;font-size:12.5px!important}
  body.salonhero-ui .invoice-items-scroll-v138 .invoice-items th,
  body.salonhero-ui .invoice-items-scroll-v138 .invoice-items td,
  body .invoice-items-scroll-v138 .invoice-items th,
  body .invoice-items-scroll-v138 .invoice-items td{white-space:nowrap!important;padding:8px 7px!important}
  body.salonhero-ui .invoice-items-scroll-v138 .invoice-items th:first-child,
  body.salonhero-ui .invoice-items-scroll-v138 .invoice-items td:first-child,
  body .invoice-items-scroll-v138 .invoice-items th:first-child,
  body .invoice-items-scroll-v138 .invoice-items td:first-child{min-width:205px!important;white-space:normal!important}
  body.salonhero-ui .page-head,
  body .page-head{min-width:0!important;gap:8px!important}
  body.salonhero-ui .page-head>div:first-child,
  body .page-head>div:first-child{min-width:0!important}
  body.salonhero-ui .page-head-actions-v11,
  body .page-head-actions-v11{min-width:0!important;overflow-x:auto!important;-webkit-overflow-scrolling:touch!important;flex:1 1 auto!important;justify-content:flex-end!important;padding-bottom:2px!important}
  body.salonhero-ui .page-head-actions-v11 .btn,
  body .page-head-actions-v11 .btn{flex:0 0 auto!important;white-space:nowrap!important}

  /* Cart rows become two-tier cards so product discounts remain usable on narrow screens. */
  body.salonhero-ui .cart-table-head,
  body .cart-table-head{display:none!important}
  body.salonhero-ui .pos-order-panel .cart-row-v138,
  body .pos-order-panel .cart-row-v138{display:grid!important;grid-template-columns:72px minmax(0,1fr) 36px!important;gap:7px 8px!important;padding:10px 0!important;align-items:center!important}
  body.salonhero-ui .cart-row-v138 .cart-item-main-v138,
  body .cart-row-v138 .cart-item-main-v138{grid-column:1/-1!important;min-width:0!important;padding-right:2px!important}
  body.salonhero-ui .cart-row-v138>[data-qty],
  body .cart-row-v138>[data-qty]{grid-column:1!important;width:72px!important;height:38px!important;font-size:16px!important;text-align:center!important}
  body.salonhero-ui .cart-row-v138 .unit-price,
  body .cart-row-v138 .unit-price{display:none!important}
  body.salonhero-ui .cart-row-v138>strong,
  body .cart-row-v138>strong{grid-column:2!important;text-align:right!important;font-size:14px!important}
  body.salonhero-ui .cart-row-v138>[data-remove],
  body .cart-row-v138>[data-remove]{grid-column:3!important;width:36px!important;height:36px!important}
  body.salonhero-ui .item-discount-control-v138,
  body .item-discount-control-v138{display:grid!important;grid-template-columns:auto 80px minmax(96px,1fr)!important;gap:5px!important;align-items:center!important;margin-top:7px!important}
  body.salonhero-ui .item-discount-control-v138>div,
  body .item-discount-control-v138>div{width:100%!important;min-width:96px!important}
  body.salonhero-ui .item-discount-control-v138 em,
  body .item-discount-control-v138 em{grid-column:2/-1!important;text-align:right!important;font-size:10px!important}

  /* Bill discount area stays readable and touch friendly. */
  body.salonhero-ui .totals-v4>div,
  body.salonhero-ui .totals-v4>label,
  body .totals-v4>div,
  body .totals-v4>label{grid-template-columns:minmax(0,1fr) minmax(185px,56%)!important;gap:8px!important}
  body.salonhero-ui .discount-input-v138,
  body .discount-input-v138{grid-template-columns:82px minmax(0,1fr)!important;gap:5px!important}
  body.salonhero-ui .discount-input-v138 select,
  body .discount-input-v138 select{font-size:10.5px!important;padding:3px 5px!important}
}
.invoice-scroll-hint-v138{display:none}
@media(max-width:767px){.invoice-scroll-hint-v138{display:block;color:#7a8e9e;font-size:10.5px;text-align:right;padding:4px 2px 5px}}


/* ===== Spa Sakura CRM v1.3.9 — polished POS quantity & item discount layout ===== */
/* Keep the main cart row visually clean; discount editing is an intentional secondary action. */
body.salonhero-ui .cart-table-head-v139,
body .cart-table-head-v139{
  grid-template-columns:minmax(0,1fr) 112px 104px 116px 38px!important;
  gap:10px!important;
  align-items:center!important;
  padding:10px 13px!important;
}
body.salonhero-ui .pos-order-panel .cart-row-v139,
body .pos-order-panel .cart-row-v139{
  grid-template-columns:minmax(0,1fr) 112px 104px 116px 38px!important;
  gap:10px!important;
  align-items:center!important;
  padding:12px 0!important;
}
body.salonhero-ui .cart-item-main-v139,
body .cart-item-main-v139{min-width:0!important}
body.salonhero-ui .cart-item-main-v139>b,
body .cart-item-main-v139>b{display:block!important;font-size:13px!important;line-height:1.35!important;color:#25445e!important}
body.salonhero-ui .cart-item-main-v139>small,
body .cart-item-main-v139>small{display:block!important;margin-top:3px!important;font-size:11px!important;color:#95a4b0!important}

/* Quantity is now one compact stepper instead of a lonely oversized input. */
body.salonhero-ui .qty-stepper-v139,
body .qty-stepper-v139{
  display:grid!important;grid-template-columns:30px minmax(42px,1fr) 30px!important;
  height:36px!important;border:1px solid #cfdae3!important;border-radius:7px!important;
  background:#fff!important;overflow:hidden!important;align-items:stretch!important
}
body.salonhero-ui .qty-stepper-v139 button,
body .qty-stepper-v139 button{
  width:30px!important;height:34px!important;border:0!important;border-radius:0!important;
  background:#f5f9fc!important;color:#278bd0!important;font-size:18px!important;font-weight:500!important;
  display:grid!important;place-items:center!important;padding:0!important;cursor:pointer!important
}
body.salonhero-ui .qty-stepper-v139 button:first-child,
body .qty-stepper-v139 button:first-child{border-right:1px solid #e3ebf0!important}
body.salonhero-ui .qty-stepper-v139 button:last-child,
body .qty-stepper-v139 button:last-child{border-left:1px solid #e3ebf0!important}
body.salonhero-ui .qty-stepper-v139 button:hover,
body .qty-stepper-v139 button:hover{background:#eaf5fd!important;color:#087fd0!important}
body.salonhero-ui .qty-stepper-v139 input,
body .qty-stepper-v139 input{
  width:100%!important;height:34px!important;min-height:34px!important;border:0!important;border-radius:0!important;
  box-shadow:none!important;outline:0!important;padding:4px 3px!important;text-align:center!important;
  font-size:14px!important;font-weight:650!important;color:#385269!important;background:#fff!important
}

/* Discount stays tucked under the product title until the user actually needs it. */
body.salonhero-ui .item-discount-toggle-v139,
body .item-discount-toggle-v139{
  display:inline-flex!important;align-items:center!important;justify-content:center!important;
  margin-top:7px!important;min-height:27px!important;padding:4px 9px!important;
  border:1px solid #d7e3eb!important;border-radius:999px!important;background:#fff!important;
  color:#748998!important;font-size:10.5px!important;font-weight:650!important;line-height:1.1!important;cursor:pointer!important
}
body.salonhero-ui .item-discount-toggle-v139:hover,
body .item-discount-toggle-v139:hover{border-color:#8cc8ec!important;background:#f6fbfe!important;color:#168bd6!important}
body.salonhero-ui .item-discount-toggle-v139.active,
body .item-discount-toggle-v139.active{border-color:#ffd1cc!important;background:#fff6f5!important;color:#e14b43!important}
body.salonhero-ui .item-discount-editor-v139,
body .item-discount-editor-v139{
  margin-top:7px!important;display:grid!important;grid-template-columns:92px minmax(110px,155px) auto!important;
  gap:6px!important;align-items:center!important;width:max-content!important;max-width:100%!important;
  padding:7px!important;border:1px solid #e0e9ef!important;border-radius:8px!important;background:#f8fbfd!important
}
body.salonhero-ui .item-discount-editor-v139[hidden],
body .item-discount-editor-v139[hidden]{display:none!important}
body.salonhero-ui .item-discount-editor-v139 select,
body .item-discount-editor-v139 select{
  width:92px!important;height:32px!important;min-height:32px!important;padding:3px 7px!important;
  border:1px solid #cad9e4!important;border-radius:6px!important;background:#fff!important;color:#516b7f!important;font-size:10.5px!important
}
body.salonhero-ui .item-discount-value-v139,
body .item-discount-value-v139{
  height:32px!important;display:flex!important;align-items:center!important;overflow:hidden!important;
  border:1px solid #cad9e4!important;border-radius:6px!important;background:#fff!important
}
body.salonhero-ui .item-discount-value-v139 input,
body .item-discount-value-v139 input{
  width:100%!important;min-width:0!important;height:30px!important;min-height:30px!important;border:0!important;
  padding:4px 7px!important;text-align:right!important;background:transparent!important;box-shadow:none!important;outline:0!important;font-size:11px!important
}
body.salonhero-ui .item-discount-value-v139 i,
body .item-discount-value-v139 i{font-style:normal!important;color:#8293a0!important;padding:0 7px!important;font-size:10.5px!important}
body.salonhero-ui .item-discount-editor-v139 em,
body .item-discount-editor-v139 em{font-style:normal!important;color:#95a3ad!important;font-size:10.5px!important;white-space:nowrap!important}
body.salonhero-ui .item-discount-editor-v139 em.active,
body .item-discount-editor-v139 em.active{color:#e34b45!important;font-weight:650!important}

body.salonhero-ui .cart-row-v139>.unit-price,
body .cart-row-v139>.unit-price{text-align:right!important;font-size:12px!important;color:#657b8c!important}
body.salonhero-ui .cart-row-v139>strong,
body .cart-row-v139>strong{text-align:right!important;font-size:13px!important;color:#078e82!important;white-space:nowrap!important}
body.salonhero-ui .cart-remove-v139,
body .cart-remove-v139{
  width:34px!important;height:34px!important;border:1px solid #f6d3d3!important;border-radius:8px!important;
  background:#fff6f6!important;color:#d94b4b!important;display:grid!important;place-items:center!important;padding:0!important
}
body.salonhero-ui .cart-remove-v139 svg,
body .cart-remove-v139 svg{width:16px!important;height:16px!important;fill:none!important;stroke:currentColor!important;stroke-width:1.8!important;stroke-linecap:round!important}

/* On medium desktops the price can disappear, keeping the working controls comfortable. */
@media(min-width:768px) and (max-width:1280px){
  body.salonhero-ui .cart-table-head-v139,
  body .cart-table-head-v139{grid-template-columns:minmax(0,1fr) 108px 110px 38px!important}
  body.salonhero-ui .cart-table-head-v139 span:nth-child(3),
  body .cart-table-head-v139 span:nth-child(3){display:none!important}
  body.salonhero-ui .pos-order-panel .cart-row-v139,
  body .pos-order-panel .cart-row-v139{grid-template-columns:minmax(0,1fr) 108px 110px 38px!important}
  body.salonhero-ui .cart-row-v139>.unit-price,
  body .cart-row-v139>.unit-price{display:none!important}
}

@media(max-width:767px){
  /* Mobile card: name first, then quantity + amount on one clean line. */
  body.salonhero-ui .pos-order-panel #cart:not(.cart-empty-v4),
  body .pos-order-panel #cart:not(.cart-empty-v4){padding:0 12px!important}
  body.salonhero-ui .pos-order-panel .cart-row-v139,
  body .pos-order-panel .cart-row-v139{
    display:grid!important;grid-template-columns:minmax(0,1fr) 40px!important;
    gap:10px 8px!important;padding:14px 0!important;align-items:center!important
  }
  body.salonhero-ui .cart-row-v139 .cart-item-main-v139,
  body .cart-row-v139 .cart-item-main-v139{grid-column:1/-1!important;padding:0!important}
  body.salonhero-ui .cart-item-main-v139>b,
  body .cart-item-main-v139>b{font-size:14px!important;line-height:1.35!important}
  body.salonhero-ui .cart-item-main-v139>small,
  body .cart-item-main-v139>small{font-size:11.5px!important;margin-top:3px!important}

  body.salonhero-ui .qty-stepper-v139,
  body .qty-stepper-v139{grid-column:1!important;width:124px!important;height:42px!important;grid-template-columns:36px 52px 36px!important}
  body.salonhero-ui .qty-stepper-v139 button,
  body .qty-stepper-v139 button{width:36px!important;height:40px!important;font-size:20px!important}
  body.salonhero-ui .qty-stepper-v139 input,
  body .qty-stepper-v139 input{height:40px!important;min-height:40px!important;font-size:16px!important}

  body.salonhero-ui .cart-row-v139>.unit-price,
  body .cart-row-v139>.unit-price{display:none!important}
  body.salonhero-ui .cart-row-v139>strong,
  body .cart-row-v139>strong{
    grid-column:1!important;grid-row:3!important;justify-self:end!important;
    margin-left:140px!important;font-size:16px!important;color:#078e82!important
  }
  body.salonhero-ui .cart-remove-v139,
  body .cart-remove-v139{grid-column:2!important;grid-row:2/4!important;width:40px!important;height:40px!important;align-self:center!important}

  body.salonhero-ui .item-discount-toggle-v139,
  body .item-discount-toggle-v139{margin-top:9px!important;min-height:32px!important;padding:6px 11px!important;font-size:11px!important}
  body.salonhero-ui .item-discount-editor-v139,
  body .item-discount-editor-v139{
    width:100%!important;max-width:none!important;grid-template-columns:112px minmax(0,1fr)!important;
    gap:7px!important;padding:8px!important;margin-top:8px!important
  }
  body.salonhero-ui .item-discount-editor-v139 select,
  body .item-discount-editor-v139 select{width:112px!important;height:38px!important;min-height:38px!important;font-size:12px!important}
  body.salonhero-ui .item-discount-value-v139,
  body .item-discount-value-v139{height:38px!important}
  body.salonhero-ui .item-discount-value-v139 input,
  body .item-discount-value-v139 input{height:36px!important;min-height:36px!important;font-size:13px!important}
  body.salonhero-ui .item-discount-editor-v139 em,
  body .item-discount-editor-v139 em{grid-column:1/-1!important;text-align:right!important;font-size:11px!important;padding-right:2px!important}
}


/* ===== Spa Sakura CRM v1.3.11 — compact autosave + elastic discount amount field ===== */
body.salonhero-ui .order-autosave-v127,
body .order-autosave-v127{
  white-space:nowrap!important;
  flex:0 0 auto!important;
  width:max-content!important;
  max-width:100%!important;
  line-height:1.15!important;
  padding-left:8px!important;
  padding-right:8px!important;
}

/* Let the invoice discount controls use their natural width instead of being squeezed into 170px. */
body.salonhero-ui .totals-v4>label.bill-discount-row-v138,
body .totals-v4>label.bill-discount-row-v138{
  grid-template-columns:minmax(0,1fr) auto!important;
  column-gap:12px!important;
}
body.salonhero-ui .discount-input-v138,
body .discount-input-v138{
  display:flex!important;
  grid-template-columns:none!important;
  align-items:center!important;
  justify-content:flex-end!important;
  gap:6px!important;
  width:auto!important;
  min-width:0!important;
}
body.salonhero-ui .discount-input-v138 select,
body .discount-input-v138 select{
  flex:0 0 104px!important;
  width:104px!important;
  min-width:104px!important;
}
body.salonhero-ui .discount-value-wrap-v138,
body .discount-value-wrap-v138{
  flex:0 0 auto!important;
  width:84px;
  min-width:84px!important;
  max-width:190px!important;
  transition:width .12s ease!important;
}
body.salonhero-ui .discount-value-wrap-v138 input,
body .discount-value-wrap-v138 input{
  width:100%!important;
  min-width:0!important;
  font-variant-numeric:tabular-nums!important;
  white-space:nowrap!important;
}

/* Per-item money discount gets the same live-formatting / elastic-width behavior. */
body.salonhero-ui .item-discount-value-v139,
body .item-discount-value-v139{
  min-width:84px!important;
  max-width:190px!important;
  transition:width .12s ease!important;
}

@media(max-width:767px){
  body.salonhero-ui .order-meta-strip .order-autosave-v127,
  body .order-meta-strip .order-autosave-v127{
    grid-column:auto!important;
    margin-left:auto!important;
    min-height:26px!important;
    font-size:10.5px!important;
    padding:0 7px!important;
  }
  body.salonhero-ui .totals-v4>label.bill-discount-row-v138,
  body .totals-v4>label.bill-discount-row-v138{
    grid-template-columns:minmax(0,1fr) auto!important;
    gap:7px!important;
  }
  body.salonhero-ui .discount-input-v138,
  body .discount-input-v138{gap:5px!important;max-width:100%!important}
  body.salonhero-ui .discount-input-v138 select,
  body .discount-input-v138 select{
    flex-basis:84px!important;width:84px!important;min-width:84px!important;
    padding-left:5px!important;padding-right:4px!important;
  }
  body.salonhero-ui .discount-value-wrap-v138,
  body .discount-value-wrap-v138{
    min-width:76px!important;max-width:150px!important;
  }
}

/* ===== Spa Sakura CRM v1.3.12 — POS item editor + receipt preview ===== */
/* Clean cart rows: edit quantity/discount/note in a dedicated item editor instead of exposing controls inline. */
body.salonhero-ui .pos-order-panel .cart-v1312,
body .pos-order-panel .cart-v1312{display:block!important}
body.salonhero-ui .pos-order-panel .cart-row-v1312,
body .pos-order-panel .cart-row-v1312{
  display:grid!important;
  grid-template-columns:minmax(240px,1fr) 76px 118px 132px 42px!important;
  align-items:center!important;
  gap:10px!important;
  min-height:78px!important;
  padding:12px 14px!important;
  border-bottom:1px solid #e2eaf0!important;
  background:#fff!important;
}
body.salonhero-ui .cart-item-main-v1312,
body .cart-item-main-v1312{
  appearance:none!important;border:0!important;background:transparent!important;padding:0!important;margin:0!important;
  min-width:0!important;text-align:left!important;cursor:pointer!important;color:inherit!important;font:inherit!important;
}
body.salonhero-ui .cart-item-main-v1312 b,
body .cart-item-main-v1312 b{display:block!important;color:#173d59!important;font-size:13px!important;line-height:1.35!important;font-weight:750!important}
body.salonhero-ui .cart-item-main-v1312 small,
body .cart-item-main-v1312 small{display:block!important;color:#8b9aaa!important;font-size:10.5px!important;line-height:1.35!important;margin-top:3px!important}
body.salonhero-ui .cart-item-main-v1312 em,
body .cart-item-main-v1312 em{display:block!important;margin-top:4px!important;color:#7a8996!important;font-size:10.5px!important;line-height:1.35!important;font-style:italic!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important;max-width:460px!important}
body.salonhero-ui .item-discount-summary-v1312,
body .item-discount-summary-v1312{display:inline-flex!important;width:max-content!important;margin-top:6px!important;padding:3px 7px!important;border-radius:999px!important;background:#fff4f2!important;color:#df4c43!important;border:1px solid #ffd5d0!important;font-size:10px!important;font-weight:700!important;line-height:1.2!important}
body.salonhero-ui .item-discount-summary-v1312[hidden],body .item-discount-summary-v1312[hidden]{display:none!important}
body.salonhero-ui .cart-qty-summary-v1312,
body .cart-qty-summary-v1312{width:62px!important;height:48px!important;justify-self:center!important;border:1px solid #cedce6!important;border-radius:8px!important;background:#f9fbfc!important;color:#214b68!important;display:grid!important;place-items:center!important;align-content:center!important;cursor:pointer!important}
body.salonhero-ui .cart-qty-summary-v1312 span,
body .cart-qty-summary-v1312 span{font-size:14px!important;font-weight:750!important;line-height:1!important}
body.salonhero-ui .cart-qty-summary-v1312 small,
body .cart-qty-summary-v1312 small{font-size:8.5px!important;color:#8a9aa7!important;margin-top:3px!important}
body.salonhero-ui .cart-row-v1312>.unit-price,body .cart-row-v1312>.unit-price{text-align:right!important;color:#5c7486!important;font-size:12px!important;white-space:nowrap!important}
body.salonhero-ui .cart-row-v1312>strong,body .cart-row-v1312>strong{text-align:right!important;color:#078e82!important;font-size:13px!important;white-space:nowrap!important}
body.salonhero-ui .cart-edit-v1312,body .cart-edit-v1312{width:36px!important;height:36px!important;display:grid!important;place-items:center!important;border:1px solid #cfe0eb!important;border-radius:8px!important;background:#f5faff!important;color:#168bd6!important;cursor:pointer!important}
body.salonhero-ui .cart-edit-v1312 svg,body .cart-edit-v1312 svg{width:17px!important;height:17px!important;fill:none!important;stroke:currentColor!important;stroke-width:1.8!important;stroke-linecap:round!important;stroke-linejoin:round!important}
body.salonhero-ui .cart-row-v1312:hover,body .cart-row-v1312:hover{background:#fbfdff!important}

/* Dedicated item editor */
.item-editor-modal-v1312{z-index:10050!important;background:rgba(20,42,58,.46)!important;padding:20px!important;align-items:center!important;justify-content:center!important}
.item-editor-box-v1312{width:min(700px,calc(100vw - 32px))!important;max-height:min(820px,calc(100dvh - 40px))!important;background:#fff!important;border-radius:14px!important;overflow:hidden!important;display:grid!important;grid-template-rows:auto auto minmax(0,1fr) auto!important;box-shadow:0 18px 60px rgba(15,45,65,.24)!important;border:1px solid #d7e2e9!important}
.item-editor-head-v1312{min-height:72px!important;padding:12px 16px!important;display:grid!important;grid-template-columns:44px minmax(0,1fr) auto!important;align-items:center!important;gap:12px!important;border-bottom:1px solid #e3eaf0!important;background:#fff!important}
.item-editor-head-v1312>button:first-child{width:40px!important;height:40px!important;border:0!important;border-radius:50%!important;background:#eef7fd!important;color:#107fc6!important;font-size:31px!important;line-height:1!important;cursor:pointer!important}
.item-editor-head-v1312 b{display:block!important;color:#173b55!important;font-size:17px!important;line-height:1.25!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important}
.item-editor-head-v1312 small{display:block!important;color:#8a99a5!important;font-size:11px!important;margin-top:3px!important}
.item-editor-done-top-v1312{border:0!important;border-radius:8px!important;background:#eaf6fd!important;color:#087fca!important;padding:9px 13px!important;font-weight:700!important;cursor:pointer!important}
.item-editor-tabs-v1312{display:flex!important;border-bottom:1px solid #dce6ed!important;background:#fff!important}
.item-editor-tabs-v1312 span{min-width:150px!important;padding:12px 18px!important;text-align:center!important;color:#7b8d9b!important;font-weight:650!important;border-bottom:3px solid transparent!important}
.item-editor-tabs-v1312 span.active{color:#0b8eda!important;border-bottom-color:#0b96e6!important}
.item-editor-body-v1312{overflow:auto!important;padding:8px 22px 24px!important;-webkit-overflow-scrolling:touch!important}
.item-editor-row-v1312{min-height:68px!important;display:grid!important;grid-template-columns:150px 1fr!important;align-items:center!important;border-bottom:1px solid #edf1f4!important;gap:12px!important}
.item-editor-row-v1312 label,.item-editor-discount-top-v1312>label{font-size:13px!important;color:#748491!important;font-weight:550!important}
.item-editor-row-v1312>strong{justify-self:end!important;font-size:16px!important;color:#183b55!important}
.item-editor-qty-v1312{justify-self:end!important;display:grid!important;grid-template-columns:44px 64px 44px!important;align-items:center!important}
.item-editor-qty-v1312 button{width:44px!important;height:44px!important;border:0!important;background:#f4f7f9!important;color:#657985!important;font-size:24px!important;font-weight:700!important;cursor:pointer!important}
.item-editor-qty-v1312 input{width:64px!important;height:44px!important;border:0!important;border-bottom:1px solid #cfd8df!important;text-align:center!important;font-size:19px!important;font-weight:700!important;color:#153a54!important;background:#fff!important;outline:none!important}
.item-editor-discount-v1312{padding:16px 0 10px!important;border-bottom:1px solid #edf1f4!important}
.item-editor-discount-top-v1312{display:grid!important;grid-template-columns:150px auto minmax(130px,1fr)!important;align-items:center!important;gap:14px!important}
.item-editor-switch-v1312{display:grid!important;grid-template-columns:56px 56px!important;padding:2px!important;border-radius:999px!important;background:#eef1f4!important}
.item-editor-switch-v1312 button{height:34px!important;border:0!important;border-radius:999px!important;background:transparent!important;color:#566d7d!important;font-size:14px!important;font-weight:700!important;cursor:pointer!important}
.item-editor-switch-v1312 button.active{background:#fff!important;color:#173b55!important;box-shadow:0 1px 5px rgba(30,58,78,.12)!important}
.item-editor-discount-value-v1312{justify-self:end!important;display:flex!important;align-items:center!important;max-width:210px!important;border-bottom:1px solid #cfd8df!important}
.item-editor-discount-value-v1312 input{min-width:0!important;width:100%!important;height:40px!important;border:0!important;background:transparent!important;text-align:right!important;font-size:18px!important;font-weight:700!important;color:#153a54!important;outline:none!important}
.item-editor-discount-value-v1312 i{font-style:normal!important;color:#657985!important;font-size:14px!important;padding-left:6px!important}
.item-editor-discount-result-v1312{text-align:right!important;color:#7c8c98!important;font-size:11px!important;padding:7px 2px 3px!important}
.item-editor-quick-v1312{display:grid!important;grid-template-columns:repeat(5,minmax(0,1fr))!important;gap:8px!important;margin-top:12px!important}
.item-editor-quick-v1312[hidden]{display:none!important}
.item-editor-quick-v1312 button{height:34px!important;border:0!important;border-radius:999px!important;background:#e8f3fb!important;color:#436a83!important;font-size:12px!important;cursor:pointer!important;transition:.12s ease!important}
.item-editor-quick-v1312 button:hover{background:#d7ebf9!important;color:#087fc9!important}
.item-editor-quick-v1312 button.active{background:#178fda!important;color:#fff!important;font-weight:700!important}
.item-editor-note-v1312{display:grid!important;gap:8px!important;padding-top:18px!important}
.item-editor-note-v1312 span{font-size:13px!important;color:#748491!important}
.item-editor-note-v1312 textarea{width:100%!important;min-height:90px!important;resize:vertical!important;border:1px solid #d6e1e8!important;border-radius:8px!important;padding:10px 12px!important;font:inherit!important;color:#23445b!important;background:#fff!important}
.item-editor-actions-v1312{display:flex!important;gap:10px!important;justify-content:flex-end!important;padding:12px 16px calc(12px + env(safe-area-inset-bottom,0px))!important;border-top:1px solid #dde6ec!important;background:#fff!important}
.item-editor-actions-v1312 .btn{min-width:120px!important;height:42px!important}
.item-editor-actions-v1312 .danger{background:#ff4a54!important;border-color:#ff4a54!important;color:#fff!important}

/* Receipt preview modal */
.print-preview-modal-v1312{z-index:10040!important;background:rgba(18,40,56,.50)!important;padding:18px!important;align-items:center!important;justify-content:center!important}
.print-preview-box-v1312{width:min(860px,calc(100vw - 36px))!important;height:min(820px,calc(100dvh - 36px))!important;background:#f1f4f6!important;border-radius:16px!important;overflow:hidden!important;display:grid!important;grid-template-rows:auto minmax(0,1fr) auto!important;box-shadow:0 20px 70px rgba(15,38,54,.30)!important}
.print-preview-box-v1312>header{display:grid!important;grid-template-columns:40px minmax(0,1fr) auto!important;align-items:center!important;gap:12px!important;padding:12px 14px!important;background:#fff!important;border-bottom:1px solid #dbe3e8!important}
.print-preview-close-v1312{width:36px!important;height:36px!important;border:0!important;border-radius:50%!important;background:#f3f6f8!important;color:#4e687a!important;font-size:23px!important;cursor:pointer!important}
.print-preview-box-v1312>header b{display:block!important;color:#173b55!important;font-size:16px!important}.print-preview-box-v1312>header small{display:block!important;color:#8c9aa5!important;font-size:10.5px!important;margin-top:2px!important}
.print-preview-tools-v1312{display:flex!important;gap:7px!important;align-items:center!important}.print-preview-tools-v1312 span,.print-preview-tools-v1312 a{display:inline-flex!important;align-items:center!important;height:32px!important;padding:0 10px!important;border:1px solid #d5e0e7!important;border-radius:7px!important;background:#fff!important;color:#4d6a7e!important;font-size:11px!important;text-decoration:none!important}
.print-preview-stage-v1312{overflow:hidden!important;padding:10px!important;background:#e7ebee!important}.print-preview-stage-v1312 iframe{width:100%!important;height:100%!important;border:0!important;background:#e7ebee!important;border-radius:8px!important}
.print-preview-box-v1312>footer{display:flex!important;justify-content:flex-end!important;gap:8px!important;padding:10px 14px calc(10px + env(safe-area-inset-bottom,0px))!important;background:#fff!important;border-top:1px solid #dbe3e8!important}

@media(max-width:767px){
  body.salonhero-ui .pos-order-panel .cart-row-v1312,body .pos-order-panel .cart-row-v1312{
    grid-template-columns:minmax(0,1fr) 58px 42px!important;grid-template-rows:auto auto!important;gap:8px!important;min-height:104px!important;padding:12px 12px!important
  }
  body.salonhero-ui .cart-item-main-v1312,body .cart-item-main-v1312{grid-column:1/-1!important;padding-right:4px!important}
  body.salonhero-ui .cart-item-main-v1312 b,body .cart-item-main-v1312 b{font-size:14px!important}
  body.salonhero-ui .cart-item-main-v1312 small,body .cart-item-main-v1312 small{font-size:11px!important}
  body.salonhero-ui .cart-qty-summary-v1312,body .cart-qty-summary-v1312{grid-column:1!important;grid-row:2!important;justify-self:start!important;width:56px!important;height:42px!important}
  body.salonhero-ui .cart-row-v1312>.unit-price,body .cart-row-v1312>.unit-price{display:none!important}
  body.salonhero-ui .cart-row-v1312>strong,body .cart-row-v1312>strong{grid-column:2!important;grid-row:2!important;align-self:center!important;justify-self:end!important;font-size:14px!important}
  body.salonhero-ui .cart-edit-v1312,body .cart-edit-v1312{grid-column:3!important;grid-row:2!important;align-self:center!important}
  body.salonhero-ui .item-discount-summary-v1312,body .item-discount-summary-v1312{font-size:10.5px!important}

  .item-editor-modal-v1312{padding:0!important;align-items:stretch!important;background:#fff!important}
  .item-editor-box-v1312{width:100%!important;height:100dvh!important;max-height:none!important;border:0!important;border-radius:0!important;box-shadow:none!important}
  .item-editor-head-v1312{min-height:76px!important;padding:10px 14px!important;background:#118fe1!important;border-bottom:0!important;color:#fff!important;grid-template-columns:48px minmax(0,1fr) auto!important}
  .item-editor-head-v1312>button:first-child{width:46px!important;height:46px!important;background:#b9e8fb!important;color:#173d59!important;font-size:34px!important}
  .item-editor-head-v1312 b{color:#fff!important;font-size:16px!important;text-align:center!important}.item-editor-head-v1312 small{color:rgba(255,255,255,.82)!important;text-align:center!important}
  .item-editor-done-top-v1312{background:#b9e8fb!important;color:#173d59!important;border-radius:999px!important;padding:10px 15px!important}
  .item-editor-tabs-v1312 span{width:100%!important;min-width:0!important;padding:13px 10px!important;font-size:13px!important}
  .item-editor-body-v1312{padding:6px 18px 110px!important}
  .item-editor-row-v1312{grid-template-columns:110px 1fr!important;min-height:74px!important}.item-editor-row-v1312 label,.item-editor-discount-top-v1312>label{font-size:13px!important}
  .item-editor-qty-v1312{grid-template-columns:48px 62px 48px!important}.item-editor-qty-v1312 button{width:48px!important;height:46px!important;font-size:25px!important}.item-editor-qty-v1312 input{width:62px!important;height:46px!important;font-size:20px!important}
  .item-editor-discount-top-v1312{grid-template-columns:110px 118px minmax(0,1fr)!important;gap:8px!important}.item-editor-switch-v1312{grid-template-columns:56px 56px!important}.item-editor-discount-value-v1312{max-width:130px!important}.item-editor-discount-value-v1312 input{font-size:17px!important}
  .item-editor-quick-v1312{grid-template-columns:repeat(4,minmax(0,1fr))!important;gap:7px!important;margin-top:14px!important}.item-editor-quick-v1312 button{height:38px!important;font-size:13px!important;background:#dcecf8!important}
  .item-editor-actions-v1312{position:absolute!important;left:0!important;right:0!important;bottom:0!important;z-index:3!important;padding:10px 12px calc(10px + env(safe-area-inset-bottom,0px))!important;display:grid!important;grid-template-columns:1fr 1fr!important}.item-editor-actions-v1312 .btn{width:100%!important;min-width:0!important;height:48px!important;font-size:14px!important}

  .print-preview-modal-v1312{padding:0!important;align-items:stretch!important}
  .print-preview-box-v1312{width:100%!important;height:100dvh!important;border-radius:0!important;max-height:none!important}
  .print-preview-box-v1312>header{grid-template-columns:38px minmax(0,1fr)!important;padding:10px 12px!important}.print-preview-tools-v1312{grid-column:1/-1!important;justify-content:center!important}.print-preview-tools-v1312 span,.print-preview-tools-v1312 a{height:30px!important;font-size:10.5px!important}
  .print-preview-stage-v1312{padding:4px!important}.print-preview-box-v1312>footer{display:grid!important;grid-template-columns:1fr 1fr!important}.print-preview-box-v1312>footer .btn{width:100%!important}
}


/* ===== Spa Sakura CRM v1.3.13 — customer archive, cancelled invoice delete, mobile invoice actions ===== */
body.salonhero-ui .customer-profile-actions-v5 .customer-delete-form-v1313{margin:0;display:inline-flex}
body.salonhero-ui .cancelled-delete-actions-v1313{margin-top:14px}
body.salonhero-ui .cancelled-delete-actions-v1313 form{margin:0}
body.salonhero-ui .cancelled-delete-actions-v1313 .btn{min-width:190px;justify-content:center}

@media(max-width:767px){
  /* Keep all invoice-detail actions visible on phones instead of hiding the print action off-screen. */
  body.salonhero-ui .order-detail-head-v1313,
  body .order-detail-head-v1313{
    display:grid!important;
    grid-template-columns:1fr!important;
    gap:8px!important;
    width:100%!important;
    min-width:0!important;
  }
  body.salonhero-ui .order-detail-head-v1313>.page-head-actions-v11,
  body .order-detail-head-v1313>.page-head-actions-v11{
    display:grid!important;
    grid-template-columns:repeat(3,minmax(0,1fr))!important;
    gap:6px!important;
    width:100%!important;
    max-width:100%!important;
    overflow:visible!important;
    padding:0!important;
  }
  body.salonhero-ui .order-detail-head-v1313>.page-head-actions-v11 .btn,
  body .order-detail-head-v1313>.page-head-actions-v11 .btn{
    width:100%!important;
    min-width:0!important;
    min-height:40px!important;
    padding:7px 6px!important;
    justify-content:center!important;
    text-align:center!important;
    white-space:normal!important;
    line-height:1.15!important;
    font-size:12px!important;
  }
  body.salonhero-ui .order-detail-head-v1313>.page-head-actions-v11 .ui-icon,
  body .order-detail-head-v1313>.page-head-actions-v11 .ui-icon{flex:0 0 auto!important}

  body.salonhero-ui .customer-profile-actions-v5,
  body .customer-profile-actions-v5{display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:6px!important;width:100%!important}
  body.salonhero-ui .customer-profile-actions-v5 .btn,
  body .customer-profile-actions-v5 .btn,
  body.salonhero-ui .customer-profile-actions-v5 form,
  body .customer-profile-actions-v5 form{width:100%!important;min-width:0!important}
  body.salonhero-ui .customer-profile-actions-v5 form .btn,
  body .customer-profile-actions-v5 form .btn{justify-content:center!important}

  body.salonhero-ui .cancelled-delete-actions-v1313,
  body .cancelled-delete-actions-v1313{display:block!important}
  body.salonhero-ui .cancelled-delete-actions-v1313 form,
  body .cancelled-delete-actions-v1313 form,
  body.salonhero-ui .cancelled-delete-actions-v1313 .btn,
  body .cancelled-delete-actions-v1313 .btn{width:100%!important;min-width:0!important}
}

/* ===== Spa Sakura CRM v1.3.14 — restricted destructive actions + invoice date selector ===== */
body.salonhero-ui .restricted-action-note-v1314{display:inline-flex;align-items:center;gap:6px;color:#8493a0;font-size:12px;padding:7px 9px;border:1px solid #dfe7ec;background:#f7fafc;border-radius:6px}
body.salonhero-ui .manager-role-label-v1314{color:#c47a00!important;font-weight:700!important}
body.salonhero-ui .role-help-v1314{display:block!important;margin-top:4px!important;color:#8999a7!important;font-size:10px!important;line-height:1.35}
body.salonhero-ui .user-form-fields-v9 select{height:38px;border:1px solid #ccdbe5;border-radius:4px;background:#fff;padding:0 9px;color:#465f72}
body.salonhero-ui .order-meta-strip-v1314{align-items:center}
body.salonhero-ui .order-date-picker-v1314{display:flex;align-items:center;gap:7px;margin:0;color:#8493a0;font-size:inherit}
body.salonhero-ui .order-date-picker-v1314>span{white-space:nowrap}
body.salonhero-ui .order-date-picker-v1314 input{height:32px;min-width:174px;border:1px solid #cbdbe6;border-radius:5px;background:#fff;color:#405b70;padding:4px 7px;font:inherit;font-weight:650;outline:none}
body.salonhero-ui .order-date-picker-v1314 input:focus{border-color:#1b93de;box-shadow:0 0 0 3px rgba(27,147,222,.08)}
@media(max-width:767px){
  body.salonhero-ui .order-meta-strip-v1314{display:grid;grid-template-columns:1fr 1fr;gap:7px 9px;padding:8px 9px}
  body.salonhero-ui .order-date-picker-v1314{grid-column:1/-1;display:grid;grid-template-columns:auto minmax(0,1fr);align-items:center}
  body.salonhero-ui .order-date-picker-v1314 input{width:100%;min-width:0;height:38px;font-size:13px}
  body.salonhero-ui .order-meta-strip-v1314 .order-autosave-v127{grid-column:1/-1!important;display:inline-flex!important;justify-self:start!important;margin:0!important}
  body.salonhero-ui .restricted-action-note-v1314{font-size:11px}
}

/* ===== Spa Sakura CRM v1.3.15 — customer search size hard-fix ===== */
/* Keep the customer search bar identical across all Multi-Spa databases/branches. */
body.salonhero-ui .customer-list-panel-v5 > .customer-search-v5{
  display:flex!important;
  align-items:center!important;
  width:calc(100% - 16px)!important;
  height:44px!important;
  min-height:44px!important;
  max-height:44px!important;
  flex:0 0 44px!important;
  margin:8px!important;
  padding:0!important;
  box-sizing:border-box!important;
  border:1px solid #bdced9!important;
  border-radius:22px!important;
  background:#fff!important;
  overflow:hidden!important;
}
body.salonhero-ui .customer-list-panel-v5 > .customer-search-v5 > .ui-icon{
  position:absolute!important;
  left:13px!important;
  top:50%!important;
  width:18px!important;
  height:18px!important;
  transform:translateY(-50%)!important;
  color:#718796!important;
  margin:0!important;
  pointer-events:none!important;
  z-index:2!important;
}
body.salonhero-ui .customer-list-panel-v5 > .customer-search-v5 input{
  display:block!important;
  width:100%!important;
  height:42px!important;
  min-height:42px!important;
  max-height:42px!important;
  line-height:normal!important;
  margin:0!important;
  padding:0 38px 0 40px!important;
  box-sizing:border-box!important;
  border:0!important;
  border-radius:0!important;
  background:transparent!important;
  box-shadow:none!important;
  font-size:14px!important;
  color:#405769!important;
  appearance:none!important;
  -webkit-appearance:none!important;
}
body.salonhero-ui .customer-list-panel-v5 > .customer-search-v5 input::placeholder{
  color:#8597a5!important;
  opacity:1!important;
}
body.salonhero-ui .customer-list-panel-v5 > .customer-search-v5 input:focus{
  outline:0!important;
  border:0!important;
  box-shadow:none!important;
  background:transparent!important;
}
body.salonhero-ui .customer-list-panel-v5 > .customer-search-v5 > a{
  top:50%!important;
  right:7px!important;
  transform:translateY(-50%)!important;
}
@media(max-width:767px){
  body.salonhero-ui .customer-list-panel-v5 > .customer-search-v5{
    height:48px!important;
    min-height:48px!important;
    max-height:48px!important;
    flex-basis:48px!important;
    border-radius:24px!important;
  }
  body.salonhero-ui .customer-list-panel-v5 > .customer-search-v5 input{
    height:46px!important;
    min-height:46px!important;
    max-height:46px!important;
    font-size:15px!important;
  }
}

/* ===== Spa Sakura CRM v1.3.17 — cancel completed invoices safely ===== */
body.salonhero-ui .order-cancel-form-v1317{margin:0;display:inline-flex}
body.salonhero-ui .order-cancel-form-v1317 .btn{height:100%;justify-content:center}
body.salonhero-ui .completed-cancel-actions-v1317 form{margin:0;display:inline-flex}

@media(max-width:767px){
  /* Four invoice actions fit better as a 2 x 2 grid on phones. */
  body.salonhero-ui .order-detail-head-v1313>.page-head-actions-v11.has-cancel-v1317,
  body .order-detail-head-v1313>.page-head-actions-v11.has-cancel-v1317{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
  }
  body.salonhero-ui .order-detail-head-v1313>.page-head-actions-v11.has-cancel-v1317 form,
  body .order-detail-head-v1313>.page-head-actions-v11.has-cancel-v1317 form{
    width:100%!important;
    min-width:0!important;
  }
  body.salonhero-ui .order-detail-head-v1313>.page-head-actions-v11.has-cancel-v1317 form .btn,
  body .order-detail-head-v1313>.page-head-actions-v11.has-cancel-v1317 form .btn{
    width:100%!important;
    min-width:0!important;
  }
  body.salonhero-ui .completed-cancel-actions-v1317,
  body .completed-cancel-actions-v1317{
    display:grid!important;
    grid-template-columns:1fr!important;
    gap:7px!important;
  }
  body.salonhero-ui .completed-cancel-actions-v1317 form,
  body .completed-cancel-actions-v1317 form,
  body.salonhero-ui .completed-cancel-actions-v1317 .btn,
  body .completed-cancel-actions-v1317 .btn{
    width:100%!important;
    min-width:0!important;
  }
}

/* ===== Spa Sakura CRM v1.3.18 — Mobile UX Overhaul ===== */
.mobile-order-list-v1318,.mobile-invoice-items-v1318,.mobile-data-list-v1318{display:none}

@media(max-width:767px){
  /* Global mobile spacing and touch targets */
  body.salonhero-ui .page-shell{padding-left:10px!important;padding-right:10px!important;padding-bottom:92px!important;overflow-x:hidden!important}
  body.salonhero-ui .btn{min-height:42px;display:inline-flex;align-items:center;justify-content:center}
  body.salonhero-ui input,body.salonhero-ui select,body.salonhero-ui textarea{font-size:16px!important}

  /* Orders: true mobile cards instead of a compressed desktop table. */
  body.salonhero-ui .desktop-orders-table-v1318{display:none!important}
  body.salonhero-ui .mobile-order-list-v1318{display:grid!important;gap:9px;padding:3px}
  body.salonhero-ui .order-list-panel{background:transparent!important;border:0!important;padding:0!important}
  body.salonhero-ui .mobile-order-card-v1318{display:block;background:#fff;border:1px solid #d8e3eb;border-radius:12px;padding:13px 13px 11px;color:#355066;text-decoration:none;box-shadow:0 2px 8px rgba(33,64,86,.04)}
  body.salonhero-ui .mobile-order-card-v1318:active{background:#f4f9fd;transform:scale(.995)}
  body.salonhero-ui .mobile-order-card-top-v1318{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:10px;align-items:start}
  body.salonhero-ui .mobile-order-customer-v1318{min-width:0;display:flex;flex-direction:column;gap:3px}
  body.salonhero-ui .mobile-order-customer-v1318 b{font-size:15px;line-height:1.25;color:#213c52;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  body.salonhero-ui .mobile-order-customer-v1318 small{font-size:11px;color:#8899a7;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  body.salonhero-ui .mobile-order-total-v1318{font-size:16px;color:#008f80;white-space:nowrap}
  body.salonhero-ui .mobile-order-card-bottom-v1318{display:grid;grid-template-columns:minmax(0,1fr) auto 16px;gap:8px;align-items:end;margin-top:10px;padding-top:9px;border-top:1px solid #edf2f5}
  body.salonhero-ui .mobile-order-money-v1318{display:flex;flex-wrap:wrap;gap:5px 12px;font-size:11px;color:#81909c}
  body.salonhero-ui .mobile-order-money-v1318 b{color:#425d70;font-weight:700}
  body.salonhero-ui .mobile-order-money-v1318 .debt,body.salonhero-ui .mobile-order-money-v1318 .debt b{color:#ef4444!important}
  body.salonhero-ui .mobile-order-card-v1318 .status-badge-stack-v121{display:flex;gap:4px;align-items:center;justify-content:flex-end;flex-wrap:wrap}
  body.salonhero-ui .mobile-order-card-v1318 .badge{font-size:10px;padding:4px 7px;white-space:nowrap}
  body.salonhero-ui .mobile-card-arrow-v1318{font-size:24px;color:#9aabb7;line-height:1}
  body.salonhero-ui .mobile-empty-v1318{padding:46px 18px;text-align:center;color:#91a0ab;background:#fff;border:1px dashed #d5e0e7;border-radius:12px}

  /* Orders filters: compact, thumb-friendly grid. */
  body.salonhero-ui .filterbar{display:grid!important;grid-template-columns:105px minmax(0,1fr) minmax(0,1fr)!important;gap:7px!important;padding:9px!important;margin:0 0 9px!important;border:1px solid #dce6ed!important;border-radius:10px!important;background:#f7fafc!important}
  body.salonhero-ui .filterbar select[name="range"]{grid-column:1;grid-row:1}
  body.salonhero-ui .filterbar input[name="from"]{grid-column:2;grid-row:1}
  body.salonhero-ui .filterbar input[name="to"]{grid-column:3;grid-row:1}
  body.salonhero-ui .filterbar .grow{grid-column:1/3;grid-row:2;min-width:0!important;width:100%!important}
  body.salonhero-ui .filterbar .btn{grid-column:3;grid-row:2;width:100%!important}
  body.salonhero-ui .filterbar input,body.salonhero-ui .filterbar select{height:42px!important;min-width:0!important;width:100%!important;padding:7px 8px!important;font-size:13px!important}
  body.salonhero-ui .status-tabs{display:grid!important;grid-template-columns:repeat(5,minmax(0,1fr))!important;overflow:visible!important;margin:0 0 10px!important;border-radius:9px!important}
  body.salonhero-ui .status-tabs a{min-width:0!important;padding:10px 3px!important;text-align:center!important;font-size:11px!important;white-space:nowrap!important}

  /* Invoice detail: no horizontal swipe; each line item becomes a readable card. */
  body.salonhero-ui .invoice-scroll-hint-v138,body.salonhero-ui .desktop-invoice-items-v1318{display:none!important}
  body.salonhero-ui .mobile-invoice-items-v1318{display:grid!important;gap:8px;margin:10px 0 4px}
  body.salonhero-ui .mobile-invoice-item-v1318{border:1px solid #dce6ec;border-radius:10px;background:#fff;padding:11px}
  body.salonhero-ui .mobile-invoice-item-head-v1318{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:9px;align-items:start}
  body.salonhero-ui .mobile-invoice-item-head-v1318>div{min-width:0;display:flex;flex-direction:column;gap:3px}
  body.salonhero-ui .mobile-invoice-item-head-v1318 b{font-size:14px;line-height:1.3;color:#304e64;white-space:normal}
  body.salonhero-ui .mobile-invoice-item-head-v1318 small{font-size:10.5px;color:#94a2ad}
  body.salonhero-ui .mobile-invoice-item-head-v1318 strong{font-size:15px;color:#008f80;white-space:nowrap}
  body.salonhero-ui .mobile-invoice-item-meta-v1318{display:grid;grid-template-columns:.6fr 1.2fr 1fr;gap:7px;margin-top:10px;padding-top:9px;border-top:1px solid #edf2f5}
  body.salonhero-ui .mobile-invoice-item-meta-v1318 span{min-width:0;display:flex;flex-direction:column;gap:2px}
  body.salonhero-ui .mobile-invoice-item-meta-v1318 small{font-size:9.5px;text-transform:uppercase;color:#9aa8b2}
  body.salonhero-ui .mobile-invoice-item-meta-v1318 b{font-size:11.5px;color:#50697b;white-space:normal;overflow-wrap:anywhere}
  body.salonhero-ui .mobile-invoice-item-v1318 p{margin:8px 0 0;padding:7px 8px;background:#f6f9fb;border-radius:6px;color:#657b8b;font-size:11px}
  body.salonhero-ui .invoice-meta{grid-template-columns:1fr!important;gap:4px!important;padding:8px 0!important}
  body.salonhero-ui .invoice-meta span{display:flex!important;justify-content:space-between!important;gap:10px!important;border-bottom:1px solid #edf2f5;padding:6px 0!important}
  body.salonhero-ui .invoice-meta span:last-child{border-bottom:0}
  body.salonhero-ui .invoice-totals{margin-top:10px!important}
  body.salonhero-ui .invoice-totals>div{min-height:34px;align-items:center}

  /* Reusable card view for administrative tables that are too wide on phones. */
  body.salonhero-ui .mobile-data-list-v1318{display:grid!important;gap:9px;margin:8px 0 12px}
  body.salonhero-ui .mobile-data-card-v1318{background:#fff;border:1px solid #d9e4eb;border-radius:11px;padding:11px;box-shadow:0 2px 7px rgba(33,64,86,.035)}
  body.salonhero-ui .mobile-data-field-v1318{display:grid;grid-template-columns:minmax(92px,.85fr) minmax(0,1.45fr);gap:8px;align-items:start;padding:6px 0;border-bottom:1px solid #edf2f5}
  body.salonhero-ui .mobile-data-field-v1318:last-of-type{border-bottom:0}
  body.salonhero-ui .mobile-data-field-v1318>span:first-child{font-size:10px;color:#8798a6;text-transform:uppercase;letter-spacing:.02em}
  body.salonhero-ui .mobile-data-field-v1318>.mobile-data-value-v1318{min-width:0;text-align:right;color:#405a6d;font-size:12px;overflow-wrap:anywhere}
  body.salonhero-ui .mobile-data-value-v1318 b,body.salonhero-ui .mobile-data-value-v1318 strong{color:#26455c}
  body.salonhero-ui .mobile-data-value-v1318 small{display:block!important;margin-top:2px;color:#8a9aa6!important}
  body.salonhero-ui .mobile-data-field-v1318.mobile-data-actions-v1318{display:block;border-bottom:0;padding-top:10px}
  body.salonhero-ui .mobile-data-actions-v1318 .mobile-data-value-v1318{display:flex!important;flex-wrap:wrap;justify-content:flex-end;gap:6px;text-align:right}
  body.salonhero-ui .mobile-data-actions-v1318 form{display:inline-flex;margin:0}
  body.salonhero-ui .mobile-data-actions-v1318 .btn{min-height:36px!important;padding:7px 10px!important;font-size:11px!important}
  body.salonhero-ui .mobile-data-more-v1318[hidden]{display:none!important}
  body.salonhero-ui .mobile-data-toggle-v1318{width:100%;min-height:36px;border:0;border-top:1px solid #edf2f5;background:#f8fbfd;color:#168bd6;font-weight:650;margin:5px -2px -3px;padding:7px;border-radius:0 0 8px 8px}
  body.salonhero-ui .mobile-data-empty-v1318{padding:34px 14px;text-align:center;color:#91a0ac;background:#fff;border:1px dashed #d7e2e9;border-radius:10px}
  body.salonhero-ui .has-mobile-cards-v1318{display:none!important}

  /* Debt page no longer needs a 1200px table on phones. */
  body.salonhero-ui .debt-tabs-v120{display:grid!important;grid-template-columns:1fr 1fr!important}
  body.salonhero-ui .debt-tabs-v120 a{min-width:0!important;padding:11px 6px!important;font-size:12px!important}
  body.salonhero-ui .debt-filters-v120{display:grid!important;grid-template-columns:1fr 1fr!important;padding:10px!important;gap:8px!important}
  body.salonhero-ui .debt-filters-v120 label{min-width:0!important}
  body.salonhero-ui .debt-filters-v120 label.grow{grid-column:1/-1}
  body.salonhero-ui .debt-filters-v120 .btn{grid-column:1/-1}
  body.salonhero-ui .debt-summary-v120{grid-template-columns:1fr 1fr!important;gap:7px!important}
  body.salonhero-ui .debt-summary-v120>div:first-child{grid-column:1/-1}
  body.salonhero-ui .debt-summary-v120 strong{font-size:20px!important}

  /* Modal forms: use a compact app-like sheet and keep actions reachable. */
  body.salonhero-ui .modal-box,body.salonhero-ui .modal-card{width:100%!important;max-width:100%!important;max-height:calc(100dvh - 18px)!important;border-radius:16px 16px 0 0!important}
  body.salonhero-ui .modal-actions,body.salonhero-ui .modal-actions-v7{position:sticky!important;bottom:0!important;background:#fff!important;padding-top:9px!important;padding-bottom:max(9px,env(safe-area-inset-bottom))!important;z-index:4!important}

  /* Tables inside print/receipts stay tables. */
  body.salonhero-ui .receipt-table,body.salonhero-ui .print-preview-receipt-v11 table{display:table!important}
}

@media(max-width:430px){
  body.salonhero-ui .filterbar{grid-template-columns:88px minmax(0,1fr) minmax(0,1fr)!important}
  body.salonhero-ui .filterbar input,body.salonhero-ui .filterbar select{font-size:12px!important;padding-left:5px!important;padding-right:5px!important}
  body.salonhero-ui .status-tabs a{font-size:10px!important;padding:9px 1px!important}
  body.salonhero-ui .mobile-order-total-v1318{font-size:14px}
  body.salonhero-ui .mobile-order-card-bottom-v1318{grid-template-columns:minmax(0,1fr) auto 12px}
  body.salonhero-ui .mobile-invoice-item-meta-v1318{grid-template-columns:.55fr 1.15fr 1fr}
}

/* ===== v1.3.19: Bộ lọc khoảng ngày nhanh cho danh sách hóa đơn ===== */
body.salonhero-ui .order-filterbar-v1319{display:grid;grid-template-columns:130px 285px minmax(260px,1fr) 68px;gap:8px;align-items:center;position:relative;overflow:visible}
.order-filterbar-v1319 .order-range-picker-v1319{position:relative;min-width:0}
.order-range-trigger-v1319{width:100%;height:44px;border:1px solid #c9d8e3;background:#fff;color:#435d70;border-radius:5px;display:flex;align-items:center;gap:9px;padding:0 11px;cursor:pointer;font:inherit;text-align:left}
.order-range-trigger-v1319:hover,.order-range-trigger-v1319:focus{border-color:#2096e6;outline:0;box-shadow:0 0 0 2px rgba(32,150,230,.08)}
.order-range-calendar-v1319{display:grid;place-items:center;color:#198dd8;flex:0 0 auto}.order-range-calendar-v1319 svg{width:17px;height:17px}
.order-range-trigger-v1319 b{font-size:13.5px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;flex:1}
.order-range-caret-v1319{font-size:16px;color:#8397a5;line-height:1}
.order-range-popover-v1319{position:absolute;left:0;top:51px;width:430px;max-width:calc(100vw - 28px);z-index:90;background:#fff;border:1px solid #cbd9e3;border-radius:6px;box-shadow:0 16px 36px rgba(28,61,85,.20);padding:12px}
.order-range-inputs-v1319{display:grid;grid-template-columns:1fr auto 1fr;gap:8px;align-items:end;padding-bottom:10px;border-bottom:1px solid #e7edf2}
.order-range-inputs-v1319 label{display:grid;gap:5px;margin:0;color:#6d8291;font-size:11px}.order-range-inputs-v1319 input{height:42px;border:1px solid #cbd9e3;border-radius:5px;padding:0 9px;font:inherit;color:#344e60;background:#fff}.order-range-inputs-v1319>span{padding-bottom:11px;color:#9aaab5}
.order-range-presets-v1319{display:grid;grid-template-columns:1fr 1fr;gap:8px;padding:11px 0}
.order-range-presets-v1319 button{height:42px;border:1px solid #cfdde7;background:#fff;color:#566e81;border-radius:5px;padding:0 12px;text-align:left;cursor:pointer;font:inherit;font-size:13.5px}
.order-range-presets-v1319 button:hover{background:#f1f8ff;border-color:#8fc5eb;color:#147fca}.order-range-presets-v1319 button.active{background:#3f94df;color:#fff;border-color:#3f94df}.order-range-custom-v1319{grid-column:1}
.order-range-actions-v1319{display:grid;grid-template-columns:1fr 1fr;gap:10px;padding-top:10px;border-top:1px solid #e7edf2}.order-range-actions-v1319 .btn{width:100%;min-height:44px}.order-range-actions-v1319 .success-v1319{background:#48b34f!important;border-color:#48b34f!important;color:#fff!important}.order-range-actions-v1319 .success-v1319:hover{background:#3da645!important}

@media(max-width:767px){
  body.salonhero-ui .order-filterbar-v1319{grid-template-columns:96px minmax(0,1fr)!important;gap:7px!important;padding:9px!important;margin:0 0 9px!important}
  body.salonhero-ui .order-filterbar-v1319 select[name="range"]{grid-column:1;grid-row:1;height:44px!important;font-size:13px!important}
  .order-filterbar-v1319 .order-range-picker-v1319{grid-column:2;grid-row:1}
  .order-range-trigger-v1319{height:44px;padding:0 9px}.order-range-trigger-v1319 b{font-size:12.5px}
  .order-filterbar-v1319 .grow{grid-column:1/2;grid-row:2;width:100%!important;min-width:0!important;height:44px!important;font-size:13px!important}
  .order-filterbar-v1319 .order-search-btn-v1319{grid-column:2;grid-row:2;width:100%;height:44px!important}
  .order-range-popover-v1319{position:fixed;left:10px;right:10px;top:auto;bottom:calc(82px + env(safe-area-inset-bottom));width:auto;max-width:none;max-height:76dvh;overflow:auto;border-radius:12px;z-index:95;padding:12px}
  .order-range-inputs-v1319{grid-template-columns:1fr 1fr}.order-range-inputs-v1319>span{display:none}.order-range-inputs-v1319 input{height:44px;font-size:14px}
  .order-range-presets-v1319 button{height:44px;font-size:13px;padding:0 10px}.order-range-actions-v1319{position:sticky;bottom:-12px;background:#fff;padding-bottom:4px}
}

/* ===== Spa Sakura CRM v1.3.20 - Mobile Date Range Sheet ===== */
.order-range-sheet-head-v1320{display:none}
.order-range-sheet-close-v1320{border:0;background:transparent;color:#637a8c;font:400 30px/1 Arial,sans-serif;width:38px;height:38px;display:grid;place-items:center;cursor:pointer;border-radius:50%}
.order-range-sheet-close-v1320:hover{background:#eef5fa;color:#23475f}
.order-range-backdrop-v1320{position:fixed;inset:0;background:rgba(15,31,43,.52);backdrop-filter:blur(1.5px);-webkit-backdrop-filter:blur(1.5px);z-index:4990;opacity:0;transition:opacity .18s ease}
.order-range-backdrop-v1320.show{opacity:1}
body.order-range-open-v1320{overflow:hidden}
@media(max-width:767px){
  .order-range-popover-v1319.order-range-popover-v1320{left:12px!important;right:12px!important;bottom:calc(16px + env(safe-area-inset-bottom))!important;top:auto!important;width:auto!important;max-width:none!important;max-height:min(82dvh,720px)!important;z-index:5000!important;padding:0 16px 14px!important;border:0!important;border-radius:20px!important;box-shadow:0 24px 70px rgba(7,29,44,.30)!important;overflow:auto!important;background:#fff!important;animation:orderRangeSheetInV1320 .2s ease-out}
  .order-range-sheet-head-v1320{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:15px 0 13px;border-bottom:1px solid #e6edf2;position:sticky;top:0;background:#fff;z-index:3}
  .order-range-sheet-head-v1320>div{display:grid;gap:2px}.order-range-sheet-head-v1320 small{font-size:11px;text-transform:uppercase;letter-spacing:.06em;color:#8a9aa7;font-weight:700}.order-range-sheet-head-v1320 strong{font-size:18px;color:#27465c;font-weight:700}
  .order-range-sheet-close-v1320{display:grid}
  .order-range-inputs-v1319{grid-template-columns:1fr 1fr!important;gap:10px!important;padding:14px 0 13px!important;border-bottom:1px solid #e8eef3!important;align-items:end!important}
  .order-range-inputs-v1319 label{gap:7px!important;color:#60798c!important;font-size:12px!important;font-weight:600!important}
  .order-range-inputs-v1319 input{height:48px!important;border:1px solid #c8d8e4!important;border-radius:10px!important;padding:0 10px!important;font-size:14px!important;color:#2d4b60!important;background:#fdfefe!important;box-shadow:inset 0 1px 2px rgba(17,56,80,.03)}
  .order-range-inputs-v1319 input:focus{outline:0!important;border-color:#1b94e8!important;box-shadow:0 0 0 3px rgba(27,148,232,.10)!important}
  .order-range-presets-v1319{grid-template-columns:1fr 1fr!important;gap:9px!important;padding:14px 0!important}
  .order-range-presets-v1319 button{height:48px!important;border:1px solid #d2dee7!important;border-radius:10px!important;background:#fff!important;color:#506a7d!important;font-size:14px!important;font-weight:500!important;padding:0 13px!important;text-align:left!important;transition:.15s ease!important}
  .order-range-presets-v1319 button:active{transform:scale(.985)}
  .order-range-presets-v1319 button.active{background:#168fe1!important;border-color:#168fe1!important;color:#fff!important;box-shadow:0 5px 14px rgba(22,143,225,.18)!important}
  .order-range-custom-v1319{grid-column:1!important}
  .order-range-actions-v1319{position:sticky!important;bottom:-14px!important;background:#fff!important;z-index:3!important;display:grid!important;grid-template-columns:1fr 1fr!important;gap:10px!important;padding:12px 0 calc(2px + env(safe-area-inset-bottom))!important;border-top:1px solid #e7edf2!important}
  .order-range-actions-v1319 .btn{height:48px!important;border-radius:10px!important;font-size:14px!important}
  .order-range-actions-v1319 .success-v1319{background:#3fb14b!important;border-color:#3fb14b!important;box-shadow:0 5px 14px rgba(63,177,75,.16)!important}
  @keyframes orderRangeSheetInV1320{from{opacity:0;transform:translateY(18px) scale(.985)}to{opacity:1;transform:translateY(0) scale(1)}}
}
@media(min-width:768px){
  .order-range-popover-v1320 .order-range-sheet-head-v1320{display:none}
}

/* ===== Spa Sakura CRM v1.3.21 - Aligned range controls & professional chevrons ===== */
/* Order list date-range trigger: keep icon, label and dropdown icon perfectly centered */
body.salonhero-ui .order-range-trigger-v1319{
  display:grid!important;
  grid-template-columns:24px minmax(0,1fr) 24px!important;
  align-items:center!important;
  justify-items:center!important;
  column-gap:8px!important;
  height:44px!important;
  padding:0 10px!important;
  line-height:1!important;
}
body.salonhero-ui .order-range-calendar-v1319{
  width:24px!important;
  height:44px!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  color:#178fdc!important;
  line-height:0!important;
}
body.salonhero-ui .order-range-calendar-v1319 .ui-icon{
  width:18px!important;
  height:18px!important;
  display:block!important;
}
body.salonhero-ui .order-range-trigger-v1319 b{
  min-width:0!important;
  width:100%!important;
  height:44px!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  margin:0!important;
  padding:0!important;
  line-height:1.2!important;
  text-align:center!important;
  white-space:nowrap!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
  font-size:13.5px!important;
  font-weight:600!important;
}
body.salonhero-ui .order-range-caret-v1319{
  width:24px!important;
  height:44px!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  color:#6f8798!important;
  line-height:0!important;
  transition:transform .18s ease,color .18s ease!important;
}
body.salonhero-ui .order-range-caret-v1319 .ui-icon{
  width:16px!important;
  height:16px!important;
  display:block!important;
  stroke-width:2!important;
}
body.salonhero-ui .order-range-trigger-v1319[aria-expanded="true"] .order-range-caret-v1319{
  transform:rotate(180deg)!important;
  color:#168fd9!important;
}

/* Reports use the same visual language, avoiding font-glyph arrows that sit off-center */
body.salonhero-ui .report-range-trigger-v1321{
  display:grid!important;
  grid-template-columns:24px minmax(0,1fr) 24px!important;
  align-items:center!important;
  justify-items:center!important;
  column-gap:8px!important;
  padding:0 10px!important;
  line-height:1!important;
}
body.salonhero-ui .report-range-trigger-v1321 .report-range-icon-v1321,
body.salonhero-ui .report-range-trigger-v1321 .report-range-caret-v1321{
  width:24px!important;
  height:100%!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  margin:0!important;
  padding:0!important;
  line-height:0!important;
  color:#178fdc!important;
  font-style:normal!important;
}
body.salonhero-ui .report-range-trigger-v1321 .report-range-caret-v1321{color:#6f8798!important}
body.salonhero-ui .report-range-trigger-v1321 .ui-icon{display:block!important}
body.salonhero-ui .report-range-trigger-v1321 b{
  width:100%!important;
  min-width:0!important;
  height:100%!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  margin:0!important;
  line-height:1.2!important;
  text-align:center!important;
  white-space:nowrap!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
}

/* Customer selector: replace the text glyph with the same SVG chevron and center it */
body.salonhero-ui .selector-chevron-v1321{
  width:28px!important;
  height:100%!important;
  min-height:38px!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  line-height:0!important;
  color:#7990a1!important;
}
body.salonhero-ui .selector-chevron-v1321 .ui-icon{
  width:16px!important;
  height:16px!important;
  display:block!important;
  stroke-width:2!important;
}
body.salonhero-ui .customer-selector-button.open .selector-chevron-v1321{transform:rotate(180deg);color:#168fd9!important}

/* Native selects / compact filter controls: consistent vertical centering on PC + mobile */
body.salonhero-ui .order-filterbar-v1319 select,
body.salonhero-ui .order-filterbar-v1319 input,
body.salonhero-ui .order-search-btn-v1319{
  min-height:44px!important;
  line-height:1.2!important;
  vertical-align:middle!important;
}

@media(max-width:767px){
  body.salonhero-ui .order-range-trigger-v1319{
    grid-template-columns:22px minmax(0,1fr) 22px!important;
    column-gap:6px!important;
    padding:0 8px!important;
  }
  body.salonhero-ui .order-range-calendar-v1319,
  body.salonhero-ui .order-range-caret-v1319{
    width:22px!important;
    height:44px!important;
  }
  body.salonhero-ui .order-range-trigger-v1319 b{
    height:44px!important;
    font-size:13px!important;
  }
  body.salonhero-ui .report-range-trigger-v1321{
    grid-template-columns:22px minmax(0,1fr) 22px!important;
    column-gap:6px!important;
    padding:0 8px!important;
  }
}

/* v1.3.22 — polished customer picker (PC + mobile) */
body.salonhero-ui .customer-dropdown-v4{
  width:min(520px,calc(100vw - 36px))!important;
  border:1px solid #bfd5e3!important;
  border-radius:10px!important;
  background:#fff!important;
  box-shadow:0 18px 46px rgba(31,73,104,.18)!important;
  overflow:hidden!important;
}
body.salonhero-ui .customer-dropdown-search{
  position:relative!important;
  display:flex!important;
  align-items:center!important;
  padding:10px!important;
  border-bottom:1px solid #e4edf3!important;
  background:#fff!important;
}
body.salonhero-ui .customer-search-icon-v1322{
  position:absolute!important;
  left:24px!important;
  top:50%!important;
  width:20px!important;
  height:20px!important;
  margin:0!important;
  padding:0!important;
  transform:translateY(-50%)!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  color:#7b91a2!important;
  line-height:0!important;
  pointer-events:none!important;
  z-index:2!important;
}
body.salonhero-ui .customer-search-icon-v1322 .ui-icon{
  width:17px!important;
  height:17px!important;
  display:block!important;
  stroke-width:2!important;
}
body.salonhero-ui .customer-dropdown-search input{
  width:100%!important;
  height:46px!important;
  min-height:46px!important;
  margin:0!important;
  padding:0 14px 0 44px!important;
  border:1px solid #c6d6e1!important;
  border-radius:8px!important;
  background:#fff!important;
  color:#284257!important;
  font-size:14px!important;
  line-height:46px!important;
  outline:0!important;
  box-shadow:none!important;
  transition:border-color .15s ease,box-shadow .15s ease!important;
}
body.salonhero-ui .customer-dropdown-search input::placeholder{color:#8798a6!important;opacity:1!important}
body.salonhero-ui .customer-dropdown-search input:focus{
  border-color:#168fe5!important;
  box-shadow:0 0 0 3px rgba(22,143,229,.10)!important;
}
body.salonhero-ui .customer-options{
  max-height:360px!important;
  overflow-y:auto!important;
  overflow-x:hidden!important;
  scrollbar-width:thin!important;
  scrollbar-color:#9eb0bc transparent!important;
  overscroll-behavior:contain!important;
}
body.salonhero-ui .customer-options::-webkit-scrollbar{width:8px!important}
body.salonhero-ui .customer-options::-webkit-scrollbar-track{background:transparent!important}
body.salonhero-ui .customer-options::-webkit-scrollbar-thumb{
  background:#9eb0bc!important;
  border:2px solid #fff!important;
  border-radius:999px!important;
}
body.salonhero-ui .customer-options::-webkit-scrollbar-thumb:hover{background:#7f95a4!important}
body.salonhero-ui .customer-option{
  min-height:62px!important;
  display:grid!important;
  grid-template-columns:42px minmax(0,1fr) 34px!important;
  gap:12px!important;
  align-items:center!important;
  padding:9px 12px!important;
  border:0!important;
  border-bottom:1px solid #edf2f5!important;
  background:#fff!important;
  color:#284257!important;
  text-decoration:none!important;
  transition:background .14s ease!important;
}
body.salonhero-ui .customer-option:last-child{border-bottom:0!important}
body.salonhero-ui .customer-option:hover{background:#f5faff!important}
body.salonhero-ui .customer-option.selected{background:#eaf6fd!important}
body.salonhero-ui .customer-option-avatar{
  width:40px!important;
  height:40px!important;
  border-radius:50%!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  background:#eef7fc!important;
  color:#168fd9!important;
  font-size:13px!important;
  font-weight:750!important;
  line-height:1!important;
}
body.salonhero-ui .customer-option-avatar-guest-v1322{
  background:#eef4f7!important;
  color:#6f8797!important;
}
body.salonhero-ui .customer-option-avatar-guest-v1322 .ui-icon{width:16px!important;height:16px!important;stroke-width:1.9!important}
body.salonhero-ui .customer-option-copy-v1322{display:block!important;min-width:0!important}
body.salonhero-ui .customer-option-copy-v1322 b{
  display:block!important;
  margin:0!important;
  color:#263f54!important;
  font-size:14px!important;
  font-weight:700!important;
  line-height:1.25!important;
  white-space:nowrap!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
}
body.salonhero-ui .customer-option-copy-v1322 small{
  display:block!important;
  margin-top:4px!important;
  color:#8595a2!important;
  font-size:11.5px!important;
  line-height:1.25!important;
  white-space:nowrap!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
}
body.salonhero-ui .customer-option-check-v1322{
  width:28px!important;
  height:28px!important;
  margin:0!important;
  padding:0!important;
  border-radius:50%!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  justify-self:center!important;
  background:#168fe5!important;
  color:#fff!important;
  font-style:normal!important;
  line-height:0!important;
}
body.salonhero-ui .customer-option-check-v1322 .ui-icon{width:14px!important;height:14px!important;stroke-width:2.4!important}

/* The main selector uses the same visual language instead of text glyphs. */
body.salonhero-ui .customer-selector-avatar .ui-icon{width:17px!important;height:17px!important;stroke-width:1.9!important}

@media(max-width:767px){
  body.salonhero-ui .customer-dropdown-v4{
    left:12px!important;
    right:12px!important;
    top:auto!important;
    bottom:calc(78px + env(safe-area-inset-bottom))!important;
    width:auto!important;
    max-height:min(68dvh,560px)!important;
    border-radius:16px!important;
    box-shadow:0 22px 58px rgba(22,52,73,.28)!important;
  }
  body.salonhero-ui .customer-dropdown-search{padding:12px!important}
  body.salonhero-ui .customer-search-icon-v1322{left:27px!important}
  body.salonhero-ui .customer-dropdown-search input{
    height:50px!important;
    min-height:50px!important;
    line-height:50px!important;
    padding-left:46px!important;
    border-radius:10px!important;
    font-size:16px!important;
  }
  body.salonhero-ui .customer-options{max-height:calc(min(68dvh,560px) - 75px)!important}
  body.salonhero-ui .customer-option{
    min-height:68px!important;
    grid-template-columns:44px minmax(0,1fr) 34px!important;
    padding:10px 13px!important;
    gap:12px!important;
  }
  body.salonhero-ui .customer-option-avatar{width:42px!important;height:42px!important}
  body.salonhero-ui .customer-option-copy-v1322 b{font-size:15px!important}
  body.salonhero-ui .customer-option-copy-v1322 small{font-size:12.5px!important}
}

/* ===== Spa Sakura CRM v1.3.23 — Money card form + mobile feature parity ===== */
body.salonhero-ui .card-type-modal-v1323{max-width:820px!important}
body.salonhero-ui .card-type-title-v1323{min-height:66px!important;padding:12px 16px!important}
body.salonhero-ui .card-type-title-v1323>div{display:grid;gap:3px}
body.salonhero-ui .card-type-title-v1323 h2{margin:0!important;font-size:18px!important;color:#50677a!important;font-weight:600!important}
body.salonhero-ui .card-type-title-v1323 p{margin:0!important;font-size:11px!important;color:#91a0aa!important}
body.salonhero-ui .card-type-form-v1323{padding:16px 18px 22px;display:grid;background:#fff}
body.salonhero-ui .card-form-row-v1323{display:grid;grid-template-columns:190px minmax(0,1fr);gap:18px;align-items:start;padding:12px 0;margin:0;border-bottom:1px solid #edf2f5;color:#5d7486}
body.salonhero-ui .card-form-row-v1323:last-child{border-bottom:0}
body.salonhero-ui .card-form-row-v1323>span{padding-top:11px;font-size:13px;font-weight:500;color:#5a7183}
body.salonhero-ui .card-form-row-v1323 em{font-style:normal;color:#ef4444}
body.salonhero-ui .card-form-row-v1323>div{min-width:0;display:grid;gap:5px}
body.salonhero-ui .card-form-row-v1323 input:not([type="checkbox"]){height:42px;border:1px solid #cbd9e3;border-radius:3px;padding:0 11px;background:#fff;color:#385266;font-size:13px}
body.salonhero-ui .card-form-row-v1323 input:focus{outline:0;border-color:#2498e3;box-shadow:0 0 0 2px rgba(36,152,227,.08)}
body.salonhero-ui .card-form-row-v1323 small{font-size:11px;color:#8c9ca8;line-height:1.35}.salonhero-ui .card-form-row-v1323:first-child small{color:#f34a3e}
body.salonhero-ui .card-money-line-v1323{display:flex!important;align-items:center;gap:12px;flex-wrap:wrap}
body.salonhero-ui .money-field-v1323{display:flex!important;align-items:center;width:min(270px,100%);height:42px;border:1px solid #cbd9e3;border-radius:3px;background:#fff;overflow:hidden}
body.salonhero-ui .money-field-v1323:focus-within{border-color:#2498e3;box-shadow:0 0 0 2px rgba(36,152,227,.08)}
body.salonhero-ui .money-field-v1323 input{border:0!important;box-shadow:none!important;height:40px!important;min-width:0!important;flex:1;text-align:right;font-weight:600;padding:0 8px 0 11px!important}
body.salonhero-ui .money-field-v1323 i{font-style:normal;font-weight:600;color:#60798b;padding:0 10px 0 6px;border-left:1px solid #edf1f4}
body.salonhero-ui .card-inline-check-v1323{display:flex!important;align-items:center!important;gap:7px!important;color:#61788a!important;font-size:12px!important;cursor:pointer;margin:0!important}.salonhero-ui .card-inline-check-v1323 input{width:18px!important;height:18px!important;min-height:18px!important;margin:0!important;accent-color:#2498e3}
body.salonhero-ui .card-type-footer-v1323{min-height:62px!important;padding:9px 14px!important;border-top:1px solid #dce6ec!important}
.mobile-admin-tools-v1323{display:none}
@media(max-width:767px){
 body.salonhero-ui .card-type-modal-v1323{width:100%!important;max-width:100%!important;max-height:calc(100dvh - 14px)!important;border-radius:16px 16px 0 0!important}
 body.salonhero-ui .card-type-title-v1323{padding:13px 14px!important}.salonhero-ui .card-type-title-v1323 h2{font-size:18px!important}
 body.salonhero-ui .card-type-form-v1323{padding:8px 14px 16px;overflow:auto}.salonhero-ui .card-form-row-v1323{grid-template-columns:1fr;gap:6px;padding:12px 0}.salonhero-ui .card-form-row-v1323>span{padding-top:0;font-size:13px;font-weight:650;color:#3f5b70}
 body.salonhero-ui .card-form-row-v1323 input:not([type="checkbox"]){height:48px!important;font-size:16px!important;border-radius:8px}.salonhero-ui .money-field-v1323{width:100%;height:48px;border-radius:8px}.salonhero-ui .money-field-v1323 input{height:46px!important;font-size:16px!important}.salonhero-ui .card-money-line-v1323{display:grid!important;grid-template-columns:1fr;gap:10px!important}
 body.salonhero-ui .card-type-footer-v1323{position:sticky!important;bottom:0!important;background:#fff!important;z-index:5!important;padding:9px 12px max(9px,env(safe-area-inset-bottom))!important;display:grid!important;grid-template-columns:1fr!important;gap:8px!important}.salonhero-ui .card-type-footer-v1323>div{display:grid!important;grid-template-columns:1fr 1.2fr!important;gap:8px!important}.salonhero-ui .card-type-footer-v1323 .btn{width:100%!important}
 body.salonhero-ui .catalog-admin-head-v8{display:grid!important;grid-template-columns:minmax(0,1fr) auto!important;gap:8px!important}.salonhero-ui .catalog-head-actions-v8{display:flex!important;gap:6px!important}.salonhero-ui .catalog-head-actions-v8 .btn.primary{display:inline-flex!important;white-space:nowrap!important;min-height:40px!important;padding:8px 11px!important}
 body.salonhero-ui .mobile-admin-tools-v1323{display:block;margin:14px;border:1px solid #dce6ed;border-radius:12px;overflow:hidden;background:#fff}.salonhero-ui .mobile-admin-tools-head-v1323{padding:12px 13px;background:#f5f9fc;border-bottom:1px solid #e3ebf0;display:grid;gap:2px}.salonhero-ui .mobile-admin-tools-head-v1323 b{font-size:14px;color:#2f5067}.salonhero-ui .mobile-admin-tools-head-v1323 small{font-size:11px;color:#899aa6}
 body.salonhero-ui .mobile-admin-tools-grid-v1323{display:grid;grid-template-columns:1fr 1fr}.salonhero-ui .mobile-admin-tools-grid-v1323 a{min-width:0;min-height:76px;padding:11px;display:grid;grid-template-columns:28px minmax(0,1fr) 14px;gap:8px;align-items:center;color:#496477;text-decoration:none;border-right:1px solid #e8eef2;border-bottom:1px solid #e8eef2;background:#fff}.salonhero-ui .mobile-admin-tools-grid-v1323 a:nth-child(2n){border-right:0}.salonhero-ui .mobile-admin-tools-grid-v1323 a:nth-last-child(-n+2){border-bottom:0}.salonhero-ui .mobile-admin-tools-grid-v1323 a>.ui-icon:first-child{color:#168fdc}.salonhero-ui .mobile-admin-tools-grid-v1323 a>.ui-icon:last-child{transform:rotate(-90deg);color:#9badb9}.salonhero-ui .mobile-admin-tools-grid-v1323 span{min-width:0;display:grid;gap:2px}.salonhero-ui .mobile-admin-tools-grid-v1323 b{font-size:12.5px;color:#315168;white-space:nowrap}.salonhero-ui .mobile-admin-tools-grid-v1323 small{font-size:10px;color:#91a0aa;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
}
body.salonhero-ui .item-editor-price-wrap-v1323{display:flex;align-items:center;justify-content:flex-end;gap:0;min-width:160px}.salonhero-ui .item-editor-price-wrap-v1323 input{width:150px;height:42px;text-align:right;border:0;border-bottom:1px solid #cdd9e1;background:transparent;font-weight:700;color:#28485e;font-size:16px;padding:0 7px}.salonhero-ui .item-editor-price-wrap-v1323 i{font-style:normal;color:#536c7e;font-weight:600}

/* ===== Spa Sakura CRM v1.3.24 — Mobile Web-App Form System ===== */
/* Product / service editor keeps the familiar desktop form, but becomes a true app screen on phones. */
body.salonhero-ui .catalog-item-title-v1324{min-height:58px;height:auto;padding:10px 14px}
body.salonhero-ui .catalog-item-title-v1324>div{min-width:0;display:grid;gap:2px}
body.salonhero-ui .catalog-item-title-v1324 h2{margin:0;font-weight:650}
body.salonhero-ui .catalog-item-title-v1324 p{margin:0;font-size:10.5px;color:#8d9ca7}
body.salonhero-ui .catalog-item-form-shell-v1324{min-height:0}
body.salonhero-ui .catalog-field-help-v1324{display:block;margin-top:4px;color:#92a0aa;font-size:10px;line-height:1.35}
body.salonhero-ui .catalog-money-field-v1324{display:flex;align-items:center;width:100%;min-width:0;height:38px;border:1px solid #c9d8e2;background:#fff;overflow:hidden}
body.salonhero-ui .catalog-money-field-v1324:focus-within{border-color:#2197e4;box-shadow:0 0 0 2px rgba(33,151,228,.08)}
body.salonhero-ui .catalog-money-field-v1324 input{height:36px!important;min-height:36px!important;flex:1;min-width:0;border:0!important;box-shadow:none!important;text-align:right;padding:0 8px!important;background:transparent!important}
body.salonhero-ui .catalog-money-field-v1324 i{font-style:normal;color:#688093;padding:0 10px 0 7px;border-left:1px solid #e8eef2;font-weight:600}
body.salonhero-ui .catalog-image-help-v1324{font-size:9.5px!important;color:#9aa7b0!important}

@media(max-width:767px){
  /* Hide app chrome while a complex editor is open. */
  body.modal-open-v137 .mobile-nav,
  body.modal-open-v137 .fab{display:none!important}

  /* Full-screen editor: no squeezed desktop modal, no horizontal compression. */
  body.salonhero-ui .catalog-item-modal-shell-v1324,
  body .catalog-item-modal-shell-v1324{
    inset:0!important;
    padding:0!important;
    align-items:stretch!important;
    justify-content:stretch!important;
    background:#f3f7fa!important;
    overflow:hidden!important;
  }
  body.salonhero-ui .catalog-item-modal-card-v1324,
  body .catalog-item-modal-card-v1324{
    width:100vw!important;
    max-width:100vw!important;
    height:100dvh!important;
    max-height:100dvh!important;
    margin:0!important;
    border:0!important;
    border-radius:0!important;
    box-shadow:none!important;
    display:flex!important;
    flex-direction:column!important;
    overflow:hidden!important;
    background:#f3f7fa!important;
  }
  body.salonhero-ui .catalog-item-title-v1324,
  body .catalog-item-title-v1324{
    flex:0 0 auto!important;
    min-height:64px!important;
    height:auto!important;
    padding:10px 14px!important;
    padding-top:max(10px,env(safe-area-inset-top))!important;
    border-bottom:1px solid #dbe6ed!important;
    background:#fff!important;
    position:relative!important;
    z-index:20!important;
  }
  body.salonhero-ui .catalog-item-title-v1324 h2,
  body .catalog-item-title-v1324 h2{
    font-size:19px!important;
    line-height:1.25!important;
    color:#2d4b61!important;
    font-weight:750!important;
  }
  body.salonhero-ui .catalog-item-title-v1324 p,
  body .catalog-item-title-v1324 p{
    font-size:11px!important;
    line-height:1.35!important;
    color:#8d9ca7!important;
    margin-top:3px!important;
  }
  body.salonhero-ui .catalog-item-title-v1324>a,
  body .catalog-item-title-v1324>a{
    width:42px!important;
    height:42px!important;
    flex:0 0 42px!important;
    border-radius:50%!important;
    display:grid!important;
    place-items:center!important;
    background:#f2f6f8!important;
    color:#62798a!important;
    font-size:25px!important;
    text-decoration:none!important;
  }

  body.salonhero-ui .catalog-item-form-shell-v1324,
  body .catalog-item-form-shell-v1324{
    flex:1 1 auto!important;
    min-height:0!important;
    display:flex!important;
    flex-direction:column!important;
    overflow:hidden!important;
  }

  /* The old desktop tabs did not switch panels, so hiding them on mobile removes a misleading control. */
  body.salonhero-ui .catalog-item-tabs-v1324,
  body .catalog-item-tabs-v1324{display:none!important}

  body.salonhero-ui .catalog-item-form-v1324,
  body .catalog-item-form-v1324{
    flex:1 1 auto!important;
    min-height:0!important;
    overflow-y:auto!important;
    overflow-x:hidden!important;
    -webkit-overflow-scrolling:touch!important;
    overscroll-behavior:contain!important;
    display:flex!important;
    flex-direction:column!important;
    gap:12px!important;
    padding:12px 12px 20px!important;
    background:#f3f7fa!important;
    scroll-padding-bottom:100px!important;
  }

  /* One-column form card. Every control gets full width and a thumb-friendly hit area. */
  body.salonhero-ui .catalog-item-fields-v1324,
  body .catalog-item-fields-v1324{
    display:block!important;
    width:100%!important;
    min-width:0!important;
    padding:13px!important;
    border:1px solid #dce6ed!important;
    border-radius:14px!important;
    background:#fff!important;
    box-shadow:0 3px 12px rgba(36,65,86,.035)!important;
  }
  body.salonhero-ui .catalog-item-fields-v1324>label,
  body .catalog-item-fields-v1324>label{
    display:flex!important;
    flex-direction:column!important;
    align-items:stretch!important;
    width:100%!important;
    min-width:0!important;
    grid-template-columns:none!important;
    gap:6px!important;
    margin:0 0 15px!important;
    padding:0!important;
    color:#496376!important;
    font-size:13px!important;
  }
  body.salonhero-ui .catalog-item-fields-v1324>label:last-child,
  body .catalog-item-fields-v1324>label:last-child{margin-bottom:0!important}
  body.salonhero-ui .catalog-item-fields-v1324>label>span,
  body .catalog-item-fields-v1324>label>span{
    display:block!important;
    width:100%!important;
    font-size:13px!important;
    line-height:1.3!important;
    font-weight:700!important;
    color:#36566d!important;
  }
  body.salonhero-ui .catalog-item-fields-v1324>label>span em,
  body .catalog-item-fields-v1324>label>span em{color:#ef4444!important;font-style:normal!important}

  body.salonhero-ui .catalog-item-fields-v1324 input:not([type="checkbox"]):not([type="file"]),
  body.salonhero-ui .catalog-item-fields-v1324 select,
  body.salonhero-ui .catalog-item-fields-v1324 textarea,
  body .catalog-item-fields-v1324 input:not([type="checkbox"]):not([type="file"]),
  body .catalog-item-fields-v1324 select,
  body .catalog-item-fields-v1324 textarea{
    display:block!important;
    width:100%!important;
    max-width:none!important;
    min-width:0!important;
    min-height:50px!important;
    height:50px!important;
    margin:0!important;
    padding:0 13px!important;
    border:1px solid #cad8e2!important;
    border-radius:10px!important;
    background:#fff!important;
    color:#29485e!important;
    font-size:16px!important;
    line-height:1.3!important;
    box-shadow:none!important;
    outline:0!important;
    -webkit-appearance:none;
    appearance:none;
  }
  body.salonhero-ui .catalog-item-fields-v1324 textarea,
  body .catalog-item-fields-v1324 textarea{
    height:auto!important;
    min-height:112px!important;
    padding:12px 13px!important;
    resize:vertical!important;
  }
  body.salonhero-ui .catalog-item-fields-v1324 input:focus,
  body.salonhero-ui .catalog-item-fields-v1324 select:focus,
  body.salonhero-ui .catalog-item-fields-v1324 textarea:focus,
  body .catalog-item-fields-v1324 input:focus,
  body .catalog-item-fields-v1324 select:focus,
  body .catalog-item-fields-v1324 textarea:focus{
    border-color:#1f95e5!important;
    box-shadow:0 0 0 3px rgba(31,149,229,.10)!important;
  }
  body.salonhero-ui .catalog-field-help-v1324,
  body .catalog-field-help-v1324{
    margin:0!important;
    font-size:11px!important;
    line-height:1.4!important;
    color:#8a9aa6!important;
  }

  /* Price fields use native numeric keyboard and live dot grouping, with a dedicated currency suffix. */
  body.salonhero-ui .catalog-money-field-v1324,
  body .catalog-money-field-v1324{
    width:100%!important;
    height:50px!important;
    border:1px solid #cad8e2!important;
    border-radius:10px!important;
    background:#fff!important;
    overflow:hidden!important;
  }
  body.salonhero-ui .catalog-money-field-v1324:focus-within,
  body .catalog-money-field-v1324:focus-within{
    border-color:#1f95e5!important;
    box-shadow:0 0 0 3px rgba(31,149,229,.10)!important;
  }
  body.salonhero-ui .catalog-money-field-v1324 input,
  body .catalog-money-field-v1324 input{
    height:48px!important;
    min-height:48px!important;
    border:0!important;
    border-radius:0!important;
    box-shadow:none!important;
    padding:0 10px 0 13px!important;
    text-align:left!important;
    font-size:16px!important;
    font-weight:650!important;
    background:transparent!important;
  }
  body.salonhero-ui .catalog-money-field-v1324 i,
  body .catalog-money-field-v1324 i{
    height:30px!important;
    min-width:42px!important;
    display:grid!important;
    place-items:center!important;
    padding:0 10px!important;
    border-left:1px solid #e4ebf0!important;
    color:#60798b!important;
    font-size:14px!important;
    font-weight:700!important;
  }

  body.salonhero-ui .catalog-capacity-fields-v1324,
  body .catalog-capacity-fields-v1324{
    display:grid!important;
    grid-template-columns:minmax(0,1fr) 118px!important;
    gap:8px!important;
    width:100%!important;
  }
  body.salonhero-ui .catalog-capacity-fields-v1324 input,
  body.salonhero-ui .catalog-capacity-fields-v1324 select,
  body .catalog-capacity-fields-v1324 input,
  body .catalog-capacity-fields-v1324 select{width:100%!important;min-width:0!important}

  /* Image upload becomes its own app card. The ugly native file chooser is hidden. */
  body.salonhero-ui .catalog-image-picker-v1324,
  body .catalog-image-picker-v1324{
    width:100%!important;
    margin:0!important;
    padding:14px!important;
    border:1px solid #dce6ed!important;
    border-radius:14px!important;
    background:#fff!important;
    box-shadow:0 3px 12px rgba(36,65,86,.035)!important;
    display:grid!important;
    justify-items:center!important;
    gap:10px!important;
    color:#3c5b70!important;
    cursor:pointer!important;
  }
  body.salonhero-ui .catalog-image-picker-v1324>span,
  body .catalog-image-picker-v1324>span{
    width:100%!important;
    text-align:left!important;
    font-size:13px!important;
    line-height:1.3!important;
    font-weight:700!important;
    color:#36566d!important;
  }
  body.salonhero-ui .catalog-image-preview-v1324,
  body .catalog-image-preview-v1324{
    width:132px!important;
    height:132px!important;
    border:1px dashed #bdd0dc!important;
    border-radius:14px!important;
    background:#f8fbfd!important;
    color:#9fb0bb!important;
    overflow:hidden!important;
  }
  body.salonhero-ui .catalog-image-preview-v1324 img,
  body .catalog-image-preview-v1324 img{width:100%!important;height:100%!important;object-fit:cover!important}
  body.salonhero-ui .catalog-image-preview-v1324 small,
  body .catalog-image-preview-v1324 small{font-size:10px!important;color:#9aa9b3!important;text-align:center!important;padding:0 7px!important}
  body.salonhero-ui .catalog-image-picker-v1324 input[type="file"],
  body .catalog-image-picker-v1324 input[type="file"]{
    position:absolute!important;
    width:1px!important;
    height:1px!important;
    opacity:0!important;
    pointer-events:none!important;
    overflow:hidden!important;
  }
  body.salonhero-ui .catalog-image-picker-v1324>b,
  body .catalog-image-picker-v1324>b{
    min-width:170px!important;
    min-height:42px!important;
    padding:0 14px!important;
    border:1px solid #b9d6e8!important;
    border-radius:9px!important;
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    background:#f6fbfe!important;
    color:#168dd9!important;
    font-size:13px!important;
    font-weight:700!important;
  }
  body.salonhero-ui .catalog-image-help-v1324,
  body .catalog-image-help-v1324{font-size:10.5px!important;color:#95a3ad!important}

  /* App-style bottom action bar, separated from scroll content and safe-area aware. */
  body.salonhero-ui .catalog-item-footer-v1324,
  body .catalog-item-footer-v1324{
    position:relative!important;
    bottom:auto!important;
    flex:0 0 auto!important;
    min-height:72px!important;
    padding:9px 12px max(9px,env(safe-area-inset-bottom))!important;
    border-top:1px solid #d9e5ec!important;
    background:#fff!important;
    box-shadow:0 -8px 22px rgba(34,64,85,.08)!important;
    display:grid!important;
    grid-template-columns:1fr!important;
    gap:8px!important;
    z-index:30!important;
  }
  body.salonhero-ui .catalog-status-toggle-v1324,
  body .catalog-status-toggle-v1324{
    min-height:38px!important;
    display:flex!important;
    align-items:center!important;
    gap:9px!important;
    font-size:13px!important;
    font-weight:650!important;
    color:#405e72!important;
  }
  body.salonhero-ui .catalog-status-toggle-v1324 input,
  body .catalog-status-toggle-v1324 input{
    width:20px!important;
    height:20px!important;
    min-height:20px!important;
    accent-color:#1b95e5!important;
  }
  body.salonhero-ui .catalog-item-footer-v1324>div,
  body .catalog-item-footer-v1324>div{
    width:100%!important;
    display:grid!important;
    grid-template-columns:.85fr 1.4fr!important;
    gap:8px!important;
  }
  body.salonhero-ui .catalog-item-footer-v1324 .btn,
  body .catalog-item-footer-v1324 .btn{
    width:100%!important;
    min-height:48px!important;
    height:48px!important;
    border-radius:9px!important;
    font-size:14px!important;
    font-weight:700!important;
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
  }

  /* Shared mobile form polish across the remaining admin dialogs. */
  body.salonhero-ui .user-modal-card-v9 .user-form-fields-v9 label,
  body.salonhero-ui .card-issue-modal-v8 .card-type-form-v8 label,
  body.salonhero-ui .stock-modal-card-v8 .stock-adjust-form-v8 label,
  body .user-modal-card-v9 .user-form-fields-v9 label,
  body .card-issue-modal-v8 .card-type-form-v8 label,
  body .stock-modal-card-v8 .stock-adjust-form-v8 label{
    display:flex!important;
    flex-direction:column!important;
    align-items:stretch!important;
    gap:6px!important;
    font-size:13px!important;
    color:#3e5c70!important;
  }
  body.salonhero-ui .user-modal-card-v9 input:not([type="checkbox"]):not([type="file"]),
  body.salonhero-ui .user-modal-card-v9 select,
  body.salonhero-ui .card-issue-modal-v8 input:not([type="checkbox"]),
  body.salonhero-ui .card-issue-modal-v8 select,
  body.salonhero-ui .stock-modal-card-v8 .stock-adjust-form-v8 input,
  body.salonhero-ui .stock-modal-card-v8 .stock-adjust-form-v8 select,
  body .user-modal-card-v9 input:not([type="checkbox"]):not([type="file"]),
  body .user-modal-card-v9 select,
  body .card-issue-modal-v8 input:not([type="checkbox"]),
  body .card-issue-modal-v8 select,
  body .stock-modal-card-v8 .stock-adjust-form-v8 input,
  body .stock-modal-card-v8 .stock-adjust-form-v8 select{
    width:100%!important;
    min-width:0!important;
    min-height:48px!important;
    height:48px!important;
    border-radius:9px!important;
    font-size:16px!important;
    padding:0 12px!important;
  }
  body.salonhero-ui .stock-modal-card-v8 .stock-adjust-form-v8,
  body .stock-modal-card-v8 .stock-adjust-form-v8{grid-template-columns:1fr!important;padding:12px!important;gap:12px!important}
  body.salonhero-ui .stock-modal-card-v8 .stock-adjust-form-v8 .wide,
  body .stock-modal-card-v8 .stock-adjust-form-v8 .wide{grid-column:auto!important}

  /* Customer form controls get the same input height and spacing. */
  body.salonhero-ui .modal-box-v4 .form-grid-v4,
  body .modal-box-v4 .form-grid-v4{display:grid!important;grid-template-columns:1fr!important;gap:13px!important}
  body.salonhero-ui .modal-box-v4 .form-grid-v4 label,
  body .modal-box-v4 .form-grid-v4 label{grid-column:auto!important;font-size:13px!important;color:#3e5c70!important}
  body.salonhero-ui .modal-box-v4 .form-grid-v4 input,
  body.salonhero-ui .modal-box-v4 .form-grid-v4 select,
  body.salonhero-ui .modal-box-v4 .form-grid-v4 textarea,
  body .modal-box-v4 .form-grid-v4 input,
  body .modal-box-v4 .form-grid-v4 select,
  body .modal-box-v4 .form-grid-v4 textarea{
    width:100%!important;
    min-height:48px!important;
    border-radius:9px!important;
    font-size:16px!important;
    margin-top:5px!important;
  }
}

@supports not (height:100dvh){
  @media(max-width:767px){
    body.salonhero-ui .catalog-item-modal-card-v1324,
    body .catalog-item-modal-card-v1324{height:100vh!important;max-height:100vh!important}
  }
}

/* ===== Spa Sakura CRM v1.3.25 — Mobile catalog polish + AJAX customer search + flexible money card ===== */
.customer-dropdown-v4.searching-v1325::after{
  content:'Đang tìm khách hàng…';display:block;padding:10px 14px;color:#7d91a0;font-size:12px;border-top:1px solid #edf2f5;background:#fbfdfe
}
.customer-search-empty-v1325{padding:18px 14px;text-align:center;color:#8b9aa5;font-size:12px;background:#fff}
.item-editor-card-value-row-v1325{grid-template-columns:140px minmax(0,1fr)!important;align-items:center!important}
.item-editor-card-value-row-v1325>small{grid-column:2;color:#8798a6;font-size:11px;line-height:1.4;margin-top:4px}
.item-editor-card-value-wrap-v1325 input{display:block!important}

@media(max-width:767px){
  /* Danh mục sản phẩm / dịch vụ: biến sidebar desktop thành thanh chip gọn như web app. */
  body.salonhero-ui .catalog-admin-layout-v8{display:block!important;min-height:0!important}
  body.salonhero-ui .catalog-groups-v8{
    display:block!important;min-height:0!important;height:auto!important;max-height:none!important;overflow:visible!important;
    margin:0 0 10px!important;border:1px solid #dce6ed!important;border-radius:12px!important;background:#fff!important
  }
  body.salonhero-ui .catalog-side-title-v8{
    display:flex!important;height:auto!important;min-height:44px!important;padding:10px 12px!important;border-bottom:1px solid #e7eef3!important;
    font-size:13px!important;color:#4d6679!important;background:#f9fbfd!important
  }
  body.salonhero-ui .catalog-group-list-v8{
    display:flex!important;flex:none!important;width:100%!important;height:auto!important;max-height:none!important;min-height:0!important;
    overflow-x:auto!important;overflow-y:hidden!important;-webkit-overflow-scrolling:touch!important;gap:8px!important;padding:9px 10px!important;
    scroll-snap-type:x proximity;scrollbar-width:none
  }
  body.salonhero-ui .catalog-group-list-v8::-webkit-scrollbar{display:none}
  body.salonhero-ui .catalog-group-list-v8>a,
  body.salonhero-ui .catalog-group-row-v8{
    flex:0 0 auto!important;width:auto!important;min-width:max-content!important;height:40px!important;min-height:40px!important;max-height:40px!important;
    border:1px solid #d3dfe8!important;border-radius:20px!important;background:#fff!important;white-space:nowrap!important;scroll-snap-align:start!important;overflow:hidden!important
  }
  body.salonhero-ui .catalog-group-list-v8>a{padding:0 13px!important;gap:7px!important}
  body.salonhero-ui .catalog-group-list-v8>a.active,
  body.salonhero-ui .catalog-group-row-v8.active{background:#1f9be5!important;border-color:#1f9be5!important;color:#fff!important}
  body.salonhero-ui .catalog-group-row-v8>a:first-child{min-height:38px!important;height:38px!important;padding:0 13px!important;gap:7px!important}
  body.salonhero-ui .catalog-group-row-v8 .group-edit-v8{display:none!important}
  body.salonhero-ui .catalog-group-list-v8 b{font-size:11px!important;font-weight:700!important}
  body.salonhero-ui .catalog-group-create-v8{
    display:grid!important;grid-template-columns:minmax(0,1fr) auto!important;gap:8px!important;padding:9px 10px!important;border-top:1px solid #edf2f5!important;background:#fbfdfe!important
  }
  body.salonhero-ui .catalog-group-create-v8 input{height:44px!important;min-height:44px!important;border-radius:9px!important;padding:0 12px!important;font-size:14px!important}
  body.salonhero-ui .catalog-group-create-v8 .btn{height:44px!important;min-height:44px!important;border-radius:9px!important;padding:0 13px!important;font-size:12px!important;white-space:nowrap!important}

  /* Thanh tìm kiếm: không để select/input bị cắt mép như ảnh iPhone. */
  body.salonhero-ui .catalog-table-panel-v8{margin:0!important;border:1px solid #dce6ed!important;border-radius:12px!important;overflow:hidden!important}
  body.salonhero-ui .catalog-searchbar-v8{
    display:grid!important;grid-template-columns:minmax(0,1fr) 118px!important;gap:8px!important;padding:10px!important;background:#f7fafc!important
  }
  body.salonhero-ui .catalog-search-input-v8{grid-column:1/-1!important;width:100%!important;height:46px!important;border-radius:23px!important;padding:0 13px!important;min-width:0!important}
  body.salonhero-ui .catalog-search-input-v8 input{height:44px!important;min-height:44px!important;font-size:14px!important;min-width:0!important}
  body.salonhero-ui .catalog-searchbar-v8 select{grid-column:1!important;width:100%!important;height:44px!important;min-height:44px!important;border-radius:9px!important;font-size:13px!important;min-width:0!important}
  body.salonhero-ui .catalog-searchbar-v8 .btn{grid-column:2!important;width:100%!important;height:44px!important;min-height:44px!important;border-radius:9px!important;font-size:13px!important}
  body.salonhero-ui .catalog-result-meta-v8{height:auto!important;min-height:38px!important;padding:8px 11px!important;font-size:12px!important}
  body.salonhero-ui .catalog-table-wrap-v8{max-height:none!important;overflow:visible!important}

  /* Card mobile do v1.3.18 sinh ra: gọn lại cho danh mục, ưu tiên tên/giá/trạng thái/thao tác. */
  body.salonhero-ui .catalog-table-wrap-v8 + .mobile-data-list-v1318{margin:0!important;padding:9px!important;gap:8px!important;background:#f7fafc!important}
  body.salonhero-ui .catalog-table-wrap-v8 + .mobile-data-list-v1318 .mobile-data-card-v1318{border-radius:12px!important;padding:11px 12px!important;box-shadow:none!important}
  body.salonhero-ui .catalog-table-wrap-v8 + .mobile-data-list-v1318 .mobile-data-field-v1318{grid-template-columns:92px minmax(0,1fr)!important;padding:7px 0!important}
  body.salonhero-ui .catalog-table-wrap-v8 + .mobile-data-list-v1318 .mobile-data-field-v1318:first-child{display:none!important}
  body.salonhero-ui .catalog-table-wrap-v8 + .mobile-data-list-v1318 .mobile-data-value-v1318{text-align:right!important;font-size:13px!important}
  body.salonhero-ui .catalog-table-wrap-v8 + .mobile-data-list-v1318 .catalog-name-link-v8{font-size:14px!important;line-height:1.35!important}
  body.salonhero-ui .catalog-table-wrap-v8 + .mobile-data-list-v1318 .mobile-data-actions-v1318 .mobile-data-value-v1318{justify-content:flex-end!important;gap:7px!important}

  /* Popup tìm khách trong POS: full-width hơn, keyboard-friendly, kết quả AJAX dễ bấm. */
  body.salonhero-ui .customer-dropdown-v4{max-height:min(62dvh,520px)!important}
  body.salonhero-ui .customer-dropdown-search{position:sticky!important;top:0!important;z-index:3!important;background:#fff!important;padding:9px!important}
  body.salonhero-ui .customer-dropdown-search input{height:48px!important;min-height:48px!important;font-size:16px!important;padding-left:42px!important;border-radius:12px!important}
  body.salonhero-ui .customer-option{min-height:62px!important;padding:9px 12px!important}
  body.salonhero-ui .customer-option-avatar{width:42px!important;height:42px!important}
  body.salonhero-ui .customer-option-copy-v1322 b{font-size:14px!important}
  body.salonhero-ui .customer-option-copy-v1322 small{font-size:12px!important}

  /* Editor thẻ tiền: hai số tiền tách rõ, nhập full width trên mobile. */
  body.salonhero-ui .item-editor-card-value-row-v1325{grid-template-columns:1fr!important;gap:7px!important;align-items:stretch!important}
  body.salonhero-ui .item-editor-card-value-row-v1325>small{grid-column:1!important;margin-top:0!important;font-size:11px!important}
  body.salonhero-ui .item-editor-card-value-wrap-v1325{width:100%!important;height:48px!important}
  body.salonhero-ui .item-editor-card-value-wrap-v1325 input{height:46px!important;min-height:46px!important;font-size:18px!important;text-align:right!important}
}

/* v1.3.25 — flexible money-card helper */
.card-flex-note-v1325{
  margin:2px 0 4px 215px;padding:11px 13px;border:1px solid #cce8f7;border-radius:9px;background:#f3fbff;
  display:flex;align-items:flex-start;gap:9px;color:#486579;font-size:12px;line-height:1.45
}
.card-flex-note-v1325 b{flex:0 0 auto;color:#168fd8;font-size:12px}
.card-flex-note-v1325 strong{color:#274c65}

@media(max-width:767px){
  /* Fallback without relying on a body theme class: product/service admin must never become a squeezed desktop sidebar. */
  .catalog-admin-layout-v8{display:block!important;min-height:0!important}
  .catalog-groups-v8{display:block!important;min-height:0!important;height:auto!important;max-height:none!important;overflow:visible!important;margin:0 0 10px!important;border:1px solid #dce6ed!important;border-radius:12px!important;background:#fff!important}
  .catalog-group-list-v8{display:flex!important;flex:none!important;width:100%!important;height:auto!important;max-height:none!important;min-height:0!important;overflow-x:auto!important;overflow-y:hidden!important;-webkit-overflow-scrolling:touch!important;gap:8px!important;padding:9px 10px!important;scrollbar-width:none!important}
  .catalog-group-list-v8::-webkit-scrollbar{display:none!important}
  .catalog-group-list-v8>a,.catalog-group-row-v8{flex:0 0 auto!important;width:auto!important;min-width:max-content!important;height:40px!important;min-height:40px!important;max-height:40px!important;border:1px solid #d3dfe8!important;border-radius:20px!important;background:#fff!important;white-space:nowrap!important;overflow:hidden!important}
  .catalog-group-list-v8>a{padding:0 13px!important;display:flex!important;align-items:center!important;gap:7px!important}
  .catalog-group-list-v8>a.active,.catalog-group-row-v8.active{background:#1f9be5!important;border-color:#1f9be5!important;color:#fff!important}
  .catalog-group-row-v8>a:first-child{min-height:38px!important;height:38px!important;padding:0 13px!important;display:flex!important;align-items:center!important;gap:7px!important}
  .catalog-group-row-v8 .group-edit-v8{display:none!important}
  .catalog-group-create-v8{display:grid!important;grid-template-columns:minmax(0,1fr) auto!important;gap:8px!important;padding:9px 10px!important;border-top:1px solid #edf2f5!important;background:#fbfdfe!important}
  .catalog-group-create-v8 input{height:44px!important;min-height:44px!important;width:100%!important;min-width:0!important;border-radius:9px!important;padding:0 12px!important;font-size:14px!important}
  .catalog-group-create-v8 .btn{height:44px!important;min-height:44px!important;white-space:nowrap!important;border-radius:9px!important;padding:0 13px!important;font-size:12px!important}
  .catalog-searchbar-v8{display:grid!important;grid-template-columns:minmax(0,1fr) 112px!important;gap:8px!important;padding:10px!important;overflow:visible!important}
  .catalog-search-input-v8{grid-column:1/-1!important;width:100%!important;min-width:0!important;height:46px!important;border-radius:23px!important}
  .catalog-search-input-v8 input{width:100%!important;min-width:0!important;height:44px!important;min-height:44px!important;font-size:14px!important}
  .catalog-searchbar-v8 select{grid-column:1!important;width:100%!important;min-width:0!important;height:44px!important;min-height:44px!important;font-size:13px!important}
  .catalog-searchbar-v8 .btn{grid-column:2!important;width:100%!important;min-width:0!important;height:44px!important;min-height:44px!important}
  .catalog-table-panel-v8{min-width:0!important;overflow:hidden!important;border-radius:12px!important}
  .catalog-table-wrap-v8{max-height:none!important;overflow:visible!important}
  .card-flex-note-v1325{margin:0!important;padding:10px 11px!important;display:block!important;border-radius:10px!important}
  .card-flex-note-v1325 b{display:block!important;margin-bottom:3px!important}
}


/* ===== Spa Sakura CRM v1.3.26 — reopen invoice + product sales report ===== */
.order-reopen-form-v1326{display:inline-flex;margin:0}
.reopen-order-btn-v1326{border-color:#b9d8ea!important;background:#f2f9fd!important;color:#28799f!important}
.reopen-order-btn-v1326:hover{background:#e8f5fc!important}
.product-sales-page-v1326{display:grid;gap:14px}
.product-sales-presets-v1326{padding:14px;display:grid;gap:12px}
.product-sales-quick-v1326{display:flex;gap:8px;flex-wrap:wrap}
.product-sales-quick-v1326 a,.product-sales-quick-v1326 button{height:38px;padding:0 14px;border:1px solid #d7e3eb;border-radius:8px;background:#fff;color:#496579;font:inherit;font-size:12px;font-weight:700;display:inline-flex;align-items:center;justify-content:center;text-decoration:none;cursor:pointer}
.product-sales-quick-v1326 a.active,.product-sales-quick-v1326 button.active{border-color:#249be0;background:#eef8fe;color:#1688ca}
.product-sales-filter-v1326{display:grid;grid-template-columns:150px 150px 180px minmax(220px,1fr) auto;gap:10px;align-items:end}
.product-sales-filter-v1326 label{display:grid;gap:5px;color:#62798a;font-size:11px;font-weight:700}
.product-sales-filter-v1326 input,.product-sales-filter-v1326 select{width:100%;height:42px;border:1px solid #d5e1e9;border-radius:8px;background:#fff;padding:0 11px;font:inherit;font-size:13px;color:#294a60}
.product-sales-filter-v1326 .btn{height:42px}
.product-sales-range-v1326{padding-top:10px;border-top:1px solid #edf2f5;color:#718594;font-size:12px}
.product-sales-range-v1326 b{color:#355b73}
.product-sales-metrics-v1326{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}
.product-sales-metrics-v1326 article{padding:16px;border:1px solid #dce7ed;border-radius:11px;background:#fff;display:grid;gap:5px}
.product-sales-metrics-v1326 span{font-size:10px;font-weight:800;color:#708594;letter-spacing:.04em}
.product-sales-metrics-v1326 strong{font-size:24px;line-height:1.1;color:#234e68}
.product-sales-metrics-v1326 small{font-size:11px;color:#91a0aa}
.product-sales-table-panel-v1326{overflow:hidden}
.product-sales-table-v1326{width:100%;border-collapse:collapse}
.product-sales-table-v1326 th{white-space:nowrap}
.product-sales-table-v1326 td b{display:block;color:#31556d}
.product-sales-table-v1326 td small{display:block;margin-top:3px;color:#91a1ad;font-size:10px}
.product-sales-qty-v1326{font-size:17px;font-weight:800;color:#168bd0}

@media(max-width:900px){
  .product-sales-filter-v1326{grid-template-columns:1fr 1fr}
  .product-sales-filter-v1326 .product-sales-search-v1326{grid-column:1/-1}
  .product-sales-filter-v1326 .btn{grid-column:1/-1}
  .product-sales-metrics-v1326{grid-template-columns:1fr 1fr}
}
@media(max-width:767px){
  .order-reopen-form-v1326{width:100%}
  .order-reopen-form-v1326 .btn{width:100%;justify-content:center}
  .product-sales-head-v1326{gap:10px!important}
  .product-sales-head-v1326 .inventory-head-actions-v12{display:grid!important;grid-template-columns:1fr 1fr!important;width:100%!important}
  .product-sales-head-v1326 .inventory-head-actions-v12 .btn{width:100%!important;justify-content:center!important}
  .product-sales-presets-v1326{padding:10px}
  .product-sales-quick-v1326{display:grid;grid-template-columns:1fr 1fr;gap:7px}
  .product-sales-quick-v1326 a,.product-sales-quick-v1326 button{width:100%;height:42px}
  .product-sales-filter-v1326{grid-template-columns:1fr;gap:9px}
  .product-sales-filter-v1326 .product-sales-search-v1326,.product-sales-filter-v1326 .btn{grid-column:auto}
  .product-sales-filter-v1326 input,.product-sales-filter-v1326 select,.product-sales-filter-v1326 .btn{height:46px;font-size:14px}
  .product-sales-metrics-v1326{grid-template-columns:1fr 1fr;gap:8px}
  .product-sales-metrics-v1326 article{padding:13px 11px}
  .product-sales-metrics-v1326 strong{font-size:20px}
  .product-sales-table-wrap-v1326{overflow-x:auto!important;-webkit-overflow-scrolling:touch!important}
  .product-sales-table-v1326{min-width:760px}
}


/* ===== Spa Sakura CRM v1.3.27 — chỉ hiển thị giá trị nạp cho Thẻ tiền ===== */
/* item-editor-row-v1312 dùng display:grid!important; vì vậy cần rule hidden cụ thể đặt sau nó. */
body.salonhero-ui .item-editor-card-value-row-v1325[hidden],
body .item-editor-card-value-row-v1325[hidden],
.item-editor-card-value-row-v1325[hidden]{display:none!important}

/* ===== Spa Sakura CRM v1.3.30 - nhiều thẻ tiền + lịch sử thao tác hóa đơn ===== */
.money-card-allocation-list-v1330{display:grid;gap:10px;margin-top:12px}
.money-card-allocation-row-v1330{display:grid;grid-template-columns:minmax(0,1fr) 190px;gap:16px;align-items:end;padding:12px 14px;border:1px solid #d8e4ec;border-radius:8px;background:#fff}
.money-card-allocation-info-v1330{display:flex;flex-direction:column;gap:4px;min-width:0}
.money-card-allocation-info-v1330 b{font-size:14px;color:#173f5d;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.money-card-allocation-info-v1330 small{font-size:12px;color:#6d8290}
.money-card-allocation-row-v1330 label{display:flex;flex-direction:column;gap:5px;font-size:12px;color:#617685}
.money-card-allocation-row-v1330 .money-input{width:100%}
.money-card-allocation-summary-v1330{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:12px;padding-top:10px;border-top:1px dashed #cfdae2}
.money-card-allocation-summary-v1330>div{display:flex;flex-direction:column;gap:2px}
.money-card-allocation-summary-v1330 span{font-size:12px;color:#68808f}
.money-card-allocation-summary-v1330 strong{font-size:16px;color:#0b8b59}
.invoice-audit-v1330{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin:12px 0 4px;padding:12px;border:1px solid #dfe8ee;background:#f8fbfd;border-radius:8px}
.invoice-audit-v1330>div{display:flex;flex-direction:column;gap:3px;min-width:0}
.invoice-audit-v1330 span{font-size:11px;text-transform:uppercase;letter-spacing:.03em;color:#7a8e9b;font-weight:700}
.invoice-audit-v1330 b{font-size:13px;color:#24465e;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.invoice-audit-v1330 small{font-size:11px;color:#8496a1}
@media(max-width:767px){
  .money-card-allocation-row-v1330{grid-template-columns:1fr;gap:9px}
  .money-card-allocation-summary-v1330{align-items:flex-start;flex-direction:column}
  .invoice-audit-v1330{grid-template-columns:1fr;gap:8px}
  .invoice-audit-v1330>div{padding-bottom:8px;border-bottom:1px solid #e5edf2}
  .invoice-audit-v1330>div:last-child{padding-bottom:0;border-bottom:0}
}

/* ===== Spa Sakura CRM v1.3.32 — cấp thẻ trực tiếp kiểu SalonHero + giữ ngữ cảnh hóa đơn ===== */
.money-card-filter-v1332{grid-template-columns:1.2fr 1.2fr 180px 150px 150px 160px auto!important;align-items:end;gap:8px!important;padding:12px!important}
.money-card-filter-v1332>label{display:grid;gap:5px;min-width:0;font-size:10px;font-weight:700;color:#6d8291}
.money-card-filter-v1332>label>input,.money-card-filter-v1332>label>select{height:40px;min-width:0;border:1px solid #d4e0e8;border-radius:7px;background:#fff;padding:0 10px;color:#315166;font:inherit;font-size:12px}
.money-card-filter-v1332 .catalog-search-input-v8{height:40px;margin:0;background:#fff}
.money-card-filter-v1332 .catalog-search-input-v8 input{height:38px!important;min-height:38px!important}
.money-card-filter-actions-v1332{display:flex;gap:6px;align-items:center}
.money-card-filter-actions-v1332 .btn{height:40px;white-space:nowrap}
.money-card-admin-table-v1332{min-width:1280px!important}
.direct-card-tag-v1332{display:inline-flex!important;width:max-content;margin-top:5px!important;padding:2px 6px;border-radius:10px;background:#eef8fe;color:#168acb!important;font-size:9px!important;font-style:normal;font-weight:700}
.card-issue-modal-shell-v1332{z-index:2200}
body.salonhero-ui .card-issue-modal-v1332,.card-issue-modal-v1332{width:min(820px,96vw)!important;max-height:min(860px,94vh);overflow:hidden}
.card-issue-title-v1332 h2{margin:0;color:#37566c;font-size:18px}
.card-issue-title-v1332 p{margin:4px 0 0;color:#8394a0;font-size:11px}
.card-issue-body-v1332{max-height:calc(94vh - 150px);overflow:auto;padding:0 18px 18px;background:#fff}
.card-issue-body-v1332 section{padding:16px 0 4px;border-bottom:1px solid #e7edf1}
.card-issue-body-v1332 section:last-of-type{border-bottom:0}
.card-issue-body-v1332 h3{margin:0 0 14px;color:#425e72;font-size:12px;text-transform:uppercase;letter-spacing:.02em}
.card-issue-body-v1332 label{display:grid;gap:6px;color:#5f7687;font-size:11px;font-weight:600}
.card-issue-body-v1332 label>span em{color:#ff5f57;font-style:normal}
.card-issue-body-v1332 input,.card-issue-body-v1332 select,.card-issue-body-v1332 textarea{width:100%;min-width:0;border:1px solid #cedce5;border-radius:7px;background:#fff;color:#315166;font:inherit;font-size:13px;padding:0 11px}
.card-issue-body-v1332 input,.card-issue-body-v1332 select{height:42px}
.card-issue-body-v1332 textarea{padding:10px 11px;resize:vertical;min-height:78px}
.card-issue-body-v1332 small{color:#8a9aa5;font-size:10px;font-weight:400;line-height:1.4}
.card-issue-grid-v1332{display:grid;grid-template-columns:1fr 1fr;gap:14px 16px}
.card-issue-grid-v1332 .span-2{grid-column:1/-1}
.card-issue-readonly-v1332{height:42px;display:flex;align-items:center;padding:0 11px;border:1px solid #d9e4eb;border-radius:7px;background:#f7fafc;color:#35546a;font-size:13px;font-weight:700}
.card-issue-customer-search-v1332{position:relative}
.card-issue-search-results-v1332{position:absolute;z-index:20;left:0;right:0;top:65px;max-height:240px;overflow:auto;border:1px solid #cfdde6;border-radius:8px;background:#fff;box-shadow:0 12px 30px rgba(35,72,95,.16)}
.card-issue-search-results-v1332 button{width:100%;display:flex;align-items:center;justify-content:space-between;gap:12px;border:0;border-bottom:1px solid #edf2f5;background:#fff;padding:10px 12px;text-align:left;cursor:pointer}
.card-issue-search-results-v1332 button:hover{background:#f2f9fd}
.card-issue-search-results-v1332 button b{color:#35566d;font-size:12px}
.card-issue-search-results-v1332 button small{margin-left:auto;color:#8798a3;font-size:10px}
.card-issue-search-results-v1332>div{padding:14px;color:#8a9aa5;font-size:11px;text-align:center}
.card-issue-selected-customer-v1332{display:none;margin-top:9px;padding:10px 11px;border:1px solid #cfe6f4;border-radius:8px;background:#f4fbff;align-items:center;gap:10px}
.card-issue-selected-customer-v1332.show{display:flex}
.card-issue-selected-customer-v1332>span{width:34px;height:34px;border-radius:50%;background:#e4f4fd;color:#168fd8;display:flex;align-items:center;justify-content:center}
.card-issue-selected-customer-v1332>div{display:grid;gap:1px;min-width:0;flex:1}
.card-issue-selected-customer-v1332 small{font-size:9px;color:#8395a2}
.card-issue-selected-customer-v1332 b{font-size:12px;color:#31546b}
.card-issue-selected-customer-v1332 em{font-size:10px;color:#758a98;font-style:normal}
.card-issue-selected-customer-v1332 button{border:0;background:transparent;color:#178ed2;font-weight:700;font-size:11px;cursor:pointer}
.card-issue-warning-v1332{margin-top:15px;padding:12px 13px;border:1px solid #ffd7ca;border-radius:8px;background:#fff8f5;display:grid;gap:4px}
.card-issue-warning-v1332 b{display:flex;align-items:center;gap:6px;color:#e76643;font-size:11px}
.card-issue-warning-v1332 span{color:#8a6b60;font-size:10px;line-height:1.5}
.card-issue-footer-v1332{justify-content:flex-end!important;gap:8px}
.customer-card-heading-actions-v1332{display:flex;gap:6px;flex-wrap:wrap;justify-content:flex-end}
.customer-card-heading-actions-v1332 a{white-space:nowrap}

@media(max-width:1200px){
  .money-card-filter-v1332{grid-template-columns:1fr 1fr 1fr!important}
  .money-card-filter-actions-v1332{grid-column:1/-1;justify-content:flex-end}
}
@media(max-width:767px){
  .money-card-filter-v1332{grid-template-columns:1fr!important;padding:10px!important}
  .money-card-filter-actions-v1332{grid-column:auto;display:grid;grid-template-columns:1fr 1fr}
  .money-card-filter-actions-v1332 .btn{width:100%;justify-content:center}
  body.salonhero-ui .card-issue-modal-v1332,.card-issue-modal-v1332{width:100vw!important;max-width:none!important;height:100dvh!important;max-height:100dvh!important;border-radius:0!important}
  .card-issue-body-v1332{max-height:calc(100dvh - 145px);padding:0 12px 14px}
  .card-issue-grid-v1332{grid-template-columns:1fr;gap:12px}
  .card-issue-grid-v1332 .span-2{grid-column:auto}
  .card-issue-body-v1332 input,.card-issue-body-v1332 select{height:48px!important;min-height:48px!important;font-size:16px!important}
  .card-issue-body-v1332 textarea{font-size:16px!important}
  .card-issue-search-results-v1332{top:72px;max-height:220px}
  .card-issue-footer-v1332{display:grid!important;grid-template-columns:1fr 1.3fr!important;padding:10px 12px!important}
  .card-issue-footer-v1332 .btn{width:100%!important;min-height:48px!important;justify-content:center!important}
  .customer-card-heading-actions-v1332{width:100%;display:grid;grid-template-columns:1fr 1fr}
  .customer-card-heading-actions-v1332 a{width:100%;justify-content:center}
}

/* ===== Spa Sakura CRM v1.3.33 — Tablet / iPad usability pass =====
   Portrait tablets (768–1023): app-like header + bottom navigation.
   Landscape tablets (1024–1280): compact desktop navigation with touch-sized controls.
   This block intentionally sits last so legacy desktop/mobile patches cannot override it. */
.tablet-only-nav-v1333{display:none!important}

/* Touch ergonomics shared by common iPad/tablet widths. */
@media (min-width:768px) and (max-width:1280px){
  body.salonhero-ui{min-width:0!important;overflow-x:hidden!important}
  body.salonhero-ui a,
  body.salonhero-ui button,
  body.salonhero-ui summary,
  body.salonhero-ui select,
  body.salonhero-ui input[type="checkbox"],
  body.salonhero-ui input[type="radio"]{touch-action:manipulation}

  /* Keep pages inside the viewport; wide business tables scroll locally instead of pushing the page. */
  body.salonhero-ui .page-shell{max-width:100%!important;min-width:0!important;overflow-x:hidden!important}
  body.salonhero-ui .panel,
  body.salonhero-ui .table-wrap,
  body.salonhero-ui .catalog-table-wrap-v8,
  body.salonhero-ui .debt-table-wrap-v120,
  body.salonhero-ui .invoice-items-scroll-v138,
  body.salonhero-ui .product-sales-table-wrap-v1326{min-width:0!important;max-width:100%!important}
  body.salonhero-ui .table-wrap,
  body.salonhero-ui .catalog-table-wrap-v8,
  body.salonhero-ui .debt-table-wrap-v120,
  body.salonhero-ui .invoice-items-scroll-v138,
  body.salonhero-ui .product-sales-table-wrap-v1326{
    overflow-x:auto!important;-webkit-overflow-scrolling:touch!important;overscroll-behavior-x:contain!important;touch-action:pan-x pan-y!important
  }
  body.salonhero-ui .table-wrap th,
  body.salonhero-ui .catalog-table-wrap-v8 th,
  body.salonhero-ui .debt-table-wrap-v120 th,
  body.salonhero-ui .product-sales-table-wrap-v1326 th{
    position:sticky!important;top:0!important;z-index:3!important;background:#f4f8fb!important
  }

  /* A finger target should not be smaller than roughly 42–44px. */
  body.salonhero-ui .btn:not(.tiny){min-height:44px!important;padding:9px 13px!important}
  body.salonhero-ui .btn.tiny{min-height:38px!important;height:38px!important;padding:6px 10px!important}
  body.salonhero-ui input[type="checkbox"],
  body.salonhero-ui input[type="radio"]{width:21px!important;height:21px!important;min-height:21px!important}
  body.salonhero-ui .status-tabs a{min-height:44px!important;display:flex!important;align-items:center!important}
  body.salonhero-ui .category-chip{min-height:40px!important;display:inline-flex!important;align-items:center!important}
  body.salonhero-ui .page-head,
  body.salonhero-ui .pos-pagebar,
  body.salonhero-ui .report-head-v6,
  body.salonhero-ui .cashbook-head-v7{gap:10px!important;flex-wrap:wrap!important}
  body.salonhero-ui .page-head>div:last-child,
  body.salonhero-ui .pos-page-actions,
  body.salonhero-ui .page-head-actions-v11,
  body.salonhero-ui .inventory-head-actions-v12{display:flex;gap:7px;flex-wrap:wrap!important}

  /* Modal behavior: centered tablet dialog, scroll body, actions remain reachable above iPad keyboard. */
  body.salonhero-ui .modal,
  body .modal{z-index:3000!important;padding:18px!important;overflow:hidden!important;overscroll-behavior:contain!important}
  body.salonhero-ui .modal-box,
  body .modal-box,
  body.salonhero-ui .modal-box-v4,
  body .modal-box-v4,
  body.salonhero-ui .catalog-modal-card-v8,
  body .catalog-modal-card-v8,
  body.salonhero-ui .cashbook-modal-card-v7,
  body .cashbook-modal-card-v7{
    max-width:calc(100vw - 36px)!important;max-height:calc(100dvh - 36px)!important;overflow-y:auto!important;-webkit-overflow-scrolling:touch!important;overscroll-behavior:contain!important;scroll-padding-bottom:86px!important
  }
  body.salonhero-ui .modal-actions,
  body.salonhero-ui .catalog-modal-footer-v8,
  body.salonhero-ui .modal-actions-v7{
    position:sticky!important;bottom:0!important;z-index:20!important;background:#fff!important;box-shadow:0 -7px 15px rgba(37,67,87,.07)!important
  }
  body.salonhero-ui .payment-modal-card-v11,
  body .payment-modal-card-v11{width:min(900px,calc(100vw - 36px))!important;max-height:calc(100dvh - 36px)!important;overflow-y:auto!important;-webkit-overflow-scrolling:touch!important;scroll-padding-bottom:88px!important}
  body.salonhero-ui .payment-modal-footer-v11,
  body .payment-modal-footer-v11{position:sticky!important;bottom:0!important;z-index:25!important;background:#fff!important;box-shadow:0 -7px 15px rgba(37,67,87,.08)!important}
  body.salonhero-ui .card-issue-modal-v1332,
  body .card-issue-modal-v1332{width:min(860px,calc(100vw - 36px))!important;max-height:calc(100dvh - 36px)!important}
  body.salonhero-ui .card-issue-body-v1332{max-height:calc(100dvh - 190px)!important;-webkit-overflow-scrolling:touch!important}

  /* Dense administrative filters become wrap-friendly on tablets. */
  body.salonhero-ui .filterbar{flex-wrap:wrap!important;align-items:end!important}
  body.salonhero-ui .filterbar>input,
  body.salonhero-ui .filterbar>select,
  body.salonhero-ui .filterbar>label{flex:1 1 180px!important;min-width:160px!important}
  body.salonhero-ui .cashbook-filter-v7{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:9px!important}
  body.salonhero-ui .cashbook-filter-v7 .cashbook-search-v7{grid-column:1/-1!important}
  body.salonhero-ui .cashbook-filter-v7>button.btn{grid-column:auto!important}
  body.salonhero-ui .debt-filters-v120{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:9px!important}
  body.salonhero-ui .debt-filters-v120 label,
  body.salonhero-ui .debt-filters-v120 label.grow{min-width:0!important;width:auto!important}
  body.salonhero-ui .money-card-filter-v1332{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:9px!important}
  body.salonhero-ui .money-card-filter-actions-v1332{grid-column:1/-1!important;justify-content:flex-end!important}
  body.salonhero-ui .product-sales-filter-v1326{grid-template-columns:1fr 1fr!important;gap:9px!important}
  body.salonhero-ui .product-sales-filter-v1326 .product-sales-search-v1326{grid-column:1/-1!important}

  /* Dashboard: keep information glanceable without tiny 5-column cards. */
  body.salonhero-ui .hero-metrics{grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:8px!important}
  body.salonhero-ui .hero-metric:nth-child(3){grid-column:auto!important}
  body.salonhero-ui .hero-metric{min-height:112px!important;padding:13px!important;gap:10px!important}
  body.salonhero-ui .metric-icon{width:40px!important;height:40px!important;flex:0 0 40px!important}
  body.salonhero-ui .hero-metric strong{font-size:21px!important}
  body.salonhero-ui .quick-actions-grid{grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:8px!important}
  body.salonhero-ui .quick-actions-grid>a,
  body.salonhero-ui .quick-actions-grid>a:nth-child(5){grid-column:auto!important;min-height:78px!important;padding:11px!important}
  body.salonhero-ui .dashboard-grid{grid-template-columns:1fr!important}
  body.salonhero-ui .latest-customers{grid-template-columns:repeat(2,minmax(0,1fr))!important}

  /* POS: preserve two working panes on iPad instead of stacking a very long checkout page. */
  body.salonhero-ui .pos-grid-v4{display:grid!important;grid-template-columns:minmax(0,.95fr) minmax(0,1.05fr)!important;gap:9px!important;align-items:start!important}
  body.salonhero-ui .pos-order-panel,
  body.salonhero-ui .catalog-v4{min-width:0!important;min-height:calc(100dvh - 145px)!important;max-height:calc(100dvh - 145px)!important;overflow:hidden!important}
  body.salonhero-ui .pos-order-panel{display:flex!important;flex-direction:column!important}
  body.salonhero-ui .pos-order-panel #cart:not(.cart-empty-v4){overflow-y:auto!important;-webkit-overflow-scrolling:touch!important;max-height:32dvh!important}
  body.salonhero-ui .catalog-v4{display:flex!important;flex-direction:column!important}
  body.salonhero-ui .catalog-list-v4{grid-template-columns:1fr!important;max-height:none!important;overflow-y:auto!important;-webkit-overflow-scrolling:touch!important;flex:1 1 auto!important;min-height:0!important}
  body.salonhero-ui .catalog-item-v4{grid-template-columns:66px minmax(0,1fr) auto 38px!important;min-height:86px!important}
  body.salonhero-ui .catalog-thumb{height:64px!important;min-height:64px!important;width:64px!important}
  body.salonhero-ui .selected-customer-summary{grid-template-columns:1fr 1fr!important}
  body.salonhero-ui .selected-customer-summary>div:nth-child(2){border-right:0!important}
  body.salonhero-ui .selected-customer-summary>div:nth-child(3),
  body.salonhero-ui .selected-customer-summary>div:nth-child(4){border-top:1px solid #d9eaf4!important}
  body.salonhero-ui .invoice-bottom-area{overflow-y:auto!important;-webkit-overflow-scrolling:touch!important;max-height:45dvh!important}
  body.salonhero-ui .order-actions-v4{position:sticky!important;bottom:0!important;z-index:12!important;background:#fff!important;padding-bottom:6px!important}
  body.salonhero-ui .customer-dropdown-v4{width:min(520px,calc(100vw - 48px))!important;max-height:60dvh!important}
  body.salonhero-ui .customer-option{min-height:54px!important}

  /* Customer / settings / catalog administration fit without narrow sidebars. */
  body.salonhero-ui .customer-crm-layout-v5{grid-template-columns:280px minmax(0,1fr)!important}
  body.salonhero-ui .customer-activity-panel-v5{grid-column:1/-1!important;min-height:420px!important}
  body.salonhero-ui .settings-grid{grid-template-columns:280px minmax(0,1fr)!important;gap:10px!important}
  body.salonhero-ui .catalog-admin-layout-v8{display:block!important;min-height:0!important}
  body.salonhero-ui .catalog-groups-v8{height:auto!important;min-height:0!important;max-height:none!important;margin-bottom:9px!important;overflow:hidden!important}
  body.salonhero-ui .catalog-group-list-v8{display:flex!important;width:100%!important;max-height:none!important;overflow-x:auto!important;overflow-y:hidden!important;-webkit-overflow-scrolling:touch!important;gap:7px!important;padding:9px!important;scrollbar-width:none!important}
  body.salonhero-ui .catalog-group-list-v8::-webkit-scrollbar{display:none!important}
  body.salonhero-ui .catalog-group-list-v8>a,
  body.salonhero-ui .catalog-group-row-v8{flex:0 0 auto!important;min-width:max-content!important}
  body.salonhero-ui .catalog-group-create-v8{display:grid!important;grid-template-columns:minmax(0,1fr) auto!important;gap:8px!important;padding:9px!important}

  /* Multi-card payment allocation remains easy to edit with a finger. */
  body.salonhero-ui .money-card-allocation-row-v1330{grid-template-columns:minmax(0,1fr) 190px!important;gap:12px!important}
}

/* Portrait iPad / 8–11 inch tablets: switch navigation to an app-like layout. */
@media (min-width:768px) and (max-width:1023px){
  body.salonhero-ui{font-size:15px!important;padding:0!important}
  body.salonhero-ui .topbar{
    height:60px!important;min-height:60px!important;padding:0 12px!important;gap:10px!important;background:#147fae!important
  }
  body.salonhero-ui .brand{display:flex!important;flex:0 0 auto!important;font-size:15px!important;white-space:nowrap!important}
  body.salonhero-ui .brand-v9 img{max-width:112px!important;max-height:30px!important}
  body.salonhero-ui .desktop-nav{display:none!important}
  body.salonhero-ui .mobile-title{
    display:flex!important;flex:1 1 auto!important;min-width:0!important;align-items:center!important;justify-content:center!important;gap:5px!important;
    color:#fff!important;font-size:16px!important;font-weight:650!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important
  }
  body.salonhero-ui .top-actions{display:flex!important;flex:0 0 auto!important;height:60px!important}
  body.salonhero-ui .branch-pill,
  body.salonhero-ui .user-pill,
  body.salonhero-ui .logout-link{height:60px!important;min-width:48px!important;padding:0 9px!important;justify-content:center!important}
  body.salonhero-ui .branch-pill span{display:none!important}
  body.salonhero-ui .logout-link{display:none!important}
  body.salonhero-ui .branch-switcher-menu-v13{position:fixed!important;right:12px!important;top:58px!important;width:min(330px,calc(100vw - 24px))!important}

  body.salonhero-ui .page-shell{padding:10px 10px calc(78px + env(safe-area-inset-bottom))!important}
  body.salonhero-ui .mobile-nav{
    position:fixed!important;display:grid!important;grid-auto-flow:column!important;grid-auto-columns:1fr!important;grid-template-columns:none!important;
    bottom:0!important;left:0!important;right:0!important;z-index:1000!important;background:#fff!important;border-top:1px solid #ccd9e1!important;
    min-height:68px!important;padding:0 6px env(safe-area-inset-bottom)!important;box-shadow:0 -4px 15px rgba(40,70,90,.07)!important
  }
  body.salonhero-ui .mobile-nav a{
    height:66px!important;min-width:0!important;padding:5px 4px!important;display:flex!important;flex-direction:column!important;align-items:center!important;justify-content:center!important;
    gap:3px!important;color:#7b8993!important;font-size:10.5px!important;font-weight:550!important;border-top:3px solid transparent!important;background:#fff!important
  }
  body.salonhero-ui .mobile-nav a .ui-icon{width:22px!important;height:22px!important}
  body.salonhero-ui .mobile-nav a span{font-size:10.5px!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important;max-width:100%!important}
  body.salonhero-ui .mobile-nav a.active{color:#0b87e8!important;background:#f5faff!important;border-top-color:#0b87e8!important;font-weight:700!important}
  body.salonhero-ui .mobile-nav .tablet-only-nav-v1333{display:flex!important}

  /* 16px prevents Safari from auto-zooming a form field on focus. */
  body.salonhero-ui input:not([type="checkbox"]):not([type="radio"]),
  body.salonhero-ui select,
  body.salonhero-ui textarea{font-size:16px!important;min-height:44px!important}
  body.salonhero-ui .money-input input{font-size:16px!important}

  /* Tablet portrait pages should not mimic tiny desktop columns. */
  body.salonhero-ui .customer-crm-layout-v5{grid-template-columns:260px minmax(0,1fr)!important}
  body.salonhero-ui .settings-grid{grid-template-columns:240px minmax(0,1fr)!important}
  body.salonhero-ui .report-main-grid-v6{grid-template-columns:1fr!important}
  body.salonhero-ui .report-metrics-v6,
  body.salonhero-ui .cashbook-metrics-v7,
  body.salonhero-ui .product-sales-metrics-v1326{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  body.salonhero-ui .invoice-audit-v1330{grid-template-columns:repeat(2,minmax(0,1fr))!important}

  /* Payment modal: two large method buttons per row and stable totals. */
  body.salonhero-ui .payment-methods-v11{grid-template-columns:1fr 1fr!important;gap:9px!important;padding:14px 16px 9px!important}
  body.salonhero-ui .payment-methods-v11 button{height:62px!important;padding:9px 11px!important}
  body.salonhero-ui .payment-editor-v11{grid-template-columns:1fr 1fr!important;padding-left:16px!important;padding-right:16px!important}
  body.salonhero-ui .money-card-section-v11{margin-left:16px!important;margin-right:16px!important}
  body.salonhero-ui .payment-totals-v11{grid-template-columns:repeat(4,minmax(0,1fr))!important;padding-left:16px!important;padding-right:16px!important;gap:8px!important}
  body.salonhero-ui .payment-totals-v11 b,
  body.salonhero-ui .payment-totals-v11 strong{font-size:16px!important}
  body.salonhero-ui .payment-totals-v11 .change strong{font-size:22px!important}

  /* Direct card issuing modal: two columns still fit, but all controls are touch sized. */
  body.salonhero-ui .card-issue-grid-v1332{grid-template-columns:1fr 1fr!important;gap:12px!important}
  body.salonhero-ui .card-issue-body-v1332 input,
  body.salonhero-ui .card-issue-body-v1332 select{height:46px!important;min-height:46px!important;font-size:16px!important}
  body.salonhero-ui .card-issue-body-v1332 textarea{font-size:16px!important}
  body.salonhero-ui .card-issue-search-results-v1332 button{min-height:52px!important}
}

/* Landscape iPads: keep desktop navigation, but make it fit and work with fingers. */
@media (min-width:1024px) and (max-width:1280px){
  body.salonhero-ui .topbar{height:58px!important;min-height:58px!important;padding:0 10px!important;gap:5px!important}
  body.salonhero-ui .brand{font-size:14px!important;margin-right:2px!important}
  body.salonhero-ui .brand-v9 img{max-width:105px!important;max-height:29px!important}
  body.salonhero-ui .desktop-nav{height:58px!important}
  body.salonhero-ui .desktop-nav>a,
  body.salonhero-ui .desktop-nav-dropdown-v8>a{height:58px!important;font-size:12.5px!important;padding:0 7px!important;gap:5px!important}
  body.salonhero-ui .desktop-nav a .ui-icon{width:15px!important;height:15px!important}
  body.salonhero-ui .top-actions{height:58px!important}
  body.salonhero-ui .branch-pill,
  body.salonhero-ui .user-pill,
  body.salonhero-ui .logout-link{height:58px!important;min-width:44px!important;padding:0 8px!important}
  body.salonhero-ui .branch-pill span{display:none!important}
  body.salonhero-ui .desktop-nav-menu-v8{top:58px!important;width:300px!important}
  body.salonhero-ui .report-dropdown-v12 .desktop-nav-menu-v8{width:310px!important}
  body.salonhero-ui .desktop-nav-menu-v8>a{min-height:56px!important;padding:9px 12px!important}
  body.salonhero-ui .desktop-nav-menu-v8 b{font-size:13px!important}
  body.salonhero-ui .desktop-nav-menu-v8 small{font-size:11.5px!important}
  body.salonhero-ui .page-shell{padding:10px 10px 22px!important}
  body.salonhero-ui .mobile-nav{display:none!important}
}

/* Touch-only behavior: no hover dependency and stronger press feedback. */
@media (hover:none) and (pointer:coarse) and (min-width:768px) and (max-width:1280px){
  body.salonhero-ui .desktop-nav-dropdown-v8:hover .desktop-nav-menu-v8{display:none}
  body.salonhero-ui .desktop-nav-dropdown-v8.touch-open-v1333 .desktop-nav-menu-v8{display:block!important}
  body.salonhero-ui .branch-switcher-v13.touch-open-v1333 .branch-switcher-menu-v13{display:block!important}
  body.salonhero-ui button:active,
  body.salonhero-ui .btn:active,
  body.salonhero-ui .catalog-item-v4:active,
  body.salonhero-ui .mobile-nav a:active{filter:brightness(.96)!important;transform:none!important}
}

@supports not (height:100dvh){
  @media (min-width:768px) and (max-width:1280px){
    body.salonhero-ui .modal-box,
    body.salonhero-ui .modal-box-v4,
    body.salonhero-ui .catalog-modal-card-v8,
    body.salonhero-ui .cashbook-modal-card-v7,
    body.salonhero-ui .payment-modal-card-v11,
    body.salonhero-ui .card-issue-modal-v1332{max-height:calc(100vh - 36px)!important}
    body.salonhero-ui .pos-order-panel,
    body.salonhero-ui .catalog-v4{min-height:calc(100vh - 145px)!important;max-height:calc(100vh - 145px)!important}
  }
}
@media (min-width:768px) and (max-width:1023px){
  body.salonhero-ui .mobile-title .ui-icon{display:none!important}
}

/* ===== Spa Sakura CRM v1.3.34 — Customer money-card contrast fix =====
   SalonHero flat UI changes the money card from a blue gradient to white.
   Legacy card typography inherited color:#fff, so its contents became invisible.
   Keep the flat white card but restore explicit, accessible text/status colors. */
body.salonhero-ui .money-card-v5{
  color:#315166!important;
  background:#fff!important;
  border-left:4px solid #f3a328!important;
}
body.salonhero-ui .money-card-v5.locked{border-left-color:#87949d!important;opacity:1!important}
body.salonhero-ui .money-card-v5.closed{border-left-color:#a7b0b6!important;opacity:.88!important}

body.salonhero-ui .money-card-top-v5>div>span{
  color:#8295a3!important;
  opacity:1!important;
}
body.salonhero-ui .money-card-top-v5>div>b{
  color:#315166!important;
}
body.salonhero-ui .money-card-status-v5{
  opacity:1!important;
  font-weight:700!important;
  border:1px solid transparent!important;
}
body.salonhero-ui .money-card-status-v5.active{
  color:#278b4d!important;
  background:#eaf7ee!important;
  border-color:#cfead7!important;
}
body.salonhero-ui .money-card-status-v5.locked{
  color:#667984!important;
  background:#eef2f4!important;
  border-color:#dce4e8!important;
}
body.salonhero-ui .money-card-status-v5.closed{
  color:#747f87!important;
  background:#f1f3f4!important;
  border-color:#e0e5e8!important;
}
body.salonhero-ui .money-card-balance-v5{
  padding:10px 12px!important;
  background:#f6fafc!important;
  border:1px solid #e6eef3!important;
}
body.salonhero-ui .money-card-balance-v5>span{
  color:#8294a1!important;
  opacity:1!important;
}
body.salonhero-ui .money-card-balance-v5>strong{
  color:#168f91!important;
}
body.salonhero-ui .money-card-meta-v5{
  border-top-color:#e4ebef!important;
}
body.salonhero-ui .money-card-meta-v5>span{
  color:#8294a1!important;
  opacity:1!important;
}
body.salonhero-ui .money-card-meta-v5>span>b{
  color:#39566a!important;
}

/* Keep action buttons readable even if older generic button rules are cached. */
body.salonhero-ui .money-card-actions-v5 .btn.primary{
  color:#fff!important;
  background:#1592dc!important;
  border-color:#1592dc!important;
}
body.salonhero-ui .money-card-actions-v5 .btn.soft{
  color:#446276!important;
  background:#fff!important;
  border-color:#cbd9e2!important;
}

/* ===== Spa Sakura CRM v1.3.35 — preserve iPad payment usability =====
   Payment modal uses a fixed header/footer and one dedicated scroll body.
   This avoids iOS Safari sticky-footer jumping and buttons becoming unreachable. */
body.salonhero-ui .payment-modal-card-v11,
body .payment-modal-card-v11{
  display:flex!important;
  flex-direction:column!important;
  overflow:hidden!important;
}
body.salonhero-ui .payment-modal-head-v11,
body .payment-modal-head-v11{
  flex:0 0 auto!important;
}
body.salonhero-ui .payment-modal-scroll-v135,
body .payment-modal-scroll-v135{
  flex:1 1 auto!important;
  min-height:0!important;
  overflow-y:auto!important;
  overflow-x:hidden!important;
  -webkit-overflow-scrolling:touch!important;
  overscroll-behavior:contain!important;
  touch-action:pan-y!important;
  scroll-padding-bottom:24px!important;
}
body.salonhero-ui .payment-modal-footer-v11,
body .payment-modal-footer-v11{
  position:relative!important;
  bottom:auto!important;
  flex:0 0 auto!important;
  z-index:30!important;
  background:#fff!important;
  pointer-events:auto!important;
}
body.salonhero-ui .payment-modal-footer-v11 .btn,
body .payment-modal-footer-v11 .btn,
body.salonhero-ui #checkoutOpenBottomV11,
body #checkoutOpenBottomV11{
  pointer-events:auto!important;
  touch-action:manipulation!important;
}

@media (min-width:768px) and (max-width:1280px){
  body.salonhero-ui .payment-modal-v11,
  body .payment-modal-v11{
    align-items:center!important;
    justify-content:center!important;
    padding:12px!important;
    overflow:hidden!important;
  }
  body.salonhero-ui .payment-modal-card-v11,
  body .payment-modal-card-v11{
    width:min(920px,calc(100vw - 24px))!important;
    height:calc(var(--payment-visual-height-v135,100dvh) - 24px)!important;
    max-height:calc(var(--payment-visual-height-v135,100dvh) - 24px)!important;
    min-height:0!important;
  }
  body.salonhero-ui .payment-modal-footer-v11,
  body .payment-modal-footer-v11{
    padding:10px 16px calc(10px + env(safe-area-inset-bottom))!important;
    box-shadow:0 -7px 15px rgba(37,67,87,.08)!important;
  }
  body.salonhero-ui .payment-modal-footer-v11 .btn,
  body .payment-modal-footer-v11 .btn{
    min-height:48px!important;
  }
  body.salonhero-ui .order-actions-v4,
  body .order-actions-v4{
    position:sticky!important;
    bottom:0!important;
    z-index:40!important;
    pointer-events:auto!important;
    background:#fff!important;
  }
}

@media (min-width:768px) and (max-width:1023px){
  body.modal-open-v137 .mobile-nav{display:none!important}
  body.salonhero-ui .payment-modal-v11,
  body .payment-modal-v11{padding:6px!important;align-items:flex-end!important}
  body.salonhero-ui .payment-modal-card-v11,
  body .payment-modal-card-v11{
    width:100%!important;
    max-width:100%!important;
    height:calc(var(--payment-visual-height-v135,100dvh) - 6px)!important;
    max-height:calc(var(--payment-visual-height-v135,100dvh) - 6px)!important;
    border-radius:14px 14px 0 0!important;
  }
}

@media (max-width:767px){
  body.salonhero-ui .payment-modal-card-v11,
  body .payment-modal-card-v11{
    height:calc(var(--payment-visual-height-v135,100dvh) - 8px)!important;
    max-height:calc(var(--payment-visual-height-v135,100dvh) - 8px)!important;
  }
  body.salonhero-ui .payment-modal-footer-v11,
  body .payment-modal-footer-v11{
    padding-bottom:calc(10px + env(safe-area-inset-bottom))!important;
  }
}

/* ===== Spa Sakura CRM v1.3.38 — Excel export for Orders & Product Sales ===== */
.orders-head-actions-v1338{display:flex;align-items:center;gap:8px}.orders-export-menu-v1338{position:relative}.orders-export-trigger-v1338{display:inline-flex;align-items:center;gap:7px;white-space:nowrap}.orders-export-trigger-v1338>span{font-size:16px;line-height:1;margin-left:2px}.orders-export-dropdown-v1338{position:absolute;right:0;top:calc(100% + 6px);z-index:80;min-width:210px;padding:7px;background:#fff;border:1px solid #d8e3eb;border-radius:7px;box-shadow:0 10px 28px rgba(36,61,78,.16)}.orders-export-dropdown-v1338[hidden]{display:none!important}.orders-export-dropdown-v1338 button{display:block;width:100%;border:0;background:#fff;text-align:left;padding:11px 12px;border-radius:5px;color:#2d4658;font:inherit;cursor:pointer}.orders-export-dropdown-v1338 button:hover,.orders-export-dropdown-v1338 button:focus{background:#eef7fd;color:#1188d1;outline:0}.orders-export-box-v1338{width:min(1040px,calc(100vw - 30px));max-height:min(86vh,760px);padding:0;overflow:hidden;display:flex;flex-direction:column}.orders-export-box-v1338>.modal-close{top:15px;right:16px}.orders-export-title-v1338{padding:18px 54px 15px 20px;border-bottom:1px solid #dce5eb}.orders-export-title-v1338 h2{margin:0;color:#334d60;font-size:20px}.orders-export-title-v1338 p{margin:5px 0 0;color:#e25d57;font-size:12.5px}.orders-export-box-v1338 form{display:flex;flex-direction:column;min-height:0}.orders-export-all-v1338{display:flex;align-items:center;gap:8px;padding:13px 20px 6px;font-weight:700;color:#536b7c}.orders-export-all-v1338 input,.orders-export-columns-v1338 input{width:18px;height:18px;accent-color:#168fd8;flex:0 0 auto}.orders-export-columns-v1338{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0 18px;padding:8px 20px 18px;overflow:auto;max-height:52vh}.orders-export-columns-v1338[hidden]{display:none!important}.orders-export-columns-v1338 label{display:flex;align-items:center;gap:8px;min-height:34px;color:#5d7080;font-size:13px;cursor:pointer}.orders-export-columns-v1338 label:hover{color:#168fd8}.orders-export-footer-v1338{border-top:1px solid #dce5eb;padding:12px 16px 12px 20px;display:flex;align-items:center;justify-content:space-between;gap:14px;background:#fff}.orders-export-footer-v1338>span{font-size:12px;color:#718391;min-width:0}.orders-export-footer-v1338>div{display:flex;gap:8px;flex:0 0 auto}.product-sales-export-v1338{white-space:nowrap}
@media(max-width:1023px){.orders-export-columns-v1338{grid-template-columns:repeat(2,minmax(0,1fr))}.orders-export-box-v1338{width:min(860px,calc(100vw - 22px))}.orders-export-footer-v1338{align-items:flex-start;flex-direction:column}.orders-export-footer-v1338>div{align-self:flex-end}}
@media(max-width:767px){.page-head>.orders-head-actions-v1338{width:100%;display:grid;grid-template-columns:1fr 1fr}.orders-export-menu-v1338,.orders-export-trigger-v1338,.orders-head-actions-v1338>.btn{width:100%}.orders-export-trigger-v1338{justify-content:center}.orders-export-dropdown-v1338{left:0;right:auto;min-width:100%;width:max-content;max-width:calc(100vw - 24px)}.orders-export-box-v1338{width:calc(100vw - 12px);max-height:calc(100dvh - 24px)}.orders-export-title-v1338{padding:15px 48px 12px 14px}.orders-export-title-v1338 h2{font-size:18px}.orders-export-title-v1338 p{font-size:11.5px}.orders-export-all-v1338{padding:11px 14px 4px}.orders-export-columns-v1338{grid-template-columns:1fr;padding:7px 14px 14px;max-height:56vh}.orders-export-columns-v1338 label{min-height:38px;font-size:13.5px}.orders-export-footer-v1338{padding:10px 12px;gap:8px}.orders-export-footer-v1338>div{width:100%;display:grid;grid-template-columns:1fr 1fr}.orders-export-footer-v1338 .btn{width:100%}.product-sales-head-v1326 .inventory-head-actions-v12{display:grid;grid-template-columns:1fr 1fr;width:100%}.product-sales-head-v1326 .product-sales-export-v1338{grid-column:1/-1}}