/* ============================================================================
   MASAÜSTÜ "HİZMET SEÇ" PANELİ — mobildeki ONAYLI panelin BİREBİR portu
   Kaynak (kopyalanan bileşen): /yeni-tasarim/anasayfa.html
     #svcSheet(.sheet-backdrop) · .sheet · .sheet-grip/.handle · .sheet-search · .opt-list · .opt-row
   YENİ GÖRSEL DİL ÜRETİLMEDİ; aynı kurallar taşındı.
   Masaüstü token karşılıkları (mobil sayfada olan, burada olmayan token'lar):
     --brand      → --primary        (deniz yeşili marka rengi)
     --brand-dark → --primary-hover
     --muted-2    → --muted
   ========================================================================== */
.sheet-backdrop{position:fixed;inset:0;z-index:100;background:rgba(15,23,42,.34);opacity:0;pointer-events:none;transition:opacity .22s ease}
.sheet-backdrop.open{opacity:1;pointer-events:auto}
.sheet{position:absolute;left:50%;bottom:0;width:min(480px,100%);transform:translate(-50%,100%);background:#fff;border-radius:20px 20px 0 0;padding:8px 18px calc(18px + env(safe-area-inset-bottom));transition:transform .26s ease;box-shadow:0 -8px 30px rgba(15,23,42,.16);max-height:82vh;display:flex;flex-direction:column}
.sheet-backdrop.open .sheet{transform:translate(-50%,0)}
.handle{width:36px;height:4px;margin:2px auto 12px;border-radius:99px;background:#dce1e4;flex:0 0 auto}
/* TUTAMAK = KAPATMA (mobilde de böyle): görsel bar aynı kalır, tam genişlikte dokunma alanı olur */
.sheet-grip{display:block;flex:0 0 auto;width:100%;margin:0;border:0;background:none;padding:2px 0 12px;cursor:pointer;-webkit-tap-highlight-color:transparent;touch-action:manipulation}
.sheet-grip .handle{display:block;margin:0 auto;transition:background .15s ease,width .15s ease}
.sheet-grip:active .handle{width:52px;background:#b7c0c5}
.sheet-grip:focus-visible{outline:2px solid var(--primary);outline-offset:3px;border-radius:10px}
.sheet h3{margin:0 0 4px;font-size:17px;letter-spacing:-.3px}
.sheet .sheet-sub{color:var(--muted);font-size:12px;margin-bottom:12px}
.sheet-search{margin-bottom:10px;flex:0 0 auto}
.sheet-search input{width:100%;height:42px;border:1px solid var(--line);border-radius:11px;padding:0 13px;font-size:14px;font-weight:600;outline:0;background:var(--surface)}
.sheet-search input:focus{border-color:var(--primary);background:#fff}
.opt-list{overflow-y:auto;flex:1 1 auto;min-height:0;-webkit-overflow-scrolling:touch}
.opt-row{display:flex;align-items:center;justify-content:space-between;gap:8px;width:100%;text-align:left;background:none;border:0;border-bottom:1px solid #f0f2f3;padding:13px 2px;font-size:14px;font-weight:650;color:var(--ink);cursor:pointer}
.opt-row:hover{background:var(--soft)}
.opt-row .chev{width:16px;height:16px;color:var(--muted);flex:0 0 auto}
.loc-hint{color:var(--muted);font-size:11.5px;padding:8px 2px}
/* TABLET/MASAÜSTÜ KATMANI (mobilde de ≥481px'te böyle): panel içerik kolonuyla hizalanır */
@media (min-width:481px){.sheet{width:min(760px,100%)}}