/* Mobile Responsive - Linux Hosting Pricing Table */
.v3-host-row.active { overflow: visible !important; }
.v3-host-row.active .v3-host-details { border-radius: 0 0 20px 20px; overflow: hidden; }

/* Ribbon hidden, discount shown under name */
.v3-host-ribbon-wrap { display: none !important; }
.v3-host-badge-promo.tag-indirim {
    display: inline-flex !important;
    min-width: auto;
    padding: 3px 10px;
    border-radius: 20px;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.3px;
    flex-direction: row;
    align-items: center;
    gap: 0;
    margin-top: 4px;
}
.v3-host-badge-promo.tag-indirim.pct-default { background: linear-gradient(135deg, #f97316, #f59e0b) !important; }
.v3-host-row-head .v3-host-meta h3 { margin-bottom: 2px; }

@media (max-width: 991px) {
    .v3-host-root { padding: 25px 0; background: #fcfdfe; overflow-x: hidden; }
    .v3-host-container { padding: 0 12px; overflow-x: hidden; }
    .v3-host-ctrl { flex-direction: column; align-items: stretch; gap: 15px; margin-bottom: 25px; }

    .v3-host-switch-box.cycle-box {
        align-self: flex-end;
        padding: 4px 6px;
        display: inline-flex;
        gap: 4px;
        border-radius: 10px;
        background: #f8fbff;
        border: 1px solid #eef2f6;
    }
    .cycle-box .v3-host-switch-btn {
        flex: 0 1 auto;
        padding: 7px 14px;
        font-size: 11px;
        border-radius: 8px;
    }

    .v3-host-switch-box.category-box {
        display: flex;
        flex-wrap: wrap;
        padding: 4px;
        border-radius: 12px;
        gap: 3px;
    }
    .v3-host-switch-btn {
        flex: 0 0 calc(50% - 2px);
        justify-content: center;
        padding: 8px 4px;
        font-size: 10px;
        white-space: nowrap;
        border-radius: 9px;
        text-align: center;
    }
    .v3-host-switch-btn i { margin-right: 3px; font-size: 11px; }

    .v3-host-row { border-radius: 16px; margin-bottom: 12px; border-color: #e2e8f0; border-width: 1px; }

    .v3-host-row-head {
        display: grid !important;
        grid-template-columns: repeat(2, 1fr) !important;
        padding: 12px 15px !important;
        gap: 10px;
        position: relative;
    }

    .v3-host-arr {
        position: absolute;
        top: 16px;
        right: 12px;
        color: #94a3b8;
        font-size: 11px;
        display: block !important;
    }

    .v3-host-meta {
        grid-column: span 2;
        display: flex;
        align-items: center;
        flex-wrap: wrap;
        justify-content: flex-start;
        gap: 6px;
        width: 100%;
        margin: 0;
        padding-bottom: 8px;
        border-bottom: 1px solid #f1f5f9;
    }
    .v3-host-meta h3 { font-size: 14px; margin: 0; color: #1e293b; font-weight: 800; line-height: 1.2; }

    .v3-host-spec {
        display: grid !important;
        grid-template-columns: 20px 1fr !important;
        grid-template-rows: auto auto;
        gap: 0 6px;
        padding: 0 !important;
        margin: 0 !important;
        align-items: center;
        justify-items: start;
        text-align: left;
    }

    .v3-host-row-head > div.v3-host-spec:nth-child(n+7) {
        display: grid !important;
    }

    .v3-host-spec > i {
        grid-row: span 2;
        font-size: 12px;
        margin: 0 !important;
        color: #4484f3;
        background: #f0f7ff;
        width: 20px;
        height: 20px;
        display: flex;
        align-items: center;
        justify-content: center;
        border-radius: 5px;
        align-self: center;
    }
    .v3-host-spec span {
        font-size: 11px;
        font-weight: 800;
        color: #334155;
        line-height: 1.2;
        margin: 0 !important;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
        max-width: 100%;
        align-self: end;
    }
    .v3-host-spec small {
        font-size: 8px;
        font-weight: 600;
        color: #94a3b8;
        text-transform: uppercase;
        letter-spacing: 0;
        display: block;
        align-self: start;
        line-height: 1;
    }

    .v3-host-action {
        grid-column: span 2;
        width: 100%;
        display: flex;
        flex-direction: row;
        justify-content: space-between;
        align-items: center;
        background: #f8fbff;
        margin: 5px -15px -12px -15px;
        padding: 10px 15px;
        width: calc(100% + 30px);
        border-top: 1px solid #edf2f7;
    }
    .v3-host-price-wrap { margin: 0; display: flex; flex-direction: column; align-items: flex-start; }
    .v3-host-old-p { font-size: 10px; height: auto; }
    .v3-host-price-main { font-size: 18px; color: #0F66DD; }
    .v3-host-price-main .p-ay { font-size: 10px; }
    .v3-host-buy-btn {
        height: 34px;
        padding: 0 12px;
        font-size: 11px;
        border-radius: 8px;
        background: #0F66DD;
        align-items: center;
    }

    .v3-host-details { border-top: 0; }
    .v3-host-row.active .v3-host-details { padding: 15px; max-height: 1200px; }
    .v3-host-details-flex { flex-direction: column; gap: 15px; background: #fff; }
    .v3-host-details-left, .v3-host-details-right { width: 100%; }

    .v3-host-feat-grid {
        grid-template-columns: repeat(2, 1fr) !important;
        gap: 6px;
    }
    .v3-host-feat-item {
        padding: 8px 10px;
        border-color: #f1f5f9;
        font-size: 11px;
        box-shadow: none;
    }

    .v3-host-why-box { padding: 12px; border-style: solid; border-color: #edf2f9; }
    .v3-host-badges { display: none !important; }
    .v3-host-badge-item { display: none !important; }

    .v3-host-compare-wrap {
        position: absolute;
        bottom: 6px;
        left: 50%;
        transform: translateX(-50%);
        margin: 0;
        padding: 0;
        border: none;
    }
    .v3-host-row.active .v3-host-details { padding-bottom: 50px; }
    .v3-host-ribbon-wrap { display: none !important; }
    .v3-host-badge-promo.tag-indirim { display: inline-flex !important; margin-top: 2px; font-size: 8px; }
    .v3-host-meta-title-container { display: flex; align-items: center; flex-wrap: wrap; gap: 3px; }

    .renewal-table { font-size: 11px; }
    .renewal-table th { padding: 6px 8px; font-size: 10px; }
    .renewal-table td { padding: 7px 8px; }
    .renewal-table td.renewal-period { font-size: 10px; }
    .renewal-table td.renewal-total { font-size: 11px; }
    .v3-host-renewal-box { padding: 12px 14px; }
    .renewal-table-side-by-side { font-size: 11px; }
    .renewal-table-side-by-side th { padding: 6px 6px; font-size: 10px; }
    .renewal-table-side-by-side td { padding: 6px 6px; }
    .renewal-table-side-by-side td.renewal-period { font-size: 10px; }
    .renewal-table-side-by-side td.renewal-total { font-size: 11px; }
}

@media (max-width: 480px) {
    .v3-host-switch-btn { font-size: 9px; padding: 7px 4px; }
    .v3-host-buy-btn { height: 30px; padding: 0 8px; font-size: 10px; }
    .v3-host-price-main { font-size: 15px; }
}

/* Improved Renewal Table Styles */
.v3-host-renewal-box {
    background: #fff;
    border: 1px solid #e8ecf1;
    padding: 18px 20px;
    border-radius: 14px;
    box-shadow: 0 2px 8px rgba(0,0,0,0.03);
    margin-bottom: 15px;
}
.v3-host-renewal-box h4 {
    font-size: 15px;
    font-weight: 700;
    color: #1e293b;
    margin-bottom: 14px;
    display: flex;
    align-items: center;
    gap: 8px;
}
.v3-host-renewal-box h4::before {
    content: '\21BB';
    font-size: 16px;
    color: #0F66DD;
    font-weight: 700;
}
.renewal-table, .renewal-table-side-by-side {
    width: 100%;
    border-collapse: collapse;
    font-size: 12px;
}
.renewal-table th, .renewal-table-side-by-side th {
    background: #f8fafc;
    padding: 8px 12px;
    text-align: left;
    font-weight: 600;
    color: #64748b;
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: 0.3px;
    border-bottom: 2px solid #e2e8f0;
    border-top: none;
    border-left: none;
    border-right: none;
}
.renewal-table td, .renewal-table-side-by-side td {
    padding: 9px 12px;
    border-bottom: 1px solid #f1f5f9;
    background: #fff;
    border-left: none;
    border-right: none;
}
.renewal-table tr:last-child td, .renewal-table-side-by-side tr:last-child td { border-bottom: none; }
.renewal-table td.renewal-period, .renewal-table-side-by-side td.renewal-period {
    font-weight: 600;
    color: #475569;
    font-size: 13px;
}
.renewal-table td.renewal-total, .renewal-table-side-by-side td.renewal-total {
    font-weight: 700;
    color: #0F66DD;
    font-size: 14px;
    text-align: right;
}
.renewal-table tbody tr:nth-child(even) td, .renewal-table-side-by-side tr:nth-child(odd) td:nth-child(odd) { background: #f8fbff; }
.renewal-table-side-by-side tr:nth-child(even) td:nth-child(odd) { background: #f8fbff; }
.renewal-table-side-by-side td:nth-child(odd) { font-weight: 600; }

/* Mobile Banner Fixes */
@media (max-width: 991px) {
    .arer-pricing-card-wrapper { margin-top: 20px; margin-bottom: 20px; }
    .arer-pricing-card { max-width: 280px; margin: 0 auto; }
    .banner-sub-nav-wrapper { margin-top: 30px; }
    .banner-sub-nav-card { background: #f8fbff; border-radius: 16px; padding: 8px 4px; box-shadow: 0 4px 15px rgba(0,0,0,0.05); }
    .sub-nav-list { justify-content: center; gap: 4px; flex-wrap: wrap; }
    .sub-nav-list .nav-item { flex: 1 1 auto; text-align: center; }
    .sub-nav-list .nav-item a { padding: 8px 6px; font-size: 11px; white-space: nowrap; }
    .sub-nav-list .nav-item a i { margin-right: 3px; font-size: 10px; }
}
@media (max-width: 480px) {
    .arer-pricing-card { max-width: 240px; }
    .sub-nav-list .nav-item a { font-size: 10px; padding: 6px 4px; }
    .sub-nav-list .nav-item a i { font-size: 9px; }
}

/* Mobile: Show all features */
@media (max-width: 991px) {
    .v3-host-row-head .fa-question-circle { display: inline-block !important; }
}

/* Hosting Comparison */
@media (max-width: 991px) {
    .table-comparison { overflow-x: auto; display: block; }
    .hosting-comparison-section { padding: 30px 15px; }
    #paketdetaylar { padding: 0 10px; overflow: hidden; }
}

/* Keep hosting package values and help icons on one line. */
.v3-host-root .v3-host-spec > span {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 4px;
    max-width: 100%;
    min-width: 0;
    overflow: visible;
    white-space: nowrap;
}
.v3-host-root .v3-host-spec .v3-tooltip-wrapper {
    display: inline-flex;
    align-items: center;
    flex: 0 0 auto;
    margin-left: 4px;
}
.v3-host-root .v3-host-spec .v3-tooltip-wrapper > i {
    flex: 0 0 auto;
}
.v3-host-root .v3-host-spec > span > i.v3-host-spec-help-icon {
    flex: 0 0 auto;
    font-size: 11px !important;
    color: #4484f3 !important;
    cursor: pointer;
    vertical-align: middle;
}

/* Keep renewal period and total columns aligned when a price is unavailable. */
.renewal-table,
.renewal-table-side-by-side {
    table-layout: fixed;
}
.renewal-table th:first-child,
.renewal-table td.renewal-period {
    width: 35%;
}
.renewal-table th:last-child,
.renewal-table td.renewal-total {
    width: 65%;
}
.renewal-table-side-by-side th:nth-child(odd),
.renewal-table-side-by-side td.renewal-period {
    width: 22%;
}
.renewal-table-side-by-side th:nth-child(even),
.renewal-table-side-by-side td.renewal-total {
    width: 28%;
}
.renewal-table td.renewal-period,
.renewal-table-side-by-side td.renewal-period,
.renewal-table td.renewal-total,
.renewal-table-side-by-side td.renewal-total {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    vertical-align: middle;
    white-space: nowrap;
}
.renewal-table td.renewal-total,
.renewal-table-side-by-side td.renewal-total {
    font-variant-numeric: tabular-nums;
}
.renewal-table th:last-child,
.renewal-table-side-by-side th:nth-child(even) {
    text-align: right;
}

/* ===== yenileme tablosu: ilk sipariş sutunu (yeşil) ===== */
.renewal-fo-table th:first-child,
.renewal-fo-table td.renewal-period {
    width: 34%;
}
.renewal-fo-table th:nth-child(2),
.renewal-fo-table td.renewal-total {
    width: 33%;
}
.renewal-fo-table th:last-child,
.renewal-fo-table td.renewal-fo {
    width: 33%;
}
.renewal-fo-table th:nth-child(2) {
    text-align: right;
}
.renewal-fo-table th.rn-fo-th {
    color: #16a34a;
    text-align: right;
}
.renewal-table td.renewal-fo,
.renewal-table-side-by-side td.renewal-fo {
    text-align: right;
    font-variant-numeric: tabular-nums;
    white-space: nowrap;
    width: 22%;
}
.renewal-table td.renewal-fo b,
.renewal-table-side-by-side td.renewal-fo b {
    color: #16a34a;
    font-weight: 700;
}
.renewal-table-side-by-side.renewal-fo-table th:nth-child(1),
.renewal-table-side-by-side.renewal-fo-table th:nth-child(4) { width: 17%; }
.renewal-table-side-by-side.renewal-fo-table th:nth-child(2),
.renewal-table-side-by-side.renewal-fo-table th:nth-child(5) { width: 16%; }
.renewal-table-side-by-side.renewal-fo-table th:nth-child(3),
.renewal-table-side-by-side.renewal-fo-table th:nth-child(6) { width: 17%; text-align: right; }
.renewal-table-side-by-side.renewal-fo-table th.rn-fo-th { color: #16a34a; }
@media (max-width: 768px) {
    .renewal-fo-table { font-size: 10px; }
    .renewal-fo-table th { padding: 5px 6px; font-size: 9px; }
    .renewal-fo-table td { padding: 6px; }
}