/* ==========================================================================
   Dhan Valley — component library (plain CSS port of the React component
   set in "Dhan Valley Design System/components/"). Class names mirror the
   component names 1:1 so this stays easy to diff against the source JSX.
   ========================================================================== */

*{box-sizing:border-box;}
html,body{margin:0;padding:0;}
body{
  background:var(--surface-page);
  color:var(--text-primary);
  font-family:var(--font-serif);
  -webkit-font-smoothing:antialiased;
}
img{max-width:100%;-webkit-user-drag:none;}
a{color:var(--text-link);text-decoration:none;}
a:hover{color:var(--text-link-hover);text-decoration:underline;}
:focus-visible{outline:2px solid var(--dv-olive-600);outline-offset:2px;}
@media (prefers-reduced-motion: reduce){
  *{animation:none !important;transition:none !important;}
}

.dv-page-wrap{max-width:var(--page-max);margin:0 auto;padding:0 var(--space-8);}
@media (max-width:640px){.dv-page-wrap{padding:0 var(--space-4);}}

/* ---- Section (ground colour bands) ---- */
.dv-section{padding:var(--space-20) 0;}
.dv-section--tight{padding:var(--space-12) 0;}
.dv-section--page{background:var(--surface-page);}
.dv-section--sage{background:var(--surface-sage);}
.dv-section--deep{background:var(--surface-deep);color:var(--text-on-deep);}
.dv-section--daylight{background:var(--surface-daylight);}

/* ---- Logo ---- */
.dv-logo{height:64px;width:auto;display:block;}

/* ---- Button ---- */
.dv-btn{
  font-family:var(--font-sans);
  font-weight:600;
  border:none;
  cursor:pointer;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:var(--space-2);
  border-radius:var(--radius-pill);
  transition:background var(--duration-fast) var(--ease-standard),
             color var(--duration-fast) var(--ease-standard),
             transform var(--duration-instant) var(--ease-standard);
  text-decoration:none;
  white-space:nowrap;
  font-size:var(--text-base);
  padding:11px 26px;
}
.dv-btn:hover{text-decoration:none;}
.dv-btn:active{transform:translateY(1px);}
.dv-btn--sm{font-size:var(--text-sm);padding:8px 18px;}
.dv-btn--lg{font-size:var(--text-md);padding:14px 34px;}
.dv-btn--primary{background:var(--accent);color:#FFFFFF;}
.dv-btn--primary:hover{background:var(--accent-hover);}
.dv-btn--primary:active{background:var(--accent-press);}
.dv-btn--farm{background:var(--accent-farm);color:#FFFFFF;}
.dv-btn--farm:hover{background:var(--dv-leaf-600);}
.dv-btn--quiet{background:transparent;color:var(--dv-olive-600);box-shadow:inset 0 0 0 1.5px var(--dv-olive-600);}
.dv-btn--quiet:hover{background:rgba(127,128,0,.10);}
.dv-btn--on-deep{background:var(--dv-cream-50);color:var(--dv-green-700);}
.dv-btn--on-deep:hover{background:#F1EADA;}
.dv-btn--ghost{background:transparent;color:var(--text-primary);}
.dv-btn--ghost:hover{background:rgba(56,64,51,.08);}
.dv-btn[disabled]{opacity:.4;cursor:not-allowed;}
.dv-btn--block{width:100%;}

/* ---- Card ---- */
.dv-card{border-radius:var(--radius-md);overflow:hidden;}
.dv-card--cream{background:var(--surface-card);color:var(--text-primary);border:1px solid var(--border-hairline);box-shadow:var(--shadow-sm);}
.dv-card--sage{background:var(--surface-sage);color:var(--text-primary);border:1px solid var(--border-sage);}
.dv-card--deep{background:var(--surface-deep);color:var(--text-on-deep);box-shadow:var(--shadow-inset-deep);}
.dv-card__body{padding:var(--space-6);}
.dv-card__body--tight{padding:var(--space-4);}
.dv-card__image{display:block;width:100%;height:180px;object-fit:cover;}

/* ---- Section label (amber chip) ---- */
.dv-label{
  display:inline-block;
  font-family:var(--font-display);
  font-weight:600;
  line-height:1.25;
  border-radius:var(--radius-label);
  font-size:var(--text-lg);
  padding:5px 28px;
}
.dv-label--sm{font-size:var(--text-base);padding:4px 20px;}
.dv-label--lg{font-size:var(--text-xl);padding:7px 34px;}
.dv-label--amber{background:var(--accent);color:var(--dv-green-900);}
.dv-label--olive{background:var(--dv-olive-600);color:var(--dv-cream-50);}
.dv-label--leaf{background:var(--accent-farm);color:var(--dv-cream-50);}
.dv-label--muted{opacity:.55;}
.dv-label--urdu{font-family:var(--font-urdu);line-height:1.9;border-radius:var(--radius-label-urdu);direction:rtl;}

/* ---- Badge ---- */
.dv-badge{
  display:inline-block;
  font-family:var(--font-sans);
  font-weight:800;
  font-size:var(--text-lg);
  line-height:1.1;
  padding:8px 22px;
  border-radius:var(--radius-pill);
}
.dv-badge--sun{background:var(--dv-sun-400);color:var(--dv-green-900);}
.dv-badge--amber{background:var(--accent);color:#FFFFFF;}
.dv-badge--leaf{background:var(--accent-farm);color:#FFFFFF;}
.dv-badge--cream{background:var(--dv-cream-50);color:var(--dv-green-700);}
.dv-badge--outline{background:transparent;color:var(--dv-tan-400);box-shadow:inset 0 0 0 1px var(--border-strong);}

/* ---- Divider ---- */
.dv-divider{height:1px;width:100%;background:var(--border-hairline);}
.dv-divider--vertical{width:1px;height:auto;align-self:stretch;background:var(--border-hairline);}
.dv-spine{width:1px;align-self:stretch;background:var(--border-strong);position:relative;min-height:100%;}
.dv-spine__dot{position:absolute;left:50%;width:13px;height:13px;border-radius:var(--radius-pill);background:var(--dv-tan-400);transform:translate(-50%,-50%);}
.dv-spine__dot--1{top:8%;}
.dv-spine__dot--2{top:50%;}
.dv-spine__dot--3{top:92%;}

/* ---- Price row / Menu section ---- */
.dv-price-row{display:flex;align-items:baseline;gap:var(--space-4);font-size:var(--text-base);color:var(--text-on-deep-soft);}
.dv-price-row__name{font-family:var(--font-serif);line-height:1.35;flex:1;color:inherit;}
.dv-price-row__name--page{color:var(--text-primary);}
.dv-price-row__note{opacity:.72;font-size:.85em;}
.dv-price-row__price{font-family:var(--font-serif);color:var(--text-price);flex:none;width:140px;text-align:left;font-variant-numeric:tabular-nums;direction:ltr;unicode-bidi:isolate;font-weight:600;}
.dv-price-row--urdu{direction:rtl;}
.dv-price-row--urdu .dv-price-row__price{text-align:right;}

.dv-menu-section{}
.dv-menu-section__head{display:flex;align-items:center;justify-content:space-between;gap:var(--space-4);flex-wrap:wrap;}
.dv-menu-section__vignette{flex:none;background:var(--dv-cream-50);border-radius:var(--radius-photo);padding:3px;line-height:0;}
.dv-menu-section__vignette img{height:78px;width:78px;object-fit:cover;display:block;border-radius:calc(var(--radius-photo) - 3px);}
.dv-menu-section__rows{display:flex;flex-direction:column;gap:var(--menu-row-gap);margin-top:var(--space-5);}

/* ---- Dish card (grid tiles used on Home + Menu) ---- */
.dv-dish-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--space-6);}
@media (max-width:900px){.dv-dish-grid{grid-template-columns:repeat(2,1fr);}}
@media (max-width:480px){.dv-dish-grid{grid-template-columns:1fr 1fr;gap:var(--space-3);}}
.dv-dish-card img{width:100%;aspect-ratio:1;object-fit:contain;background:var(--dv-cream-50);border-radius:var(--radius-sm);}
.dv-dish-card__no-photo{width:100%;aspect-ratio:1;background:var(--dv-cream-50);border:1px dashed var(--border-hairline);border-radius:var(--radius-sm);}
.dv-dish-card__name{font-family:var(--font-serif);font-size:var(--text-base);color:var(--text-primary);margin-top:var(--space-2);}
.dv-dish-card__name-urdu{font-family:var(--font-urdu);font-size:var(--text-base);line-height:var(--leading-urdu);color:var(--text-primary);text-align:right;}
.dv-dish-card__price{font-family:var(--font-serif);color:var(--dv-clay-600);font-weight:600;}
.dv-cart-item__name-urdu{font-family:var(--font-urdu);font-size:var(--text-sm);line-height:1.7;color:var(--text-primary);text-align:right;}

/* ---- Header / Footer ---- */
.dv-header{background:var(--surface-deep);position:sticky;top:0;z-index:40;box-shadow:var(--shadow-inset-deep);}
.dv-header__row{display:flex;align-items:center;gap:var(--space-8);padding:var(--space-3) 0;}
.dv-header__brand{display:flex;align-items:center;gap:var(--space-3);cursor:pointer;}
.dv-header__brand-name{font-family:var(--font-display);font-weight:700;color:var(--text-on-deep);font-size:var(--text-lg);}
.dv-nav{display:flex;gap:var(--space-6);margin-left:auto;}
.dv-nav a{font-family:var(--font-sans);font-weight:600;font-size:var(--text-sm);letter-spacing:var(--tracking-wide);color:var(--text-on-deep);padding-bottom:2px;border-bottom:2px solid transparent;}
.dv-nav a:hover{color:var(--accent);text-decoration:none;}
.dv-nav a[aria-current="page"]{color:var(--accent);border-bottom-color:var(--accent);}
.dv-header__actions{display:flex;align-items:center;gap:var(--space-3);}
.dv-cart-toggle{position:relative;background:transparent;border:none;cursor:pointer;color:var(--text-on-deep);padding:8px;display:inline-flex;}
.dv-cart-toggle__count{position:absolute;top:-2px;right:-2px;background:var(--dv-sun-400);color:var(--dv-green-900);font-family:var(--font-sans);font-weight:800;font-size:10px;min-width:16px;height:16px;border-radius:var(--radius-pill);display:flex;align-items:center;justify-content:center;padding:0 3px;}
.dv-nav-toggle{display:none;background:transparent;border:none;color:var(--text-on-deep);cursor:pointer;padding:8px;}
@media (max-width:820px){
  .dv-nav{display:none;}
  .dv-nav.dv-nav--open{display:flex;position:absolute;top:100%;left:0;right:0;flex-direction:column;background:var(--surface-deep-alt);padding:var(--space-4) var(--space-8);gap:var(--space-3);}
  .dv-nav-toggle{display:inline-flex;}
}

.dv-footer{background:var(--surface-deep-alt);padding:var(--space-12) var(--space-8);font-family:var(--font-sans);color:var(--text-on-deep-soft);}
.dv-footer__grid{max-width:var(--page-max);margin:0 auto;display:flex;gap:var(--space-16);flex-wrap:wrap;}
.dv-footer__col{display:flex;flex-direction:column;gap:var(--space-2);font-size:var(--text-sm);}
.dv-footer__col b{color:var(--text-on-deep);}
.dv-footer a{color:var(--text-on-deep-soft);}
.dv-footer a:hover{color:var(--text-on-deep);}

/* ---- Filter chips (menu page) ---- */
.dv-chips{display:flex;gap:var(--space-2);flex-wrap:wrap;margin-bottom:var(--space-10);}
.dv-chip{cursor:pointer;border:none;background:none;padding:0;font:inherit;}

/* ---- Cart / order-type drawer ---- */
.dv-drawer-backdrop{position:fixed;inset:0;background:rgba(27,38,32,.5);z-index:49;opacity:0;pointer-events:none;transition:opacity var(--duration-base) var(--ease-standard);}
.dv-drawer-backdrop--open{opacity:1;pointer-events:auto;}
.dv-drawer{position:fixed;top:0;right:0;height:100%;width:340px;max-width:90vw;background:var(--surface-card);border-left:1px solid var(--border-hairline);box-shadow:var(--shadow-lg);z-index:50;display:flex;flex-direction:column;padding:var(--space-6);transform:translateX(100%);transition:transform var(--duration-base) var(--ease-standard);}
.dv-drawer--open{transform:translateX(0);}
.dv-drawer__head{display:flex;align-items:flex-start;justify-content:space-between;margin-bottom:var(--space-6);}
.dv-drawer__title{font-family:var(--font-display);font-weight:700;font-size:var(--text-xl);color:var(--text-primary);margin:0;}
.dv-drawer__sub{font-family:var(--font-sans);font-size:var(--text-sm);color:var(--text-secondary);margin:2px 0 0;}
.dv-drawer__close{background:none;border:none;cursor:pointer;color:var(--text-secondary);font-size:20px;line-height:1;padding:4px;}
.dv-order-tabs{display:flex;justify-content:space-between;gap:var(--space-2);border-bottom:1px solid var(--border-hairline);padding-bottom:var(--space-2);margin-bottom:var(--space-4);}
.dv-order-tab{flex:1;display:flex;flex-direction:column;align-items:center;gap:2px;padding:var(--space-2);border-radius:var(--radius-md);border:none;background:transparent;color:var(--text-secondary);font-family:var(--font-sans);font-size:var(--text-2xs);font-weight:600;cursor:pointer;}
.dv-order-tab svg{width:20px;height:20px;}
.dv-order-tab[aria-selected="true"]{background:var(--dv-amber-500);color:#fff;}
.dv-cart-empty{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;color:var(--text-secondary);opacity:.7;text-align:center;gap:var(--space-2);font-family:var(--font-sans);font-size:var(--text-sm);}
.dv-cart-items{flex:1;display:flex;flex-direction:column;gap:var(--space-3);overflow-y:auto;}
.dv-cart-item{display:flex;align-items:center;gap:var(--space-3);border-bottom:1px solid var(--border-hairline);padding-bottom:var(--space-3);}
.dv-cart-item img{width:48px;height:48px;object-fit:cover;border-radius:var(--radius-sm);background:var(--dv-cream-50);}
.dv-cart-item__meta{flex:1;min-width:0;}
.dv-cart-item__name{font-family:var(--font-serif);font-size:var(--text-sm);color:var(--text-primary);}
.dv-cart-item__price{font-family:var(--font-serif);font-size:var(--text-sm);color:var(--dv-clay-600);}
.dv-qty{display:flex;align-items:center;gap:6px;}
.dv-qty button{width:22px;height:22px;border-radius:var(--radius-pill);border:1px solid var(--border-strong);background:#fff;cursor:pointer;line-height:1;}
.dv-drawer__foot{margin-top:auto;padding-top:var(--space-4);border-top:1px solid var(--border-hairline);}
.dv-drawer__subtotal{display:flex;justify-content:space-between;font-family:var(--font-sans);font-weight:700;margin-bottom:var(--space-3);}

/* ---- Checkout (visit page) ---- */
.dv-option-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--space-2);}
.dv-option{cursor:pointer;}
.dv-option input{position:absolute;opacity:0;pointer-events:none;}
.dv-option__box{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;padding:var(--space-3);border-radius:var(--radius-md);border:1px solid var(--border-hairline);background:var(--surface-card);font-family:var(--font-sans);font-size:var(--text-xs);font-weight:600;color:var(--text-secondary);}
.dv-option input:checked + .dv-option__box{background:var(--surface-deep);color:var(--text-on-deep);border-color:var(--surface-deep);}
.dv-radio-list{display:flex;flex-direction:column;gap:var(--space-3);border-top:1px solid var(--border-hairline);border-bottom:1px solid var(--border-hairline);padding:var(--space-4) 0;}
.dv-radio-row{display:flex;align-items:center;gap:var(--space-3);cursor:pointer;font-family:var(--font-serif);}
.dv-visit-row{display:flex;gap:var(--space-6);padding:var(--space-4) 0;}
.dv-visit-row__k{width:140px;flex:none;font-family:var(--font-sans);font-size:var(--text-xs);letter-spacing:var(--tracking-widest);text-transform:uppercase;color:var(--text-on-deep-soft);}
.dv-visit-row__v{font-family:var(--font-serif);font-size:var(--text-md);color:var(--text-on-deep);}
.dv-map{border-radius:var(--radius-md);overflow:hidden;border:1px solid var(--border-hairline);width:100%;aspect-ratio:16/10;}
.dv-map iframe{width:100%;height:100%;border:0;display:block;}

/* ---- Decorative dotted grid corner ---- */
.dv-dots{background-image:radial-gradient(circle,var(--dv-tan-400) 1px,transparent 1px);background-size:16px 16px;opacity:.2;}

/* ---- Toast (order confirmation stub) ---- */
.dv-toast{position:fixed;bottom:var(--space-6);left:50%;transform:translateX(-50%) translateY(20px);background:var(--surface-deep);color:var(--text-on-deep);font-family:var(--font-sans);font-size:var(--text-sm);padding:var(--space-3) var(--space-6);border-radius:var(--radius-pill);box-shadow:var(--shadow-lg);opacity:0;pointer-events:none;transition:opacity var(--duration-base) var(--ease-standard),transform var(--duration-base) var(--ease-standard);z-index:60;}
.dv-toast--show{opacity:1;transform:translateX(-50%) translateY(0);}