/*
 * ItemSatis tema adaptör yaması
 * Bu dosya, yüklenen tema assetlerinden alınan görünüm dilini mevcut PHP/HTML yapısına bozmadan uyarlar.
 * Direkt ItemSatis class kopyası değil; mevcut .frontend-header, .listing-card, .mobile-bottom-menu yapılarını hedefler.
 */
:root {
    --is-blue: #229af2;
    --is-blue-dark: #1676bd;
    --is-purple: #667afa;
    --is-surface: #ffffff;
    --is-page-bg: #f5f3f0;
    --is-border: #e8e8ee;
    --is-text: #333333;
    --is-muted: #7b8191;
    --is-dark-surface: #262839;
    --is-dark-card: #32344e;
    --is-dark-border: #4c537d;
}

html[data-theme="light"],
html[data-theme="light"] body {
    background: radial-gradient(circle at 10% 0%, rgba(102,122,250,.08), transparent 28%), #f5f3f0 !important;
    color: var(--is-text) !important;
}

html[data-theme="dark"],
html[data-theme="dark"] body {
    background: radial-gradient(circle at 10% 0%, rgba(102,122,250,.14), transparent 30%), #1f2132 !important;
}

/* HEADER: ItemSatis benzeri açık, sıkı ve premium üst alan */
html[data-theme="light"] .topbar {
    background: #ffffff !important;
    border-bottom: 1px solid #ececf2 !important;
    box-shadow: none !important;
}

html[data-theme="dark"] .topbar {
    background: #202233 !important;
    border-bottom: 1px solid rgba(126,133,195,.22) !important;
}

html[data-theme="light"] .frontend-header,
html[data-theme="light"] header.frontend-header {
    background: rgba(255,255,255,.94) !important;
    border-bottom: 1px solid #e6e6ef !important;
    box-shadow: 0 10px 30px rgba(25, 37, 60, .08) !important;
    backdrop-filter: blur(12px);
}

html[data-theme="dark"] .frontend-header,
html[data-theme="dark"] header.frontend-header {
    background: rgba(38,40,57,.94) !important;
    border-bottom: 1px solid rgba(126,133,195,.35) !important;
    box-shadow: 0 10px 30px rgba(0,0,0,.24) !important;
    backdrop-filter: blur(12px);
}

html[data-theme="light"] .frontend-header .header-top,
html[data-theme="light"] header.frontend-header div.header-top {
    background: #ffffff !important;
    border-bottom: 1px solid #eeeeF5 !important;
}

html[data-theme="dark"] .frontend-header .header-top,
html[data-theme="dark"] header.frontend-header div.header-top {
    background: #262839 !important;
    border-bottom: 1px solid rgba(126,133,195,.28) !important;
}

.frontend-header .header-content {
    max-width: 1240px !important;
}

.frontend-header .logo-section img,
.frontend-header .header-top .logo-section img,
.frontend-header .logo-section a img {
    height: 46px !important;
    max-height: 46px !important;
    max-width: 190px !important;
    object-fit: contain !important;
}

.header-search-container {
    max-width: 390px !important;
}

html[data-theme="light"] .header-search-box {
    height: 42px !important;
    background: #f3f4f8 !important;
    border: 1px solid #e4e6ee !important;
    border-radius: 7px !important;
    box-shadow: inset 0 1px 0 rgba(255,255,255,.7) !important;
}

html[data-theme="dark"] .header-search-box {
    height: 42px !important;
    background: #32344e !important;
    border: 1px solid #4c537d !important;
    border-radius: 7px !important;
}

html[data-theme="light"] .header-search-input {
    color: #303545 !important;
}

html[data-theme="dark"] .header-search-input {
    color: #ffffff !important;
}

html[data-theme="light"] .header-search-input::placeholder {
    color: #9aa0ad !important;
}

html[data-theme="dark"] .header-search-input::placeholder {
    color: rgba(255,255,255,.62) !important;
}

.header-search-btn {
    width: 36px !important;
    min-width: 36px !important;
    height: 32px !important;
    border-radius: 6px !important;
    background: linear-gradient(135deg, #8d5cf6, #667afa) !important;
    box-shadow: 0 8px 16px rgba(102,122,250,.25) !important;
}

.theme-toggle-btn,
.frontend-header .theme-toggle-btn {
    background: #ffffff !important;
    color: #32344e !important;
    border: 1px solid #dde0ea !important;
    box-shadow: 0 8px 20px rgba(28,36,55,.12) !important;
}

html[data-theme="dark"] .theme-toggle-btn,
html[data-theme="dark"] .frontend-header .theme-toggle-btn {
    background: #32344e !important;
    color: #f3f5ff !important;
    border-color: #4c537d !important;
}

.frontend-header .user-actions .notifications-btn,
.frontend-header .user-actions .messages-btn {
    background: #edf3ff !important;
    color: #4072d9 !important;
    border: 1px solid #cfe0ff !important;
    box-shadow: 0 8px 18px rgba(64,114,217,.14) !important;
}

html[data-theme="dark"] .frontend-header .user-actions .notifications-btn,
html[data-theme="dark"] .frontend-header .user-actions .messages-btn {
    background: rgba(102,122,250,.14) !important;
    color: #9daaff !important;
    border-color: rgba(102,122,250,.35) !important;
}

.frontend-header .user-actions .nav-item.has-dropdown {
    background: #ffffff !important;
    border: 1px solid #e3e5ee !important;
    border-radius: 9px !important;
    color: #2f3443 !important;
    box-shadow: 0 8px 18px rgba(24,33,55,.08) !important;
}

html[data-theme="dark"] .frontend-header .user-actions .nav-item.has-dropdown {
    background: #32344e !important;
    border-color: #4c537d !important;
    color: #ffffff !important;
}

.frontend-header .header-nav {
    padding: 10px 0 !important;
    background: rgba(255,255,255,.86) !important;
    border-top: 0 !important;
    overflow: visible !important;
}

html[data-theme="dark"] .frontend-header .header-nav {
    background: #292b40 !important;
}

.frontend-header .header-nav > div {
    max-width: 1240px !important;
    gap: 10px !important;
    overflow-x: auto !important;
    scrollbar-width: none !important;
}

.frontend-header .header-nav > div::-webkit-scrollbar { display: none; }

.frontend-header .header-nav .nav-item,
.frontend-header .header-nav a.nav-item {
    min-height: 34px !important;
    padding: 7px 12px !important;
    border-radius: 999px !important;
    background: #f6f7fb !important;
    color: #3b4151 !important;
    border: 1px solid #e6e8f1 !important;
    box-shadow: none !important;
    white-space: nowrap !important;
}

html[data-theme="dark"] .frontend-header .header-nav .nav-item,
html[data-theme="dark"] .frontend-header .header-nav a.nav-item {
    background: #32344e !important;
    color: #ffffff !important;
    border-color: #4c537d !important;
}

.frontend-header .header-nav .nav-item:hover,
.frontend-header .header-nav a.nav-item:hover {
    background: #eaf3ff !important;
    color: #1676bd !important;
    border-color: #b8d9ff !important;
    text-decoration: none !important;
}

html[data-theme="dark"] .frontend-header .header-nav .nav-item:hover,
html[data-theme="dark"] .frontend-header .header-nav a.nav-item:hover {
    background: #4d53a4 !important;
    color: #ffffff !important;
    border-color: #747dff !important;
}

/* SLIDER ALTI SEKMELER: yüklenen Home.css'teki PinnedCategories hissi */
.tabs-section {
    padding-top: 22px !important;
}

.tabs-wrapper {
    max-width: 1240px !important;
}

.tabs-header {
    background: transparent !important;
    border: 0 !important;
    padding: 0 !important;
    margin-bottom: 16px !important;
    box-shadow: none !important;
}

.tabs-left {
    display: flex !important;
    gap: 10px !important;
    overflow-x: auto !important;
    scrollbar-width: none !important;
    padding-bottom: 2px !important;
}
.tabs-left::-webkit-scrollbar { display: none; }

.tab-btn {
    flex: 0 0 auto !important;
    min-height: 40px !important;
    padding: 7px 16px 7px 10px !important;
    border-radius: 50px !important;
    border: 1px solid #dbe5f0 !important;
    background: #ffffff !important;
    color: #323846 !important;
    box-shadow: 0 8px 20px rgba(24,33,55,.06) !important;
}

.tab-btn .tab-icon {
    width: 30px !important;
    height: 30px !important;
    border-radius: 50% !important;
    background: #eaf3ff !important;
    color: #1d8ce3 !important;
}

.tab-btn.active,
.tab-btn:hover {
    background: #4d53a4 !important;
    border-color: #747dff !important;
    color: #ffffff !important;
    transform: translateY(-1px);
}

.tab-btn.active .tab-icon,
.tab-btn:hover .tab-icon {
    background: rgba(255,255,255,.18) !important;
    color: #ffffff !important;
}

html[data-theme="dark"] .tab-btn {
    background: #32344e !important;
    color: #ffffff !important;
    border-color: #4c537d !important;
}

html[data-theme="dark"] .tab-btn .tab-icon {
    background: #262839 !important;
    color: #9daaff !important;
}

/* İLAN KARTLARI: ItemSatis AdvertBox tarzı */
.listings-grid {
    gap: 16px !important;
}

.listing-card,
.listing-card.vitrin-card,
.listing-card.featured-card {
    background: #ffffff !important;
    border: 1px solid #dddddd !important;
    border-radius: 7px !important;
    overflow: hidden !important;
    box-shadow: 0 5px 30px rgba(0,0,0,.05) !important;
    transform: none !important;
    transition: box-shadow .2s ease, transform .2s ease, border-color .2s ease !important;
}

.listing-card:hover,
.listing-card.vitrin-card:hover,
.listing-card.featured-card:hover {
    transform: translateY(-3px) !important;
    box-shadow: 0 14px 34px rgba(33,33,33,.12) !important;
    border-color: #c8d5e6 !important;
}

html[data-theme="dark"] .listing-card,
html[data-theme="dark"] .listing-card.vitrin-card,
html[data-theme="dark"] .listing-card.featured-card {
    background: #32344e !important;
    border-color: #4c537d !important;
    box-shadow: 0 9px 24px rgba(0,0,0,.20) !important;
}

.listing-image {
    height: 176px !important;
    background: #f4f6fb !important;
    border-radius: 0 !important;
}

.listing-image img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    transition: transform .25s ease !important;
}

.listing-card:hover .listing-image img { transform: scale(1.035); }

.listing-content {
    background: transparent !important;
    padding: 10px 12px 7px !important;
}

.listing-title {
    color: #333333 !important;
    font-size: 14px !important;
    line-height: 18px !important;
    height: 38px !important;
    margin: 0 0 5px !important;
    word-break: break-word !important;
    -webkit-line-clamp: 2 !important;
}

.listing-description {
    color: #808080 !important;
    font-size: 11.5px !important;
    line-height: 15px !important;
    height: 30px !important;
    margin: 0 !important;
    -webkit-line-clamp: 2 !important;
}

html[data-theme="dark"] .listing-title { color: #ffffff !important; }
html[data-theme="dark"] .listing-description { color: #c7cbe1 !important; }

.listing-footer {
    background: #fbfbfb !important;
    border-top: 1px solid #f1f1f1 !important;
    padding: 8px 12px !important;
}

html[data-theme="dark"] .listing-footer {
    background: rgba(38,40,57,.72) !important;
    border-top-color: #3d415f !important;
}

.seller-avatar {
    width: 28px !important;
    height: 28px !important;
    border-radius: 50% !important;
}

.seller-label {
    display: none !important;
}

.seller-name {
    color: #686f80 !important;
    font-size: 12px !important;
    font-weight: 600 !important;
}

html[data-theme="dark"] .seller-name { color: #dbe0ff !important; }

.listing-top-meta {
    align-items: flex-start !important;
    padding: 8px !important;
}

.category-badge {
    width: 30px !important;
    height: 30px !important;
    border-radius: 50% !important;
    background: rgba(255,255,255,.92) !important;
    border: 1px solid rgba(0,0,0,.06) !important;
    box-shadow: 0 5px 14px rgba(0,0,0,.14) !important;
}

.price-badge {
    align-self: flex-end !important;
    margin-left: auto !important;
    margin-top: auto !important;
    border-radius: 5px !important;
    background: rgba(255,255,255,.95) !important;
    color: #2f3544 !important;
    font-size: 12px !important;
    font-weight: 800 !important;
    box-shadow: 0 5px 16px rgba(0,0,0,.16) !important;
}

.listing-ribbon {
    top: 8px !important;
    left: 8px !important;
    border-radius: 4px !important;
    font-size: 9px !important;
    letter-spacing: .2px !important;
    box-shadow: 0 5px 12px rgba(0,0,0,.18) !important;
}

.home-tab-pagination {
    gap: 8px !important;
}

.home-tab-page-btn {
    min-width: 34px !important;
    height: 34px !important;
    border-radius: 7px !important;
    background: #ffffff !important;
    border: 1px solid #dfe3ed !important;
    color: #2f3544 !important;
    box-shadow: 0 6px 16px rgba(24,33,55,.06) !important;
}

.home-tab-page-btn.active,
.home-tab-page-btn:hover {
    background: #4d53a4 !important;
    color: #ffffff !important;
    border-color: #747dff !important;
}

html[data-theme="dark"] .home-tab-page-btn {
    background: #32344e !important;
    color: #ffffff !important;
    border-color: #4c537d !important;
}

.see-more-btn {
    border-radius: 7px !important;
    background: linear-gradient(135deg, #229af2, #667afa) !important;
    box-shadow: 0 8px 20px rgba(34,154,242,.24) !important;
}

/* MOBİL ALT MENÜ: tema dosyasındaki cam/gradient yapıya uyumlu */
.mobile-bottom-menu {
    height: 64px !important;
    padding: 0 !important;
    background: linear-gradient(to bottom, rgba(255,255,255,.74), rgba(255,255,255,.96)) !important;
    border-top: 1px solid rgba(126,133,195,.30) !important;
    box-shadow: 0 -10px 24px rgba(30,41,59,.10) !important;
    backdrop-filter: blur(14px) !important;
}

html[data-theme="dark"] .mobile-bottom-menu {
    background: linear-gradient(to bottom, rgba(38,40,57,.72), #262839) !important;
    border-top-color: rgba(126,133,195,.35) !important;
    box-shadow: 0 -10px 26px rgba(0,0,0,.28) !important;
}

.bottom-menu-item {
    height: 64px !important;
    padding: 8px 2px 6px !important;
    justify-content: center !important;
    gap: 4px !important;
    color: #42485a !important;
    border-bottom: 2px solid transparent !important;
    font-weight: 700 !important;
}

html[data-theme="dark"] .bottom-menu-item { color: #d9def5 !important; }

.bottom-menu-item i {
    font-size: 21px !important;
    line-height: 1 !important;
}

.bottom-menu-item span {
    font-size: 10.5px !important;
    font-weight: 700 !important;
}

.bottom-menu-item.active,
.bottom-menu-item:hover {
    color: #667afa !important;
    background: linear-gradient(to top, rgba(102,122,250,.18), transparent) !important;
    border-bottom-color: #667afa !important;
}

/* MOBİL */
@media (max-width: 768px) {
    .topbar,
    .header-search-container,
    .header-nav {
        display: none !important;
    }

    .frontend-header,
    header.frontend-header {
        position: sticky !important;
        top: 0 !important;
        z-index: 1100 !important;
    }

    .frontend-header .header-top {
        min-height: 58px !important;
        padding: 8px 12px !important;
    }

    .frontend-header .mobile-menu-toggle {
        background: transparent !important;
        border: 0 !important;
        color: #303545 !important;
        box-shadow: none !important;
        font-size: 22px !important;
    }

    html[data-theme="dark"] .frontend-header .mobile-menu-toggle { color: #ffffff !important; }

    .frontend-header .logo-section {
        flex: 1 1 auto !important;
        justify-content: flex-start !important;
    }

    .frontend-header .logo-section img,
    .frontend-header .header-top .logo-section img,
    .frontend-header .logo-section a img {
        height: 33px !important;
        max-height: 33px !important;
        max-width: 126px !important;
    }

    .frontend-header .header-actions {
        max-width: 184px !important;
        gap: 7px !important;
    }

    .frontend-header .theme-toggle-btn {
        width: 34px !important;
        height: 34px !important;
        min-width: 34px !important;
        flex-basis: 34px !important;
    }

    .frontend-header .user-actions .notifications-btn {
        width: 34px !important;
        height: 34px !important;
        min-width: 34px !important;
        flex-basis: 34px !important;
    }

    .frontend-header .user-actions .nav-item.has-dropdown {
        min-width: 104px !important;
        max-width: 118px !important;
        height: 38px !important;
        padding: 5px 7px !important;
        border-radius: 10px !important;
    }

    .frontend-header .user-actions .nav-item.has-dropdown img {
        width: 25px !important;
        height: 25px !important;
    }

    .frontend-header .user-actions .nav-item .user-info span:not(.username) {
        color: #d0a430 !important;
        font-weight: 800 !important;
    }

    html[data-theme="light"] header.frontend-header .user-actions .account-dropdown-menu,
    html[data-theme="light"] header.frontend-header .user-actions .nav-item.has-dropdown > .dropdown-menu {
        background: #ffffff !important;
        color: #222735 !important;
        border-color: #e5e7ef !important;
    }

    header.frontend-header .user-actions .account-dropdown-menu,
    header.frontend-header .user-actions .nav-item.has-dropdown > .dropdown-menu {
        top: 46px !important;
        right: 0 !important;
        width: 210px !important;
        min-width: 210px !important;
        border-radius: 12px !important;
        box-shadow: 0 18px 44px rgba(24,33,55,.20) !important;
    }
}

@media (max-width: 600px) {
    .tabs-section {
        padding-top: 14px !important;
    }

    .tabs-wrapper {
        padding-left: 12px !important;
        padding-right: 12px !important;
    }

    .tabs-left {
        gap: 8px !important;
    }

    .tab-btn {
        min-height: 38px !important;
        padding-right: 13px !important;
        font-size: 12px !important;
    }

    .listings-grid,
    #tab-vitrin .listings-grid,
    #tab-featured .listings-grid,
    #tab-all .listings-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 10px !important;
    }

    .listing-image,
    #tab-vitrin .listing-image,
    #tab-featured .listing-image,
    #tab-all .listing-image {
        height: 132px !important;
    }

    .listing-content,
    #tab-vitrin .listing-content,
    #tab-featured .listing-content,
    #tab-all .listing-content {
        padding: 8px 8px 5px !important;
    }

    .listing-title,
    #tab-vitrin .listing-title,
    #tab-featured .listing-title,
    #tab-all .listing-title {
        font-size: 12px !important;
        line-height: 15px !important;
        height: 32px !important;
        min-height: 32px !important;
    }

    .listing-description,
    #tab-vitrin .listing-description,
    #tab-featured .listing-description,
    #tab-all .listing-description {
        display: none !important;
    }

    .listing-footer,
    #tab-vitrin .listing-footer,
    #tab-featured .listing-footer,
    #tab-all .listing-footer {
        padding: 7px 8px !important;
    }

    .seller-avatar { width: 22px !important; height: 22px !important; }
    .seller-name { font-size: 10.5px !important; }

    .category-badge {
        width: 25px !important;
        height: 25px !important;
    }

    .price-badge {
        font-size: 10px !important;
        padding: 4px 5px !important;
    }

    .listing-ribbon {
        font-size: 8px !important;
        padding: 3px 5px !important;
    }
}

@media (max-width: 380px) {
    .frontend-header .logo-section img,
    .frontend-header .header-top .logo-section img,
    .frontend-header .logo-section a img {
        height: 30px !important;
        max-height: 30px !important;
        max-width: 112px !important;
    }

    .frontend-header .header-actions {
        max-width: 176px !important;
        gap: 5px !important;
    }

    .frontend-header .user-actions .nav-item.has-dropdown {
        min-width: 96px !important;
        max-width: 108px !important;
    }

    .listing-image,
    #tab-vitrin .listing-image,
    #tab-featured .listing-image,
    #tab-all .listing-image {
        height: 122px !important;
    }
}

/* === Header menü yazı kısalması + açılır alt menü düzeltmesi === */
@media (min-width: 769px) {
    .frontend-header .header-nav,
    header.frontend-header .header-nav {
        overflow: visible !important;
        position: relative !important;
        z-index: 2200 !important;
    }

    .frontend-header .header-nav > div,
    header.frontend-header .header-nav > div {
        overflow: visible !important;
        flex-wrap: nowrap !important;
        align-items: center !important;
    }

    .frontend-header .header-nav .nav-item,
    .frontend-header .header-nav a.nav-item,
    header.frontend-header .header-nav .nav-item,
    header.frontend-header .header-nav a.nav-item {
        flex: 0 0 auto !important;
        max-width: none !important;
        overflow: visible !important;
    }

    .frontend-header .header-nav .nav-item > span,
    .frontend-header .header-nav a.nav-item > span,
    header.frontend-header .header-nav .nav-item > span,
    header.frontend-header .header-nav a.nav-item > span {
        max-width: none !important;
        min-width: max-content !important;
        width: auto !important;
        overflow: visible !important;
        text-overflow: clip !important;
        white-space: nowrap !important;
        display: inline-flex !important;
        align-items: center !important;
    }

    .frontend-header .header-nav .nav-item.has-dropdown:hover > .dropdown-menu,
    .frontend-header .header-nav .nav-item.has-dropdown.is-open > .dropdown-menu,
    header.frontend-header .header-nav .nav-item.has-dropdown:hover > .dropdown-menu,
    header.frontend-header .header-nav .nav-item.has-dropdown.is-open > .dropdown-menu {
        opacity: 1 !important;
        visibility: visible !important;
        pointer-events: auto !important;
    }

    .frontend-header .header-nav .nav-item.has-dropdown:not([data-view-type="1"]):not([data-view-type="2"]):hover > .dropdown-menu,
    .frontend-header .header-nav .nav-item.has-dropdown:not([data-view-type="1"]):not([data-view-type="2"]).is-open > .dropdown-menu,
    header.frontend-header .header-nav .nav-item.has-dropdown:not([data-view-type="1"]):not([data-view-type="2"]):hover > .dropdown-menu,
    header.frontend-header .header-nav .nav-item.has-dropdown:not([data-view-type="1"]):not([data-view-type="2"]).is-open > .dropdown-menu {
        transform: translateY(0) !important;
        z-index: 4000 !important;
    }

    .frontend-header .header-nav .nav-item.has-dropdown[data-view-type="1"]:hover > .dropdown-menu,
    .frontend-header .header-nav .nav-item.has-dropdown[data-view-type="1"].is-open > .dropdown-menu,
    .frontend-header .header-nav .nav-item.has-dropdown[data-view-type="2"]:hover > .dropdown-menu,
    .frontend-header .header-nav .nav-item.has-dropdown[data-view-type="2"].is-open > .dropdown-menu,
    header.frontend-header .header-nav .nav-item.has-dropdown[data-view-type="1"]:hover > .dropdown-menu,
    header.frontend-header .header-nav .nav-item.has-dropdown[data-view-type="1"].is-open > .dropdown-menu,
    header.frontend-header .header-nav .nav-item.has-dropdown[data-view-type="2"]:hover > .dropdown-menu,
    header.frontend-header .header-nav .nav-item.has-dropdown[data-view-type="2"].is-open > .dropdown-menu {
        opacity: 1 !important;
        visibility: visible !important;
        pointer-events: auto !important;
        z-index: 4000 !important;
    }

    .frontend-header .header-nav .categories-dropdown,
    header.frontend-header .header-nav .categories-dropdown {
        overflow: visible !important;
        z-index: 4000 !important;
    }

    .frontend-header .header-nav .categories-panel,
    header.frontend-header .header-nav .categories-panel {
        max-width: min(1400px, calc(100vw - 48px)) !important;
        min-width: 0 !important;
        width: min(1400px, calc(100vw - 48px)) !important;
    }
}