@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:wght@500;600;700&family=Montserrat:wght@400;500;600;700&display=swap');

:root{
  --zuri-rose:#E7C1B8;
  --zuri-rose-dark:#D4A89E;
  --zuri-champagne:#E3D2A7;
  --zuri-taupe:#F2ECE6;
  --zuri-warm:#FDFBF9;
  --zuri-white:#FFFFFF;
  --zuri-text:#4A3B3B;
  --zuri-muted:#8C7A7A;
  --zuri-success:#5FAE6D;
  --zuri-warning:#E8A23C;
  --zuri-danger:#D96565;
  --zuri-info:#6D8FC9;
  --zuri-shadow:0 12px 36px rgba(94,69,69,.07);
  --zuri-shadow-sm:0 6px 20px rgba(94,69,69,.06);
  --zuri-radius:16px;
  --zuri-radius-sm:11px;
}

*{box-sizing:border-box}
html,body{min-height:100%}
body{
  margin:0;background:linear-gradient(180deg,#fff,var(--zuri-warm));
  color:var(--zuri-text);font-family:'Montserrat',sans-serif;font-size:14px;
}
a{color:var(--zuri-text)}
.app-shell{min-height:100vh;display:flex}
.sidebar{
  width:272px;position:fixed;left:0;top:0;bottom:0;z-index:1030;
  padding:22px 18px;background:rgba(255,255,255,.96);
  border-right:1px solid rgba(227,210,167,.72);backdrop-filter:blur(10px);
}
.brand{
  display:flex;align-items:center;gap:13px;padding:8px 8px 24px;margin-bottom:4px;
  border-bottom:1px solid rgba(227,210,167,.55)
}
.brand-mark{
  width:48px;height:48px;object-fit:contain;border-radius:50%;
  background:#fff;box-shadow:inset 0 0 0 1px rgba(255,255,255,.8),var(--zuri-shadow-sm)
}
.brand-name{
  font-family:'Cormorant Garamond',serif;font-weight:700;font-size:28px;
  letter-spacing:.16em;line-height:1;color:var(--zuri-text)
}
.brand small{color:var(--zuri-muted);font-size:10px;text-transform:uppercase;letter-spacing:.08em}
.product-thumb{width:44px;height:44px;object-fit:cover;border-radius:10px;box-shadow:inset 0 0 0 1px rgba(227,210,167,.55)}
.product-thumb-placeholder{display:grid;place-items:center;background:var(--zuri-taupe);color:var(--zuri-muted)}
.product-thumb-placeholder i{width:18px;height:18px}
.product-thumb-lg{width:88px;height:88px;border-radius:14px}
.sidebar nav{display:grid;gap:5px;margin-top:18px}
.sidebar nav a{
  display:flex;align-items:center;min-height:42px;padding:10px 12px;border-radius:12px;
  text-decoration:none;color:#665252;font-weight:500;transition:.18s ease
}
.sidebar nav a:hover{background:linear-gradient(90deg,rgba(231,193,184,.35),rgba(242,236,230,.55));transform:translateX(2px)}
.sidebar nav a.active{background:var(--zuri-taupe);font-weight:600}
.main-content{margin-left:272px;width:calc(100% - 272px);padding:28px 32px 44px;min-width:0}
.main-content-full{margin-left:0;width:100%}
.topbar{
  display:flex;align-items:center;justify-content:space-between;margin-bottom:24px;
}
.topbar-user{display:flex;align-items:center;gap:10px;padding:8px 12px;background:#fff;border:1px solid rgba(227,210,167,.65);border-radius:999px}
.user-dot{width:32px;height:32px;border-radius:50%;display:grid;place-items:center;background:var(--zuri-rose);font-family:'Cormorant Garamond',serif;font-size:20px;font-weight:700}
.page-title{font-family:'Cormorant Garamond',serif;font-size:38px;font-weight:700;line-height:1.05;margin:0}
.page-subtitle,.muted{color:var(--zuri-muted)}
.small-label{font-size:10px;text-transform:uppercase;letter-spacing:.09em;color:var(--zuri-muted);font-weight:600}

.card-zuri{
  background:rgba(255,255,255,.97);border:1px solid rgba(227,210,167,.72);
  border-radius:var(--zuri-radius);box-shadow:var(--zuri-shadow);overflow:hidden
}
.card-soft{background:linear-gradient(145deg,#fff,var(--zuri-warm))}
.kpi{padding:20px;position:relative;min-height:122px}
.kpi:after{
  content:"";position:absolute;right:-22px;top:-30px;width:92px;height:92px;border-radius:50%;
  background:rgba(231,193,184,.18)
}
.kpi .value{font-size:26px;font-weight:700;margin-top:10px;position:relative;z-index:1}
.kpi .trend{font-size:11px;color:var(--zuri-muted);margin-top:7px}

.btn{border-radius:10px;font-weight:600;min-height:40px;font-size:13px}
.btn-sm{min-height:32px;border-radius:9px}
.btn-zuri{
  background:linear-gradient(135deg,var(--zuri-rose),#EDCEC7);
  color:var(--zuri-text);border:1px solid var(--zuri-rose-dark);
  box-shadow:0 5px 14px rgba(212,168,158,.17)
}
.btn-zuri:hover{background:linear-gradient(135deg,var(--zuri-rose-dark),var(--zuri-rose));color:var(--zuri-text);transform:translateY(-1px)}
.btn-outline-zuri{background:#fff;border:1px solid var(--zuri-champagne);color:var(--zuri-text)}
.btn-outline-zuri:hover{background:var(--zuri-taupe);border-color:var(--zuri-rose-dark);color:var(--zuri-text)}

.form-control,.form-select{
  min-height:42px;border-radius:10px;border:1px solid #e5d7d2;background:#fff;color:var(--zuri-text);
  box-shadow:none;font-size:13px
}
.form-control:focus,.form-select:focus{
  border-color:var(--zuri-champagne);box-shadow:0 0 0 .22rem rgba(227,210,167,.25)
}
.form-label{font-size:12px;font-weight:600;margin-bottom:7px;color:#665252}

.table{--bs-table-bg:transparent;color:var(--zuri-text)}
.table>:not(caption)>*>*{padding:.82rem .78rem;border-bottom-color:#f0e6e2}
.table thead th{
  font-size:10px;text-transform:uppercase;letter-spacing:.06em;color:#7B6767;
  background:var(--zuri-taupe);border-bottom:none;white-space:nowrap
}
.table tbody tr{transition:.15s ease}
.table tbody tr:hover{background:rgba(231,193,184,.12)}
.table a{text-decoration:none;font-weight:600}

.badge{font-size:10px;padding:.5em .72em;border-radius:999px}
.badge-low{background:var(--zuri-warning)}
.badge-ok{background:var(--zuri-success)}
.badge-out{background:var(--zuri-danger)}
.status-pill{display:inline-flex;padding:5px 9px;border-radius:999px;font-size:10px;font-weight:700;background:var(--zuri-taupe)}

.alert{border-radius:12px;border:0;box-shadow:var(--zuri-shadow-sm)}
hr{border-color:#eaded9;opacity:1}

.login-page{
  min-height:100vh;display:grid;grid-template-columns:minmax(340px, .9fr) 1.1fr;
  background:var(--zuri-warm)
}
.login-panel{display:flex;align-items:center;justify-content:center;padding:40px}
.login-card{width:min(430px,100%);padding:40px;background:#fff;border:1px solid var(--zuri-champagne);border-radius:24px;box-shadow:var(--zuri-shadow)}
.login-brand{text-align:center;margin-bottom:30px}
.login-brand .brand-mark{margin:0 auto 14px;width:62px;height:62px;font-size:38px}
.login-brand h1{font-family:'Cormorant Garamond',serif;font-size:42px;letter-spacing:.18em;margin:0}
.login-visual{
  position:relative;overflow:hidden;
  background:
    radial-gradient(circle at 20% 20%,rgba(255,255,255,.8) 0 9%,transparent 10%),
    linear-gradient(145deg,#EED3CC,#F6ECE8 52%,#E7D7BB);
}
.login-visual:before,.login-visual:after{
  content:"";position:absolute;border-radius:50%;filter:blur(1px)
}
.login-visual:before{width:480px;height:480px;right:-130px;top:100px;background:rgba(255,255,255,.38)}
.login-visual:after{width:300px;height:300px;left:70px;bottom:-90px;background:rgba(231,193,184,.45)}
.login-quote{position:absolute;left:10%;bottom:10%;max-width:420px;z-index:2}
.login-quote h2{font-family:'Cormorant Garamond',serif;font-size:46px;font-weight:600}
.login-quote p{font-size:13px;letter-spacing:.03em}

.section-title{font-family:'Cormorant Garamond',serif;font-size:24px;font-weight:700;margin:0}
.dashboard-grid{display:grid;grid-template-columns:repeat(6,1fr);gap:14px}
.chart-wrap{height:280px}
.list-row{display:flex;align-items:center;justify-content:space-between;padding:11px 0;border-bottom:1px solid #f0e5e1}
.list-row:last-child{border-bottom:none}

.pos-grid{display:grid;grid-template-columns:minmax(340px,.85fr) 1.15fr;gap:20px}
.pos-search{position:sticky;top:20px}
.pos-product-row{cursor:pointer}
.pos-cart .table td{padding:.65rem}
.pos-total{
  font-family:'Cormorant Garamond',serif;font-size:36px;font-weight:700;
  background:linear-gradient(135deg,var(--zuri-text),#7d6767);
  -webkit-background-clip:text;background-clip:text;color:transparent
}
.receipt-box{max-width:820px;margin:0 auto}
.receipt-brand{text-align:center;padding:12px 0 24px}
.receipt-brand h2{font-family:'Cormorant Garamond',serif;font-size:34px;letter-spacing:.15em}

.empty-state{text-align:center;padding:46px 20px;color:var(--zuri-muted)}
.empty-icon{width:54px;height:54px;border-radius:50%;margin:0 auto 12px;background:var(--zuri-taupe);display:grid;place-items:center;font-family:'Cormorant Garamond',serif;font-size:28px}

@media(max-width:1200px){.dashboard-grid{grid-template-columns:repeat(3,1fr)}.pos-grid{grid-template-columns:1fr}}
@media(max-width:900px){
  .sidebar{width:86px;padding:18px 12px}.sidebar .brand>div:last-child{display:none}.brand{justify-content:center}.sidebar nav a{font-size:0;justify-content:center}
  .sidebar nav a:before{content:"•";font-size:22px;color:var(--zuri-rose-dark)}
  .main-content{margin-left:86px;width:calc(100% - 86px);padding:20px}
}
@media(max-width:650px){
  .sidebar{display:none}.main-content{margin-left:0;width:100%;padding:16px}
  .dashboard-grid{grid-template-columns:1fr 1fr}.page-title{font-size:32px}
  .login-page{grid-template-columns:1fr}.login-visual{display:none}.login-panel{padding:20px}
}
@media print{
  .sidebar,.topbar,.btn,.alert{display:none!important}.main-content{margin:0;width:100%;padding:0}.card-zuri{box-shadow:none;border:0}
}


.sidebar nav a{gap:11px}
.sidebar nav a svg{width:18px;height:18px;stroke-width:1.8;color:#7A6262;flex:0 0 auto}
.icon-btn{display:inline-flex;align-items:center;gap:7px}
.icon-btn svg{width:16px;height:16px;stroke-width:1.8}
.section-icon{
  width:38px;height:38px;border-radius:12px;display:grid;place-items:center;
  background:var(--zuri-taupe);border:1px solid rgba(227,210,167,.8);color:#6B5555
}
.section-icon svg{width:18px;height:18px;stroke-width:1.8}
.empty-state svg{width:28px;height:28px;stroke-width:1.6}
@media(max-width:900px){
  .sidebar nav a span{display:none}
  .sidebar nav a:before{display:none!important}
  .sidebar nav a svg{width:20px;height:20px}
}

.nav-group-toggle{
  display:flex;align-items:center;width:100%;gap:11px;min-height:42px;padding:10px 12px;border-radius:12px;
  border:0;background:transparent;text-align:left;color:#665252;font-weight:600;font-size:14px;
  font-family:inherit;transition:.18s ease;cursor:pointer
}
.nav-group-toggle:hover{background:linear-gradient(90deg,rgba(231,193,184,.35),rgba(242,236,230,.55))}
.nav-group-toggle svg{width:18px;height:18px;stroke-width:1.8;color:#7A6262;flex:0 0 auto}
.nav-group-toggle .chevron{margin-left:auto;width:15px;height:15px;transition:transform .2s ease}
.nav-group-toggle[aria-expanded="true"] .chevron{transform:rotate(180deg)}
.nav-group-body{display:grid;gap:3px;padding-left:14px;margin-top:2px}
.nav-group-body a{min-height:38px;font-weight:500}
.nav-group-body a svg{width:7px;height:7px;fill:currentColor;color:var(--zuri-rose-dark)}
@media(max-width:900px){
  .nav-group-toggle span,.nav-group-toggle .chevron{display:none}
  .nav-group-body{padding-left:0}
}