/* ============================================================
   Takasal — Modern Header & Footer (chrome)
   Tüm sayfalarda paylaşılır. Mevcut markup/JS hook'larına dokunmadan
   yalnızca görünümü modernleştirir. Marka: sarı (#f5b301) + siyah.
   ============================================================ */

:root {
    --tk-yellow: #f5b301;
    --tk-yellow-dark: #d99a00;
    --tk-ink: #15171c;
    --tk-text: #2c2f36;
    --tk-muted: #8a8f99;
    --tk-border: #e9ebef;
    --tk-soft: #f6f7f9;
}

/* ============================================================
   DESKTOP HEADER
   ============================================================ */
header.d-none.d-xl-block {
    background: #fff;
    border-bottom: 1px solid var(--tk-border);
    position: sticky; top: 0; z-index: 1031;
    padding: 14px 0 !important;
    box-shadow: 0 2px 18px rgba(20, 23, 28, .05);
}
header.d-none.d-xl-block .d-logo img { width: 165px; }

/* Arama (pill) */
header .header-search.input-group {
    border: 1px solid var(--tk-border);
    border-radius: 999px;
    overflow: hidden;
    background: var(--tk-soft);
    transition: border-color .15s ease, box-shadow .15s ease, background .15s ease;
}
header .header-search.input-group:focus-within {
    border-color: var(--tk-yellow);
    background: #fff;
    box-shadow: 0 0 0 3px rgba(245, 179, 1, .16);
}
header .header-search .form-control {
    border: 0 !important; background: transparent; box-shadow: none !important;
    padding: 11px 18px; font-size: 14px; font-style: normal !important;
}
header .header-search input[placeholder] { font-style: normal; font-size: 14px; }
header .header-search .btn-yellow {
    background: var(--tk-yellow); color: var(--tk-ink); border: 0 !important;
    border-radius: 0 !important; padding: 0 22px; font-weight: 700; font-size: 13px;
    transition: background .15s ease, color .15s ease;
}
header .header-search .btn-yellow:hover { background: var(--tk-yellow-dark); color: #fff; }

/* Üst nav linkleri */
header .header-nav > li > a {
    color: var(--tk-text) !important; font-weight: 600; font-size: 14px;
    padding: 10px 12px; border-radius: 8px; transition: color .15s ease, background .15s ease;
}
header .header-nav > li > a:hover { color: var(--tk-ink) !important; background: var(--tk-soft); }
header .header-nav .dropdown-toggle::after { vertical-align: middle; }

/* Dil dropdown */
header .header-nav .dropdown-menu,
header .header-login-nav.dropdown-menu {
    border: 1px solid var(--tk-border); border-radius: 14px; box-shadow: 0 12px 36px rgba(20,23,28,.12);
    padding: 8px; margin-top: 10px;
}
header .dropdown-item { border-radius: 9px; padding: 9px 12px; font-size: 13.5px; font-weight: 500; }
header .dropdown-item:hover { background: var(--tk-soft); }
header .dropdown-item.active, header .dropdown-item:active { background: var(--tk-yellow); color: var(--tk-ink); }

/* Hesap butonu */
header .btn-header-login {
    background: #fff; color: var(--tk-ink); height: 48px; border: 1px solid var(--tk-border);
    border-radius: 999px; padding: 6px 16px; font-weight: 600; font-size: 13px; width: 100%;
    transition: border-color .15s ease, box-shadow .15s ease;
}
header .btn-header-login:hover { border-color: var(--tk-ink); box-shadow: 0 4px 14px rgba(20,23,28,.08); }
header .header-login-nav > li > a { border-bottom: 0; font-size: 13.5px; font-weight: 500; }
header .header-login-nav > li > a span span { background: var(--tk-yellow); }

/* Ücretsiz ilan butonu */
header .btn-header-black {
    background: var(--tk-ink); color: #fff; height: 48px; border: 0; border-radius: 999px;
    padding: 7px 18px; font-weight: 700; font-size: 13px; justify-content: center;
    transition: background .15s ease, transform .15s ease;
}
header .btn-header-black:hover { background: var(--tk-yellow); color: var(--tk-ink); transform: translateY(-1px); }

/* ============================================================
   MOBİL HEADER + MENÜ
   ============================================================ */
header.d-block.d-xl-none .mobile-header {
    background: #fff; border-bottom: 1px solid var(--tk-border); padding: 12px 16px !important;
    position: sticky; top: 0; z-index: 1031;
}
header.d-block.d-xl-none .mobile-header img { width: 150px; }
header .mobile-menu-btn { color: var(--tk-ink); }

header .mobile-menu-inner { padding: 18px; }
header .mobile-menu .header-search.input-group {
    border: 1px solid var(--tk-border); border-radius: 12px; overflow: hidden; background: var(--tk-soft);
}
header .mobile-menu .header-search .form-control { border: 0; background: transparent; padding: 11px 14px; }
header .mobile-header .btn-yellow,
header .mobile-menu .btn-yellow {
    background: var(--tk-yellow); color: var(--tk-ink); border: 0; border-radius: 10px; font-weight: 700;
}
header .mobile-menu .btn-standart {
    border: 1px solid var(--tk-border); border-radius: 10px; background: #fff; color: var(--tk-ink) !important;
    font-weight: 600; padding: 11px 14px; text-align: left;
}
header .mobile-menu .btn-standart:hover { border-color: var(--tk-yellow); background: var(--tk-soft); }
header .mobile-menu .btn-header-black {
    background: var(--tk-ink); color: #fff; border: 0; border-radius: 10px; height: auto; padding: 12px; justify-content: center;
}

/* ============================================================
   FOOTER (modern koyu)
   ============================================================ */
.footer { background: var(--tk-ink) !important; color: #c9ccd2; }
.footer .container { padding-top: 56px !important; padding-bottom: 40px !important; }
.footer img { /* logo + sertifikalar */ }
.footer h3 {
    color: #fff !important; font-size: 16px !important; font-weight: 800; margin-bottom: 18px; position: relative; padding-bottom: 10px;
}
.footer h3::after {
    content: ""; position: absolute; left: 0; bottom: 0; width: 30px; height: 3px; background: var(--tk-yellow); border-radius: 3px;
}
.footer .footer-content p { color: #9aa0a9 !important; font-size: 14px; line-height: 1.6; }
.footer .footer-nav.nav > li > a {
    color: #aeb3bb !important; font-size: 14px; padding: 6px 0; display: inline-flex; align-items: center; gap: 7px;
    transition: color .15s ease, padding-left .15s ease;
}
.footer .footer-nav.nav > li > a:hover { color: var(--tk-yellow) !important; padding-left: 5px; }
.footer .footer-nav.nav > li > a .fa { color: var(--tk-yellow); font-size: 12px; }
.footer .social-nav.nav > li > a {
    width: 42px; height: 42px; border-radius: 50%; background: rgba(255,255,255,.08); color: #fff;
    border: 1px solid rgba(255,255,255,.1); transition: all .18s ease;
}
.footer .social-nav.nav > li > a:hover { background: var(--tk-yellow); color: var(--tk-ink); transform: translateY(-3px); }
.footer .border-radius-6 { border-radius: 8px; }
.footer [style*="border-top"] { border-top-color: rgba(255,255,255,.12) !important; }
.footer .row.align-items-center span { color: #8a8f99; font-size: 13px; }

/* ============================================================
   MODALLAR (takas teklifi + üyelik gerekli)
   ============================================================ */
#swapOfferModal .modal-content,
#member-required .modal-content {
    border: 0; border-radius: 18px; overflow: hidden; box-shadow: 0 30px 80px rgba(20,23,28,.3);
}
#swapOfferModal .modal-header,
#member-required .modal-header {
    background: var(--tk-ink); color: #fff; border-bottom: 0; padding: 18px 22px;
}
#swapOfferModal .modal-title { color: #fff; font-weight: 800; }
#swapOfferModal .modal-title i, #member-required .modal-header i { color: var(--tk-yellow); }
#swapOfferModal .modal-header .btn-close,
#member-required .modal-header .btn-close { filter: invert(1) grayscale(1) brightness(1.6); }
#swapOfferModal .modal-body { padding: 22px; }
#swapOfferModal .form-control { border-radius: 10px; padding: 11px 14px; border-color: var(--tk-border); }
#swapOfferModal .form-control:focus { border-color: var(--tk-yellow); box-shadow: 0 0 0 3px rgba(245,179,1,.16); }
#swapOfferModal .modal-footer { border-top: 1px solid var(--tk-border); padding: 16px 22px; }