/* ═══ DİŞ MODÜLÜ MOCKUP BİLEŞENLERİ ═══════════════════════════════
   Ürün ekranlarının pazarlama sitesindeki yeniden çizimi: odontogram,
   periodontal ızgara, uzmanlık satırları, tedavi sunumu, işletme paneli.
   index.html (diş hub'ı) ve kimler-icin/dis-hekimi.html birlikte kullanır
   tek yerden değişsin diye ayrı dosyada.
   Diş siluetleri React Odontogram Modul (MIT, Zoltan Dul) path'lerinden
   türetilmiştir — img/dental/LICENSE.md. */
/* — Ortak mini-UI parçaları (sekme şeridi, pill, chip) — */
.th-tabs{display:flex;gap:4px;flex-wrap:wrap;align-items:center}
.th-tab{font-size:9.5px;font-weight:600;color:#64748b;background:#fff;border:1px solid #e2e8f0;border-radius:7px;padding:4px 8px;white-space:nowrap}
.th-tab.is-on{background:#12222e;border-color:#12222e;color:#fff}
.th-tab--ghost{background:transparent;border-color:transparent;color:#94a3b8}
.th-meta{font-size:8.5px;color:#94a3b8;letter-spacing:.2px}
.th-meta b{color:#334155;font-weight:600}
.th-chip{display:inline-flex;align-items:center;gap:4px;font-size:9px;font-weight:600;color:#334155;background:#fff;border:1px solid #e2e8f0;border-radius:999px;padding:3px 8px}
.th-dot{width:6px;height:6px;border-radius:50%;flex:0 0 auto}

/* — Odontogram (01) — */
.th-odo{width:100%;display:flex;flex-direction:column;gap:9px}
.th-odo__bar{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap}
.th-odo__sel{display:flex;align-items:baseline;gap:8px;background:#fff;border:1px solid #e2e8f0;border-radius:10px;padding:7px 10px}
.th-odo__sel b{font-size:11px;color:#12222e;font-weight:700}
.th-odo__sel span{font-size:9px;color:#94a3b8}
.th-odo__arch{display:grid;grid-template-columns:repeat(16,minmax(0,1fr));gap:2px;align-items:end}
.th-odo__arch--lower{align-items:start}
.th-odo__label{font-size:8px;color:#94a3b8;text-align:center;letter-spacing:.3px}
.th-odo__rule{height:1px;background:repeating-linear-gradient(90deg,#dbe3ea 0 5px,transparent 5px 10px);margin:2px 0}
.th-tooth{position:relative;display:flex;flex-direction:column;align-items:center;gap:2px;--tth-body:#f8fafc;--tth-stroke:#cbd5e1;--tth-pulp:#fbd5d0;--tth-post:transparent}
.th-odo__arch--lower .th-tooth{flex-direction:column-reverse}
.th-tooth__num{font-size:7.5px;font-weight:600;color:#64748b;line-height:1}
.th-tooth__svg{width:100%;max-width:26px;height:auto;display:block;overflow:visible}
.th-odo__arch--lower .th-tooth__svg{transform:scaleY(-1)}
.th-tooth[data-s=caries]{--tth-body:#fee2e2;--tth-stroke:#ef4444;--tth-pulp:#ef4444}
.th-tooth[data-s=filled]{--tth-body:#fce7f3;--tth-stroke:#ec4899;--tth-pulp:#f9a8d4}
.th-tooth[data-s=crown]{--tth-body:#fbbf24;--tth-stroke:#b45309;--tth-pulp:#d97706}
.th-tooth[data-s=root_canal]{--tth-body:#fff7ed;--tth-stroke:#f97316;--tth-pulp:#fdba74;--tth-post:#1f2937}
.th-tooth[data-s=implant]{--tth-body:#e0e7ff;--tth-stroke:#6366f1;--tth-pulp:#a5b4fc;--tth-post:#4338ca}
.th-tooth[data-s=missing]{--tth-body:#f1f5f9;--tth-stroke:#cbd5e1;--tth-pulp:transparent;opacity:.5}
.th-tooth__x{position:absolute;left:50%;top:calc(50% + 4px);transform:translate(-50%,-50%);width:78%;height:64%;pointer-events:none}
.th-tooth__x::before,.th-tooth__x::after{content:"";position:absolute;left:50%;top:0;width:1.6px;height:100%;background:currentColor;border-radius:2px}
.th-tooth__x::before{transform:translateX(-50%) rotate(24deg)}
.th-tooth__x::after{transform:translateX(-50%) rotate(-24deg)}
.th-tooth__x--miss{color:#0f172a}
.th-tooth__x--plan{color:#f43f5e}
.th-tooth.is-sel{background:rgba(37,99,235,.08);border-radius:8px;box-shadow:inset 0 0 0 1.5px #2563eb}
.th-legend{display:flex;flex-wrap:wrap;gap:5px 9px;padding-top:2px}
.th-legend span{display:inline-flex;align-items:center;gap:4px;font-size:8.5px;color:#64748b}

/* — Periodontal (02) — */
.th-perio{width:100%;display:flex;flex-direction:column;gap:8px}
.th-perio__head{display:flex;align-items:center;justify-content:space-between;gap:8px;flex-wrap:wrap}
.th-perio__title{font-size:11px;font-weight:700;color:#12222e}
.th-perio__stats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:5px}
.th-stat{background:#fff;border:1px solid #e8eef3;border-radius:8px;padding:5px 6px;text-align:center}
.th-stat small{display:block;font-size:6.8px;letter-spacing:.7px;text-transform:uppercase;color:#94a3b8;font-weight:600;margin-bottom:2px}
.th-stat b{font-size:11.5px;color:#12222e;font-weight:700;line-height:1}
.th-stat--warn b{color:#dc2626}
.th-stat--info b{color:#2a6f97}
.th-perio__grid{background:#fff;border:1px solid #e8eef3;border-radius:8px;padding:6px}
.th-pg__row{display:grid;grid-template-columns:16px repeat(8,minmax(0,1fr));gap:2px;align-items:center;margin-bottom:2px}
.th-pg__row:last-child{margin-bottom:0}
.th-pg__lab{font-size:6.5px;font-weight:700;color:#94a3b8;text-align:right;padding-right:2px}
.th-pg__num{font-size:7px;font-weight:600;color:#64748b;text-align:center}
.th-pg__cell{height:11px;border:1px solid #e8eef3;border-radius:3px;display:flex;align-items:center;justify-content:center;font-size:7px;font-weight:600;color:#475569;position:relative}
.th-pg__cell.is-deep{background:#fef2f2;border-color:#fecaca;color:#dc2626}
.th-pg__cell i{position:absolute;top:-2px;right:-2px;width:5px;height:5px;border-radius:50%}
.th-pg__sep{height:4px}

/* — Uzmanlık sekmeleri (03) — */
.th-spec{width:100%;display:flex;flex-direction:column;gap:7px}
.th-spec__row{display:flex;align-items:center;min-width:0;gap:7px;background:#fff;border:1px solid #e8eef3;border-radius:9px;padding:7px 9px}
.th-spec__ico{width:22px;height:22px;border-radius:7px;display:flex;align-items:center;justify-content:center;flex:0 0 auto;font-size:10px;font-weight:700;color:#fff}
.th-spec__txt{flex:1;min-width:0}
.th-spec__txt b{display:block;font-size:9.5px;color:#12222e;font-weight:700;line-height:1.3}
.th-spec__txt span{display:block;font-size:8px;color:#94a3b8;line-height:1.4;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.th-spec__tag{font-size:7.5px;font-weight:700;padding:2px 6px;border-radius:999px;flex:0 0 auto}

/* — Sunum + fiyat teklifi (04) — */
.th-pres{width:100%;display:grid;grid-template-columns:minmax(0,1.35fr) minmax(0,1fr);gap:9px;align-items:start}
.th-pres__main,.th-pres__side{display:flex;flex-direction:column;gap:7px}
.th-pres__card{background:#fff;border:1px solid #e8eef3;border-radius:10px;padding:9px}
.th-pres__head{display:flex;align-items:center;justify-content:space-between;gap:6px;margin-bottom:7px}
.th-pres__head b{font-size:10px;color:#12222e;font-weight:700}
.th-btns{display:flex;gap:3px;flex-wrap:wrap}
.th-btn{font-size:7.5px;font-weight:600;border-radius:6px;padding:3px 6px;border:1px solid #e2e8f0;color:#475569;background:#fff;white-space:nowrap}
.th-btn--wa{background:#128C7E;border-color:#128C7E;color:#fff}
.th-btn--dark{background:#1f2d3a;border-color:#1f2d3a;color:#fff}
.th-pres__strip{display:grid;grid-template-columns:repeat(16,minmax(0,1fr));gap:1.5px;align-items:end}
.th-pres__steps{display:flex;align-items:center;justify-content:space-between;gap:6px;margin-top:7px;padding-top:7px;border-top:1px dashed #e8eef3}
.th-pres__steps small{font-size:8px;color:#94a3b8}
.th-quote__row{display:flex;align-items:center;justify-content:space-between;gap:6px;font-size:8.5px;color:#475569;padding:4px 0;border-bottom:1px dashed #eef2f6}
.th-quote__row b{color:#12222e;font-weight:600;white-space:nowrap}
.th-quote__row span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.th-quote__total{display:flex;align-items:center;justify-content:space-between;gap:6px;padding-top:6px;font-size:10px;font-weight:700;color:#12222e}
.th-quote__total b{color:#0F766E;font-size:12.5px}

/* — İşletme tarafı (05, koyu kart) — */
.th-ops{width:100%;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:9px}
.th-ops__col{background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.09);border-radius:11px;padding:11px}
.th-ops__col>small{display:block;font-size:8px;letter-spacing:1.2px;text-transform:uppercase;color:#5fc0e0;font-weight:700;margin-bottom:8px}
.th-ops__item{display:flex;align-items:center;min-width:0;gap:6px;font-size:9px;line-height:1.35;color:rgba(255,255,255,.86);padding:5px 0;border-bottom:1px dashed rgba(255,255,255,.09)}
.th-ops__item:last-child{border-bottom:0}
.th-ops__item em{font-style:normal;margin-left:auto;font-size:7.5px;font-weight:700;padding:2px 5px;border-radius:999px;background:rgba(95,192,224,.16);color:#8ed4ec;white-space:nowrap}
.th-ops__item em.is-ok{background:rgba(34,197,94,.16);color:#86efac}
.th-ops__item em.is-wait{background:rgba(245,158,11,.16);color:#fcd34d}

@media(max-width:980px){
  .th-pres{grid-template-columns:1fr}
  .th-ops{grid-template-columns:1fr}
  .th-perio__stats{grid-template-columns:repeat(2,minmax(0,1fr))}
}