/* Bedenimi Bul – ön yüz stilleri. Renkleri temanıza uydurmak için aşağıdaki değişkenleri ezebilirsiniz. */
.bb-root,.bb-trigger{
  --bb-surface:#fff; --bb-ink:#111; --bb-muted:#767676; --bb-line:#e5e5e5; --bb-chip:#f4f4f4;
  --bb-ruler-bg:#f2f6ff; --bb-ruler-line:#bcd6ff; --bb-tick:#9aa3b2; --bb-pin:#1a7cf0;
  --bb-banner-bg:#fff5e6; --bb-banner-ink:#a35a00; --bb-warn:#d53333;
  --bb-btn-bg:#000; --bb-btn-ink:#fff;
}
.bb-trigger{margin:0 0 12px}
button.bb-open{all:unset;box-sizing:border-box;cursor:pointer;display:inline-flex;align-items:center;gap:6px;
  font-size:13px;font-weight:600;padding:4px 0;color:inherit}
button.bb-open:focus-visible{outline:2px solid var(--bb-pin);outline-offset:2px}
button.bb-open svg{flex:none}
button.bb-open em{font-style:normal;color:var(--bb-banner-ink)}

.bb-root{font-size:14px;line-height:1.4;color:var(--bb-ink);text-align:left}
.bb-root *,.bb-root *::before,.bb-root *::after{box-sizing:border-box}
.bb-root [hidden]{display:none!important}
.bb-root button{all:unset;box-sizing:border-box;cursor:pointer}
.bb-root button:focus-visible,.bb-root .bb-ruler:focus-visible{outline:2px solid var(--bb-pin);outline-offset:2px}
.bb-root svg{display:block}
.bb-root p{margin:0}

.bb-root .bb-dim{position:fixed;inset:0;z-index:100000;background:rgba(0,0,0,.55);opacity:0;visibility:hidden;transition:opacity .25s,visibility .25s}
.bb-root .bb-sheet{position:fixed;left:50%;bottom:0;z-index:100001;width:100%;max-width:480px;height:78%;
  background:var(--bb-surface);border-radius:12px 12px 0 0;display:flex;flex-direction:column;
  transform:translate(-50%,100%);visibility:hidden;transition:transform .28s ease,visibility .28s}
.bb-root.bb-on .bb-dim{opacity:1;visibility:visible}
.bb-root.bb-on .bb-sheet{transform:translate(-50%,0);visibility:visible}
@media (min-width:768px){
  .bb-root .bb-sheet{bottom:50%;height:min(620px,86%);max-width:440px;border-radius:12px;transform:translate(-50%,50%) scale(.96);opacity:0;transition:transform .2s,opacity .2s,visibility .2s}
  .bb-root.bb-on .bb-sheet{transform:translate(-50%,50%);opacity:1}
}
html.bb-lock{overflow:hidden}

.bb-root .bb-head{position:relative;flex:none;height:48px;display:flex;align-items:center;justify-content:center}
.bb-root .bb-title{margin:0;padding:0;font-size:16px;font-weight:700;line-height:1.2;color:var(--bb-ink)}
.bb-root .bb-req{color:var(--bb-warn)}
.bb-root .bb-head button{position:absolute;top:6px;width:36px;height:36px;display:grid;place-items:center}
.bb-root .bb-back{left:6px}
.bb-root .bb-close{right:6px}
.bb-root .bb-body{flex:1;overflow-y:auto;padding:0 12px 12px}
.bb-root .bb-foot{flex:none;padding:8px 12px calc(10px + env(safe-area-inset-bottom,0px))}
.bb-root .bb-hint{color:var(--bb-warn);font-size:12px;min-height:17px;margin-bottom:6px}
.bb-root .bb-info{font-size:12px;color:var(--bb-muted);margin-bottom:8px}
.bb-root .bb-cta{display:block;width:100%;height:46px;line-height:46px;text-align:center;background:var(--bb-btn-bg);color:var(--bb-btn-ink);font-weight:700;font-size:15px;border-radius:3px}
.bb-root .bb-cta[disabled]{opacity:.5;cursor:default}

.bb-root .bb-switch{display:flex;align-items:center;justify-content:space-between;padding:6px 0 12px;margin-bottom:14px;border-bottom:6px solid var(--bb-chip);font-size:13px}
.bb-root .bb-seg{display:flex;background:var(--bb-chip);border-radius:3px;padding:2px}
.bb-root .bb-seg button{padding:4px 9px;border-radius:2px;font-size:13px}
.bb-root .bb-seg button[aria-pressed="true"]{background:var(--bb-btn-bg);color:var(--bb-btn-ink)}

.bb-root .bb-field{margin-bottom:14px}
.bb-root .bb-top{position:relative;height:24px;font-size:13px}
.bb-root .bb-top span{position:absolute;left:0;top:4px}
.bb-root .bb-top output{position:absolute;left:0;right:0;top:0;padding:0;text-align:center;font-size:17px;font-weight:700;color:var(--bb-ink);pointer-events:none}
.bb-root .bb-top output small{font-size:11px;margin-left:2px}
.bb-root .bb-ruler{position:relative;background:var(--bb-ruler-bg);border:1px solid var(--bb-ruler-line);border-radius:2px;margin-top:4px}
.bb-root .bb-scroll{display:flex;overflow-x:auto;scrollbar-width:none;cursor:grab;touch-action:pan-x;overscroll-behavior-x:contain}
.bb-root .bb-scroll::-webkit-scrollbar{display:none}
.bb-root .bb-scroll::before,.bb-root .bb-scroll::after{content:"";flex:0 0 50%}
.bb-root .bb-track{flex:none;position:relative;height:52px;
  background:
   linear-gradient(90deg,var(--bb-tick) 1px,transparent 1px) 0 0/calc(var(--bb-px)*5) 14px repeat-x,
   linear-gradient(90deg,var(--bb-tick) 1px,transparent 1px) 0 0/var(--bb-px) 8px repeat-x}
.bb-root .bb-track span{position:absolute;top:26px;transform:translateX(-50%);font-size:12px;color:var(--bb-muted);user-select:none;-webkit-user-select:none}
.bb-root .bb-pin{position:absolute;left:50%;top:0;margin-left:-6px;border:6px solid transparent;border-top:10px solid var(--bb-pin);border-bottom:0;pointer-events:none}

.bb-root .bb-shapes{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;padding-top:8px}
.bb-root .bb-shapes button{display:block;text-align:center;background:var(--bb-chip);border:1.5px solid transparent;border-radius:3px;padding:14px 4px 12px;font-size:12px;color:var(--bb-muted)}
.bb-root .bb-shapes svg{width:52px;height:68px;margin:0 auto 8px;color:var(--bb-ink)}
.bb-root .bb-shapes button[aria-pressed="true"]{border-color:var(--bb-ink);color:var(--bb-ink);font-weight:700}

.bb-root .bb-best{background:var(--bb-banner-bg);text-align:center;padding:10px;border-radius:2px;font-weight:700;font-size:14px}
.bb-root .bb-best strong{display:block;color:var(--bb-banner-ink);font-size:17px}
.bb-root .bb-best p{margin-top:4px;font-weight:400;font-size:12px;color:var(--bb-muted)}
.bb-root .bb-more{text-align:center;font-size:13px;font-weight:600;padding:14px 0;margin:12px 0 14px;border-top:6px solid var(--bb-chip);border-bottom:1px solid var(--bb-line)}
.bb-root .bb-q{font-size:13px;margin-bottom:8px}
.bb-root .bb-chips,.bb-root .bb-tabs{display:flex;flex-wrap:wrap;gap:8px}
.bb-root .bb-chips{margin-bottom:16px}
.bb-root .bb-chips button,.bb-root .bb-tabs button{background:var(--bb-chip);padding:7px 14px;border-radius:2px;font-size:13px}
.bb-root .bb-tabs button{font-weight:600}
.bb-root .bb-chips button[aria-pressed="true"],.bb-root .bb-tabs button[aria-pressed="true"]{background:var(--bb-btn-bg);color:var(--bb-btn-ink);font-weight:700}
.bb-root .bb-tabs{margin:12px 0;padding-top:12px;border-top:6px solid var(--bb-chip)}
.bb-root .bb-card{background:var(--bb-chip);border-radius:3px;padding:16px 12px 8px}
.bb-root .bb-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px 6px;text-align:center}
.bb-root .bb-grid b{display:block;font-size:15px}
.bb-root .bb-grid span{font-size:12px;color:var(--bb-muted)}
.bb-root .bb-tools{display:flex;justify-content:flex-end;margin-top:14px;border-top:1px solid var(--bb-line);padding-top:4px}
.bb-root .bb-tools button{width:40px;height:36px;display:grid;place-items:center;color:var(--bb-muted)}

.bb-root .bb-spin{display:grid;place-items:center;height:60%}
.bb-root .bb-spin i{width:26px;height:26px;border-radius:50%;border:3px solid var(--bb-line);border-top-color:var(--bb-ink);animation:bb-r .7s linear infinite}
@keyframes bb-r{to{transform:rotate(360deg)}}
.bb-root .bb-toast{position:fixed;left:50%;top:40%;z-index:100002;transform:translateX(-50%);background:rgba(0,0,0,.85);color:#fff;padding:12px 18px;border-radius:4px;font-size:14px;opacity:0;pointer-events:none;transition:opacity .2s;max-width:80%;text-align:center}
.bb-root .bb-toast.bb-show{opacity:1}
@media (prefers-reduced-motion:reduce){.bb-root .bb-sheet,.bb-root .bb-dim,.bb-root .bb-toast{transition:none}.bb-root .bb-spin i{animation-duration:2s}}
.bb-root .bb-roles{display:grid;gap:10px;padding-top:8px}
.bb-root .bb-roles button{display:block;text-align:center;background:var(--bb-chip);padding:11px;border-radius:2px;font-weight:700}
.bb-root .bb-roles button[aria-pressed="true"]{background:var(--bb-btn-bg);color:var(--bb-btn-ink)}