/* ==========================================================================
   BTRCP — "Default Theme" (webhost)
   WebHost (ThemeForest) hosting şablonundan ilham alan görsel katman.
   Çekirdek assets/css/BTRCP.css'in ÜZERİNE yüklenir (onu değiştirmez), aynı
   class isimlerini yeniden stilize eder. Renk/köşe yarıçapı değerleri hâlâ
   admin panelindeki (settings.theme_color vb.) ayarlara saygı duyar —
   sadece admin özel bir renk SEÇMEDİYSE burada tanımlı WebHost paleti
   fallback olarak kullanılır (bkz. themes/webhost/templates/header.php).
   ========================================================================== */

:root {
  --wh-accent: #f62459;      /* WebHost'un "ORDER NOW" CTA rengi */
  --wh-accent-dark: #dd1a4b;
  --wh-purple-deep: #150f28; /* footer/topbar koyu zemin */
}

/* ── Genel tipografi / şekil dili ─────────────────────────────────────── */
body { letter-spacing: .1px; }
.section-head h2, .page-hero h1, .section-title h2 { letter-spacing: -.02em; }

/* ── Duyuru + üst bar ──────────────────────────────────────────────────── */
.announce-bar { background: linear-gradient(90deg, var(--primary), color-mix(in srgb, var(--primary) 55%, var(--wh-accent))); }
.top-bar { background: var(--wh-purple-deep); }
.top-bar-left a i { color: var(--wh-accent); }
.tb-dropdown-menu .dropdown-item.active { background: color-mix(in srgb, var(--primary) 10%, #fff); }

/* ── Header / nav ──────────────────────────────────────────────────────── */
.site-header { border-bottom: 3px solid var(--primary); box-shadow: 0 4px 20px rgba(15,23,42,.06); }
.logo-icon { color: var(--wh-accent); }
.nav-link { font-weight: 700; text-transform: uppercase; font-size: .78rem; letter-spacing: .03em; border-radius: 999px; }
.nav-link:hover { background: color-mix(in srgb, var(--primary) 10%, #fff); color: var(--primary); }
.nav-badge, .nav-badge-alt { border-radius: 999px !important; background: var(--wh-accent) !important; }
.dropdown-mega, .dropdown-menu-custom { border-radius: 16px; border-top: 3px solid var(--wh-accent); }
.dropdown-mega-item:hover, .dropdown-menu-custom li a:hover { background: color-mix(in srgb, var(--primary) 8%, #fff); }
.hdr-cart-btn, .hdr-login-btn { border-radius: 999px; background: color-mix(in srgb, var(--primary) 8%, #fff); font-weight: 700; }
.hdr-cart-btn:hover, .hdr-login-btn:hover { background: var(--primary); color: #fff; }
.hdr-cart-badge { background: var(--wh-accent); }

/* ── Butonlar (WebHost'un pill/CTA hissi) ─────────────────────────────── */
.btn-hero, .checkout-submit, .coupon-apply, .tld-btn {
  border-radius: 999px !important;
  background: linear-gradient(120deg, var(--wh-accent), var(--wh-accent-dark)) !important;
  box-shadow: 0 14px 30px -12px rgba(246,36,89,.55) !important;
}
.btn-hero:hover, .checkout-submit:hover, .coupon-apply:hover, .tld-btn:hover {
  filter: brightness(1.05);
  box-shadow: 0 18px 34px -12px rgba(246,36,89,.65) !important;
}
.btn-outline-nav { border-radius: 999px; border-color: var(--primary); color: var(--primary); }
.btn-outline-nav:hover { background: var(--primary); color: #fff; }

/* ── Sayfa başlığı bandı (breadcrumb + h1) — WebHost "cover image" hissi ── */
.page-hero {
  background: linear-gradient(135deg, var(--wh-purple-deep) 0%, color-mix(in srgb, var(--primary) 55%, var(--wh-purple-deep)) 100%);
  border-bottom: 0;
}
.page-hero::before { background: var(--wh-accent); opacity: .18; }
.page-hero h1, .page-hero h1 i { color: #fff; }
.breadcrumb, .breadcrumb a { color: rgba(255,255,255,.75); }
.breadcrumb a:hover { color: #fff; }

/* ── Hero (anasayfa) ───────────────────────────────────────────────────── */
.hero-section { background: linear-gradient(135deg, var(--wh-purple-deep), color-mix(in srgb, var(--primary) 60%, var(--wh-purple-deep))); border-radius: 0 0 32px 32px; overflow: hidden; }
.hero-tag { background: color-mix(in srgb, var(--wh-accent) 18%, transparent); border: 1px solid color-mix(in srgb, var(--wh-accent) 45%, transparent); color: #fff; border-radius: 999px; }
.hero-trust-row span { background: rgba(255,255,255,.08); border-radius: 999px; }
.hero-popular a { border-radius: 999px; }
.hero-spotlight-card { border-radius: 22px; box-shadow: 0 30px 60px -20px rgba(0,0,0,.45); }
.hero-spotlight-tag { background: var(--wh-accent); border-radius: 999px; }

/* ── Fiyat / paket kartları (hosting.php + anasayfa vitrin) — "price-cercle" hissi ── */
.hosting-card { border-radius: 18px; border: 1px solid #eef0f4; transition: box-shadow .18s; }
.hosting-card:hover { box-shadow: 0 20px 40px -18px rgba(15,23,42,.18); }
.hosting-card-popular {
  border: 2px solid var(--wh-accent) !important;
  box-shadow: 0 24px 50px -18px rgba(246,36,89,.28) !important;
}
.hosting-badge { background: linear-gradient(120deg, var(--wh-accent), var(--wh-accent-dark)); border-radius: 999px; text-transform: uppercase; letter-spacing: .04em; }
.hosting-badge-alt { background: var(--primary); }
/* WebHost'un "en iyi fiyat" köşe etiketi — kartın İÇİNDE, sabit köşe rozetiyle (üst-orta) çakışmaması
   için sağ üst köşede duran, taşma/kırpma gerektirmeyen basit bir pilldir. */
.hosting-card-popular::after {
  content: "EN İYİ FİYAT"; position: absolute; top: 16px; right: 16px;
  background: linear-gradient(120deg, var(--wh-accent), var(--wh-accent-dark)); color: #fff;
  font-size: 9px; font-weight: 800; letter-spacing: .04em; padding: 4px 10px; border-radius: 999px;
  box-shadow: 0 4px 10px rgba(0,0,0,.18); z-index: 1;
}
.hosting-price { font-size: 2.3rem; }
.hosting-price span:last-child { text-transform: uppercase; letter-spacing: .08em; font-size: .68rem; }
.hosting-features i { color: var(--wh-accent); }
.hosting-perk i { color: var(--wh-accent); }

/* ── Sepet ─────────────────────────────────────────────────────────────── */
.cart-item { border-radius: 16px; border: 1px solid #eef0f4; box-shadow: 0 4px 14px rgba(15,23,42,.04); }
.qty-stepper { border-radius: 999px; }
.cart-item-remove:hover { color: var(--wh-accent); }
.cart-summary { border-radius: 18px; border-top: 4px solid var(--wh-accent); }
.continue-shopping:hover { color: var(--wh-accent); }

/* ── Ödeme / checkout ──────────────────────────────────────────────────── */
.checkout-step { border-radius: 18px; }
.checkout-step-num { background: linear-gradient(120deg, var(--wh-accent), var(--wh-accent-dark)); border-radius: 50%; color: #fff; }
.pay-method { border-radius: 14px; }
.pay-method.active { border-color: var(--wh-accent); background: color-mix(in srgb, var(--wh-accent) 6%, #fff); }
.checkout-summary { border-radius: 18px; border-top: 4px solid var(--wh-accent); }

/* ── Alan adı sayfası ──────────────────────────────────────────────────── */
.ds-mode-btn.active { background: var(--wh-accent); color: #fff; border-color: var(--wh-accent); }
.ds-tools-pill.active { background: linear-gradient(120deg, var(--wh-accent), var(--wh-accent-dark)); }
.ds-panel { border-radius: 18px; }
.tld-badge { background: var(--wh-accent); border-radius: 999px; }
.ds-tld-badge { background: color-mix(in srgb, var(--wh-accent) 15%, #fff); color: var(--wh-accent-dark); border-radius: 999px; padding: 1px 8px; font-size: .7rem; font-weight: 700; }
.ds-result-status:not(.ds-status-taken) { color: #15803d; }
.ds-service-card { --accent: var(--wh-accent); background: linear-gradient(120deg, var(--wh-accent), var(--wh-accent-dark)) !important; border-radius: 18px !important; border-color: transparent !important; color: #fff; }
.ds-service-card h3, .ds-service-card p, .ds-service-card i { color: #fff; }

/* ── Footer ────────────────────────────────────────────────────────────── */
.site-footer { background: var(--wh-purple-deep); border-top: 4px solid var(--wh-accent); }
.footer-social a:hover { background: var(--wh-accent); }
.footer-newsletter button { background: var(--wh-accent); }
.back-to-top { background: var(--wh-accent) !important; border-radius: 999px; }
.livechat-float, .ai-wizard-float { background: linear-gradient(120deg, var(--wh-accent), var(--wh-accent-dark)) !important; }

/* Ödeme yöntemi ikon şeridi (footer alt bandı) */
.footer-payment-icons { display: flex; gap: 14px; justify-content: center; padding: 18px 0; border-top: 1px solid rgba(255,255,255,.08); margin-top: 10px; color: rgba(255,255,255,.5); font-size: 1.3rem; }
.footer-payment-icons i { transition: color .15s; }
.footer-payment-icons i:hover { color: #fff; }

/* ── WebHost'a özgü yeni bölümler (anasayfa) ──────────────────────────── */
.wh-service-item i { background: linear-gradient(135deg, var(--primary), color-mix(in srgb, var(--wh-accent) 55%, var(--primary))); }

.wh-stats-strip { background: linear-gradient(135deg, var(--wh-purple-deep), color-mix(in srgb, var(--primary) 55%, var(--wh-purple-deep))); padding: 46px 0; margin-top: 10px; }
.wh-stats-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 20px; text-align: center; }
.wh-stat { color: #fff; }
.wh-stat strong { display: flex; align-items: center; justify-content: center; gap: 8px; font-size: 1.7rem; font-weight: 800; }
.wh-stat strong i { color: var(--wh-accent); }
.wh-stat span { display: block; margin-top: 6px; color: rgba(255,255,255,.65); font-size: .82rem; font-weight: 600; text-transform: uppercase; letter-spacing: .04em; }
@media (max-width: 767px) { .wh-stats-grid { grid-template-columns: repeat(2, 1fr); gap: 26px; } }

/* ── Küçük ekranlar ────────────────────────────────────────────────────── */
@media (max-width: 991px) {
  .page-hero { padding: 28px 0; }
  .hero-section { border-radius: 0 0 20px 20px; }
}
/* ═══════════════════════════════════════════════════════════════
   KAMPANYA KAPSÜLÜ — özgün şerit tasarımı (kcs-)
   Yüzen kart + dönen indirim mührü + dijital saat dokusu
   ═══════════════════════════════════════════════════════════════ */

/* Üst bar dropdown panelleri her katmanın üstünde kalsın */
.top-bar .dropdown-menu { z-index: 1030; }

.kcs{
  position:relative;
  padding:12px 20px 4px;
  background: #150f28;
}

/* Yüzen kapsül kart */
.kcs__card{
  position:relative;
  max-width:1240px;
  margin:0 auto;
  display:flex;
  align-items:center;
  gap:16px;

  padding:11px 16px;

  color:#fff;
  background:
    repeating-linear-gradient(135deg, rgba(255,255,255,.028) 0 9px, rgba(255,255,255,0) 9px 18px),
    linear-gradient(115deg, #150f28 0%, #131a3f 55%, #26102b 100%);
  border:1px solid rgba(255,255,255,.09);
  border-radius:18px;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.06),
    0 14px 34px -16px rgba(21,15,40,.6);
  animation:kcsIn .45s ease both;
}
@keyframes kcsIn{
  from{ opacity:0; transform:translateY(-10px); }
  to{ opacity:1; transform:none; }
}

/* Sol grup: mühür + bilgi */
.kcs__left{
  display:flex;
  align-items:center;
  gap:14px;
  min-width:0;
  flex:1 1 auto;
}

/* Dönen yıldız mühür */
.kcs-seal{
  position:relative;
  flex:0 0 auto;
  width:64px;
  height:64px;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  isolation:isolate;
}
.kcs-seal__spin{
  position:absolute;
  inset:0;
  z-index:-1;
  border-radius:50%;
  background:
    conic-gradient(from 0deg,
      var(--wh-accent) 0 40deg,
      var(--primary) 60deg 110deg,
      var(--wh-accent-dark) 140deg 200deg,
      var(--secondary) 230deg 290deg,
      var(--wh-accent) 320deg 360deg);
  animation:kcsSpin 9s linear infinite;
}
.kcs-seal::after{
  content:"";
  position:absolute;
  inset:3px;
  z-index:-1;
  border-radius:50%;
  background:#1c1233;
}
@keyframes kcsSpin{
  to{ transform:rotate(360deg); }
}
.kcs-seal strong{
  font-size:15px;
  font-weight:900;
  letter-spacing:-.02em;
  line-height:1;
}
.kcs-seal small{
  margin-top:2px;
  font-size:7.5px;
  font-weight:800;
  letter-spacing:.08em;
  text-transform:uppercase;
  color:#ff9db8;
}

/* Bilgi bloğu */
.kcs-info{
  min-width:0;
}
.kcs-info__title{
  display:block;
  font-size:14.5px;
  font-weight:800;
  letter-spacing:-.01em;
  line-height:1.25;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.kcs-info__meta{
  display:flex;
  align-items:center;
  flex-wrap:wrap;
  gap:8px;
  margin-top:5px;
}
.kcs-chip{
  display:inline-flex;
  align-items:center;
  height:22px;
  padding:0 10px;
  border-radius:999px;
  background:rgba(37,99,235,.18);
  border:1px solid rgba(96,150,255,.28);
  color:#a9c7ff;
  font-size:10.5px;
  font-weight:700;
  white-space:nowrap;
  text-decoration:none;
  transition:background .15s ease, border-color .15s ease;
}
a.kcs-chip:hover{
  background:rgba(37,99,235,.32);
  border-color:rgba(96,150,255,.5);
  color:#fff;
}
.kcs-note{
  display:inline-flex;
  align-items:center;
  gap:5px;
  color:#ffb3c8;
  font-size:11px;
  font-weight:700;
  white-space:nowrap;
}
.kcs-stockbar{
  width:86px;
  height:5px;
  border-radius:999px;
  background:rgba(255,255,255,.12);
  overflow:hidden;
}
.kcs-stockbar span{
  display:block;
  height:100%;
  border-radius:999px;
  background:linear-gradient(90deg, var(--wh-accent), var(--secondary));
}
.kcs-price-old{
  color:#a99fc7;
  font-size:12px;
  font-weight:700;
  text-decoration:line-through;
  text-decoration-color:var(--wh-accent);
  text-decoration-thickness:2px;
  white-space:nowrap;
}
.kcs-price-new{
  color:#fff;
  font-size:17px;
  font-weight:900;
  white-space:nowrap;
}

/* Hediye çipi */
.kcs-gift{
  flex:0 1 auto;
  min-width:0;
  display:flex;
  align-items:center;
  gap:10px;
  padding:8px 13px 8px 9px;
  border-radius:12px;
  background:rgba(255,255,255,.055);
  border:1px solid rgba(255,255,255,.09);
  color:#fff;
  text-decoration:none;
  transition:border-color .2s ease, background .2s ease, transform .2s ease;
}
.kcs-gift:hover{
  border-color:rgba(246,36,89,.35);
  background:rgba(246,36,89,.07);
  color:#fff;
  transform:translateY(-1px);
}
.kcs-gift__icon{
  flex:0 0 34px;
  width:34px;
  height:34px;
  border-radius:9px;
  display:grid;
  place-items:center;
  background:linear-gradient(160deg, var(--primary), #1d4ed8);
  color:#fff;
}
.kcs-gift__icon svg{
  width:17px;
  height:17px;
  fill:none;
  stroke:currentColor;
  stroke-width:1.8;
  stroke-linecap:round;
  stroke-linejoin:round;
}
.kcs-gift__label{
  display:block;
  font-size:9px;
  font-weight:900;
  letter-spacing:.09em;
  text-transform:uppercase;
  color:#8fb7ff;
}
.kcs-gift strong{
  display:block;
  max-width:190px;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  font-size:12px;
  font-weight:800;
  line-height:1.3;
}

/* Sağ grup */
.kcs__right{
  display:flex;
  align-items:center;
  gap:12px;
  margin-left:auto;
}

/* Dijital saat */
.kcs-clock{
  display:flex;
  flex-direction:column;
  align-items:flex-end;
  gap:4px;
}
.kcs-clock__lbl{
  font-size:9px;
  font-weight:800;
  letter-spacing:.1em;
  text-transform:uppercase;
  color:#b3a9d6;
}
.kcs-digits{
  display:flex;
  align-items:center;
  gap:4px;
}
.kcs-digit{
  min-width:34px;
  padding:5px 6px 4px;
  border-radius:8px;
  background:rgba(255,255,255,.07);
  border:1px solid rgba(255,255,255,.10);
  display:flex;
  flex-direction:column;
  align-items:center;
  font-variant-numeric:tabular-nums;
}
.kcs-digit b{
  font-size:15px;
  font-weight:900;
  line-height:1;
}
.kcs-digit i{
  margin-top:3px;
  font-style:normal;
  font-size:7.5px;
  font-weight:800;
  letter-spacing:.06em;
  text-transform:uppercase;
  color:#b3a9d6;
}
.kcs-colon{
  font-size:14px;
  font-weight:900;
  color:#ff5c86;
  animation:kcsBlink 1s steps(1) infinite;
}
@keyframes kcsBlink{
  50%{ opacity:.15; }
}
.kcs-digit--sec{
  background:linear-gradient(180deg, var(--wh-accent), var(--wh-accent-dark));
  border-color:rgba(255,92,134,.55);
  box-shadow:0 0 14px rgba(246,36,89,.35);
}
.kcs-digit--sec i{ color:#ffd7e2; }

/* CTA */
.kcs-cta{
  position:relative;
  flex:0 0 auto;
  display:flex;
  align-items:center;
  gap:9px;
  height:42px;
  padding:0 6px 0 16px;
  border-radius:999px;
  background:linear-gradient(135deg, var(--wh-accent), var(--wh-accent-dark));
  color:#fff;
  font-size:12.5px;
  font-weight:800;
  white-space:nowrap;
  text-decoration:none;
  transition:transform .2s ease, box-shadow .2s ease;
  box-shadow:0 8px 20px -8px rgba(246,36,89,.55);
}
.kcs-cta:hover{
  color:#fff;
  transform:translateY(-1px);
  box-shadow:0 12px 26px -8px rgba(246,36,89,.65);
}
.kcs-cta__arrow{
  width:30px;
  height:30px;
  border-radius:50%;
  background:rgba(255,255,255,.18);
  display:flex;
  align-items:center;
  justify-content:center;
  transition:transform .25s ease;
}
.kcs-cta:hover .kcs-cta__arrow{ transform:translateX(3px); }
.kcs-cta__arrow svg{
  width:14px;
  height:14px;
  fill:none;
  stroke:#fff;
  stroke-width:2.2;
  stroke-linecap:round;
  stroke-linejoin:round;
}

/* ── Responsive ── */
@media (max-width:1100px){
  .kcs-gift strong{ max-width:130px; }
  .kcs-info__title{ max-width:340px; }
}
@media (max-width:991px){
  .kcs__card{ flex-wrap:wrap; row-gap:10px; }
  .kcs__left{ flex:1 1 100%; }
  .kcs-gift{ display:none; }
  .kcs__right{ margin-left:auto; }
}
@media (max-width:640px){
  .kcs{ padding:10px 12px 2px; }
  .kcs__card{ padding:10px 12px; gap:10px; border-radius:15px; }
  .kcs-seal{ width:52px; height:52px; }
  .kcs-seal strong{ font-size:12.5px; }
  .kcs-info__title{ font-size:12.5px; white-space:normal; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; }
  .kcs-note{ display:none; }
  .kcs-stockbar{ display:none; }
  .kcs__right{ flex:1 1 100%; justify-content:space-between; gap:8px; }
  .kcs-clock__lbl{ display:none; }
  .kcs-digit{ min-width:30px; padding:4px 5px 3px; }
  .kcs-digit b{ font-size:13px; }
  .kcs-digit i{ font-size:6.5px; }
  .kcs-cta{ height:36px; padding:0 5px 0 13px; font-size:11px; }
  .kcs-cta__arrow{ width:26px; height:26px; }
}
@media (max-width:400px){
  .kcs-price-new{ font-size:15px; }
  .kcs-digit{ min-width:27px; }
  .kcs-cta span:not(.kcs-cta__arrow){ font-size:10px; }
}