/* =========================================================
   EBADI APP V2 — SERVICES SHEET
   Canonical owner of the Services modal UI.
   Uses the global UI V2 design tokens with safe fallbacks.
========================================================= */
.services-sheet-backdrop{
  position:fixed;
  z-index:300;
  inset:0;
  background:rgba(21,24,28,.28);
  opacity:0;
  backdrop-filter:blur(3px);
  -webkit-backdrop-filter:blur(3px);
  transition:opacity .22s ease;
}
.services-sheet-backdrop.is-open{opacity:1}

.services-sheet{
  position:fixed;
  z-index:301;
  right:50%;
  bottom:0;
  display:flex;
  width:min(560px,100%);
  max-height:min(88svh,780px);
  flex-direction:column;
  padding:8px 14px calc(16px + env(safe-area-inset-bottom));
  border:1px solid var(--eb-ui-line,#ebe5da);
  border-bottom:0;
  border-radius:24px 24px 0 0;
  background:var(--eb-ui-surface,#fff);
  color:var(--eb-ui-text,#1f2328);
  box-shadow:0 -20px 48px rgba(36,31,24,.16);
  transform:translate(50%,105%);
  visibility:hidden;
  pointer-events:none;
  transition:transform .32s cubic-bezier(.22,1,.36,1);
}
.services-sheet.is-open{transform:translate(50%,0);visibility:visible;pointer-events:auto}

.services-sheet__handle{
  width:42px;
  height:4px;
  margin:0 auto 10px;
  border-radius:999px;
  background:#d8d1c7;
}

.services-sheet>header{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:12px;
  padding:3px 2px 13px;
  border-bottom:1px solid #eee8de;
  color:var(--eb-ui-text,#1f2328);
}
.services-sheet>header>div{min-width:0}
.services-sheet>header small{
  display:block;
  margin:0 0 2px;
  color:var(--eb-ui-gold,#c8922f);
  font-size:var(--eb-fs-micro);
  font-weight:800;
  letter-spacing:1px;
}
.services-sheet>header h2{
  margin:0;
  color:var(--eb-ui-text,#1f2328);
  font-size:var(--eb-fs-page);
  font-weight:900;
  line-height:1.35;
}
.services-sheet>header p{
  margin:3px 0 0;
  color:var(--eb-ui-muted,#77716a);
  font-size:var(--eb-fs-caption);
  font-weight:600;
  line-height:1.55;
}
.services-sheet>header button{
  display:grid;
  width:34px;
  height:34px;
  flex:0 0 34px;
  place-items:center;
  margin:0;
  padding:0;
  border:1px solid #e7e0d6;
  border-radius:50%;
  background:#f8f7f5;
  color:#585d62;
  box-shadow:none;
  font:400 var(--eb-fs-display-small)/1 Arial,sans-serif;
}

.services-sheet__body{
  min-height:0;
  flex:1 1 auto;
  overflow-y:auto;
  overflow-x:hidden;
  padding:6px 1px 8px;
  background:var(--eb-ui-surface,#fff);
  color:var(--eb-ui-text,#1f2328);
  overscroll-behavior-y:contain;
  touch-action:pan-y;
  -webkit-overflow-scrolling:touch;
  scrollbar-width:thin;
  scrollbar-color:#d7c29a transparent;
}
.services-sheet__body::-webkit-scrollbar{width:4px}
.services-sheet__body::-webkit-scrollbar-thumb{background:#d7c29a;border-radius:999px}
.services-sheet__body>section{
  margin:0;
  padding:14px 0 0;
  background:transparent;
  border:0;
}
.services-sheet__body h3{
  margin:0 2px 8px;
  color:#2a2d31;
  font-size:var(--eb-fs-label);
  font-weight:900;
  line-height:1.45;
}

.services-sheet__grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:8px;
}
.services-sheet__grid a{
  position:relative;
  display:grid;
  grid-template-columns:38px minmax(0,1fr);
  grid-template-rows:auto auto;
  column-gap:9px;
  min-height:70px;
  margin:0;
  padding:10px;
  border:1px solid var(--eb-ui-line,#ebe5da);
  border-radius:14px;
  background:var(--eb-ui-surface,#fff);
  color:var(--eb-ui-text,#1f2328);
  text-decoration:none;
  box-shadow:var(--eb-ui-shadow,0 5px 16px rgba(74,58,31,.045));
}
.services-sheet__grid a:active{
  background:#fffaf1;
  border-color:#e8cf9f;
}
.services-sheet__grid a>span{
  display:grid;
  grid-row:1/3;
  width:38px;
  height:38px;
  align-self:center;
  place-items:center;
  border:1px solid #e6e2dc;
  border-radius:11px;
  background:#f7f7f7;
  color:#171b20;
  font-size:var(--eb-fs-subtitle);
}
.services-sheet__grid strong{
  align-self:end;
  min-width:0;
  margin:0;
  color:#1b1d20;
  font-size:var(--eb-fs-caption);
  font-weight:900;
  line-height:1.5;
}
.services-sheet__grid small{
  overflow:hidden;
  align-self:start;
  min-width:0;
  margin:0;
  color:#817b74;
  font-size:var(--eb-fs-micro);
  font-weight:600;
  line-height:1.5;
  white-space:nowrap;
  text-overflow:ellipsis;
}
.services-sheet__grid i{
  position:absolute;
  top:8px;
  left:8px;
  color:#aaa39a;
  font-style:normal;
  font-size:var(--eb-fs-card);
}
.services-sheet-open{overflow:hidden}

@media(max-width:360px){
  .services-sheet{padding-inline:10px}
  .services-sheet__grid{gap:6px}
  .services-sheet__grid a{grid-template-columns:34px minmax(0,1fr);padding:8px;column-gap:7px}
  .services-sheet__grid a>span{width:34px;height:34px;font-size:var(--eb-fs-section)}
  .services-sheet__grid strong{font-size:var(--eb-fs-caption)}
  .services-sheet__grid small{font-size:var(--eb-fs-micro)}
}
