/* ==========================================================================
   SosyalBulk — tema stil dosyası (PerfectPanel style.css)
   Mobile-first. Kırılımlar: 576 / 768 / 992 / 1200 / 1400 (Bootstrap 5.3)
   İçindekiler
     1. Tokenlar (light / dark)
     2. Temel (reset, tipografi, yardımcılar)
     3. Ortak bileşenler
     4. Panel iskeleti (sidebar, topbar)
     5. Listeler, form, modal, select2, bottom-sheet
     6. Public site (header, hero, bölümler, footer)
     7. Sayfa-özel küçük eklemeler
   ========================================================================== */

/* 1. Tokenlar ------------------------------------------------------------- */
:root,
[data-theme="light"] {
  --font: "Poppins", Helvetica, Arial, sans-serif;

  /* Marka */
  --brand-navy: #16234A;
  --brand-navy-hover: #223462;
  --brand-blue: #2F6FFF;
  --brand-blue-hover: #5B8BFF;
  --brand-gold: #F0C93D;

  /* Yüzeyler */
  --bg-page: #F5F6F9;
  --bg-public: #FFFFFF;
  --bg-section: #F7F8FB;
  --bg-card: #FFFFFF;
  --bg-input: #F7F8FB;
  --bg-hover: #F0F2F7;
  --bg-subtle: #FAFBFD;
  --bg-elevated: #FFFFFF;
  --border: #E6E8EE;
  --border-strong: #D7DBE6;

  /* Yazı */
  --text: #111111;
  --text-heading: #16234A;
  --text-muted: #777777;
  --text-nav: #333333;
  --highlight: #5B8BFF;

  /* Vurgu */
  --accent: #2F6FFF;
  --accent-hover: #5B8BFF;
  --accent-btn-bg: #2F6FFF;
  --accent-btn-hover: #5B8BFF;
  --accent-btn-fg: #FFFFFF;
  --solid-bg: #16234A;
  --solid-bg-hover: #223462;
  --solid-fg: #FFFFFF;
  --active-bg: #16234A;
  --active-fg: #FFFFFF;
  --selected-bg: #EAF1FF;
  --selected-border: #2F6FFF;
  --selected-fg: #2F6FFF;
  --soft-bg: #EAF1FF;
  --soft-border: #CDDCFF;
  --soft-fg: #1F4FB0;
  --grad-start: #16234A;
  --grad-end: #2F6FFF;
  --on-solid-muted: #D9D9D9;
  --mono-icon: #111111;
  --track: #F2F2F2;

  /* Durumlar */
  --success: #1FAE7A;
  --info: #6C5CE7;
  --warning: #E8A33D;
  --danger: #E5484D;
  --pill-success-bg: #EAF8F0;
  --pill-info-bg: #EEF1FF;
  --pill-warning-bg: #FFF6E5;
  --pill-danger-bg: #FDEDED;
  --pill-success-border: #CDEEE0;
  --pill-danger-border: #F7D3D4;
  --speed: #2F80ED;
  --pill-speed-bg: #EAF2FE;

  /* Platform marka renkleri */
  --pf-instagram: #E1306C;
  --pf-youtube: #FF0000;
  --pf-facebook: #1878F1;
  --pf-telegram: #229ED9;
  --pf-linkedin: #0B66C2;
  --pf-google: #4285F4;
  --pf-spotify: #1DB954;
  --pf-discord: #5865F2;
  --pf-snapchat: #E8C800;
  --pf-twitch: #9146FF;
  --pf-whatsapp: #25D366;
  --pf-kick: #2BC20E;
  --pf-soundcloud: #FF5B15;
  --pf-reddit: #FF4500;
  --pf-pinterest: #E60022;
  --pf-applemusic: #FB3750;
  --pf-quora: #B92B27;
  --pf-bhw: #8A6D3B;
  --pf-phone: #7C5CFF;
  --pf-gold: #FFC53D;
  --pf-instagram-badge: linear-gradient(45deg, #F9CE34, #EE2A7B 50%, #6228D7);

  /* Footer */
  --footer-bg: #111A33;
  --footer-text: #9099B8;
  --footer-link: #C7CBDC;
  --footer-muted: #7C85A3;
  --footer-line: rgba(255, 255, 255, .08);

  /* Diğer */
  --shadow-dropdown: 0 8px 24px rgba(0, 0, 0, .1);
  --shadow-pop: 0 12px 32px rgba(0, 0, 0, .12);
  --shadow-card: 0 20px 50px rgba(0, 0, 0, .08);
  --backdrop: #0A0E1A;
  --scrollbar: #C9CEDA;
  --icon-chevron: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%23777777' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m2 5 6 6 6-6'/%3e%3c/svg%3e");
  --icon-check: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%23ffffff' stroke-linecap='round' stroke-linejoin='round' stroke-width='2.5' d='m3.5 8.5 3 3 6-7'/%3e%3c/svg%3e");

  --icon-threads: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3e%3cpath d='M12.19 24h-.01c-3.58-.02-6.33-1.2-8.18-3.51C2.35 18.44 1.5 15.59 1.47 12v-.02c.03-3.58.88-6.43 2.53-8.48C5.85 1.2 8.6.02 12.18 0h.01c2.75.02 5.04.73 6.83 2.1 1.68 1.29 2.86 3.13 3.51 5.47l-2.04.57c-1.1-3.96-3.9-5.98-8.3-6.02-2.91.02-5.11.94-6.54 2.72C4.31 6.5 3.62 8.91 3.59 12c.03 3.09.72 5.5 2.06 7.16 1.43 1.78 3.63 2.7 6.54 2.72 2.62-.02 4.36-.63 5.8-2.05 1.65-1.61 1.62-3.59 1.09-4.8-.31-.71-.87-1.3-1.63-1.75-.19 1.35-.62 2.45-1.28 3.27-.89 1.1-2.14 1.7-3.73 1.79-1.2.07-2.36-.22-3.26-.8-1.06-.69-1.69-1.74-1.75-2.96-.07-1.19.41-2.29 1.33-3.08.88-.76 2.12-1.21 3.58-1.29a13.85 13.85 0 0 1 3.02.14c-.13-.74-.38-1.33-.75-1.76-.51-.59-1.31-.88-2.36-.89h-.03c-.84 0-1.99.23-2.72 1.32L7.73 7.85c.98-1.45 2.57-2.26 4.48-2.26h.04c3.2.02 5.1 1.98 5.29 5.39l.32.14c1.49.7 2.58 1.76 3.15 3.07.8 1.82.87 4.79-1.55 7.16-1.85 1.81-4.09 2.63-7.28 2.65Zm1-11.69c-.24 0-.49.01-.74.02-1.84.1-2.98.95-2.92 2.14.07 1.26 1.45 1.84 2.78 1.77 1.23-.07 2.82-.54 3.09-3.71a10.5 10.5 0 0 0-2.21-.22Z'/%3e%3c/svg%3e");

  /* İllüstrasyon (laptop animasyonu, avatar yığını) */
  --white: #FFFFFF;
  --illus-frame: #24292B;
  --illus-bezel: #737B7D;
  --illus-grid: rgba(212, 222, 240, .18);
  --illus-skeleton: #EDF5FF;
  --illus-bag-bg: #F4F8FF;
  --illus-bag-border: #E5EDFF;
  --illus-bag-fg: #3075FF;
  --illus-base: linear-gradient(to bottom, #666B6E 0%, #282C30 35%, #101215 70%, #5A6064 100%);
  --illus-avatar-1: #D9C9F2;
  --illus-avatar-2: #C9B8EA;
  --illus-arrow-1: #6FA0FF;
  --illus-arrow-2: #77A2FF;
  --illus-arrow-3: #2470FF;

  /* Bootstrap eşlemesi */
  --bs-body-font-family: var(--font);
  --bs-body-bg: var(--bg-page);
  --bs-body-color: var(--text);
  --bs-border-color: var(--border);
  --bs-secondary-color: var(--text-muted);
  --bs-emphasis-color: var(--text);
  --bs-heading-color: var(--text-heading);
  color-scheme: light;
}

[data-theme="dark"] {
  --bg-page: #121212;
  --bg-public: #121212;
  --bg-section: #171717;
  --bg-card: #171717;
  --bg-input: #1C1C1C;
  --bg-hover: #222222;
  --bg-subtle: #1A1A1A;
  --bg-elevated: #222222;
  --border: #2A2A2A;
  --border-strong: #3A3A3A;

  --text: #FFFFFF;
  --text-heading: #FFFFFF;
  --text-muted: #A0A0A0;
  --text-nav: #CFCFCF;
  --highlight: #C8C8C8;

  --accent: #FFFFFF;
  --accent-hover: #E6E6E6;
  --accent-btn-bg: #FFFFFF;
  --accent-btn-hover: #E6E6E6;
  --accent-btn-fg: #121212;
  --solid-bg: #FFFFFF;
  --solid-bg-hover: #E6E6E6;
  --solid-fg: #121212;
  --active-bg: #FFFFFF;
  --active-fg: #121212;
  --selected-bg: #262626;
  --selected-border: #4A4A4A;
  --selected-fg: #FFFFFF;
  --soft-bg: #1F1F1F;
  --soft-border: #333333;
  --soft-fg: #E0E0E0;
  --grad-start: #2A2A2A;
  --grad-end: #3A3A3A;
  --mono-icon: #FFFFFF;
  --track: #2A2A2A;

  --pill-success-bg: rgba(31, 174, 122, .14);
  --pill-info-bg: rgba(108, 92, 231, .18);
  --pill-warning-bg: rgba(232, 163, 61, .14);
  --pill-danger-bg: rgba(229, 72, 77, .14);
  --pill-success-border: rgba(31, 174, 122, .3);
  --pill-danger-border: rgba(229, 72, 77, .3);
  --speed: #5AA2FF;
  --pill-speed-bg: rgba(47, 128, 237, .16);

  --footer-bg: #0E0E0E;
  --footer-text: #A0A0A0;
  --footer-link: #CFCFCF;
  --footer-muted: #8A8A8A;

  --shadow-dropdown: 0 8px 24px rgba(0, 0, 0, .45);
  --shadow-pop: 0 12px 32px rgba(0, 0, 0, .5);
  --shadow-card: 0 20px 50px rgba(0, 0, 0, .35);
  --scrollbar: #3A3A3A;
  --icon-chevron: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%23a0a0a0' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m2 5 6 6 6-6'/%3e%3c/svg%3e");
  --icon-check: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%23121212' stroke-linecap='round' stroke-linejoin='round' stroke-width='2.5' d='m3.5 8.5 3 3 6-7'/%3e%3c/svg%3e");
  color-scheme: dark;
}

/* 2. Temel ---------------------------------------------------------------- */
body {
  font-family: var(--font);
  font-size: 14px;
  line-height: 1.55;
  color: var(--text);
  background: var(--bg-page);
  -webkit-font-smoothing: antialiased;
  transition: background-color .2s, color .2s;
}

.page-public { background: var(--bg-public); }

a { color: var(--accent); text-decoration: none; }
a:hover { color: var(--accent-hover); }

h1, h2, h3, h4, h5, h6 { color: var(--text-heading); }

img, svg { max-width: 100%; }

::placeholder { color: var(--text-muted); opacity: .85; }

:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }

* { scrollbar-width: thin; scrollbar-color: var(--scrollbar) transparent; }
::-webkit-scrollbar { width: 8px; height: 8px; }
::-webkit-scrollbar-thumb { background: var(--scrollbar); border-radius: 8px; }
::-webkit-scrollbar-track { background: transparent; }

.skip-link {
  position: absolute;
  left: 12px;
  top: -60px;
  z-index: 2000;
  padding: 10px 16px;
  border-radius: 8px;
  background: var(--solid-bg);
  color: var(--solid-fg);
  font-weight: 700;
}
.skip-link:focus { top: 12px; color: var(--solid-fg); }

/* Yazı yardımcıları (Bootstrap'ta olmayan ölçüler) */
.text-2xs { font-size: 10.5px; }
.text-xs { font-size: 11.5px; }
.text-sm { font-size: 12.5px; }
.text-md { font-size: 13.5px; }
.fw-heavy { font-weight: 800; }
.text-accent { color: var(--accent) !important; }
.text-heading { color: var(--text-heading) !important; }
.text-success-brand { color: var(--success) !important; }
.text-danger-brand { color: var(--danger) !important; }
.text-warning-brand { color: var(--warning) !important; }
.min-w-0 { min-width: 0; }
.chev { transition: transform .2s; }
[aria-expanded="true"] > .chev,
[aria-expanded="true"] .chev { transform: rotate(180deg); }

/* Platform ikon renkleri — TikTok / X / Threads dark'ta beyaz */
.pf-instagram { color: var(--pf-instagram); }
.pf-tiktok, .pf-x, .pf-threads { color: var(--mono-icon); }
.pf-youtube { color: var(--pf-youtube); }
.pf-facebook { color: var(--pf-facebook); }
.pf-telegram { color: var(--pf-telegram); }
.pf-linkedin { color: var(--pf-linkedin); }
.pf-google { color: var(--pf-google); }
.pf-spotify { color: var(--pf-spotify); }
.pf-discord { color: var(--pf-discord); }
.pf-snapchat { color: var(--pf-snapchat); }
.pf-twitch { color: var(--pf-twitch); }
.pf-whatsapp { color: var(--pf-whatsapp); }
.pf-kick { color: var(--pf-kick); }
.pf-soundcloud { color: var(--pf-soundcloud); }
.pf-reddit { color: var(--pf-reddit); }
.pf-pinterest { color: var(--pf-pinterest); }
.pf-applemusic { color: var(--pf-applemusic); }
.pf-quora { color: var(--pf-quora); }
.pf-bhw { color: var(--pf-bhw); }
.pf-phone { color: var(--pf-phone); }
.pf-gold { color: var(--pf-gold); }

/* Threads: FA5'te yok — maske ile, renk currentColor */
.icon-threads {
  display: inline-block;
  width: 1em;
  height: 1em;
  vertical-align: -.125em;
  background: currentColor;
  -webkit-mask: var(--icon-threads) center / contain no-repeat;
          mask: var(--icon-threads) center / contain no-repeat;
}

/* 3. Ortak bileşenler ----------------------------------------------------- */

/* Logo */
.brand-logo {
  display: inline-flex;
  align-items: baseline;
  gap: 6px;
  font-weight: 700;
  line-height: 1;
  color: var(--text);
}
.brand-logo:hover { color: var(--text); }
.brand-logo__five { font-size: 26px; font-style: italic; color: var(--brand-gold); }
.brand-logo__text { font-size: 17px; letter-spacing: 1px; }
.brand-logo--lg .brand-logo__five { font-size: 30px; }
.brand-logo--lg .brand-logo__text { font-size: 19px; }

/* Kart */
.card-brand {
  min-width: 0;
  padding: 16px;
  background: var(--bg-card);
  border: 1px solid var(--border);
  border-radius: 14px;
}
.card-brand--flush { padding: 0; overflow: hidden; }
.card-brand--link { transition: border-color .15s; }
.card-brand--link:hover { border-color: var(--selected-border); }
.card-brand--inset { background: var(--bg-input); border-radius: 12px; padding: 12px 14px; }
.card-brand--fill { height: 100%; }
.card-brand--solid { background: var(--grad-start); border-color: transparent; color: var(--white); }
.card-brand--gradient {
  position: relative;
  overflow: hidden;
  border: 0;
  color: var(--white);
  background: linear-gradient(120deg, var(--grad-start), var(--grad-end));
}
.card-brand--gradient > :not(.card-brand__wave) { position: relative; z-index: 1; }
.card-brand__wave {
  position: absolute;
  right: 0;
  bottom: 0;
  width: 360px;
  max-width: 75%;
  opacity: .3;
  pointer-events: none;
}
.card-brand__wave--flip { left: 0; right: auto; top: 0; bottom: auto; transform: scaleX(-1); opacity: .22; }
.card-brand__head {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 8px 11px;
  padding: 14px 16px;
  background: var(--bg-subtle);
  border-bottom: 1px solid var(--border);
}
.card-brand__head > i { width: 16px; text-align: center; color: var(--accent); font-size: 13px; }
.card-brand__body { padding: 16px; }
.card-brand__title { margin: 0; font-size: 15px; font-weight: 800; color: var(--text-heading); }
.card-brand__title--lg { font-size: 17px; }
.card-brand__muted { color: var(--on-solid-muted); }

@media (min-width: 768px) {
  .card-brand { padding: 22px 24px; }
  .card-brand--flush { padding: 0; }
  .card-brand--inset { padding: 14px 16px; }
  .card-brand__head { padding: 16px 22px; }
  .card-brand__body { padding: 20px 22px; }
  .card-brand__title--lg { font-size: 18px; }
}

/* Sayfa başlığı */
.page-title { margin: 0; font-size: 20px; font-weight: 800; letter-spacing: -.2px; color: var(--text-heading); }
.page-subtitle { margin: 5px 0 0; font-size: 13px; color: var(--text-muted); }
@media (min-width: 992px) { .page-title { font-size: 22px; } }

/* Butonlar */
.btn-brand,
.btn-brand-outline,
.btn-soft,
.btn-ghost {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-height: 44px;
  padding: 10px 20px;
  border: 1px solid transparent;
  border-radius: 10px;
  font-family: inherit;
  font-size: 13.5px;
  font-weight: 700;
  line-height: 1.2;
  text-align: center;
  cursor: pointer;
  transition: background-color .2s, border-color .2s, color .2s;
}
.btn-brand { background: var(--solid-bg); color: var(--solid-fg); }
.btn-brand:hover { background: var(--solid-bg-hover); color: var(--solid-fg); }
.btn-brand--accent { background: var(--accent-btn-bg); color: var(--accent-btn-fg); }
.btn-brand--accent:hover { background: var(--accent-btn-hover); color: var(--accent-btn-fg); }
.btn-brand--lg { min-height: 52px; padding: 14px 20px; font-size: 15px; }
.btn-brand--sm { min-height: 36px; padding: 7px 12px; font-size: 12px; border-radius: 8px; }
.btn-brand--on-dark { background: rgba(255, 255, 255, .14); color: var(--white); }
.btn-brand--on-dark:hover { background: rgba(255, 255, 255, .22); color: var(--white); }
.btn-brand--telegram { background: var(--pf-telegram); color: var(--white); }
.btn-brand--telegram:hover { filter: brightness(1.08); color: var(--white); }
.btn-brand-outline { background: transparent; color: var(--accent); border-color: var(--accent); }
.btn-brand-outline:hover { background: var(--accent-btn-bg); border-color: var(--accent-btn-bg); color: var(--accent-btn-fg); }
.btn-soft { background: var(--bg-input); border-color: var(--border); color: var(--text); font-weight: 600; }
.btn-soft:hover { border-color: var(--selected-border); color: var(--text); }
.btn-soft--sm { min-height: 36px; padding: 7px 12px; font-size: 12px; border-radius: 8px; }
.btn-ghost { background: transparent; border-color: var(--border); color: var(--text-muted); font-weight: 600; }
.btn-ghost:hover { background: var(--bg-hover); color: var(--text); }
.btn-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  width: 44px;
  height: 44px;
  padding: 0;
  border: 1px solid var(--border);
  border-radius: 10px;
  background: transparent;
  color: var(--text);
  cursor: pointer;
}
.btn-icon:hover { background: var(--bg-hover); color: var(--text); }
.btn-icon--plain { border-color: transparent; color: var(--text-muted); }
.btn-icon--sm { width: 32px; height: 32px; border-radius: 8px; font-size: 12px; }
.btn-icon--success { background: var(--pill-success-bg); border-color: var(--pill-success-border); color: var(--success); }
.btn-icon--danger { background: var(--pill-danger-bg); border-color: var(--pill-danger-border); color: var(--danger); }
.btn-icon--success:hover, .btn-icon--danger:hover { filter: brightness(.96); }
.btn-icon--success:hover { color: var(--success); background: var(--pill-success-bg); }
.btn-icon--danger:hover { color: var(--danger); background: var(--pill-danger-bg); }
.btn-theme { border-radius: 50%; }
.btn-theme .fa-moon,
[data-theme="dark"] .btn-theme .fa-sun { display: none; }
[data-theme="dark"] .btn-theme .fa-moon { display: inline-block; }
@media (min-width: 992px) {
  .btn-icon { width: 40px; height: 40px; }
  .btn-icon--sm { width: 32px; height: 32px; }
}

/* Avatar */
.avatar {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  width: 40px;
  height: 40px;
  border: 0;
  border-radius: 50%;
  background: var(--grad-start);
  color: var(--white);
  font-size: 13px;
  font-weight: 700;
}
.avatar--square { width: 34px; height: 34px; border-radius: 8px; font-size: 12px; }

/* Etiketler / durum pill'leri */
.status-pill {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 5px 10px;
  border-radius: 999px;
  background: var(--bg-hover);
  color: var(--text-muted);
  font-size: 11px;
  font-weight: 700;
  line-height: 1.3;
  white-space: nowrap;
}
.status-pill--success { background: var(--pill-success-bg); color: var(--success); }
.status-pill--info { background: var(--pill-info-bg); color: var(--info); }
.status-pill--warning { background: var(--pill-warning-bg); color: var(--warning); }
.status-pill--danger { background: var(--pill-danger-bg); color: var(--danger); }
.status-pill--speed { background: var(--pill-speed-bg); color: var(--speed); }
.status-pill--accent { background: var(--selected-bg); color: var(--selected-fg); }
.status-pill--lg { padding: 6px 14px; font-size: 12px; }
.status-pill--dot { padding: 0; background: transparent; font-size: 11.5px; }
.status-pill--dot::before { content: ""; width: 6px; height: 6px; border-radius: 50%; background: currentColor; }
.status-pill--dot.status-pill--accent { color: var(--accent); }

.id-pill {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  max-width: 100%;
  padding: 4px 7px;
  border: 0;
  border-radius: 6px;
  background: var(--bg-input);
  color: var(--accent);
  font-family: inherit;
  font-size: 11px;
  font-weight: 700;
  white-space: nowrap;
}
.id-pill i { font-size: 9px; }
button.id-pill { cursor: pointer; }

.section-badge {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 6px 14px;
  border-radius: 20px;
  background: var(--selected-bg);
  color: var(--text-heading);
  font-size: 13px;
  font-weight: 700;
}

/* İkon kutusu */
.icon-box {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  width: 32px;
  height: 32px;
  border-radius: 9px;
  background: var(--bg-input);
  color: var(--accent);
  font-size: 13px;
}
.icon-box--circle { border-radius: 50%; }
.icon-box--lg { width: 48px; height: 48px; border-radius: 12px; font-size: 20px; }
.icon-box--xl { width: 64px; height: 64px; border-radius: 50%; font-size: 26px; }
.icon-box--on-dark { background: rgba(255, 255, 255, .18); color: var(--white); }
.icon-box--success { background: var(--pill-success-bg); color: var(--success); }
.icon-box--info { background: var(--pill-info-bg); color: var(--info); }
.icon-box--warning { background: var(--pill-warning-bg); color: var(--warning); }
.icon-box--danger { background: var(--pill-danger-bg); color: var(--danger); }
.icon-box--accent { background: var(--selected-bg); color: var(--selected-fg); }
.icon-box--telegram { background: var(--pf-telegram); color: var(--white); }

/* Anahtar / değer listesi */
.kv-list { display: flex; flex-direction: column; gap: 10px; margin: 0; padding: 0; list-style: none; }
.kv-list__item { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; font-size: 13px; }
.kv-list__key { flex-shrink: 0; color: var(--text-muted); font-size: 12.5px; }
.kv-list__val { min-width: 0; font-weight: 700; color: var(--text-heading); text-align: right; overflow-wrap: anywhere; }
.kv-list__item--sep { padding-top: 10px; border-top: 1px solid var(--border); }

/* İstatistik kartı */
.stat-card { display: flex; flex-direction: column; gap: 12px; height: 100%; }
.stat-card__label { font-size: 13px; font-weight: 600; color: var(--text-muted); }
.stat-card__value { font-size: 22px; font-weight: 800; line-height: 1.15; color: var(--text-heading); }
.stat-card__unit { font-size: 14px; font-weight: 600; color: var(--text-muted); }
.stat-card__note { font-size: 12px; color: var(--text-muted); }
.stat-card__link { display: inline-flex; align-items: center; gap: 6px; margin-top: auto; font-size: 12.5px; font-weight: 700; color: var(--accent); }
.stat-card__link i { font-size: 10px; }
.card-brand--gradient .stat-card__label { color: var(--on-solid-muted); }
.card-brand--gradient .stat-card__value,
.card-brand--gradient .stat-card__link { color: var(--white); }
@media (min-width: 1200px) { .stat-card__value { font-size: 26px; } }

/* Küçük istatistik kutusu (özet, detay) */
.mini-stat {
  display: flex;
  flex-direction: column;
  gap: 6px;
  min-width: 0;
  padding: 12px 14px;
  background: var(--bg-input);
  border: 1px solid var(--border);
  border-radius: 12px;
}
.mini-stat__label { display: flex; justify-content: space-between; align-items: center; gap: 8px; font-size: 11.5px; color: var(--text-muted); }
.mini-stat__value { font-size: 14px; font-weight: 700; color: var(--text-heading); overflow-wrap: anywhere; }
.mini-stat__value--lg { font-size: 19px; font-weight: 800; }
.mini-stat--row { flex-direction: row; justify-content: space-between; align-items: center; }

/* Bilgi kutusu */
.note-box {
  padding: 14px 16px;
  border: 1px solid var(--soft-border);
  border-radius: 10px;
  background: var(--soft-bg);
  color: var(--soft-fg);
  font-size: 13px;
}
.note-box--warning { border-color: transparent; background: var(--pill-warning-bg); color: var(--text-muted); font-size: 12px; }
.note-box--warning > i { color: var(--warning); }
.note-box__list { margin: 8px 0 0; padding-left: 18px; font-weight: 700; }

/* Kod örneği */
.code-sample {
  margin: 0;
  padding: 14px 16px;
  overflow-x: auto;
  border: 1px solid var(--border);
  border-radius: 10px;
  background: var(--bg-input);
  color: var(--text);
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: 12px;
  line-height: 2;
}

/* Filtre çipleri — mobilde yatay kaydırılır, md+ sarmalanır */
.filter-chips {
  display: flex;
  gap: 8px;
  margin: 0;
  padding: 0 0 4px;
  overflow-x: auto;
  list-style: none;
  scrollbar-width: none;
}
.filter-chips::-webkit-scrollbar { display: none; }
.filter-chips > li { flex-shrink: 0; }
.filter-chip {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  min-height: 44px;
  padding: 9px 16px;
  border: 1px solid var(--border);
  border-radius: 9px;
  background: var(--bg-input);
  color: var(--text-nav);
  font-family: inherit;
  font-size: 13px;
  font-weight: 600;
  white-space: nowrap;
  cursor: pointer;
  transition: background-color .15s, border-color .15s, color .15s;
}
.filter-chip:hover { border-color: var(--selected-border); }
.filter-chip.is-active { background: var(--active-bg); border-color: var(--active-bg); color: var(--active-fg); }
.filter-chip > i { font-size: 12px; }
.filter-chip__count { font-size: 11px; font-weight: 700; opacity: .8; }
.filter-chips--center { justify-content: flex-start; }
@media (min-width: 768px) {
  .filter-chips { flex-wrap: wrap; overflow: visible; padding-bottom: 0; }
  .filter-chips--center { justify-content: center; }
  .filter-chip { min-height: 40px; }
}

/* Platform butonları */
.platform-list {
  display: grid;
  grid-auto-flow: column;
  grid-auto-columns: 128px;
  gap: 8px;
  margin: 0;
  padding: 0 0 4px;
  overflow-x: auto;
  list-style: none;
  scroll-snap-type: x proximity;
}
.platform-list > li { scroll-snap-align: start; }
.platform-btn {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  width: 100%;
  height: 44px;
  padding: 0 10px;
  overflow: hidden;
  border: 1px solid var(--border);
  border-radius: 10px;
  background: transparent;
  color: var(--text);
  font-family: inherit;
  font-size: 13px;
  font-weight: 600;
  white-space: nowrap;
  cursor: pointer;
  transition: border-color .15s, background-color .15s;
}
.platform-btn > i { font-size: 15px; }
.platform-btn:hover { border-color: var(--selected-border); }
.platform-btn.is-active { background: var(--selected-bg); border-color: var(--selected-border); }
@media (min-width: 992px) {
  .platform-list {
    grid-auto-flow: row;
    grid-template-columns: repeat(auto-fill, minmax(128px, 1fr));
    overflow: visible;
    padding-bottom: 0;
  }
}

/* Platform rozeti (seçim listelerinde) */
.pf-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  width: 26px;
  height: 26px;
  border-radius: 7px;
  background: var(--accent-btn-bg);
  color: var(--accent-btn-fg);
  font-size: 14px;
}
.pf-badge--instagram { background: var(--pf-instagram-badge); color: var(--white); }
.pf-badge--tiktok, .pf-badge--x { background: var(--mono-icon); color: var(--bg-card); }
.pf-badge--youtube { background: var(--pf-youtube); color: var(--white); }

/* Sekme bağlantıları (Sipariş Ver üstü) */
.order-tabs {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
  margin: 0;
  padding: 0;
  list-style: none;
}
.order-tabs__link {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  min-height: 46px;
  padding: 12px;
  border: 1px solid var(--border);
  border-radius: 11px;
  color: var(--text);
  font-size: 14px;
  font-weight: 500;
}
.order-tabs__link:hover { border-color: var(--selected-border); color: var(--text); }
.order-tabs__link.is-active { background: var(--selected-bg); border-color: var(--selected-border); color: var(--selected-fg); font-weight: 700; }
@media (min-width: 992px) { .order-tabs { grid-template-columns: repeat(4, minmax(0, 1fr)); } }

/* Alt çizgili sekmeler (Ayarlar) */
.tabs-line {
  display: flex;
  gap: 26px;
  margin: 0;
  padding: 0;
  list-style: none;
  border-bottom: 1px solid var(--border);
}
.tabs-line__btn {
  display: flex;
  align-items: center;
  gap: 8px;
  min-height: 44px;
  margin-bottom: -1px;
  padding: 0 2px;
  border: 0;
  border-bottom: 2px solid transparent;
  background: none;
  color: var(--text-muted);
  font-family: inherit;
  font-size: 13.5px;
  font-weight: 700;
}
.tabs-line__btn.active { color: var(--accent); border-bottom-color: var(--accent); }

/* Hap sekmeler (SSS kategorileri) */
.tabs-pill {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 44px;
  padding: 11px 20px;
  border: 1px solid var(--border);
  border-radius: 10px;
  background: var(--bg-card);
  color: var(--text-nav);
  font-family: inherit;
  font-size: 13.5px;
  font-weight: 600;
  white-space: nowrap;
  transition: all .2s;
}
.tabs-pill.active { background: var(--active-bg); border-color: var(--active-bg); color: var(--active-fg); }

/* Sayfalama */
.pagination-brand { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; margin: 0; padding: 0; list-style: none; }
.pagination-brand__link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 40px;
  height: 40px;
  padding: 0 12px;
  border: 1px solid var(--border);
  border-radius: 9px;
  background: var(--bg-card);
  color: var(--text-muted);
  font-size: 12.5px;
  font-weight: 700;
}
.pagination-brand__link:hover { border-color: var(--selected-border); color: var(--text); }
.pagination-brand__link.is-active { background: var(--active-bg); border-color: var(--active-bg); color: var(--active-fg); }
.pagination-brand__link.is-disabled { opacity: .5; pointer-events: none; }
.pagination-brand__gap { display: inline-flex; align-items: flex-end; height: 40px; padding: 0 4px 10px; color: var(--text-muted); font-weight: 700; }

/* Tablo */
.table-brand-wrap { overflow-x: auto; -webkit-overflow-scrolling: touch; }
.table-brand { width: 100%; margin: 0; border-collapse: collapse; font-size: 13px; color: var(--text); }
.table-brand th,
.table-brand td { padding: 13px 16px; border-bottom: 1px solid var(--border); text-align: left; vertical-align: middle; white-space: nowrap; }
.table-brand thead th {
  background: var(--bg-subtle);
  color: var(--text-muted);
  font-size: 11.5px;
  font-weight: 700;
  letter-spacing: .3px;
  text-transform: uppercase;
}
.table-brand tbody tr { transition: background .15s; }
.table-brand tbody tr:hover { background: var(--bg-hover); }
.table-brand tbody tr:last-child td { border-bottom: 0; }
.table-brand .text-end { text-align: right; }
.table-brand__wrap-cell { min-width: 240px; max-width: 360px; white-space: normal; }
.table-brand__strong { font-weight: 600; color: var(--text-heading); }
.table-brand__actions { display: inline-flex; gap: 6px; }
@media (min-width: 768px) {
  .table-brand th:first-child,
  .table-brand td:first-child { padding-left: 22px; }
  .table-brand th:last-child,
  .table-brand td:last-child { padding-right: 22px; }
}
.card-brand__foot { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px; padding: 14px 16px; border-top: 1px solid var(--border); }
@media (min-width: 768px) { .card-brand__foot { padding: 16px 22px; } }

/* Akordeon / SSS */
.faq-list { display: flex; flex-direction: column; margin: 0; padding: 0; list-style: none; }
.faq-item { border-bottom: 1px solid var(--border); }
.faq-item__q {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  width: 100%;
  min-height: 44px;
  padding: 16px 2px;
  border: 0;
  background: none;
  color: var(--text-heading);
  font-family: inherit;
  font-size: 14px;
  font-weight: 700;
  text-align: left;
}
.faq-item__q > .chev { flex-shrink: 0; font-size: 12px; color: var(--text-muted); }
.faq-item__a { margin: 0; padding: 0 2px 16px; color: var(--text-muted); font-size: 13.5px; line-height: 1.7; }
.faq-list--boxed { gap: 10px; }
.faq-list--boxed .faq-item { overflow: hidden; border: 1px solid var(--border); border-radius: 12px; background: var(--bg-card); }
.faq-list--boxed .faq-item__q { padding: 16px; font-size: 15px; }
.faq-list--boxed .faq-item__a { padding: 0 16px 18px; font-size: 14px; line-height: 1.75; }
.faq-list--compact { gap: 8px; }
.faq-list--compact .faq-item { border-radius: 10px; }
.faq-list--compact .faq-item__q { padding: 12px 16px; font-size: 14px; }
.faq-list--compact .faq-item__q[aria-expanded="true"] { background: var(--bg-input); }
.faq-list--compact .faq-item__a { padding: 0 16px 14px; font-size: 13.5px; line-height: 1.65; background: var(--bg-input); }
.chev-round {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  width: 26px;
  height: 26px;
  border-radius: 50%;
  background: var(--grad-start);
  color: var(--white);
  font-size: 11px;
  transition: transform .25s;
}
.faq-list--compact .chev-round { width: 22px; height: 22px; font-size: 10px; }
[aria-expanded="true"] > .chev-round { transform: rotate(180deg); }
@media (min-width: 768px) {
  .faq-list--boxed .faq-item__q { padding: 18px 20px; }
  .faq-list--boxed .faq-item__a { padding: 0 20px 20px; }
}

/* Adım listesi */
.step-list { display: flex; flex-direction: column; gap: 14px; margin: 0; padding: 0; list-style: none; }
.step-list__item { display: flex; align-items: flex-start; gap: 12px; color: var(--text-muted); font-size: 12.5px; line-height: 1.7; }
.step-num {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  width: 24px;
  height: 24px;
  border-radius: 50%;
  background: var(--bg-input);
  color: var(--accent);
  font-size: 11.5px;
  font-weight: 800;
}

/* Özellik listesi (ikon + başlık + açıklama) */
.feature-list { display: flex; flex-direction: column; gap: 22px; margin: 0; padding: 0; list-style: none; }
.feature-list__item { display: flex; align-items: flex-start; gap: 12px; }
.feature-list__title { margin: 0; font-size: 13px; font-weight: 700; color: var(--text-heading); }
.feature-list__text { margin: 2px 0 0; font-size: 12px; color: var(--text-muted); }
.feature-list--cards { gap: 16px; }
.feature-list--cards .feature-list__item { gap: 16px; padding: 20px; border: 1px solid var(--border); border-radius: 16px; background: var(--bg-subtle); }
.feature-list--cards .feature-list__title { margin-bottom: 6px; font-size: 16px; }
.feature-list--cards .feature-list__text { font-size: 14px; line-height: 1.6; }
@media (min-width: 768px) { .feature-list--cards .feature-list__item { padding: 24px; } }

/* 4. Panel iskeleti ------------------------------------------------------- */
.app-sidebar__panel {
  --bs-offcanvas-width: 280px;
  --bs-offcanvas-bg: var(--bg-card);
  --bs-offcanvas-color: var(--text);
  --bs-offcanvas-border-color: var(--border);
}
.app-sidebar__inner { display: flex; flex-direction: column; height: 100%; padding: 20px 14px; overflow-y: auto; }
.app-sidebar__head { display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 2px 4px 18px 10px; }
.app-nav { display: flex; flex-direction: column; gap: 4px; margin: 0; padding: 0; list-style: none; }
.app-nav__link {
  display: flex;
  align-items: center;
  gap: 12px;
  min-height: 44px;
  padding: 10px 14px;
  border-radius: 8px;
  color: var(--text-nav);
  font-size: 14px;
  font-weight: 600;
}
.app-nav__link > i { flex-shrink: 0; width: 18px; text-align: center; font-size: 15px; }
.app-nav__link:hover { background: var(--bg-hover); color: var(--text); }
.app-nav__link.is-active { background: var(--active-bg); color: var(--active-fg); }
.app-sidebar__account { margin-top: auto; padding-top: 16px; }
.account-menu { margin: 0 0 10px; padding: 6px; list-style: none; border: 1px solid var(--border); border-radius: 12px; background: var(--bg-input); }
.account-menu__link {
  display: flex;
  align-items: center;
  gap: 12px;
  min-height: 44px;
  padding: 10px 12px;
  border-radius: 8px;
  color: var(--text);
  font-size: 13.5px;
  font-weight: 600;
}
.account-menu__link > i { width: 16px; text-align: center; font-size: 14px; }
.account-menu__link:hover { background: var(--bg-hover); color: var(--text); }
.account-menu__link--danger, .account-menu__link--danger:hover { color: var(--danger); }
.account-card {
  display: flex;
  align-items: center;
  gap: 10px;
  width: 100%;
  padding: 10px 12px;
  border: 1px solid var(--border);
  border-radius: 10px;
  background: transparent;
  color: var(--text);
  font-family: inherit;
  text-align: left;
}
.account-card:hover { background: var(--bg-hover); }
.account-card__meta { flex: 1; min-width: 0; }
.account-card__name { display: block; font-size: 13.5px; font-weight: 700; }
.account-card__mail { display: block; font-size: 11.5px; color: var(--text-muted); }
.account-card > .chev { flex-shrink: 0; font-size: 11px; color: var(--text-muted); }

.app-topbar {
  position: sticky;
  top: 0;
  z-index: 1020;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  height: 60px;
  padding: 0 12px;
  background: var(--bg-card);
  border-bottom: 1px solid var(--border);
}
.app-topbar__start { display: flex; align-items: center; gap: 10px; min-width: 0; }
.app-topbar__welcome { margin: 0; font-size: 15px; font-weight: 600; color: var(--text-heading); }
.app-topbar__meta { font-size: 13.5px; color: var(--text-muted); }
.app-topbar__meta strong { color: var(--text-heading); }
.app-topbar__actions { display: flex; align-items: center; gap: 8px; }
.topbar-chip {
  display: inline-flex;
  align-items: center;
  gap: 9px;
  min-height: 44px;
  padding: 8px 12px;
  border: 1px solid var(--border);
  border-radius: 8px;
  background: var(--bg-input);
  color: var(--text-heading);
  font-family: inherit;
  font-size: 13.5px;
  font-weight: 700;
  white-space: nowrap;
}
.topbar-chip > i:first-child { font-size: 13px; color: var(--accent); }
.topbar-chip > .chev { font-size: 10px; color: var(--text-muted); }

/* Mobil topbar: dil + bakiye + tema + avatar sığsın diye sıkı düzen */
@media (max-width: 575.98px) {
  .app-topbar { gap: 8px; }
  .app-topbar__start { gap: 8px; }
  .app-topbar__actions { gap: 6px; }
  .app-topbar .btn-icon,
  .app-topbar .avatar { width: 38px; height: 38px; }
  .topbar-chip { gap: 6px; min-height: 38px; padding: 6px 9px; font-size: 12.5px; }
}
/* Mobil alt menü */
.bottom-nav {
  position: fixed;
  inset: auto 0 0 0;
  z-index: 1046; /* offcanvas (1045) üstünde: menü açıkken "Kapat" tıklanabilsin */
  padding: 6px 4px calc(6px + env(safe-area-inset-bottom));
  background: var(--bg-card);
  border-top: 1px solid var(--border);
  border-radius: 16px 16px 0 0;
  box-shadow: 0 -6px 24px rgba(0, 0, 0, .06);
}
.bottom-nav__list { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); margin: 0; padding: 0; list-style: none; }
.bottom-nav__link {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 3px;
  width: 100%;
  padding: 4px 2px;
  border: 0;
  background: none;
  color: var(--text-muted);
  font-family: inherit;
  font-size: 10.5px;
  font-weight: 600;
  line-height: 1.2;
  text-align: center;
  text-decoration: none;
  -webkit-tap-highlight-color: transparent;
}
.bottom-nav__icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 44px;
  height: 30px;
  border-radius: 999px;
  font-size: 16px;
  transition: background .15s, color .15s;
}
.bottom-nav__link:hover,
.bottom-nav__link.is-active,
.bottom-nav__link[aria-expanded="true"] { color: var(--text-heading); }
.bottom-nav__link.is-active .bottom-nav__icon,
.bottom-nav__link[aria-expanded="true"] .bottom-nav__icon { background: var(--selected-bg); color: var(--selected-fg); }
.bottom-nav__link:focus-visible { outline: 0; }
.bottom-nav__link:focus-visible .bottom-nav__icon { box-shadow: 0 0 0 2px var(--selected-border); }
@media (max-width: 991.98px) {
  .app-content { padding-bottom: calc(96px + env(safe-area-inset-bottom)); }
  .app-sidebar__inner { padding-bottom: calc(88px + env(safe-area-inset-bottom)); }
}
[data-theme="dark"] .bottom-nav { box-shadow: 0 -6px 24px rgba(0, 0, 0, .4); }

@media (max-width: 339.98px) {
  .app-topbar .brand-logo__text { display: none; }
}

.app-content { padding: 16px 12px 40px; }
.app-container { display: flex; flex-direction: column; gap: 16px; max-width: 1440px; margin: 0 auto; }

@media (min-width: 576px) {
  .app-topbar { padding: 0 16px; }
  .app-content { padding: 20px 16px 40px; }
}
@media (min-width: 992px) {
  .app-sidebar {
    position: fixed;
    inset: 0 auto 0 0;
    z-index: 1030;
    width: 264px;
    background: var(--bg-card);
    border-right: 1px solid var(--border);
    box-shadow: 2px 0 12px rgba(0, 0, 0, .03);
  }
  .app-sidebar__panel { height: 100%; }
  .app-sidebar__inner { width: 100%; }
  .app-main { margin-left: 264px; }
  .app-topbar { height: 72px; padding: 0 32px; }
  .app-topbar__actions { gap: 10px; }
  .topbar-chip { min-height: 40px; }
  .app-content { padding: 28px 36px 48px; }
  .app-container { gap: 20px; }
}
@media (min-width: 1200px) { .app-content { padding: 36px 40px 56px; } }

/* Dropdown */
.dropdown-brand {
  --bs-dropdown-bg: var(--bg-card);
  --bs-dropdown-color: var(--text);
  --bs-dropdown-border-color: var(--border);
  --bs-dropdown-border-radius: 10px;
  --bs-dropdown-box-shadow: var(--shadow-dropdown);
  --bs-dropdown-font-size: 13.5px;
  --bs-dropdown-padding-y: 0;
  --bs-dropdown-item-padding-x: 14px;
  --bs-dropdown-item-padding-y: 10px;
  --bs-dropdown-link-color: var(--text);
  --bs-dropdown-link-hover-color: var(--text);
  --bs-dropdown-link-hover-bg: var(--bg-hover);
  --bs-dropdown-link-active-color: var(--selected-fg);
  --bs-dropdown-link-active-bg: var(--selected-bg);
  --bs-dropdown-divider-bg: var(--border);
  --bs-dropdown-divider-margin-y: 0;
  min-width: 180px;
  overflow: hidden;
  box-shadow: var(--bs-dropdown-box-shadow);
}
.dropdown-brand .dropdown-item { display: flex; align-items: center; gap: 10px; min-height: 44px; font-weight: 600; }
.dropdown-brand .dropdown-item.is-active { background: var(--selected-bg); color: var(--selected-fg); }
.dropdown-brand .dropdown-item.is-active::after { content: "\f00c"; margin-left: auto; font-family: "Font Awesome 5 Free"; font-weight: 900; font-size: 11px; }
.dropdown-brand .dropdown-item--danger { color: var(--danger); }
.dropdown-brand .dropdown-item--danger:hover { color: var(--danger); }
.dropdown-brand__cta { margin: 8px; }
.dropdown-brand__flag { font-size: 15px; line-height: 1; }

/* 5. Listeler ------------------------------------------------------------- */
/* .list-orders: mobilde kart, geniş ekranda grid "tablo" görünümü.
   Kolonlar --list-cols ile modifier'da tanımlanır. */
.list-orders { --list-cols: minmax(0, 1fr) auto; --list-pad-x: 16px; display: grid; gap: 12px; margin: 0; padding: 0; list-style: none; }
.list-orders__head { display: none; }
.list-orders__row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 10px 12px;
  padding: 14px var(--list-pad-x);
  background: var(--bg-card);
  border: 1px solid var(--border);
  border-radius: 14px;
}
.list-orders__cell {
  grid-column: 1 / -1;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px 12px;
  min-width: 0;
  font-size: 12.5px;
  color: var(--text);
}
.list-orders__cell[data-label]::before { content: attr(data-label); flex-shrink: 0; font-size: 11.5px; font-weight: 600; color: var(--text-muted); }
.list-orders__cell--lead { grid-column: 1; grid-row: 1; justify-content: flex-start; }
.list-orders__cell--title { grid-row: 2; }
.list-orders__cell--aside { grid-column: 2; grid-row: 1; justify-content: flex-end; }
.list-orders__cell--start { justify-content: flex-start; }
.list-orders__cell--stack { flex-direction: column; align-items: stretch; }
.list-orders__cell--actions { justify-content: flex-end; flex-wrap: wrap; padding-top: 12px; border-top: 1px solid var(--border); }
.list-orders__text { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.list-orders__progress { display: flex; flex-direction: column; gap: 5px; width: 100%; max-width: 180px; }
.list-orders__title { min-width: 0; font-size: 13px; font-weight: 600; color: var(--text-heading); }
.list-orders__muted { color: var(--text-muted); }
.list-orders--flush { --list-pad-x: 0px; gap: 0; }
.card-brand--flush .list-orders--flush { --list-pad-x: 16px; }
.list-orders--flush .list-orders__row { padding: 12px var(--list-pad-x); border: 0; border-bottom: 1px solid var(--border); border-radius: 0; background: transparent; }
.list-orders--flush .list-orders__row:last-child { border-bottom: 0; }

/* Tablo görünümü — standart: md, --wide: xxl */
@media (min-width: 768px) {
  .list-orders:not(.list-orders--flush) { --list-pad-x: 20px; }
  .card-brand--flush .list-orders--flush { --list-pad-x: 22px; }
  .list-orders:not(.list-orders--wide) { gap: 0; overflow: hidden; background: var(--bg-card); border: 1px solid var(--border); border-radius: 14px; }
  .list-orders:not(.list-orders--wide) .list-orders__head,
  .list-orders:not(.list-orders--wide) .list-orders__row { display: grid; grid-template-columns: var(--list-cols); gap: 12px; padding: 14px var(--list-pad-x); border: 0; border-bottom: 1px solid var(--border); border-radius: 0; background: transparent; }
  .list-orders:not(.list-orders--wide) .list-orders__head { background: var(--bg-subtle); color: var(--text-muted); font-size: 10.5px; font-weight: 700; letter-spacing: .3px; text-transform: uppercase; }
  .list-orders:not(.list-orders--wide) .list-orders__row:last-child { border-bottom: 0; }
  .list-orders:not(.list-orders--wide) .list-orders__row:hover { background: var(--bg-hover); }
  .list-orders:not(.list-orders--wide) .list-orders__cell { grid-column: auto; grid-row: auto; justify-content: flex-start; padding: 0; border: 0; }
  .list-orders:not(.list-orders--wide) .list-orders__cell::before { content: none; }
  .list-orders:not(.list-orders--wide) .list-orders__cell--end { justify-content: flex-end; }
  .list-orders:not(.list-orders--wide) .list-orders__cell--center { justify-content: center; }
  .list-orders--flush:not(.list-orders--wide) { border: 0; border-radius: 0; background: transparent; }
}
@media (min-width: 1400px) {
  .list-orders--wide { gap: 0; overflow: hidden; background: var(--bg-card); border: 1px solid var(--border); border-radius: 14px; }
  .list-orders--wide .list-orders__head,
  .list-orders--wide .list-orders__row { display: grid; grid-template-columns: var(--list-cols); gap: 8px; padding: 14px 16px; border: 0; border-bottom: 1px solid var(--border); border-radius: 0; background: transparent; }
  .list-orders--wide .list-orders__head { color: var(--text-muted); font-size: 10.5px; font-weight: 700; letter-spacing: .2px; text-transform: uppercase; }
  .list-orders--wide .list-orders__row:last-child { border-bottom: 0; }
  .list-orders--wide .list-orders__row:hover { background: var(--bg-hover); }
  .list-orders--wide .list-orders__cell { grid-column: auto; grid-row: auto; justify-content: flex-start; padding: 0; border: 0; }
  .list-orders--wide .list-orders__cell::before { content: none; }
  .list-orders--wide .list-orders__cell--end { justify-content: flex-end; }
}
@media (min-width: 768px) and (max-width: 1399.98px) {
  .list-orders--wide { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

/* İnce ilerleme çubuğu (<progress>) */
.progress-thin {
  display: block;
  width: 100%;
  height: 4px;
  overflow: hidden;
  border: 0;
  border-radius: 99px;
  background: var(--track);
  color: var(--accent);
  appearance: none;
}
.progress-thin::-webkit-progress-bar { background: var(--track); border-radius: 99px; }
.progress-thin::-webkit-progress-value { background: currentColor; border-radius: 99px; }
.progress-thin::-moz-progress-bar { background: currentColor; border-radius: 99px; }
.progress-thin--success { color: var(--success); }
.progress-thin--danger { color: var(--danger); }

/* Destek talepleri */
.ticket-list { margin: 0; padding: 0; list-style: none; }
.ticket-list__link {
  --_c: var(--accent);
  display: block;
  padding: 13px 14px 13px 12px;
  border-left: 3px solid var(--_c);
  border-bottom: 1px solid var(--border);
  color: var(--text-heading);
  transition: all .15s;
}
.ticket-list__link:hover { padding-left: 10px; border-left-width: 5px; background: var(--bg-hover); color: var(--text-heading); }
.ticket-list__link--success { --_c: var(--success); }
.ticket-list__top { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin-bottom: 6px; font-size: 12.5px; }
.ticket-list__bottom { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 8px; }
.ticket-list__new { padding: 2px 5px; border-radius: 6px; background: var(--bg-input); color: var(--accent); font-size: 9.5px; font-weight: 700; }

/* Mesajlaşma */
.chat { display: flex; flex-direction: column; gap: 18px; margin: 0; padding: 20px 16px; list-style: none; }
.chat__msg { align-self: flex-start; max-width: 92%; }
.chat__msg--own { align-self: flex-end; }
.chat__bubble {
  padding: 14px 16px;
  border: 1px solid var(--border);
  border-radius: 12px 12px 12px 2px;
  background: var(--bg-input);
  color: var(--text);
  font-size: 13.5px;
  line-height: 1.7;
}
.chat__msg--own .chat__bubble { border-color: var(--soft-border); border-radius: 12px 12px 2px 12px; background: var(--selected-bg); }
.chat__fields { margin: 0; }
.chat__fields dt { font-weight: 700; }
.chat__fields dd { margin: 0 0 8px; }
.chat__fields dd:last-child { margin-bottom: 0; }
.chat__meta { display: flex; align-items: center; gap: 6px; margin-top: 6px; font-size: 11px; color: var(--text-muted); }
.chat__msg--own .chat__meta { justify-content: flex-end; }
.chat__meta::before { content: ""; width: 6px; height: 6px; border-radius: 50%; background: var(--grad-start); }
.chat__msg--own .chat__meta::before { background: var(--accent-btn-bg); }
.chat__divider { display: flex; align-items: center; gap: 12px; color: var(--danger); font-size: 10.5px; font-weight: 800; letter-spacing: .3px; }
.chat__divider::before, .chat__divider::after { content: ""; flex: 1; height: 1px; background: var(--border); }
@media (min-width: 768px) {
  .chat { padding: 26px 24px; }
  .chat__msg { max-width: 78%; }
}

/* Form ------------------------------------------------------------------- */
.form-label-brand { display: block; margin-bottom: 7px; font-size: 13px; font-weight: 600; color: var(--text-heading); }
.form-label-brand--caps { font-size: 11.5px; font-weight: 700; color: var(--text-muted); letter-spacing: .3px; text-transform: uppercase; }
.form-control-brand {
  display: block;
  width: 100%;
  min-height: 48px;
  padding: 12px 15px;
  border: 1px solid var(--border);
  border-radius: 10px;
  background-color: var(--bg-input);
  color: var(--text);
  font-family: inherit;
  font-size: 16px;
  line-height: 1.4;
  outline: 0;
  appearance: none;
  transition: border-color .15s;
}
.form-control-brand:focus { border-color: var(--selected-border); }
select.form-control-brand {
  padding-right: 40px;
  background-image: var(--icon-chevron);
  background-repeat: no-repeat;
  background-position: right 15px center;
  background-size: 12px;
  font-weight: 600;
  cursor: pointer;
}
textarea.form-control-brand { min-height: 0; resize: vertical; }
.form-control-brand--surface { min-height: 52px; border-radius: 14px; background-color: var(--bg-card); }
.form-control-brand--mono { font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; line-height: 1.9; }
.form-control-brand.is-invalid { border-color: var(--danger); }
.form-control-brand[readonly] { background-color: var(--bg-hover); }
.form-hint { margin: 7px 0 0; font-size: 11.5px; color: var(--text-muted); }
.form-hint.is-invalid { color: var(--danger); }
.service-desc {
  max-height: 160px;
  margin: 0;
  padding: 12px 15px;
  overflow-y: auto;
  overscroll-behavior: contain;
  list-style: none;
  border: 1px solid var(--border);
  border-radius: 10px;
  background: var(--bg-input);
  color: var(--text-muted);
  font-size: 12.5px;
  line-height: 1.75;
  outline: 0;
}
.service-desc:focus-visible { border-color: var(--selected-border); }
/* Taşan içerikte alt kenarda solma; sona gelince kalkar */
.service-desc.is-scrollable:not(.is-end) {
  -webkit-mask-image: linear-gradient(to bottom, #000 calc(100% - 36px), transparent);
  mask-image: linear-gradient(to bottom, #000 calc(100% - 36px), transparent);
}
@media (min-width: 992px) {
  .form-control-brand { font-size: 14px; }
  .form-control-brand--sm { min-height: 34px; padding: 6px 30px 6px 10px; font-size: 12.5px; border-radius: 7px; background-position: right 10px center; }
}

.input-icon { position: relative; display: block; }
.input-icon > i { position: absolute; top: 50%; left: 15px; transform: translateY(-50%); color: var(--text-muted); font-size: 13px; pointer-events: none; }
.input-icon > .form-control-brand { padding-left: 40px; }
.input-icon--end > .form-control-brand { padding-right: 88px; }
.input-icon__actions { position: absolute; top: 50%; right: 6px; display: flex; gap: 2px; transform: translateY(-50%); }

.check-brand {
  flex-shrink: 0;
  width: 18px;
  height: 18px;
  margin: 0;
  border: 1.5px solid var(--border-strong);
  border-radius: 5px;
  background: transparent center / 12px no-repeat;
  appearance: none;
  cursor: pointer;
  vertical-align: middle;
}
.check-brand:checked { border-color: var(--accent-btn-bg); background-color: var(--accent-btn-bg); background-image: var(--icon-check); }
.check-brand:disabled { opacity: .45; cursor: not-allowed; }
.check-brand--telegram:checked { border-color: var(--pf-telegram); background-color: var(--pf-telegram); }
.check-label { display: inline-flex; align-items: center; gap: 9px; min-height: 44px; color: var(--text-muted); font-size: 13px; cursor: pointer; }
.check-label--top { align-items: flex-start; line-height: 1.6; }
.check-label--top .check-brand { margin-top: 3px; }

.switch-brand {
  position: relative;
  flex-shrink: 0;
  width: 50px;
  height: 28px;
  margin: 0;
  border: 0;
  border-radius: 99px;
  background: var(--border-strong);
  appearance: none;
  cursor: pointer;
  transition: background-color .2s;
}
.switch-brand::before {
  content: "";
  position: absolute;
  top: 3px;
  left: 3px;
  width: 22px;
  height: 22px;
  border-radius: 50%;
  background: var(--white);
  box-shadow: 0 1px 3px rgba(0, 0, 0, .25);
  transition: transform .2s;
}
.switch-brand:checked { background: var(--success); }
.switch-brand:checked::before { transform: translateX(22px); }

/* Salt okunur alan görünümü */
.field-static {
  display: flex;
  align-items: center;
  gap: 9px;
  min-height: 48px;
  min-width: 0;
  padding: 12px 14px;
  border: 1px solid var(--border);
  border-radius: 9px;
  background: var(--bg-hover);
  color: var(--text-heading);
  font-size: 13.5px;
  font-weight: 600;
}
.field-static > i { flex-shrink: 0; font-size: 12px; color: var(--text-muted); }
.field-static__end { margin-left: auto; }

/* Modal ------------------------------------------------------------------ */
.modal-backdrop, .offcanvas-backdrop { --bs-backdrop-bg: var(--backdrop); --bs-backdrop-opacity: .55; }
.modal-brand {
  --bs-modal-width: 460px;
  --bs-modal-bg: var(--bg-card);
  --bs-modal-color: var(--text);
  --bs-modal-border-color: var(--border);
  --bs-modal-border-radius: 16px;
  --bs-modal-inner-border-radius: 15px;
  --bs-modal-header-padding: 16px 18px;
  --bs-modal-header-border-color: var(--border);
  --bs-modal-padding: 18px;
  --bs-modal-box-shadow: 0 24px 60px rgba(10, 15, 28, .35);
}
.modal-brand .modal-dialog { display: flex; align-items: flex-end; min-height: 100%; margin: 0; }
.modal-brand .modal-content { max-height: 88vh; border-radius: 16px 16px 0 0; box-shadow: var(--bs-modal-box-shadow); }
.modal-brand .modal-body { overflow-y: auto; }
.modal-brand.fade .modal-dialog { transform: translateY(100%); transition: transform .28s cubic-bezier(.2, .8, .2, 1); }
.modal-brand.show .modal-dialog { transform: none; }
.modal-brand .modal-header { justify-content: space-between; gap: 12px; }
.modal-brand .modal-title { display: flex; align-items: center; gap: 10px; font-size: 15px; font-weight: 700; color: var(--text-heading); }
@media (min-width: 576px) {
  .modal-brand .modal-dialog { align-items: center; min-height: calc(100% - 3.5rem); margin: 1.75rem auto; }
  .modal-brand .modal-content { max-height: 80vh; border-radius: var(--bs-modal-border-radius); }
  .modal-brand.fade .modal-dialog { transform: translateY(-20px); }
  .modal-brand.show .modal-dialog { transform: none; }
  .modal-brand { --bs-modal-header-padding: 18px 20px; --bs-modal-padding: 20px; }
}

/* Seçim alanı: Select2 (masaüstü) + mobil tetikleyici ortak görünüm ------- */
.picker-trigger,
.select2-container--brand .select2-selection--single {
  position: relative;
  display: flex;
  align-items: center;
  width: 100%;
  min-height: 50px;
  height: auto;
  padding: 10px 40px 10px 12px;
  border: 1px solid var(--border);
  border-radius: 12px;
  background: var(--bg-input) var(--icon-chevron) no-repeat right 14px center / 12px;
  color: var(--text);
  font-family: inherit;
  text-align: left;
  outline: 0;
  cursor: pointer;
}
.picker-trigger[aria-expanded="true"],
.select2-container--brand.select2-container--open .select2-selection--single,
.select2-container--brand.select2-container--focus .select2-selection--single { border-color: var(--selected-border); background-color: var(--selected-bg); }
.select2-container--brand .select2-selection__rendered { flex: 1; min-width: 0; padding: 0; color: var(--text); }
.select2-container--brand .select2-selection__arrow { display: none; }
.select2-container--brand .select2-dropdown {
  margin-top: 6px;
  overflow: hidden;
  border: 1px solid var(--border);
  border-radius: 12px;
  background: var(--bg-card);
  box-shadow: var(--shadow-pop);
}
.select2-container--brand .select2-dropdown--above { margin-top: 0; margin-bottom: 6px; }
.select2-container--brand .select2-search--dropdown { padding: 10px; border-bottom: 1px solid var(--border); }
.select2-container--brand .select2-search__field {
  min-height: 40px;
  padding: 8px 12px 8px 34px;
  border: 1px solid var(--border);
  border-radius: 9px;
  background: var(--bg-input) no-repeat;
  color: var(--text);
  font-family: inherit;
  font-size: 13px;
  outline: 0;
}
.select2-container--brand .select2-search--dropdown { position: relative; }
.select2-container--brand .select2-search--dropdown::before {
  content: "\f002";
  position: absolute;
  top: 50%;
  left: 22px;
  transform: translateY(-50%);
  color: var(--text-muted);
  font: 900 12px "Font Awesome 5 Free";
}
.select2-container--brand .select2-search__field:focus { border-color: var(--selected-border); }
.select2-container--brand .select2-results > .select2-results__options { max-height: 360px; padding: 8px; overflow-y: auto; }
.select2-container--brand .select2-results__option { padding: 0; margin-bottom: 6px; background: transparent; }
.select2-container--brand .select2-results__option--highlighted .picker-option { border-color: var(--selected-border); }
.select2-container--brand .select2-results__option--selected .picker-option { border-color: var(--selected-border); background: var(--selected-bg); }
.select2-container--brand .select2-results__message { padding: 14px; color: var(--text-muted); font-size: 13px; text-align: center; }

.picker-value { display: flex; align-items: center; gap: 12px; min-width: 0; }
.picker-value__text { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 14px; font-weight: 500; color: var(--text); }
.picker-native.is-sheet-bound { position: absolute; width: 1px; height: 1px; opacity: 0; pointer-events: none; }

.picker-option {
  display: flex;
  flex-shrink: 0;
  align-items: center;
  gap: 12px;
  min-height: 50px;
  padding: 11px 12px;
  border: 1px solid var(--border);
  border-radius: 12px;
  background: var(--bg-subtle);
  color: var(--text);
  cursor: pointer;
}
.picker-option.is-selected { border-color: var(--selected-border); background: var(--selected-bg); }
.picker-option__body { display: flex; flex: 1; flex-direction: column; gap: 3px; min-width: 0; }
.picker-option__title { font-size: 13.5px; }
.picker-option__title > .id-pill { margin-right: 6px; }
.picker-option__tags { display: flex; flex-wrap: wrap; gap: 5px; margin-top: 3px; }
.picker-tag { display: inline-flex; align-items: center; gap: 4px; max-width: 100%; padding: 3px 8px; border: 1px solid var(--border-strong); border-radius: 6px; background: var(--bg-card); color: var(--text-heading); font-size: 11.5px; font-weight: 600; line-height: 1.3; overflow-wrap: anywhere; }
.picker-tag--time { font-weight: 700; white-space: nowrap; }
.picker-tag--success { border-color: var(--pill-success-border); background: var(--pill-success-bg); color: var(--success); }
.picker-tag--info { border-color: transparent; background: var(--pill-info-bg); color: var(--info); }
.picker-tag--warning { border-color: transparent; background: var(--pill-warning-bg); color: var(--warning); }
.picker-tag--danger { border-color: var(--pill-danger-border); background: var(--pill-danger-bg); color: var(--danger); }
.picker-tag--speed { border-color: transparent; background: var(--pill-speed-bg); color: var(--speed); }
.picker-tag.avg-time--fast { border-color: var(--pill-success-border); background: var(--pill-success-bg); }
.picker-tag.avg-time--mid { border-color: transparent; background: var(--pill-warning-bg); }
.picker-tag.avg-time--slow { border-color: var(--pill-danger-border); background: var(--pill-danger-bg); }
/* Ortalama süre rengi: < 2 saat yeşil, 2–24 saat sarı, > 24 saat kırmızı (script.js avgLevel) */
.avg-time--fast, .svc-table .svc-avg.avg-time--fast { color: var(--success); }
.avg-time--mid, .svc-table .svc-avg.avg-time--mid { color: var(--warning); }
.avg-time--slow, .svc-table .svc-avg.avg-time--slow { color: var(--danger); }
.picker-option__price { flex-shrink: 0; font-size: 12.5px; font-weight: 700; white-space: nowrap; }
.picker-option__check { display: none; flex-shrink: 0; color: var(--accent); }
.picker-option.is-selected .picker-option__check { display: inline-block; }

/* Bottom-sheet (mobil seçim) */
.select-sheet { position: fixed; inset: 0; z-index: 1060; display: flex; flex-direction: column; justify-content: flex-end; }
.select-sheet[hidden] { display: none; }
.select-sheet__backdrop { position: absolute; inset: 0; background: var(--backdrop); opacity: 0; transition: opacity .2s; }
.select-sheet__panel {
  position: relative;
  display: flex;
  flex-direction: column;
  height: 85vh;
  height: 85dvh;
  border-radius: 22px 22px 0 0;
  background: var(--bg-card);
  box-shadow: 0 -10px 30px rgba(0, 0, 0, .15);
  transform: translateY(100%);
  transition: transform .28s cubic-bezier(.2, .8, .2, 1);
  touch-action: pan-y;
}
.select-sheet.is-open .select-sheet__backdrop { opacity: .45; }
.select-sheet.is-open .select-sheet__panel { transform: translateY(0); }
.select-sheet.is-dragging .select-sheet__panel { transition: none; }
.select-sheet__grab { padding: 10px 0 4px; cursor: grab; }
.select-sheet__handle { width: 44px; height: 5px; margin: 0 auto; border-radius: 3px; background: var(--border-strong); }
.select-sheet__head { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 8px 16px 14px; }
.select-sheet__title { margin: 0; font-size: 19px; font-weight: 700; color: var(--text-heading); }
.select-sheet__search { padding: 0 16px 12px; }
.select-sheet__list { display: flex; flex: 1; flex-direction: column; gap: 8px; margin: 0; padding: 0 12px 20px; overflow-y: auto; list-style: none; overscroll-behavior: contain; }
.select-sheet__empty { padding: 20px; color: var(--text-muted); font-size: 13.5px; text-align: center; }

/* 6. Public site ---------------------------------------------------------- */
.site-header { background: var(--bg-public); }
.site-header .navbar { --bs-navbar-padding-y: 12px; max-width: 1320px; margin: 0 auto; padding-inline: 16px; }
.site-header__nav { display: flex; flex-direction: column; gap: 4px; margin: 0; padding: 12px 0 0; list-style: none; }
.site-header__link {
  display: flex;
  align-items: center;
  min-height: 44px;
  color: var(--text);
  font-size: 16px;
  font-weight: 600;
  text-decoration: underline;
  text-decoration-color: transparent;
  text-underline-offset: 6px;
  transition: text-decoration-color .25s;
}
.site-header__link:hover { color: var(--text); text-decoration-color: currentColor; }
.site-header__actions { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; padding: 12px 0 8px; }
.site-header__lang { border-radius: 22px; background: transparent; }
.site-header__toggler { border: 1px solid var(--border); }
@media (min-width: 992px) {
  .site-header .navbar { --bs-navbar-padding-y: 16px; padding-inline: 40px; }
  .site-header__nav { flex-direction: row; gap: 36px; margin: 0 auto; padding: 0; }
  .site-header__link { font-size: 17px; }
  .site-header__actions { flex-wrap: nowrap; gap: 20px; padding: 0; }
}

.section { padding: 56px 16px; background: var(--bg-public); }
.section--alt { background: var(--bg-section); }
.section__inner { max-width: 1200px; margin: 0 auto; }
.section--bleed { padding-inline: 0; }
.section--bleed .section__inner { padding-inline: 16px; }
.section__inner--narrow { max-width: 1000px; }
.section__head { max-width: 680px; margin: 0 auto 36px; text-align: center; }
.section__title { margin: 16px 0 12px; font-size: 26px; font-weight: 800; line-height: 1.2; color: var(--text-heading); }
.section__title-hl { color: var(--highlight); }
.section__lead { margin: 0; font-size: 15px; line-height: 1.7; color: var(--text-muted); }
@media (min-width: 768px) {
  .section { padding: 72px 32px; }
  .section--bleed { padding-inline: 0; }
  .section--bleed .section__inner { padding-inline: 32px; }
  .section__title { font-size: 32px; }
  .section__head { margin-bottom: 48px; }
}
@media (min-width: 1200px) {
  .section { padding: 90px 40px; }
  .section__title { font-size: 36px; }
  .section__head { margin-bottom: 56px; }
}

/* Hero */
.hero { max-width: 1320px; margin: 0 auto; padding: 32px 16px 48px; }
.hero__title { margin: 20px 0; font-size: 30px; font-weight: 800; line-height: 1.15; color: var(--text-heading); }
.hero__lead { margin: 0 0 28px; max-width: 560px; color: var(--text-muted); font-size: 15px; line-height: 1.7; }
.hero-perks { display: grid; grid-template-columns: minmax(0, 1fr); gap: 14px 24px; margin: 0; padding: 0; list-style: none; }
.hero-perks__item { display: flex; align-items: center; gap: 12px; font-size: 14.5px; font-weight: 600; line-height: 1.35; color: var(--text-heading); }
.hero-perks .icon-box { width: 34px; height: 34px; border-radius: 10px; background: var(--selected-bg); color: var(--text-heading); font-size: 16px; }
.perk-strip { display: grid; grid-template-columns: minmax(0, 1fr); gap: 18px; margin: 40px 0 0; padding: 24px; list-style: none; border-radius: 18px; background: var(--grad-start); }
.perk-strip__item { display: flex; align-items: center; gap: 16px; color: var(--white); font-size: 15px; font-weight: 600; line-height: 1.4; }
.perk-strip__item > i { flex-shrink: 0; width: 30px; font-size: 26px; text-align: center; }
.perk-strip__item > .fa-percentage { color: var(--brand-gold); }
.perk-strip__item > .fa-headset { color: var(--brand-blue-hover); }
.perk-strip__item > .fa-hand-holding-usd { color: var(--success); }
@media (min-width: 576px) { .hero-perks { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 768px) {
  .hero { padding: 56px 32px 64px; }
  .hero__title { font-size: 38px; }
  .hero__lead { font-size: 17px; margin-bottom: 40px; }
  .perk-strip { grid-template-columns: repeat(3, minmax(0, 1fr)); padding: 32px 16px; margin-top: 56px; }
  .perk-strip__item { padding: 0 16px; border-right: 1px solid rgba(255, 255, 255, .12); }
  .perk-strip__item:last-child { border-right: 0; }
}
@media (min-width: 1200px) {
  .hero { padding: 70px 40px; }
  .hero__title { font-size: 46px; }
  .perk-strip { padding: 32px 40px; }
  .perk-strip__item { padding: 0 24px; }
}

/* Giriş / kayıt kartı */
.auth-card { padding: 24px 18px; border: 1px solid var(--border); border-radius: 20px; background: var(--bg-subtle); box-shadow: var(--shadow-card); }
.auth-card__title { margin: 0 0 8px; font-size: 22px; font-weight: 800; color: var(--text-heading); }
.auth-card__lead { margin: 0 0 24px; font-size: 14px; color: var(--text-muted); }
.auth-card .form-control-brand { background-color: var(--bg-card); }
.trust-bar { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; margin-top: 20px; padding: 14px; border-radius: 14px; background: var(--bg-section); }
.trust-bar__avatars { display: flex; padding-left: 10px; margin: 0; list-style: none; }
.trust-bar__avatars > li { width: 28px; height: 28px; margin-left: -10px; border: 2px solid var(--bg-section); border-radius: 50%; background: var(--grad-start); }
.trust-bar__avatars > li:nth-child(1) { background: var(--illus-avatar-1); }
.trust-bar__avatars > li:nth-child(2) { background: var(--illus-avatar-2); }
.trust-bar__avatars > li:nth-child(3) { background: var(--accent-btn-bg); }
.trust-bar__text { flex: 1; font-size: 13.5px; font-weight: 700; color: var(--text-heading); white-space: nowrap; }
@media (min-width: 768px) { .auth-card { padding: 40px 36px; } }

/* Nasıl çalışır */
.how-steps { position: relative; display: grid; grid-template-columns: minmax(0, 1fr); gap: 20px; margin: 0; padding: 0; list-style: none; }
.how-steps__item {
  position: relative;
  z-index: 1;
  padding: 28px 22px;
  border: 1px solid var(--border);
  border-radius: 16px;
  background: var(--bg-card);
  text-align: center;
  transition: transform .25s;
  animation: rise-in .6s ease both;
}
.how-steps__item:nth-child(2) { animation-delay: .12s; }
.how-steps__item:nth-child(3) { animation-delay: .24s; }
.how-steps__item:nth-child(4) { animation-delay: .36s; }
.how-steps__item:hover { transform: translateY(-6px); }
.how-steps__icon { display: flex; width: 68px; height: 68px; margin: 0 auto 20px; border-radius: 50%; background: var(--selected-bg); color: var(--text-heading); font-size: 26px; transition: background-color .25s, color .25s; }
.how-steps__item:hover .how-steps__icon { background: var(--grad-start); color: var(--white); }
.how-steps__num { display: flex; width: 28px; height: 28px; margin: 0 auto 12px; border-radius: 50%; background: var(--grad-start); color: var(--white); font-size: 13px; font-weight: 700; }
.how-steps__title { margin: 0 0 8px; font-size: 16px; font-weight: 700; color: var(--text-heading); }
.how-steps__text { margin: 0; font-size: 14px; line-height: 1.6; color: var(--text-muted); }
@keyframes rise-in { from { opacity: 0; transform: translateY(24px); } to { opacity: 1; transform: translateY(0); } }
@media (min-width: 768px) { .how-steps { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 1200px) {
  .how-steps { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 28px; }
  .how-steps::before {
    content: "";
    position: absolute;
    top: 34px;
    left: calc(12.5% + 4px);
    right: calc(12.5% + 4px);
    height: 2px;
    background: repeating-linear-gradient(90deg, var(--border-strong) 0 10px, transparent 10px 18px);
  }
}

/* Avantajlar akordeonu kaydırma alanı */
.advantages__list { max-height: 420px; padding-right: 4px; overflow-y: auto; }

/* Laptop animasyonu — oranlı, sabit genişlik yok */
.laptop { position: relative; width: 100%; max-width: 562px; margin: 0 auto; aspect-ratio: 720 / 500; }
.laptop__screen {
  position: absolute;
  inset: 0 0 8% 0;
  overflow: hidden;
  border: 6px solid var(--illus-frame);
  border-radius: 23px 23px 10px 10px;
  background: var(--white);
  box-shadow: inset 0 0 0 2px var(--illus-bezel), 0 10px 30px rgba(0, 0, 0, .08);
}
.laptop__grid {
  position: absolute;
  inset: 7px;
  overflow: hidden;
  border-radius: 13px 13px 5px 5px;
  background: linear-gradient(var(--illus-grid) 1px, transparent 1px), linear-gradient(90deg, var(--illus-grid) 1px, transparent 1px), var(--white);
  background-size: 44px 44px;
}
.laptop__arrow { position: absolute; left: 20%; top: 13.7%; z-index: 5; width: 32%; height: 28%; animation: arrow-move 1.7s ease-in-out infinite alternate; }
.laptop__arrow svg { display: block; width: 100%; height: 100%; }
.laptop__arrow path { fill: none; stroke: url(#arrowGradient); stroke-width: 6; stroke-linecap: round; stroke-linejoin: round; }
.laptop__stop-1 { stop-color: var(--illus-arrow-1); stop-opacity: 0; }
.laptop__stop-2 { stop-color: var(--illus-arrow-2); }
.laptop__stop-3 { stop-color: var(--illus-arrow-3); }
.laptop__wave {
  position: absolute;
  left: 0;
  right: 0;
  top: 38.5%;
  bottom: 0;
  z-index: 2;
  background: url("data:image/svg+xml,%3Csvg%20width%3D%221350%22%20height%3D%22634%22%20viewBox%3D%220%200%201350%20634%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20d%3D%22M640.582%20236.947H719.219C724.322%20236.947%20729.233%20234.996%20732.944%20231.493L818.885%20150.401C822.597%20146.898%20827.508%20144.947%20832.611%20144.947H914.672C919.803%20144.947%20924.738%20142.975%20928.456%20139.438L978.113%2094.3889C983.148%2090.361%20989.378%2089.2138%20995.044%2090.5049C1005.38%2092.859%201016.79%2099.3484%201026.76%2095.7587L1157.28%2048.7593C1160.16%2047.2407%201163.37%2046.947%201166.62%2046.947H1250.75C1255.83%2046.947%201260.73%2045.0094%201264.44%2041.5285L1301.89%206.36555C1305.6%202.8846%201310.5%200.947021%201315.58%200.947021H1394.22%22%20stroke%3D%22%231F6BFF%22%20stroke-width%3D%222%22%3E%3C%2Fpath%3E%3Cpath%20d%3D%22M721.637%20248H646C640.914%20248%20636.019%20249.938%20632.311%20253.419L594.855%20288.581C591.147%20292.062%20586.252%20294%20581.166%20294H494.037C491.271%20294%20488.539%20294.212%20486.015%20295.21C485.12%20295.563%20484.247%20295.974%20483.34%20296.296L352.128%20342.914C342.174%20346.45%20331.596%20338.488%20321.117%20337.155C317.169%20336.653%20312.847%20337.989%20308.531%20341.442L258.874%20386.491C255.156%20390.028%20250.221%20392%20245.09%20392H163.029C157.926%20392%20153.016%20393.951%20149.304%20397.454L63.3627%20478.546C59.6508%20482.049%2054.7404%20484%2049.6368%20484H-14C-25.0457%20484%20-34%20492.954%20-34%20504V637H1393.64V32C1393.64%2020.9543%201384.68%2012%201373.64%2012H1318C1312.91%2012%201308.02%2013.9376%201304.31%2017.4185L1266.86%2052.5815C1263.15%2056.0624%201258.25%2058%201253.17%2058H1166.04C1162.78%2058%201159.58%2058.2937%201156.7%2059.8123L1026.18%20106.812C1016.21%20110.401%201005.56%20102.416%20995.038%20101.145C991.111%20100.671%20986.818%20102.012%20982.531%20105.442L932.874%20150.491C929.157%20154.028%20924.222%20156%20919.09%20156H835.029C829.926%20156%20825.016%20157.951%20821.304%20161.454L735.363%20242.546C731.651%20246.049%20726.74%20248%20721.637%20248Z%22%20fill%3D%22%2387B0FF%22%20fill-opacity%3D%220.5%22%3E%3C%2Fpath%3E%3Cpath%20d%3D%22M-34%20473H44.637C49.7405%20473%2054.6509%20471.049%2058.3628%20467.546L144.304%20386.454C148.016%20382.951%20152.926%20381%20158.03%20381H240.09C245.222%20381%20250.157%20379.028%20253.875%20375.491L303.531%20330.442C308.566%20326.414%20314.797%20325.267%20320.463%20326.558C330.794%20328.912%20342.207%20335.401%20352.176%20331.812L482.702%20284.812C485.579%20283.294%20488.784%20283%20492.037%20283H576.167C581.252%20283%20586.147%20281.062%20589.855%20277.581L627.311%20242.419C631.019%20238.938%20635.914%20237%20641%20237H719.637%22%20stroke%3D%22%231F6BFF%22%20stroke-width%3D%222%22%3E%3C%2Fpath%3E%3C%2Fsvg%3E") 100% 0 / 200% repeat;
  animation: move-graphic 2.5s linear infinite;
}
.laptop__card {
  position: absolute;
  right: 1.4%;
  top: 10%;
  z-index: 10;
  width: 21.5%;
  padding: 2%;
  border-radius: 12px;
  background: var(--white);
  box-shadow: 0 18px 35px rgba(51, 89, 170, .2), 0 3px 8px rgba(0, 0, 0, .05);
  animation: product-float 2.5s ease-in-out infinite alternate;
}
.laptop__products { position: relative; margin: 0; padding: 0; list-style: none; aspect-ratio: 125 / 105; }
.laptop__products > li { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; opacity: 0; animation: product-cycle 10s infinite; }
.laptop__products > li:nth-child(2) { animation-delay: 2.5s; }
.laptop__products > li:nth-child(3) { animation-delay: 5s; }
.laptop__products > li:nth-child(4) { animation-delay: 7.5s; }
.laptop__products img { max-width: 85%; max-height: 95%; object-fit: contain; }
.laptop__meta { display: flex; align-items: center; gap: 8px; margin-top: 6%; }
.laptop__bars { flex: 1; }
.laptop__bars::before, .laptop__bars::after { content: ""; display: block; height: 9px; border-radius: 4px; background: var(--illus-skeleton); }
.laptop__bars::before { margin-bottom: 5px; }
.laptop__bars::after { width: 50%; }
.laptop__bag { display: flex; align-items: center; justify-content: center; flex-shrink: 0; width: 30%; aspect-ratio: 1; border: 1px solid var(--illus-bag-border); border-radius: 10px; background: var(--illus-bag-bg); color: var(--illus-bag-fg); font-size: clamp(10px, 2.2vw, 16px); }
.laptop__base {
  position: absolute;
  left: 50%;
  bottom: 1.6%;
  width: 125%;
  height: 4.6%;
  transform: translateX(-50%);
  background: var(--illus-base);
  clip-path: polygon(0 10%, 100% 10%, 94% 70%, 90% 100%, 10% 100%, 6% 70%);
}
.advantages__visual { overflow: hidden; padding: 0 0 8px; }
@keyframes arrow-move { from { transform: translateY(7px); } to { transform: translateY(-7px); } }
@keyframes move-graphic { from { background-position: 0% 70%; } to { background-position: 100% 0%; } }
@keyframes product-float { from { transform: translateY(5px); } to { transform: translateY(-10px); } }
@keyframes product-cycle {
  0% { opacity: 0; transform: translateY(12px) scale(.92); }
  4%, 25% { opacity: 1; transform: none; }
  29%, 100% { opacity: 0; transform: translateY(12px) scale(.92); }
}
@media (min-width: 992px) { .advantages__visual { position: sticky; top: 24px; } }

/* Güven / istatistik kutuları + kayan platform şeridi */
.stat-tiles { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; margin: 0 0 48px; padding: 0; list-style: none; }
.stat-tiles__item { padding: 20px 10px; border: 1px solid var(--border); border-radius: 14px; background: var(--bg-section); text-align: center; }
.stat-tiles__item:last-child { grid-column: 1 / -1; }
.stat-tiles__value { display: block; font-size: 20px; font-weight: 800; color: var(--text-heading); overflow-wrap: anywhere; }
.stat-tiles__label { display: block; margin-top: 6px; font-size: 12px; line-height: 1.4; color: var(--text-muted); }
@media (min-width: 768px) {
  .stat-tiles { grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 16px; margin-bottom: 64px; }
  .stat-tiles__item { padding: 24px 12px; }
  .stat-tiles__item:last-child { grid-column: auto; }
  .stat-tiles__value { font-size: 22px; }
}
@media (min-width: 1200px) { .stat-tiles__value { font-size: 24px; } }

.marquee { overflow: hidden; -webkit-mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent); mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent); }
.marquee + .marquee { margin-top: 14px; }
.marquee__track { display: flex; gap: 14px; width: max-content; margin: 0; padding: 0; list-style: none; animation: marquee-left 32s linear infinite; }
.marquee--reverse .marquee__track { animation-name: marquee-right; }
.marquee__item {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 12px 20px;
  border: 1px solid var(--border);
  border-radius: 12px;
  background: var(--bg-section);
  color: var(--text-heading);
  font-size: 14px;
  font-weight: 600;
  white-space: nowrap;
}
.marquee__item:hover { border-color: var(--selected-border); color: var(--text-heading); }
.marquee__item > i { width: 20px; font-size: 18px; text-align: center; }
@keyframes marquee-left { from { transform: translateX(0); } to { transform: translateX(-50%); } }
@keyframes marquee-right { from { transform: translateX(-50%); } to { transform: translateX(0); } }

/* Footer */
.site-footer { padding: 48px 16px 0; background: var(--footer-bg); color: var(--footer-text); }
.site-footer__inner { max-width: 1200px; margin: 0 auto; }
.site-footer__grid { display: grid; grid-template-columns: minmax(0, 1fr); gap: 32px; padding-bottom: 40px; border-bottom: 1px solid var(--footer-line); }
.site-footer .brand-logo__text { color: var(--white); }
.site-footer__about { max-width: 320px; margin: 16px 0 20px; font-size: 14px; line-height: 1.75; }
.site-footer__title { margin: 0 0 18px; font-size: 14.5px; font-weight: 700; color: var(--white); }
.site-footer__links { display: flex; flex-direction: column; gap: 4px; margin: 0; padding: 0; list-style: none; }
.site-footer__links a, .site-footer__legal a { display: inline-flex; align-items: center; min-height: 32px; color: var(--footer-link); font-size: 14px; }
.site-footer__links a:hover, .site-footer__legal a:hover { color: var(--white); }
.site-footer__social { display: flex; gap: 10px; margin: 0; padding: 0; list-style: none; }
.site-footer__social a { display: flex; align-items: center; justify-content: center; width: 44px; height: 44px; border-radius: 50%; background: rgba(255, 255, 255, .06); color: var(--white); font-size: 16px; transition: background-color .2s; }
.site-footer__social a:hover { background: var(--brand-blue); color: var(--white); }
.site-footer__bottom { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px; padding: 18px 0; font-size: 13px; color: var(--footer-muted); }
.site-footer__legal { display: flex; gap: 18px; margin: 0; padding: 0; list-style: none; }
.site-footer__legal a { font-size: 13px; }
@media (min-width: 768px) {
  .site-footer { padding: 64px 40px 0; }
  .site-footer__grid { grid-template-columns: 1.4fr 1fr 1fr; gap: 40px; padding-bottom: 48px; }
}

/* 7. Sayfa-özel ----------------------------------------------------------- */

/* Sayfa: Sipariş Ver — tutar satırı */
.order-total { display: flex; flex-direction: column; align-items: flex-start; gap: 2px; padding: 16px 0; border-top: 1px solid var(--border); border-bottom: 1px solid var(--border); }
.order-total__label { font-size: 12px; font-weight: 500; color: var(--text-muted); }
.order-total__value { font-size: 26px; font-weight: 800; line-height: 1.2; letter-spacing: -.3px; color: var(--text-heading); font-variant-numeric: tabular-nums; }

/* Sayfa: Siparişlerim — kolonlar */
.list-orders--orders { --list-cols: 120px minmax(120px, 1fr) minmax(100px, 1.2fr) 56px 48px 60px minmax(150px, 1.5fr) minmax(90px, .8fr) 110px 92px; }

/* Sayfa: Servis Güncellemeleri / Servisler / Affiliates / Ayarlar — kolonlar */
.list-orders--updates { --list-cols: minmax(0, 2.2fr) 110px minmax(0, 1.4fr); }
.list-orders--services { --list-cols: minmax(0, 2fr) minmax(0, .8fr) minmax(0, 1fr) minmax(170px, .9fr); }
.list-orders--payouts { --list-cols: 1.4fr 1fr 1fr; }
.list-orders--notify { --list-cols: minmax(0, 1fr) 90px 90px; }

/* Sayfa: Child Panel — panel listesi kolonları */
.list-orders--panels { --list-cols: minmax(0, 1.6fr) minmax(0, 1fr) 120px 120px max-content; }

/* Sayfa: Affiliates — liderlik podyumu */
.podium { display: flex; align-items: flex-end; justify-content: center; gap: 14px; margin: 0; padding: 0; list-style: none; }
.podium__item { display: flex; flex-direction: column; align-items: center; gap: 6px; }
.podium__bar { display: flex; align-items: flex-end; justify-content: center; width: 38px; height: 70px; padding-bottom: 8px; border-radius: 8px; background: linear-gradient(180deg, var(--grad-end), var(--grad-start)); color: var(--white); font-size: 11px; font-weight: 800; }
.podium__bar--2 { height: 105px; }
.podium__bar--1 { height: 135px; }
.trophy { display: flex; align-items: center; justify-content: center; height: 100px; margin-bottom: 10px; border-radius: 12px; background: linear-gradient(140deg, var(--grad-start), var(--grad-end)); color: var(--pf-gold); font-size: 34px; }
.how-tile { display: flex; align-items: center; justify-content: center; height: 150px; border: 1px solid var(--border); border-radius: 12px; background: var(--bg-input); }

/* Sayfa: Giveaway — katılım adımları */
.join-steps { display: flex; flex-wrap: wrap; justify-content: center; gap: 32px 56px; margin: 0; padding: 0; list-style: none; }
.join-steps__item { display: flex; flex-direction: column; align-items: center; gap: 14px; max-width: 180px; color: var(--on-solid-muted); font-size: 12.5px; text-align: center; }
.join-steps__icon { width: 76px; height: 76px; border-radius: 50%; background: rgba(255, 255, 255, .14); color: var(--white); font-size: 24px; }
.join-steps__title { color: var(--white); font-size: 14.5px; font-weight: 800; }

/* Sayfa: Dashboard — harcama grafiği */
.spend-chart { display: block; width: 100%; height: 200px; overflow: visible; }
.spend-chart__grid { stroke: var(--border); stroke-width: 1; }
.spend-chart__line { fill: none; stroke: var(--accent); stroke-width: 2.5; }
.spend-chart__axis { display: flex; justify-content: space-between; margin: 6px 0 0; padding: 0; list-style: none; font-size: 11px; color: var(--text-muted); }

/* Sayfa: Ayarlar — 2FA durumu */
.twofa__state--on, .twofa:has(.switch-brand:checked) .twofa__state--off { display: none; }
.twofa:has(.switch-brand:checked) .twofa__state--on { display: inline-flex; }
.twofa:has(.switch-brand:checked) .twofa__icon { background: var(--pill-success-bg); color: var(--success); }

/* Sayfa: Toplu Sipariş — satır önizleme */
.bulk-preview { display: flex; flex-direction: column; gap: 8px; margin: 0; padding: 0; list-style: none; }
.bulk-preview__item { display: flex; align-items: center; gap: 10px; padding: 10px 12px; border: 1px solid var(--pill-success-border); border-radius: 9px; background: var(--pill-success-bg); color: var(--success); font-size: 11.5px; }
.bulk-preview__item--bad { border-color: var(--pill-danger-border); background: var(--pill-danger-bg); color: var(--danger); }
.bulk-preview__link { min-width: 0; overflow: hidden; color: var(--text); font-size: 12px; text-overflow: ellipsis; white-space: nowrap; }
.bulk-preview__qty { margin-left: auto; color: var(--text-muted); font-size: 12px; font-weight: 700; }

/* Sayfa: Servisler — kategori başlığı */
.svc-group__toggle { display: flex; align-items: center; justify-content: space-between; gap: 12px; width: 100%; min-height: 56px; padding: 14px 16px; border: 0; background: var(--bg-input); color: var(--text-heading); font-family: inherit; font-size: 14.5px; font-weight: 700; text-align: left; }
.svc-group__chev { display: inline-flex; align-items: center; justify-content: center; flex-shrink: 0; width: 26px; height: 26px; border-radius: 50%; background: var(--bg-card); color: var(--text-muted); font-size: 11px; }
@media (min-width: 768px) { .svc-group__toggle { padding: 16px 20px; } }

/* Sayfa: Bakiye Yükle — ödeme yöntemi kartı, geçmiş paneli */
.scroll-box { max-height: 180px; overflow-y: auto; }
.pay-method { display: flex; flex-direction: column; align-items: center; gap: 8px; width: 100%; height: 100%; padding: 18px 12px; border: 1.5px solid var(--border); border-radius: 12px; background: var(--bg-input); color: var(--text-heading); font-family: inherit; font-size: 13px; font-weight: 700; line-height: 1.35; text-align: center; }
.pay-method > i { font-size: 22px; color: var(--accent); }
.pay-method.is-active { border-color: var(--success); background: var(--pill-success-bg); }
.pay-method.is-active > i { color: var(--success); }
.pay-method__tags { display: flex; flex-wrap: wrap; justify-content: center; gap: 6px; margin-top: auto; }
@media (min-width: 1200px) { .pay-details { position: sticky; top: 90px; } }

/* Sayfa: Affiliates — banner ikonu, lider kartı, gradyan link alanı */
.aff-hero__icon { align-items: center; justify-content: center; flex-shrink: 0; width: 110px; height: 110px; border: 1px solid rgba(255, 255, 255, .22); border-radius: 24px; background: rgba(255, 255, 255, .12); color: var(--white); font-size: 38px; }
.aff-leader { flex-shrink: 0; width: 150px; }
.field-static--gradient { border: 0; background: linear-gradient(120deg, var(--grad-start), var(--grad-end)); }

/* Sayfa: Giveaway — ödül kartı, kural listesi */
.giveaway-hero { max-width: 640px; }
.giveaway-hero__pill { background: rgba(255, 255, 255, .16); color: var(--white); }
.reward-card { display: flex; flex-direction: column; align-items: center; gap: 10px; padding: 22px 18px; text-align: center; }
.reward-card__icon { font-size: 30px; }
.reward-card__title { margin: 0; font-size: 13px; font-weight: 700; color: var(--text-heading); }
.reward-card__desc { flex: 1; margin: 0; font-size: 12px; line-height: 1.5; color: var(--text-muted); }
.rule-list { display: flex; flex-direction: column; gap: 10px; margin: 0; padding-left: 18px; color: var(--text-muted); font-size: 13px; line-height: 1.6; }
.rule-list > li::marker { font-size: 10px; }

/* ==========================================================================
   PerfectPanel uyumluluğu
   Panelin kendi script'leri Bootstrap 3 sınıflarıyla markup üretir
   (.hidden, .form-group, .control-label, .help-block, .close…).
   Bootstrap 5'te olmayanları burada tanımlıyor, hepsini tasarıma uyduruyoruz.
   ========================================================================== */

/* Panel script'i göster/gizle için kullanır — Bootstrap 5'te yok */
.hidden { display: none !important; }

/* Logo: panelde yüklü logo varsa görsel, yoksa metin */
.brand-logo__img { display: block; max-width: 160px; max-height: 36px; width: auto; height: auto; }
.brand-logo--lg .brand-logo__img { max-height: 40px; }
.brand-logo__name { font-size: 19px; font-weight: 800; letter-spacing: -.2px; }
.brand-logo__name > span { color: var(--brand-gold); }
.brand-logo--lg .brand-logo__name { font-size: 21px; }

/* Form alanları (.pp-form içinde: sabit ve panelin dinamik eklediği alanlar) */
.pp-form .form-group { margin: 0 0 16px; }
.pp-form .form-group:last-child { margin-bottom: 0; }
.pp-form #fields:empty { display: none; }
.pp-form .control-label { display: block; margin-bottom: 7px; font-size: 13px; font-weight: 600; color: var(--text-heading); }
.pp-form .form-control {
  display: block;
  width: 100%;
  min-height: 48px;
  padding: 12px 15px;
  border: 1px solid var(--border);
  border-radius: 10px;
  background-color: var(--bg-input);
  box-shadow: none;
  color: var(--text);
  font-family: inherit;
  font-size: 16px;
  line-height: 1.4;
  outline: 0;
  transition: border-color .15s;
}
.pp-form .form-control::placeholder { color: var(--text-muted); opacity: 1; }
.pp-form .form-control:focus { border-color: var(--selected-border); background-color: var(--bg-input); box-shadow: none; color: var(--text); }
.pp-form textarea.form-control { min-height: 120px; resize: vertical; }
.pp-form select.form-control {
  padding-right: 40px;
  background-image: var(--icon-chevron);
  background-repeat: no-repeat;
  background-position: right 15px center;
  background-size: 12px;
  font-weight: 600;
  appearance: none;
}
.pp-form .form-control[readonly] { cursor: default; }
.pp-form .form-control:disabled { opacity: .6; }
.pp-form .help-block { display: block; margin: 7px 0 0; font-size: 11.5px; color: var(--text-muted); }
.pp-form .has-error .form-control { border-color: var(--danger); }
.pp-form .has-error .help-block { color: var(--danger); }
.auth-card.pp-form .form-control { background-color: var(--bg-card); }
@media (min-width: 768px) { .pp-form .form-control { font-size: 14px; } }

/* Onay kutuları (sözleşme, drip-feed vb.) */
.pp-form input[type="checkbox"] {
  flex-shrink: 0;
  width: 18px;
  height: 18px;
  margin: 0;
  border: 1.5px solid var(--border-strong);
  border-radius: 5px;
  background: transparent center / 12px no-repeat;
  appearance: none;
  cursor: pointer;
  vertical-align: middle;
}
.pp-form input[type="checkbox"]:checked { border-color: var(--accent-btn-bg); background-color: var(--accent-btn-bg); background-image: var(--icon-check); }
.pp-form .terms,
.pp-form .checkbox label,
.pp-form .form-group__checkbox,
.pp-form .form-group__checkbox-label { display: inline-flex; align-items: flex-start; gap: 9px; margin: 0; color: var(--text-muted); font-size: 13px; font-weight: 500; line-height: 1.6; cursor: pointer; }
.pp-form .terms input,
.pp-form .checkbox input { margin-top: 3px; }
.pp-form .form-group__checkbox { align-items: center; }
.pp-form .form-group__label-title { margin: 0; color: var(--text-heading); font-size: 13px; font-weight: 600; cursor: pointer; }
.pp-form .checkmark { display: none; }
.pp-form .depend-fields { margin-top: 14px; padding: 14px; border: 1px solid var(--border); border-radius: 12px; background: var(--bg-subtle); }

/* Hizmet açıklaması (panel #service_description içine yazar) */
.pp-form #service_description .service-desc { white-space: normal; word-break: break-word; }
.pp-form #service_description .service-desc > :last-child { margin-bottom: 0; }

/* Tutar: panel #charge alanını doldurur */
.order-total .control-label { margin: 0; font-size: 12px; font-weight: 500; color: var(--text-muted); }
.order-total .form-control,
.order-total .form-control:focus {
  min-height: 0;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  color: var(--text-heading);
  font-size: 26px;
  font-weight: 800;
  line-height: 1.2;
  letter-spacing: -.3px;
  font-variant-numeric: tabular-nums;
}
.pp-form .order-total { margin: 0; }

/* Favori butonu (panel [data-favorite-button] ile yönetir) */
.fav-btn { display: inline-flex; align-items: center; gap: 6px; padding: 0; border: 0; background: none; color: var(--text-muted); font-size: 12px; font-weight: 600; }
.fav-btn .fa-star { color: var(--brand-gold); font-size: 13px; }
.fav-btn:disabled { opacity: .5; }
.field-head { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin-bottom: 7px; }
.field-head .control-label { margin: 0; }

/* Platform butonları: panel aktif butona .active ekler */
.platform-btn.active { background: var(--selected-bg); border-color: var(--selected-border); }

/* Uyarılar (panel .alert .close tıklamasını kendisi yönetir) */
.alert {
  position: relative;
  margin: 0 0 16px;
  padding: 14px 44px 14px 16px;
  border: 1px solid transparent;
  border-radius: 12px;
  font-size: 13.5px;
  line-height: 1.6;
}
.alert h4 { margin: 0 0 6px; font-size: 15px; font-weight: 700; color: inherit; }
.alert-success { background: var(--pill-success-bg); border-color: var(--pill-success-border); color: var(--success); }
.alert-danger { background: var(--pill-danger-bg); border-color: var(--pill-danger-border); color: var(--danger); }
.alert-info { background: var(--selected-bg); border-color: var(--soft-border); color: var(--selected-fg); }
.alert-warning { background: var(--pill-warning-bg); border-color: transparent; color: var(--warning); }
.alert .close {
  position: absolute;
  top: 10px;
  right: 10px;
  width: 28px;
  height: 28px;
  padding: 0;
  border: 0;
  border-radius: 8px;
  background: transparent;
  color: inherit;
  font-size: 20px;
  line-height: 1;
  opacity: .7;
}
.alert .close:hover { opacity: 1; background: rgba(0, 0, 0, .05); }
#notify-wrapper { position: fixed; top: 16px; left: 50%; z-index: 2000; min-width: 260px; max-width: calc(100% - 32px); transform: translateX(-50%); box-shadow: var(--shadow-pop); }

/* Select2 (panel kendi teması "default" ile kurar) */
.pp-form .select2-container { display: block; width: 100% !important; }
.select2-container--default .select2-selection--single {
  display: flex;
  align-items: center;
  height: auto;
  min-height: 52px;
  padding: 8px 40px 8px 12px;
  border: 1px solid var(--border);
  border-radius: 12px;
  background: var(--bg-input) var(--icon-chevron) no-repeat right 15px center / 12px;
  color: var(--text);
  outline: 0;
}
.select2-container--default.select2-container--open .select2-selection--single,
.select2-container--default.select2-container--focus .select2-selection--single { border-color: var(--selected-border); background-color: var(--selected-bg); }
.select2-container--default .select2-selection--single .select2-selection__rendered {
  display: flex;
  align-items: center;
  gap: 10px;
  min-width: 0;
  padding: 0;
  overflow: hidden;
  color: var(--text);
  font-size: 14px;
  font-weight: 600;
  line-height: 1.4;
  white-space: nowrap;
}
.select2-container--default .select2-selection--single .select2-selection__arrow { display: none; }
.select2-container--default .select2-selection--single .select2-selection__placeholder { color: var(--text-muted); }
.select2-container--default .select2-dropdown {
  overflow: hidden;
  border: 1px solid var(--border);
  border-radius: 14px;
  background: var(--bg-elevated);
  box-shadow: var(--shadow-pop);
  color: var(--text);
}
.select2-container--default .select2-dropdown--below { margin-top: 6px; }
.select2-container--default .select2-dropdown--above { margin-bottom: 6px; }
.select2-container--default .select2-search--dropdown { position: relative; padding: 10px; border-bottom: 1px solid var(--border); }
.select2-container--default .select2-search__field-wrapper { position: relative; }
.select2-container--default .select2-search__field-icon { position: absolute; top: 50%; left: 13px; margin: 0; transform: translateY(-50%); color: var(--text-muted); font-size: 12px; pointer-events: none; }
.select2-container--default .select2-search--dropdown .select2-search__field {
  width: 100%;
  min-height: 42px;
  padding: 9px 12px 9px 36px;
  border: 1px solid var(--border);
  border-radius: 10px;
  background: var(--bg-input);
  box-shadow: none;
  color: var(--text);
  font-family: inherit;
  font-size: 16px;
  outline: 0;
}
.select2-container--default .select2-search--dropdown .select2-search__field:focus { border-color: var(--selected-border); }
@media (min-width: 768px) { .select2-container--default .select2-search--dropdown .select2-search__field { font-size: 13.5px; } }
.select2-container--default .select2-results > .select2-results__options { max-height: 360px; padding: 6px; overflow-y: auto; overscroll-behavior: contain; }
.select2-container--default .select2-results__option { margin: 0 0 2px; padding: 0; border-radius: 10px; background: transparent; color: var(--text); font-size: 13.5px; }
.select2-container--default .select2-results__option > a,
.select2-container--default .select2-results__option > span { display: flex; align-items: center; gap: 10px; padding: 10px 12px; color: inherit; line-height: 1.45; text-decoration: none; white-space: normal; }
.select2-container--default .select2-results__option--highlighted[aria-selected],
.select2-container--default .select2-results__option--highlighted { background: var(--bg-hover); color: var(--text); }
.select2-container--default .select2-results__option[aria-selected="true"],
.select2-container--default .select2-results__option--selected { background: var(--selected-bg); color: var(--selected-fg); font-weight: 600; }
.select2-container--default .select2-results__group { padding: 10px 12px 6px; color: var(--text-muted); font-size: 11.5px; font-weight: 700; letter-spacing: .3px; text-transform: uppercase; }
.select2-container--default .select2-results__message { padding: 14px; color: var(--text-muted); font-size: 13px; text-align: center; }
.select2-selection__icon { display: inline-flex; flex-shrink: 0; align-items: center; justify-content: center; width: 22px; font-size: 16px; }
.select2-selection__icon img { width: 22px; height: 22px; border-radius: 6px; object-fit: cover; }
.select2-selection__text { min-width: 0; overflow: hidden; text-overflow: ellipsis; }
.select2-results .select2-selection__text { white-space: normal; }
.select2-selection__id {
  display: inline-flex;
  flex-shrink: 0;
  align-items: center;
  padding: 3px 8px;
  border-radius: 999px;
  background: var(--selected-bg);
  color: var(--selected-fg);
  font-size: 11px;
  font-weight: 700;
}

/* Panelin arama kutusu (#new-order-search, Vue bileşeni) */
.search-dropdown .input-wrapper { position: relative; }
.search-dropdown .input-wrapper__prepend,
.search-dropdown .input-wrapper > button { color: var(--text-muted); }
.search-dropdown .form-control,
.search-dropdown .form-control:focus {
  min-height: 52px;
  padding-left: 40px;
  border-radius: 14px;
  background-color: var(--bg-card);
}
.search-dropdown .select2-dropdown { position: absolute; top: 100%; left: 0; right: 0; z-index: 1050; }

/* Google ile giriş/kayıt butonu alanı */
.g_id_signin { min-height: 44px; }

/* Panel içeriği (admin panelinden girilen metinler) */
.pp-content { color: var(--text); font-size: 14px; line-height: 1.7; word-break: break-word; }
.pp-content > :last-child { margin-bottom: 0; }
.pp-content img { max-width: 100%; height: auto; border-radius: 10px; }
.pp-content a { color: var(--accent); }

/* RTL */
.rtl-form, .rtl-content, .rtl-alert { direction: rtl; text-align: right; }
.rtl-alert { padding: 14px 16px 14px 44px; }
.rtl-alert .close { right: auto; left: 10px; }

/* Giriş / kayıt kartı */
.auth-card__actions { display: flex; flex-direction: column; gap: 10px; margin-top: 4px; }
.auth-card__google { display: flex; justify-content: center; }
.auth-card__switch { margin: 16px 0 0; color: var(--text-muted); font-size: 13px; text-align: center; }
.auth-card__switch a,
.forgot-password { color: var(--accent); font-weight: 600; }
.forgot-password { font-size: 12.5px; }
@media (min-width: 576px) {
  .auth-card__actions { flex-direction: row; align-items: center; }
}
@media (min-width: 768px) { .auth-card { padding: 32px 28px; } }

/* Ziyaretçi menüsünde aktif sayfa */
.site-header__link.is-active { color: var(--text); text-decoration-color: currentColor; }

/* Yeni sipariş: panel köprüsü (main.js) */
.pp-desc-source { display: none !important; } /* panelin açıklama kaynağı; tasarımdaki kutular buradan beslenir */
.pf-twitter { color: var(--mono-icon); }
.pf-badge--twitter, .pf-badge--threads { background: var(--mono-icon); color: var(--bg-card); }
.pf-badge--facebook { background: var(--pf-facebook); color: var(--white); }
.pf-badge--telegram { background: var(--pf-telegram); color: var(--white); }
.pf-badge--spotify { background: var(--pf-spotify); color: var(--white); }
.pf-badge--twitch { background: var(--pf-twitch); color: var(--white); }
.pf-badge--linkedin { background: var(--pf-linkedin); color: var(--white); }
.pf-badge--discord { background: var(--pf-discord); color: var(--white); }
.pf-badge--snapchat { background: var(--pf-snapchat); color: var(--white); }
.pf-badge--whatsapp { background: var(--pf-whatsapp); color: var(--white); }
.pf-badge--kick { background: var(--pf-kick); color: var(--white); }
.pf-badge--soundcloud { background: var(--pf-soundcloud); color: var(--white); }
.pf-badge--reddit { background: var(--pf-reddit); color: var(--white); }
.pf-badge--pinterest { background: var(--pf-pinterest); color: var(--white); }
.pf-badge--apple-music { background: var(--pf-applemusic); color: var(--white); }
.pf-badge--quora { background: var(--pf-quora); color: var(--white); }
.pf-badge--google-maps, .pf-badge--google { background: var(--pf-google); color: var(--white); }
.pf-badge--other { background: var(--selected-bg); color: var(--selected-fg); }
.picker-value__text .id-pill { vertical-align: 1px; }
.service-desc-full { color: var(--text-muted); font-size: 12.5px; line-height: 1.8; word-break: break-word; }
.service-desc-full ul, .service-desc ul { margin: 0; padding: 0; list-style: none; }
.service-desc-full a, .service-desc a { color: var(--accent); }
/* Panelin arama kutusu (Vue): input Select2 sınıfı taşır, ok ikonu olmasın */
.search-dropdown .input-wrapper > .select2-selection--single,
.search-dropdown .input-wrapper > .select2-selection--single:focus {
  display: block;
  min-height: 52px;
  padding: 12px 44px 12px 40px;
  border: 1px solid var(--border);
  border-radius: 14px;
  background: var(--bg-card);
  color: var(--text);
  font-size: 16px;
  font-weight: 500;
}
.search-dropdown .input-wrapper > .select2-selection--single:focus { border-color: var(--selected-border); }
@media (min-width: 768px) { .search-dropdown .input-wrapper > .select2-selection--single { font-size: 14px; } }
.search-dropdown .input-wrapper__prepend,
.search-dropdown .input-wrapper__append {
  position: absolute;
  top: 50%;
  z-index: 2;
  padding: 4px;
  border: 0;
  background: none;
  color: var(--text-muted);
  transform: translateY(-50%);
}
.search-dropdown .input-wrapper__prepend { left: 10px; }
.search-dropdown .input-wrapper__append { right: 10px; }
.search-dropdown .select2-dropdown { border-radius: 14px; overflow: hidden; }
.search-dropdown .select2-results__options.dropdown-menu { position: static; display: block; float: none; margin: 0; padding: 6px; border: 0; box-shadow: none; background: transparent; }
.search-dropdown .select2-results__option > a { display: flex; align-items: flex-start; gap: 10px; padding: 10px 12px; border-radius: 10px; color: var(--text); font-size: 13px; line-height: 1.5; text-decoration: none; }
.search-dropdown .select2-results__option > a:hover,
.search-dropdown .select2-results__option--highlighted > a { background: var(--bg-hover); }
.search-dropdown .text__highlight { color: var(--accent); }
/* Mobil topbar: metin logo ("SosyalBulk") sığsın */
.app-topbar__start { min-width: 0; flex: 1 1 auto; }
.app-topbar__actions { flex-shrink: 0; }
.app-topbar .brand-logo { min-width: 0; overflow: hidden; }
@media (max-width: 575.98px) {
  .app-topbar .brand-logo__name { font-size: 16px; }
  .app-topbar .brand-logo__img { max-width: 110px; max-height: 30px; }
}
@media (max-width: 374.98px) {
  .app-topbar .brand-logo { display: none; }
}
/* Mobilde alttan açılan liste bağlıyken native select görünmez ve yer kaplamaz */
.pp-form .form-group { position: relative; }
.pp-form .form-control.is-sheet-bound { position: absolute; top: 0; left: 0; width: 1px; height: 1px; min-height: 0; padding: 0; border: 0; opacity: 0; pointer-events: none; }
@media (max-width: 399.98px) {
  .app-topbar .brand-logo__name { font-size: 14px; letter-spacing: -.3px; }
}

/* Font Awesome: panelin FA Pro'su ile tasarımın FA 5 Free'si birlikte yüklenir; ikon fontu her ikisine düşsün */
.select2-container--brand .select2-search--dropdown::before { font-family: "Font Awesome 5 Free", "Font Awesome 5 Pro"; font-weight: 900; }
/* FA CSS'i bu dosyadan sonra yüklendiğinde .fas{display:inline-block} gizli ✓'yi göstermesin */
.picker-option .picker-option__check { display: none; }
.picker-option.is-selected .picker-option__check { display: inline-block; }

/* Select2 arama alanı: tam genişlik (panelin Select2'si alanı sarmalayıcıya koyar ve kendi ikonunu ekler) */
.select2-container--brand .select2-search--dropdown { display: block; width: 100%; }
.select2-container--brand .select2-search__field-wrapper { position: static; display: block; width: 100%; }
.select2-container--brand .select2-search__field-icon { display: none; }
.select2-container--brand .select2-search--dropdown .select2-search__field { display: block; width: 100% !important; max-width: none; box-sizing: border-box; }
@media (max-width: 767.98px) { .select2-container--brand .select2-search--dropdown .select2-search__field { font-size: 16px; } }
/* İkon Free'de yoksa Pro fontuna düş (admin menüsünde Pro'ya özel ikon seçilmiş olabilir) */
html .fa, html .fas { font-family: "Font Awesome 5 Free", "Font Awesome 5 Pro"; font-weight: 900; }
html .far { font-family: "Font Awesome 5 Free", "Font Awesome 5 Pro"; font-weight: 400; }
html .fab { font-family: "Font Awesome 5 Brands"; font-weight: 400; }
/* Alttan açılan liste: tutamaç ve başlıktan aşağı çekince kapanır (tarayıcı kaydırması araya girmesin) */
.select-sheet__grab,
.select-sheet__head { touch-action: none; user-select: none; -webkit-user-select: none; }
.select-sheet__grab { padding: 12px 0 6px; }
.select-sheet__head { cursor: grab; }
.select-sheet.is-dragging .select-sheet__backdrop { transition: none; }


/* ==========================================================================
   PerfectPanel: diğer sayfalar (ortak parçalar)
   ========================================================================== */
/* Ziyaretçi düzeninde (layout'ta app-container yok) sayfa sarmalayıcısı */
.pp-page { display: flex; flex-direction: column; gap: 16px; min-width: 0; }
.page-public .pp-page { max-width: 1200px; margin: 0 auto; padding: 24px 16px 56px; }
.page-public .pp-page--narrow { max-width: 620px; }
@media (min-width: 992px) { .page-public .pp-page { padding: 40px 24px 72px; } }
.pp-head { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px 16px; }
.pp-head .page-title { font-size: 20px; }
@media (min-width: 992px) { .pp-head .page-title { font-size: 22px; } }

/* Araç çubuğu: durum sekmeleri + arama */
.pp-toolbar { display: flex; flex-direction: column; gap: 12px; }
.pp-search { display: flex; gap: 8px; width: 100%; }
.pp-search .input-icon { flex: 1 1 auto; min-width: 0; }
.pp-search .form-control-brand { min-height: 46px; }
@media (min-width: 992px) {
  .pp-toolbar--row { flex-direction: row; align-items: center; justify-content: space-between; }
  .pp-toolbar--row .filter-chips { flex: 1 1 auto; min-width: 0; padding-bottom: 0; }
  .pp-toolbar--row .pp-search { flex: 0 0 340px; width: 340px; }
}
a.filter-chip { text-decoration: none; }
a.filter-chip:hover { color: var(--text); }
a.filter-chip.is-active:hover { color: var(--active-fg); }

/* Panel sayfalaması (li.active > a yapısı korunur) */
.pagination-brand > li > a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 40px;
  height: 40px;
  padding: 0 12px;
  border: 1px solid var(--border);
  border-radius: 9px;
  background: var(--bg-card);
  color: var(--text-muted);
  font-size: 12.5px;
  font-weight: 700;
  text-decoration: none;
}
.pagination-brand > li > a:hover { border-color: var(--selected-border); color: var(--text); }
.pagination-brand > li.active > a { background: var(--active-bg); border-color: var(--active-bg); color: var(--active-fg); }
.pp-pagination { display: flex; justify-content: flex-end; }
.card-brand__foot .pagination-brand { margin-left: auto; }

/* Tablo içerikleri */
.table-brand a:not([class*="btn"]):not(.id-pill) { color: var(--accent); font-weight: 600; text-decoration: none; }
.table-brand a:not([class*="btn"]):not(.id-pill):hover { text-decoration: underline; }
.table-brand .btn-brand, .table-brand .btn-soft, .table-brand .btn-ghost { text-decoration: none; }
.table-brand .cell-link { display: inline-block; max-width: 260px; overflow: hidden; text-overflow: ellipsis; vertical-align: middle; white-space: nowrap; }
.table-brand .cell-wrap { min-width: 220px; max-width: 420px; white-space: normal; }
.table-brand .cell-num { font-variant-numeric: tabular-nums; }
.table-actions { display: inline-flex; flex-wrap: wrap; align-items: center; gap: 6px; }
.table-actions .text-xs { white-space: normal; }
.pp-empty { padding: 36px 16px; color: var(--text-muted); font-size: 13px; text-align: center; }
.pp-empty > i { display: block; margin-bottom: 10px; font-size: 26px; color: var(--border-strong); }

/* Bootstrap 3 kalıntıları için güvenlik ağı */
.nowrap { white-space: nowrap; }
.text-right { text-align: right; }
.img-responsive { display: block; max-width: 100%; height: auto; }
.pull-right-middle { display: inline; }

/* Modal: panelin servis açıklama penceresi + tema modalları */
.service-description-modal { z-index: 1065; overflow-y: auto; }
.service-description-modal-backdrop { z-index: 1060; }
.service-description-modal .modal-dialog { max-width: 560px; margin: 1.75rem auto; padding: 0 12px; }
.service-description-modal .modal-content,
.modal-brand .modal-content { border: 1px solid var(--border); background: var(--bg-card); color: var(--text); }
.service-description-modal .modal-content { border-radius: 16px; box-shadow: var(--shadow-pop); }
.service-description-modal .modal-header { padding: 18px 20px; border-bottom: 1px solid var(--border); }
.service-description-modal .modal-title { margin: 0; font-size: 15px; font-weight: 700; color: var(--text-heading); }
.service-description-modal .modal-body { padding: 20px; color: var(--text-muted); font-size: 13.5px; line-height: 1.7; }
.service-description-modal .close,
.modal-brand .close { width: 32px; height: 32px; padding: 0; border: 0; border-radius: 8px; background: transparent; color: var(--text-muted); font-size: 22px; line-height: 1; }
.service-description-modal .close:hover,
.modal-brand .close:hover { background: var(--bg-hover); color: var(--text); }
#createQuickOrder {
  display: flex; align-items: center; justify-content: center; width: 100%; min-height: 48px; padding: 12px 20px;
  border: 0; border-radius: 10px; background: var(--solid-bg); color: var(--solid-fg); font-family: inherit; font-size: 14px; font-weight: 700;
}
#createQuickOrder:hover { background: var(--solid-bg-hover); }
.modal-backdrop.show { opacity: .55; }
.modal-brand .modal-footer { gap: 8px; border-top: 1px solid var(--border); }
.modal-brand .form-group label { display: block; margin-bottom: 7px; font-size: 13px; font-weight: 600; color: var(--text-heading); }

/* Dalga süsü (görsel dosyası olmadan) */
.pp-wave { position: absolute; right: 0; bottom: 0; width: 60%; height: 100%; background: url("data:image/svg+xml,%3Csvg%20width%3D%221350%22%20height%3D%22634%22%20viewBox%3D%220%200%201350%20634%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20d%3D%22M640.582%20236.947H719.219C724.322%20236.947%20729.233%20234.996%20732.944%20231.493L818.885%20150.401C822.597%20146.898%20827.508%20144.947%20832.611%20144.947H914.672C919.803%20144.947%20924.738%20142.975%20928.456%20139.438L978.113%2094.3889C983.148%2090.361%20989.378%2089.2138%20995.044%2090.5049C1005.38%2092.859%201016.79%2099.3484%201026.76%2095.7587L1157.28%2048.7593C1160.16%2047.2407%201163.37%2046.947%201166.62%2046.947H1250.75C1255.83%2046.947%201260.73%2045.0094%201264.44%2041.5285L1301.89%206.36555C1305.6%202.8846%201310.5%200.947021%201315.58%200.947021H1394.22%22%20stroke%3D%22%231F6BFF%22%20stroke-width%3D%222%22%3E%3C%2Fpath%3E%3Cpath%20d%3D%22M721.637%20248H646C640.914%20248%20636.019%20249.938%20632.311%20253.419L594.855%20288.581C591.147%20292.062%20586.252%20294%20581.166%20294H494.037C491.271%20294%20488.539%20294.212%20486.015%20295.21C485.12%20295.563%20484.247%20295.974%20483.34%20296.296L352.128%20342.914C342.174%20346.45%20331.596%20338.488%20321.117%20337.155C317.169%20336.653%20312.847%20337.989%20308.531%20341.442L258.874%20386.491C255.156%20390.028%20250.221%20392%20245.09%20392H163.029C157.926%20392%20153.016%20393.951%20149.304%20397.454L63.3627%20478.546C59.6508%20482.049%2054.7404%20484%2049.6368%20484H-14C-25.0457%20484%20-34%20492.954%20-34%20504V637H1393.64V32C1393.64%2020.9543%201384.68%2012%201373.64%2012H1318C1312.91%2012%201308.02%2013.9376%201304.31%2017.4185L1266.86%2052.5815C1263.15%2056.0624%201258.25%2058%201253.17%2058H1166.04C1162.78%2058%201159.58%2058.2937%201156.7%2059.8123L1026.18%20106.812C1016.21%20110.401%201005.56%20102.416%20995.038%20101.145C991.111%20100.671%20986.818%20102.012%20982.531%20105.442L932.874%20150.491C929.157%20154.028%20924.222%20156%20919.09%20156H835.029C829.926%20156%20825.016%20157.951%20821.304%20161.454L735.363%20242.546C731.651%20246.049%20726.74%20248%20721.637%20248Z%22%20fill%3D%22%2387B0FF%22%20fill-opacity%3D%220.5%22%3E%3C%2Fpath%3E%3Cpath%20d%3D%22M-34%20473H44.637C49.7405%20473%2054.6509%20471.049%2058.3628%20467.546L144.304%20386.454C148.016%20382.951%20152.926%20381%20158.03%20381H240.09C245.222%20381%20250.157%20379.028%20253.875%20375.491L303.531%20330.442C308.566%20326.414%20314.797%20325.267%20320.463%20326.558C330.794%20328.912%20342.207%20335.401%20352.176%20331.812L482.702%20284.812C485.579%20283.294%20488.784%20283%20492.037%20283H576.167C581.252%20283%20586.147%20281.062%20589.855%20277.581L627.311%20242.419C631.019%20238.938%20635.914%20237%20641%20237H719.637%22%20stroke%3D%22%231F6BFF%22%20stroke-width%3D%222%22%3E%3C%2Fpath%3E%3C%2Fsvg%3E") 100% 100% / 200% auto no-repeat; opacity: .35; pointer-events: none; }
.card-brand--gradient { position: relative; overflow: hidden; }

/* Servisler: kategori kartı içindeki tablo (panel filtresi satırlara .hidden ekler) */
.table-brand td.pp-empty { white-space: normal; }
.svc-filter { flex: 0 0 auto; }
.svc-filter > .btn-soft { min-height: 46px; }
.svc-filter__menu { min-width: 280px; max-width: min(420px, calc(100vw - 32px)); }
.svc-filter__menu .dropdown-item { display: flex; align-items: center; gap: 8px; white-space: normal; }
.dropdown-max-height { max-height: 360px; overflow-y: auto; }
@media (min-width: 992px) { .svc-filter { width: 320px; } }
.pp-visually-hidden { position: absolute !important; width: 1px !important; height: 1px !important; min-height: 0 !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0, 0, 0, 0) !important; border: 0 !important; white-space: nowrap !important; }
.pay-history .mini-stat { gap: 4px; }
.chat__files { display: flex; flex-direction: column; gap: 4px; margin-top: 12px; padding-top: 10px; border-top: 1px dashed var(--border); font-size: 12px; }
.chat__files a { color: var(--accent); font-weight: 600; word-break: break-all; }
.chat__bubble .message { word-break: break-word; }

/* API sayfası */
.api-table td { white-space: normal; }
.api-table td:first-child { width: 40%; color: var(--text-heading); font-weight: 600; }
.api-params { border: 1px solid var(--border); border-radius: 12px; }
.api-code { padding: 2px 8px; border-radius: 6px; background: var(--bg-input); color: var(--accent); font-size: 12.5px; word-break: break-all; }
.code-sample { white-space: pre-wrap; word-break: break-word; }
.cp-price .form-control,
.cp-price .form-control:focus { width: auto; min-height: 0; padding: 0; border: 0; background: transparent; color: var(--text-heading); font-size: 20px; font-weight: 800; text-align: right; }

/* Blog / içerik sayfaları */
.pp-page--article { max-width: 860px; width: 100%; }
.app-container .pp-page--article { margin: 0 auto; }
.page-public .pp-page--article { max-width: 860px; }
.page-public .pp-page--narrow { width: 100%; }
.blog-card { overflow: hidden; }
.blog-card__media { display: block; aspect-ratio: 16 / 9; overflow: hidden; background: var(--bg-input); }
.blog-card__media img { display: block; width: 100%; height: 100%; object-fit: cover; transition: transform .3s; }
.blog-card:hover .blog-card__media img { transform: scale(1.03); }
.blog-card__media--hero { aspect-ratio: 21 / 9; }
.blog-card .card-brand__title a { color: var(--text-heading); text-decoration: none; }
.blog-card .card-brand__title a:hover { color: var(--accent); }
.blog-card__excerpt { display: -webkit-box; -webkit-line-clamp: 4; -webkit-box-orient: vertical; overflow: hidden; }
.pp-content h1, .pp-content h2, .pp-content h3, .pp-content h4 { color: var(--text-heading); font-weight: 800; }
.pp-content h2 { font-size: 18px; } .pp-content h3 { font-size: 16px; } .pp-content h4 { font-size: 15px; }
.pp-content ul, .pp-content ol { padding-left: 20px; }
.pp-content table { width: 100%; margin-bottom: 1rem; border-collapse: collapse; }
.pp-content table td, .pp-content table th { padding: 8px 10px; border: 1px solid var(--border); }
.notify-table td { white-space: normal; }
.confirm-email .icon-box { display: inline-flex; }
.auth-card > .icon-box { display: inline-flex; }
/* Panelin dosya yükleyicisi (destek) */
.tickets-uploader { font-size: 13px; color: var(--text-muted); }
.tickets-uploader .btn, .tickets-uploader button { display: inline-flex; align-items: center; gap: 8px; min-height: 38px; padding: 7px 14px; border: 1px solid var(--border); border-radius: 9px; background: var(--bg-input); color: var(--text); font-size: 12.5px; font-weight: 600; }
.tickets-uploader .btn:hover, .tickets-uploader button:hover { border-color: var(--selected-border); }
.service-description-modal .modal-dialog { margin-top: max(1.75rem, 8vh); }
.card-brand--gradient > .pp-wave { position: absolute; z-index: 0; }
.page-public > main { min-height: 62vh; }

/* Sidebar: menü kendi içinde kayar, hesap kartı en altta sabit (mobilde alt menünün üstünde) */
.app-sidebar__inner { overflow: hidden; }
.app-sidebar__inner > nav { flex: 1 1 auto; min-height: 0; margin: 0 -6px; padding: 0 6px; overflow-y: auto; overscroll-behavior: contain; }
.app-sidebar__head { flex-shrink: 0; }
.app-sidebar__account { flex-shrink: 0; margin-top: 0; padding-top: 12px; border-top: 1px solid var(--border); background: var(--bg-card); }
.app-sidebar__account .account-menu { max-height: 40vh; overflow-y: auto; }

/* Servis listesi (Servisler sayfası) — tasarımdaki satır düzeni; panel filtresi satırlara .hidden ekler */
.svc-table { width: 100%; margin: 0; border-collapse: collapse; }
.svc-table, .svc-table tbody { display: block; }
.svc-table td, .svc-table th { display: block; padding: 0; border: 0; text-align: left; }
.svc-table__cat { display: block; }
.svc-table__cat > td { padding: 0; }
.svc-group__toggle {
  display: flex; align-items: center; gap: 12px; width: 100%; padding: 16px 22px;
  border: 0; background: var(--bg-subtle); color: var(--text-heading); font-family: inherit; font-size: 14.5px; text-align: left;
}
.svc-group__toggle strong { flex: 1 1 auto; min-width: 0; font-weight: 800; }
.svc-group__chev { display: inline-flex; align-items: center; justify-content: center; width: 28px; height: 28px; border-radius: 50%; background: var(--bg-card); color: var(--text-muted); font-size: 11px; transition: transform .2s; }
.svc-group.is-collapsed .svc-group__chev { transform: rotate(180deg); }
.svc-group.is-collapsed tr:not(.svc-table__cat) { display: none !important; }
.svc-cat-icon, .svc-icon { display: inline-flex; align-items: center; justify-content: center; width: 24px; font-size: 18px; line-height: 1; }
.svc-cat-icon img, .svc-icon img { width: 22px; height: 22px; border-radius: 6px; object-fit: cover; }
.svc-table__head { display: none; }
.svc-row { border-top: 1px solid var(--border); transition: background .15s; }
.svc-row:hover { background: var(--bg-hover); }
.svc-fav [role="button"] { display: inline-flex; padding: 4px; color: var(--brand-gold); cursor: pointer; font-size: 15px; }
.svc-id { color: var(--accent); font-weight: 800; font-size: 13.5px; white-space: nowrap; }
.svc-name { min-width: 0; color: var(--text-heading); font-size: 13.5px; font-weight: 600; line-height: 1.5; overflow-wrap: anywhere; }
.svc-avg .status-pill { padding: 2px 8px; font-size: 11px; }
.svc-rate { color: var(--text-heading); font-weight: 800; font-size: 13.5px; white-space: nowrap; }
.svc-mm { color: var(--text-heading); font-weight: 700; font-size: 13px; white-space: nowrap; }
.svc-mm__sep { margin: 0 2px; color: var(--text-muted); font-weight: 400; }
.svc-act { display: flex !important; flex-wrap: wrap; align-items: center; gap: 8px; }
.svc-act .btn-soft, .svc-act .btn-brand { white-space: nowrap; }

/* Mobil: kart */
.svc-row {
  display: grid;
  grid-template-columns: 24px auto auto minmax(0, 1fr);
  grid-template-areas:
    "icon fav id rate"
    "name name name name"
    "tags tags tags tags"
    "avg avg mm mm"
    "act act act act";
  align-items: center;
  gap: 8px 10px;
  padding: 14px 16px;
}
.svc-icon { grid-area: icon; } .svc-fav { grid-area: fav; } .svc-id { grid-area: id; } .svc-name { grid-area: name; }
.svc-avg { grid-area: avg; } .svc-tags { grid-area: tags; } .svc-rate { grid-area: rate; text-align: right; } .svc-mm { grid-area: mm; text-align: right; } .svc-act { grid-area: act; }
.svc-rate::before, .svc-mm::before, .svc-avg::before { content: attr(data-label); display: block; color: var(--text-muted); font-size: 10.5px; font-weight: 600; }

/* Masaüstü: tasarımdaki sütunlar */
@media (min-width: 992px) {
  .svc-table__head {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 130px 140px 150px 220px;
    gap: 12px;
    padding: 12px 22px;
    border-top: 1px solid var(--border);
    background: var(--bg-subtle);
  }
  .svc-table__head th { color: var(--text-muted); font-size: 11px; font-weight: 700; letter-spacing: .3px; text-transform: uppercase; }
  .svc-row {
    grid-template-columns: 24px auto auto minmax(0, 1fr) 130px 140px 150px 220px;
    grid-template-areas:
      "icon fav id name rate mm avg act"
      "icon fav tags tags rate mm avg act";
    column-gap: 12px;
    row-gap: 4px;
    padding: 14px 22px;
  }
  .svc-row:has(.svc-tags[hidden]) { grid-template-areas: "icon fav id name rate mm avg act"; }
  .svc-row:not(:has(.svc-fav)) .svc-id { margin-left: -12px; }
  .svc-avg { align-self: center; }
  .svc-rate, .svc-mm { text-align: left; align-self: center; }
  .svc-rate::before, .svc-mm::before, .svc-avg::before { display: none; }
  .svc-icon, .svc-fav, .svc-act { align-self: center; }
  .svc-act { justify-content: flex-end; flex-wrap: nowrap; }
  /* başlıktaki ilk sütun satırdaki ikon+favori+isim alanıyla hizalı */
  .svc-h-rate, .svc-h-mm { text-align: left; }
  .svc-h-act { text-align: right; }
}
.svc-table .svc-rate, .svc-table .svc-mm { text-align: right; }
@media (min-width: 992px) { .svc-table .svc-rate, .svc-table .svc-mm { text-align: left; } }
.svc-tags { display: flex !important; flex-wrap: wrap; gap: 5px; }
.svc-tags[hidden] { display: none !important; }
.svc-tag { padding: 2px 8px; font-size: 11px; white-space: nowrap; }
.status-pill.svc-tag:not([class*="status-pill--"]) { background: var(--bg-input); color: var(--text-muted); }
.svc-table .svc-avg { color: var(--text-muted); font-size: 12.5px; font-weight: 600; text-align: right; }
.svc-table .svc-avg > i { margin-right: 3px; }
@media (min-width: 992px) { .svc-table .svc-avg { text-align: left; color: var(--text-heading); } }
.progress-thin--info { color: var(--info); }
.progress-thin--warning { color: var(--warning); }
.progress-thin--accent { color: var(--accent-btn-bg); }
.btn-icon--info { background: var(--pill-info-bg); border-color: transparent; color: var(--info); }
.btn-icon--info:hover { background: var(--pill-info-bg); color: var(--info); filter: brightness(.96); }
.btn-icon.is-disabled { opacity: .45; cursor: not-allowed; }
.list-orders__cell--actions { gap: 6px; }
/* Siparişlerim: işlem sütunu telafi/iptal butonları da sığacak kadar genişler */
.list-orders--orders { --list-cols: 120px minmax(120px, 1fr) minmax(100px, 1.2fr) 56px 48px 60px minmax(150px, 1.5fr) minmax(90px, .8fr) 110px max-content; }
.list-orders--orders .list-orders__cell--actions { flex-wrap: nowrap; }

/* Sayfa: Destek — talep oluştur kartı */
.ticket-create { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 14px; padding-block: 40px; text-align: center; }
.ticket-create__text { max-width: 520px; margin: 0; font-size: 13px; line-height: 1.7; color: var(--text-muted); }
@media (min-width: 1200px) { .ticket-create { min-height: 360px; } }

/* Yatay taşma koruması: panelin servis açıklamalarındaki uzun satırlar / süs çizgileri sayfayı sağa kaydırmasın */
.app-main { min-width: 0; overflow-x: clip; }
.service-desc, .service-desc-full { overflow-wrap: anywhere; }
.service-desc img, .service-desc-full img { max-width: 100%; height: auto; }

/* Sayfa: Giriş — mobilde giriş formu üstte, masaüstünde sağda (Bootstrap order sınıflarına bağımlı kalmadan) */
.hero__row { display: flex; flex-wrap: wrap; }
.hero__auth { order: -1; }
.hero__intro { order: 0; }
@media (min-width: 992px) {
  .hero__auth { order: 1; }
}
