/* ===================================================================
   ALPET İntranet — Modül Sayfaları Ortak Bileşenleri
   (style.css'e ek olarak modül sayfalarında yüklenir)
   =================================================================== */

/* --- Özel tarih seçici (date picker) --- */
.dp { position: relative; }
.dp .dp-native { position: absolute; opacity: 0; pointer-events: none; width: 0; height: 0; }
.dp-trigger { width: 100%; display: flex; align-items: center; gap: 0.625rem; padding: 0.6875rem 0.8125rem; border: 1px solid var(--border); border-radius: 0.625rem; background: #fff; font: inherit; font-size: 0.9rem; color: var(--gray-900); cursor: pointer; text-align: left; transition: border var(--transition), box-shadow var(--transition); }
.dp-trigger:hover { border-color: var(--alpet-blue); }
.dp.open .dp-trigger { border-color: var(--alpet-blue); box-shadow: 0 0 0 3px var(--alpet-blue-light); }
.dp-trigger > .material-symbols-rounded { font-size: 1.25rem; color: var(--alpet-blue); }
.dp-trigger .dp-val { flex: 1; }
.dp-trigger .dp-val.empty { color: var(--gray-500); }
.dp-trigger .dp-chev { font-size: 1.25rem; color: var(--gray-500); transition: transform var(--transition); }
.dp.open .dp-chev { transform: rotate(180deg); }
.dp-pop { position: fixed; z-index: 340; width: 17.5rem; max-width: 92vw; max-height: calc(100vh - 1.25rem); overflow-y: auto; background: #fff; border: 1px solid var(--border); border-radius: 0.875rem; box-shadow: var(--shadow-lg); padding: 0.75rem; display: none; }
.dp.open .dp-pop { display: block; }
.dp-head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 0.5rem; }
.dp-head .dp-title { font-family: var(--font-display); font-weight: 600; font-size: 0.95rem; }
.dp-nav { width: 2rem; height: 2rem; border: none; background: transparent; border-radius: 0.5rem; cursor: pointer; display: grid; place-items: center; color: var(--gray-700); }
.dp-nav:hover { background: var(--alpet-blue-light); color: var(--alpet-blue); }
.dp-grid { display: grid; grid-template-columns: repeat(7, 1fr); gap: 2px; }
.dp-grid .dp-dow { text-align: center; font-size: 0.68rem; font-weight: 700; color: var(--text-muted); padding: 0.25rem 0; }
.dp-day { aspect-ratio: 1; border: none; background: transparent; border-radius: 0.5rem; cursor: pointer; font: inherit; font-size: 0.82rem; color: var(--gray-900); transition: background var(--transition); }
.dp-day:hover { background: var(--alpet-blue-light); color: var(--alpet-blue); }
.dp-day.today { color: var(--alpet-blue); font-weight: 700; box-shadow: inset 0 0 0 1.5px var(--alpet-blue); }
.dp-day.sel { background: var(--alpet-blue); color: #fff; font-weight: 700; }
.dp-time { display: flex; align-items: center; gap: 0.375rem; margin-top: 0.625rem; padding-top: 0.625rem; border-top: 1px solid var(--gray-100); font-size: 0.9rem; color: var(--gray-700); }
.dp-time .material-symbols-rounded { font-size: 1.125rem; color: var(--alpet-blue); }
.dp-time input { width: 3.625rem; padding: 0.4375rem 0.375rem; border: 1px solid var(--border); border-radius: 0.5rem; font: inherit; font-variant-numeric: tabular-nums; text-align: center; outline: none; -moz-appearance: textfield; appearance: textfield; }
.dp-time input::-webkit-outer-spin-button, .dp-time input::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }
.dp-time input:focus { border-color: var(--alpet-blue); box-shadow: 0 0 0 2px var(--alpet-blue-light); }
.dp-foot { display: flex; justify-content: space-between; margin-top: 0.625rem; }
.dp-foot button { border: none; background: transparent; font: inherit; font-size: 0.83rem; font-weight: 600; cursor: pointer; padding: 0.4375rem 0.875rem; border-radius: 0.5rem; }
.dp-foot .dp-today { color: var(--gray-700); } .dp-foot .dp-today:hover { background: var(--gray-100); }
.dp-foot .dp-ok { color: #fff; background: var(--alpet-blue); } .dp-foot .dp-ok:hover { background: var(--alpet-blue-dark); }

/* --- Giriş (login) sayfası --- */
.auth-wrap { min-height: 100vh; display: grid; grid-template-columns: 1.05fr 1fr; }
.auth-visual { background: linear-gradient(150deg, var(--alpet-blue) 0%, var(--alpet-blue-dark) 55%, #00335f 100%); color: #fff; padding: 3.25rem 3.5rem; display: flex; flex-direction: column; justify-content: space-between; position: relative; overflow: hidden; }
.auth-visual::before { content: ""; position: absolute; width: 26.25rem; height: 26.25rem; border-radius: 50%; background: radial-gradient(circle, rgba(102,188,41,0.35), transparent 70%); top: -7.5rem; right: -7.5rem; }
.auth-visual::after { content: ""; position: absolute; width: 20rem; height: 20rem; border-radius: 50%; background: rgba(255,255,255,0.06); bottom: -6.25rem; left: -5rem; }
.auth-visual > * { position: relative; z-index: 1; }
.av-brand { display: flex; align-items: center; gap: 0.75rem; font-family: var(--font-display); font-weight: 700; font-size: 1.3rem; }
.av-brand img { height: 2.5rem; width: auto; background: #fff; border-radius: 0.875rem; padding: 0.4375rem; box-shadow: 0 0.375rem 1rem rgba(0,0,0,0.14); }
.av-brand b { color: var(--alpet-green); }
.av-hero h2 { font-family: var(--font-display); font-size: 2.6rem; line-height: 1.15; font-weight: 700; }
.av-hero p { opacity: 0.82; margin: 1rem 0 1.625rem; max-width: 26.25rem; line-height: 1.6; }
.av-feat { list-style: none; display: flex; flex-direction: column; gap: 0.75rem; }
.av-feat li { display: flex; align-items: center; gap: 0.625rem; font-size: 0.95rem; opacity: 0.95; }
.av-feat li .material-symbols-rounded { color: var(--alpet-green); font-size: 1.375rem; }
.av-foot { font-size: 0.8rem; opacity: 0.7; }
.auth-panel { display: flex; align-items: center; justify-content: center; padding: 2.5rem 1.5rem; }
.auth-card { width: 100%; max-width: 25rem; }
.auth-card .ac-logo { height: 5.75rem; display: block; margin: 0 auto 1.5rem; }
.auth-card h1 { font-family: var(--font-display); font-size: 1.65rem; color: var(--gray-900); }
.auth-card .sub { color: var(--text-muted); margin: 0.5rem 0 1.875rem; }
.auth-field { margin-bottom: 1.125rem; }
.auth-field > label { display: block; font-size: 0.82rem; font-weight: 600; color: var(--gray-700); margin-bottom: 0.4375rem; }
.auth-input { position: relative; display: flex; align-items: center; }
.auth-input > .material-symbols-rounded { position: absolute; left: 0.8125rem; color: var(--gray-500); font-size: 1.25rem; pointer-events: none; }
.auth-input input { width: 100%; padding: 0.75rem 0.875rem 0.75rem 2.625rem; border: 1px solid var(--border); border-radius: 0.625rem; font: inherit; font-size: 0.92rem; outline: none; transition: border var(--transition), box-shadow var(--transition); }
.auth-input input:focus { border-color: var(--alpet-blue); box-shadow: 0 0 0 3px var(--alpet-blue-light); }
.auth-input .pw-toggle { position: absolute; right: 0.5rem; background: none; border: none; cursor: pointer; color: var(--gray-500); display: grid; place-items: center; padding: 0.375rem; border-radius: 0.5rem; }
.auth-input .pw-toggle:hover { color: var(--alpet-blue); background: var(--alpet-blue-light); }
.auth-row { display: flex; align-items: center; justify-content: space-between; margin: 0.25rem 0 1.5rem; font-size: 0.86rem; }
.auth-check { display: flex; align-items: center; gap: 0.5rem; color: var(--gray-700); cursor: pointer; }
.auth-check input { width: 1rem; height: 1rem; accent-color: var(--alpet-blue); }
.auth-row a { color: var(--alpet-blue); font-weight: 600; }
.auth-row a:hover { text-decoration: underline; }
.auth-card form .btn { width: 100%; justify-content: center; padding: 0.8125rem; font-size: 1rem; }
.auth-foot { text-align: center; margin-top: 1.5rem; font-size: 0.83rem; color: var(--text-muted); }
.auth-foot a { color: var(--alpet-blue); font-weight: 600; }
@media (max-width: 860px) { .auth-wrap { grid-template-columns: 1fr; } .auth-visual { display: none; } }

/* --- Haberler & Duyurular listesi --- */
.news-filterbar { display: flex; align-items: flex-end; gap: 0.875rem; flex-wrap: wrap; background: #fff; border: 1px solid var(--border); border-radius: var(--radius); box-shadow: var(--shadow-sm); padding: 0.875rem 1rem; margin-bottom: 1.25rem; }
.news-filterbar .nf-field { display: flex; flex-direction: column; gap: 0.375rem; }
.news-filterbar .nf-field > label { font-size: 0.74rem; font-weight: 600; color: var(--text-muted); text-transform: uppercase; letter-spacing: 0.01875rem; }
.news-filterbar .nf-field.date { width: 11.875rem; }
.news-filterbar .nf-field.author { width: 13.125rem; }
.news-filterbar .nf-sep { align-self: center; color: var(--text-muted); padding: 0 2px 0.5rem; }
.news-filterbar .nf-clear { margin-left: auto; }
.news-grid2 { display: grid; grid-template-columns: repeat(auto-fill, minmax(18.75rem, 1fr)); gap: 1.25rem; }
.narticle { background: #fff; border: 1px solid var(--border); border-radius: var(--radius); overflow: hidden; box-shadow: var(--shadow-sm); cursor: pointer; transition: box-shadow var(--transition), transform var(--transition); display: flex; flex-direction: column; }
.narticle:hover { box-shadow: var(--shadow-lg); transform: translateY(-0.1875rem); }
.narticle .nt-thumb { position: relative; height: 10.75rem; background-size: cover; background-position: center; }
.narticle .nt-cat { position: absolute; top: 0.75rem; left: 0.75rem; font-size: 0.68rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.025rem; color: #fff; padding: 0.25rem 0.6875rem; border-radius: 1.25rem; }
.nt-cat.blue { background: var(--alpet-blue); } .nt-cat.green { background: var(--alpet-green); } .nt-cat.orange { background: var(--alpet-orange); } .nt-cat.purple { background: #6b4de0; }
.narticle .nt-body { padding: 0.9375rem 1rem 1rem; display: flex; flex-direction: column; gap: 0.5rem; flex: 1; }
.narticle .nt-body h3 { font-family: var(--font-display); font-size: 1.05rem; line-height: 1.3; }
.narticle .nt-exc { font-size: 0.84rem; color: var(--text-muted); line-height: 1.5; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.narticle .nt-foot { display: flex; align-items: center; gap: 0.5rem; margin-top: auto; padding-top: 0.625rem; border-top: 1px solid var(--gray-100); font-size: 0.76rem; color: var(--text-muted); }
.narticle .nt-foot img { width: 1.625rem; height: 1.625rem; border-radius: 50%; object-fit: cover; }
.narticle .nt-foot .nt-auth { font-weight: 600; color: var(--gray-700); }
.narticle .nt-foot .nt-dot { opacity: 0.5; }
.narticle .nt-foot .nt-views { margin-left: auto; display: inline-flex; align-items: center; gap: 0.25rem; }
.narticle .nt-foot .nt-views .material-symbols-rounded { font-size: 0.9375rem; }

/* --- Galeri --- */
.gallery-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(18.125rem, 1fr)); gap: 1.25rem; }
.gallery-card { background: #fff; border: 1px solid var(--border); border-radius: var(--radius); overflow: hidden; box-shadow: var(--shadow-sm); cursor: pointer; transition: box-shadow var(--transition), transform var(--transition); display: flex; flex-direction: column; }
.gallery-card:hover { box-shadow: var(--shadow-lg); transform: translateY(-0.1875rem); }
.gallery-card .gc-cover { position: relative; height: 11.875rem; background-size: cover; background-position: center; }
.gallery-card .gc-cover::after { content: ""; position: absolute; inset: 0; background: linear-gradient(to top, rgba(0,0,0,0.45), transparent 45%); }
.gallery-card .gc-count { position: absolute; top: 0.75rem; right: 0.75rem; z-index: 1; background: rgba(0,0,0,0.55); color: #fff; font-size: 0.74rem; font-weight: 600; padding: 0.25rem 0.625rem; border-radius: 1.25rem; display: inline-flex; align-items: center; gap: 0.3125rem; backdrop-filter: blur(0.25rem); }
.gallery-card .gc-count .material-symbols-rounded { font-size: 0.9375rem; }
.gallery-card .gc-tags { position: absolute; left: 0.75rem; bottom: 0.75rem; z-index: 1; display: flex; gap: 0.375rem; flex-wrap: wrap; }
.gallery-card .gc-tags .gc-tag { background: rgba(255,255,255,0.92); color: var(--gray-900); font-size: 0.68rem; font-weight: 600; padding: 0.1875rem 0.5625rem; border-radius: 1.25rem; }
.gallery-card .gc-body { padding: 0.9375rem 1rem 1rem; display: flex; flex-direction: column; gap: 0.3125rem; flex: 1; }
.gallery-card .gc-body h3 { font-family: var(--font-display); font-size: 1.02rem; line-height: 1.25; }
.gallery-card .gc-date { font-size: 0.76rem; color: var(--text-muted); display: inline-flex; align-items: center; gap: 0.3125rem; }
.gallery-card .gc-date .material-symbols-rounded { font-size: 0.9375rem; }
.gallery-card .gc-desc { font-size: 0.83rem; color: var(--text-muted); line-height: 1.5; margin-top: 2px; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
/* Yükleme küçük resimleri */
.gal-thumbs { display: grid; grid-template-columns: repeat(auto-fill, minmax(5.25rem, 1fr)); gap: 0.5rem; margin-top: 0.625rem; }
.gal-thumbs .gal-thumb { position: relative; padding-top: 100%; border-radius: 0.625rem; overflow: hidden; background: var(--gray-100); }
.gal-thumbs .gal-thumb img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.gal-thumbs .gal-thumb button { position: absolute; top: 0.25rem; right: 0.25rem; width: 1.375rem; height: 1.375rem; border-radius: 50%; border: none; background: rgba(0,0,0,0.6); color: #fff; cursor: pointer; display: grid; place-items: center; }
.gal-thumbs .gal-thumb button .material-symbols-rounded { font-size: 0.875rem; }

/* --- Sayfa araç çubuğu (toolbar) --- */
.toolbar {
  display: flex; align-items: center; gap: 0.75rem; flex-wrap: wrap;
  margin-bottom: 1.25rem;
}
.toolbar .spacer { flex: 1; }
.search-box {
  display: flex; align-items: center; gap: 0.5rem; background: #fff;
  border: 1px solid var(--border); border-radius: 0.625rem; padding: 0 0.875rem; height: 2.625rem;
  min-width: 13.75rem; flex: 1; max-width: 21.25rem; transition: border var(--transition), box-shadow var(--transition);
}
.search-box:focus-within { border-color: var(--alpet-blue); box-shadow: 0 0 0 3px var(--alpet-blue-light); }
.search-box input { border: none; outline: none; font: inherit; font-size: 0.9rem; flex: 1; background: transparent; }
.search-box .material-symbols-rounded { color: var(--gray-500); font-size: 1.1875rem; }
.select {
  appearance: none; -webkit-appearance: none;
  height: 2.625rem; padding: 0 2.375rem 0 0.875rem; border: 1px solid var(--border); border-radius: 0.625rem;
  background: #fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%237a8694' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E") no-repeat right 0.8125rem center;
  font: inherit; font-size: 0.9rem; cursor: pointer; color: var(--gray-700);
  transition: border var(--transition), box-shadow var(--transition);
}
.select:hover { border-color: var(--alpet-blue); }
.select:focus { outline: none; border-color: var(--alpet-blue); box-shadow: 0 0 0 3px var(--alpet-blue-light); }

/* --- Segment sekmeleri --- */
.tabs { display: flex; gap: 0.25rem; border-bottom: 1px solid var(--border); margin-bottom: 1.25rem; flex-wrap: wrap; }
.tabs button {
  border: none; background: transparent; padding: 0.75rem 1.125rem; cursor: pointer;
  font: inherit; font-weight: 600; color: var(--gray-500); position: relative;
  border-bottom: 0.15625rem solid transparent; margin-bottom: -1px;
  display: inline-flex; align-items: center; gap: 0.4375rem;
}
.tabs button .material-symbols-rounded { font-size: 1.125rem; }
.tabs button:hover { color: var(--alpet-blue); }
.tabs button.active { color: var(--alpet-blue); border-bottom-color: var(--alpet-blue); }
.tabs button .count { background: var(--gray-100); border-radius: 1.25rem; padding: 1px 0.5rem; font-size: 0.75rem; margin-left: 0.375rem; }
.tabs button.active .count { background: var(--alpet-blue-light); color: var(--alpet-blue); }

/* --- Tablo --- */
.table-wrap { background: #fff; border: 1px solid var(--border); border-radius: var(--radius); overflow: hidden; box-shadow: var(--shadow-sm); }
table.data { width: 100%; border-collapse: collapse; }
table.data th {
  text-align: left; font-size: 0.78rem; text-transform: uppercase; letter-spacing: 0.025rem;
  color: var(--gray-500); padding: 0.875rem 1.125rem; background: var(--gray-50);
  border-bottom: 1px solid var(--border); white-space: nowrap;
}
table.data td { padding: 0.875rem 1.125rem; border-bottom: 1px solid var(--gray-100); font-size: 0.9rem; }
table.data tbody tr:last-child td { border-bottom: none; }
table.data tbody tr { transition: background var(--transition); cursor: pointer; }
table.data tbody tr:hover { background: var(--alpet-blue-light); }
.cell-user { display: flex; align-items: center; gap: 0.625rem; }
.cell-user .info strong { font-size: 0.88rem; display: block; }
.cell-user .info span { font-size: 0.76rem; color: var(--text-muted); }

/* --- Üst seviye mod değiştirici (Taleplerim / Onayımdakiler) --- */
.mode-switch { display: inline-flex; background: var(--gray-100); border-radius: 0.75rem; padding: 0.25rem; margin-bottom: 1.375rem; gap: 0.25rem; }
.mode-switch button { display: inline-flex; align-items: center; gap: 0.5rem; border: none; background: transparent; padding: 0.625rem 1.375rem; border-radius: 0.5625rem; font: inherit; font-weight: 600; color: var(--gray-600); cursor: pointer; transition: all var(--transition); }
.mode-switch button .material-symbols-rounded { font-size: 1.1875rem; }
.mode-switch button.active { background: #fff; color: var(--alpet-blue); box-shadow: var(--shadow-sm); }
.mode-switch button .count { background: var(--alpet-orange); color: #fff; font-size: 0.7rem; font-weight: 700; padding: 1px 0.5rem; border-radius: 1.25rem; }

/* Satır içi onay/ret aksiyonları */
.row-actions { display: flex; gap: 0.375rem; justify-content: flex-end; }
.act-btn { display: inline-flex; align-items: center; gap: 0.3125rem; border: none; border-radius: 0.5rem; padding: 0.4375rem 0.8125rem; font: inherit; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all var(--transition); }
.act-btn .material-symbols-rounded { font-size: 1.0625rem; }
.act-btn.ok { background: var(--alpet-green); color: #fff; } .act-btn.ok:hover { background: var(--alpet-green-dark); }
.act-btn.no { background: #fbeaea; color: #d64545; } .act-btn.no:hover { background: #f4cccc; }

/* --- Liste araç çubuğu (sekme + arama) --- */
.list-toolbar { display: flex; align-items: center; justify-content: space-between; gap: 1rem; margin-bottom: 1rem; flex-wrap: wrap; }
.list-toolbar .tabs { flex-wrap: wrap; }

/* --- Modern tablo hücreleri --- */
.cell-proc { display: flex; align-items: center; gap: 0.75rem; }
.cell-proc .pico { width: 2.5rem; height: 2.5rem; border-radius: 0.6875rem; display: grid; place-items: center; flex-shrink: 0; }
.cell-proc .pico .material-symbols-rounded { font-size: 1.3125rem; }
.cell-proc strong { font-size: 0.9rem; display: block; }
.cell-proc span { font-size: 0.76rem; color: var(--text-muted); }
.pico.green { background: var(--alpet-green-light); color: var(--alpet-green-dark); }
.pico.blue { background: var(--alpet-blue-light); color: var(--alpet-blue); }
.pico.orange { background: var(--alpet-orange-light); color: #cc6a10; }
.pico.purple { background: #eae6fb; color: #6b4de0; }
.cell-arrow { width: 2.5rem; text-align: center; color: var(--gray-300); }
table.data tbody tr:hover .cell-arrow { color: var(--alpet-blue); }
.table-empty { text-align: center; padding: 2.75rem 1.25rem; color: var(--text-muted); }
.table-empty .material-symbols-rounded { font-size: 2.625rem; opacity: 0.5; }

/* --- Mobilde tablo → kart (tüm .data tabloları) --- */
@media (max-width: 760px) {
  table.data, table.data tbody, table.data tr, table.data td { display: block; width: 100%; }
  table.data thead { display: none; }
  table.data tr { background: #fff; border: 1px solid var(--border); border-radius: 0.75rem; margin-bottom: 0.875rem; padding: 0.375rem 0.25rem; box-shadow: var(--shadow); }
  table.data tr:hover { background: #fff; }
  table.data td { display: flex; align-items: center; justify-content: space-between; gap: 0.75rem; padding: 0.5625rem 0.875rem; border: none; text-align: right; }
  table.data td::before { content: attr(data-label); font-size: 0.74rem; font-weight: 600; text-transform: uppercase; letter-spacing: 0.01875rem; color: var(--text-muted); text-align: left; flex-shrink: 0; }
  /* Kimlik hücresi (isim/süreç) tam genişlik, etiketsiz, altında ayraç, sola hizalı */
  table.data td:has(.cell-proc), table.data td.cell-proc,
  table.data td:has(.cell-user), table.data td.cell-user {
    border-bottom: 1px solid var(--gray-100); padding-bottom: 0.75rem; margin-bottom: 0.25rem;
    justify-content: flex-start; gap: 0.75rem; text-align: left;
  }
  table.data td:has(.cell-proc)::before, table.data td.cell-proc::before,
  table.data td:has(.cell-user)::before, table.data td.cell-user::before { display: none; }
  table.data td:has(.cell-proc) .cell-proc, table.data td:has(.cell-user) .cell-user { width: 100%; }
  table.data .cell-arrow { display: none; }
  /* Kartları saran beyaz kutuyu kaldır, kartlar tek tek belirgin olsun */
  .card-wrap, .table-wrap { background: transparent; border: none; box-shadow: none; padding: 0; overflow: visible; }
  .list-toolbar .search-box { flex: 1 1 100% !important; max-width: none !important; min-width: 0 !important; }
}

/* --- Mobilde araç çubuğu butonları: sadece ikon, textbox yüksekliğinde --- */
@media (max-width: 600px) {
  .list-toolbar > div:last-child { flex: 1 1 100%; gap: 0.5rem; }
  .list-toolbar .search-box { flex: 1 1 auto !important; }
  .list-toolbar .btn { font-size: 0; gap: 0; padding: 0; width: 2.625rem; height: 2.625rem; min-width: 2.625rem; flex: 0 0 2.625rem; border-radius: 0.625rem; position: relative; justify-content: center; align-items: center; }
  .list-toolbar .btn > .material-symbols-rounded { font-size: 1.375rem; }
  .list-toolbar .btn .pill { position: absolute; top: -0.3125rem; right: -0.3125rem; font-size: 0.62rem; min-width: 1.0625rem; height: 1.0625rem; line-height: 0.9375rem; padding: 0 0.25rem; box-sizing: border-box; }
}

/* --- Rozetler --- */
.badge-status { display: inline-flex; align-items: center; gap: 0.3125rem; font-size: 0.75rem; font-weight: 600; padding: 0.25rem 0.6875rem; border-radius: 1.25rem; }
.badge-status::before { content: ""; width: 0.4375rem; height: 0.4375rem; border-radius: 50%; background: currentColor; }
.st-approved { background: var(--alpet-green-light); color: var(--alpet-green-dark); }
.st-pending { background: var(--alpet-orange-light); color: #cc6a10; }
.st-rejected { background: #fbeaea; color: #d64545; }
.st-draft { background: var(--gray-100); color: var(--gray-700); }
.st-info { background: var(--alpet-blue-light); color: var(--alpet-blue); }

/* --- KPI filtre kartları --- */
.kpi-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 1rem; margin-bottom: 1.25rem; }
.kpi-card { display: flex; align-items: center; gap: 0.875rem; background: #fff; border: 1px solid var(--border); border-radius: var(--radius); box-shadow: var(--shadow-sm); padding: 0.9375rem 1.125rem; cursor: pointer; text-align: left; font: inherit; transition: box-shadow var(--transition), transform var(--transition), border-color var(--transition); }
.kpi-card:hover { box-shadow: var(--shadow); transform: translateY(-2px); }
.kpi-card .kpi-ico { width: 2.875rem; height: 2.875rem; border-radius: 0.8125rem; display: grid; place-items: center; flex-shrink: 0; background: var(--accbg); color: var(--acc); }
.kpi-card .kpi-ico .material-symbols-rounded { font-size: 1.5rem; }
.kpi-card .kpi-txt { display: flex; flex-direction: column; }
.kpi-card .kpi-num { font-family: var(--font-display); font-size: 1.5rem; font-weight: 700; line-height: 1; color: var(--gray-900); }
.kpi-card .kpi-lbl { font-size: 0.8rem; color: var(--text-muted); margin-top: 0.25rem; }
.kpi-card.active { border-color: var(--acc); box-shadow: inset 0 0 0 1px var(--acc); }
.kpi-card[data-filter="all"] { --acc: #475569; --accbg: var(--gray-100); }
.kpi-card[data-filter="pending"] { --acc: #cc6a10; --accbg: var(--alpet-orange-light); }
.kpi-card[data-filter="info"] { --acc: var(--alpet-blue); --accbg: var(--alpet-blue-light); }
.kpi-card[data-filter="approved"] { --acc: var(--alpet-green-dark); --accbg: var(--alpet-green-light); }
.kpi-card[data-filter="active"] { --acc: var(--alpet-green-dark); --accbg: var(--alpet-green-light); }
.kpi-card[data-filter="returned"] { --acc: #cc6a10; --accbg: var(--alpet-orange-light); }
.kpi-card.stat { --acc: var(--alpet-blue); --accbg: var(--alpet-blue-light); cursor: default; }
.kpi-card.stat:hover { transform: none; box-shadow: var(--shadow-sm); }
.kpi-card.stat .kpi-num { font-size: 1.25rem; }
@media (max-width: 900px) { .kpi-grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 480px) { .kpi-grid { grid-template-columns: 1fr 1fr; gap: 0.625rem; } .kpi-card { padding: 0.75rem; gap: 0.625rem; } .kpi-card .kpi-ico { width: 2.5rem; height: 2.5rem; } }

/* --- Formlar --- */
.form-group { margin-bottom: 1.125rem; }
.form-group label { display: block; font-size: 0.85rem; font-weight: 600; margin-bottom: 0.4375rem; color: var(--gray-700); }
.form-control {
  width: 100%; padding: 0.625rem 0.8125rem; border: 1px solid var(--border); border-radius: 0.625rem;
  font: inherit; font-size: 0.9rem; outline: none; transition: border var(--transition), box-shadow var(--transition); background: #fff;
}
.form-control:focus { border-color: var(--alpet-blue); box-shadow: 0 0 0 3px var(--alpet-blue-light); }
.form-control::placeholder { color: var(--gray-500); }
.form-control[readonly] { background: var(--gray-50); color: var(--gray-700); cursor: default; }
.form-control[readonly]:focus { border-color: var(--border); box-shadow: none; }
.req { color: #d64545; font-weight: 700; }
textarea.form-control { resize: vertical; min-height: 5.625rem; line-height: 1.5; }
select.form-control {
  appearance: none; -webkit-appearance: none; cursor: pointer; padding-right: 2.375rem;
  background: #fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%237a8694' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E") no-repeat right 0.8125rem center;
}
.form-row { display: grid; grid-template-columns: 1fr 1fr; gap: 0.875rem; }
.form-hint { font-size: 0.78rem; color: var(--text-muted); margin-top: 0.3125rem; }
.drawer-footer { padding: 1rem 1.25rem; border-top: 1px solid var(--border); display: flex; gap: 0.625rem; justify-content: flex-end; }

/* Metin link buton */
.link-btn { border: none; background: transparent; color: var(--alpet-blue); font: inherit; font-weight: 600; font-size: 0.85rem; cursor: pointer; display: inline-flex; align-items: center; gap: 0.3125rem; padding: 0.25rem 0.5rem; border-radius: 0.4375rem; }
.link-btn:hover { background: var(--alpet-blue-light); }
.link-btn .material-symbols-rounded { font-size: 1.125rem; }

/* --- Masraf formu (çok kalemli, fatura tarzı kutu) --- */
.expense-box { border: 1px solid var(--border); border-radius: 0.75rem; overflow: hidden; box-shadow: var(--shadow-sm); }
.expense-head, .exp-row { display: grid; grid-template-columns: 8.375rem 9.75rem 1fr 8rem 2.25rem; gap: 0.625rem; align-items: center; }
.expense-head { background: var(--gray-50); border-bottom: 1px solid var(--border); padding: 0.6875rem 0.875rem; font-size: 0.7rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.01875rem; color: var(--text-muted); }
.exp-list { padding: 0.25rem 0.875rem; }
.exp-row { padding: 0.5rem 0; }
.exp-row + .exp-row { border-top: 1px dashed var(--gray-200); }
.exp-row .form-control { padding: 0.5rem 0.625rem; font-size: 0.85rem; }
.exp-amt-wrap { position: relative; }
.exp-amt-wrap::before { content: "₺"; position: absolute; left: 0.625rem; top: 50%; transform: translateY(-50%); color: var(--gray-500); font-size: 0.85rem; pointer-events: none; }
.exp-amt-wrap .exp-amt { padding-left: 1.375rem !important; text-align: right; }
.exp-del { width: 2.25rem; height: 2.25rem; border: 1px solid var(--border); background: #fff; border-radius: 0.5625rem; color: #d64545; cursor: pointer; display: grid; place-items: center; transition: background var(--transition); }
.exp-del:hover { background: #fbeaea; }
.expense-total { display: flex; justify-content: space-between; align-items: center; padding: 0.8125rem 1rem; background: var(--alpet-green-light); border-top: 1px solid var(--border); }
.expense-total .lbl { font-weight: 600; color: var(--alpet-green-dark); display: flex; align-items: center; gap: 0.4375rem; }
.expense-total b { font-size: 1.35rem; font-family: var(--font-display); color: var(--alpet-green-dark); }
@media (max-width: 600px) {
  .expense-head { display: none; }
  .exp-row { grid-template-columns: 1fr 1fr; gap: 0.5rem; }
  .exp-row .form-control:nth-child(3) { grid-column: 1 / -1; }
  .exp-row .exp-del { grid-column: 2; justify-self: end; }
}

/* --- Takvim (date picker) --- */
.dp-pop { position: fixed; z-index: 600; background: #fff; border: 1px solid var(--border); border-radius: 0.875rem; box-shadow: var(--shadow-lg); padding: 0.75rem; width: 16.75rem; display: none; }
.dp-pop.open { display: block; }
.dp-head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 0.5rem; }
.dp-head strong { font-family: var(--font-display); font-size: 0.95rem; }
.dp-head button { width: 1.875rem; height: 1.875rem; border: none; background: transparent; border-radius: 0.5rem; cursor: pointer; display: grid; place-items: center; color: var(--gray-600); }
.dp-head button:hover { background: var(--gray-100); color: var(--alpet-blue); }
.dp-grid { display: grid; grid-template-columns: repeat(7, 1fr); gap: 2px; }
.dp-grid .dow { font-size: 0.68rem; color: var(--text-muted); text-align: center; padding: 0.25rem 0; font-weight: 600; }
.dp-grid .d { font-size: 0.82rem; text-align: center; padding: 0.5rem 0; border-radius: 0.5rem; cursor: pointer; }
.dp-grid .d:hover { background: var(--alpet-blue-light); color: var(--alpet-blue); }
.dp-grid .d.muted { color: var(--gray-300); cursor: default; }
.dp-grid .d.muted:hover { background: transparent; }
.dp-grid .d.today { box-shadow: inset 0 0 0 1.5px var(--alpet-blue); }
.dp-grid .d.sel { background: var(--alpet-blue); color: #fff; font-weight: 600; }
.dp-foot { display: flex; justify-content: space-between; margin-top: 0.5rem; padding-top: 0.5rem; border-top: 1px solid var(--border); }
.dp-foot button { border: none; background: transparent; color: var(--alpet-blue); font: inherit; font-weight: 600; font-size: 0.8rem; cursor: pointer; padding: 0.25rem 0.375rem; border-radius: 0.375rem; }
.dp-foot button:hover { background: var(--alpet-blue-light); }
input.datepicker { cursor: pointer; }
.pool-tag { display: inline-block; font-size: 0.64rem; font-weight: 700; background: var(--alpet-orange-light); color: #cc6a10; padding: 1px 0.5rem; border-radius: 1.25rem; margin-top: 0.25rem; }

/* --- Aramalı çip (chips) multi-select & etiket input --- */
.chips-input { display: flex; flex-wrap: wrap; gap: 0.375rem; align-items: center; border: 1px solid var(--border); border-radius: 0.625rem; padding: 0.375rem 0.5rem; min-height: 2.75rem; background: #fff; position: relative; cursor: text; transition: border var(--transition), box-shadow var(--transition); }
.chips-input.focus { border-color: var(--alpet-blue); box-shadow: 0 0 0 3px var(--alpet-blue-light); }
.chip-tag { display: inline-flex; align-items: center; gap: 0.25rem; background: var(--alpet-blue-light); color: var(--alpet-blue); font-size: 0.8rem; font-weight: 600; padding: 0.25rem 0.25rem 0.25rem 0.625rem; border-radius: 0.5rem; }
.chip-tag .x { cursor: pointer; display: grid; place-items: center; width: 1.0625rem; height: 1.0625rem; border-radius: 50%; }
.chip-tag .x:hover { background: rgba(0,94,184,0.2); }
.chip-tag .x .material-symbols-rounded { font-size: 0.875rem; }
.chips-input.tags .chip-tag { background: var(--alpet-green-light); color: var(--alpet-green-dark); }
.chips-input.tags .chip-tag .x:hover { background: rgba(102,188,41,0.25); }
.chips-input input { border: none; outline: none; font: inherit; font-size: 0.88rem; flex: 1; min-width: 5.625rem; padding: 0.25rem; background: transparent; }
.chips-dropdown { position: absolute; top: calc(100% + 0.25rem); left: 0; right: 0; background: #fff; border: 1px solid var(--border); border-radius: 0.625rem; box-shadow: var(--shadow-lg); max-height: 13.125rem; overflow-y: auto; z-index: 320; display: none; padding: 0.375rem; }
.chips-dropdown.open { display: block; }
.chip-tag img { width: 1.25rem; height: 1.25rem; border-radius: 50%; object-fit: cover; margin-right: 2px; }
.chips-opt { padding: 0.5rem 0.625rem; border-radius: 0.4375rem; cursor: pointer; font-size: 0.86rem; display: flex; align-items: center; gap: 0.5625rem; }
.chips-opt img { width: 1.625rem; height: 1.625rem; border-radius: 50%; object-fit: cover; }
.chips-opt:hover { background: var(--alpet-blue-light); color: var(--alpet-blue); }
.chips-empty { padding: 0.5rem 0.625rem; color: var(--text-muted); font-size: 0.82rem; }

/* --- Aramalı tekli seçim (search-select) --- */
.search-select { position: relative; }
.ss-trigger { width: 100%; display: flex; align-items: center; justify-content: space-between; gap: 0.5rem; padding: 0.625rem 0.8125rem; border: 1px solid var(--border); border-radius: 0.625rem; background: #fff; font: inherit; font-size: 0.9rem; color: var(--gray-900); cursor: pointer; text-align: left; transition: border var(--transition), box-shadow var(--transition); }
.ss-trigger:hover { border-color: var(--alpet-blue); }
.ss-lead { font-size: 1.1875rem; color: var(--gray-500); flex-shrink: 0; }
.ss-value { flex: 1; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ss-opt .material-symbols-rounded { font-size: 1.125rem; color: var(--gray-500); }
.ss-opt { display: flex; align-items: center; gap: 0.5625rem; }
.ss-opt img { width: 1.75rem; height: 1.75rem; border-radius: 50%; object-fit: cover; }

/* Geçmiş kullanım link butonu */
.history-link { width: 100%; display: flex; align-items: center; gap: 0.625rem; padding: 0.75rem 0.875rem; border: 1px solid var(--border); border-radius: 0.625rem; background: var(--gray-50); font: inherit; font-size: 0.9rem; font-weight: 600; color: var(--gray-700); cursor: pointer; transition: all var(--transition); }
.history-link:hover { border-color: var(--alpet-blue); background: var(--alpet-blue-light); color: var(--alpet-blue); }
.history-link .arw { margin-left: auto; color: var(--gray-500); }
.history-link:hover .arw { color: var(--alpet-blue); }
.search-select.open .ss-trigger { border-color: var(--alpet-blue); box-shadow: 0 0 0 3px var(--alpet-blue-light); }
.ss-chev { font-size: 1.25rem; color: var(--gray-500); transition: transform var(--transition); }
.search-select.open .ss-chev { transform: rotate(180deg); }
.ss-panel { position: absolute; top: calc(100% + 0.25rem); left: 0; min-width: 100%; width: max-content; max-width: min(21.25rem, 88vw); background: #fff; border: 1px solid var(--border); border-radius: 0.625rem; box-shadow: var(--shadow-lg); z-index: 320; display: none; overflow: hidden; }
.search-select.open .ss-panel { display: block; }
.ss-search { display: flex; align-items: center; gap: 0.5rem; padding: 0.5625rem 0.75rem; border-bottom: 1px solid var(--border); }
.ss-search input { border: none; outline: none; font: inherit; font-size: 0.88rem; flex: 1; }
.ss-search .material-symbols-rounded { font-size: 1.125rem; color: var(--gray-500); }
.ss-options { max-height: 13.125rem; overflow-y: auto; padding: 0.375rem; }
.ss-opt { padding: 0.5625rem 0.6875rem; border-radius: 0.5rem; cursor: pointer; font-size: 0.88rem; white-space: nowrap; }
.ss-opt:hover { background: var(--alpet-blue-light); color: var(--alpet-blue); }
.ss-opt.selected { background: var(--alpet-blue-light); color: var(--alpet-blue); font-weight: 600; }
.ss-empty { padding: 0.75rem; color: var(--text-muted); font-size: 0.83rem; text-align: center; }

/* --- Modal --- */
.modal-overlay {
  position: fixed; inset: 0; background: rgba(15,30,50,0.5); backdrop-filter: blur(0.1875rem);
  opacity: 0; visibility: hidden; transition: all var(--transition); z-index: 300;
  display: grid; place-items: center; padding: 1.25rem;
}
.modal-overlay.open { opacity: 1; visibility: visible; }
.modal {
  background: #fff; border-radius: var(--radius); width: 35rem; max-width: calc(100vw - 2.5rem);
  max-height: 90vh; overflow: hidden; display: flex; flex-direction: column;
  transform: scale(0.95); transition: transform var(--transition); box-shadow: var(--shadow-lg);
}
@media (max-width: 620px) {
  .modal-overlay { padding: 0.875rem; }
  .modal { width: 100%; max-width: calc(100vw - 1.75rem); border-radius: 0.875rem; }
  .modal-header, .modal-body, .modal-footer { padding-left: 1rem; padding-right: 1rem; }
}
.modal-overlay.open .modal { transform: scale(1); }
.modal-header { padding: 1.125rem 1.375rem; border-bottom: 1px solid var(--border); display: flex; align-items: center; justify-content: space-between; }
.modal-header h3 { font-family: var(--font-display); font-size: 1.1rem; display: flex; align-items: center; gap: 0.625rem; }
.modal-header h3 .material-symbols-rounded { font-size: 1.25rem; color: var(--alpet-blue); background: var(--alpet-blue-light); width: 2.25rem; height: 2.25rem; border-radius: 0.625rem; display: grid; place-items: center; }
.modal-body { padding: 1.375rem; overflow-y: auto; }
.modal-footer { padding: 1rem 1.375rem; border-top: 1px solid var(--border); display: flex; gap: 0.625rem; justify-content: flex-end; }
.btn-ghost { background: var(--gray-100); color: var(--gray-700); }
.btn-ghost:hover { background: var(--gray-200); }

/* --- Breadcrumb --- */
.breadcrumb {
  display: flex; align-items: center; gap: 0.375rem; margin-bottom: 1rem;
  font-size: 0.86rem; flex-wrap: wrap;
}
.breadcrumb .bc-back {
  width: 2.25rem; height: 2.25rem; border-radius: 0.625rem; border: 1px solid var(--border);
  background: #fff; color: var(--alpet-blue); display: grid; place-items: center;
  cursor: pointer; margin-right: 0.375rem; transition: all var(--transition); flex-shrink: 0;
  box-shadow: var(--shadow-sm);
}
.breadcrumb .bc-back:hover { background: var(--alpet-blue); color: #fff; border-color: var(--alpet-blue); transform: translateX(-2px); }
.breadcrumb .bc-back .material-symbols-rounded { font-size: 1.25rem; }
.breadcrumb a { display: inline-flex; align-items: center; gap: 0.3125rem; color: var(--text-muted); font-weight: 500; padding: 0.25rem 0.375rem; border-radius: 0.4375rem; }
.breadcrumb a:hover { color: var(--alpet-blue); background: var(--alpet-blue-light); }
.breadcrumb a .material-symbols-rounded { font-size: 1.125rem; }
.breadcrumb .sep { color: var(--gray-300); font-size: 1.125rem; display: inline-flex; }
.breadcrumb .current { color: var(--text); font-weight: 600; padding: 0.25rem 0.375rem; }

/* --- Başlık + breadcrumb aynı satırda (başlık sol, breadcrumb sağ) --- */
.page-bar {
  display: flex; align-items: center; justify-content: space-between;
  gap: 0.75rem 1.5rem; margin-bottom: 1.375rem; padding-bottom: 1rem; flex-wrap: wrap;
  border-bottom: 1px solid var(--border);
}
.page-bar .page-title { margin-bottom: 0.1875rem; font-size: 1.4rem; }
.page-bar .page-sub { margin-bottom: 0; }
.page-bar .breadcrumb { margin-bottom: 0; }

/* Mobilde breadcrumb gizli (geri butonu varsa korunur) */
@media (max-width: 760px) {
  .breadcrumb { display: none; }
  .breadcrumb:has(.bc-back) { display: flex; }
  .breadcrumb:has(.bc-back) a:not(.bc-back),
  .breadcrumb:has(.bc-back) .sep,
  .breadcrumb:has(.bc-back) .current { display: none; }
}
@media (max-width: 680px) {
  .page-bar { flex-direction: column-reverse; align-items: flex-start; }
}

/* --- Genel banner başlık --- */
.page-title { font-family: var(--font-display); font-size: 1.5rem; letter-spacing: -0.03125rem; margin-bottom: 0.25rem; }
.page-sub { color: var(--text-muted); font-size: 0.92rem; margin-bottom: 1.5rem; }

/* ==================== DOKÜMAN YÖNETİMİ ==================== */
.doc-layout { display: grid; grid-template-columns: 18.75rem 1fr; gap: 1.25rem; align-items: start; }
.tree { background: #fff; border: 1px solid var(--border); border-radius: var(--radius); padding: 0.875rem; box-shadow: var(--shadow-sm); position: relative; overflow: hidden; }
.tree::before { content: ""; position: absolute; top: 0; left: 0; right: 0; height: 0.1875rem; background: linear-gradient(90deg, var(--alpet-blue), var(--alpet-green)); border-radius: var(--radius) var(--radius) 0 0; }
.tree-head { display: flex; align-items: center; gap: 0.5rem; font-family: var(--font-display); font-size: 0.98rem; font-weight: 600; padding: 2px 0.25rem 0.75rem; margin-bottom: 0.75rem; border-bottom: 1px solid var(--border); }
.tree-head .material-symbols-rounded { font-size: 1.25rem; color: var(--alpet-blue); }
.tree .tree-search { max-width: none; width: 100%; margin-bottom: 0.75rem; }
.search-box input[type="search"]::-webkit-search-cancel-button { -webkit-appearance: none; appearance: none; }
.search-box .search-clear { border: none; background: transparent; cursor: pointer; color: var(--gray-500); display: none; place-items: center; width: 1.375rem; height: 1.375rem; border-radius: 50%; flex-shrink: 0; }
.search-box .search-clear:hover { background: var(--gray-100); color: var(--gray-900); }
.search-box .search-clear .material-symbols-rounded { font-size: 1.0625rem; }
.search-box.has-value .search-clear { display: grid; }
.tree ul { list-style: none; }
.tree .node { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.625rem; border-radius: 0.5rem; cursor: pointer; font-size: 0.9rem; }
.tree .node:hover { background: var(--gray-100); }
.tree .node.active { background: var(--alpet-blue-light); color: var(--alpet-blue); font-weight: 600; }
.tree .node .material-symbols-rounded { font-size: 1.25rem; color: var(--alpet-orange); }
.tree .node .lock { margin-left: auto; font-size: 0.9375rem; color: var(--gray-500); }
.tree ul ul { margin-left: 1rem; border-left: 1px solid var(--border); padding-left: 0.375rem; }
.doc-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(11.25rem, 1fr)); gap: 0.875rem; }
.doc-card { background: #fff; border: 1px solid var(--border); border-radius: var(--radius); padding: 1.125rem; text-align: center; cursor: pointer; transition: all var(--transition); position: relative; }
.doc-card:hover { box-shadow: var(--shadow); transform: translateY(-0.1875rem); border-color: var(--alpet-blue); }
.doc-card .file-ico { font-size: 2.75rem; margin-bottom: 0.625rem; }
.doc-card .file-ico.pdf { color: #e2574c; } .doc-card .file-ico.doc { color: #2b7de9; } .doc-card .file-ico.xls { color: #1f9d55; } .doc-card .file-ico.img { color: var(--alpet-orange); }
.doc-card h4 { font-size: 0.85rem; word-break: break-word; }
.doc-card .sub { font-size: 0.74rem; color: var(--text-muted); margin-top: 0.25rem; }
.doc-card .lock-tag { position: absolute; top: 0.625rem; left: 0.625rem; font-size: 1rem; color: var(--gray-500); }
.doc-card .file-ico.folder { color: var(--alpet-orange); }
/* Öğe aksiyon menüsü (kebab) */
.doc-menu-btn { position: absolute; top: 0.5rem; right: 0.5rem; width: 1.75rem; height: 1.75rem; border-radius: 0.5rem; border: none; background: transparent; color: var(--gray-500); cursor: pointer; display: grid; place-items: center; opacity: 0; transition: all var(--transition); }
.doc-card:hover .doc-menu-btn { opacity: 1; }
.doc-menu-btn:hover { background: var(--gray-100); color: var(--alpet-blue); }
.doc-row .r-menu { width: 2rem; height: 2rem; border-radius: 0.5rem; border: none; background: transparent; color: var(--gray-500); cursor: pointer; display: grid; place-items: center; flex-shrink: 0; }
.doc-row .r-menu:hover { background: var(--gray-100); color: var(--alpet-blue); }
.item-menu { position: fixed; min-width: 11.875rem; background: #fff; border: 1px solid var(--border); border-radius: 0.75rem; box-shadow: var(--shadow-lg); padding: 0.375rem; z-index: 350; display: none; }
.item-menu.open { display: block; }
.item-menu button { width: 100%; display: flex; align-items: center; gap: 0.6875rem; padding: 0.5625rem 0.75rem; border: none; background: transparent; border-radius: 0.5rem; font: inherit; font-size: 0.86rem; color: var(--gray-700); cursor: pointer; text-align: left; }
.item-menu button:hover { background: var(--gray-50); }
.item-menu button.danger { color: #d64545; }
.item-menu button.danger:hover { background: #fbeaea; }
.item-menu button .material-symbols-rounded { font-size: 1.1875rem; color: inherit; }
.item-menu .sep { height: 1px; background: var(--border); margin: 0.25rem 0.375rem; }
.doc-card .doc-uploader { display: flex; align-items: center; justify-content: center; gap: 0.375rem; margin-top: 0.75rem; padding-top: 0.625rem; border-top: 1px solid var(--gray-100); font-size: 0.72rem; color: var(--text-muted); }
.doc-card .doc-uploader img { width: 1.25rem; height: 1.25rem; border-radius: 50%; object-fit: cover; }

/* Görünüm değiştirici (grid / liste) */
.view-toggle { display: inline-flex; background: var(--gray-100); border-radius: 0.5625rem; padding: 0.1875rem; }
.view-toggle button { border: none; background: transparent; width: 2.125rem; height: 2rem; border-radius: 0.4375rem; cursor: pointer; color: var(--gray-500); display: grid; place-items: center; transition: all var(--transition); }
.view-toggle button .material-symbols-rounded { font-size: 1.25rem; }
.view-toggle button.active { background: #fff; color: var(--alpet-blue); box-shadow: var(--shadow-sm); }
.doc-listbar { display: flex; align-items: center; justify-content: space-between; gap: 0.75rem; margin-bottom: 0.875rem; flex-wrap: wrap; }

/* Liste görünümü */
.doc-list { background: #fff; border: 1px solid var(--border); border-radius: var(--radius); overflow: hidden; box-shadow: var(--shadow-sm); }
.doc-row { display: flex; align-items: center; gap: 0.875rem; padding: 0.75rem 1rem; border-bottom: 1px solid var(--gray-100); cursor: pointer; transition: background var(--transition); }
.doc-row:last-child { border-bottom: none; }
.doc-row:hover { background: var(--alpet-blue-light); }
.doc-row .r-ico { font-size: 1.625rem; flex-shrink: 0; width: 1.875rem; text-align: center; }
.doc-row .r-ico.pdf { color: #e2574c; } .doc-row .r-ico.doc { color: #2b7de9; } .doc-row .r-ico.xls { color: #1f9d55; } .doc-row .r-ico.img { color: var(--alpet-orange); } .doc-row .r-ico.folder { color: var(--alpet-orange); }
.doc-row .r-name { flex: 1; min-width: 0; }
.doc-row .r-name strong { font-size: 0.9rem; display: flex; align-items: center; gap: 0.375rem; }
.doc-row .r-name strong .lock { font-size: 0.9375rem; color: var(--gray-500); }
.doc-row .r-name span { font-size: 0.75rem; color: var(--text-muted); }
.doc-row .r-uploader { display: flex; align-items: center; gap: 0.5rem; width: 11.875rem; font-size: 0.82rem; color: var(--gray-700); }
.doc-row .r-uploader img { width: 1.75rem; height: 1.75rem; border-radius: 50%; object-fit: cover; }
.doc-row .r-date { width: 6.875rem; font-size: 0.82rem; color: var(--text-muted); }
.doc-row .r-size { width: 5.625rem; font-size: 0.82rem; color: var(--text-muted); text-align: right; }
@media (max-width: 760px) { .doc-row .r-uploader, .doc-row .r-date { display: none; } }

/* ==================== KULLANICILAR ==================== */
.count-badge { display: inline-flex; align-items: center; gap: 0.5rem; background: var(--alpet-blue-light); color: var(--alpet-blue); font-weight: 700; font-size: 0.92rem; padding: 0.5rem 1rem; border-radius: 1.875rem; white-space: nowrap; }
.count-badge .material-symbols-rounded { font-size: 1.25rem; }
.count-badge b { font-size: 1.05rem; }
.user-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(16.25rem, 1fr)); gap: 1.125rem; }
.user-card { background: #fff; border: 1px solid var(--border); border-radius: var(--radius); overflow: hidden; box-shadow: var(--shadow-sm); transition: all var(--transition); cursor: pointer; }
.user-card:hover { box-shadow: var(--shadow-lg); transform: translateY(-0.1875rem); }
.user-card .banner { height: 4.625rem; background-size: cover; background-position: center; position: relative; }
.user-card .u-avatar { position: relative; z-index: 1; width: 4.625rem; height: 4.625rem; border-radius: 50%; border: 0.25rem solid #fff; margin: -2.3125rem auto 0; display: block; object-fit: cover; background: var(--gray-200); }
.user-card .u-body { padding: 0.5rem 1.125rem 1.125rem; text-align: center; }
.user-card .u-body h3 { font-size: 1.05rem; font-family: var(--font-display); }
.user-card .u-body .pos { color: var(--alpet-blue); font-size: 0.85rem; font-weight: 600; }
.user-card .u-body .dept { color: var(--text-muted); font-size: 0.8rem; margin-top: 2px; }
.user-card .u-contact { display: flex; justify-content: center; gap: 0.5rem; margin-top: 0.875rem; padding-top: 0.875rem; border-top: 1px solid var(--gray-100); }
.u-icon { width: 2.25rem; height: 2.25rem; border-radius: 0.625rem; display: grid; place-items: center; background: var(--gray-100); color: var(--gray-700); transition: all var(--transition); }
.u-icon:hover { background: var(--alpet-blue); color: #fff; }

/* Kullanıcı detay */
/* Sadece ikonlu aksiyon butonu */
.icon-action { width: 2.25rem; height: 2.25rem; border-radius: 0.625rem; border: 1px solid var(--border); background: #fff; color: var(--gray-600); display: grid; place-items: center; cursor: pointer; transition: all var(--transition); flex-shrink: 0; }
.icon-action:hover { border-color: var(--alpet-blue); color: var(--alpet-blue); background: var(--alpet-blue-light); }
.icon-action .material-symbols-rounded { font-size: 1.1875rem; }
.icon-action.primary { background: var(--alpet-blue); border-color: var(--alpet-blue); color: #fff; }
.icon-action.primary:hover { background: var(--alpet-blue-dark); color: #fff; }
/* Yumuşak gövde metni (Hakkımda / Pozisyon) */
.soft-text { font-size: 0.92rem; line-height: 1.75; color: var(--gray-700); font-weight: 400; letter-spacing: 0.00625rem; }

/* Zengin metin editörü (RTE) */
.rte { border: 1px solid var(--border); border-radius: 0.625rem; overflow: hidden; }
.rte-toolbar { display: flex; align-items: center; gap: 2px; padding: 0.375rem; border-bottom: 1px solid var(--border); background: var(--gray-50); flex-wrap: wrap; }
.rte-toolbar button { width: 2rem; height: 2rem; border: none; background: transparent; border-radius: 0.375rem; cursor: pointer; color: var(--gray-700); display: grid; place-items: center; }
.rte-toolbar button:hover { background: var(--gray-200); color: var(--alpet-blue); }
.rte-toolbar button .material-symbols-rounded { font-size: 1.1875rem; }
.rte-sep { width: 1px; height: 1.25rem; background: var(--border); margin: 0 0.3125rem; }
.rte-area { min-height: 10.625rem; max-height: 21.25rem; overflow-y: auto; padding: 0.75rem 0.875rem; outline: none; font-size: 0.92rem; line-height: 1.7; color: var(--gray-900); }
.rte-area:empty::before { content: attr(data-placeholder); color: var(--gray-500); }
.rte-area ul, .rte-area ol { padding-left: 1.375rem; margin: 0.375rem 0; }
.rte-area a { color: var(--alpet-blue); }

/* Logo seç (deneyim firma logosu) */
.logo-pick { display: flex; align-items: center; gap: 0.625rem; border: 1px dashed var(--border); border-radius: 0.625rem; padding: 0.625rem 0.875rem; cursor: pointer; color: var(--text-muted); font-size: 0.88rem; transition: all var(--transition); }
.logo-pick:hover { border-color: var(--alpet-blue); background: var(--alpet-blue-light); color: var(--alpet-blue); }
.logo-pick img { width: 2.5rem; height: 2.5rem; border-radius: 0.5rem; object-fit: contain; background: #fff; border: 1px solid var(--border); }
.logo-pick .material-symbols-rounded { font-size: 1.5rem; }

/* Onay kutusu satırı */
.check-row { display: flex; align-items: center; gap: 0.5rem; font-size: 0.88rem; color: var(--gray-700); cursor: pointer; margin: -0.375rem 0 1rem; }
.check-row input { width: 1.0625rem; height: 1.0625rem; accent-color: var(--alpet-blue); cursor: pointer; }

/* Timeline'da firma logosu */
.tl-item .tl-logo { width: 1.875rem; height: 1.875rem; border-radius: 0.4375rem; object-fit: contain; background: #fff; border: 1px solid var(--border); float: left; margin-right: 0.625rem; }

.back-link { display: inline-flex; align-items: center; gap: 0.375rem; font-weight: 600; font-size: 0.9rem; color: var(--gray-700); margin-bottom: 1rem; padding: 0.375rem 0.625rem 0.375rem 0.375rem; border-radius: 0.5rem; }
.back-link:hover { background: var(--alpet-blue-light); color: var(--alpet-blue); }
.profile-hero { background: #fff; border: 1px solid var(--border); border-radius: var(--radius); overflow: hidden; box-shadow: var(--shadow-sm); margin-bottom: 1.25rem; }
.profile-hero .cover { height: 12.5rem; background-size: cover; background-position: center; position: relative; }
.profile-hero .cover .edit-cover { position: absolute; top: 0.875rem; right: 0.875rem; }
.profile-hero .hero-body { position: relative; display: flex; align-items: center; gap: 1.125rem; padding: 1.125rem 1.75rem 1.375rem 12.25rem; }
.profile-hero .hero-avatar { position: absolute; left: 1.75rem; top: -1.5rem; }
.profile-hero .hero-avatar img { width: 8.75rem; height: 8.75rem; border-radius: 1.5rem; border: 0.3125rem solid #fff; object-fit: cover; box-shadow: var(--shadow); display: block; }
.profile-hero .hero-avatar .edit-badge { position: absolute; bottom: 0.5rem; right: 0.5rem; width: 2.125rem; height: 2.125rem; border-radius: 50%; background: var(--alpet-blue); color: #fff; border: 2px solid #fff; display: grid; place-items: center; cursor: pointer; }
.profile-hero .hero-meta { flex: 1; }
.profile-hero .hero-meta h1 { font-family: var(--font-display); font-size: 1.35rem; font-weight: 600; letter-spacing: 0.00625rem; color: var(--gray-900); }
.profile-hero .hero-meta .role { font-size: 0.85rem; font-weight: 500; }
.profile-hero .hero-meta .chip { font-size: 0.76rem; }
@media (max-width: 620px) {
  .profile-hero .hero-body { flex-direction: column; align-items: flex-start; gap: 0.75rem; padding: 5.25rem 1.25rem 1.25rem; }
  .profile-hero .hero-avatar { left: 1.25rem; top: -3.75rem; }
  .profile-hero .hero-avatar img { width: 7.25rem; height: 7.25rem; }
}
.profile-hero .hero-meta .role { color: var(--alpet-blue); font-weight: 600; }
.profile-hero .hero-meta .chips { display: flex; gap: 0.5rem; margin-top: 0.5rem; flex-wrap: wrap; }
.chip { display: inline-flex; align-items: center; gap: 0.375rem; background: var(--gray-100); padding: 0.3125rem 0.75rem; border-radius: 1.25rem; font-size: 0.8rem; color: var(--gray-700); }
.detail-grid { display: grid; grid-template-columns: 1fr 21.25rem; gap: 1.25rem; align-items: start; }
.info-row { display: flex; align-items: center; gap: 0.75rem; padding: 0.6875rem 0; border-bottom: 1px solid var(--gray-100); font-size: 0.9rem; }
.info-row:last-child { border-bottom: none; }
.info-row .material-symbols-rounded { color: var(--alpet-blue); font-size: 1.25rem; }
.info-row .lbl { color: var(--text-muted); width: 7.5rem; flex-shrink: 0; }
.timeline { position: relative; padding-left: 1.625rem; }
.timeline::before { content: ""; position: absolute; left: 0.4375rem; top: 0.25rem; bottom: 0.25rem; width: 2px; background: var(--border); }
.timeline .tl-item { position: relative; padding-bottom: 1.25rem; }
.timeline .tl-item::before { content: ""; position: absolute; left: -1.625rem; top: 0.1875rem; width: 1rem; height: 1rem; border-radius: 50%; background: #fff; border: 0.1875rem solid var(--alpet-blue); }
.timeline .tl-item h4 { font-size: 0.95rem; }
.timeline .tl-item .when { font-size: 0.78rem; color: var(--text-muted); }
.timeline .tl-item p { font-size: 0.85rem; color: var(--gray-700); margin-top: 0.25rem; }
.cert-item { display: flex; gap: 0.75rem; align-items: center; padding: 0.75rem; border: 1px solid var(--border); border-radius: 0.625rem; margin-bottom: 0.625rem; }
.cert-item .c-ico { width: 2.625rem; height: 2.625rem; border-radius: 0.625rem; background: var(--alpet-green-light); color: var(--alpet-green-dark); display: grid; place-items: center; }

/* ==================== SÜREÇ / TALEP KARTLARI ==================== */
.process-cards { display: grid; grid-template-columns: repeat(auto-fill, minmax(12.5rem, 1fr)); gap: 0.875rem; margin-bottom: 1.5rem; }
.process-card { background: #fff; border: 1px solid var(--border); border-radius: var(--radius); padding: 1.125rem; cursor: pointer; transition: all var(--transition); display: flex; align-items: center; gap: 0.875rem; }
.process-card:hover { box-shadow: var(--shadow); transform: translateY(-2px); border-color: var(--alpet-blue); }
.process-card .p-ico { width: 2.875rem; height: 2.875rem; border-radius: 0.75rem; display: grid; place-items: center; flex-shrink: 0; }
.process-card h4 { font-size: 0.92rem; } .process-card span { font-size: 0.76rem; color: var(--text-muted); }

/* İzin özet mini grafik */
.leave-summary { display: flex; gap: 0.875rem; margin-bottom: 1.25rem; flex-wrap: wrap; }
.leave-stat { flex: 1; min-width: 7.5rem; background: var(--gray-50); border: 1px solid var(--border); border-radius: 0.75rem; padding: 1rem; text-align: center; }
.leave-stat .num { font-size: 1.8rem; font-weight: 700; font-family: var(--font-display); color: var(--alpet-blue); }
.leave-stat.green .num { color: var(--alpet-green-dark); } .leave-stat.orange .num { color: #cc6a10; }
.leave-stat .lbl { font-size: 0.78rem; color: var(--text-muted); }
.approver-flow { display: flex; flex-direction: column; gap: 0; }
.approver-step { display: flex; gap: 0.875rem; position: relative; padding-bottom: 1.25rem; }
.approver-step:not(:last-child)::before { content: ""; position: absolute; left: 1.1875rem; top: 2.5rem; bottom: 0; width: 2px; background: var(--border); }
.approver-step .a-dot { width: 2.5rem; height: 2.5rem; border-radius: 50%; display: grid; place-items: center; flex-shrink: 0; z-index: 1; }
.a-dot.done { background: var(--alpet-green); color: #fff; } .a-dot.wait { background: var(--alpet-orange); color: #fff; } .a-dot.idle { background: var(--gray-200); color: var(--gray-500); }
.approver-step .a-info strong { font-size: 0.9rem; } .approver-step .a-info span { font-size: 0.78rem; color: var(--text-muted); display: block; }

/* ==================== ETKİNLİK / TAKVİM ==================== */
.cal-layout { display: grid; grid-template-columns: 1fr 20rem; gap: 1.25rem; align-items: start; }
.big-cal { background: #fff; border: 1px solid var(--border); border-radius: var(--radius); padding: 1.25rem; box-shadow: var(--shadow-sm); }
.big-cal .bc-head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 1rem; }
.big-cal .bc-head h2 { font-family: var(--font-display); font-size: 1.2rem; }
.bc-grid { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 0.375rem; }
.bc-grid .bc-dow { text-align: center; font-size: 0.75rem; font-weight: 600; color: var(--text-muted); padding-bottom: 0.375rem; }
.bc-cell { min-height: 5.75rem; border: 1px solid var(--gray-100); border-radius: 0.5rem; padding: 0.375rem; font-size: 0.8rem; transition: background var(--transition); }
.bc-cell:hover { background: var(--gray-50); }
.bc-cell.muted { background: var(--gray-50); color: var(--gray-300); }
.bc-cell .dnum { font-weight: 600; }
.bc-cell.today .dnum { background: var(--alpet-blue); color: #fff; width: 1.5rem; height: 1.5rem; border-radius: 50%; display: grid; place-items: center; }
.bc-ev { font-size: 0.7rem; padding: 2px 0.375rem; border-radius: 0.3125rem; margin-top: 0.1875rem; color: #fff; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; cursor: pointer; }
.bc-ev.blue { background: var(--alpet-blue); } .bc-ev.green { background: var(--alpet-green); } .bc-ev.orange { background: var(--alpet-orange); }
.event-item { background: #fff; border: 1px solid var(--border); border-left: 0.25rem solid var(--alpet-blue); border-radius: 0.625rem; padding: 0.875rem; margin-bottom: 0.75rem; cursor: pointer; transition: all var(--transition); }
.event-item:hover { box-shadow: var(--shadow); }
.event-item.green { border-left-color: var(--alpet-green); } .event-item.orange { border-left-color: var(--alpet-orange); }
.event-item h4 { font-size: 0.95rem; margin-bottom: 0.375rem; }
.event-item .e-meta { font-size: 0.78rem; color: var(--text-muted); display: flex; align-items: center; gap: 0.375rem; margin-top: 0.25rem; }

/* Etkinlik takvimi — gelişmiş */
.big-cal .bc-head .bc-nav { display: flex; align-items: center; gap: 0.375rem; }
.big-cal .bc-head .bc-today-btn { font-size: 0.8rem; font-weight: 600; padding: 0.375rem 0.75rem; border: 1px solid var(--border); border-radius: 0.5rem; background: #fff; cursor: pointer; color: var(--gray-700); }
.big-cal .bc-head .bc-today-btn:hover { border-color: var(--alpet-blue); color: var(--alpet-blue); }
.bc-cell { cursor: pointer; display: flex; flex-direction: column; gap: 0.1875rem; }
.bc-cell.today { border-color: var(--alpet-blue); background: var(--alpet-blue-light); }
.bc-more { font-size: 0.66rem; color: var(--text-muted); font-weight: 600; padding-left: 2px; }
.bc-bday { display: inline-flex; align-items: center; gap: 0.1875rem; font-size: 0.66rem; font-weight: 600; color: #e0399b; background: #fce4f1; padding: 2px 0.375rem; border-radius: 0.3125rem; margin-top: 0.1875rem; max-width: 100%; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.bc-bday .material-symbols-rounded { font-size: 0.8125rem; flex-shrink: 0; }
.bc-leaves { margin-top: auto; display: flex; align-items: center; gap: 0.25rem; padding-top: 0.1875rem; }
.bc-leaves .lv-stack { display: flex; }
.bc-leaves .lv-stack img { width: 1.125rem; height: 1.125rem; border-radius: 50%; border: 0.09375rem solid var(--alpet-orange); margin-left: -0.375rem; object-fit: cover; background: #fff; }
.bc-leaves .lv-stack img:first-child { margin-left: 0; }
.bc-leaves .lv-lbl { font-size: 0.6rem; color: #cc6a10; font-weight: 700; display: inline-flex; align-items: center; gap: 1px; }
.leave-item { display: flex; align-items: center; gap: 0.6875rem; padding: 0.625rem 0; border-bottom: 1px solid var(--gray-100); }
.leave-item:last-child { border-bottom: none; }
.leave-item img { width: 2.25rem; height: 2.25rem; border-radius: 50%; object-fit: cover; }
.leave-item .li-info strong { font-size: 0.88rem; display: block; }
.leave-item .li-info span { font-size: 0.76rem; color: var(--text-muted); }
.leave-item .li-badge { margin-left: auto; font-size: 0.7rem; font-weight: 600; color: #cc6a10; background: var(--alpet-orange-light); padding: 0.1875rem 0.625rem; border-radius: 1.25rem; white-space: nowrap; }
.day-section { margin-bottom: 1.375rem; }
.day-section h4 { font-size: 0.82rem; text-transform: uppercase; letter-spacing: 0.025rem; color: var(--text-muted); margin-bottom: 0.625rem; display: flex; align-items: center; gap: 0.4375rem; }
.day-section h4 .material-symbols-rounded { font-size: 1.125rem; color: var(--alpet-blue); }
.day-ev { display: flex; gap: 0.75rem; padding: 0.6875rem 0; border-bottom: 1px solid var(--gray-100); }
.day-ev:last-child { border-bottom: none; }
.day-ev .de-dot { width: 0.625rem; height: 0.625rem; border-radius: 50%; margin-top: 0.3125rem; flex-shrink: 0; }
.day-ev .de-dot.blue { background: var(--alpet-blue); } .day-ev .de-dot.green { background: var(--alpet-green); } .day-ev .de-dot.orange { background: var(--alpet-orange); }
.day-ev strong { font-size: 0.9rem; display: block; }
.day-ev .de-meta { font-size: 0.78rem; color: var(--text-muted); margin-top: 2px; }
.ev-legend { display: flex; gap: 1rem; flex-wrap: wrap; font-size: 0.78rem; color: var(--text-muted); margin-top: 0.875rem; }
.ev-legend span { display: inline-flex; align-items: center; gap: 0.375rem; }
.ev-legend i { width: 0.6875rem; height: 0.6875rem; border-radius: 0.1875rem; display: inline-block; }
.filter-chips { display: flex; gap: 0.5rem; flex-wrap: wrap; margin-bottom: 1rem; }
.filter-chip { padding: 0.4375rem 0.875rem; border-radius: 1.25rem; border: 0.09375rem solid var(--border); background: #fff; cursor: pointer; font-size: 0.82rem; font-weight: 600; color: var(--gray-700); }
.filter-chip.active { background: var(--alpet-blue); color: #fff; border-color: var(--alpet-blue); }
.filter-chip.toggle { display: inline-flex; align-items: center; gap: 0.3125rem; }
.filter-chip.toggle .material-symbols-rounded { font-size: 1rem; }
.filter-chip.tg-leaves { border-color: var(--alpet-orange); color: #cc6a10; }
.filter-chip.tg-leaves.active { background: var(--alpet-orange); border-color: var(--alpet-orange); color: #fff; }
.filter-chip.tg-bday { border-color: #e0399b; color: #e0399b; }
.filter-chip.tg-bday.active { background: #e0399b; border-color: #e0399b; color: #fff; }

/* ==================== GRUPLAR ==================== */
/* Grup görselleri (banner + ikon, kırpılabilir) */
.group-media { position: relative; margin-bottom: 2.25rem; }
.gm-banner { height: 8.125rem; border-radius: 0.75rem; border: 1px dashed var(--border); background-color: var(--gray-50); background-size: cover; background-position: center; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 0.25rem; color: var(--text-muted); font-size: 0.85rem; cursor: pointer; transition: all var(--transition); }
.gm-banner:hover { border-color: var(--alpet-blue); color: var(--alpet-blue); }
.gm-banner .material-symbols-rounded { font-size: 1.75rem; }
.gm-banner.has-img { border-style: solid; }
.gm-banner.has-img .material-symbols-rounded, .gm-banner.has-img .gm-hint { display: none; }
.gm-icon { position: absolute; left: 1.125rem; bottom: -1.625rem; width: 4.125rem; height: 4.125rem; border-radius: 1rem; border: 0.1875rem solid #fff; background-color: var(--gray-100); background-size: cover; background-position: center; display: grid; place-items: center; cursor: pointer; color: var(--gray-500); box-shadow: var(--shadow); transition: color var(--transition); }
.gm-icon:hover { color: var(--alpet-blue); }
.gm-icon .material-symbols-rounded { font-size: 1.375rem; }
.gm-icon.has-img .material-symbols-rounded { display: none; }

.group-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(17.5rem, 1fr)); gap: 1.125rem; }
.group-card { background: #fff; border: 1px solid var(--border); border-radius: var(--radius); overflow: hidden; box-shadow: var(--shadow-sm); transition: all var(--transition); cursor: pointer; display: flex; flex-direction: column; }
.group-card:hover { box-shadow: var(--shadow-lg); transform: translateY(-0.1875rem); }
.group-card .g-banner { height: 6.25rem; background-size: cover; background-position: center; }
.group-card .g-body { padding: 1rem; }
.group-card .g-ico { width: 3.375rem; height: 3.375rem; border-radius: 0.875rem; margin: -2.625rem 0 0.5rem; border: 0.1875rem solid #fff; display: grid; place-items: center; color: #fff; font-size: 1.625rem; }
.group-card h3 { font-size: 1.05rem; font-family: var(--font-display); }
.group-card .g-desc { font-size: 0.83rem; color: var(--text-muted); margin: 0.375rem 0 0.75rem; }
.group-card .g-foot { display: flex; align-items: center; justify-content: space-between; font-size: 0.8rem; color: var(--text-muted); }
.avatars-stack { display: flex; } .avatars-stack img { width: 1.75rem; height: 1.75rem; border-radius: 50%; border: 2px solid #fff; margin-left: -0.5rem; object-fit: cover; }
.avatars-stack img:first-child { margin-left: 0; }
.group-card .g-link { display: flex; flex-direction: column; flex: 1; color: inherit; text-decoration: none; }
.group-card .g-body { flex: 1; display: flex; flex-direction: column; padding-bottom: 0.75rem; }
.group-card .g-foot { margin-top: auto; }
.group-card .g-cta { padding: 0 1rem 1rem; }
.group-card .g-btn { width: 100%; justify-content: center; }

/* İkincil çerçeveli buton (katılım isteği) */
.btn-outline { background: #fff; border: 0.09375rem solid var(--alpet-blue); color: var(--alpet-blue); }
.btn-outline:hover { background: rgba(0,94,184,0.07); }

/* Davetler butonu rozeti */
.invites-btn { position: relative; }
.invites-btn .pill { padding: 1px 0.5rem; font-size: 0.72rem; }

/* Davet kartı (drawer) */
.invite-card { border: 1px solid var(--border); border-radius: 1rem; overflow: hidden; box-shadow: var(--shadow-sm); margin-bottom: 1rem; background: #fff; }
.invite-card .ivc-banner { height: 5.25rem; background-size: cover; background-position: center; position: relative; }
.invite-card .ivc-ico { position: absolute; left: 1rem; bottom: -1.375rem; width: 3.25rem; height: 3.25rem; border-radius: 0.875rem; border: 0.1875rem solid #fff; display: grid; place-items: center; color: #fff; font-size: 1.625rem; box-shadow: var(--shadow-sm); }
.invite-card .ivc-body { padding: 1.875rem 1rem 1rem; }
.invite-card .ivc-body strong { font-size: 1rem; font-family: var(--font-display); display: block; }
.invite-card .ivc-meta { font-size: 0.78rem; color: var(--text-muted); display: inline-flex; align-items: center; gap: 0.375rem; margin-top: 0.25rem; }
.invite-card .ivc-by { display: flex; align-items: center; gap: 0.5rem; font-size: 0.82rem; color: var(--text-muted); margin: 0.75rem 0; }
.invite-card .ivc-by img { width: 1.75rem; height: 1.75rem; border-radius: 50%; object-fit: cover; }
.invite-card .ivc-acts { display: flex; gap: 0.5rem; }
.invite-card .ivc-acts .btn { flex: 1; justify-content: center; }
.invite-empty { text-align: center; color: var(--text-muted); padding: 3rem 1rem; }
.invite-empty .material-symbols-rounded { font-size: 2.875rem; opacity: 0.5; }
.invite-empty p { margin-top: 0.5rem; font-size: 0.9rem; }

/* Grup detay / feed */
.feed-layout { display: grid; grid-template-columns: 1fr 20rem; gap: 1.25rem; align-items: start; }
/* LinkedIn tarzı 3 kolon (sol sabit · orta kayan · sağ sabit) */
.li-grid { display: grid; grid-template-columns: 18.125rem minmax(0, 1fr) 18.75rem; gap: 1.25rem; align-items: start; }
.li-left, .li-right { position: sticky; top: calc(var(--header-h) + 1rem); display: flex; flex-direction: column; gap: 1.25rem; }
.li-center { display: flex; flex-direction: column; min-width: 0; }
@media (max-width: 1100px) { .li-grid { grid-template-columns: 1fr; } .li-left, .li-right { position: static; } }
.member-list { display: flex; flex-direction: column; gap: 2px; max-height: 22.5rem; overflow-y: auto; }
.ml-item { display: flex; align-items: center; gap: 0.625rem; padding: 0.5rem 0.375rem; border-radius: 0.625rem; }
.ml-item:hover { background: var(--gray-50); }
.ml-item img { width: 2.5rem; height: 2.5rem; border-radius: 50%; object-fit: cover; flex-shrink: 0; }
.ml-info { flex: 1; min-width: 0; }
.ml-info strong { font-size: 0.86rem; display: block; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ml-info span { font-size: 0.74rem; color: var(--text-muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; display: block; }
.ml-item .icon-action { width: 2rem; height: 2rem; }
.post-box { background: #fff; border: 1px solid var(--border); border-radius: var(--radius); padding: 1rem; box-shadow: var(--shadow-sm); margin-bottom: 1.125rem; }
.post-box .pb-top { display: flex; gap: 0.75rem; }
.post-box textarea { flex: 1; border: 1px solid var(--border); border-radius: 0.75rem; padding: 0.75rem; resize: none; font: inherit; outline: none; }
.post-box .pb-actions { display: flex; justify-content: space-between; align-items: center; margin-top: 0.75rem; padding-top: 0.75rem; border-top: 1px solid var(--gray-100); }
.post-box .pb-tools { display: flex; gap: 0.375rem; }
.post { background: #fff; border: 1px solid var(--border); border-radius: var(--radius); box-shadow: var(--shadow-sm); margin-bottom: 1.125rem; overflow: hidden; }
.post .p-head { display: flex; align-items: center; gap: 0.75rem; padding: 1rem 1rem 0; }
.post .p-head .info strong { font-size: 0.92rem; } .post .p-head .info span { font-size: 0.76rem; color: var(--text-muted); }
.post .p-text { padding: 0.75rem 1rem; font-size: 0.92rem; }
.post .p-img img { width: 100%; max-height: 26.25rem; object-fit: cover; }
.post .p-stats { padding: 0.625rem 1rem; font-size: 0.8rem; color: var(--text-muted); display: flex; gap: 0.875rem; border-bottom: 1px solid var(--gray-100); }
.post .p-actions { display: flex; }
.post .p-actions button { flex: 1; border: none; background: transparent; padding: 0.75rem; cursor: pointer; font: inherit; font-weight: 600; color: var(--gray-700); display: flex; align-items: center; justify-content: center; gap: 0.375rem; transition: background var(--transition); }
.post .p-actions button:hover { background: var(--gray-50); }
.post .p-actions button.liked { color: var(--alpet-blue); }
/* Paylaşım kutusu galeri önizleme (çoklu) */
.pb-gallery { display: flex; gap: 0.5rem; margin-top: 0.75rem; flex-wrap: wrap; }
.pb-gallery .pb-thumb { position: relative; width: 5.75rem; height: 5.75rem; border-radius: 0.625rem; overflow: hidden; }
.pb-gallery .pb-thumb img { width: 100%; height: 100%; object-fit: cover; }
.pb-gallery .pb-thumb button { position: absolute; top: 0.25rem; right: 0.25rem; width: 1.375rem; height: 1.375rem; border-radius: 50%; border: none; background: rgba(0,0,0,0.6); color: #fff; cursor: pointer; display: grid; place-items: center; }
.pb-gallery .pb-thumb button .material-symbols-rounded { font-size: 0.875rem; }

/* Gönderi resim galerisi (1 / 2 / 3) */
.p-gallery { display: grid; gap: 0.1875rem; }
.p-gallery img { width: 100%; height: 100%; object-fit: cover; display: block; cursor: pointer; }
.p-gallery[data-count="1"] { grid-template-columns: 1fr; }
.p-gallery[data-count="1"] img { max-height: 27.5rem; }
.p-gallery[data-count="2"] { grid-template-columns: 1fr 1fr; grid-template-rows: 18.75rem; }
.p-gallery[data-count="3"] { grid-template-columns: 2fr 1fr; grid-template-rows: 1fr 1fr; height: 21.25rem; }
.p-gallery[data-count="3"] img:first-child { grid-row: 1 / span 2; }

/* Resim lightbox / slayt */
.lightbox { position: fixed; inset: 0; z-index: 3000; background: rgba(0,0,0,0.86); display: none; align-items: center; justify-content: center; }
.lightbox.open { display: flex; }
.lightbox .lb-img { max-width: 88vw; max-height: 88vh; object-fit: contain; border-radius: 0.5rem; box-shadow: 0 20px 60px rgba(0,0,0,0.5); user-select: none; }
.lightbox .lb-close { position: absolute; top: 1.375rem; right: 1.625rem; width: 2.875rem; height: 2.875rem; }
.lightbox .lb-nav { position: absolute; top: 50%; transform: translateY(-50%); width: 3.25rem; height: 3.25rem; }
.lightbox .lb-prev { left: 1.625rem; } .lightbox .lb-next { right: 1.625rem; }
.lightbox .lb-close, .lightbox .lb-nav { border: none; border-radius: 50%; background: rgba(255,255,255,0.14); color: #fff; cursor: pointer; display: grid; place-items: center; transition: background var(--transition); }
.lightbox .lb-close:hover, .lightbox .lb-nav:hover { background: rgba(255,255,255,0.3); }
.lightbox .lb-close .material-symbols-rounded, .lightbox .lb-nav .material-symbols-rounded { font-size: 1.75rem; }
.lightbox .lb-count { position: absolute; bottom: 1.5rem; left: 50%; transform: translateX(-50%); color: #fff; font-size: 0.85rem; background: rgba(0,0,0,0.4); padding: 0.3125rem 0.875rem; border-radius: 1.25rem; }
@media (max-width: 640px) { .lightbox .lb-nav { width: 2.625rem; height: 2.625rem; } .lightbox .lb-prev { left: 0.625rem; } .lightbox .lb-next { right: 0.625rem; } }

/* Emoji popover */
.emoji-wrap { position: relative; }
.emoji-pop { position: absolute; bottom: calc(100% + 0.5rem); left: 0; background: #fff; border: 1px solid var(--border); border-radius: 0.75rem; box-shadow: var(--shadow-lg); padding: 0.5rem; display: none; grid-template-columns: repeat(6, 1fr); gap: 2px; z-index: 60; width: 14.75rem; }
.emoji-pop.open { display: grid; }
.emoji-pop button { border: none; background: transparent; font-size: 1.3rem; cursor: pointer; padding: 0.3125rem; border-radius: 0.5rem; line-height: 1; }
.emoji-pop button:hover { background: var(--gray-100); }

/* Gönderi odak */
.post { transition: box-shadow var(--transition); cursor: default; }
.post.focused { box-shadow: 0 0 0 2px var(--alpet-blue), var(--shadow); }
.p-stats .like-count, .p-stats .comment-count { cursor: pointer; }
.p-stats .like-count:hover, .p-stats .comment-count:hover { color: var(--alpet-blue); text-decoration: underline; }

/* Beğenenler listesi (modal) */
.liker-item { display: flex; align-items: center; gap: 0.75rem; padding: 0.5625rem 0.25rem; }
.liker-item img { width: 2.5rem; height: 2.5rem; border-radius: 50%; object-fit: cover; }
.liker-item strong { font-size: 0.9rem; display: block; } .liker-item span { font-size: 0.78rem; color: var(--text-muted); }

/* Üye kartları (zengin) */
.member-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(15rem, 1fr)); gap: 1rem; }
.member-card { background: #fff; border: 1px solid var(--border); border-radius: var(--radius); box-shadow: var(--shadow-sm); padding: 1.25rem 1.125rem; display: flex; flex-direction: column; align-items: center; text-align: center; transition: all var(--transition); }
.member-card:hover { box-shadow: var(--shadow); transform: translateY(-2px); }
.member-card > img { width: 4.625rem; height: 4.625rem; border-radius: 50%; object-fit: cover; margin-bottom: 0.625rem; }
.member-card h4 { font-size: 0.98rem; }
.member-card .m-pos { color: var(--alpet-blue); font-size: 0.82rem; font-weight: 600; }
.member-card .m-dep { color: var(--text-muted); font-size: 0.78rem; margin-top: 2px; }
.member-card .m-foot { margin-top: 0.875rem; display: flex; flex-direction: column; gap: 0.5rem; align-items: center; width: 100%; }

/* Katılım istekleri */
.join-req { display: flex; align-items: center; gap: 0.625rem; padding: 0.6875rem 0; border-bottom: 1px solid var(--gray-100); }
.join-req:last-child { border-bottom: none; }
.join-req img { width: 2.5rem; height: 2.5rem; border-radius: 50%; object-fit: cover; }
.join-req .jr-info { flex: 1; min-width: 0; }
.join-req .jr-info strong { font-size: 0.85rem; display: block; }
.join-req .jr-info span { font-size: 0.74rem; color: var(--text-muted); }
.join-req .jr-acts { display: flex; gap: 0.3125rem; }
.join-req .jr-acts button { width: 2rem; height: 2rem; border-radius: 0.5rem; border: none; cursor: pointer; display: grid; place-items: center; }
.join-req .jr-acts .ok { background: var(--alpet-green); color: #fff; } .join-req .jr-acts .no { background: #fbeaea; color: #d64545; }

/* Grup davetleri (groups.html) */
.invite-banner { background: #fff; border: 1px solid var(--border); border-radius: var(--radius); box-shadow: var(--shadow-sm); padding: 1.125rem; margin-bottom: 1.25rem; }
.invite-banner.tile::before { background: linear-gradient(90deg, var(--alpet-orange), #ffb56b); }
.invite-item { display: flex; align-items: center; gap: 0.875rem; padding: 0.75rem 0; border-bottom: 1px solid var(--gray-100); }
.invite-item:last-child { border-bottom: none; }
.invite-item .iv-ico { width: 2.875rem; height: 2.875rem; border-radius: 0.75rem; display: grid; place-items: center; color: #fff; flex-shrink: 0; }
.invite-item .iv-info { flex: 1; min-width: 0; }
.invite-item .iv-info strong { font-size: 0.92rem; } .invite-item .iv-info span { font-size: 0.78rem; color: var(--text-muted); display: block; }
.invite-item .iv-acts { display: flex; gap: 0.5rem; }
/* Yorumlar */
.post .p-comments { border-top: 1px solid var(--gray-100); }
.comment-item { display: flex; gap: 0.625rem; padding: 0.75rem 1rem 0.25rem; }
.comment-item img { width: 2rem; height: 2rem; border-radius: 50%; flex-shrink: 0; }
.comment-item .c-bubble { background: var(--gray-50); border: 1px solid var(--border); border-radius: 0.75rem; padding: 0.5rem 0.75rem; }
.comment-item .c-bubble strong { font-size: 0.82rem; display: block; }
.comment-item .c-bubble span { font-size: 0.87rem; }
.comment-item .c-bubble .c-time { display: block; font-size: 0.7rem; color: var(--text-muted); margin-top: 0.1875rem; }

/* Yönetici: kapak & ikon düzenleme butonları */
.profile-hero .hero-edit { border: none; cursor: pointer; display: grid; place-items: center; background: rgba(0,0,0,0.5); color: #fff; border-radius: 50%; transition: background var(--transition); }
.profile-hero .hero-edit:hover { background: rgba(0,0,0,0.74); }
.profile-hero .cover-edit { position: absolute; top: 0.875rem; right: 0.875rem; width: 2.5rem; height: 2.5rem; z-index: 2; }
.profile-hero .cover-edit .material-symbols-rounded { font-size: 1.25rem; }
.profile-hero .icon-edit { position: absolute; bottom: 0.375rem; right: 0.375rem; width: 2rem; height: 2rem; border: 2px solid #fff; background: var(--alpet-blue); }
.profile-hero .icon-edit:hover { background: #004a92; }
.profile-hero .icon-edit .material-symbols-rounded { font-size: 1rem; }
.profile-hero:not([data-admin]) .admin-only { display: none; }
.comment-box { display: flex; gap: 0.625rem; align-items: center; padding: 0.75rem 1rem; }
.comment-box img { width: 2rem; height: 2rem; border-radius: 50%; }
.comment-box input { flex: 1; border: 1px solid var(--border); border-radius: 1.25rem; padding: 0.5rem 0.875rem; outline: none; font: inherit; font-size: 0.88rem; }
.comment-box input:focus { border-color: var(--alpet-blue); }
.comment-box button { border: none; background: var(--alpet-blue); color: #fff; width: 2.375rem; height: 2.375rem; border-radius: 50%; cursor: pointer; display: grid; place-items: center; flex-shrink: 0; }

/* ==================== TİCKET / SÜREÇ DETAY DRAWER ==================== */
.comment-thread { display: flex; flex-direction: column; gap: 1rem; }
.comment { display: flex; gap: 0.75rem; }
.comment .c-body { background: var(--gray-50); border: 1px solid var(--border); border-radius: 0.75rem; padding: 0.75rem 0.875rem; flex: 1; }
.comment .c-body .c-top { display: flex; justify-content: space-between; margin-bottom: 0.25rem; }
.comment .c-body .c-top strong { font-size: 0.85rem; } .comment .c-body .c-top span { font-size: 0.74rem; color: var(--text-muted); }
.comment .c-body p { font-size: 0.88rem; }
.paste-zone { border: 2px dashed var(--border); border-radius: 0.75rem; padding: 1.375rem; text-align: center; color: var(--text-muted); cursor: pointer; transition: all var(--transition); }
.paste-zone:hover, .paste-zone.drag { border-color: var(--alpet-blue); background: var(--alpet-blue-light); color: var(--alpet-blue); }
.attach-list { display: flex; flex-wrap: wrap; gap: 0.5rem; margin-top: 0.625rem; }
.attach { display: flex; align-items: center; gap: 0.375rem; background: var(--gray-100); border-radius: 0.5rem; padding: 0.375rem 0.625rem; font-size: 0.8rem; }

/* ==================== BORDRO / ZİMMET / PDKS ==================== */
.payslip { background: #fff; border: 1px solid var(--border); border-radius: var(--radius); box-shadow: var(--shadow-sm); overflow: hidden; }
.payslip .ps-head { background: linear-gradient(135deg, var(--alpet-blue), var(--alpet-blue-dark)); color: #fff; padding: 1.5rem 1.75rem; display: flex; justify-content: space-between; align-items: center; }
.payslip .ps-head h2 { font-family: var(--font-display); }
.payslip .ps-body { padding: 1.5rem 1.75rem; }
.ps-section { margin-bottom: 1.375rem; }
.ps-section h4 { font-size: 0.85rem; text-transform: uppercase; letter-spacing: 0.025rem; color: var(--text-muted); margin-bottom: 0.625rem; }
.ps-line { display: flex; justify-content: space-between; padding: 0.5625rem 0; border-bottom: 1px dashed var(--gray-200); font-size: 0.9rem; }
.ps-total { display: flex; justify-content: space-between; padding: 1rem 0 0; font-size: 1.15rem; font-weight: 700; font-family: var(--font-display); color: var(--alpet-green-dark); }

/* --- Bordro sayfası --- */
.pay-toolbar { display: flex; align-items: flex-end; gap: 0.875rem; flex-wrap: wrap; background: #fff; border: 1px solid var(--border); border-radius: var(--radius); box-shadow: var(--shadow-sm); padding: 1rem 1.125rem; margin-bottom: 1.25rem; }
.pt-field { display: flex; flex-direction: column; gap: 0.375rem; width: 12.5rem; }
.pt-field > label { font-size: 0.76rem; font-weight: 600; color: var(--text-muted); text-transform: uppercase; letter-spacing: 0.01875rem; }
.pt-field .search-select { width: 100%; }
@media (max-width: 560px) { .pt-field { width: 100%; } }
.pay-toolbar .pt-spacer { flex: 1 1 1.25rem; }
.pay-toolbar .btn { height: 2.75rem; }
.kpi-card.stat.s-green { --acc: var(--alpet-green-dark); --accbg: var(--alpet-green-light); }
.kpi-card.stat.s-blue { --acc: var(--alpet-blue); --accbg: var(--alpet-blue-light); }
.kpi-card.stat.s-red { --acc: #d64545; --accbg: #fbeaea; }
.kpi-card.stat.s-orange { --acc: #cc6a10; --accbg: var(--alpet-orange-light); }
.pay-grid { display: grid; grid-template-columns: 1fr 21.25rem; gap: 1.25rem; align-items: start; }
@media (max-width: 900px) { .pay-grid { grid-template-columns: 1fr; } }
.pay-side { display: flex; flex-direction: column; gap: 1.25rem; }
.pay-side .tile-head { margin-bottom: 0.875rem; }
.net-chart { display: flex; align-items: flex-end; gap: 0.4375rem; height: 9.375rem; }
.nc-bar { flex: 1; display: flex; flex-direction: column; align-items: center; gap: 0.4375rem; height: 100%; justify-content: flex-end; cursor: pointer; }
.nc-fill { width: 100%; max-width: 1.5rem; min-height: 0.25rem; background: linear-gradient(var(--alpet-blue), var(--alpet-green)); border-radius: 0.375rem 0.375rem 0 0; transition: height 0.4s cubic-bezier(.4,0,.2,1); }
.nc-bar.active .nc-fill { background: linear-gradient(var(--alpet-orange), #ffb56b); box-shadow: 0 4px 10px rgba(255,136,40,0.3); }
.nc-bar:hover .nc-fill { filter: brightness(1.08); }
.nc-lbl { font-size: 0.62rem; color: var(--text-muted); font-weight: 600; }
.nc-bar.active .nc-lbl { color: var(--alpet-orange); }
.pay-info .pi-row { display: flex; justify-content: space-between; align-items: center; gap: 0.75rem; padding: 0.6875rem 0; border-bottom: 1px solid var(--gray-100); font-size: 0.86rem; }
.pay-info .pi-row:last-child { border-bottom: none; }
.pay-info .pi-row > span { color: var(--text-muted); display: inline-flex; align-items: center; gap: 0.5rem; }
.pay-info .pi-row > span .material-symbols-rounded { font-size: 1.125rem; color: var(--alpet-blue); }
.pay-info .pi-row strong { font-weight: 600; font-variant-numeric: tabular-nums; }
.pay-empty { text-align: center; padding: 4rem 1.25rem; background: #fff; border: 1px dashed var(--border); border-radius: var(--radius); color: var(--text-muted); }
.pay-empty .material-symbols-rounded { font-size: 3.875rem; color: var(--gray-300); }
.pay-empty h3 { font-family: var(--font-display); color: var(--gray-700); margin: 0.75rem 0 0.375rem; font-size: 1.1rem; }
.pay-empty p { font-size: 0.9rem; }
.payslip .ps-badge { background: rgba(255,255,255,0.18); border: 1px solid rgba(255,255,255,0.3); padding: 0.375rem 0.875rem; border-radius: 1.25rem; font-size: 0.82rem; font-weight: 600; }
.pdks-legend { display: flex; gap: 1rem; flex-wrap: wrap; margin-bottom: 1rem; font-size: 0.82rem; }
.pdks-legend span { display: flex; align-items: center; gap: 0.375rem; }
.pdks-legend i { width: 0.75rem; height: 0.75rem; border-radius: 0.1875rem; display: inline-block; }

/* PDKS: canlı giriş-çıkış + haftalık grafik */
.pdks-hero { display: grid; grid-template-columns: 1fr 23.75rem; gap: 1.25rem; margin-bottom: 1.25rem; align-items: stretch; }
@media (max-width: 900px) { .pdks-hero { grid-template-columns: 1fr; } }
.checkin { background: linear-gradient(135deg, var(--alpet-blue), var(--alpet-blue-dark)); color: #fff; border-radius: var(--radius); padding: 1.5rem 1.625rem; display: flex; flex-direction: column; box-shadow: var(--shadow); position: relative; overflow: hidden; }
.checkin::after { content: ""; position: absolute; right: -3.125rem; top: -3.125rem; width: 11.25rem; height: 11.25rem; background: rgba(255,255,255,0.08); border-radius: 50%; }
.checkin > * { position: relative; z-index: 1; }
.checkin .ci-date { font-size: 0.85rem; opacity: 0.85; margin-bottom: 0.25rem; }
.checkin .ci-clock { font-family: var(--font-display); font-size: 2.9rem; font-weight: 700; letter-spacing: 1px; font-variant-numeric: tabular-nums; line-height: 1.1; }
.checkin .ci-status { display: inline-flex; align-items: center; gap: 0.375rem; font-size: 0.78rem; font-weight: 600; background: rgba(255,255,255,0.18); border: 1px solid rgba(255,255,255,0.25); padding: 0.25rem 0.75rem; border-radius: 1.25rem; align-self: flex-start; margin: 0.75rem 0; }
.checkin .ci-status .material-symbols-rounded { font-size: 1rem; }
.checkin .ci-stamps { display: flex; gap: 1.75rem; margin-bottom: 1.25rem; }
.checkin .ci-stamp span { font-size: 0.7rem; opacity: 0.82; text-transform: uppercase; letter-spacing: 0.025rem; display: block; margin-bottom: 0.1875rem; }
.checkin .ci-stamp strong { font-size: 1.3rem; font-family: var(--font-display); font-variant-numeric: tabular-nums; }
.checkin .ci-btn { margin-top: auto; align-self: flex-start; background: #fff; color: var(--alpet-blue); border: none; border-radius: 0.625rem; padding: 0.75rem 1.5rem; font: inherit; font-weight: 700; cursor: pointer; display: inline-flex; align-items: center; gap: 0.5rem; transition: transform var(--transition), box-shadow var(--transition); }
.checkin .ci-btn:hover { transform: translateY(-2px); box-shadow: var(--shadow-lg); }
.checkin .ci-btn.out { background: var(--alpet-orange); color: #fff; }
.checkin .ci-btn.done { background: rgba(255,255,255,0.2); color: #fff; cursor: default; }
.checkin .ci-btn.done:hover { transform: none; box-shadow: none; }
.kpi-card.stat.s-purple { --acc: #6b4de0; --accbg: #eae6fb; }

/* ==================== İÇERİK (CMS) DETAY ==================== */
.content-layout { display: grid; grid-template-columns: 1fr 20rem; gap: 1.75rem; align-items: start; }
.article .a-cover { width: 100%; height: 22.5rem; object-fit: cover; border-radius: var(--radius); margin-bottom: 1.375rem; }
.article h1 { font-family: var(--font-display); font-size: 2rem; line-height: 1.2; margin-bottom: 0.875rem; }
.article .a-meta { display: flex; align-items: center; gap: 0.875rem; padding-bottom: 1.25rem; margin-bottom: 1.375rem; border-bottom: 1px solid var(--border); flex-wrap: wrap; }
.article .a-meta .who { display: flex; align-items: center; gap: 0.625rem; }
.article .a-meta .who strong { font-size: 0.9rem; } .article .a-meta .who span { font-size: 0.78rem; color: var(--text-muted); }
.article .a-body { font-size: 1.02rem; line-height: 1.8; color: var(--gray-900); }
.article .a-body p { margin-bottom: 1.125rem; }
.article .a-body h2 { font-family: var(--font-display); font-size: 1.35rem; margin: 1.625rem 0 0.75rem; scroll-margin-top: 5.25rem; }
.related-card { display: flex; gap: 0.75rem; background: #fff; border: 1px solid var(--border); border-radius: 0.75rem; padding: 0.625rem; margin-bottom: 0.75rem; cursor: pointer; transition: all var(--transition); }
.related-card:hover { box-shadow: var(--shadow); }
.related-card img { width: 4.75rem; height: 3.75rem; border-radius: 0.5rem; object-fit: cover; flex-shrink: 0; }
.related-card h4 { font-size: 0.85rem; line-height: 1.3; } .related-card span { font-size: 0.74rem; color: var(--text-muted); }

/* --- İçerik detay (modern makale) --- */
.read-progress { position: fixed; top: 0; left: 0; right: 0; height: 0.1875rem; background: transparent; z-index: 250; }
.read-progress .rp-bar { height: 100%; width: 0; background: linear-gradient(90deg, var(--alpet-blue), var(--alpet-green)); transition: width 0.1s linear; }
.article-hero { position: relative; border-radius: var(--radius); overflow: hidden; min-height: 23.75rem; display: flex; align-items: flex-end; background-size: cover; background-position: center; margin-bottom: 1.625rem; box-shadow: var(--shadow); }
.article-hero::after { content: ""; position: absolute; inset: 0; background: linear-gradient(to top, rgba(10,22,40,0.9) 0%, rgba(10,22,40,0.45) 45%, transparent 80%); }
.article-hero .ah-overlay { position: relative; z-index: 1; padding: 2.125rem 2.375rem; color: #fff; width: 100%; }
.article-hero .ah-cat { display: inline-block; background: var(--alpet-green); color: #fff; font-size: 0.74rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.03125rem; padding: 0.3125rem 0.8125rem; border-radius: 1.25rem; margin-bottom: 0.875rem; }
.article-hero h1 { font-family: var(--font-display); font-size: 2.2rem; line-height: 1.18; max-width: 50rem; text-shadow: 0 2px 20px rgba(0,0,0,0.3); }
.article-hero .ah-meta { display: flex; align-items: center; gap: 1.125rem; margin-top: 1.125rem; flex-wrap: wrap; font-size: 0.82rem; }
.article-hero .ah-meta .who { display: flex; align-items: center; gap: 0.625rem; }
.article-hero .ah-meta .who img { width: 2.5rem; height: 2.5rem; border-radius: 50%; border: 2px solid rgba(255,255,255,0.6); }
.article-hero .ah-meta .who strong { display: block; font-size: 0.9rem; } .article-hero .ah-meta .who span { opacity: 0.85; font-size: 0.76rem; }
.article-hero .ah-meta .m-chip { display: inline-flex; align-items: center; gap: 0.3125rem; opacity: 0.9; }
.article-hero .ah-meta .m-chip .material-symbols-rounded { font-size: 1.0625rem; }
.a-actions { display: flex; align-items: center; gap: 0.625rem; padding-bottom: 1.25rem; margin-bottom: 1.375rem; border-bottom: 1px solid var(--border); flex-wrap: wrap; }
.a-act { display: inline-flex; align-items: center; gap: 0.4375rem; padding: 0.5rem 0.9375rem; border: 1px solid var(--border); border-radius: 1.375rem; background: #fff; cursor: pointer; font: inherit; font-size: 0.83rem; font-weight: 600; color: var(--gray-700); transition: all var(--transition); }
.a-act:hover { border-color: var(--alpet-blue); color: var(--alpet-blue); }
.a-act .material-symbols-rounded { font-size: 1.125rem; }
.a-act.on { background: var(--alpet-blue-light); border-color: var(--alpet-blue); color: var(--alpet-blue); }
.a-act.on .material-symbols-rounded { font-variation-settings: "FILL" 1; }
.a-act.save.on { background: var(--alpet-orange-light); border-color: var(--alpet-orange); color: #cc6a10; }
.a-tags { display: flex; gap: 0.5rem; margin-left: auto; flex-wrap: wrap; }
.a-tags a { font-size: 0.76rem; font-weight: 600; color: var(--alpet-blue); background: var(--alpet-blue-light); padding: 0.3125rem 0.75rem; border-radius: 1.25rem; }
.article .a-body p.lead { font-size: 1.16rem; line-height: 1.7; color: var(--gray-900); }
.article .a-body p.lead::first-letter { font-family: var(--font-display); font-size: 3.2rem; font-weight: 700; float: left; line-height: 0.8; margin: 0.375rem 0.75rem 0 0; color: var(--alpet-blue); }
.a-stats { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0.875rem; margin: 1.625rem 0; }
.a-stats .as-card { background: var(--gray-50); border: 1px solid var(--border); border-radius: 0.75rem; padding: 1rem; text-align: center; }
.a-stats .as-num { font-family: var(--font-display); font-size: 1.7rem; font-weight: 700; color: var(--alpet-green-dark); }
.a-stats .as-lbl { font-size: 0.78rem; color: var(--text-muted); margin-top: 0.1875rem; }
.article .a-body blockquote { border-left: 0.25rem solid var(--alpet-green); background: var(--alpet-green-light); padding: 1rem 1.25rem; border-radius: 0 0.75rem 0.75rem 0; margin: 1.5rem 0; font-size: 1.08rem; font-style: italic; color: var(--gray-900); }
.author-box { display: flex; gap: 1rem; align-items: center; background: var(--gray-50); border: 1px solid var(--border); border-radius: var(--radius); padding: 1.25rem; margin-top: 1.875rem; }
.author-box img { width: 4rem; height: 4rem; border-radius: 50%; object-fit: cover; flex-shrink: 0; }
.author-box .ab-info strong { font-family: var(--font-display); font-size: 1.05rem; }
.author-box .ab-info .ab-role { font-size: 0.8rem; color: var(--alpet-blue); font-weight: 600; }
.author-box .ab-info p { font-size: 0.85rem; color: var(--text-muted); margin-top: 0.3125rem; line-height: 1.5; }
.a-side { display: flex; flex-direction: column; gap: 1.25rem; position: sticky; top: 5.375rem; }
.toc-list { display: flex; flex-direction: column; gap: 2px; }
.toc-list a { display: block; padding: 0.5rem 0.75rem; border-radius: 0.5rem; font-size: 0.85rem; color: var(--gray-700); border-left: 2px solid transparent; }
.toc-list a:hover { background: var(--alpet-blue-light); color: var(--alpet-blue); border-left-color: var(--alpet-blue); }

/* ==================== ORGANİZASYON ŞEMASI (org chart) ==================== */
.org-scroll { overflow-x: auto; padding: 0.625rem 0 1.25rem; }
.org-tree { display: inline-flex; min-width: 100%; justify-content: center; padding: 0.625rem 1.25rem; }
.org-tree ul { padding-top: 1.375rem; position: relative; display: flex; justify-content: center; }
.org-tree li { display: flex; flex-direction: column; align-items: center; list-style: none; position: relative; padding: 1.375rem 0.75rem 0; }
/* bağlantı çizgileri */
.org-tree li::before, .org-tree li::after { content: ""; position: absolute; top: 0; right: 50%; border-top: 2px solid var(--gray-300); width: 50%; height: 1.375rem; }
.org-tree li::after { right: auto; left: 50%; border-left: 2px solid var(--gray-300); }
.org-tree li:only-child::before, .org-tree li:only-child::after { display: none; }
.org-tree li:only-child { padding-top: 0; }
.org-tree li:first-child::before, .org-tree li:last-child::after { border: 0 none; }
.org-tree li:last-child::before { border-right: 2px solid var(--gray-300); border-radius: 0 0.375rem 0 0; }
.org-tree li:first-child::after { border-radius: 0.375rem 0 0 0; }
.org-tree ul ul::before { content: ""; position: absolute; top: 0; left: 50%; border-left: 2px solid var(--gray-300); width: 0; height: 1.375rem; }
/* düğüm kartı */
.org-node {
  display: inline-flex; flex-direction: column; align-items: center; gap: 0.375rem;
  background: #fff; border: 1px solid var(--border); border-top: 0.1875rem solid var(--alpet-blue);
  border-radius: 0.875rem; padding: 0.875rem 1.125rem; box-shadow: var(--shadow-sm); min-width: 9.875rem;
  transition: all var(--transition); cursor: pointer; position: relative;
}
.org-node:hover { box-shadow: var(--shadow-lg); transform: translateY(-0.1875rem); border-color: var(--alpet-blue); }
.org-node img { width: 3.5rem; height: 3.5rem; border-radius: 50%; object-fit: cover; border: 2px solid var(--gray-100); }
.org-node strong { font-size: 0.88rem; }
.org-node .role { font-size: 0.75rem; color: var(--alpet-blue); font-weight: 600; }
.org-node .dep { font-size: 0.72rem; color: var(--text-muted); }
.org-node.ceo { border-top-color: var(--alpet-green); background: linear-gradient(180deg, var(--alpet-green-light), #fff); }
.org-node.ceo .role { color: var(--alpet-green-dark); }
.org-node.dir { border-top-color: var(--alpet-orange); }
.org-node.dir .role { color: #cc6a10; }
.org-legend { display: flex; gap: 1.125rem; flex-wrap: wrap; margin-bottom: 0.5rem; font-size: 0.82rem; }
.org-legend span { display: flex; align-items: center; gap: 0.4375rem; }
.org-legend i { width: 0.875rem; height: 0.875rem; border-radius: 0.25rem; display: inline-block; }
.org-node.dim { opacity: 0.32; filter: grayscale(0.7); }
.org-node.hit { border-color: var(--alpet-blue); box-shadow: 0 0 0 3px var(--alpet-blue-light), var(--shadow); transform: translateY(-2px); }
.org-node.hit.ceo { border-color: var(--alpet-green); box-shadow: 0 0 0 3px var(--alpet-green-light), var(--shadow); }
.org-node.hit.dir { border-color: var(--alpet-orange); box-shadow: 0 0 0 3px var(--alpet-orange-light), var(--shadow); }
.org-empty { text-align: center; padding: 2.5rem 1.25rem; color: var(--text-muted); }
.org-empty .material-symbols-rounded { font-size: 2.75rem; opacity: 0.5; }
.org-empty p { margin-top: 0.5rem; font-size: 0.9rem; }
.org-node .dep { background: var(--gray-100); padding: 2px 0.5625rem; border-radius: 1.25rem; margin-top: 2px; }

/* --- Responsive --- */
@media (max-width: 980px) {
  .doc-layout, .detail-grid, .cal-layout, .feed-layout, .content-layout { grid-template-columns: 1fr; }
  .form-row { grid-template-columns: 1fr; }
}

/* ============ MODERN FOOTER (tüm sayfalar) ============ */
.site-foot { margin-top: 2.75rem; background: linear-gradient(120deg, #0b2540, #123a63 60%, var(--alpet-blue) 150%); color: rgba(255,255,255,0.82); }
.site-foot .foot-top { display: grid; grid-template-columns: 1.6fr 1fr 1fr 1.2fr; gap: 2.125rem; padding: 2.5rem 0 1.875rem; }
.site-foot .foot-brand .fb-logo { display: flex; align-items: center; gap: 0.625rem; font-family: var(--font-display); font-weight: 700; font-size: 1.25rem; color: #fff; }
.site-foot .foot-brand .fb-logo img { height: 2.125rem; }
.site-foot .foot-brand .fb-logo b { color: var(--alpet-green); }
.site-foot .foot-brand p { font-size: 0.84rem; line-height: 1.6; margin-top: 0.75rem; max-width: 18.75rem; }
.site-foot .foot-social { display: flex; gap: 0.625rem; margin-top: 1rem; }
.site-foot .foot-social a { width: 2.375rem; height: 2.375rem; border-radius: 0.6875rem; display: grid; place-items: center; background: rgba(255,255,255,0.08); color: #fff; transition: all var(--transition); }
.site-foot .foot-social a:hover { background: var(--alpet-green); transform: translateY(-2px); }
.site-foot .foot-col h4 { color: #fff; font-size: 0.82rem; text-transform: uppercase; letter-spacing: 0.0375rem; margin-bottom: 0.9375rem; }
.site-foot .foot-col a { display: block; font-size: 0.86rem; color: rgba(255,255,255,0.78); padding: 0.375rem 0; transition: color var(--transition); }
.site-foot .foot-col a:hover { color: var(--alpet-green); }
.site-foot .foot-contact { list-style: none; margin: 0; padding: 0; }
.site-foot .foot-contact li { display: flex; align-items: flex-start; gap: 0.625rem; font-size: 0.86rem; padding: 0.375rem 0; }
.site-foot .foot-contact li .material-symbols-rounded { font-size: 1.1875rem; color: var(--alpet-green); flex-shrink: 0; }
.site-foot .foot-bottom { border-top: 1px solid rgba(255,255,255,0.12); padding: 1rem 0; display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 0.625rem; font-size: 0.8rem; }
.site-foot .foot-bottom .fb-links { display: flex; gap: 1.125rem; flex-wrap: wrap; }
.site-foot .foot-bottom .fb-links a { color: rgba(255,255,255,0.7); }
.site-foot .foot-bottom .fb-links a:hover { color: #fff; }
@media (max-width: 900px) { .site-foot .foot-top { grid-template-columns: 1fr 1fr; gap: 1.75rem; } }
@media (max-width: 560px) { .site-foot .foot-top { grid-template-columns: 1fr; } .site-foot .foot-bottom { justify-content: center; text-align: center; } }


/* =====================================================================
   SAYFA-ÖZEL STİLLER — eski css/inline/*.css dosyalarından birleştirildi.
   (datepicker & num-list tek kanonik sürüme indirildi; teminat ce-grid→tm-grid)
   ===================================================================== */
/* ===== cari-ekstre.css ===== */
.account-chip { display: flex; align-items: center; gap: 0.6875rem; padding: 0.3125rem 0.75rem 0.3125rem 0.3125rem; border: 1px solid var(--border); border-radius: 2.5rem; background: var(--white); cursor: pointer; transition: all var(--transition); }
.account-chip:hover { box-shadow: var(--shadow-sm); border-color: var(--alpet-blue); }
.account-chip .ac-txt { text-align: left; line-height: 1.25; min-width: 0; }
.account-chip .ac-txt strong { display: flex; align-items: center; gap: 0.4375rem; font-size: 0.86rem; color: var(--gray-800); }
.account-chip .ac-firm { display: flex; align-items: center; gap: 0.25rem; font-size: 0.74rem; color: var(--text-muted); margin-top: 2px; }
.account-chip .ac-firm .material-symbols-rounded { font-size: 0.9375rem; }
.account-chip .ac-firm span[data-firm-name] { max-width: 9.375rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.account-chip .ac-chev { color: var(--gray-500); font-size: 1.25rem; flex-shrink: 0; transition: transform var(--transition); }
@media (max-width: 980px) { .account-chip .ac-txt { display: none; } .account-chip .ac-chev { display: none; } }
.account-menu { position: relative; }
.account-menu.open .account-chip { border-color: var(--alpet-blue); box-shadow: var(--shadow-sm); }
.account-menu.open .ac-chev { transform: rotate(180deg); }
.account-dropdown { position: absolute; top: calc(100% + 0.625rem); right: 0; min-width: 16.875rem; background: #fff; border: 1px solid var(--border); border-radius: 0.875rem; box-shadow: var(--shadow-lg); padding: 0.5rem; z-index: 130; opacity: 0; visibility: hidden; transform: translateY(-0.5rem); transition: all var(--transition); }
.account-menu.open .account-dropdown { opacity: 1; visibility: visible; transform: none; }
.account-dropdown::before { content: ""; position: absolute; top: -0.3125rem; right: 1.625rem; width: 0.75rem; height: 0.75rem; background: #fff; border-left: 1px solid var(--border); border-top: 1px solid var(--border); transform: rotate(45deg); }
.account-dropdown .ad-profile { display: flex; align-items: center; gap: 0.75rem; padding: 0.625rem 0.625rem 0.75rem; border-bottom: 1px solid var(--gray-100); margin-bottom: 0.375rem; }
.account-dropdown .ad-info { line-height: 1.3; min-width: 0; }
.account-dropdown .ad-info strong { display: block; font-size: 0.92rem; }
.account-dropdown .ad-info span { font-size: 0.76rem; color: var(--text-muted); }
.account-dropdown .ad-list { list-style: none; margin: 0; padding: 0; }
.account-dropdown .ad-list a { display: flex; align-items: center; gap: 0.6875rem; padding: 0.625rem 0.75rem; border-radius: 0.5625rem; color: var(--gray-700); font-size: 0.9rem; font-weight: 500; }
.account-dropdown .ad-list a:hover { background: var(--alpet-blue-light); color: var(--alpet-blue); }
.account-dropdown .ad-list a .material-symbols-rounded { font-size: 1.1875rem; color: var(--alpet-blue); }
.account-dropdown .ad-list a.logout, .account-dropdown .ad-list a.logout .material-symbols-rounded { color: #d64545; }
.account-dropdown .ad-list a.logout:hover { background: #fdecec; }
.account-dropdown .ad-div { height: 1px; background: var(--gray-100); margin: 0.375rem 0.25rem; }
.firm-item { display: flex; align-items: center; gap: 0.75rem; padding: 0.8125rem 0.875rem; border: 0.09375rem solid var(--border); border-radius: 0.75rem; cursor: pointer; margin-bottom: 0.625rem; transition: all var(--transition); }
.firm-item:hover, .firm-item.active { border-color: var(--alpet-blue); background: var(--alpet-blue-light); }
.firm-item .fi-ico { width: 2.625rem; height: 2.625rem; border-radius: 0.6875rem; background: #fff; border: 1px solid var(--border); color: var(--alpet-blue); display: grid; place-items: center; flex-shrink: 0; }
.firm-item .fi-info { flex: 1; min-width: 0; line-height: 1.3; }
.firm-item .fi-info strong { font-size: 0.92rem; }
.firm-item .fi-info span { font-size: 0.76rem; color: var(--text-muted); }
.firm-item .fi-check { color: var(--alpet-blue); opacity: 0; }
.firm-item.active .fi-check { opacity: 1; }
.ce-kpis { display: grid; grid-template-columns: repeat(4, 1fr); gap: 1rem; margin-bottom: 1.375rem; }
.ce-kpi { display: flex; align-items: center; gap: 0.875rem; background: #fff; border: 1px solid var(--border); border-radius: var(--radius); box-shadow: var(--shadow-sm); padding: 1rem 1.125rem; position: relative; overflow: hidden; }
.ce-kpi::before { content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: 0.25rem; background: var(--alpet-blue); }
.ce-kpi.green::before { background: var(--alpet-green); }
.ce-kpi.red::before { background: #d64545; }
.ce-kpi.orange::before { background: var(--alpet-orange); }
.ce-kpi .k-ic { width: 2.875rem; height: 2.875rem; border-radius: 0.8125rem; display: grid; place-items: center; background: var(--alpet-blue-light); color: var(--alpet-blue); flex-shrink: 0; }
.ce-kpi.green .k-ic { background: var(--alpet-green-light); color: var(--alpet-green-dark); }
.ce-kpi.red .k-ic { background: #fdecec; color: #d64545; }
.ce-kpi.orange .k-ic { background: var(--alpet-orange-light); color: #cc6a10; }
.ce-kpi .k-ic .material-symbols-rounded { font-size: 1.5625rem; }
.ce-kpi .k-lbl { font-size: 0.76rem; color: var(--text-muted); text-transform: uppercase; letter-spacing: 0.01875rem; }
.ce-kpi .k-val { font-family: var(--font-display); font-size: 1.28rem; font-weight: 800; line-height: 1.15; margin-top: 2px; font-variant-numeric: tabular-nums; }
@media (max-width: 900px) { .ce-kpis { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 500px) { .ce-kpis { grid-template-columns: 1fr; } }
.ce-filter { background: #fff; border: 1px solid var(--border); border-radius: var(--radius); box-shadow: var(--shadow-sm); padding: 1.125rem 1.25rem; margin-bottom: 1.375rem; }
.ce-grid { display: grid; grid-template-columns: 1.1fr 1.2fr 1.2fr auto; gap: 1rem; align-items: end; }
@media (max-width: 1040px) { .ce-grid { grid-template-columns: 1fr 1fr; } }
@media (max-width: 560px) { .ce-grid { grid-template-columns: 1fr; } }
.ce-field { display: flex; flex-direction: column; gap: 0.375rem; min-width: 0; }
.ce-field > label { font-size: 0.74rem; font-weight: 600; color: var(--text-muted); text-transform: uppercase; letter-spacing: 0.01875rem; }
.ce-search { position: relative; }
.ce-search .material-symbols-rounded { position: absolute; left: 0.75rem; top: 50%; transform: translateY(-50%); font-size: 1.1875rem; color: var(--gray-500); pointer-events: none; }
.ce-search input { height: 2.75rem; width: 100%; padding: 0 0.75rem 0 2.375rem; border: 1px solid var(--border); border-radius: 0.625rem; background: var(--gray-50); font-size: 0.9rem; transition: all var(--transition); }
.ce-search input:focus { outline: none; background: #fff; border-color: var(--alpet-blue); box-shadow: 0 0 0 3px var(--alpet-blue-light); }
.ce-actions-row { display: flex; align-items: center; justify-content: space-between; gap: 0.875rem; margin-top: 1rem; flex-wrap: wrap; }
.switch { display: inline-flex; align-items: center; gap: 0.625rem; cursor: pointer; user-select: none; font-size: 0.88rem; font-weight: 600; color: var(--gray-700); }
.switch input { display: none; }
.switch .sw-track { width: 2.75rem; height: 1.5625rem; border-radius: 2.5rem; background: var(--gray-300); position: relative; transition: background var(--transition); flex-shrink: 0; }
.switch .sw-track::after { content: ""; position: absolute; top: 0.1875rem; left: 0.1875rem; width: 1.1875rem; height: 1.1875rem; border-radius: 50%; background: #fff; box-shadow: 0 1px 3px rgba(0,0,0,0.25); transition: transform var(--transition); }
.switch input:checked + .sw-track { background: var(--alpet-green); }
.switch input:checked + .sw-track::after { transform: translateX(1.1875rem); }
.ce-btns { display: flex; gap: 0.625rem; flex-wrap: wrap; }
.btn-soft { background: var(--gray-100); color: var(--gray-700); }
.btn-soft:hover { background: var(--gray-200); color: var(--gray-800); }
.ce-listhead { display: flex; align-items: center; justify-content: space-between; gap: 0.75rem; margin-bottom: 0.875rem; flex-wrap: wrap; }
.ce-listhead .lh-count { font-size: 0.88rem; color: var(--text-muted); }
.ce-listhead .lh-count b { color: var(--gray-800); }
.ce-legend { display: flex; align-items: center; gap: 1rem; flex-wrap: wrap; font-size: 0.78rem; color: var(--text-muted); }
.ce-legend .lg { display: inline-flex; align-items: center; gap: 0.375rem; }
.ce-legend .lg .dot { width: 0.5625rem; height: 0.5625rem; border-radius: 50%; }
.ce-legend .lg .dot.open { background: #d64545; }
.ce-legend .lg .dot.paid { background: var(--alpet-green); }
.ce-scroll { overflow-x: auto; }
table.extre { min-width: 62.5rem; }
table.extre td { vertical-align: middle; }
table.extre tr.open-item td:first-child { box-shadow: inset 3px 0 0 #d64545; }
table.extre .cell-doc .doc-ref { font-family: var(--font-display); font-weight: 700; color: var(--alpet-blue); font-size: 0.9rem; text-decoration: none; }
table.extre .cell-doc .doc-ref:hover { text-decoration: underline; }
table.extre .cell-doc .doc-sub { display: flex; align-items: center; gap: 0.4375rem; margin-top: 0.25rem; }
table.extre .doc-type { font-size: 0.68rem; font-weight: 700; padding: 2px 0.5625rem; border-radius: 1.25rem; text-transform: none; letter-spacing: 0; }
.doc-type.fatura { background: var(--alpet-blue-light); color: var(--alpet-blue); }
.doc-type.virman { background: #eae6fb; color: #6b4de0; }
.doc-type.tahsilat { background: var(--alpet-green-light); color: var(--alpet-green-dark); }
table.extre .cell-doc .doc-mus { font-size: 0.72rem; color: var(--text-muted); }
table.extre .cell-vade .v-date { font-weight: 600; font-size: 0.86rem; }
table.extre .cell-vade .v-gun { display: inline-block; margin-top: 0.1875rem; font-size: 0.7rem; font-weight: 600; color: var(--gray-600); background: var(--gray-100); border-radius: 1.25rem; padding: 1px 0.5rem; }
table.extre .cell-pay .p-biz { font-size: 0.86rem; }
table.extre .cell-pay .p-bank { font-size: 0.73rem; color: var(--text-muted); margin-top: 2px; }
table.extre .num { text-align: right; font-variant-numeric: tabular-nums; white-space: nowrap; }
table.extre .num.borc { color: var(--gray-900); font-weight: 600; }
table.extre .num.alacak { color: var(--alpet-green-dark); font-weight: 600; }
table.extre .num.bakiye { font-family: var(--font-display); font-weight: 800; color: var(--alpet-blue); }
table.extre .num.zero { color: var(--gray-300); font-weight: 400; }
table.extre .cell-metin { font-size: 0.76rem; color: var(--text-muted); line-height: 1.4; max-width: 13.125rem; }
table.extre .kayit-date { font-size: 0.86rem; white-space: nowrap; }
.ce-empty { display: flex; flex-direction: column; align-items: center; gap: 0.625rem; padding: 3rem 1.25rem; text-align: center; }
.ce-empty[hidden] { display: none; }
.ce-empty .material-symbols-rounded { font-size: 2.875rem; color: var(--gray-300); }
.ce-empty p { color: var(--text-muted); font-size: 0.92rem; }
@media (max-width: 820px) {
      .ce-scroll { overflow-x: visible; }
      table.extre { min-width: 0; }
      table.extre td { text-align: right; }
      table.extre .cell-doc, table.extre .cell-metin { text-align: left; }
      table.extre .cell-metin { max-width: none; }
      table.extre tr.open-item td:first-child { box-shadow: none; }
      table.extre tr.open-item { border-left: 0.1875rem solid #d64545; }
    }

/* ===== dogrulama.css ===== */
.otp-panel { background: linear-gradient(180deg, var(--gray-50), #fff); border: 1px solid var(--border); border-radius: 1.125rem; padding: 1.375rem 1.25rem; box-shadow: var(--shadow-sm); }
.otp-hint { font-size: 0.82rem; color: var(--text-muted); font-weight: 600; text-transform: uppercase; letter-spacing: 0.025rem; margin-bottom: 0.625rem; }
.otp-group { display: flex; gap: 0.625rem; margin: 0 0 0.5rem; }
.otp-input { flex: 1; min-width: 0; height: 3.875rem; text-align: center; font-family: var(--font-display); font-size: 1.6rem; font-weight: 700; color: var(--gray-900); border: 0.09375rem solid var(--border); border-radius: 0.75rem; background: #fff; outline: none; box-shadow: var(--shadow-sm); transition: border var(--transition), box-shadow var(--transition); -moz-appearance: textfield; appearance: textfield; }
.otp-input::-webkit-outer-spin-button, .otp-input::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }
.otp-input:focus { border-color: var(--alpet-blue); box-shadow: 0 0 0 3px var(--alpet-blue-light); }
.otp-input.filled { border-color: var(--alpet-blue); background: var(--alpet-blue-light); }
.otp-input.error { border-color: #d64545; box-shadow: 0 0 0 3px #fbeaea; animation: shake 0.35s; }
@keyframes shake { 0%,100%{transform:translateX(0)} 25%{transform:translateX(-0.375rem)} 75%{transform:translateX(0.375rem)} }
.otp-err { color: #d64545; font-size: 0.82rem; font-weight: 600; min-height: 1.25rem; margin-bottom: 0.375rem; display: none; }
.otp-err.show { display: block; }
.otp-resend { text-align: center; font-size: 0.86rem; color: var(--text-muted); margin-top: 1.25rem; }
.otp-resend b { font-variant-numeric: tabular-nums; color: var(--gray-700); }
.otp-resend button { border: none; background: none; font: inherit; font-weight: 600; color: var(--alpet-blue); cursor: pointer; padding: 0; }
.otp-resend button:disabled { color: var(--gray-300); cursor: default; }
.otp-resend button:not(:disabled):hover { text-decoration: underline; }
.sent-to { display: flex; width: 100%; align-items: center; justify-content: center; gap: 0.5625rem; background: var(--alpet-green-light); color: var(--alpet-green-dark); font-weight: 600; font-size: 1.05rem; letter-spacing: 0.025rem; padding: 0.8125rem 1rem; border-radius: 0.75rem; margin-bottom: 1.5rem; }
.sent-to .material-symbols-rounded { font-size: 1.25rem; }
.auth-back { display: flex; align-items: center; justify-content: center; gap: 0.4375rem; width: 100%; margin-top: 0.875rem; padding: 0.75rem; font-size: 0.92rem; font-weight: 600; color: var(--gray-700); border: 0.09375rem solid var(--border); border-radius: 0.625rem; transition: all var(--transition); }
.auth-back:hover { color: var(--alpet-blue); border-color: var(--alpet-blue); background: var(--alpet-blue-light); }
.auth-back .material-symbols-rounded { font-size: 1.25rem; }
.auth-card .ac-logo { height: 3.25rem; width: auto; display: block; margin: 0 0 1.75rem; }

/* ===== duyuru-detay.css ===== */
.dd-top { display: flex; align-items: center; justify-content: space-between; gap: 1rem; margin-bottom: 1.25rem; flex-wrap: wrap; }
.dd-back { display: inline-flex; align-items: center; gap: 0.4375rem; font-size: 0.9rem; font-weight: 600; color: var(--text-muted); }
.dd-back:hover { color: var(--alpet-blue); }
.dd-back .material-symbols-rounded { font-size: 1.25rem; }
.dd-share { display: flex; align-items: center; gap: 0.5rem; }
.dd-share .sh-btn { width: 2.5rem; height: 2.5rem; border-radius: 0.75rem; border: 1px solid var(--border); background: #fff; color: var(--gray-700); display: grid; place-items: center; cursor: pointer; transition: all var(--transition); }
.dd-share .sh-btn:hover { border-color: var(--alpet-blue); color: var(--alpet-blue); background: var(--alpet-blue-light); }
.dd-grid { display: grid; grid-template-columns: 1fr 20rem; gap: 1.5rem; align-items: start; }
@media (max-width: 900px) { .dd-grid { grid-template-columns: 1fr; } }
.article-card { background: #fff; border: 1px solid var(--border); border-radius: 1.25rem; box-shadow: var(--shadow-sm); overflow: hidden; }
.dd-cover { position: relative; height: 17rem; background: linear-gradient(130deg, var(--alpet-blue) 0%, var(--alpet-blue-2) 55%, var(--alpet-green) 130%); display: flex; align-items: flex-end; overflow: hidden; }
.dd-cover::after { content: ""; position: absolute; right: -3rem; top: -4rem; width: 16rem; height: 16rem; border-radius: 50%; background: rgba(255,255,255,0.1); }
.dd-cover .cov-ic { position: absolute; right: 1.75rem; top: 1.5rem; color: rgba(255,255,255,0.9); }
.dd-cover .cov-ic .material-symbols-rounded { font-size: 4.5rem; }
.dd-cover .cov-grad { position: absolute; inset: 0; background: linear-gradient(transparent, rgba(3,20,45,0.55)); }
.dd-cover .cov-inner { position: relative; z-index: 1; padding: 1.75rem 2rem; color: #fff; }
.dd-cat { display: inline-flex; align-items: center; gap: 0.375rem; font-size: 0.72rem; font-weight: 700; background: var(--alpet-green); color: #fff; padding: 0.25rem 0.75rem; border-radius: 1.25rem; margin-bottom: 0.75rem; }
.dd-cat.blue { background: var(--alpet-blue-2); }
.dd-title { font-family: var(--font-display); font-size: 1.75rem; line-height: 1.2; color: #fff; text-shadow: 0 1px 12px rgba(0,0,0,0.25); }
@media (max-width: 560px) { .dd-title { font-size: 1.35rem; } .dd-cover { height: 14rem; } }
.dd-meta { display: flex; align-items: center; gap: 1.25rem; flex-wrap: wrap; padding: 1rem 2rem; border-bottom: 1px solid var(--gray-100); }
.dd-meta .mi { display: inline-flex; align-items: center; gap: 0.4375rem; font-size: 0.84rem; color: var(--text-muted); }
.dd-meta .mi .material-symbols-rounded { font-size: 1.125rem; color: var(--alpet-blue); }
.dd-meta .mi b { color: var(--gray-800); font-weight: 600; }
.dd-content { padding: 1.75rem 2rem 2rem; font-size: 0.98rem; line-height: 1.85; color: var(--gray-700); }
.dd-content p { margin-bottom: 1.1rem; }
.dd-content h2 { font-family: var(--font-display); font-size: 1.2rem; color: var(--gray-900); margin: 1.75rem 0 0.75rem; }
.dd-content ul { margin: 0 0 1.1rem 1.25rem; display: flex; flex-direction: column; gap: 0.5rem; }
.dd-content ul li { position: relative; padding-left: 0.5rem; }
.dd-content ul li::marker { color: var(--alpet-green); }
.dd-callout { display: flex; gap: 0.875rem; align-items: flex-start; background: var(--alpet-blue-light); border-left: 4px solid var(--alpet-blue); border-radius: 0.75rem; padding: 1rem 1.125rem; margin: 1.25rem 0; }
.dd-callout .material-symbols-rounded { color: var(--alpet-blue); flex-shrink: 0; }
.dd-callout p { margin: 0; font-size: 0.9rem; color: var(--gray-800); }
.dd-tags { display: flex; flex-wrap: wrap; gap: 0.5rem; margin-top: 1.5rem; padding-top: 1.25rem; border-top: 1px solid var(--gray-100); }
.dd-tag { font-size: 0.76rem; font-weight: 600; color: var(--gray-700); background: var(--gray-100); padding: 0.3125rem 0.75rem; border-radius: 1.25rem; }
.side-card { background: #fff; border: 1px solid var(--border); border-radius: 1rem; box-shadow: var(--shadow-sm); overflow: hidden; margin-bottom: 1.25rem; }
.side-card .sc-head { display: flex; align-items: center; gap: 0.625rem; padding: 0.9375rem 1.125rem; border-bottom: 1px solid var(--gray-100); font-family: var(--font-display); font-weight: 600; font-size: 0.98rem; }
.side-card .sc-head .material-symbols-rounded { color: var(--alpet-blue); background: var(--alpet-blue-light); width: 2rem; height: 2rem; border-radius: 0.625rem; display: grid; place-items: center; font-size: 1.125rem; }
.rel-item { display: flex; gap: 0.75rem; padding: 0.75rem 1.125rem; border-bottom: 1px solid var(--gray-100); cursor: pointer; transition: background var(--transition); }
.rel-item:last-child { border-bottom: none; }
.rel-item:hover { background: var(--gray-50); }
.rel-item .rel-th { width: 3rem; height: 3rem; border-radius: 0.625rem; flex-shrink: 0; display: grid; place-items: center; color: #fff; }
.rel-item .rel-th.blue { background: linear-gradient(135deg, var(--alpet-blue), var(--alpet-blue-2)); }
.rel-item .rel-th.green { background: linear-gradient(135deg, var(--alpet-green), var(--alpet-green-dark)); }
.rel-item .rel-th.orange { background: linear-gradient(135deg, #ffa94d, var(--alpet-orange)); }
.rel-item .rel-tx strong { font-size: 0.86rem; display: block; line-height: 1.3; }
.rel-item .rel-tx span { font-size: 0.74rem; color: var(--text-muted); margin-top: 0.25rem; display: inline-flex; align-items: center; gap: 0.25rem; }
.rel-item .rel-tx span .material-symbols-rounded { font-size: 0.85rem; }
.info-box { padding: 1.25rem; background: linear-gradient(135deg, var(--alpet-blue), var(--alpet-blue-dark)); color: #fff; }
.info-box h4 { font-family: var(--font-display); font-size: 1rem; margin-bottom: 0.375rem; }
.info-box p { font-size: 0.84rem; opacity: 0.92; margin-bottom: 0.875rem; line-height: 1.5; }
.info-box .btn { background: #fff; color: var(--alpet-blue); font-weight: 700; }
.info-box .btn:hover { background: var(--alpet-green); color: #fff; }

/* ===== e-fatura.css ===== */
.ef-kpis { display: grid; grid-template-columns: repeat(4, 1fr); gap: 1rem; margin-bottom: 1.5rem; }
.ef-kpi { display: flex; align-items: center; justify-content: space-between; gap: 0.875rem; background: #fff; border: 0.09375rem solid var(--border); border-radius: var(--radius); box-shadow: var(--shadow-sm); padding: 1.125rem 1.25rem; cursor: pointer; position: relative; overflow: hidden; transition: all var(--transition); }
.ef-kpi::before { content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: 0.25rem; background: var(--alpet-blue); opacity: 0; transition: opacity var(--transition); }
.ef-kpi:hover { box-shadow: var(--shadow); transform: translateY(-2px); }
.ef-kpi .ef-txt { min-width: 0; }
.ef-kpi .ef-lbl { font-size: 0.74rem; color: var(--text-muted); text-transform: uppercase; letter-spacing: 0.01875rem; font-weight: 600; }
.ef-kpi .ef-num { font-family: var(--font-display); font-size: 1.7rem; font-weight: 800; line-height: 1.1; margin-top: 0.25rem; color: var(--gray-900); font-variant-numeric: tabular-nums; }
.ef-kpi .ef-amt { display: inline-flex; align-items: center; gap: 0.25rem; font-size: 0.82rem; font-weight: 600; margin-top: 0.375rem; font-variant-numeric: tabular-nums; }
.ef-kpi .ef-amt .material-symbols-rounded { font-size: 1rem; }
.ef-kpi .ef-circle { width: 3.625rem; height: 3.625rem; border-radius: 50%; display: grid; place-items: center; flex-shrink: 0; }
.ef-kpi .ef-circle .material-symbols-rounded { font-size: 1.875rem; }
.ef-kpi.total::before { background: var(--alpet-blue); }
.ef-kpi.total .ef-amt { color: var(--alpet-blue); }
.ef-kpi.total .ef-circle { background: var(--alpet-blue-light); color: var(--alpet-blue); }
.ef-kpi.done::before { background: var(--alpet-green); }
.ef-kpi.done .ef-amt { color: var(--alpet-green-dark); }
.ef-kpi.done .ef-circle { background: var(--alpet-green-light); color: var(--alpet-green-dark); }
.ef-kpi.upcoming::before { background: var(--alpet-orange); }
.ef-kpi.upcoming .ef-amt { color: #cc6a10; }
.ef-kpi.upcoming .ef-circle { background: var(--alpet-orange-light); color: #cc6a10; }
.ef-kpi.overdue::before { background: #d64545; }
.ef-kpi.overdue .ef-amt { color: #d64545; }
.ef-kpi.overdue .ef-circle { background: #fdecec; color: #d64545; }
.ef-kpi.active::before { opacity: 1; }
.ef-kpi.total.active { border-color: var(--alpet-blue); box-shadow: 0 0 0 3px var(--alpet-blue-light); }
.ef-kpi.done.active { border-color: var(--alpet-green); box-shadow: 0 0 0 3px var(--alpet-green-light); }
.ef-kpi.upcoming.active { border-color: var(--alpet-orange); box-shadow: 0 0 0 3px var(--alpet-orange-light); }
.ef-kpi.overdue.active { border-color: #d64545; box-shadow: 0 0 0 3px #fdecec; }
@media (max-width: 900px) { .ef-kpis { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 500px) { .ef-kpis { grid-template-columns: 1fr; } }
.ef-listhead { display: flex; align-items: center; gap: 1rem; margin-bottom: 1rem; flex-wrap: wrap; }
.ef-listhead h2 { font-family: var(--font-display); font-size: 1.15rem; font-weight: 700; color: var(--gray-900); display: flex; align-items: center; gap: 0.5625rem; }
.ef-listhead h2 .material-symbols-rounded { color: var(--alpet-blue); font-size: 1.375rem; }
.ef-tools { margin-left: auto; display: flex; align-items: center; gap: 0.875rem; flex-wrap: wrap; }
.ef-listhead .lh-search { width: 18.75rem; max-width: 100%; }
.ef-listhead .lh-count { font-size: 0.88rem; color: var(--text-muted); white-space: nowrap; }
.ef-listhead .lh-count b { color: var(--gray-800); font-weight: 700; }
@media (max-width: 640px) { .ef-tools { margin-left: 0; width: 100%; } .ef-listhead .lh-search { flex: 1; width: auto; min-width: 0; } }
.ef-scroll { overflow-x: auto; }
table.efatura { min-width: 55rem; }
table.efatura td { vertical-align: middle; }
table.efatura .cell-no { display: inline-flex; align-items: center; gap: 0.5625rem; }
table.efatura .cell-no .no-ic { width: 1.875rem; height: 1.875rem; border-radius: 0.5rem; background: var(--alpet-blue-light); color: var(--alpet-blue); display: grid; place-items: center; flex-shrink: 0; }
table.efatura .cell-no .no-ic .material-symbols-rounded { font-size: 1.125rem; }
table.efatura .cell-no .no-ref { font-family: var(--font-display); font-weight: 700; color: var(--alpet-blue); font-size: 0.9rem; text-decoration: none; letter-spacing: 0.0125rem; }
table.efatura .cell-no .no-ref:hover { text-decoration: underline; }
table.efatura .num { text-align: right; font-variant-numeric: tabular-nums; white-space: nowrap; font-weight: 600; color: var(--gray-900); }
table.efatura .num.kalan { color: var(--gray-300); font-weight: 400; }
table.efatura .num.kalan.has { color: #d64545; font-weight: 700; }
table.efatura .date { white-space: nowrap; font-size: 0.88rem; }
.ef-empty { display: flex; flex-direction: column; align-items: center; gap: 0.625rem; padding: 3rem 1.25rem; text-align: center; }
.ef-empty[hidden] { display: none; }
.ef-empty .material-symbols-rounded { font-size: 2.875rem; color: var(--gray-300); }
.ef-empty p { color: var(--text-muted); font-size: 0.92rem; }
@media (max-width: 820px) {
      .ef-scroll { overflow-x: visible; }
      table.efatura { min-width: 0; }
      table.efatura td { text-align: right; }
      table.efatura .num { text-align: right; }
      table.efatura td[data-label="Fatura No"] { text-align: left; }
      .ef-listhead .lh-search { max-width: none; }
    }

/* ===== iletisim.css ===== */
.ct-quick { display: grid; grid-template-columns: repeat(4, 1fr); gap: 1rem; margin-bottom: 1.375rem; }
@media (max-width: 900px) { .ct-quick { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 500px) { .ct-quick { grid-template-columns: 1fr; } }
.ct-card { display: flex; align-items: center; gap: 0.875rem; background: #fff; border: 1px solid var(--border); border-radius: var(--radius); box-shadow: var(--shadow-sm); padding: 1rem 1.125rem; transition: all var(--transition); color: inherit; }
.ct-card:hover { transform: translateY(-0.1875rem); box-shadow: var(--shadow); border-color: var(--alpet-blue); }
.ct-card .ct-ic { width: 3rem; height: 3rem; border-radius: 0.875rem; display: grid; place-items: center; background: var(--alpet-blue-light); color: var(--alpet-blue); flex-shrink: 0; }
.ct-card.green .ct-ic { background: var(--alpet-green-light); color: var(--alpet-green-dark); }
.ct-card.orange .ct-ic { background: var(--alpet-orange-light); color: #cc6a10; }
.ct-card.purple .ct-ic { background: #eae6fb; color: #6b4de0; }
.ct-card .ct-ic .material-symbols-rounded { font-size: 1.5625rem; }
.ct-card .ct-t .l { font-size: 0.74rem; color: var(--text-muted); text-transform: uppercase; letter-spacing: 0.01875rem; }
.ct-card .ct-t .v { font-family: var(--font-display); font-weight: 700; font-size: 1rem; margin-top: 2px; color: var(--gray-900); }
.ct-grid { display: grid; grid-template-columns: 1.4fr 1fr; gap: 1.25rem; align-items: stretch; }
@media (max-width: 900px) { .ct-grid { grid-template-columns: 1fr; } }
.ct-form-card { background: #fff; border: 1px solid var(--border); border-radius: var(--radius); box-shadow: var(--shadow-sm); overflow: hidden; }
.ct-fhead { padding: 1.125rem 1.375rem; border-bottom: 1px solid var(--gray-100); background: var(--gray-50); }
.ct-fhead h2 { font-family: var(--font-display); font-size: 1.12rem; display: flex; align-items: center; gap: 0.625rem; }
.ct-fhead h2 .material-symbols-rounded { color: var(--alpet-blue); }
.ct-fhead p { font-size: 0.82rem; color: var(--text-muted); margin-top: 0.1875rem; }
.ct-fbody { padding: 1.375rem; }
.ct-frow { display: grid; grid-template-columns: 1fr 1fr; gap: 0.875rem; }
@media (max-width: 520px) { .ct-frow { grid-template-columns: 1fr; } }
.ct-fg { margin-bottom: 0.875rem; }
.ct-fg label { display: block; font-size: 0.84rem; font-weight: 600; color: var(--gray-700); margin-bottom: 0.375rem; }
.ct-fg label .req { color: #d64545; }
.ct-fg .form-control, .ct-fg .select { height: 2.875rem; width: 100%; }
.ct-fg textarea.form-control { height: auto; min-height: 7.5rem; padding: 0.75rem 0.875rem; resize: vertical; font-family: inherit; }
.ct-input-ic { position: relative; }
.ct-input-ic > .material-symbols-rounded { position: absolute; left: 0.8125rem; top: 50%; transform: translateY(-50%); font-size: 1.25rem; color: var(--gray-400); pointer-events: none; }
.ct-input-ic .form-control, .ct-input-ic .select { padding-left: 2.625rem; }
.ct-agree { display: flex; align-items: flex-start; gap: 0.6875rem; margin: 0.25rem 0 1rem; cursor: pointer; }
.ct-agree input { display: none; }
.ct-agree .ag-box { width: 1.5rem; height: 1.5rem; border-radius: 0.4375rem; border: 2px solid var(--gray-300); display: grid; place-items: center; flex-shrink: 0; color: #fff; transition: all var(--transition); margin-top: 1px; }
.ct-agree .ag-box .material-symbols-rounded { font-size: 1rem; opacity: 0; }
.ct-agree input:checked + .ag-box { background: var(--alpet-green); border-color: var(--alpet-green); }
.ct-agree input:checked + .ag-box .material-symbols-rounded { opacity: 1; }
.ct-agree .ag-txt { font-size: 0.84rem; color: var(--gray-700); line-height: 1.5; }
.ct-agree .ag-txt a { color: var(--alpet-blue); font-weight: 600; }
.ct-submit { width: 100%; justify-content: center; padding: 0.875rem; font-size: 1rem; }
.ct-info { display: flex; flex-direction: column; gap: 1.125rem; }
.ct-info-card { background: #fff; border: 1px solid var(--border); border-radius: var(--radius); box-shadow: var(--shadow-sm); padding: 1.25rem; }
.ct-info-card h3 { font-family: var(--font-display); font-size: 1.02rem; display: flex; align-items: center; gap: 0.5625rem; margin-bottom: 1rem; }
.ct-info-card h3 .material-symbols-rounded { color: var(--alpet-blue); font-size: 1.3125rem; }
.ct-line { display: flex; align-items: flex-start; gap: 0.75rem; padding: 0.625rem 0; border-bottom: 1px solid var(--gray-100); }
.ct-line:last-child { border-bottom: none; padding-bottom: 0; }
.ct-line:first-child { padding-top: 0; }
.ct-line .cl-ic { width: 2.375rem; height: 2.375rem; border-radius: 0.6875rem; background: var(--alpet-blue-light); color: var(--alpet-blue); display: grid; place-items: center; flex-shrink: 0; }
.ct-line .cl-ic .material-symbols-rounded { font-size: 1.25rem; }
.ct-line .cl-t .l { font-size: 0.72rem; color: var(--text-muted); text-transform: uppercase; letter-spacing: 0.01875rem; }
.ct-line .cl-t .v { font-size: 0.9rem; font-weight: 600; color: var(--gray-900); line-height: 1.4; margin-top: 1px; }
.ct-line .cl-t .v a { color: var(--gray-900); }
.ct-line .cl-t .v a:hover { color: var(--alpet-blue); }
.ct-social { display: flex; gap: 0.625rem; margin-top: 0.25rem; }
.ct-social a { width: 2.625rem; height: 2.625rem; border-radius: 0.75rem; display: grid; place-items: center; background: var(--gray-50); border: 1px solid var(--border); color: var(--gray-600); transition: all var(--transition); }
.ct-social a:hover { background: var(--alpet-blue); color: #fff; border-color: var(--alpet-blue); transform: translateY(-2px); }
.ct-map-card { flex: 1; display: flex; }
.ct-map-card .ct-map { flex: 1; height: auto; }
.ct-map { border-radius: 0.875rem; overflow: hidden; border: 1px solid var(--border); position: relative; height: 12.5rem; min-height: 15rem; background: linear-gradient(115deg, var(--alpet-blue-light), #eef7ff 60%, var(--alpet-green-light)); display: grid; place-items: center; }
.ct-map::before { content: ""; position: absolute; inset: 0; background-image: linear-gradient(rgba(0,94,184,0.06) 1px, transparent 1px), linear-gradient(90deg, rgba(0,94,184,0.06) 1px, transparent 1px); background-size: 1.625rem 1.625rem; }
.ct-map .ct-pin { position: relative; z-index: 1; text-align: center; color: var(--alpet-blue); }
.ct-map .ct-pin .material-symbols-rounded { font-size: 2.75rem; filter: drop-shadow(0 0.375rem 0.625rem rgba(0,94,184,0.3)); }
.ct-map .ct-pin span.txt { display: block; font-weight: 700; font-size: 0.86rem; margin-top: 2px; }
.ct-map .ct-open { position: absolute; bottom: 0.75rem; right: 0.75rem; z-index: 1; background: #fff; border: 1px solid var(--border); border-radius: 0.625rem; padding: 0.5rem 0.8125rem; font-size: 0.8rem; font-weight: 600; color: var(--alpet-blue); display: inline-flex; align-items: center; gap: 0.375rem; box-shadow: var(--shadow-sm); }
.ct-map .ct-open .material-symbols-rounded { font-size: 1.0625rem; }

/* ===== index.css ===== */
.firm-switch { display: flex; align-items: center; gap: 0.625rem; padding: 0.375rem 0.75rem 0.375rem 0.625rem; border: 1px solid var(--border); border-radius: 2.5rem; background: #fff; cursor: pointer; transition: all var(--transition); }
.firm-switch:hover { border-color: var(--alpet-blue); box-shadow: var(--shadow-sm); }
.firm-switch .fs-ico { width: 2rem; height: 2rem; border-radius: 0.5625rem; background: var(--alpet-blue-light); color: var(--alpet-blue); display: grid; place-items: center; flex-shrink: 0; }
.firm-switch .fs-ico .material-symbols-rounded { font-size: 1.1875rem; }
.firm-switch .fs-txt { text-align: left; line-height: 1.2; }
.firm-switch .fs-txt strong { font-size: 0.85rem; display: block; max-width: 9.375rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.firm-switch .fs-txt span { font-size: 0.72rem; color: var(--text-muted); }
.firm-switch > .material-symbols-rounded { color: var(--gray-500); font-size: 1.25rem; }
@media (max-width: 980px) { .firm-switch .fs-txt { display: none; } }
.firm-item:hover { border-color: var(--alpet-blue); background: var(--alpet-blue-light); }
.firm-item.active { border-color: var(--alpet-blue); background: var(--alpet-blue-light); }
.firm-hero { grid-column: span 12; display: flex; align-items: center; gap: 1.625rem; flex-wrap: wrap; background: linear-gradient(120deg, var(--alpet-blue), #0a74d6 60%, var(--alpet-green) 155%); color: #fff; border-radius: var(--radius); padding: 1.375rem 1.625rem; box-shadow: var(--shadow); }
.firm-hero .fh-main { min-width: 12.5rem; }
.firm-hero .fh-code { display: inline-block; background: rgba(255,255,255,0.18); font-size: 0.72rem; font-weight: 600; padding: 0.25rem 0.75rem; border-radius: 1.25rem; margin-bottom: 0.5rem; }
.firm-hero .fh-main h2 { font-family: var(--font-display); font-size: 1.5rem; color: #fff; line-height: 1.1; }
.firm-hero .fh-loc { font-size: 0.82rem; opacity: 0.85; }
.firm-hero .fh-limits { display: flex; gap: 1.625rem; flex-wrap: wrap; margin-left: auto; }
.firm-hero .fh-item .k { font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.025rem; opacity: 0.8; }
.firm-hero .fh-item .v { font-family: var(--font-display); font-size: 1.25rem; font-weight: 700; margin-top: 2px; }
.firm-hero .fh-item .v.neg { color: #ffd0d0; }
.firm-hero .fh-cta { display: flex; align-items: center; gap: 0.5rem; background: #fff; color: var(--alpet-blue); font-weight: 700; padding: 0.75rem 1.25rem; border-radius: 0.625rem; white-space: nowrap; }
.firm-hero .fh-cta:hover { background: var(--alpet-green); color: #fff; }
.sc-big { display: grid; grid-template-columns: repeat(5, 1fr); gap: 0.875rem; }
.sc-big .sc { display: flex; flex-direction: column; align-items: flex-start; gap: 0.625rem; padding: 1.125rem; border: 1px solid var(--border); border-radius: var(--radius); background: #fff; box-shadow: var(--shadow-sm); cursor: pointer; transition: all var(--transition); color: inherit; }
.sc-big .sc:hover { transform: translateY(-0.1875rem); box-shadow: var(--shadow); border-color: var(--alpet-blue); }
.sc-big .sc .sc-ic { width: 3rem; height: 3rem; border-radius: 0.8125rem; display: grid; place-items: center; background: var(--alpet-blue-light); color: var(--alpet-blue); }
.sc-big .sc .sc-ic .material-symbols-rounded { font-size: 1.625rem; }
.sc-big .sc.green .sc-ic { background: var(--alpet-green-light); color: var(--alpet-green-dark); }
.sc-big .sc.orange .sc-ic { background: var(--alpet-orange-light); color: #cc6a10; }
.sc-big .sc strong { font-size: 0.95rem; }
.sc-big .sc span { font-size: 0.78rem; color: var(--text-muted); }
@media (max-width: 1100px) { .sc-big { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 620px) { .sc-big { grid-template-columns: repeat(2, 1fr); } }
.tk-row { margin-bottom: 0.9375rem; }
.tk-row:last-child { margin-bottom: 0; }
.tk-top { display: flex; justify-content: space-between; align-items: center; font-size: 0.86rem; margin-bottom: 0.375rem; }
.tk-top b { font-variant-numeric: tabular-nums; }
.tk-track { height: 0.5625rem; background: var(--gray-100); border-radius: 0.375rem; overflow: hidden; }
.tk-fill { height: 100%; border-radius: 0.375rem; }
.ds-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 0.75rem; }
.ds-item { border: 1px solid var(--border); border-radius: 0.75rem; padding: 0.75rem 0.875rem; background: var(--gray-50); }
.ds-item .l { font-size: 0.74rem; color: var(--text-muted); text-transform: uppercase; letter-spacing: 0.01875rem; }
.ds-item .n { font-family: var(--font-display); font-size: 1.2rem; font-weight: 700; margin-top: 0.1875rem; }
.ds-item .n small { font-size: 0.72rem; color: var(--text-muted); font-weight: 500; }
.ds-item.green .n { color: var(--alpet-green-dark); }
.pano-tile .pano-live { display: inline-flex; align-items: center; gap: 0.4rem; font-weight: 600; }
.pano-tile .live-dot { width: 0.5rem; height: 0.5rem; border-radius: 50%; background: var(--alpet-green); box-shadow: 0 0 0 0 rgba(91,191,33,0.6); animation: panoPulse 1.8s infinite; }
@keyframes panoPulse { 0% { box-shadow: 0 0 0 0 rgba(91,191,33,0.55); } 70% { box-shadow: 0 0 0 0.4rem rgba(91,191,33,0); } 100% { box-shadow: 0 0 0 0 rgba(91,191,33,0); } }
.pano { display: grid; grid-template-columns: 17.5rem 1fr; gap: 0.85rem; border-radius: 1.1rem; overflow: hidden; box-shadow: 0 1rem 2.25rem rgba(0,60,120,0.14); }
.pano-brand { position: relative; padding: 1.5rem 1.4rem; display: flex; flex-direction: column; gap: 1.15rem; background: linear-gradient(155deg, #1685d6 0%, var(--alpet-blue) 42%, var(--alpet-blue-dark, #005a9c) 100%); color: #fff; overflow: hidden; }
.pano-brand::before { content: ""; position: absolute; right: -4rem; bottom: -4.5rem; width: 13rem; height: 13rem; background: #fff; opacity: 0.07; clip-path: polygon(50% 0, 100% 100%, 0 100%); }
.pano-brand::after { content: ""; position: absolute; right: -2rem; bottom: -3.5rem; width: 11rem; height: 11rem; background: var(--alpet-green); opacity: 0.22; clip-path: polygon(50% 0, 100% 100%, 0 100%); }
.pb-brandhead { position: relative; z-index: 1; padding-bottom: 1rem; border-bottom: 1px solid rgba(255,255,255,0.22); }
.pano-logo { width: 9.5rem; max-width: 80%; height: auto; display: block; filter: drop-shadow(0 0.15rem 0.5rem rgba(0,0,0,0.25)); }
.pb-tag { display: block; margin-top: 0.6rem; font-size: 0.64rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.18em; color: rgba(255,255,255,0.75); }
.pano-bayi { position: relative; z-index: 1; display: flex; flex-direction: column; gap: 0.5rem; }
.pano-bayi .pb-name { font-family: var(--font-display); font-weight: 800; font-size: 1.28rem; line-height: 1.15; }
.pano-bayi .pb-code { display: inline-flex; align-items: center; gap: 0.3rem; align-self: flex-start; font-size: 0.76rem; font-weight: 700; background: rgba(255,255,255,0.18); border: 1px solid rgba(255,255,255,0.25); padding: 0.3rem 0.7rem; border-radius: 999px; backdrop-filter: blur(3px); letter-spacing: 0.02em; }
.pano-bayi .pb-code .material-symbols-rounded { font-size: 0.95rem; }
.pano-meta { position: relative; z-index: 1; margin-top: auto; display: flex; align-items: center; gap: 0.35rem; font-size: 0.72rem; opacity: 0.9; }
.pano-meta .material-symbols-rounded { font-size: 0.95rem; }
.pano-meta b { font-weight: 700; }
.pano-screen { position: relative; background: radial-gradient(120% 120% at 50% 0%, #16233a 0%, #0a1120 60%, #060a13 100%); border-radius: 0.85rem; padding: 0.6rem 1.25rem; display: flex; flex-direction: column; justify-content: center; gap: 0.35rem; box-shadow: inset 0 0 0 1px rgba(255,255,255,0.06), inset 0 0.75rem 2rem rgba(90,150,255,0.06), inset 0 0 2.5rem rgba(0,0,0,0.5); }
.pano-screen::before { content: ""; position: absolute; inset: 0.35rem; border-radius: 0.65rem; pointer-events: none; box-shadow: inset 0 0 0 1px rgba(255,255,255,0.04); }
.pp-row { display: flex; align-items: center; gap: 1rem; padding: 0.55rem 0.5rem; border-radius: 0.55rem; }
.pp-row + .pp-row { border-top: 1px solid rgba(255,255,255,0.06); }
.pp-label { flex: 0 0 auto; min-width: 8.5rem; display: flex; flex-direction: column; gap: 0.1rem; border-left: 4px solid var(--fuel); padding-left: 0.7rem; }
.pp-label b { color: #fff; font-family: var(--font-display); font-weight: 700; font-size: 0.98rem; letter-spacing: 0.02em; line-height: 1.1; }
.pp-label small { color: rgba(255,255,255,0.55); font-size: 0.66rem; font-weight: 600; text-transform: uppercase; letter-spacing: 0.03em; }
.pp-price { margin-left: auto; display: flex; align-items: baseline; font-family: var(--font-display); font-weight: 800; font-variant-numeric: tabular-nums; font-size: 2.1rem; line-height: 1; color: var(--fuel); text-shadow: 0 0 0.75rem color-mix(in srgb, var(--fuel) 55%, transparent); }
.pp-price .sep { margin: 0 0.05em; opacity: 0.9; }
.pp-price .unit { margin-left: 0.5rem; font-size: 0.72rem; font-weight: 700; color: rgba(255,255,255,0.5); text-shadow: none; letter-spacing: 0.02em; align-self: center; }
.pp-row[data-fuel="motorin"] { --fuel: #FFC400; }
.pp-row[data-fuel="motorin-plus"] { --fuel: #F0483C; }
.pp-row[data-fuel="benzin"] { --fuel: #5BBF21; }
.pp-row[data-fuel="otogaz"] { --fuel: #2E9BE6; }
@media (max-width: 720px) {
      .pano { grid-template-columns: 1fr; }
      .pano-brand { flex-direction: row; align-items: center; flex-wrap: wrap; gap: 0.75rem 1rem; }
      .pano-logo { width: 2.5rem; }
      .pano-meta { width: 100%; margin-top: 0.25rem; }
      .pp-price { font-size: 1.7rem; }
      .pp-label { min-width: 7rem; }
    }
.totem-col { display: flex; justify-content: flex-start; align-items: flex-start; }
.totem { width: 100%; max-width: 21rem; border-radius: 1.35rem; overflow: hidden; background: linear-gradient(180deg, var(--alpet-blue) 0%, var(--alpet-blue-dark, #005a9c) 100%); box-shadow: 0 1.5rem 2.75rem rgba(0,60,120,0.28), inset 0 0 0 1px rgba(255,255,255,0.08); }
.totem-top { position: relative; padding: 1.75rem 1.25rem 0.75rem; text-align: center; }
.totem-sembol { display: block; margin: 0 auto; width: 42%; max-width: 6.75rem; height: auto; }
.totem-brandbox { margin: 0 1.15rem 1rem; padding: 0.5rem 0; border: 2.5px solid rgba(255,255,255,0.95); border-radius: 0.6rem; text-align: center; box-shadow: inset 0 0 0 1px rgba(255,255,255,0.15); }
.totem-brandbox span { font-family: var(--font-display); font-weight: 800; font-size: 2rem; line-height: 1; color: #fff; letter-spacing: 0.14em; -webkit-text-stroke: 0.5px rgba(0,0,0,0.06); }
.totem-screen { margin: 1rem; padding: 0.7rem; border-radius: 0.85rem; border: 2px solid var(--alpet-green); background: radial-gradient(130% 100% at 50% 0%, #16233a 0%, #0a1120 60%, #05080f 100%); display: flex; flex-direction: column; gap: 0.55rem; box-shadow: inset 0 0 2rem rgba(0,0,0,0.6); }
.tt-row { display: flex; align-items: center; gap: 0.6rem; }
.tt-chip { flex: 0 0 auto; width: 6.2rem; min-height: 2.6rem; display: flex; flex-direction: column; justify-content: center; padding: 0.3rem 0.5rem; border: 2px solid var(--fuel); border-radius: 0.5rem; background: rgba(255,255,255,0.04); }
.tt-chip b { color: #fff; font-family: var(--font-display); font-weight: 800; font-size: 0.82rem; line-height: 1; letter-spacing: 0.02em; }
.tt-chip small { color: rgba(255,255,255,0.6); font-size: 0.56rem; font-weight: 600; text-transform: uppercase; letter-spacing: 0.02em; margin-top: 0.12rem; }
.tt-price { margin-left: auto; font-family: var(--font-display); font-weight: 800; font-variant-numeric: tabular-nums; font-size: 2.15rem; line-height: 1; color: var(--fuel); text-shadow: 0 0 0.85rem color-mix(in srgb, var(--fuel) 60%, transparent); }
.tt-price .sep { margin: 0 0.02em; }
.tt-row[data-fuel="motorin"] { --fuel: #FFC400; }
.tt-row[data-fuel="motorin-plus"] { --fuel: #F0483C; }
.tt-row[data-fuel="benzin"] { --fuel: #5BBF21; }
.tt-row[data-fuel="otogaz"] { --fuel: #2E9BE6; }
.totem-foot { position: relative; height: 13rem; background: var(--alpet-blue); overflow: hidden; }
.totem-foot::before { content: ""; position: absolute; left: 50%; top: 1.5rem; transform: translateX(-50%); width: 150%; height: 11rem; background: linear-gradient(180deg, #6cc82e 0%, var(--alpet-green) 45%, #4ba315 100%); clip-path: polygon(50% 0, 100% 100%, 0 100%); }
.tf-base { position: absolute; left: 0; right: 0; bottom: 0; padding: 2.75rem 0.75rem 1.25rem; background: #fff; text-align: center; clip-path: polygon(0 1.15rem, 43% 1.15rem, 50% 0, 57% 1.15rem, 100% 1.15rem, 100% 100%, 0 100%); box-shadow: 0 -0.5rem 1.25rem rgba(0,40,80,0.06); }
.tf-base .tf-name { display: block; font-family: var(--font-display); font-weight: 800; font-size: 1.05rem; color: var(--gray-900); letter-spacing: 0.02em; }
.tf-base .tf-code { display: inline-block; margin-top: 0.5rem; padding: 0.28rem 0.75rem; border-radius: 999px; background: var(--alpet-blue-light, #e3f0fb); color: var(--alpet-blue); font-size: 0.72rem; font-weight: 700; letter-spacing: 0.05em; }
.sc-list { display: flex; flex-direction: column; gap: 0.625rem; }
.scl { display: flex; align-items: center; gap: 0.75rem; padding: 0.75rem 0.75rem; border: 1px solid var(--border); border-radius: 0.75rem; background: #fff; box-shadow: var(--shadow-sm); transition: all var(--transition); color: inherit; }
.scl:hover { border-color: var(--alpet-blue); transform: translateX(2px); box-shadow: var(--shadow); }
.scl .scl-ic { width: 2.625rem; height: 2.625rem; border-radius: 0.6875rem; display: grid; place-items: center; background: var(--alpet-blue-light); color: var(--alpet-blue); flex-shrink: 0; }
.scl .scl-ic .material-symbols-rounded { font-size: 1.4375rem; }
.scl.green .scl-ic { background: var(--alpet-green-light); color: var(--alpet-green-dark); }
.scl.orange .scl-ic { background: var(--alpet-orange-light); color: #cc6a10; }
.scl .scl-txt { flex: 1; min-width: 0; line-height: 1.3; }
.scl .scl-txt strong { display: block; font-size: 0.9rem; }
.scl .scl-txt span { font-size: 0.76rem; color: var(--text-muted); }
.scl .scl-arw { color: var(--gray-400); font-size: 1.25rem; flex-shrink: 0; transition: color var(--transition); }
.scl:hover .scl-arw { color: var(--alpet-blue); }
.qa-tile { padding: 1rem 1.125rem; }
.qa-tile .tile-head { margin-bottom: 0.875rem; }
.qa-grid { display: grid; grid-template-columns: repeat(6, 1fr); gap: 0.75rem; }
.qa { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 0.6875rem; text-align: center; padding: 1.25rem 0.625rem; border: 1px solid var(--border); border-radius: 0.875rem; background: #fff; color: inherit; transition: all var(--transition); }
.qa:hover { transform: translateY(-0.1875rem); border-color: var(--alpet-blue); box-shadow: var(--shadow); background: var(--alpet-blue-light); }
.qa .qa-ic { width: 2.875rem; height: 2.875rem; border-radius: 0.8125rem; display: grid; place-items: center; background: var(--alpet-blue-light); color: var(--alpet-blue); transition: all var(--transition); }
.qa .qa-ic .material-symbols-rounded { font-size: 1.5625rem; }
.qa:hover .qa-ic { background: var(--alpet-blue); color: #fff; }
.qa strong { font-size: 0.8rem; font-weight: 600; color: var(--gray-800); line-height: 1.25; }
.qa:hover strong { color: var(--alpet-blue); }
@media (max-width: 1100px) { .qa-grid { grid-template-columns: repeat(4, 1fr); } }
@media (max-width: 620px) { .qa-grid { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 400px) { .qa-grid { grid-template-columns: repeat(2, 1fr); } }
.ann-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 1rem; }
.ann-card { display: flex; flex-direction: column; border: 1px solid var(--border); border-radius: 0.875rem; overflow: hidden; background: #fff; box-shadow: var(--shadow-sm); transition: all var(--transition); color: inherit; }
.ann-card:hover { transform: translateY(-0.25rem); box-shadow: var(--shadow); border-color: var(--alpet-blue); }
.ann-card .ac-img { position: relative; height: 7.375rem; background-size: cover; background-position: center; display: grid; place-items: center; }
.ann-card .ac-img .ac-ic { color: rgba(255,255,255,0.9); font-size: 2.625rem; }
.ann-card .ac-tag { position: absolute; top: 0.625rem; left: 0.625rem; font-size: 0.66rem; font-weight: 700; letter-spacing: 0.025rem; text-transform: uppercase; color: #fff; background: rgba(0,0,0,0.28); backdrop-filter: blur(0.25rem); padding: 0.25rem 0.625rem; border-radius: 1.25rem; }
.ann-card .ac-body { padding: 0.875rem 0.9375rem 1rem; }
.ann-card .ac-body strong { display: block; font-size: 0.92rem; margin-bottom: 0.3125rem; }
.ann-card:hover .ac-body strong { color: var(--alpet-blue); }
.ann-card .ac-body p { font-size: 0.8rem; color: var(--text-muted); line-height: 1.5; }
@media (max-width: 1000px) { .ann-grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 560px) { .ann-grid { grid-template-columns: 1fr; } }
.account-chip .ac-role { font-size: 0.62rem; font-weight: 700; letter-spacing: 0.025rem; text-transform: uppercase; color: var(--alpet-blue); background: var(--alpet-blue-light); padding: 2px 0.4375rem; border-radius: 1.25rem; }
.firm-change-btn { display: grid; place-items: center; width: 2.5rem; height: 2.5rem; margin-left: auto; border: 1px solid var(--border); border-radius: 0.75rem; background: #fff; color: var(--alpet-blue); cursor: pointer; transition: all var(--transition); }
.firm-change-btn:hover { background: var(--alpet-blue); color: #fff; border-color: var(--alpet-blue); box-shadow: var(--shadow-sm); }
.firm-change-btn .material-symbols-rounded { font-size: 1.25rem; }
.site-foot { margin-top: 2.75rem; background: linear-gradient(120deg, #0b2540, #123a63 60%, var(--alpet-blue) 150%); color: rgba(255,255,255,0.82); }
.site-foot .foot-top { display: grid; grid-template-columns: 1.6fr 1fr 1fr 1.2fr; gap: 2.125rem; padding: 2.5rem 0 1.875rem; }
.site-foot .foot-brand .fb-logo { display: flex; align-items: center; gap: 0.625rem; font-family: var(--font-display); font-weight: 700; font-size: 1.25rem; color: #fff; }
.site-foot .foot-brand .fb-logo img { height: 1.875rem; filter: brightness(0) invert(1); }
.site-foot .foot-brand .fb-logo b { color: var(--alpet-green); }
.site-foot .foot-brand p { font-size: 0.84rem; line-height: 1.6; margin-top: 0.75rem; max-width: 18.75rem; }
.site-foot .foot-social { display: flex; gap: 0.625rem; margin-top: 1rem; }
.site-foot .foot-social a { width: 2.375rem; height: 2.375rem; border-radius: 0.6875rem; display: grid; place-items: center; background: rgba(255,255,255,0.08); color: #fff; transition: all var(--transition); }
.site-foot .foot-social a:hover { background: var(--alpet-green); transform: translateY(-2px); }
.site-foot .foot-col h4 { color: #fff; font-size: 0.82rem; text-transform: uppercase; letter-spacing: 0.0375rem; margin-bottom: 0.9375rem; }
.site-foot .foot-col a { display: block; font-size: 0.86rem; color: rgba(255,255,255,0.78); padding: 0.375rem 0; transition: color var(--transition); }
.site-foot .foot-col a:hover { color: var(--alpet-green); }
.site-foot .foot-contact li { display: flex; align-items: flex-start; gap: 0.625rem; font-size: 0.86rem; padding: 0.375rem 0; }
.site-foot .foot-contact li .material-symbols-rounded { font-size: 1.1875rem; color: var(--alpet-green); flex-shrink: 0; }
.site-foot .foot-bottom { border-top: 1px solid rgba(255,255,255,0.12); padding: 1rem 0; display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 0.625rem; font-size: 0.8rem; }
.site-foot .foot-bottom .fb-links { display: flex; gap: 1.125rem; flex-wrap: wrap; }
.site-foot .foot-bottom .fb-links a { color: rgba(255,255,255,0.7); }
.site-foot .foot-bottom .fb-links a:hover { color: #fff; }
@media (max-width: 900px) { .site-foot .foot-top { grid-template-columns: 1fr 1fr; gap: 1.75rem; } }
@media (max-width: 560px) { .site-foot .foot-top { grid-template-columns: 1fr; } .site-foot .foot-bottom { justify-content: center; text-align: center; } }

/* ===== kredi-limit.css ===== */
.cl-top { display: grid; grid-template-columns: 1.35fr 1fr; gap: 1rem; margin-bottom: 1.25rem; align-items: stretch; }
@media (max-width: 900px) { .cl-top { grid-template-columns: 1fr; } }
.firm-card { background: #fff; border: 1px solid var(--border); border-radius: var(--radius); box-shadow: var(--shadow-sm); padding: 0.9375rem 1.125rem; }
.firm-card .fc-head { display: flex; align-items: center; gap: 0.75rem; padding-bottom: 0.75rem; border-bottom: 1px solid var(--gray-100); margin-bottom: 0.75rem; }
.firm-card .fc-logo { width: 2.625rem; height: 2.625rem; border-radius: 0.75rem; background: linear-gradient(135deg, var(--alpet-blue), var(--alpet-blue-dark)); color: #fff; display: grid; place-items: center; flex-shrink: 0; }
.firm-card .fc-logo .material-symbols-rounded { font-size: 1.4375rem; }
.firm-card .fc-title h2 { font-family: var(--font-display); font-size: 1.05rem; line-height: 1.2; }
.firm-card .fc-title span { font-size: 0.76rem; color: var(--text-muted); }
.firm-card .fc-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 0.625rem 1.125rem; }
.firm-card .fc-item { display: flex; gap: 0.5625rem; }
.firm-card .fc-item .material-symbols-rounded { font-size: 1.125rem; color: var(--alpet-blue); margin-top: 1px; }
.firm-card .fc-item .l { font-size: 0.68rem; color: var(--text-muted); text-transform: uppercase; letter-spacing: 0.01875rem; }
.firm-card .fc-item .v { font-size: 0.84rem; font-weight: 600; line-height: 1.3; }
@media (max-width: 520px) { .firm-card .fc-grid { grid-template-columns: 1fr; } }
.limit-hero { position: relative; overflow: hidden; background: linear-gradient(135deg, var(--alpet-blue) 0%, #0a74d6 55%, #2aa15f 130%); color: #fff; border-radius: var(--radius); box-shadow: 0 10px 24px -12px rgba(0,94,184,0.5); padding: 1rem 1.125rem; display: flex; flex-direction: column; }
.limit-hero::after { content: ""; position: absolute; right: -2.8125rem; top: -3.4375rem; width: 10rem; height: 10rem; border-radius: 50%; background: radial-gradient(circle, rgba(255,255,255,0.18), rgba(255,255,255,0) 70%); }
.limit-hero > * { position: relative; z-index: 1; }
.limit-hero .lh-lbl { font-size: 0.74rem; text-transform: uppercase; letter-spacing: 0.03125rem; opacity: 0.9; display: flex; align-items: center; gap: 0.4375rem; }
.limit-hero .lh-lbl .material-symbols-rounded { font-size: 1.0625rem; }
.limit-hero .lh-val { font-family: var(--font-display); font-size: 1.7rem; font-weight: 800; margin: 0.1875rem 0 1px; letter-spacing: -0.03125rem; }
.limit-hero .lh-sub { font-size: 0.76rem; opacity: 0.85; }
.limit-hero .lh-bar-wrap { margin-top: auto; padding-top: 0.875rem; }
.limit-hero .lh-bar-top { display: flex; align-items: baseline; justify-content: space-between; margin-bottom: 0.375rem; font-size: 0.78rem; }
.limit-hero .lh-bar-top b { font-family: var(--font-display); font-size: 1rem; }
.limit-hero .lh-bar { height: 0.5625rem; border-radius: 1.25rem; background: rgba(255,255,255,0.25); overflow: hidden; }
.limit-hero .lh-bar span { display: block; height: 100%; border-radius: 1.25rem; background: linear-gradient(90deg, #fff, #d6f5e0); box-shadow: 0 0 12px rgba(255,255,255,0.5); }
.limit-hero .lh-meta { display: flex; justify-content: space-between; gap: 0.75rem; margin-top: 0.625rem; padding-top: 0.625rem; border-top: 1px solid rgba(255,255,255,0.2); }
.limit-hero .lh-meta .k { font-size: 0.68rem; opacity: 0.82; text-transform: uppercase; letter-spacing: 0.01875rem; }
.limit-hero .lh-meta .v { font-family: var(--font-display); font-size: 0.98rem; font-weight: 700; margin-top: 1px; }
.cl-section { margin-bottom: 1.125rem; }
.cl-h { display: flex; align-items: center; gap: 0.5625rem; font-family: var(--font-display); font-size: 1rem; margin-bottom: 0.6875rem; }
.cl-h .material-symbols-rounded { color: var(--alpet-blue); font-size: 1.375rem; }
.cl-h .cl-h-note { margin-left: auto; font-family: var(--font-body); font-size: 0.76rem; font-weight: 500; color: var(--text-muted); }
.cl-cards { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1rem; }
@media (max-width: 820px) { .cl-cards { grid-template-columns: 1fr; } }
.stat-card { background: #fff; border: 1px solid var(--border); border-radius: var(--radius); box-shadow: var(--shadow-sm); padding: 0.9375rem 1.0625rem; position: relative; overflow: hidden; transition: all var(--transition); }
.stat-card::before { content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: 0.25rem; background: var(--alpet-blue); }
.stat-card.green::before { background: var(--alpet-green); }
.stat-card.orange::before { background: var(--alpet-orange); }
.stat-card.red::before { background: #d64545; }
.stat-card.purple::before { background: #6b4de0; }
.stat-card .sc-top { display: flex; align-items: center; justify-content: space-between; gap: 0.75rem; }
.stat-card .sc-ic { width: 2.5rem; height: 2.5rem; border-radius: 0.75rem; display: grid; place-items: center; background: var(--alpet-blue-light); color: var(--alpet-blue); flex-shrink: 0; }
.stat-card.green .sc-ic { background: var(--alpet-green-light); color: var(--alpet-green-dark); }
.stat-card.orange .sc-ic { background: var(--alpet-orange-light); color: #cc6a10; }
.stat-card.red .sc-ic { background: #fdecec; color: #d64545; }
.stat-card.purple .sc-ic { background: #eae6fb; color: #6b4de0; }
.stat-card .sc-ic .material-symbols-rounded { font-size: 1.375rem; }
.stat-card .sc-badge { font-size: 0.7rem; font-weight: 700; padding: 0.1875rem 0.5625rem; border-radius: 1.25rem; background: var(--gray-100); color: var(--gray-600); }
.stat-card .sc-lbl { font-size: 0.74rem; color: var(--text-muted); text-transform: uppercase; letter-spacing: 0.01875rem; margin-top: 0.6875rem; }
.stat-card .sc-val { font-family: var(--font-display); font-size: 1.32rem; font-weight: 800; margin-top: 2px; line-height: 1.1; }
.stat-card .sc-hint { font-size: 0.74rem; color: var(--text-muted); margin-top: 0.3125rem; }
.stat-card.clickable { cursor: pointer; }
.stat-card.clickable:hover { border-color: var(--alpet-blue); box-shadow: var(--shadow); transform: translateY(-2px); }
.stat-card .sc-link { display: inline-flex; align-items: center; gap: 0.3125rem; font-size: 0.79rem; font-weight: 600; color: var(--alpet-blue); margin-top: 0.75rem; }
.stat-card .sc-link .material-symbols-rounded { font-size: 1.0625rem; transition: transform var(--transition); }
.stat-card.clickable:hover .sc-link .material-symbols-rounded { transform: translateX(0.1875rem); }
.stat-card.feature { background: linear-gradient(135deg, #14243d, #123a63 60%, var(--alpet-blue)); color: #fff; border: none; box-shadow: 0 12px 26px -12px rgba(18,58,99,0.6); }
.stat-card.feature::before { display: none; }
.stat-card.feature .sc-ic { background: rgba(255,255,255,0.15); color: #fff; }
.stat-card.feature .sc-lbl { color: rgba(255,255,255,0.82); }
.stat-card.feature .sc-hint { color: rgba(255,255,255,0.72); }
.stat-card.feature .sc-badge { background: rgba(255,255,255,0.18); color: #fff; }
.cl-modal-overlay { position: fixed; inset: 0; background: rgba(15,30,55,0.55); backdrop-filter: blur(0.1875rem); display: flex; align-items: center; justify-content: center; padding: 1.25rem; z-index: 300; opacity: 0; visibility: hidden; transition: all var(--transition); }
.cl-modal-overlay.open { opacity: 1; visibility: visible; }
.cl-modal { background: #fff; border-radius: 1.125rem; width: 100%; max-width: 35rem; box-shadow: var(--shadow-lg); transform: translateY(0.875rem) scale(0.98); transition: all var(--transition); overflow: hidden; max-height: 90vh; display: flex; flex-direction: column; }
.cl-modal-overlay.open .cl-modal { transform: none; }
.cl-modal-head { display: flex; align-items: center; gap: 0.75rem; padding: 1.125rem 1.375rem; border-bottom: 1px solid var(--gray-100); }
.cl-modal-head .mh-ic { width: 2.625rem; height: 2.625rem; border-radius: 0.75rem; background: var(--alpet-blue-light); color: var(--alpet-blue); display: grid; place-items: center; flex-shrink: 0; }
.cl-modal-head h3 { font-family: var(--font-display); font-size: 1.15rem; line-height: 1.2; }
.cl-modal-head p { font-size: 0.78rem; color: var(--text-muted); }
.cl-modal-head .mh-close { margin-left: auto; width: 2.25rem; height: 2.25rem; border-radius: 0.625rem; border: 1px solid var(--border); background: #fff; color: var(--gray-600); cursor: pointer; display: grid; place-items: center; transition: all var(--transition); }
.cl-modal-head .mh-close:hover { background: #fdecec; color: #d64545; border-color: #f3c9c9; }
.cl-modal-body { padding: 1.25rem 1.375rem; overflow-y: auto; }
.dbs-summary { display: grid; grid-template-columns: 1fr 1fr; gap: 0.75rem; margin-bottom: 1.25rem; }
.dbs-sum { padding: 0.875rem 1rem; border-radius: 0.75rem; background: var(--gray-50); border: 1px solid var(--gray-100); }
.dbs-sum.hl { background: var(--alpet-green-light); border-color: transparent; }
.dbs-sum .k { font-size: 0.74rem; color: var(--text-muted); text-transform: uppercase; letter-spacing: 0.01875rem; }
.dbs-sum .v { font-family: var(--font-display); font-size: 1.32rem; font-weight: 800; margin-top: 0.1875rem; }
.dbs-sum.hl .v { color: var(--alpet-green-dark); }
.dbs-list-h { font-size: 0.78rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.025rem; color: var(--gray-600); margin-bottom: 0.625rem; display: flex; align-items: center; gap: 0.4375rem; }
.dbs-list-h .material-symbols-rounded { font-size: 1.0625rem; color: var(--alpet-blue); }
.dbs-bank { display: flex; align-items: center; gap: 0.875rem; padding: 0.8125rem 0; border-bottom: 1px solid var(--gray-100); }
.dbs-bank:last-child { border-bottom: none; }
.dbs-bank .b-ic { width: 2.625rem; height: 2.625rem; border-radius: 0.6875rem; background: #fff; border: 1px solid var(--border); display: grid; place-items: center; color: var(--alpet-blue); flex-shrink: 0; font-family: var(--font-display); font-weight: 800; font-size: 0.95rem; }
.dbs-bank .b-info { flex: 1; min-width: 0; }
.dbs-bank .b-info strong { font-size: 0.9rem; display: block; }
.dbs-bank .b-bar { height: 0.375rem; border-radius: 1.25rem; background: var(--gray-100); overflow: hidden; margin-top: 0.375rem; }
.dbs-bank .b-bar span { display: block; height: 100%; border-radius: 1.25rem; background: var(--alpet-blue); }
.dbs-bank .b-info .b-nums { font-size: 0.74rem; color: var(--text-muted); margin-top: 0.3125rem; }
.dbs-bank .b-amt { text-align: right; white-space: nowrap; flex-shrink: 0; }
.dbs-bank .b-amt .k { font-size: 0.68rem; color: var(--text-muted); text-transform: uppercase; letter-spacing: 0.01875rem; }
.dbs-bank .b-amt .v { font-family: var(--font-display); font-weight: 700; font-size: 0.95rem; color: var(--alpet-green-dark); }
.dbs-empty { text-align: center; color: var(--text-muted); font-size: 0.88rem; padding: 1.5rem 0; }
.cl-modal-foot { display: flex; justify-content: flex-end; gap: 0.625rem; padding: 1rem 1.375rem; border-top: 1px solid var(--gray-100); background: var(--gray-50); }
@media (max-width: 480px) { .dbs-summary { grid-template-columns: 1fr; } .dbs-bank .b-bar { display: none; } }

/* ===== odemelerim.css ===== */
.od-kpis { display: grid; grid-template-columns: repeat(4, 1fr); gap: 1rem; margin-bottom: 1.375rem; }
.od-kpi { display: flex; align-items: center; gap: 0.875rem; background: #fff; border: 1px solid var(--border); border-radius: var(--radius); box-shadow: var(--shadow-sm); padding: 1rem 1.125rem; position: relative; overflow: hidden; }
.od-kpi::before { content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: 0.25rem; background: var(--alpet-blue); }
.od-kpi.green::before { background: var(--alpet-green); }
.od-kpi.purple::before { background: #6b4de0; }
.od-kpi.orange::before { background: var(--alpet-orange); }
.od-kpi .k-ic { width: 2.875rem; height: 2.875rem; border-radius: 0.8125rem; display: grid; place-items: center; background: var(--alpet-blue-light); color: var(--alpet-blue); flex-shrink: 0; }
.od-kpi.green .k-ic { background: var(--alpet-green-light); color: var(--alpet-green-dark); }
.od-kpi.purple .k-ic { background: #eae6fb; color: #6b4de0; }
.od-kpi.orange .k-ic { background: var(--alpet-orange-light); color: #cc6a10; }
.od-kpi .k-ic .material-symbols-rounded { font-size: 1.5625rem; }
.od-kpi .k-lbl { font-size: 0.76rem; color: var(--text-muted); text-transform: uppercase; letter-spacing: 0.01875rem; }
.od-kpi .k-val { font-family: var(--font-display); font-size: 1.28rem; font-weight: 800; line-height: 1.15; margin-top: 2px; font-variant-numeric: tabular-nums; }
@media (max-width: 900px) { .od-kpis { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 500px) { .od-kpis { grid-template-columns: 1fr; } }
.od-card { background: #fff; border: 1px solid var(--border); border-radius: var(--radius); box-shadow: var(--shadow-sm); overflow: hidden; }
.od-head { display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding: 1.125rem 1.25rem; border-bottom: 1px solid var(--gray-100); flex-wrap: wrap; }
.od-head .oh-left { display: flex; align-items: center; gap: 0.8125rem; min-width: 0; }
.od-head .oh-ic { width: 2.75rem; height: 2.75rem; border-radius: 0.75rem; display: grid; place-items: center; background: var(--alpet-blue-light); color: var(--alpet-blue); flex-shrink: 0; }
.od-head .oh-ic .material-symbols-rounded { font-size: 1.5rem; }
.od-head .oh-txt h2 { font-family: var(--font-display); font-size: 1.06rem; font-weight: 700; margin: 0; line-height: 1.2; }
.od-head .oh-txt p { font-size: 0.8rem; color: var(--text-muted); margin: 0.1875rem 0 0; }
.od-head .oh-txt p b { color: var(--gray-800); }
.od-head .ce-search { width: 20rem; max-width: 100%; }
@media (max-width: 640px) { .od-head .ce-search { width: 100%; } }
.od-scroll { overflow-x: auto; }
table.odeme { min-width: 61.25rem; }
table.odeme td { vertical-align: middle; }
table.odeme .cell-mus .m-name { font-size: 0.86rem; font-weight: 600; color: var(--gray-900); line-height: 1.3; }
table.odeme .cell-mus .m-code { font-size: 0.72rem; color: var(--text-muted); margin-top: 0.1875rem; font-variant-numeric: tabular-nums; }
table.odeme .cell-user { display: flex; align-items: center; gap: 0.5625rem; }
table.odeme .u-av { width: 1.875rem; height: 1.875rem; border-radius: 50%; background: var(--alpet-blue-light); color: var(--alpet-blue); display: grid; place-items: center; font-size: 0.72rem; font-weight: 700; flex-shrink: 0; }
table.odeme .u-name { font-size: 0.84rem; font-weight: 500; color: var(--gray-700); }
table.odeme .num { text-align: right; font-variant-numeric: tabular-nums; white-space: nowrap; }
table.odeme .num.tutar { font-family: var(--font-display); font-weight: 800; color: var(--gray-900); }
table.odeme .taksit-pill { display: inline-block; min-width: 1.625rem; text-align: center; font-size: 0.76rem; font-weight: 700; color: var(--gray-700); background: var(--gray-100); border-radius: 1.25rem; padding: 0.1875rem 0.625rem; font-variant-numeric: tabular-nums; }
table.odeme .cell-bank { display: flex; align-items: center; gap: 0.5rem; }
table.odeme .cell-bank .material-symbols-rounded { font-size: 1.1875rem; color: var(--alpet-blue); }
table.odeme .cell-bank .b-name { font-size: 0.83rem; color: var(--gray-700); }
table.odeme .siparis-no { font-size: 0.76rem; color: var(--text-muted); font-variant-numeric: tabular-nums; letter-spacing: 0.025rem; }
table.odeme .cell-tarih .t-date { font-size: 0.84rem; font-weight: 600; color: var(--gray-800); white-space: nowrap; }
table.odeme .cell-tarih .t-time { font-size: 0.73rem; color: var(--text-muted); margin-top: 2px; font-variant-numeric: tabular-nums; }
table.odeme .cell-act { text-align: right; white-space: nowrap; }
table.odeme .cell-act .btn { padding: 0.4375rem 0.8125rem; font-size: 0.8rem; }
.od-empty { display: flex; flex-direction: column; align-items: center; gap: 0.625rem; padding: 3rem 1.25rem; text-align: center; }
.od-empty[hidden] { display: none; }
.od-empty .material-symbols-rounded { font-size: 2.875rem; color: var(--gray-300); }
.od-empty p { color: var(--text-muted); font-size: 0.92rem; }
@media (max-width: 820px) {
      .od-scroll { overflow-x: visible; }
      table.odeme { min-width: 0; }
      table.odeme td { text-align: right; }
      table.odeme .cell-mus { text-align: left; }
      table.odeme .cell-user, table.odeme .cell-bank { justify-content: flex-end; }
      table.odeme .cell-act .btn { width: 100%; justify-content: center; }
    }

/* ===== online-odeme.css ===== */
.tahsilat-grid { display: grid; grid-template-columns: 21.25rem 1fr; gap: 1.25rem; align-items: stretch; margin-bottom: 1.25rem; }
@media (max-width: 940px) { .tahsilat-grid { grid-template-columns: 1fr; } .form-side { order: -1; } }
.profile-side { background: #fff; border: 1px solid var(--border); border-radius: var(--radius); box-shadow: var(--shadow-sm); overflow: hidden; display: flex; flex-direction: column; }
.profile-side .ps-section:last-child { margin-top: auto; }
.ps-head { text-align: center; padding: 1.625rem 1.25rem 1.375rem; background: linear-gradient(160deg, var(--alpet-blue-light), #fff 85%); border-bottom: 1px solid var(--gray-100); }
.ps-avatar { width: 4.75rem; height: 4.75rem; border-radius: 50%; margin: 0 auto 0.75rem; display: grid; place-items: center; background: linear-gradient(135deg, var(--alpet-blue), var(--alpet-blue-dark)); color: #fff; box-shadow: 0 6px 18px rgba(0,94,184,0.28); }
.ps-avatar .material-symbols-rounded { font-size: 2.5rem; }
.ps-head strong { display: block; font-family: var(--font-display); font-size: 1.12rem; color: var(--gray-900); }
.ps-head span { font-size: 0.8rem; color: var(--text-muted); }
.ps-section { padding: 1.125rem 1.25rem; border-bottom: 1px solid var(--gray-100); }
.ps-section:last-child { border-bottom: none; }
.ps-section h4 { font-size: 0.76rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.03125rem; color: var(--alpet-blue); margin-bottom: 0.875rem; display: flex; align-items: center; gap: 0.5rem; }
.ps-section h4 .material-symbols-rounded { font-size: 1.125rem; }
.ps-list { display: flex; flex-direction: column; gap: 0.8125rem; }
.ps-item { display: flex; align-items: flex-start; justify-content: space-between; gap: 0.875rem; }
.ps-item .l { font-size: 0.82rem; color: var(--text-muted); flex-shrink: 0; }
.ps-item .v { font-size: 0.85rem; font-weight: 600; color: var(--gray-800); text-align: right; line-height: 1.35; }
.ps-bal { display: flex; align-items: center; justify-content: space-between; padding: 0.75rem 0.875rem; border-radius: 0.6875rem; margin-bottom: 0.625rem; background: var(--gray-50); border: 1px solid var(--gray-100); }
.ps-bal:last-child { margin-bottom: 0; }
.ps-bal .k { font-size: 0.82rem; color: var(--gray-600); font-weight: 500; }
.ps-bal .val { font-family: var(--font-display); font-weight: 800; font-size: 1.02rem; font-variant-numeric: tabular-nums; }
.ps-bal.pos { background: var(--alpet-green-light); border-color: transparent; }
.ps-bal.pos .val { color: var(--alpet-green-dark); }
.ps-bal.neg .val { color: #d64545; }
.form-side { background: #fff; border: 1px solid var(--border); border-radius: var(--radius); box-shadow: var(--shadow-sm); overflow: hidden; }
.fs-head { padding: 1.125rem 1.5rem; border-bottom: 1px solid var(--gray-100); background: var(--gray-50); }
.fs-head h3 { font-family: var(--font-display); font-size: 1.12rem; display: flex; align-items: center; gap: 0.625rem; }
.fs-head h3 .material-symbols-rounded { color: var(--alpet-blue); }
.fs-body { padding: 1.5rem; }
.fs-sub { font-size: 1rem; font-weight: 700; color: var(--gray-800); margin-bottom: 1.125rem; }
.cc-layout { display: grid; grid-template-columns: 1fr 18.125rem; gap: 1.625rem; align-items: start; }
@media (max-width: 720px) { .cc-layout { grid-template-columns: 1fr; } .cc-side { order: -1; } }
.cc-visual { position: relative; border-radius: 1.125rem; padding: 1.375rem; color: #fff; background: linear-gradient(130deg, var(--alpet-blue) 0%, #0a74d6 42%, #2aa15f 88%, var(--alpet-green) 120%); box-shadow: 0 14px 30px -10px rgba(0,94,184,0.55); overflow: hidden; margin-bottom: 1rem; aspect-ratio: 1.6 / 1; display: flex; flex-direction: column; justify-content: space-between; }
.cc-visual::before { content: ""; position: absolute; inset: 0; background: linear-gradient(115deg, rgba(255,255,255,0.18) 0%, rgba(255,255,255,0) 42%); pointer-events: none; }
.cc-visual::after { content: ""; position: absolute; right: -3.125rem; top: -3.4375rem; width: 11.875rem; height: 11.875rem; border-radius: 50%; background: radial-gradient(circle, rgba(255,255,255,0.22), rgba(255,255,255,0) 70%); }
.cc-visual > * { position: relative; z-index: 1; }
.cc-visual .cc-top { display: flex; align-items: center; justify-content: space-between; }
.cc-chip { width: 2.625rem; height: 2rem; border-radius: 0.4375rem; background: linear-gradient(135deg, #e6c15a, #c99a2e); }
.cc-brand { font-family: var(--font-display); font-weight: 800; letter-spacing: 1px; opacity: 0.9; }
.cc-number { font-family: var(--font-display); font-size: 1.3rem; letter-spacing: 2px; font-variant-numeric: tabular-nums; }
.cc-bottom { display: flex; align-items: flex-end; justify-content: space-between; }
.cc-bottom .l { font-size: 0.6rem; text-transform: uppercase; letter-spacing: 0.03125rem; opacity: 0.7; }
.cc-bottom .v { font-size: 0.86rem; font-weight: 600; text-transform: uppercase; }
.cc-side .pay-secure { display: flex; align-items: flex-start; gap: 0.5rem; font-size: 0.76rem; color: var(--text-muted); line-height: 1.4; padding: 0.75rem 0.875rem; background: var(--alpet-green-light); border-radius: 0.6875rem; }
.cc-side .pay-secure .material-symbols-rounded { font-size: 1.125rem; color: var(--alpet-green-dark); flex-shrink: 0; }
.cc-side .pay-brands { display: flex; align-items: center; gap: 0.5rem; margin-top: 0.75rem; }
.cc-side .pay-brands span { font-size: 0.72rem; font-weight: 700; color: var(--gray-500); border: 1px solid var(--border); border-radius: 0.375rem; padding: 0.1875rem 0.5rem; }
.pay-form .form-group { margin-bottom: 0.9375rem; }
.pay-form .form-group > label { display: block; font-size: 0.8rem; font-weight: 600; color: var(--gray-700); margin-bottom: 0.375rem; }
.pay-form .form-group > label .req { color: #d64545; }
.pay-form .fg-row { display: grid; grid-template-columns: 1.3fr 1fr 1fr; gap: 0.75rem; }
.pay-form .fg-row.two { grid-template-columns: 1fr 1fr; }
@media (max-width: 480px) { .pay-form .fg-row, .pay-form .fg-row.two { grid-template-columns: 1fr; } }
.input-ic { position: relative; }
.input-ic > .material-symbols-rounded { position: absolute; left: 0.8125rem; top: 50%; transform: translateY(-50%); font-size: 1.25rem; color: var(--gray-400); pointer-events: none; }
.input-ic .form-control, .input-ic .select { width: 100%; padding-left: 2.625rem; height: 3rem; }
.input-ic .form-control:focus + .material-symbols-rounded { color: var(--alpet-blue); }
.amount-field { position: relative; }
.amount-field::before { content: "₺"; position: absolute; left: 1rem; top: 50%; transform: translateY(-50%); color: var(--alpet-blue); font-weight: 700; font-size: 1.05rem; }
.amount-field .form-control { padding-left: 2.125rem; height: 3rem; font-family: var(--font-display); font-weight: 700; font-size: 1.1rem; }
.amount-hint { font-size: 0.76rem; color: var(--text-muted); margin-top: 0.375rem; }
.pay-form .btn-pay { width: 100%; justify-content: center; padding: 0.9375rem; font-size: 1.02rem; margin-top: 0.5rem; }
.inv-card { background: #fff; border: 1px solid var(--border); border-radius: var(--radius); box-shadow: var(--shadow-sm); overflow: hidden; }
.inv-head { display: flex; align-items: center; justify-content: space-between; gap: 0.75rem; padding: 1rem 1.375rem; border-bottom: 1px solid var(--gray-100); flex-wrap: wrap; }
.inv-head h3 { font-family: var(--font-display); font-size: 1.08rem; display: flex; align-items: center; gap: 0.5625rem; }
.inv-head h3 .material-symbols-rounded { color: var(--alpet-blue); }
.inv-head .inv-count { font-size: 0.78rem; font-weight: 700; color: #cc6a10; background: var(--alpet-orange-light); padding: 0.25rem 0.6875rem; border-radius: 1.25rem; }
.inv-search { position: relative; flex: 1 1 15rem; min-width: 12.5rem; }
.inv-search .material-symbols-rounded { position: absolute; left: 0.8125rem; top: 50%; transform: translateY(-50%); font-size: 1.25rem; color: var(--gray-500); pointer-events: none; }
.inv-search input { height: 2.625rem; width: 100%; padding: 0 0.875rem 0 2.625rem; border: 1px solid var(--border); border-radius: 0.625rem; background: var(--gray-50); font-size: 0.9rem; transition: all var(--transition); }
.inv-search input:focus { outline: none; background: #fff; border-color: var(--alpet-blue); box-shadow: 0 0 0 3px var(--alpet-blue-light); }
.inv-row { display: flex; align-items: center; gap: 0.875rem; padding: 0.9375rem 1.375rem; border-bottom: 1px solid var(--gray-100); cursor: pointer; transition: background var(--transition); }
.inv-row:last-child { border-bottom: none; }
.inv-row:hover { background: var(--alpet-blue-light); }
.inv-row.selected { background: var(--alpet-blue-light); }
.inv-check { width: 1.375rem; height: 1.375rem; border-radius: 0.4375rem; border: 2px solid var(--gray-300); display: grid; place-items: center; flex-shrink: 0; transition: all var(--transition); color: #fff; }
.inv-row.selected .inv-check { background: var(--alpet-blue); border-color: var(--alpet-blue); }
.inv-check .material-symbols-rounded { font-size: 1rem; opacity: 0; }
.inv-row.selected .inv-check .material-symbols-rounded { opacity: 1; }
.inv-ic { width: 2.5rem; height: 2.5rem; border-radius: 0.6875rem; background: var(--alpet-blue-light); color: var(--alpet-blue); display: grid; place-items: center; flex-shrink: 0; }
.inv-ic .material-symbols-rounded { font-size: 1.3125rem; }
.inv-info { flex: 1; min-width: 0; }
.inv-info strong { font-size: 0.9rem; display: block; }
.inv-info .inv-meta { font-size: 0.77rem; color: var(--text-muted); display: flex; align-items: center; gap: 0.625rem; flex-wrap: wrap; margin-top: 2px; }
.inv-info .inv-meta .overdue { color: #d64545; font-weight: 600; }
.inv-amt { font-family: var(--font-display); font-weight: 700; font-size: 0.98rem; text-align: right; white-space: nowrap; font-variant-numeric: tabular-nums; }
.inv-foot { display: flex; align-items: center; justify-content: space-between; gap: 0.75rem; padding: 1rem 1.375rem; background: var(--gray-50); border-top: 1px solid var(--border); flex-wrap: wrap; }
.inv-foot .lbl { font-size: 0.82rem; color: var(--text-muted); }
.inv-foot .amt { font-family: var(--font-display); font-size: 1.4rem; font-weight: 800; color: var(--alpet-blue); }

/* ===== profil.css ===== */
.pf-layout { display: flex; flex-direction: column; gap: 1.25rem; }
.pf-side { display: flex; flex-direction: column; gap: 1rem; }
.pf-summary { background: #fff; border: 1px solid var(--border); border-radius: 1rem; box-shadow: var(--shadow-sm); padding: 1.125rem 1.375rem; display: flex; align-items: center; gap: 1.125rem; text-align: left; }
.pf-summary .pf-avatar { width: 4.5rem; height: 4.5rem; border-radius: 50%; margin: 0; display: grid; place-items: center; background: linear-gradient(135deg, var(--alpet-blue), var(--alpet-green)); color: #fff; box-shadow: 0 8px 20px rgba(0,94,184,0.28); overflow: hidden; flex-shrink: 0; }
.pf-summary .pf-avatar img { width: 100%; height: 100%; object-fit: cover; }
.pf-sum-info { min-width: 0; }
.pf-summary .pf-name { font-family: var(--font-display); font-weight: 700; font-size: 1.15rem; color: var(--gray-900); }
.pf-summary .pf-role { display: inline-flex; align-items: center; gap: 0.3125rem; margin-top: 0.375rem; font-size: 0.74rem; font-weight: 600; color: var(--alpet-blue); background: var(--alpet-blue-light); padding: 0.1875rem 0.6875rem; border-radius: 1.25rem; }
.pf-summary .pf-mail { margin-top: 0.5625rem; font-size: 0.8rem; color: var(--text-muted); word-break: break-all; display: flex; align-items: center; justify-content: flex-start; gap: 0.375rem; }
.pf-summary .pf-mail .material-symbols-rounded { font-size: 1rem; }
@media (max-width: 560px) { .pf-summary { flex-direction: column; text-align: center; } .pf-summary .pf-mail { justify-content: center; } }
.pf-tabs { background: #fff; border: 1px solid var(--border); border-radius: 0.875rem; box-shadow: var(--shadow-sm); padding: 0.4375rem; display: flex; flex-direction: row; gap: 0.375rem; overflow-x: auto; scrollbar-width: none; -webkit-overflow-scrolling: touch; }
.pf-tabs::-webkit-scrollbar { display: none; }
.pf-tab { display: flex; align-items: center; justify-content: center; gap: 0.5625rem; padding: 0.6875rem 1.25rem; border-radius: 0.625rem; border: none; background: transparent; cursor: pointer; font-family: inherit; font-size: 0.9rem; font-weight: 600; color: var(--gray-700); white-space: nowrap; transition: all var(--transition); flex: 1 1 auto; }
.pf-tab .material-symbols-rounded { font-size: 1.25rem; color: var(--gray-500); transition: color var(--transition); }
.pf-tab:hover { background: var(--gray-100); }
.pf-tab.active { background: var(--alpet-blue); color: #fff; box-shadow: var(--shadow-sm); }
.pf-tab.active .material-symbols-rounded { color: #fff; }
@media (max-width: 560px) { .pf-tab { flex: 0 0 auto; padding: 0.6875rem 1rem; } }
.pf-panel { background: #fff; border: 1px solid var(--border); border-radius: 1rem; box-shadow: var(--shadow-sm); overflow: hidden; }
.pf-panel[hidden] { display: none; }
.pf-phead { display: flex; align-items: center; gap: 0.8125rem; padding: 1.25rem 1.5rem; border-bottom: 1px solid var(--gray-100); }
.pf-phead .pf-ico { width: 2.625rem; height: 2.625rem; border-radius: 0.75rem; background: var(--alpet-blue-light); color: var(--alpet-blue); display: grid; place-items: center; flex-shrink: 0; }
.pf-phead .pf-ico .material-symbols-rounded { font-size: 1.4375rem; }
.pf-phead h2 { font-family: var(--font-display); font-size: 1.1rem; color: var(--gray-900); line-height: 1.2; }
.pf-phead p { font-size: 0.8rem; color: var(--text-muted); margin-top: 2px; }
.pf-pbody { padding: 1.5rem; }
.pf-form-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 1.125rem; }
@media (max-width: 560px) { .pf-form-grid { grid-template-columns: 1fr; } }
.pf-fg { display: flex; flex-direction: column; gap: 0.4375rem; }
.pf-fg.full { grid-column: 1 / -1; }
.pf-fg label { font-size: 0.78rem; font-weight: 600; color: var(--gray-700); }
.pf-hint { font-size: 0.78rem; color: var(--text-muted); margin-top: 0.25rem; }
.pf-actions { display: flex; justify-content: flex-end; gap: 0.625rem; margin-top: 1.5rem; padding-top: 1.125rem; border-top: 1px solid var(--gray-100); }
.pf-phone-list { display: flex; flex-direction: column; gap: 0.625rem; margin-bottom: 1.25rem; }
.pf-phone { display: flex; align-items: center; gap: 0.875rem; padding: 0.875rem 1rem; border: 1px solid var(--border); border-radius: 0.75rem; background: var(--gray-50); transition: all var(--transition); }
.pf-phone:hover { border-color: var(--alpet-blue); background: #fff; box-shadow: var(--shadow-sm); }
.pf-phone .ph-ic { width: 2.5rem; height: 2.5rem; border-radius: 0.6875rem; background: var(--alpet-blue-light); color: var(--alpet-blue); display: grid; place-items: center; flex-shrink: 0; }
.pf-phone .ph-num { flex: 1; min-width: 0; font-family: var(--font-display); font-weight: 600; font-size: 0.98rem; color: var(--gray-900); letter-spacing: 0.025rem; }
.pf-badge { display: inline-flex; align-items: center; gap: 0.25rem; font-size: 0.7rem; font-weight: 700; padding: 0.1875rem 0.625rem; border-radius: 1.25rem; background: var(--alpet-green-light); color: var(--alpet-green-dark); white-space: nowrap; }
.pf-badge .material-symbols-rounded { font-size: 0.875rem; }
.ph-remove { width: 2.25rem; height: 2.25rem; border-radius: 0.625rem; border: 1px solid var(--border); background: #fff; color: #d64545; display: grid; place-items: center; cursor: pointer; transition: all var(--transition); flex-shrink: 0; }
.ph-remove:hover { background: #fdecec; border-color: #d64545; }
.ph-remove .material-symbols-rounded { font-size: 1.1875rem; }
.pf-addrow { display: flex; gap: 0.625rem; align-items: stretch; }
.pf-addrow .form-control { flex: 1; }
@media (max-width: 520px) { .pf-addrow { flex-direction: column; } }
.pf-dealers { display: grid; grid-template-columns: repeat(auto-fill, minmax(15rem, 1fr)); gap: 0.875rem; }
.pf-dealer { position: relative; border: 0.09375rem solid var(--border); border-radius: 0.875rem; padding: 1.125rem; background: var(--gray-50); transition: all var(--transition); }
.pf-dealer:hover { border-color: var(--alpet-blue); background: #fff; box-shadow: var(--shadow-sm); }
.pf-dealer.primary { border-color: var(--alpet-green); background: linear-gradient(180deg, var(--alpet-green-light), #fff); }
.pf-dealer .dl-ic { width: 2.875rem; height: 2.875rem; border-radius: 0.8125rem; background: #fff; border: 1px solid var(--border); color: var(--alpet-blue); display: grid; place-items: center; margin-bottom: 0.75rem; }
.pf-dealer.primary .dl-ic { color: var(--alpet-green-dark); border-color: var(--alpet-green); }
.pf-dealer .dl-name { font-family: var(--font-display); font-weight: 700; font-size: 0.98rem; color: var(--gray-900); line-height: 1.25; }
.pf-dealer .dl-meta { font-size: 0.78rem; color: var(--text-muted); margin-top: 0.25rem; }
.pf-dealer .dl-foot { margin-top: 0.875rem; }
.pf-dealer .btn-mini { display: inline-flex; align-items: center; gap: 0.3125rem; font-size: 0.78rem; font-weight: 600; padding: 0.4375rem 0.75rem; border-radius: 0.5625rem; border: 1px solid var(--border); background: #fff; color: var(--alpet-blue); cursor: pointer; transition: all var(--transition); font-family: inherit; }
.pf-dealer .btn-mini:hover { background: var(--alpet-blue); color: #fff; border-color: var(--alpet-blue); }
.pf-dealer .btn-mini .material-symbols-rounded { font-size: 1rem; }
.pf-users { display: flex; flex-direction: column; gap: 0.75rem; }
.pf-user { display: flex; align-items: center; gap: 0.875rem; padding: 0.875rem 1rem; border: 1px solid var(--border); border-radius: 0.875rem; background: var(--gray-50); transition: all var(--transition); }
.pf-user:hover { border-color: var(--alpet-blue); background: #fff; box-shadow: var(--shadow-sm); }
.pf-user .pu-avatar { width: 3rem; height: 3rem; border-radius: 50%; object-fit: cover; flex-shrink: 0; }
.pf-user .pu-main { flex: 1; min-width: 0; }
.pf-user .pu-name { font-family: var(--font-display); font-weight: 700; font-size: 0.96rem; color: var(--gray-900); display: flex; align-items: center; gap: 0.5rem; flex-wrap: wrap; }
.pf-user .pu-meta { display: flex; align-items: center; gap: 0.875rem; flex-wrap: wrap; margin-top: 0.3125rem; font-size: 0.8rem; color: var(--text-muted); }
.pf-user .pu-meta span { display: inline-flex; align-items: center; gap: 0.3125rem; }
.pf-user .pu-meta .material-symbols-rounded { font-size: 1rem; color: var(--gray-400); }
.pf-user .pu-status { display: inline-flex; align-items: center; gap: 0.3125rem; font-size: 0.72rem; font-weight: 700; padding: 0.25rem 0.6875rem; border-radius: 1.25rem; white-space: nowrap; flex-shrink: 0; }
.pf-user .pu-status.active { background: var(--alpet-green-light); color: var(--alpet-green-dark); }
.pf-user .pu-status.passive { background: var(--gray-200); color: var(--gray-600); }
.pf-user .pu-status::before { content: ""; width: 0.4375rem; height: 0.4375rem; border-radius: 50%; background: currentColor; }
.pf-role-pill { display: inline-flex; align-items: center; gap: 0.25rem; font-size: 0.68rem; font-weight: 700; padding: 2px 0.5625rem; border-radius: 1.25rem; background: var(--alpet-blue-light); color: var(--alpet-blue); }
.pf-role-pill.owner { background: var(--alpet-green-light); color: var(--alpet-green-dark); }
.pf-user .pu-del { width: 2.25rem; height: 2.25rem; border-radius: 0.625rem; border: 1px solid var(--border); background: #fff; color: #d64545; display: grid; place-items: center; cursor: pointer; transition: all var(--transition); flex-shrink: 0; }
.pf-user .pu-del:hover { background: #fdecec; border-color: #d64545; }
.pf-user .pu-del .material-symbols-rounded { font-size: 1.1875rem; }
@media (max-width: 560px) { .pf-user { flex-wrap: wrap; } .pf-user .pu-status { order: 3; } }
.pf-pass { position: relative; }
.pf-pass .form-control { padding-right: 2.75rem; }
.pf-eye { position: absolute; right: 0.5rem; top: 50%; transform: translateY(-50%); width: 2rem; height: 2rem; border: none; background: transparent; color: var(--gray-500); cursor: pointer; display: grid; place-items: center; border-radius: 0.5rem; transition: all var(--transition); }
.pf-eye:hover { background: var(--gray-100); color: var(--alpet-blue); }
.pf-eye .material-symbols-rounded { font-size: 1.25rem; }
.pf-strength { margin-top: 0.625rem; }
.pf-strength-bar { height: 0.4375rem; border-radius: 1.25rem; background: var(--gray-200); overflow: hidden; }
.pf-strength-bar > span { display: block; height: 100%; width: 0; border-radius: 1.25rem; transition: width var(--transition), background var(--transition); }
.pf-strength-txt { font-size: 0.76rem; font-weight: 600; margin-top: 0.375rem; color: var(--text-muted); }
.form-msg { display: none; align-items: center; gap: 0.5rem; margin-top: 1rem; padding: 0.6875rem 0.875rem; border-radius: 0.625rem; font-size: 0.84rem; font-weight: 500; }
.form-msg.show { display: flex; }
.form-msg.err { background: #fdecec; color: #c23b3b; }
.form-msg.ok { background: var(--alpet-green-light); color: var(--alpet-green-dark); }
.form-msg .material-symbols-rounded { font-size: 1.1875rem; }
.pf-note { display: flex; align-items: flex-start; gap: 0.5625rem; margin-top: 0.375rem; padding: 0.75rem 0.875rem; border-radius: 0.6875rem; background: var(--alpet-blue-light); color: var(--gray-700); font-size: 0.82rem; line-height: 1.45; }
.pf-note .material-symbols-rounded { font-size: 1.1875rem; color: var(--alpet-blue); flex-shrink: 0; }

/* ===== siparis-olustur.css ===== */
.wz-topbar { display: flex; align-items: center; gap: 0.875rem; flex-wrap: wrap; background: #fff; border: 1px solid var(--border); border-radius: var(--radius); box-shadow: var(--shadow-sm); padding: 0.75rem 1rem; margin-bottom: 1.125rem; }
.wz-topbar .tb-firm { display: flex; align-items: center; gap: 0.6875rem; }
.wz-topbar .tb-logo { width: 2.375rem; height: 2.375rem; border-radius: 0.6875rem; background: linear-gradient(135deg, var(--alpet-blue), var(--alpet-blue-dark)); color: #fff; display: grid; place-items: center; flex-shrink: 0; }
.wz-topbar .tb-firm strong { font-size: 0.92rem; display: block; }
.wz-topbar .tb-firm span { font-size: 0.75rem; color: #fff; }
.wz-topbar .tb-sep { width: 1px; height: 2.125rem; background: var(--gray-100); }
.wz-topbar .tb-limit { display: flex; flex-direction: column; }
.wz-topbar .tb-limit .k { font-size: 0.68rem; text-transform: uppercase; letter-spacing: 0.01875rem; color: var(--text-muted); }
.wz-topbar .tb-limit .v { font-family: var(--font-display); font-weight: 800; font-size: 1.02rem; color: var(--gray-900); font-variant-numeric: tabular-nums; }
.wz-topbar .tb-limit .v.used { color: #cc6a10; }
.wz-topbar .tb-limit .v.remain { color: var(--alpet-green-dark); }
@media (max-width: 760px) { .wz-topbar .tb-limit { flex: 1 1 40%; } }
.wz-topbar .tb-limits { margin: 0 auto; display: flex; align-items: center; gap: 1rem; flex-wrap: wrap; }
.wz-topbar .tb-help { display: inline-flex; align-items: center; gap: 0.4375rem; font-size: 0.84rem; color: var(--alpet-blue); background: var(--alpet-blue-light); padding: 0.5625rem 0.875rem; border: 1px solid transparent; border-radius: 0.625rem; font-weight: 600; font-family: inherit; cursor: pointer; transition: all var(--transition); }
.wz-topbar .tb-help:hover { background: var(--alpet-blue); color: #fff; }
@media (max-width: 640px) { .wz-topbar .tb-sep { display: none; } .wz-topbar .tb-help { margin-left: auto; } }
.wz-steps { display: flex; align-items: flex-start; margin-bottom: 1.25rem; }
.wz-step { flex: 1; display: flex; flex-direction: column; align-items: center; gap: 0.5rem; position: relative; text-align: center; }
.wz-step::before, .wz-step::after { content: ""; position: absolute; top: 1.25rem; height: 0.1875rem; background: var(--gray-200); z-index: 0; }
.wz-step::before { left: 0; width: 50%; }
.wz-step::after { right: 0; width: 50%; }
.wz-step:first-child::before, .wz-step:last-child::after { display: none; }
.wz-step.done::before, .wz-step.done::after, .wz-step.active::before { background: var(--alpet-blue); }
.wz-dot { width: 2.625rem; height: 2.625rem; border-radius: 50%; background: #fff; border: 0.1875rem solid var(--gray-200); color: var(--gray-500); display: grid; place-items: center; font-family: var(--font-display); font-weight: 700; font-size: 1rem; position: relative; z-index: 1; transition: all var(--transition); }
.wz-dot .material-symbols-rounded { font-size: 1.375rem; }
.wz-step.active .wz-dot { border-color: var(--alpet-blue); color: var(--alpet-blue); box-shadow: 0 0 0 4px var(--alpet-blue-light); }
.wz-step.done .wz-dot { background: var(--alpet-blue); border-color: var(--alpet-blue); color: #fff; cursor: pointer; }
.wz-step .wz-slbl { font-size: 0.8rem; font-weight: 600; color: var(--gray-600); }
.wz-step.active .wz-slbl, .wz-step.done .wz-slbl { color: var(--gray-900); }
@media (max-width: 620px) { .wz-step .wz-slbl { font-size: 0.64rem; } .wz-dot { width: 2.25rem; height: 2.25rem; font-size: 0.9rem; } .wz-step::before,.wz-step::after{top:1.125rem;} }
.wz-channel { display: flex; align-items: center; gap: 0.875rem; background: linear-gradient(100deg, var(--alpet-blue-light), #fff 75%); border: 1px solid var(--alpet-blue); border-left-width: 0.25rem; border-radius: 0.75rem; padding: 0.75rem 1rem; margin-bottom: 1.25rem; }
.wz-channel[hidden] { display: none; }
.wz-channel .wc-ic { width: 2.75rem; height: 2.75rem; border-radius: 0.6875rem; background: var(--alpet-blue); color: #fff; display: grid; place-items: center; flex-shrink: 0; }
.wz-channel .wc-ic .material-symbols-rounded { font-size: 1.5rem; }
.wz-channel .wc-txt { flex: 1; min-width: 0; line-height: 1.25; }
.wz-channel .wc-lbl { font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03125rem; color: var(--text-muted); font-weight: 600; }
.wz-channel .wc-name { display: flex; align-items: center; gap: 0.5rem; font-family: var(--font-display); font-size: 1.05rem; font-weight: 700; color: var(--alpet-blue); margin-top: 1px; }
.wz-channel .wc-code { font-family: var(--font-sans); font-size: 0.68rem; font-weight: 700; color: #fff; background: var(--alpet-green); padding: 2px 0.5rem; border-radius: 1.25rem; letter-spacing: 0.01875rem; }
.wz-channel .wc-change { display: inline-flex; align-items: center; gap: 0.375rem; font-size: 0.82rem; font-weight: 600; color: var(--alpet-blue); background: #fff; border: 1px solid var(--alpet-blue); border-radius: 0.5625rem; padding: 0.5rem 0.875rem; cursor: pointer; font-family: inherit; transition: all var(--transition); flex-shrink: 0; }
.wz-channel .wc-change:hover { background: var(--alpet-blue); color: #fff; }
.wz-channel .wc-change .material-symbols-rounded { font-size: 1.0625rem; }
@media (max-width: 520px) { .wz-channel .wc-change .wc-ct { display: none; } .wz-channel .wc-change { padding: 0.5rem; } }
.wz-layout { display: block; }
.wz-card { background: #fff; border: 1px solid var(--border); border-radius: var(--radius); box-shadow: var(--shadow-sm); }
.wz-chead { padding: 1.125rem 1.375rem 0; }
.wz-chead h2 { font-family: var(--font-display); font-size: 1.16rem; display: flex; align-items: center; gap: 0.625rem; }
.wz-chead h2 .material-symbols-rounded { color: var(--alpet-blue); }
.wz-chead p { font-size: 0.85rem; color: var(--text-muted); margin-top: 0.25rem; }
.wz-cbody { padding: 1.25rem 1.375rem; }
.wz-panel { display: none; }
.wz-panel.active { display: block; animation: wzFade 0.25s ease; }
@keyframes wzFade { from { opacity: 0; transform: translateY(0.375rem); } to { opacity: 1; transform: none; } }
.wz-flabel { font-size: 1.02rem; font-weight: 700; color: var(--gray-900); margin: 0 0 0.8125rem; display: flex; align-items: center; gap: 0.4375rem; }
.wz-flabel .req { color: #d64545; }
.wz-flabel .opt-tag { font-weight: 500; color: var(--text-muted); font-size: 0.74rem; }
.wz-flabel:not(:first-child) { margin-top: 1.5rem; }
.opt-grid { display: grid; gap: 0.75rem; }
.opt-grid.c2 { grid-template-columns: repeat(2, 1fr); }
.opt-grid.c3 { grid-template-columns: repeat(3, 1fr); }
.opt-grid.c4 { grid-template-columns: repeat(2, 1fr); }
@media (max-width: 560px) { .opt-grid.c2, .opt-grid.c3, .opt-grid.c4 { grid-template-columns: 1fr; } }
.opt { display: flex; align-items: center; gap: 0.8125rem; padding: 0.9375rem 1rem; border: 2px solid var(--border); border-radius: 0.8125rem; cursor: pointer; transition: all var(--transition); background: #fff; position: relative; }
.opt:hover { border-color: var(--alpet-blue); background: var(--alpet-blue-light); }
.opt.selected { border-color: var(--alpet-blue); background: var(--alpet-blue-light); box-shadow: var(--shadow-sm); }
.opt .opt-ic { width: 2.75rem; height: 2.75rem; border-radius: 0.75rem; background: var(--alpet-blue-light); color: var(--alpet-blue); display: grid; place-items: center; flex-shrink: 0; }
.opt.selected .opt-ic { background: var(--alpet-blue); color: #fff; }
.opt .opt-ic .material-symbols-rounded { font-size: 1.5rem; }
.opt .opt-txt { flex: 1; min-width: 0; line-height: 1.3; }
.opt .opt-txt strong { font-size: 0.92rem; display: block; }
.opt .opt-txt span { font-size: 0.76rem; color: var(--text-muted); }
.opt .opt-check { position: absolute; top: 0.625rem; right: 0.625rem; width: 1.375rem; height: 1.375rem; border-radius: 50%; background: var(--alpet-blue); color: #fff; display: grid; place-items: center; opacity: 0; transform: scale(0.6); transition: all var(--transition); }
.opt .opt-check .material-symbols-rounded { font-size: 0.9375rem; }
.opt.selected .opt-check { opacity: 1; transform: none; }
.day-chips { display: flex; gap: 0.625rem; flex-wrap: wrap; }
.day-chip { min-width: 5.75rem; padding: 0.6875rem 0.875rem; border: 2px solid var(--border); border-radius: 0.75rem; cursor: pointer; text-align: center; background: #fff; transition: all var(--transition); }
.day-chip:hover { border-color: var(--alpet-blue); }
.day-chip.selected { border-color: var(--alpet-blue); background: var(--alpet-blue-light); }
.day-chip .dc-day { font-family: var(--font-display); font-weight: 800; font-size: 1.12rem; color: var(--gray-900); }
.day-chip .dc-mon { font-size: 0.72rem; color: var(--text-muted); }
.day-chip.selected .dc-mon { color: var(--alpet-blue); }
.sel-ic { position: relative; }
.sel-ic > .material-symbols-rounded { position: absolute; left: 0.8125rem; top: 50%; transform: translateY(-50%); font-size: 1.25rem; color: var(--alpet-blue); pointer-events: none; z-index: 1; }
.sel-ic .select { padding-left: 2.625rem; height: 2.875rem; width: 100%; }
.select option.opt-bad, .select option:disabled { color: #d64545; }
.combo { position: relative; }
.combo-trigger { display: flex; align-items: center; gap: 0.625rem; height: 2.875rem; width: 100%; padding: 0 0.875rem; border: 1px solid var(--border); border-radius: 0.625rem; background: #fff; cursor: pointer; font-size: 0.9rem; color: var(--gray-800); font-weight: 500; transition: all var(--transition); }
.combo-trigger:hover { border-color: var(--alpet-blue); }
.combo-trigger > .material-symbols-rounded:first-child { font-size: 1.25rem; color: var(--alpet-blue); }
.combo-trigger .cb-lbl { flex: 1; text-align: left; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.combo-trigger .cb-lbl.empty { color: var(--text-muted); font-weight: 400; }
.combo-trigger .cb-chev { font-size: 1.125rem; color: var(--gray-500); transition: transform var(--transition); }
.combo.disabled { pointer-events: none; }
.combo.disabled .combo-trigger { background: var(--gray-50); color: var(--text-muted); cursor: not-allowed; }
.combo.disabled .combo-trigger > .material-symbols-rounded:first-child { color: var(--gray-400); }
.combo.open .combo-trigger { border-color: var(--alpet-blue); box-shadow: 0 0 0 3px var(--alpet-blue-light); }
.combo.open .cb-chev { transform: rotate(180deg); }
.combo-pop { position: absolute; top: calc(100% + 0.375rem); left: 0; right: 0; background: #fff; border: 1px solid var(--border); border-radius: 0.75rem; box-shadow: var(--shadow-lg); z-index: 140; overflow: hidden; opacity: 0; visibility: hidden; transform: translateY(-0.5rem); transition: all var(--transition); }
.combo.open .combo-pop { opacity: 1; visibility: visible; transform: none; }
.date-picker { position: relative; max-width: 16.25rem; }
.date-trigger { display: flex; align-items: center; gap: 0.625rem; height: 2.875rem; width: 100%; padding: 0 0.875rem; border: 1px solid var(--border); border-radius: 0.625rem; background: #fff; cursor: pointer; font-size: 0.9rem; color: var(--gray-700); font-weight: 500; transition: all var(--transition); }
.date-trigger:hover { border-color: var(--alpet-blue); }
.date-trigger > .material-symbols-rounded { font-size: 1.25rem; color: var(--alpet-blue); }
.date-trigger .dt-lbl { flex: 1; text-align: left; }
.date-trigger .dt-lbl.empty { color: var(--text-muted); font-weight: 400; }
.date-trigger .dt-chev { font-size: 1.125rem; color: var(--gray-500); }
.date-picker.open .date-trigger { border-color: var(--alpet-blue); box-shadow: 0 0 0 3px var(--alpet-blue-light); }
.cal-pop { position: absolute; top: calc(100% + 0.5rem); left: 0; width: 18.75rem; background: #fff; border: 1px solid var(--border); border-radius: 1rem; box-shadow: var(--shadow-lg); padding: 1rem; z-index: 140; opacity: 0; visibility: hidden; transform: translateY(-0.5rem); transition: all var(--transition); }
.date-picker.open .cal-pop { opacity: 1; visibility: visible; transform: none; }
.cal-head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 0.625rem; }
.cal-head .cal-title { font-family: var(--font-display); font-weight: 700; font-size: 0.95rem; }
.cal-head button { width: 2rem; height: 2rem; border-radius: 0.5rem; border: 1px solid var(--border); background: #fff; color: var(--gray-700); cursor: pointer; display: grid; place-items: center; transition: all var(--transition); }
.cal-head button:hover { background: var(--alpet-blue); color: #fff; border-color: var(--alpet-blue); }
.cal-grid { display: grid; grid-template-columns: repeat(7, 1fr); gap: 0.1875rem; }
.cal-grid .cal-dow { text-align: center; font-size: 0.68rem; font-weight: 600; color: var(--text-muted); text-transform: uppercase; padding: 0.25rem 0; }
.cal-day { aspect-ratio: 1; display: grid; place-items: center; font-size: 0.82rem; border-radius: 0.5rem; cursor: pointer; color: var(--gray-700); transition: all var(--transition); }
.cal-day:hover:not(.empty):not(.disabled) { background: var(--alpet-blue-light); color: var(--alpet-blue); }
.cal-day.empty { cursor: default; }
.cal-day.disabled { color: var(--gray-300); cursor: not-allowed; }
.cal-day.today { font-weight: 700; }
.cal-day.sel { background: var(--alpet-blue); color: #fff; font-weight: 700; }
@media (max-width: 560px) { .cal-pop { width: calc(100vw - 3.75rem); max-width: 20rem; } }
.addr-box { display: flex; align-items: flex-start; gap: 0.5625rem; background: var(--gray-50); border: 1px dashed var(--border); border-radius: 0.6875rem; padding: 0.75rem 0.875rem; font-size: 0.84rem; color: var(--gray-700); line-height: 1.45; }
.addr-box .material-symbols-rounded { font-size: 1.125rem; color: var(--alpet-blue); flex-shrink: 0; margin-top: 1px; }
.addr-box.empty { color: var(--text-muted); font-style: italic; }
.wz-fg label { display: block; font-size: 0.92rem; font-weight: 700; color: var(--gray-800); margin-bottom: 0.4375rem; }
.wz-fg .form-control, .wz-fg .select { height: 2.875rem; width: 100%; }
.wz-frow { display: grid; grid-template-columns: 1fr 1fr; gap: 0.875rem; }
@media (max-width: 520px) { .wz-frow { grid-template-columns: 1fr; } }
.wz-note { display: flex; align-items: flex-start; gap: 0.5625rem; font-size: 0.8rem; color: #8a6d1a; background: #fdf6e3; border: 1px solid #f2e4b8; border-radius: 0.625rem; padding: 0.6875rem 0.8125rem; margin-top: 0.875rem; }
.wz-note .material-symbols-rounded { font-size: 1.125rem; flex-shrink: 0; }
.pick { border: 1px solid var(--border); border-radius: 0.75rem; overflow: hidden; }
.pick-search { position: relative; border-bottom: 1px solid var(--gray-100); }
.pick-search .material-symbols-rounded { position: absolute; left: 0.8125rem; top: 50%; transform: translateY(-50%); font-size: 1.1875rem; color: var(--gray-500); }
.pick-search input { width: 100%; height: 2.75rem; border: none; padding: 0 0.875rem 0 2.5rem; font-size: 0.88rem; background: #fff; }
.pick-search input:focus { outline: none; background: var(--alpet-blue-light); }
.pick-list { max-height: 13.625rem; overflow-y: auto; }
.pick-item { display: flex; align-items: center; gap: 0.75rem; padding: 0.6875rem 0.875rem; border-bottom: 1px solid var(--gray-100); cursor: pointer; transition: background var(--transition); }
.pick-item:last-child { border-bottom: none; }
.pick-item:hover { background: var(--alpet-blue-light); }
.pick-item.selected { background: var(--alpet-blue-light); }
.pick-item .pk-ic { width: 2.25rem; height: 2.25rem; border-radius: 0.625rem; background: var(--alpet-blue-light); color: var(--alpet-blue); display: grid; place-items: center; flex-shrink: 0; }
.pick-item .pk-info { flex: 1; min-width: 0; line-height: 1.3; }
.pick-item .pk-info strong { font-size: 0.88rem; display: block; }
.pick-item .pk-info span { font-size: 0.74rem; color: var(--text-muted); font-variant-numeric: tabular-nums; }
.pick-item .pk-chk { color: var(--alpet-blue); opacity: 0; }
.pick-item.selected .pk-chk { opacity: 1; }
.pick-item.invalid { cursor: not-allowed; background: #fdf0f0; }
.pick-item.invalid:hover { background: #fdecec; }
.pick-item.invalid .pk-ic { background: #fbdcdc; color: #d64545; }
.pick-item.invalid .pk-info strong { color: #b23b3b; }
.pick-item .pk-reason { font-size: 0.72rem; color: #d64545; font-weight: 600; display: flex; align-items: center; gap: 0.25rem; white-space: nowrap; }
.pick-item .pk-reason .material-symbols-rounded { font-size: 0.9375rem; }
.pick-sec { padding: 0.5rem 0.875rem 0.375rem; font-size: 0.7rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.025rem; color: var(--text-muted); background: var(--gray-50); }
.dorse-wrap { margin-top: 0.75rem; }
.dorse-chips { display: flex; gap: 0.625rem; flex-wrap: wrap; }
.dorse-chip { display: inline-flex; align-items: center; gap: 0.5rem; padding: 0.5625rem 0.875rem; border: 2px solid var(--border); border-radius: 0.625rem; cursor: pointer; font-size: 0.86rem; font-weight: 600; transition: all var(--transition); background: #fff; }
.dorse-chip:hover { border-color: var(--alpet-blue); }
.dorse-chip.selected { border-color: var(--alpet-blue); background: var(--alpet-blue-light); color: var(--alpet-blue); }
.dorse-chip .material-symbols-rounded { font-size: 1.125rem; }
.dorse-none { font-size: 0.8rem; color: var(--text-muted); font-style: italic; }
.prod-tbl { width: 100%; border-collapse: collapse; }
.prod-tbl th { text-align: left; font-size: 0.7rem; text-transform: uppercase; letter-spacing: 0.01875rem; color: var(--text-muted); font-weight: 700; padding: 0 0.5rem 0.5rem; }
.prod-tbl th.num, .prod-tbl td.num { text-align: right; }
.prod-tbl td { padding: 0.375rem 0.5rem; vertical-align: middle; }
.prod-tbl .select, .prod-tbl .form-control { height: 2.625rem; width: 100%; min-width: 5.625rem; }
.prod-tbl .p-net, .prod-tbl .p-gross { font-variant-numeric: tabular-nums; font-weight: 600; white-space: nowrap; font-size: 0.86rem; }
.prod-tbl .p-gross { color: var(--alpet-green-dark); }
.prod-del { width: 2.25rem; height: 2.25rem; border-radius: 0.5625rem; border: 1px solid var(--border); background: #fff; color: #d64545; cursor: pointer; display: grid; place-items: center; transition: all var(--transition); }
.prod-del:hover { background: #fdecec; border-color: #f3c9c9; }
.prod-tbl .p-no { text-align: center; font-family: var(--font-display); font-weight: 700; color: var(--gray-500); }
.prod-scroll { overflow-x: auto; }
.prod-tbl { min-width: 53.75rem; }
.prod-tbl .p-unit { font-variant-numeric: tabular-nums; font-weight: 600; white-space: nowrap; }
.mini-spin { display: inline-block; width: 1rem; height: 1rem; border: 2px solid var(--gray-200); border-top-color: var(--alpet-blue); border-radius: 50%; animation: miniSpin 0.7s linear infinite; vertical-align: middle; }
@keyframes miniSpin { to { transform: rotate(360deg); } }
.prod-totals { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0.75rem; margin-top: 1rem; background: var(--gray-50); border: 1px solid var(--gray-100); border-radius: 0.8125rem; padding: 0.875rem 1rem; }
@media (max-width: 620px) { .prod-totals { grid-template-columns: 1fr; } }
.pt-item { display: flex; flex-direction: column; gap: 0.25rem; }
.pt-item + .pt-item { border-left: 1px solid var(--gray-200); padding-left: 1rem; }
@media (max-width: 620px) { .pt-item + .pt-item { border-left: none; padding-left: 0; border-top: 1px solid var(--gray-200); padding-top: 0.625rem; } }
.pt-item .k { display: flex; align-items: center; gap: 0.375rem; font-size: 0.74rem; color: var(--text-muted); text-transform: uppercase; letter-spacing: 0.01875rem; }
.pt-item .k .material-symbols-rounded { font-size: 1rem; color: var(--alpet-blue); }
.pt-item .v { font-family: var(--font-display); font-weight: 800; font-size: 1.12rem; color: var(--gray-900); font-variant-numeric: tabular-nums; }
.pt-item.total .v { color: var(--alpet-blue); font-size: 1.35rem; }
.pt-item.total .k .material-symbols-rounded { color: var(--alpet-green-dark); }
.add-prod { margin-top: 0.875rem; display: inline-flex; align-items: center; gap: 0.4375rem; }
.prod-empty { text-align: center; color: var(--text-muted); font-size: 0.86rem; padding: 1.25rem; border: 1px dashed var(--border); border-radius: 0.6875rem; }
.goz-info { display: flex; gap: 0.75rem; flex-wrap: wrap; margin-bottom: 0.875rem; }
.goz-stat { flex: 1 1 9.375rem; background: var(--gray-50); border: 1px solid var(--gray-100); border-radius: 0.6875rem; padding: 0.6875rem 0.875rem; }
.goz-stat .k { font-size: 0.72rem; color: var(--text-muted); text-transform: uppercase; letter-spacing: 0.01875rem; }
.goz-stat .v { font-family: var(--font-display); font-weight: 800; font-size: 1.05rem; margin-top: 2px; }
.goz-stat .v.ok { color: var(--alpet-green-dark); }
.goz-stat .v.bad { color: #d64545; }
.goz-list { display: grid; grid-template-columns: repeat(2, 1fr); gap: 0.75rem; }
@media (max-width: 620px) { .goz-list { grid-template-columns: 1fr; } }
.goz { border: 2px solid var(--border); border-radius: 0.8125rem; padding: 0.8125rem 0.9375rem; transition: all var(--transition); }
.goz.filled { border-color: var(--alpet-green); background: var(--alpet-green-light); }
.goz .goz-top { display: flex; align-items: center; justify-content: space-between; margin-bottom: 0.625rem; }
.goz .goz-top strong { font-size: 0.9rem; display: flex; align-items: center; gap: 0.4375rem; }
.goz .goz-top strong .material-symbols-rounded { font-size: 1.1875rem; color: var(--alpet-blue); }
.goz .goz-cap { font-size: 0.76rem; color: var(--text-muted); font-variant-numeric: tabular-nums; }
.goz .goz-sel { width: 100%; height: 2.625rem; }
.goz-qty { display: flex; align-items: center; gap: 0.5rem; margin-top: 0.625rem; }
.goz-qty .goz-amt { height: 2.5rem; flex: 1; -moz-appearance: textfield; }
.goz-qty .goz-amt::-webkit-outer-spin-button, .goz-qty .goz-amt::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }
.goz-qty .goz-amt:disabled { background: var(--gray-50); color: var(--text-muted); cursor: not-allowed; }
.goz-qty .gq-unit { font-size: 0.82rem; color: var(--text-muted); font-weight: 600; }
.goz-empty { text-align: center; color: var(--text-muted); font-size: 0.88rem; padding: 1.5rem; border: 1px dashed var(--border); border-radius: 0.6875rem; }
.wz-nav { display: flex; align-items: center; justify-content: space-between; gap: 0.75rem; padding: 1rem 1.375rem; border-top: 1px solid var(--gray-100); background: var(--gray-50); border-radius: 0 0 var(--radius) var(--radius); }
.wz-nav .btn { padding: 0.75rem 1.375rem; }
.wz-nav .btn-back[disabled] { opacity: 0.4; pointer-events: none; }
.wz-sum { background: #fff; border: 1px solid var(--border); border-radius: var(--radius); box-shadow: var(--shadow-sm); overflow: hidden; position: sticky; top: calc(var(--header-h) + 1rem); }
.wz-sum-h { padding: 0.9375rem 1.125rem; border-bottom: 1px solid var(--gray-100); display: flex; align-items: center; gap: 0.5625rem; font-family: var(--font-display); font-weight: 700; }
.wz-sum-h .material-symbols-rounded { color: var(--alpet-blue); }
.wz-sum-b { padding: 0.875rem 1.125rem; }
.sum-row { display: flex; align-items: flex-start; justify-content: space-between; gap: 0.75rem; padding: 0.375rem 0; font-size: 0.83rem; }
.sum-row .sr-k { color: var(--text-muted); flex-shrink: 0; }
.sum-row .sr-v { font-weight: 600; text-align: right; color: var(--gray-900); }
.sum-row .sr-v.empty { color: var(--gray-300); font-weight: 400; }
.sum-div { height: 1px; background: var(--gray-100); margin: 0.5rem 0; }
.sum-prods { display: flex; flex-direction: column; gap: 0.375rem; }
.sum-prod { display: flex; justify-content: space-between; gap: 0.625rem; font-size: 0.81rem; }
.sum-prod .sp-n { color: var(--gray-700); }
.sum-prod .sp-n small { color: var(--text-muted); }
.sum-prod .sp-a { font-variant-numeric: tabular-nums; font-weight: 600; white-space: nowrap; }
.sum-empty { font-size: 0.82rem; color: var(--text-muted); text-align: center; padding: 0.375rem 0; }
.sum-mini { display: flex; justify-content: space-between; font-size: 0.8rem; color: var(--text-muted); padding: 0.1875rem 0; }
.sum-mini b { color: var(--gray-800); font-variant-numeric: tabular-nums; }
.sum-tot { display: flex; justify-content: space-between; align-items: baseline; margin-top: 0.375rem; padding: 0.75rem 0 2px; }
.sum-tot .st-k { font-size: 0.82rem; color: var(--text-muted); }
.sum-tot .st-v { font-family: var(--font-display); font-weight: 800; font-size: 1.35rem; color: var(--alpet-blue); }
.rv-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 0.75rem; }
@media (max-width: 560px) { .rv-grid { grid-template-columns: 1fr; } }
.rv { display: flex; align-items: center; gap: 0.8125rem; border: 1px solid var(--border); border-radius: 0.8125rem; padding: 0.8125rem 0.9375rem; background: var(--gray-50); transition: all var(--transition); }
.rv:hover { border-color: var(--alpet-blue); background: #fff; box-shadow: var(--shadow-sm); }
.rv .rv-ic { width: 2.5rem; height: 2.5rem; border-radius: 0.6875rem; background: #fff; border: 1px solid var(--border); color: var(--alpet-blue); display: grid; place-items: center; flex-shrink: 0; }
.rv .rv-ic .material-symbols-rounded { font-size: 1.3125rem; }
.rv .rv-t { min-width: 0; }
.rv .rv-t .k { display: block; font-size: 0.68rem; color: var(--text-muted); text-transform: uppercase; letter-spacing: 0.03125rem; font-weight: 600; margin-bottom: 0.1875rem; }
.rv .rv-t .v { display: block; font-size: 0.96rem; font-weight: 700; color: var(--gray-900); line-height: 1.3; word-break: break-word; }
.rv-daily { display: flex; align-items: center; gap: 0.5rem; margin-top: 0.875rem; padding: 0.6875rem 0.875rem; background: var(--alpet-blue-light); border-radius: 0.625rem; font-size: 0.82rem; color: var(--alpet-blue); font-weight: 500; }
.rv-daily .material-symbols-rounded { font-size: 1.125rem; flex-shrink: 0; }
.wz-agree { display: flex; align-items: flex-start; gap: 0.75rem; margin-top: 1rem; padding: 0.9375rem 1.0625rem; border: 0.09375rem solid var(--border); border-radius: 0.8125rem; cursor: pointer; transition: all var(--transition); }
.wz-agree:hover { border-color: var(--alpet-blue); background: var(--alpet-blue-light); }
.wz-agree.checked { border-color: var(--alpet-green); background: var(--alpet-green-light); }
.wz-agree input { display: none; }
.wz-agree .agree-box { width: 1.625rem; height: 1.625rem; border-radius: 0.5rem; border: 2px solid var(--gray-300); display: grid; place-items: center; flex-shrink: 0; color: #fff; transition: all var(--transition); margin-top: 1px; }
.wz-agree .agree-box .material-symbols-rounded { font-size: 1.125rem; opacity: 0; transform: scale(0.5); transition: all var(--transition); }
.wz-agree input:checked + .agree-box { background: var(--alpet-green); border-color: var(--alpet-green); }
.wz-agree input:checked + .agree-box .material-symbols-rounded { opacity: 1; transform: none; }
.wz-agree .agree-txt { font-size: 0.92rem; color: var(--gray-800); line-height: 1.5; }
.wz-agree .agree-txt a { color: var(--alpet-blue); font-weight: 700; }
.wz-nav .btn:disabled { opacity: 0.5; pointer-events: none; }
.combo-with-add { display: flex; align-items: stretch; gap: 0.5rem; }
.combo-with-add .combo { flex: 1 1 auto; min-width: 0; }
.combo-add-btn { flex: 0 0 auto; width: 2.875rem; border: 1px solid var(--alpet-blue); background: var(--alpet-blue); color: #fff; border-radius: 0.625rem; display: grid; place-items: center; cursor: pointer; transition: background 0.15s, transform 0.05s; }
.combo-add-btn:hover { background: var(--alpet-blue-dark, #005a9c); }
.combo-add-btn:active { transform: scale(0.96); }
.combo-add-btn .material-symbols-rounded { font-size: 1.375rem; }
.nc-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 0.75rem 1rem; }
.nc-field { display: flex; flex-direction: column; gap: 0.3125rem; }
.nc-field.full { grid-column: 1 / -1; }
.nc-field label { font-size: 0.82rem; font-weight: 600; color: var(--gray-800); }
.nc-field textarea.form-control { resize: vertical; min-height: 2.75rem; }
@media (max-width: 520px) { .nc-grid { grid-template-columns: 1fr; } }
.nc-field .form-control.is-invalid { border-color: #d64545; box-shadow: 0 0 0 3px rgba(214,69,69,0.12); }
#newCustomerDrawer { width: 30vw; min-width: 24rem; }
@media (max-width: 900px) { #newCustomerDrawer { width: auto; min-width: 0; } }

/* ===== siparislerim.css ===== */
.ord-kpis { display: grid; grid-template-columns: repeat(4, 1fr); gap: 1rem; margin-bottom: 1.375rem; }
.ord-kpi { display: flex; align-items: center; gap: 0.875rem; background: #fff; border: 1px solid var(--border); border-radius: var(--radius); box-shadow: var(--shadow-sm); padding: 1rem 1.125rem; position: relative; overflow: hidden; }
.ord-kpi::before { content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: 0.25rem; background: var(--alpet-blue); }
.ord-kpi.green::before { background: var(--alpet-green); }
.ord-kpi.orange::before { background: var(--alpet-orange); }
.ord-kpi.purple::before { background: #6b4de0; }
.ord-kpi .k-ic { width: 2.875rem; height: 2.875rem; border-radius: 0.8125rem; display: grid; place-items: center; background: var(--alpet-blue-light); color: var(--alpet-blue); flex-shrink: 0; }
.ord-kpi.green .k-ic { background: var(--alpet-green-light); color: var(--alpet-green-dark); }
.ord-kpi.orange .k-ic { background: var(--alpet-orange-light); color: #cc6a10; }
.ord-kpi.purple .k-ic { background: #eae6fb; color: #6b4de0; }
.ord-kpi .k-ic .material-symbols-rounded { font-size: 1.5625rem; }
.ord-kpi .k-txt .k-lbl { font-size: 0.76rem; color: var(--text-muted); text-transform: uppercase; letter-spacing: 0.01875rem; }
.ord-kpi .k-txt .k-val { font-family: var(--font-display); font-size: 1.32rem; font-weight: 700; line-height: 1.15; margin-top: 2px; }
@media (max-width: 900px) { .ord-kpis { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 500px) { .ord-kpis { grid-template-columns: 1fr; } }
.ord-filter { background: #fff; border: 1px solid var(--border); border-radius: var(--radius); box-shadow: var(--shadow-sm); padding: 1rem 1.125rem; margin-bottom: 1.375rem; }
.of-top { display: flex; align-items: center; gap: 0.75rem; flex-wrap: wrap; }
.of-search { position: relative; flex: 1 1 16.25rem; min-width: 13.75rem; }
.of-search .material-symbols-rounded { position: absolute; left: 0.8125rem; top: 50%; transform: translateY(-50%); font-size: 1.25rem; color: var(--gray-500); pointer-events: none; }
.of-search input { height: 2.875rem; width: 100%; padding: 0 0.875rem 0 2.625rem; border: 1px solid var(--border); border-radius: 0.75rem; background: var(--gray-50); font-size: 0.92rem; transition: all var(--transition); }
.of-search input:focus { outline: none; background: #fff; border-color: var(--alpet-blue); box-shadow: 0 0 0 3px var(--alpet-blue-light); }
.of-adv-toggle { display: flex; align-items: center; gap: 0.5rem; height: 2.875rem; padding: 0 1rem; border: 1px solid var(--border); border-radius: 0.75rem; background: #fff; cursor: pointer; font-size: 0.9rem; font-weight: 500; color: var(--gray-700); transition: all var(--transition); }
.of-adv-toggle:hover { border-color: var(--alpet-blue); color: var(--alpet-blue); }
.of-adv-toggle .material-symbols-rounded { font-size: 1.1875rem; transition: transform var(--transition); }
.of-adv-toggle.active { background: var(--alpet-blue-light); border-color: var(--alpet-blue); color: var(--alpet-blue); }
.of-adv-toggle.active .material-symbols-rounded.chev { transform: rotate(180deg); }
.of-top .btn { height: 2.875rem; }
.of-chips { display: flex; align-items: center; gap: 0.5rem; flex-wrap: wrap; margin-top: 0.875rem; }
.chip { display: inline-flex; align-items: center; gap: 0.375rem; height: 2.125rem; padding: 0 0.875rem; border: 1px solid var(--border); border-radius: 2.5rem; background: #fff; color: var(--gray-600); font-size: 0.84rem; font-weight: 500; cursor: pointer; transition: all var(--transition); }
.chip:hover { border-color: var(--alpet-blue); color: var(--alpet-blue); }
.chip .dot { width: 0.5rem; height: 0.5rem; border-radius: 50%; background: var(--gray-400); }
.chip.active { background: var(--alpet-blue); border-color: var(--alpet-blue); color: #fff; }
.chip.active .dot { background: #fff; }
.chip .dot.blue { background: var(--alpet-blue); }
.chip .dot.green { background: var(--alpet-green); }
.chip .dot.orange { background: var(--alpet-orange); }
.chip .dot.red { background: #d64545; }
.of-advanced { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0.875rem; max-height: 0; overflow: hidden; opacity: 0; transition: max-height var(--transition), opacity var(--transition), margin var(--transition); }
.of-advanced.open { max-height: 12.5rem; opacity: 1; margin-top: 1rem; padding-top: 1rem; border-top: 1px solid var(--gray-100); overflow: visible; }
.of-field { display: flex; flex-direction: column; gap: 0.375rem; min-width: 0; }
.of-field > label { font-size: 0.74rem; font-weight: 600; color: var(--text-muted); text-transform: uppercase; letter-spacing: 0.01875rem; }
.of-field .form-control, .of-field .select { height: 2.75rem; width: 100%; }
@media (max-width: 640px) { .of-advanced { grid-template-columns: 1fr; } .of-search { flex-basis: 100%; } .date-picker, .of-adv-toggle { flex: 1; } }
.list-head { display: flex; align-items: center; justify-content: space-between; gap: 0.75rem; margin-bottom: 0.875rem; flex-wrap: wrap; }
.list-head .lh-count { font-size: 0.88rem; color: var(--text-muted); }
.list-head .lh-count b { color: var(--gray-800); }
.ord-scroll { overflow-x: auto; }
table.orders { min-width: 58.75rem; }
table.orders td { vertical-align: middle; }
table.orders td .ord-no { font-family: var(--font-display); font-weight: 700; color: var(--alpet-blue); font-size: 0.9rem; display: block; }
table.orders td .muted { font-size: 0.76rem; color: var(--text-muted); }
table.orders .cell-order .o-sub { display: flex; align-items: center; gap: 0.375rem; margin-top: 0.1875rem; font-size: 0.74rem; color: var(--text-muted); }
table.orders .cell-order .o-type { display: inline-block; padding: 1px 0.5rem; border-radius: 1.25rem; background: var(--gray-100); color: var(--gray-600); font-size: 0.7rem; font-weight: 600; }
table.orders .cell-amount { text-align: right; white-space: nowrap; }
table.orders .cell-amount .a-total { font-weight: 700; color: var(--gray-900); font-variant-numeric: tabular-nums; font-size: 0.92rem; }
table.orders .cell-amount .a-sub { font-size: 0.72rem; color: var(--text-muted); font-variant-numeric: tabular-nums; margin-top: 2px; }
table.orders th.num, table.orders .num { text-align: right; }
table.orders .cell-term { display: flex; align-items: center; gap: 0.5625rem; }
table.orders .cell-term .t-ic { width: 2rem; height: 2rem; border-radius: 0.5625rem; background: var(--alpet-blue-light); color: var(--alpet-blue); display: grid; place-items: center; flex-shrink: 0; }
table.orders .cell-term .t-ic .material-symbols-rounded { font-size: 1.125rem; }
table.orders .cust { max-width: 10rem; line-height: 1.3; }
table.orders .cust strong { font-size: 0.84rem; display: block; }
.exp-toggle { width: 2.125rem; height: 2.125rem; border-radius: 0.5625rem; border: 1px solid var(--border); background: #fff; color: var(--alpet-blue); cursor: pointer; display: grid; place-items: center; transition: all var(--transition); }
.exp-toggle:hover { background: var(--alpet-blue); color: #fff; border-color: var(--alpet-blue); }
.exp-toggle .material-symbols-rounded { font-size: 1.25rem; transition: transform var(--transition); }
tr.order-row.open .exp-toggle { background: var(--alpet-blue); color: #fff; }
tr.order-row.open .exp-toggle .material-symbols-rounded { transform: rotate(45deg); }
tr.detail-row > td { padding: 0 !important; background: var(--gray-50); border-bottom: 1px solid var(--gray-100); }
.detail-inner { padding: 1.125rem 1.375rem; display: grid; grid-template-columns: 1.4fr 1fr; gap: 1.375rem; }
.detail-block h4 { font-size: 0.78rem; text-transform: uppercase; letter-spacing: 0.025rem; color: var(--text-muted); margin-bottom: 0.75rem; display: flex; align-items: center; gap: 0.4375rem; }
.detail-block h4 .material-symbols-rounded { font-size: 1.0625rem; color: var(--alpet-blue); }
.d-lines { display: flex; flex-direction: column; gap: 0.5rem; }
.d-line { display: flex; align-items: center; justify-content: space-between; gap: 0.75rem; background: #fff; border: 1px solid var(--border); border-radius: 0.625rem; padding: 0.625rem 0.8125rem; }
.d-line .dl-name { display: flex; align-items: center; gap: 0.5625rem; font-size: 0.86rem; font-weight: 600; }
.d-line .dl-name .material-symbols-rounded { font-size: 1.1875rem; color: var(--alpet-blue); }
.d-line .dl-qty { font-size: 0.82rem; color: var(--text-muted); font-variant-numeric: tabular-nums; }
.d-meta { display: grid; grid-template-columns: 1fr 1fr; gap: 0.625rem 1.125rem; }
.d-meta .dm { line-height: 1.35; }
.d-meta .dm .l { font-size: 0.72rem; color: var(--text-muted); text-transform: uppercase; letter-spacing: 0.01875rem; }
.d-meta .dm .v { font-size: 0.88rem; font-weight: 600; }
.d-actions { display: flex; gap: 0.625rem; margin-top: 1rem; flex-wrap: wrap; }
@media (max-width: 760px) { .detail-inner { grid-template-columns: 1fr; } }
.ord-empty { display: flex; flex-direction: column; align-items: center; gap: 0.625rem; padding: 3rem 1.25rem; text-align: center; }
.ord-empty[hidden] { display: none; }
.ord-empty .material-symbols-rounded { font-size: 2.875rem; color: var(--gray-300); }
.ord-empty p { color: var(--text-muted); font-size: 0.92rem; }
@media (max-width: 760px) {
      .page-head h1 { font-size: 1.5rem; }
      
      .of-top { gap: 0.625rem; }
      .of-search { flex-basis: 100%; order: -1; }
      .date-picker, .of-adv-toggle { flex: 1 1 auto; }
      .of-top .btn { flex: 1 1 100%; justify-content: center; }
      .date-trigger { width: 100%; justify-content: space-between; }
      
      .of-advanced { grid-template-columns: 1fr; }
      .of-advanced.open { max-height: 37.5rem; }
      
      .of-chips { flex-wrap: nowrap; overflow-x: auto; -webkit-overflow-scrolling: touch; padding-bottom: 0.25rem; scrollbar-width: none; }
      .of-chips::-webkit-scrollbar { display: none; }
      .of-chips .chip { flex: 0 0 auto; }
      
      .cal-pop { width: calc(100vw - 2.5rem); max-width: 20rem; left: 0; }
      
      .list-head { flex-direction: column; align-items: stretch; }
      .list-head .btn-outline { justify-content: center; }
      
      .ord-scroll { overflow-x: visible; }
      table.orders { min-width: 0; }
      table.orders td { text-align: right; }
      table.orders .cell-order, table.orders .cell-term, table.orders .cust { text-align: left; }
      table.orders .cell-order .o-sub { justify-content: flex-start; }
      table.orders .cell-amount { text-align: right; }
      table.orders .cust { max-width: none; }
      
      table.orders td[data-label="Detay"] { justify-content: center; }
      table.orders td[data-label="Detay"]::before { display: none; }
      table.orders .exp-toggle { width: 100%; border-radius: 0.625rem; height: 2.5rem; }
      tr.detail-row { display: block !important; }
      tr.detail-row > td { display: block !important; }
      tr.detail-row > td::before { display: none; }
    }

/* ===== sozlesme.css ===== */
.agr-wrap { min-height: 100vh; display: flex; flex-direction: column; align-items: center; padding: 2.5rem 1.25rem; }
.agr-card { width: 100%; max-width: 47.5rem; background: #fff; border: 1px solid var(--border); border-radius: 1.25rem; box-shadow: var(--shadow-lg); overflow: hidden; display: flex; flex-direction: column; }
.agr-head { text-align: center; padding: 1.875rem 1.75rem 1.375rem; border-bottom: 1px solid var(--border); }
.agr-head img { height: 3.25rem; width: auto; margin-bottom: 1rem; }
.agr-head h1 { font-family: var(--font-display); font-size: 1.5rem; color: var(--gray-900); }
.agr-head p { color: var(--text-muted); font-size: 0.92rem; margin-top: 0.375rem; }
.agr-body { position: relative; }
.agr-scroll { max-height: 46vh; overflow-y: auto; padding: 1.5rem 1.75rem; font-size: 0.9rem; line-height: 1.7; color: var(--gray-700); }
.agr-scroll h3 { font-family: var(--font-display); font-size: 1rem; color: var(--alpet-blue); margin: 1.25rem 0 0.5rem; }
.agr-scroll h3:first-child { margin-top: 0; }
.agr-scroll p { margin-bottom: 0.75rem; }
.agr-scroll ul { margin: 0 0 0.75rem 1.25rem; }
.agr-scroll li { margin-bottom: 0.375rem; }
.agr-fade { position: absolute; left: 0; right: 0; bottom: 0; height: 2.5rem; background: linear-gradient(transparent, #fff); pointer-events: none; transition: opacity var(--transition); }
.agr-fade.hide { opacity: 0; }
.agr-foot { padding: 1.25rem 1.75rem 1.5rem; border-top: 1px solid var(--border); background: var(--gray-50); }
.scroll-hint { display: flex; align-items: center; justify-content: center; gap: 0.4375rem; font-size: 0.82rem; color: var(--alpet-orange); font-weight: 600; margin-bottom: 0.875rem; transition: opacity var(--transition); }
.scroll-hint.hide { display: none; }
.agr-check { display: flex; align-items: flex-start; gap: 0.6875rem; padding: 0.875rem; border: 0.09375rem solid var(--border); border-radius: 0.75rem; background: #fff; cursor: pointer; transition: all var(--transition); }
.agr-check.disabled { opacity: 0.55; cursor: not-allowed; }
.agr-check.checked { border-color: var(--alpet-green); background: var(--alpet-green-light); }
.agr-check input { width: 1.25rem; height: 1.25rem; margin-top: 1px; accent-color: var(--alpet-green-dark); flex-shrink: 0; cursor: inherit; }
.agr-check label { font-size: 0.9rem; color: var(--gray-900); cursor: inherit; line-height: 1.5; }
.agr-check label b { font-weight: 600; }
.agr-actions { display: flex; gap: 0.75rem; margin-top: 1.125rem; }
.agr-actions .btn { flex: 1; justify-content: center; padding: 0.8125rem; font-size: 0.98rem; }
.agr-actions .btn-primary:disabled { background: var(--gray-300); cursor: not-allowed; }
.agr-copy { margin-top: 1.375rem; font-size: 0.78rem; color: var(--text-muted); }
@media (max-width: 560px) { .agr-actions { flex-direction: column-reverse; } }

/* ===== telefon-secim.css ===== */
.num-list { display: flex; flex-direction: column; gap: 0.625rem; margin: 0.25rem 0 1.5rem; }
.num-option { display: flex; align-items: center; gap: 0.875rem; padding: 0.875rem 1rem; border: 0.09375rem solid var(--border); border-radius: 0.75rem; background: #fff; cursor: pointer; transition: border var(--transition), box-shadow var(--transition), background var(--transition); }
.num-option:hover { border-color: var(--alpet-blue); background: var(--alpet-blue-light); }
.num-option .n-ico { width: 2.75rem; height: 2.75rem; border-radius: 0.75rem; background: var(--alpet-blue-light); color: var(--alpet-blue); display: grid; place-items: center; flex-shrink: 0; }
.num-option .n-ico .material-symbols-rounded { font-size: 1.4375rem; }
.num-option .n-info { flex: 1; min-width: 0; line-height: 1.3; }
.num-option .n-num { font-family: var(--font-display); font-weight: 600; font-size: 1.05rem; color: var(--gray-900); letter-spacing: 0.03125rem; }
.num-option .n-label { font-size: 0.78rem; color: var(--text-muted); }
.num-option .n-check { width: 1.375rem; height: 1.375rem; border-radius: 50%; border: 2px solid var(--gray-300); flex-shrink: 0; display: grid; place-items: center; transition: all var(--transition); }
.num-option .n-check .material-symbols-rounded { font-size: 1rem; color: #fff; opacity: 0; transform: scale(0.5); transition: all var(--transition); }
.num-option.selected { border-color: var(--alpet-blue); background: var(--alpet-blue-light); box-shadow: 0 0 0 3px var(--alpet-blue-light); }
.num-option.selected .n-check { border-color: var(--alpet-blue); background: var(--alpet-blue); }
.num-option.selected .n-check .material-symbols-rounded { opacity: 1; transform: scale(1); }

/* ===== teminat-mektuplari.css ===== */
.tm-kpis { display: grid; grid-template-columns: repeat(4, 1fr); gap: 1rem; margin-bottom: 1.375rem; }
.tm-kpi { display: flex; align-items: center; gap: 0.875rem; background: #fff; border: 1px solid var(--border); border-radius: var(--radius); box-shadow: var(--shadow-sm); padding: 1rem 1.125rem; position: relative; overflow: hidden; }
.tm-kpi::before { content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: 0.25rem; background: var(--alpet-blue); }
.tm-kpi.green::before { background: var(--alpet-green); }
.tm-kpi.red::before { background: #d64545; }
.tm-kpi.orange::before { background: var(--alpet-orange); }
.tm-kpi .k-ic { width: 2.875rem; height: 2.875rem; border-radius: 0.8125rem; display: grid; place-items: center; background: var(--alpet-blue-light); color: var(--alpet-blue); flex-shrink: 0; }
.tm-kpi.green .k-ic { background: var(--alpet-green-light); color: var(--alpet-green-dark); }
.tm-kpi.red .k-ic { background: #fdecec; color: #d64545; }
.tm-kpi.orange .k-ic { background: var(--alpet-orange-light); color: #cc6a10; }
.tm-kpi .k-ic .material-symbols-rounded { font-size: 1.5625rem; }
.tm-kpi .k-lbl { font-size: 0.76rem; color: var(--text-muted); text-transform: uppercase; letter-spacing: 0.01875rem; }
.tm-kpi .k-val { font-family: var(--font-display); font-size: 1.28rem; font-weight: 800; line-height: 1.15; margin-top: 2px; font-variant-numeric: tabular-nums; }
@media (max-width: 900px) { .tm-kpis { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 500px) { .tm-kpis { grid-template-columns: 1fr; } }
.tm-grid { display: grid; grid-template-columns: 1.2fr 1fr 1fr 1fr; gap: 1rem; align-items: end; }
@media (max-width: 1040px) { .tm-grid { grid-template-columns: 1fr 1fr; } }
@media (max-width: 560px) { .tm-grid { grid-template-columns: 1fr; } }
.ce-field select { height: 2.75rem; width: 100%; padding: 0 0.75rem; border: 1px solid var(--border); border-radius: 0.625rem; background: var(--gray-50); font-size: 0.9rem; font-family: inherit; color: var(--gray-700); transition: all var(--transition); cursor: pointer; }
.ce-field select:focus { outline: none; background: #fff; border-color: var(--alpet-blue); box-shadow: 0 0 0 3px var(--alpet-blue-light); }
.ce-amount { position: relative; }
.ce-amount .cur { position: absolute; left: 0.75rem; top: 50%; transform: translateY(-50%); font-size: 0.95rem; font-weight: 700; color: var(--gray-500); pointer-events: none; }
.ce-amount input { height: 2.75rem; width: 100%; padding: 0 0.75rem 0 1.875rem; border: 1px solid var(--border); border-radius: 0.625rem; background: var(--gray-50); font-size: 0.9rem; font-variant-numeric: tabular-nums; transition: all var(--transition); }
.ce-amount input:focus { outline: none; background: #fff; border-color: var(--alpet-blue); box-shadow: 0 0 0 3px var(--alpet-blue-light); }
.date-range { display: flex; align-items: center; gap: 0.5rem; height: 2.75rem; padding: 0 0.75rem; border: 1px solid var(--border); border-radius: 0.625rem; background: var(--gray-50); transition: all var(--transition); }
.date-range:focus-within { background: #fff; border-color: var(--alpet-blue); box-shadow: 0 0 0 3px var(--alpet-blue-light); }
.date-range input { border: none; background: transparent; font-size: 0.86rem; color: var(--gray-700); width: 100%; min-width: 0; font-family: inherit; }
.date-range input:focus { outline: none; }
.tm-actions-row { display: flex; align-items: center; justify-content: flex-end; gap: 0.875rem; margin-top: 1rem; flex-wrap: wrap; }
table.tm { min-width: 47.5rem; }
table.tm td { vertical-align: middle; }
table.tm .cell-bank { display: flex; align-items: center; gap: 0.75rem; }
table.tm .b-ic { width: 2.5rem; height: 2.5rem; border-radius: 0.6875rem; background: #fff; border: 1px solid var(--border); display: grid; place-items: center; color: var(--alpet-blue); flex-shrink: 0; font-family: var(--font-display); font-weight: 800; font-size: 1rem; }
table.tm .b-name { font-weight: 600; font-size: 0.9rem; }
.tur-badge { display: inline-flex; align-items: center; font-size: 0.72rem; font-weight: 700; padding: 0.1875rem 0.6875rem; border-radius: 1.25rem; white-space: nowrap; }
.tur-badge.kesin { background: var(--alpet-blue-light); color: var(--alpet-blue); }
.tur-badge.gecici { background: #eae6fb; color: #6b4de0; }
.tur-badge.avans { background: var(--alpet-orange-light); color: #cc6a10; }
table.tm .num { text-align: right; font-variant-numeric: tabular-nums; white-space: nowrap; }
table.tm .num.tutar { font-family: var(--font-display); font-weight: 800; color: var(--alpet-blue); }
table.tm .vade-date { font-weight: 600; font-size: 0.86rem; white-space: nowrap; }
.tm-empty { display: flex; flex-direction: column; align-items: center; gap: 0.625rem; padding: 3rem 1.25rem; text-align: center; }
.tm-empty[hidden] { display: none; }
.tm-empty .material-symbols-rounded { font-size: 2.875rem; color: var(--gray-300); }
.tm-empty p { color: var(--text-muted); font-size: 0.92rem; }
@media (max-width: 820px) {
      .ce-scroll { overflow-x: visible; }
      table.tm { min-width: 0; }
      table.tm td { text-align: right; }
      table.tm .cell-bank { justify-content: flex-end; }
    }

/* --- Numara seçimi: radio button sürümü --- */
.num-option { position: relative; }
.num-option .n-radio {
    position: absolute;
    left: 1.25rem;
    top: 50%;
    width: 1px;
    height: 1px;
    margin: 0;
    opacity: 0;
    pointer-events: none;
}
.num-option:has(.n-radio:focus-visible) { outline: 2px solid var(--alpet-blue); outline-offset: 2px; }
.num-option:has(.n-radio:checked) { border-color: var(--alpet-blue); background: var(--alpet-blue-light); box-shadow: 0 0 0 3px var(--alpet-blue-light); }
.num-option:has(.n-radio:checked) .n-check { border-color: var(--alpet-blue); background: var(--alpet-blue); }
.num-option:has(.n-radio:checked) .n-check .material-symbols-rounded { opacity: 1; transform: scale(1); }

/* .dialog içeriği modal konteynerine (OpenPopup) yüklendiğinde de açılabilsin */
.modal-overlay.open .dialog { transform: none; }