:root{
  --bg:#f6f7f9; --bg-alt:#eef0f3; --card:#ffffff; --border:#e2e5ea;
  --text:#1a1d27; --muted:#6b7280; --primary:#4f7cff; --primary-dark:#3a5fd9;
  --success:#1f9d55; --error:#e5484d; --radius:12px;
}
*{box-sizing:border-box}
html{overflow-x:hidden}
body{margin:0;font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,Arial,sans-serif;background:var(--bg);color:var(--text);line-height:1.5;overflow-x:hidden}
.wrap{max-width:1080px;margin:0 auto;padding:0 20px}
img{max-width:100%}
a{color:var(--primary);text-decoration:none}
h1,h2,h3{line-height:1.2}

.site-header{border-bottom:1px solid var(--border);position:sticky;top:0;background:rgba(255,255,255,.9);backdrop-filter:blur(8px);z-index:50;box-shadow:0 1px 0 rgba(0,0,0,.02)}
.site-header-inner{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:10px 18px;padding:14px 20px}
.logo{display:flex;align-items:center;gap:9px;font-weight:800;font-size:19px;color:var(--text)}
.logo-badge{display:inline-flex;align-items:center;justify-content:center;width:34px;height:34px;border-radius:9px;background:linear-gradient(135deg,var(--primary),var(--primary-dark));color:#fff;font-size:16px;box-shadow:0 3px 8px rgba(79,124,255,.35)}
.site-header nav{display:flex;flex-wrap:wrap;align-items:center;gap:4px 8px;order:3;flex:1 1 100%;justify-content:center;border-top:1px solid var(--border);padding-top:10px;margin-top:2px}
.site-header nav a{margin-left:0;color:var(--muted);font-weight:600;font-size:14px;padding:6px 12px;border-radius:8px;transition:.15s}
.site-header nav a:hover{color:var(--primary);background:var(--bg-alt)}
.btn.header-cta{padding:9px 18px;font-size:14px;white-space:nowrap}
.header-account{display:flex;align-items:center;gap:8px;flex-shrink:0}
.balance-pill{display:inline-flex;align-items:center;gap:5px;background:var(--bg-alt);border:1px solid var(--border);color:var(--success);font-weight:700;font-size:13.5px;padding:8px 14px;border-radius:999px;white-space:nowrap}
.balance-pill:hover{border-color:var(--success)}

.hero{padding:64px 0 44px;text-align:center;background:radial-gradient(ellipse at top,rgba(79,124,255,.16),transparent 60%)}
.hero-kicker{display:inline-block;background:var(--bg-alt);color:var(--primary-dark);font-weight:700;font-size:12.5px;letter-spacing:.03em;padding:6px 14px;border-radius:999px;margin-bottom:16px}
.hero h1{font-size:clamp(30px,5.5vw,48px);margin:0 0 14px;letter-spacing:-.01em}
.hero .lead{color:var(--muted);max-width:640px;margin:0 auto;font-size:17px}
.cta-btn.hero-cta{display:inline-block;margin-top:26px;padding:15px 34px;font-size:16.5px;width:auto;box-shadow:0 8px 20px rgba(79,124,255,.3)}
.cta-btn.hero-cta:hover{background:var(--primary-dark);transform:translateY(-1px)}
.trust-row{display:flex;justify-content:center;flex-wrap:wrap;gap:10px 22px;margin-top:30px}
.trust-row span{color:var(--muted);font-size:13.5px;font-weight:600}

.stepper{padding:30px 20px 60px}
.step-indicator{display:flex;justify-content:center;gap:8px;margin-bottom:28px;flex-wrap:wrap}
.si{display:flex;align-items:center;gap:8px;color:var(--muted);font-weight:600;padding:8px 14px;border-radius:999px;border:1px solid var(--border)}
.si span{width:24px;height:24px;border-radius:50%;background:var(--bg-alt);display:flex;align-items:center;justify-content:center;font-size:13px}
.si.active{color:var(--text);border-color:var(--primary)}
.si.active span{background:var(--primary);color:#fff}
.si.done{color:var(--success);border-color:var(--success)}
.si.done span{background:var(--success);color:#fff}

.panel{background:var(--card);border:1px solid var(--border);border-radius:var(--radius);padding:28px;max-width:900px;margin:0 auto}
.panel.hidden{display:none}
.panel input[type="text"],.panel input[type="email"]{width:100%;padding:14px 16px;border-radius:10px;border:1.5px solid var(--border);background:var(--bg);color:var(--text);font-size:15.5px;margin-bottom:28px}
.panel input[type="text"]:focus,.panel input[type="email"]:focus{outline:none;border-color:var(--primary);box-shadow:0 0 0 3px rgba(79,124,255,.15)}
/* ---------- Seçim kartları (servis / ülke / operatör) — ortak tasarım sistemi ---------- */
.grid-list{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:14px}
.grid-item{
  position:relative;background:var(--card);border:1px solid var(--border);border-radius:16px;
  padding:18px;cursor:pointer;text-align:left;display:flex;flex-direction:column;gap:10px;
  font-size:15.5px;font:inherit;color:inherit;
  box-shadow:0 1px 2px rgba(16,24,40,.04);
  transition:border-color .16s ease,box-shadow .16s ease,transform .16s ease;
}
.grid-item:hover{border-color:var(--primary);box-shadow:0 10px 24px -8px rgba(79,124,255,.28);transform:translateY(-3px)}
.grid-item:active{transform:translateY(-1px)}
.grid-item:focus-visible{outline:2px solid var(--primary);outline-offset:2px}

.item-row{display:flex;align-items:center;gap:10px;min-width:0}
.item-row .name{flex:1;min-width:0}
.item-icon{width:36px;height:36px;border-radius:10px;flex-shrink:0;object-fit:contain;background:var(--bg-alt);padding:5px}
.item-icon.fallback{display:flex;align-items:center;justify-content:center;font-weight:800;font-size:15px;color:var(--primary);background:linear-gradient(135deg,rgba(79,124,255,.16),rgba(79,124,255,.06))}
.flag-icon{width:30px;height:22px;object-fit:cover;border-radius:5px;flex-shrink:0;box-shadow:0 0 0 1px rgba(16,24,40,.08)}
.grid-item .name{font-weight:700;font-size:15.5px;letter-spacing:-.005em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}

/* Servis kartları (adım 1): ikon + isim, sabit yükseklikte tek satır */
#service-list .grid-item{padding:16px;flex-direction:row;align-items:center;gap:12px}
#service-list .item-row{width:100%}
#service-list .item-icon{width:40px;height:40px;border-radius:11px}

/* Ülke kartları (adım 2): üstte bayrak+isim, alt kısım ince bir ayraçla ayrılmış "fiyat şeridi" */
#country-list .grid-list{grid-template-columns:repeat(auto-fill,minmax(198px,1fr));gap:12px}
.country-item{padding:15px 16px 13px;gap:0;border-radius:15px}
.country-item .item-row{gap:10px;padding-bottom:12px;margin-bottom:12px;border-bottom:1px solid var(--border)}
.country-item .flag-icon{width:30px;height:22px}
.country-item .name{font-size:14.5px;font-weight:700}
.item-meta-row{display:flex;align-items:center;justify-content:space-between;gap:8px}
.item-meta-row + .item-meta-row{margin-top:7px}
.item-meta-row .dial-code{color:var(--muted);font-weight:600;font-size:12.5px;font-variant-numeric:tabular-nums}
.price-pill{background:rgba(31,157,85,.11);color:var(--success);font-weight:800;font-size:14px;padding:3px 10px;border-radius:999px;white-space:nowrap;letter-spacing:-.01em;font-variant-numeric:tabular-nums}
.stock-pill{color:var(--muted);font-weight:600;font-size:11.5px;white-space:nowrap;display:flex;align-items:center;gap:4px}
.stock-pill::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--success);flex-shrink:0}

/* Popüler ülkeler — öne çıkan şerit */
.popular-section{margin-bottom:24px;padding-bottom:22px;border-bottom:1px dashed var(--border)}
.popular-heading{font-size:14px;font-weight:800;color:var(--text);margin:0 0 12px;display:flex;align-items:center;gap:7px;letter-spacing:-.01em}
.popular-section .country-item{
  border-color:rgba(79,124,255,.35);
  background:linear-gradient(165deg,rgba(79,124,255,.09),var(--card) 60%);
  box-shadow:0 4px 14px -6px rgba(79,124,255,.25);
}
.popular-section .country-item .item-row{border-bottom-color:rgba(79,124,255,.18)}
.popular-section .country-item:hover{box-shadow:0 12px 26px -8px rgba(79,124,255,.35)}

@media (max-width:640px){
  #country-list .grid-list{grid-template-columns:repeat(auto-fill,minmax(148px,1fr));gap:9px}
  .country-item{padding:12px 13px 11px}
  .country-item .item-row{gap:7px;padding-bottom:9px;margin-bottom:9px}
  .country-item .flag-icon{width:26px;height:19px}
  .country-item .name{font-size:13.5px}
  .item-meta-row .dial-code{font-size:11.5px}
  .price-pill{font-size:12.5px;padding:2px 8px}
  .stock-pill{font-size:10.5px}
  #service-list .grid-item{padding:13px}
  #service-list .item-icon{width:34px;height:34px}
}

/* Operatör kartları (adım 3) */
.operator-card{position:relative;padding-top:20px}
.operator-card.recommended{border-color:var(--primary);box-shadow:0 0 0 2px rgba(79,124,255,.14),0 10px 22px -10px rgba(79,124,255,.3)}
.op-badge{position:absolute;top:-9px;left:14px;background:var(--primary);color:#fff;font-size:10.5px;font-weight:700;padding:3px 10px;border-radius:999px;letter-spacing:.02em;box-shadow:0 2px 6px rgba(79,124,255,.35)}
.op-top{display:flex;justify-content:space-between;align-items:center;gap:8px;padding-bottom:12px;margin-bottom:2px;border-bottom:1px solid var(--border)}
.op-bottom{display:flex;justify-content:space-between;align-items:center;gap:8px}
.op-bottom .price{color:var(--success);font-weight:800;font-size:16px;letter-spacing:-.01em;font-variant-numeric:tabular-nums}
.op-bottom .stock{color:var(--muted);font-size:12px;font-weight:600}
.rate-pill{font-size:11px;font-weight:700;padding:2px 9px;border-radius:999px;flex-shrink:0}
.rate-pill.high{background:#d9f7e6;color:#12703b}
.rate-pill.mid{background:#fff3cd;color:#92720b}
.rate-pill.low{background:#fde2e2;color:#b42318}
.dial-code{color:var(--muted);font-weight:500;font-size:13.5px}
.muted{color:var(--muted)}
.muted.small{font-size:13px;margin-top:-8px}
.back-btn{background:none;border:0;color:var(--muted);cursor:pointer;padding:0;margin-bottom:16px;font-size:14px}
.back-btn:hover{color:var(--text)}

.order-summary{background:var(--bg);border:1px solid var(--border);border-radius:10px;padding:16px;margin-bottom:18px;display:grid;gap:6px}
.payment-method-select{display:flex;gap:10px;margin:4px 0 18px;flex-wrap:wrap}
.pm-option{flex:1 1 160px;display:flex;align-items:center;gap:8px;border:1.5px solid var(--border);border-radius:10px;padding:12px 14px;cursor:pointer;font-weight:600;font-size:14.5px;transition:.15s}
.pm-option input{width:auto;margin:0}
.pm-option:has(input:checked){border-color:var(--primary);background:var(--bg-alt)}
.bank-transfer-box{background:var(--bg-alt);border:1px dashed var(--primary);border-radius:10px;padding:16px;margin:6px 0 18px}
.bank-transfer-box .bt-row{display:flex;justify-content:space-between;gap:10px;padding:6px 0;border-bottom:1px solid var(--border);font-size:14px}
.bank-transfer-box .bt-row:last-child{border-bottom:0}
.bank-transfer-box .bt-row strong{word-break:break-all;text-align:right}
.amount-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin-bottom:18px}
.amount-btn{padding:14px 8px;border-radius:10px;border:1.5px solid var(--border);background:var(--card);color:var(--text);font-weight:700;font-size:16px;cursor:pointer;transition:.15s;text-align:center}
.amount-btn span{font-weight:600;color:var(--muted);font-size:13px}
.amount-btn:hover{border-color:var(--primary)}
.amount-btn.selected{border-color:var(--primary);background:var(--bg-alt);box-shadow:0 0 0 2px rgba(79,124,255,.15)}
.amount-btn.selected span{color:var(--primary)}
.deposit-method-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px}
@media (max-width:480px){.amount-grid{grid-template-columns:repeat(2,1fr)}}
.cta-btn{width:100%;padding:14px;border:0;border-radius:10px;background:var(--primary);color:#fff;font-weight:700;font-size:16px;cursor:pointer;transition:.15s}
.cta-btn:hover{background:var(--primary-dark)}
.cta-btn:disabled{opacity:.6;cursor:not-allowed}
.error{color:var(--error);margin-top:10px}
.error.hidden{display:none}

.account-wrap{max-width:720px}
.account-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:18px}
.account-head h1{margin-bottom:2px}
.balance-hero{display:flex;align-items:center;gap:16px;background:linear-gradient(135deg,var(--primary),var(--primary-dark));border-radius:16px;padding:22px 26px;margin-bottom:20px;box-shadow:0 8px 24px rgba(79,124,255,.25)}
.balance-hero-icon{width:52px;height:52px;flex-shrink:0;border-radius:50%;background:rgba(255,255,255,.18);display:flex;align-items:center;justify-content:center;color:#fff}
.balance-hero-label{display:block;color:rgba(255,255,255,.85);font-size:13.5px;font-weight:600;margin-bottom:4px}
.balance-hero-amount{display:block;color:#fff;font-size:32px;font-weight:800;line-height:1.1}
.account-card{background:var(--card);border:1px solid var(--border);border-radius:14px;padding:22px 24px;margin-bottom:20px}
.account-card-title{font-size:17px;margin:0 0 14px;padding-bottom:12px;border-bottom:1px solid var(--border)}
.deposit-btn-row{display:flex;gap:10px;flex-wrap:wrap;margin-top:8px}
.deposit-btn-row .cta-btn{width:auto;flex:1 1 200px}
.cta-btn.deposit-method-btn.secondary{background:var(--bg);color:var(--text);border:1.5px solid var(--border)}
.cta-btn.deposit-method-btn.secondary:hover{background:var(--bg-alt);border-color:var(--primary)}

.tx-list{display:flex;flex-direction:column}
.tx-row{display:flex;align-items:center;gap:14px;padding:14px 8px;border-radius:10px;transition:.15s;text-decoration:none;color:inherit;border-bottom:1px solid var(--border)}
.tx-row:last-child{border-bottom:none}
.tx-row:hover{background:var(--bg-alt)}
.tx-icon{width:42px;height:42px;border-radius:12px;flex-shrink:0;display:flex;align-items:center;justify-content:center;background:var(--bg-alt);color:var(--muted);font-weight:700;font-size:12.5px}
.tx-icon-card{background:rgba(79,124,255,.13);color:var(--primary)}
.tx-icon-bank{background:rgba(124,58,237,.13);color:#7c3aed}
.tx-icon-cart{background:rgba(107,114,128,.13);color:#4b5563}
.tx-icon-refund{background:rgba(31,157,85,.14);color:var(--success)}
.tx-icon-gear{background:rgba(245,158,11,.16);color:#b45309}
.tx-main{flex:1;min-width:0;display:flex;flex-direction:column;gap:3px}
.tx-type{font-weight:700;font-size:14.5px}
.tx-date{color:var(--muted);font-size:12.5px}
.tx-side{display:flex;flex-direction:column;align-items:flex-end;gap:6px;flex-shrink:0}
.tx-amount{font-weight:800;font-size:15.5px;letter-spacing:-.01em}
.tx-amount.positive{color:var(--success)}
.tx-amount.negative{color:var(--text)}
@media (max-width:520px){
  .tx-date{display:none}
  .tx-icon{width:36px;height:36px;border-radius:10px}
  .balance-hero{padding:18px}
  .balance-hero-amount{font-size:26px}
}

.activity-section{padding:20px 20px 10px;text-align:center}
.activity-section.hidden{display:none}
.activity-section h2{margin-bottom:4px}
.activity-list{max-width:640px;margin:20px auto 0;display:flex;flex-direction:column;gap:8px;text-align:left}
.activity-item{display:flex;align-items:center;gap:10px;background:var(--card);border:1px solid var(--border);border-radius:10px;padding:10px 14px;font-size:13.5px}
.activity-item span:nth-child(2){flex:1}
.activity-dot{width:8px;height:8px;border-radius:50%;background:var(--success);flex-shrink:0;box-shadow:0 0 0 3px rgba(31,157,85,.15)}
.activity-time{color:var(--muted);font-size:12.5px;flex-shrink:0}

.how-it-works{padding:40px 20px 80px;text-align:center}
.steps-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:20px;margin-top:30px;text-align:left}
.steps-grid > div{background:var(--card);border:1px solid var(--border);border-radius:var(--radius);padding:22px}
.steps-grid .num{display:inline-flex;width:34px;height:34px;border-radius:50%;background:var(--primary);color:#fff;align-items:center;justify-content:center;font-weight:700;margin-bottom:10px}

.site-footer{border-top:1px solid var(--border);padding:26px 0;margin-top:40px}
.site-footer .wrap{display:flex;justify-content:space-between;flex-wrap:wrap;gap:12px;color:var(--muted);font-size:14px}
.site-footer nav a{margin-left:16px;color:var(--muted)}
.site-footer nav a:hover{color:var(--text)}

.whatsapp-fab{position:fixed;right:20px;bottom:20px;width:56px;height:56px;border-radius:50%;background:#25D366;display:flex;align-items:center;justify-content:center;box-shadow:0 4px 14px rgba(37,211,102,.45);z-index:60;transition:.15s}
.whatsapp-fab:hover{transform:translateY(-2px) scale(1.05);box-shadow:0 6px 20px rgba(37,211,102,.55)}
@media (max-width:640px){.whatsapp-fab{right:14px;bottom:14px;width:50px;height:50px}}

/* Order status page */
.order-box{max-width:560px;margin:50px auto;background:var(--card);border:1px solid var(--border);border-radius:var(--radius);padding:28px}
.order-box h1{font-size:22px;margin-top:0}
.status-badge{display:inline-block;padding:5px 12px;border-radius:999px;font-size:13px;font-weight:700;margin-bottom:16px}
.status-badge.pending{background:#fff3cd;color:#92720b}
.status-badge.issued{background:#d9f7e6;color:#12703b}
.status-badge.received{background:#d9f7e6;color:#12703b}
.status-badge.failed,.status-badge.expired,.status-badge.cancelled{background:#fde2e2;color:#b42318}
#number-area:not(:empty),#code-area:not(:empty),#content-area:not(:empty){margin-bottom:16px}
.phone-display{font-size:clamp(18px,5vw,24px);font-weight:800;letter-spacing:.5px;margin:0;word-break:break-word;overflow-wrap:anywhere;line-height:1.3}
.code-display{font-size:clamp(22px,7vw,32px);font-weight:800;color:var(--success);margin:0;word-break:break-word}
.sms-box{background:#eef4ff;border:1px solid #cdddff;border-radius:12px;padding:14px 16px}
.sms-box-label{font-size:12.5px;font-weight:700;color:var(--primary-dark);text-transform:uppercase;letter-spacing:.03em;margin-bottom:8px}
.sms-full{background:var(--card);border:1px solid var(--border);border-radius:8px;padding:12px;font-size:14px;color:var(--text);white-space:pre-wrap;word-break:break-word}
.spinner{width:22px;height:22px;border:3px solid var(--border);border-top-color:var(--primary);border-radius:50%;animation:spin 1s linear infinite;display:inline-block;vertical-align:middle;margin-right:8px}
@keyframes spin{to{transform:rotate(360deg)}}

.order-detail-table{width:100%;border-collapse:collapse;margin:16px 0 20px}
.order-detail-table th,.order-detail-table td{padding:8px 0;border-bottom:1px solid var(--border);text-align:left;font-size:14.5px}
.order-detail-table th{color:var(--muted);font-weight:600;width:40%}
.field-row{display:flex;align-items:center;gap:10px;flex-wrap:nowrap;background:var(--bg);border:1px solid var(--border);border-radius:10px;padding:14px 16px}
.field-row .phone-display,.field-row .code-display{flex:1 1 auto;min-width:0;margin:0;background:none;border:0;padding:0;text-align:left;white-space:normal}
.field-row.code-field{border-color:var(--success);border-style:dashed;background:#f3fbf6}
.field-row.code-field .code-display{color:var(--success)}
.copy-btn{flex-shrink:0;padding:10px 16px;border-radius:8px;border:1px solid var(--border);background:var(--card);color:var(--text);font-weight:600;cursor:pointer;font-size:13px}
.copy-btn:hover{border-color:var(--primary);color:var(--primary)}
.progress-outer{width:100%;height:8px;border-radius:999px;background:var(--bg);overflow:hidden;border:1px solid var(--border)}
.progress-inner{height:100%;background:var(--primary);transition:width 1s linear}
#action-area{margin-top:16px}
#action-area .btn{width:100%}

/* Admin */
.admin-body{background:var(--bg-alt)}
.admin-shell{display:flex;min-height:100vh}
.admin-sidebar{width:236px;background:var(--bg);border-right:1px solid var(--border);padding:18px 0 14px;flex-shrink:0;display:flex;flex-direction:column;position:sticky;top:0;height:100vh;overflow-y:auto}
.admin-sidebar .brand{padding:4px 20px 16px;font-weight:800;font-size:17px;border-bottom:1px solid var(--border);margin-bottom:8px;display:flex;align-items:center;gap:8px}
.admin-sidebar .brand-tag{font-size:10.5px;font-weight:700;color:var(--primary);background:var(--bg-alt);padding:2px 7px;border-radius:999px;letter-spacing:.03em}
.nav-group{margin-bottom:6px}
.nav-group-label{padding:12px 20px 4px;font-size:11px;font-weight:700;color:var(--muted);text-transform:uppercase;letter-spacing:.06em}
.admin-sidebar a{display:flex;align-items:center;gap:10px;padding:9px 20px;color:var(--muted);font-weight:600;font-size:14px;border-left:3px solid transparent;position:relative}
.admin-sidebar a svg{flex-shrink:0;opacity:.85}
.admin-sidebar a:hover{color:var(--text);background:var(--bg-alt)}
.admin-sidebar a.active{color:var(--primary-dark);background:var(--bg-alt);border-left-color:var(--primary);font-weight:700}
.admin-sidebar a.active svg{opacity:1;color:var(--primary)}
.admin-sidebar a span:first-of-type{flex:1}
.nav-badge{background:var(--error);color:#fff;font-size:11px;font-weight:700;padding:1px 7px;border-radius:999px;line-height:1.5}
.nav-logout{margin-top:auto;color:#e5484d !important;border-top:1px solid var(--border);padding-top:14px !important;margin-top:14px}
.admin-main{flex:1;padding:28px 32px;max-width:1200px}
.page-head{margin-bottom:20px}
.page-head h1{margin-bottom:4px}
.page-head p{margin:0}
.admin-card{background:var(--card);border:1px solid var(--border);border-radius:var(--radius);padding:22px;margin-bottom:22px}
.card-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:16px}
.card-head h2{margin:0;font-size:16.5px;display:flex;align-items:center;gap:8px}
.card-head h2 svg{color:var(--primary);flex-shrink:0}
.link-more{font-size:13px;font-weight:700;color:var(--primary);white-space:nowrap}
.section-group{display:flex;flex-direction:column;gap:22px}
.count-pill{background:var(--bg-alt);color:var(--primary-dark);font-size:12.5px;font-weight:700;padding:4px 12px;border-radius:999px;white-space:nowrap}
.row-actions{display:inline-flex;gap:8px;justify-content:flex-end}
.btn-sm{padding:7px 14px;font-size:13px}
.alert-card{display:flex;align-items:center;gap:14px;text-decoration:none;color:var(--text);border-left:4px solid var(--primary);transition:.15s}
.alert-card:hover{background:var(--bg-alt)}
.alert-card strong{display:block;font-size:14.5px}
.alert-card .muted{margin-top:2px}
.alert-card-icon{width:40px;height:40px;border-radius:10px;background:var(--bg-alt);color:var(--primary);display:flex;align-items:center;justify-content:center;flex-shrink:0}
.empty-state{display:flex;align-items:center;gap:14px;color:var(--muted)}
.empty-icon{width:44px;height:44px;border-radius:50%;background:var(--bg-alt);color:var(--success);display:flex;align-items:center;justify-content:center;flex-shrink:0}
table.admin-table{width:100%;border-collapse:collapse;font-size:14px}
table.admin-table th,table.admin-table td{padding:10px 12px;border-bottom:1px solid var(--border);text-align:left}
table.admin-table th{color:var(--muted);font-weight:600;font-size:12.5px;text-transform:uppercase;letter-spacing:.03em}
table.admin-table tbody tr:hover{background:var(--bg-alt)}
table.admin-table tbody tr:last-child td{border-bottom:0}
.badge{display:inline-block;padding:3px 9px;border-radius:999px;font-size:12px;font-weight:700;white-space:nowrap}
.nowrap{white-space:nowrap}
.badge.pending,.badge.pending_payment{background:#fff3cd;color:#92720b}
.badge.paid,.badge.number_issued,.badge.sms_received,.badge.finished,.badge.completed{background:#d9f7e6;color:#12703b}
.badge.failed,.badge.expired,.badge.cancelled,.badge.refunded{background:#fde2e2;color:#b42318}

.order-group-tabs{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:18px}
.group-tab{display:flex;align-items:center;gap:8px;background:var(--card);border:1.5px solid var(--border);border-radius:10px;padding:12px 16px;text-decoration:none;color:var(--text);font-weight:700;font-size:14px;transition:.15s}
.group-tab:hover{border-color:var(--primary)}
.group-tab .g-count{background:var(--bg-alt);color:var(--muted);font-size:12.5px;font-weight:700;padding:2px 9px;border-radius:999px}
.group-tab.active{border-color:var(--primary);background:var(--bg-alt);color:var(--primary-dark)}
.group-tab.tone-unpaid.active{border-color:#e6c568;background:#fff3cd;color:#92720b}
.group-tab.tone-unpaid.active .g-count{background:rgba(146,114,11,.15);color:#92720b}
.group-tab.tone-paid.active{border-color:var(--success);background:#d9f7e6;color:#12703b}
.group-tab.tone-paid.active .g-count{background:rgba(18,112,59,.15);color:#12703b}
.group-tab.tone-issue.active{border-color:var(--error);background:#fde2e2;color:#b42318}
.group-tab.tone-issue.active .g-count{background:rgba(180,35,24,.15);color:#b42318}
table.admin-table tr.row-unpaid td:first-child{box-shadow:inset 3px 0 0 #e6c568;padding-left:9px}
table.admin-table tr.row-paid td:first-child{box-shadow:inset 3px 0 0 var(--success);padding-left:9px}
table.admin-table tr.row-issue td:first-child{box-shadow:inset 3px 0 0 var(--error);padding-left:9px}
table.admin-table tr.row-unpaid{background:rgba(230,197,104,.06)}
.form-row{margin-bottom:16px}
.form-row label{display:block;font-size:13px;color:var(--muted);margin-bottom:6px;font-weight:600}
.form-row input[type=text],.form-row input[type=email],.form-row input[type=password],.form-row input[type=number],.form-row select,.form-row textarea{width:100%;max-width:480px;padding:10px 12px;border-radius:8px;border:1px solid var(--border);background:var(--bg);color:var(--text);font-family:inherit}
.form-row input[type=text]:focus,.form-row input[type=email]:focus,.form-row input[type=password]:focus,.form-row input[type=number]:focus{outline:none;border-color:var(--primary);box-shadow:0 0 0 3px rgba(79,124,255,.15)}
.secret-field-row{display:flex;gap:8px;align-items:center;max-width:480px}
.secret-field-row input{max-width:none;flex:1}
.secret-field-row .secret-toggle{flex-shrink:0;white-space:nowrap}
.admin-card h3{font-size:15px;margin:22px 0 4px;color:var(--text);border-top:1px solid var(--border);padding-top:16px}
.admin-card h3:first-child{border-top:0;padding-top:0;margin-top:0}
.settings-card{padding:0;overflow:hidden}
.settings-tabs{display:flex;flex-wrap:wrap;gap:2px;background:var(--bg-alt);border-bottom:1px solid var(--border);padding:8px 8px 0}
.settings-tab-btn{background:transparent;border:0;padding:10px 16px;font-size:13.5px;font-weight:700;color:var(--muted);cursor:pointer;border-radius:8px 8px 0 0;white-space:nowrap}
.settings-tab-btn:hover{color:var(--text)}
.settings-tab-btn.active{background:var(--card);color:var(--primary-dark)}
.settings-tab-panel{display:none;padding:24px}
.settings-tab-panel.active{display:block}
.settings-save-bar{padding:18px 24px;border-top:1px solid var(--border);background:var(--bg-alt)}
@media (max-width:640px){
  .settings-tabs{padding:8px 8px 0;overflow-x:auto;flex-wrap:nowrap}
  .settings-tab-panel{padding:18px}
  .settings-save-bar{padding:14px 18px}
}
.static-content{color:var(--text);line-height:1.75}
.static-content p{margin:0 0 14px}
.static-content h2{font-size:22px;margin:36px 0 14px}
.static-content h2:first-child{margin-top:0}
.static-content h3{font-size:17px;margin:22px 0 8px}
.static-content ul,.static-content ol{margin:0 0 16px;padding-left:22px}
.static-content li{margin-bottom:6px}
.static-content strong{color:var(--text)}
.info-box{background:var(--bg-alt);border:1px solid var(--border);border-left:4px solid var(--primary);border-radius:8px;padding:14px 16px;margin:18px 0;font-size:14.5px}
.info-box strong{color:var(--primary-dark)}
.static-content details{background:var(--card);border:1px solid var(--border);border-radius:10px;padding:12px 16px;margin-bottom:10px}
.static-content details summary{font-weight:700;cursor:pointer;list-style:none}
.static-content details summary::-webkit-details-marker{display:none}
.static-content details summary::before{content:"+ ";color:var(--primary)}
.static-content details[open] summary::before{content:"− "}
.static-content details p{margin-top:10px;margin-bottom:0;color:var(--muted)}
.mini-steps{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:16px;margin:20px 0}
.mini-steps > div{background:var(--card);border:1px solid var(--border);border-radius:12px;padding:18px}
.mini-steps .num{display:inline-flex;width:30px;height:30px;border-radius:50%;background:var(--primary);color:#fff;align-items:center;justify-content:center;font-weight:700;margin-bottom:10px;font-size:14px}
.mini-steps h3{margin:0 0 6px;font-size:15.5px}
.mini-steps p{margin:0;font-size:13.5px;color:var(--muted)}
.btn{display:inline-block;padding:10px 18px;border-radius:8px;background:var(--primary);color:#fff;border:0;font-weight:700;cursor:pointer;font-size:14px}
.btn:disabled{opacity:.5;cursor:not-allowed}
.btn.secondary{background:var(--bg);border:1px solid var(--border);color:var(--text)}
.btn.danger{background:#d92d20}
.btn.btn-sm{padding:7px 14px;font-size:13px}
.flash{padding:12px 16px;border-radius:8px;margin-bottom:18px;font-size:14px}
.flash.success{background:#d9f7e6;color:#12703b}
.flash.error{background:#fde2e2;color:#b42318}
.login-box{max-width:360px;margin:80px auto;background:var(--card);border:1px solid var(--border);border-radius:var(--radius);padding:30px}
.stat-row{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:16px;margin-bottom:22px}
.stat-card{background:var(--card);border:1px solid var(--border);border-radius:var(--radius);padding:18px}
.stat-card .v{font-size:26px;font-weight:800}
.stat-card .l{color:var(--muted);font-size:13px}
.live-pulse-card{border-color:var(--success);background:linear-gradient(135deg,rgba(31,157,85,.08),transparent)}
.live-pulse-card .v{color:var(--success)}
.live-dot{display:inline-block;width:9px;height:9px;border-radius:50%;background:var(--success);box-shadow:0 0 0 0 rgba(31,157,85,.5);animation:live-pulse 1.6s infinite}
@keyframes live-pulse{
  0%{box-shadow:0 0 0 0 rgba(31,157,85,.5)}
  70%{box-shadow:0 0 0 8px rgba(31,157,85,0)}
  100%{box-shadow:0 0 0 0 rgba(31,157,85,0)}
}
.live-modal-backdrop{position:fixed;inset:0;background:rgba(20,22,28,.5);display:flex;align-items:center;justify-content:center;z-index:100;padding:20px}
.live-modal-backdrop.hidden{display:none}
.live-modal{background:var(--card);border-radius:14px;width:100%;max-width:520px;max-height:85vh;overflow-y:auto;box-shadow:0 20px 50px rgba(0,0,0,.25)}
.live-modal-head{display:flex;align-items:center;justify-content:space-between;padding:16px 20px;border-bottom:1px solid var(--border);position:sticky;top:0;background:var(--card)}
.live-modal-head h3{margin:0;font-size:16px}
.live-modal-close{background:transparent;border:0;font-size:22px;line-height:1;color:var(--muted);cursor:pointer;padding:4px 8px}
.live-modal-close:hover{color:var(--text)}
.live-modal-body{padding:18px 20px}
.live-detail-row{display:flex;justify-content:space-between;gap:14px;padding:8px 0;border-bottom:1px solid var(--border);font-size:13.5px}
.live-detail-row:last-of-type{border-bottom:0}
.live-detail-row span{color:var(--muted);flex-shrink:0}
.live-detail-row strong{text-align:right}
.live-page-list{margin:0;padding-left:20px;font-size:13px;color:var(--text);display:flex;flex-direction:column;gap:4px}
.live-page-table{width:100%;border-collapse:collapse;font-size:12.5px}
.live-page-table th,.live-page-table td{padding:6px 8px;border-bottom:1px solid var(--border);text-align:left}
.live-page-table th{color:var(--muted);font-weight:600;font-size:11.5px;text-transform:uppercase;letter-spacing:.02em}
.live-page-table tr:last-child td{border-bottom:0}
.edit-row{display:grid;grid-template-columns:1.2fr 1.6fr 1fr .6fr .5fr .8fr;gap:10px;align-items:center;padding:9px 0;border-bottom:1px solid var(--border);font-size:14px}
.edit-row-head{color:var(--muted);font-size:12.5px;text-transform:uppercase;letter-spacing:.03em;font-weight:600}
.edit-row input[type=text],.edit-row input[type=number]{width:100%;padding:8px 10px;border-radius:6px;border:1px solid var(--border);background:var(--bg);color:var(--text)}
.edit-row input[type=number]{width:70px}

@media (max-width:640px){
  .wrap{padding:0 14px}
  .site-header .wrap{padding:12px 14px}
  .logo{font-size:16px;gap:7px}
  .logo-badge{width:28px;height:28px;font-size:13px;border-radius:7px}
  .btn.header-cta{padding:8px 14px;font-size:13px}
  .header-account{gap:6px}
  .balance-pill{padding:7px 10px;font-size:12.5px}
  .site-header nav{gap:2px 4px;padding-top:8px}
  .site-header nav a{padding:5px 9px;font-size:13px}
  .hero{padding:36px 0 24px}
  .hero-kicker{font-size:11.5px;padding:5px 12px}
  .cta-btn.hero-cta{padding:13px 26px;font-size:15px;margin-top:20px}
  .trust-row{gap:8px 14px;margin-top:22px}
  .trust-row span{font-size:12px}
  .stepper{padding:20px 14px 40px}
  .step-indicator{gap:6px}
  .si{padding:6px 10px;font-size:13px}
  .panel{padding:16px;border-radius:14px}
  .panel input[type="text"],.panel input[type="email"]{margin-bottom:20px}
  .grid-list{grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:10px}
  .grid-item{padding:14px;font-size:14px}
  .grid-item .name{font-size:15px}
  .item-icon{width:30px;height:30px}
  .flag-icon{width:26px;height:19px}
  #operator-list{grid-template-columns:1fr}
  .op-top,.op-bottom{flex-wrap:wrap;gap:6px}
  .op-top .name{flex:1 1 auto}
  .rate-pill{white-space:nowrap}
  .steps-grid{grid-template-columns:1fr}
  .admin-main{padding:18px}
  .admin-sidebar{width:100%;position:static;height:auto;border-right:0;border-bottom:1px solid var(--border)}
  .admin-shell{flex-direction:column}
  .card-head{flex-wrap:wrap}
  .row-actions{justify-content:flex-start}
  table.admin-table{display:block;overflow-x:auto;white-space:nowrap}
  .edit-row{grid-template-columns:1fr 1fr;gap:6px 10px}
  .edit-row-head{display:none}
  .field-row{padding:10px 12px;gap:6px}
  .copy-btn{padding:8px 10px;font-size:12px}
}

/* --- SEO: breadcrumb, landing/blog sayfaları, footer kategori linkleri --- */
.breadcrumb{margin:0;padding:0;list-style:none;display:flex;flex-wrap:wrap;gap:4px;font-size:13px;color:var(--muted)}
.breadcrumb li{display:flex;align-items:center;gap:4px}
.breadcrumb li:not(:last-child)::after{content:"/";margin-left:4px;color:var(--border)}
.breadcrumb a{color:var(--muted);text-decoration:none}
.breadcrumb a:hover{color:var(--text);text-decoration:underline}
.breadcrumb li:last-child{color:var(--text)}

.landing-content{font-size:15.5px;line-height:1.7;color:var(--text)}
.landing-content h2{margin-top:28px;font-size:20px}
.landing-content p{margin:12px 0}
.landing-related{list-style:none;margin:10px 0 0;padding:0;display:flex;flex-direction:column;gap:8px}
.landing-related a{color:var(--text);text-decoration:none;font-weight:500}
.landing-related a:hover{text-decoration:underline}

.lead{font-size:17px;color:var(--muted);line-height:1.6}

.blog-list-item{padding:18px 0;border-bottom:1px solid var(--border)}
.blog-list-item:last-child{border-bottom:0}
.blog-list-item h2{margin:0 0 4px;font-size:19px}
.blog-list-item h2 a{color:var(--text);text-decoration:none}
.blog-list-item h2 a:hover{text-decoration:underline}

.footer-categories{flex-wrap:wrap;gap:6px 14px}