/*
Author : SiberMimar "Güray Avcı"
Website: www.sibermimar.com.tr

Theme  : SiberMtema (WHMCS 8.13)
Palette: Canlı Yeşil Gradient (Green) / Altın (Gold) / Parlament Mavisi (Parliament Blue)
*/

:root {
    --egn-white: #ffffff;
    --egn-black: #0b0b0b;

    /* =========================================================================
       SPR-006 Brand Color System
       - Green Gradient Background
       - Gold Accents
       - Parliament Blue Lines
       ========================================================================= */
    /*
       SPR-118: Arkaplan yeşili "tatlı + parlak" ama aşırı beyazlaşmadan
       - LCD / gaming monitörlerde uçuk (çok beyaz) veya çok koyu görünümü azaltmak için
         gradient aralığı dengelendi (çok açık/çok koyu uçlar kısıldı).
       - Logo alanı / header wedge bozulmaz.
    */
    --egn-orange-0: #4e9c22;
    --egn-orange-1: #5ca51d;
    --egn-orange-2: #52a329;
    --egn-orange-3: #67ab2b;
    --egn-bg-gradient: linear-gradient(150deg,
        var(--egn-orange-0) 0%,
        var(--egn-orange-1) 18%,
        var(--egn-orange-3) 46%,
        var(--egn-orange-2) 100%
    );

--egn-gold: #d4af37;
    --egn-gold-hover: #c79c2e;

    /* Parliament Blue */
    --egn-parliament: #0B3EDC;
    --egn-parliament-hover: #0A3DFF;
    --egn-parliament-soft: rgba(11, 62, 220, 0.08);

    /* Compatibility aliases (legacy naming used across theme) */
    --egn-navy: var(--egn-parliament);
    --egn-navy-hover: var(--egn-parliament-hover);
    --egn-navy-soft: var(--egn-parliament-soft);

    /* SPR-166: Link/Accent Palette (Mavi tonları kaldırıldı) */
    --egn-link: #1b5e20;           /* koyu yeşil */
    --egn-link-hover: #124317;     /* hover: daha koyu */
    --egn-link-soft: rgba(27, 94, 32, 0.12);
    --egn-link-border: rgba(27, 94, 32, 0.22);

    /* Lines / Dividers (Neutral) */
    --egn-border: rgba(0, 0, 0, 0.12);

    /* Surfaces */
    --egn-surface: rgba(255, 255, 255, 0.92);
    --egn-surface-solid: #ffffff;

    /* Focus */
    --egn-focus: rgba(27, 94, 32, 0.45);
    --egn-focus-dark: rgba(255, 255, 255, 0.85);

    /* Typography */
    --egn-font-family: "Montserrat", system-ui, -apple-system, "Segoe UI", Arial, sans-serif;
    --egn-font-weight: 400;
    --egn-font-weight-emphasis: 500;
}

/* =========================================================================
   SPR-148 (REQ-008): Client Area fullwidth + üst panel navigasyonu
   - Sol sidebar kaldırılır (header.tpl siberNoSidebar)
   - Sidebar linkleri içerik üstünde yatay dropdown menüye taşınır
   ========================================================================= */

.primary-content.siber-clientpanel-content {
    /* İçerik odaklı: sol sidebar yokken de ritim korunur */
    padding-top: 8px;
}

.siber-clientpanel-nav {
    margin: 0 0 16px;
}

.siber-clientpanel-nav__inner {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 10px;
    padding: 10px 12px;
    border-radius: 18px;
    background: linear-gradient(180deg, rgba(10, 46, 107, 0.92), rgba(10, 46, 107, 0.78));
    border: 1px solid rgba(255, 255, 255, 0.14);
    box-shadow: 0 16px 40px rgba(0, 0, 0, 0.20);
}

.siber-clientpanel-nav__title {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    color: #ffffff;
    font-weight: 800;
    letter-spacing: 0.2px;
    padding: 6px 10px;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.08);
    border: 1px solid rgba(255, 255, 255, 0.12);
}

.siber-clientpanel-nav__title:hover,
.siber-clientpanel-nav__title:focus,
.siber-clientpanel-nav__title:active,
.siber-clientpanel-nav__title:visited {
    color: #ffffff;
    text-decoration: none;
}

.siber-clientpanel-nav__items {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 8px;
    flex: 1;
    min-width: 220px;
}

.siber-clientpanel-nav__sep {
    width: 1px;
    height: 30px;
    background: rgba(255, 255, 255, 0.18);
    margin: 0 4px;
}

.siber-clientpanel-nav__dd {
    position: relative;
}

.siber-clientpanel-nav__btn {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    padding: 8px 12px;
    border-radius: 999px;
    color: #ffffff !important;
    background: rgba(255, 255, 255, 0.08) !important;
    border: 1px solid rgba(255, 255, 255, 0.14) !important;
    font-weight: 700;
    line-height: 1;
    white-space: nowrap;
}

.siber-clientpanel-nav__btn:hover,
.siber-clientpanel-nav__btn:focus {
    color: #ffffff !important;
    background: rgba(255, 255, 255, 0.10) !important;
    border-color: rgba(255, 255, 255, 0.18) !important;
}

.siber-clientpanel-nav__link,
.siber-clientpanel-nav__link:hover,
.siber-clientpanel-nav__link:focus {
    text-decoration: none !important;
}


.siber-clientpanel-nav__btn .badge {
    background: rgba(255, 255, 255, 0.16);
    color: #ffffff;
    font-weight: 800;
    padding: 4px 8px;
    border-radius: 999px;
}

.siber-clientpanel-nav .dropdown-menu.siber-clientpanel-nav__menu {
    background: linear-gradient(180deg, rgba(10, 46, 107, 0.96), rgba(10, 46, 107, 0.90)) !important;
    border: 1px solid rgba(255, 255, 255, 0.14) !important;
    box-shadow: 0 22px 55px rgba(0, 0, 0, 0.28) !important;
    padding: 8px;
    border-radius: 14px;
    min-width: 260px;
}

.siber-clientpanel-nav__menu .dropdown-item,
.siber-clientpanel-nav__menu .dropdown-item-text,
.siber-clientpanel-nav__menu .dropdown-header {
    color: rgba(255, 255, 255, 0.92) !important;
}

.siber-clientpanel-nav__menu .dropdown-item {
    display: flex;
    align-items: center;
    gap: 10px;
    border-radius: 10px;
    padding: 10px 12px;
}

.siber-clientpanel-nav__menu .dropdown-item:hover,
.siber-clientpanel-nav__menu .dropdown-item:focus {
    background: rgba(255, 255, 255, 0.10) !important;
    color: #ffffff !important;
}

.siber-clientpanel-nav__menu .dropdown-item.active {
    background: rgba(0, 200, 83, 0.18) !important;
    color: #ffffff !important;
}

.siber-clientpanel-nav__hdr {
    margin: 8px 0 6px;
    padding: 0 10px;
    font-weight: 900;
    letter-spacing: 0.2px;
    color: rgba(255, 255, 255, 0.72) !important;
    text-transform: uppercase;
    font-size: 12px;
}

.siber-clientpanel-nav__hdrlink,
.siber-clientpanel-nav__hdrlink:hover,
.siber-clientpanel-nav__hdrlink:focus {
    color: rgba(255, 255, 255, 0.92) !important;
    text-decoration: none !important;
}

.siber-clientpanel-nav__subitem {
    padding-left: 22px;
}

@media (max-width: 767.98px) {
    .siber-clientpanel-nav__inner {
        padding: 10px;
        border-radius: 16px;
    }

    .siber-clientpanel-nav__title {
        width: 100%;
        justify-content: center;
    }

    /* Mobilde dağınık flex-wrap yerine 2 kolon grid mantığı */
    .siber-clientpanel-nav__items {
        width: 100%;
        justify-content: space-between;
        align-items: stretch;
    }

    .siber-clientpanel-nav__items > a.siber-clientpanel-nav__btn,
    .siber-clientpanel-nav__items > .siber-clientpanel-nav__dd {
        flex: 1 1 calc(50% - 6px);
        min-width: 0;
    }

    .siber-clientpanel-nav__items > a.siber-clientpanel-nav__btn {
        display: inline-flex;
        justify-content: center;
    }

    .siber-clientpanel-nav__items > .siber-clientpanel-nav__dd > .siber-clientpanel-nav__btn {
        width: 100%;
        justify-content: center;
    }

    .siber-clientpanel-nav__btn {
        padding: 9px 10px;
        font-size: 13px;
        gap: 8px;
    }

    .siber-clientpanel-nav__sep {
        width: 100%;
        height: 1px;
        margin: 2px 0;
        background: rgba(255, 255, 255, 0.16);
    }
}

/* ===== Layout: Fluid Full Width (Readable) =====
   - Global full width hissi korunur; çok geniş ekranlarda okuma genişliği kontrol edilir.
   - Store/Kategori (ORB) dili: geniş grid + kontrollü padding.
*/
@media (min-width: 992px) {
    .container,
    .container-sm,
    .container-md,
    .container-lg,
    .container-xl,
    .container-xxl {
        max-width: var(--egn-page-max, 1760px) !important;
        padding-left: var(--egn-page-pad, 28px);
        padding-right: var(--egn-page-pad, 28px);
    }
}

@media (max-width: 991.98px) {
    .container,
    .container-sm,
    .container-md,
    .container-lg,
    .container-xl,
    .container-xxl {
        padding-left: var(--egn-page-pad-sm, 16px);
        padding-right: var(--egn-page-pad-sm, 16px);
    }
}

/* ===== Global Typography (Montserrat, no heavy weights) ===== */
body,
.primary-bg-color,
button,
input,
select,
textarea,
.btn,
.form-control,
.custom-select,
.navbar,
.dropdown-menu {
    font-family: var(--egn-font-family);
}

body {
    font-weight: var(--egn-font-weight);
    font-synthesis: none;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    font-size: 15.5px;
    line-height: 1.55;
    color: var(--egn-text, rgba(11, 11, 11, 0.92));
}

#main-body {
    color: var(--egn-text, rgba(11, 11, 11, 0.92));
}

#main-body .text-muted,
#main-body small.text-muted {
    color: var(--egn-text-muted, rgba(11, 11, 11, 0.62)) !important;
}

#main-body p,
#main-body li {
    line-height: 1.70;
}


h1, h2, h3, h4, h5, h6,
.h1, .h2, .h3, .h4, .h5, .h6 {
    font-family: var(--egn-font-family);
    font-weight: var(--egn-font-weight-emphasis);
    letter-spacing: -0.01em;
}

strong, b,
.font-weight-bold,
.font-weight-bolder,
.fw-bold,
.fw-bolder {
    font-weight: var(--egn-font-weight-emphasis) !important;
}

/* ===== Icon Safety (Font Awesome Pro/Lite -> Free Fallback) =====
   Bazı WHMCS sayfaları "fal" (light) / "fad" (duotone) sınıfları kullanabilir.
   Pro fontlar yüklü değilse ikonlar boş görünebilir. Bu fallback ile
   ikonlar ücretsiz Solid font ile güvenli şekilde görünür.
*/
.fal,
.fad,
.fa-light,
.fa-duotone {
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
}

/* Ticket yıldızları: tema.css içinde "Font Awesome 5 Pro" referansı var */
.ticket-reply .rating span.star,
.ticket-reply .rating-done span.star {
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
}

/* ===== Skip Link (Accessibility) ===== */
.egn-skip-link {
    position: absolute;
    left: 12px;
    top: 10px;
    padding: 10px 14px;
    border-radius: 12px;
    background: var(--egn-navy);
    color: var(--egn-white);
    z-index: 9999;
    transform: translateY(-160%);
    transition: transform 160ms ease;
}

.egn-skip-link:focus,
.egn-skip-link:focus-visible {
    transform: translateY(0);
    outline: 3px solid var(--egn-focus-dark);
    outline-offset: 2px;
    text-decoration: none;
}

/* ===== Focus Rings (Accessibility) ===== */
a:focus-visible,
button:focus-visible,
.btn:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible,
.form-control:focus-visible,
.custom-select:focus-visible,
.dropdown-item:focus-visible,
.nav-link:focus-visible {
    outline: 3px solid var(--egn-focus);
    outline-offset: 2px;
}

header.header .topbar a:focus-visible,
header.header .topbar button:focus-visible,
.home-domain-search a:focus-visible,
.home-domain-search button:focus-visible,
.home-domain-search input:focus-visible,
.egn-hero a:focus-visible,
.egn-hero button:focus-visible {
    outline-color: var(--egn-focus-dark);
}


/* ===== Layout / Background (SPR-006) ===== */
body.primary-bg-color {
    /* Green gradient base (monitor-gamma balanced) */
    background-color: var(--egn-orange-0);
    background-image:
        radial-gradient(circle at 18% 14%, rgba(255, 249, 220, 0.12), rgba(255, 249, 220, 0) 58%),
        radial-gradient(circle at 88% 86%, rgba(0, 0, 0, 0.12), rgba(0, 0, 0, 0) 62%),
        var(--egn-bg-gradient);
    background-attachment: fixed;
    min-height: 100vh;
}

/* Keep legacy utility class usable on components (orderforms use this too) */
.primary-bg-color {
    background-color: var(--egn-surface-solid);
}

/* Main surface layer for readability on gradient background */
#main-body {
    background: var(--egn-surface);
    border-top: 1px solid var(--egn-border);
    backdrop-filter: blur(10px);
}

/* Header topbar */
header.header .topbar {
    background-color: var(--egn-black);
}

/* SPR-013: Logged-in topbar aksiyonlari (Sepet + Secondary Nav) */
header.header .topbar .egn-topbar-actions {
    gap: 10px;
}

header.header .topbar .egn-topbar-nav {
    margin: 0;
    padding: 0;
    list-style: none;
    gap: 6px;
}

header.header .topbar .egn-topbar-nav .nav-link {
    padding-top: 0.35rem;
    padding-bottom: 0.35rem;
}

/* Breadcrumb */
.master-breadcrumb {
    background-color: var(--egn-white);
    border-bottom: 1px solid var(--egn-border);
}

/* ===== Links ===== */
a {
    color: var(--egn-link);
}

a:hover,
a:focus {
    color: var(--egn-link-hover);
}

a:not(.btn):not(.nav-link):not(.dropdown-item):hover,
a:not(.btn):not(.nav-link):not(.dropdown-item):focus {
    text-decoration: underline;
    text-underline-offset: 2px;
}

/* ===== Buttons (SPR-006: Primary as Gold) ===== */
.btn-primary,
.btn-info,
a.btn-primary,
a.btn-info {
    background-color: var(--egn-gold);
    border-color: var(--egn-gold);
    color: var(--egn-black);
    box-shadow: 0 10px 20px rgba(212, 175, 55, 0.28);
}

.btn-primary:hover,
.btn-primary:focus,
.btn-info:hover,
.btn-info:focus,
a.btn-primary:hover,
a.btn-primary:focus,
a.btn-info:hover,
a.btn-info:focus {
    background-color: var(--egn-gold-hover);
    border-color: var(--egn-gold-hover);
    color: var(--egn-black);
}

.btn-primary:active,
.btn-info:active {
    box-shadow: 0 6px 14px rgba(212, 175, 55, 0.22);
}

.btn-outline-primary {
    color: var(--egn-link);
    border-color: var(--egn-link-border);
}

.btn-outline-primary:hover,
.btn-outline-primary:focus {
    background-color: var(--egn-gold);
    border-color: var(--egn-gold);
    color: var(--egn-black);
}

/* Cart badge */
.badge-info {
    background-color: var(--egn-gold);
    color: var(--egn-black);
}

/* ===== Forms ===== */
.form-control:focus,
.custom-select:focus {
    border-color: var(--egn-link-border);
    box-shadow: 0 0 0 0.2rem var(--egn-link-soft);
}

/* ===== Cards / Panels (Subtle modern look) ===== */
.card,
.panel {
    border-radius: 14px;
    border-color: var(--egn-border);
    box-shadow: 0 10px 30px rgba(10, 46, 107, 0.08);
}

.card-header,
.panel-heading {
    background-color: var(--egn-white);
    border-bottom-color: var(--egn-border);
}

/* Tables */
.table thead th {
    border-bottom: 2px solid var(--egn-border);
}

/* ===== Logo ===== */
header.header .logo-img {
    /* SPR-013: Logo biraz daha büyük ve okunur */
    max-height: 72px;
    width: auto;
    height: auto;
}

@media (max-width: 1199.98px) {
    header.header .logo-img {
        max-height: 60px;
    }
}


/* ===== Navbar (Unified Row Tweaks) ===== */
header.header .main-navbar-wrapper .navbar-brand {
    display: flex;
    align-items: center;
}

header.header .main-navbar-wrapper .toolbar .nav-link {
    padding-top: 0.35rem;
    padding-bottom: 0.35rem;
}

/* SPR-013: Desktop'ta menüyü sağa yasla (logo yanında yapışmasın) */
@media (min-width: 1200px) {
    header.header .main-navbar-wrapper .navbar-collapse {
        justify-content: flex-end;
    }

    header.header .main-navbar-wrapper #nav.navbar-nav {
        margin-left: auto;
    }

    header.header .main-navbar-wrapper .navbar-brand {
        margin-right: 2rem;
    }
}

/* ===== Footer Credit ===== */
#footer .designed-by {
    margin-top: 6px;
    color: rgba(0, 0, 0, 0.55);
    font-size: 0.875rem;
}

#footer .designed-by a {
    color: rgba(0, 0, 0, 0.70);
    text-decoration: none;
    border-bottom: 1px dashed rgba(10, 46, 107, 0.35);
}

#footer .designed-by a:hover {
    color: var(--egn-link);
    border-bottom-color: var(--egn-link);
}

/* ===== Spacing / Typography (Standardizasyon) ===== */
#main-body {
    padding-top: 1.25rem;
    padding-bottom: 2.75rem;
}

.egn-section {
    margin-top: 2.5rem;
    margin-bottom: 2.5rem;
}

.egn-section-title {
    margin: 1.75rem 0 1.25rem;
    font-weight: 500;
    letter-spacing: -0.02em;
    color: var(--egn-black);
}

@media (max-width: 576px) {
    .egn-section-title {
        margin: 1.25rem 0 1rem;
    }
}

/* ===== Navbar (Hover / Active) ===== */
header.header .navbar-light {
    border-bottom: 1px solid var(--egn-border);
}

header.header .main-navbar-wrapper {
    border-bottom: 1px solid var(--egn-border);
}

header.header .main-navbar-wrapper .navbar-nav .nav-link {
    /* SPR-028: Menü metinleri beyaz olmalı (kalıcı / köklü). */
    color: rgba(255, 255, 255, 0.92);
    font-weight: 500;
    border-radius: 10px;
    padding: 0.6rem 0.9rem;
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.22);
    transition: background-color 160ms ease, color 160ms ease, box-shadow 160ms ease;
}

header.header .main-navbar-wrapper .navbar-nav .nav-link:hover,
header.header .main-navbar-wrapper .navbar-nav .nav-link:focus {
    background-color: rgba(255, 255, 255, 0.10);
}

header.header .main-navbar-wrapper .navbar-nav .nav-item.active > .nav-link,
header.header .main-navbar-wrapper .navbar-nav .nav-link.active {
    color: var(--egn-black);
    background: var(--egn-gold-gradient);
    box-shadow:
        0 10px 20px rgba(212, 175, 55, 0.22),
        0 0 0 1px rgba(10, 46, 107, 0.22);
}

header.header .main-navbar-wrapper .dropdown-menu {
    border-radius: 14px;
    /* SPR-028: Dropdown arkaplanı şeffaf olmasın */
    background: linear-gradient(180deg, rgba(10, 46, 107, 0.96), rgba(10, 46, 107, 0.90));
    border: 1px solid rgba(255, 255, 255, 0.14);
    box-shadow: 0 22px 55px rgba(0, 0, 0, 0.28);
    backdrop-filter: blur(10px);
}

header.header .main-navbar-wrapper .dropdown-item {
    color: rgba(255, 255, 255, 0.92);
}

header.header .main-navbar-wrapper .dropdown-item:hover,
header.header .main-navbar-wrapper .dropdown-item:focus {
    background-color: rgba(255, 255, 255, 0.10);
}

/* ===== Guest Account Menu (SPR-008) ===== */
header.header .main-navbar-wrapper .siber-account-menu > .nav-link {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
}

header.header .main-navbar-wrapper .dropdown-menu.siber-account-dropdown {
    min-width: 260px;
}

header.header .main-navbar-wrapper .dropdown-menu.siber-account-dropdown .dropdown-item {
    display: flex;
    align-items: center;
    gap: 0.55rem;
}

header.header .main-navbar-wrapper .dropdown-menu.siber-account-dropdown .dropdown-item i {
    width: 18px;
    opacity: 0.85;
}

/* ===== Homepage Hero (Domain Search Block) ===== */
.home-domain-search {
    position: relative;
    overflow: hidden;
    border-bottom: 1px solid var(--egn-border);
    background-image:
        linear-gradient(135deg, rgba(0, 0, 0, 0.52), rgba(0, 0, 0, 0.10)),
        radial-gradient(900px 320px at 12% 12%, rgba(10, 46, 107, 0.55), rgba(10, 46, 107, 0) 60%),
        var(--egn-bg-gradient);
    color: var(--egn-white);
}

.home-domain-search h2 {
    color: var(--egn-white);
    font-weight: 500;
    letter-spacing: -0.02em;
}

.home-domain-search .egn-hero-badge {
    display: inline-block;
    padding: 0.35rem 0.85rem;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.12);
    border: 1px solid rgba(255, 255, 255, 0.18);
    font-weight: 500;
}

#frmDomainHomepage .input-group-wrapper {
    max-width: 860px;
    margin: 0 auto;
}

#frmDomainHomepage .input-group {
    border-radius: 16px;
    overflow: hidden;
    box-shadow: 0 18px 50px rgba(0, 0, 0, 0.25);
}

#frmDomainHomepage .form-control {
    border: 0;
    min-height: 54px;
}

#frmDomainHomepage .btn {
    min-height: 54px;
}

.home-domain-search .btn-primary {
    box-shadow: 0 12px 26px rgba(212, 175, 55, 0.24);
}

.home-domain-search .btn-success {
    background-color: var(--egn-black);
    border-color: var(--egn-black);
    box-shadow: 0 12px 26px rgba(0, 0, 0, 0.22);
}

.home-domain-search .btn-success:hover,
.home-domain-search .btn-success:focus {
    background-color: #111111;
    border-color: #111111;
}

.home-domain-search .egn-home-cta .btn-outline-light {
    border-width: 2px;
    font-weight: 500;
}

.home-domain-search .egn-home-cta .btn-light {
    color: var(--egn-black);
    font-weight: 500;
}

.home-domain-search .btn-link {
    color: rgba(255, 255, 255, 0.85);
}

.home-domain-search .btn-link:hover {
    color: var(--egn-white);
    text-decoration: none;
    border-bottom: 1px solid rgba(255, 255, 255, 0.35);
}

.home-domain-search .tld-logos li {
    color: rgba(255, 255, 255, 0.9);
}

.home-domain-search .tld-logos img {
    width: 52px;
    height: 32px;
    object-fit: contain;
    filter: drop-shadow(0 12px 24px rgba(0, 0, 0, 0.35));
}

/* ===== Homepage Hero (Fallback - Domain Search disabled) ===== */
.egn-hero {
    margin-top: 1.25rem;
    margin-bottom: 2.5rem;
    padding: 2.75rem 1.75rem;
    border-radius: 18px;
    background-image:
        linear-gradient(135deg, rgba(0, 0, 0, 0.52), rgba(0, 0, 0, 0.10)),
        radial-gradient(900px 320px at 12% 12%, rgba(10, 46, 107, 0.55), rgba(10, 46, 107, 0) 60%),
        var(--egn-bg-gradient);
    color: var(--egn-white);
    box-shadow: 0 18px 55px rgba(0, 0, 0, 0.18);
}

.egn-hero__title {
    font-weight: 500;
    letter-spacing: -0.03em;
    margin-bottom: 0.75rem;
}

.egn-hero__subtitle {
    margin: 0 auto;
    max-width: 64ch;
    opacity: 0.92;
    font-size: 1.05rem;
    line-height: 1.6;
}

/* ===== Homepage: Cards / Actions ===== */
.card-columns.home .card {
    transition: transform 160ms ease, box-shadow 160ms ease, border-color 160ms ease;
}

.card-columns.home .card:hover {
    transform: translateY(-3px);
    border-color: rgba(10, 46, 107, 0.25);
    box-shadow: 0 18px 50px rgba(10, 46, 107, 0.12);
}

/* 3-color palette override for action icon cards (prevents extra accent colors) */
.egn-action-icon-btns a[class^="card-accent-"],
.egn-action-icon-btns a[class*=" card-accent-"] {
    background: var(--egn-white);
    border: 1px solid var(--egn-border);
    border-radius: 16px;
    color: var(--egn-black);
    box-shadow: 0 10px 30px rgba(10, 46, 107, 0.08);
    transition: transform 160ms ease, box-shadow 160ms ease, border-color 160ms ease;
}

.egn-action-icon-btns a[class^="card-accent-"] .ico-container,
.egn-action-icon-btns a[class*=" card-accent-"] .ico-container {
    color: var(--egn-navy);
}

.egn-action-icon-btns a[class^="card-accent-"]:hover,
.egn-action-icon-btns a[class^="card-accent-"]:focus,
.egn-action-icon-btns a[class*=" card-accent-"]:hover,
.egn-action-icon-btns a[class*=" card-accent-"]:focus {
    border-color: rgba(10, 46, 107, 0.35);
    transform: translateY(-2px);
    box-shadow: 0 16px 40px rgba(10, 46, 107, 0.12);
    text-decoration: none;
}


/* ===== Reduced Motion (Accessibility) ===== */
@media (prefers-reduced-motion: reduce) {
    header.header .main-navbar-wrapper .navbar-nav .nav-link,
    .card-columns.home .card,
    .egn-action-icon-btns a[class^="card-accent-"],
    .egn-action-icon-btns a[class*=" card-accent-"] {
        transition: none;
    }
    .card-columns.home .card:hover,
    .egn-action-icon-btns a[class^="card-accent-"]:hover,
    .egn-action-icon-btns a[class*=" card-accent-"]:hover {
        transform: none;
    }
}


/* ===== Guest Utility Bar (Auth buttons) ===== */
.egn-utilitybar {
    background: var(--egn-black);
    color: rgba(255, 255, 255, 0.82);
    border-bottom: 1px solid rgba(255, 255, 255, 0.08);
}

.egn-utilitybar__inner {
    min-height: 46px;
    padding: 6px 0;

    /* SPR-013: Top bar 3 kolon düzen
       - Sol: Telefonlar + Destek Bildirimi Oluştur
       - Orta: Giriş / Kayıt
       - Sağ: Hesabım + Sepet + (varsa) secondary navbar
    */
    display: grid;
    grid-template-columns: 1fr auto 1fr;
    align-items: center;
    gap: 12px;
}

.egn-utilitybar__left {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    font-size: 12px;
    letter-spacing: 0.06em;
    text-transform: uppercase;
}

.egn-utilitybar__tag {
    color: rgba(255, 255, 255, 0.92);
    font-weight: 500;
}

.egn-utilitybar__sep {
    color: rgba(255, 255, 255, 0.26);
}

.egn-utilitybar__text {
    color: rgba(255, 255, 255, 0.72);
}

.egn-utilitybar__right {
    display: flex;
    align-items: center;
    justify-content: flex-end;
}

.egn-utilitybar__center {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
}

.egn-utilitybar__actions {
    display: inline-flex;
    align-items: center;
    justify-content: flex-end;
    gap: 8px;
    margin: 0;
    padding: 0;
    list-style: none;
}

.egn-utilitybar__actions .nav-link {
    padding-top: 0.35rem;
    padding-bottom: 0.35rem;
}

.egn-utilitybar__pill--support {
    background: rgba(10, 46, 107, 0.18);
    border-color: rgba(255, 255, 255, 0.20);
}

.egn-utilitybar__pill--support:hover,
.egn-utilitybar__pill--support:focus {
    background: rgba(10, 46, 107, 0.26);
    border-color: rgba(255, 255, 255, 0.28);
}

.egn-topbar-cart {
    border-radius: 999px;
    padding: 0.32rem 0.75rem;
    background: rgba(255, 255, 255, 0.06);
    border: 1px solid rgba(255, 255, 255, 0.18);
    color: rgba(255, 255, 255, 0.92);
    display: inline-flex;
    align-items: center;
    gap: 6px;
}

.egn-topbar-cart:hover,
.egn-topbar-cart:focus {
    background: #0b2f5f;
    border-color: rgba(255, 255, 255, 0.26);
    color: var(--egn-white);
}

.egn-topbar-cart .badge {
    margin-left: 2px;
}

.egn-utilitybar__link {
    color: rgba(255, 255, 255, 0.78);
    font-size: 13px;
    text-decoration: none;
}

.egn-utilitybar__link:hover,
.egn-utilitybar__link:focus {
    color: var(--egn-white);
    text-decoration: none;
}

.egn-btn-primary {
    background: var(--egn-gold);
    border: 1px solid var(--egn-gold);
    color: var(--egn-black);
    border-radius: 999px;
    padding: 0.35rem 0.9rem;
    font-weight: 500;
    box-shadow: 0 12px 24px rgba(212, 175, 55, 0.24);
}

.egn-btn-primary:hover,
.egn-btn-primary:focus {
    background: var(--egn-gold-hover);
    border-color: var(--egn-gold-hover);
    color: var(--egn-black);
}

.egn-btn-ghost {
    background: rgba(255, 255, 255, 0.04);
    border: 1px solid rgba(255, 255, 255, 0.18);
    color: var(--egn-white);
    border-radius: 999px;
    padding: 0.35rem 0.9rem;
    font-weight: 500;
}

.egn-btn-ghost:hover,
.egn-btn-ghost:focus {
    background: rgba(255, 255, 255, 0.08);
    border-color: rgba(255, 255, 255, 0.24);
    color: var(--egn-white);
}

@media (max-width: 576px) {
    .egn-utilitybar__inner {
        grid-template-columns: 1fr auto 1fr;
        gap: 8px;
    }

    .egn-utilitybar__left {
        display: flex;
        justify-content: flex-start;
    }

    .egn-utilitybar__center {
        justify-content: center;
    }

    .egn-utilitybar__right {
        justify-content: flex-end;
    }

    /* Avoid welcome text overflow on small screens */
    .egn-utilitybar__welcome {
        max-width: 42vw;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    .egn-utilitybar__center .btn {
        padding-left: 10px;
        padding-right: 10px;
    }
}

/* ===== Mega Menu (UX) =====
   FIX (SPR-007): Mega menu dropdown'larin kapali durumda "acik" gorunmesini engelle.
   Bootstrap dropdown yapisi .show class'i ile gorunur olur. Bu nedenle:
   - Varsayilan: display:none
   - Acikken (.show): display:grid / display:block (mobile)
*/

/* --- WHMCS otomatik mega menu (cok kategori/alt link) --- */
header.header .main-navbar-wrapper .dropdown-menu.egn-mega-menu {
    min-width: 860px;
    width: min(1020px, calc(100vw - 56px));
    padding: 14px;
    border-radius: 18px;
    border: 1px solid rgba(0, 0, 0, 0.06);
    box-shadow: 0 22px 55px rgba(0, 0, 0, 0.18);

    /* IMPORTANT: kapali durumda gorunmesin */
    display: none;

    /* Acilinca grid olur */
    grid-template-columns: 1fr 1fr minmax(240px, 300px);
    grid-auto-flow: row;
    gap: 6px 14px;

    /* Cok kategori oldugunda (9-10+) viewport tasmasin */
    max-height: calc(100vh - 150px);
    overflow: auto;
}

header.header .main-navbar-wrapper .dropdown-menu.egn-mega-menu.show {
    display: grid;
}

header.header .main-navbar-wrapper .dropdown-menu.egn-mega-menu > li.dropdown-item {
    padding: 0;
    background: transparent;
}

header.header .main-navbar-wrapper .dropdown-menu.egn-mega-menu > li.dropdown-item.egn-mega-item > a.egn-mega-link {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    border-radius: 14px;
    padding: 10px 12px;
    white-space: normal;
    background: rgba(10, 46, 107, 0.03);
    border: 1px solid rgba(10, 46, 107, 0.08);
    transition: transform 160ms ease, box-shadow 160ms ease, background 160ms ease, border-color 160ms ease;
}

header.header .main-navbar-wrapper .dropdown-menu.egn-mega-menu > li.dropdown-item.egn-mega-item > a.egn-mega-link:hover,
header.header .main-navbar-wrapper .dropdown-menu.egn-mega-menu > li.dropdown-item.egn-mega-item > a.egn-mega-link:focus {
    background: rgba(10, 46, 107, 0.08);
    border-color: rgba(10, 46, 107, 0.16);
    box-shadow: 0 12px 22px rgba(10, 46, 107, 0.12);
    transform: translateY(-1px);
}

header.header .main-navbar-wrapper .dropdown-menu.egn-mega-menu .egn-mega-link__label {
    flex: 1 1 auto;
    min-width: 0;
}

header.header .main-navbar-wrapper .dropdown-menu.egn-mega-menu .egn-mega-link__chevron {
    flex: 0 0 auto;
    opacity: 0.7;
    font-size: 1.15rem;
    line-height: 1;
}

header.header .main-navbar-wrapper .dropdown-menu.egn-mega-menu > .egn-mega-divider {
    grid-column: 1 / -1;
    margin: 4px 0;
}

header.header .main-navbar-wrapper .dropdown-menu.egn-mega-menu > li.egn-mega-feature {
    grid-column: 3;
    grid-row: 1 / -1;
    padding: 0;
}

header.header .main-navbar-wrapper .dropdown-menu.egn-mega-menu > li.egn-mega-feature .egn-mega-feature__card {
    height: 100%;
    border-radius: 16px;
    overflow: hidden;
    position: relative;
    background:
        linear-gradient(180deg, rgba(0, 0, 0, 0.78) 0%, rgba(10, 46, 107, 0.78) 55%, rgba(0, 200, 83, 0.70) 100%),
        url("../img/stock/pixabay-web-domain.webp") center / cover no-repeat;
    color: var(--egn-white);
    border: 1px solid rgba(255, 255, 255, 0.12);
    box-shadow: 0 18px 38px rgba(0, 0, 0, 0.24);
}

header.header .main-navbar-wrapper .dropdown-menu.egn-mega-menu > li.egn-mega-feature .egn-mega-feature__media {
    display: none;
}

header.header .main-navbar-wrapper .dropdown-menu.egn-mega-menu > li.egn-mega-feature .egn-mega-feature__body {
    padding: 14px 14px 12px 14px;
}

header.header .main-navbar-wrapper .dropdown-menu.egn-mega-menu .egn-mega-feature__eyebrow {
    display: inline-block;
    font-size: 0.78rem;
    opacity: 0.92;
    letter-spacing: 0.02em;
    background: rgba(255, 255, 255, 0.12);
    border: 1px solid rgba(255, 255, 255, 0.18);
    padding: 0.25rem 0.55rem;
    border-radius: 999px;
    margin-bottom: 0.55rem;
    font-weight: 500;
}

header.header .main-navbar-wrapper .dropdown-menu.egn-mega-menu .egn-mega-feature__title {
    font-size: 1.15rem;
    line-height: 1.25;
    margin: 0 0 0.45rem 0;
    font-weight: 500;
}

header.header .main-navbar-wrapper .dropdown-menu.egn-mega-menu .egn-mega-feature__text {
    font-size: 0.9rem;
    line-height: 1.45;
    margin: 0 0 0.65rem 0;
    opacity: 0.92;
}

header.header .main-navbar-wrapper .dropdown-menu.egn-mega-menu .egn-mega-feature__bullets {
    list-style: none;
    padding: 0;
    margin: 0 0 0.8rem 0;
}

header.header .main-navbar-wrapper .dropdown-menu.egn-mega-menu .egn-mega-feature__bullets li {
    padding-left: 1.1rem;
    position: relative;
    margin: 0.35rem 0;
    font-size: 0.9rem;
    opacity: 0.95;
}

header.header .main-navbar-wrapper .dropdown-menu.egn-mega-menu .egn-mega-feature__bullets li:before {
    content: "✓";
    position: absolute;
    left: 0;
    top: 0;
    opacity: 0.9;
}

header.header .main-navbar-wrapper .dropdown-menu.egn-mega-menu .egn-mega-feature__cta {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    margin-top: 0.2rem;
}


/* --- SiberMimar kurumsal mega menu (Kurumsal/Yazilar/Hizmetler/Tasarim) --- */
header.header .main-navbar-wrapper .dropdown-menu.siber-mega-menu {
    /* Default background image; menu bazinda override edilir */
    --siber-mega-img: url("../img/stock/pixabay-web-domain.webp");

    min-width: 940px;
    width: min(1140px, calc(100vw - 56px));
    padding: 14px;
    border-radius: 18px;
    border: 1px solid rgba(0, 0, 0, 0.06);
    box-shadow: 0 22px 55px rgba(0, 0, 0, 0.18);
    list-style: none;

    display: none;
    grid-template-columns: minmax(260px, 340px) 1fr 1fr;
    gap: 14px;

    max-height: calc(100vh - 150px);
    overflow: auto;
}

header.header .main-navbar-wrapper .dropdown-menu.siber-mega-menu.show {
    display: grid;
}

header.header .main-navbar-wrapper .dropdown-menu.siber-mega-menu > li {
    padding: 0;
    background: transparent;
}

header.header .main-navbar-wrapper .dropdown-menu.siber-mega-menu .siber-mega-feature__card {
    display: block;
    height: 100%;
    border-radius: 16px;
    overflow: hidden;
    position: relative;
    text-decoration: none;
    background:
        linear-gradient(180deg, rgba(0, 0, 0, 0.78) 0%, rgba(10, 46, 107, 0.78) 55%, rgba(0, 200, 83, 0.70) 100%),
        var(--siber-mega-img) center / cover no-repeat;
    color: var(--egn-white);
    border: 1px solid rgba(255, 255, 255, 0.12);
    box-shadow: 0 18px 38px rgba(0, 0, 0, 0.24);
}

header.header .main-navbar-wrapper .dropdown-menu.siber-mega-menu .siber-mega-feature__body {
    padding: 14px;
}

header.header .main-navbar-wrapper .dropdown-menu.siber-mega-menu .siber-mega-feature__eyebrow {
    display: inline-block;
    font-size: 0.78rem;
    opacity: 0.92;
    letter-spacing: 0.02em;
    background: rgba(255, 255, 255, 0.12);
    border: 1px solid rgba(255, 255, 255, 0.18);
    padding: 0.25rem 0.55rem;
    border-radius: 999px;
    margin-bottom: 0.55rem;
    font-weight: 500;
}

header.header .main-navbar-wrapper .dropdown-menu.siber-mega-menu .siber-mega-feature__title {
    font-size: 1.18rem;
    line-height: 1.25;
    margin: 0 0 0.45rem 0;
    font-weight: 500;
}

header.header .main-navbar-wrapper .dropdown-menu.siber-mega-menu .siber-mega-feature__text {
    font-size: 0.92rem;
    line-height: 1.5;
    margin: 0 0 0.75rem 0;
    opacity: 0.92;
}

header.header .main-navbar-wrapper .dropdown-menu.siber-mega-menu .siber-mega-feature__cta {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    margin-top: 0.2rem;
}

header.header .main-navbar-wrapper .dropdown-menu.siber-mega-menu .siber-mega-group {
    border-radius: 16px;
    background: rgba(255, 255, 255, 0.88);
    border: 1px solid rgba(10, 46, 107, 0.12);
    box-shadow: 0 16px 34px rgba(10, 46, 107, 0.10);
    padding: 12px;
}

header.header .main-navbar-wrapper .dropdown-menu.siber-mega-menu .siber-mega-group.siber-mega-group--span2 {
    grid-column: span 2;
}

header.header .main-navbar-wrapper .dropdown-menu.siber-mega-menu .siber-mega-group__title {
    font-size: 0.95rem;
    font-weight: 500;
    color: var(--egn-parliament);
    margin: 0 0 10px 0;
    padding-bottom: 8px;
    border-bottom: 1px solid rgba(10, 46, 107, 0.18);
}

header.header .main-navbar-wrapper .dropdown-menu.siber-mega-menu .siber-mega-group__list {
    list-style: none;
    padding: 0;
    margin: 0;
    display: grid;
    gap: 8px;
}

header.header .main-navbar-wrapper .dropdown-menu.siber-mega-menu .siber-mega-link {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    border-radius: 14px;
    padding: 10px 12px;
    white-space: normal;
    background: rgba(10, 46, 107, 0.03);
    border: 1px solid rgba(10, 46, 107, 0.10);
    transition: transform 160ms ease, box-shadow 160ms ease, background 160ms ease, border-color 160ms ease;
    text-decoration: none;
    color: rgba(0, 0, 0, 0.82);
}

header.header .main-navbar-wrapper .dropdown-menu.siber-mega-menu .siber-mega-link:hover,
header.header .main-navbar-wrapper .dropdown-menu.siber-mega-menu .siber-mega-link:focus {
    background: rgba(10, 46, 107, 0.08);
    border-color: rgba(10, 46, 107, 0.18);
    box-shadow: 0 12px 22px rgba(10, 46, 107, 0.12);
    transform: translateY(-1px);
    color: var(--egn-navy);
}

header.header .main-navbar-wrapper .dropdown-menu.siber-mega-menu .siber-mega-link__chevron {
    opacity: 0.75;
    font-size: 1.15rem;
    line-height: 1;
}

/* Per-menu background images (mevcut pixabay WEBP'ler) */
header.header .main-navbar-wrapper .dropdown-menu.siber-mega-menu--kurumsal {
    --siber-mega-img: url("../img/stock/pixabay-web-domain.webp");
}

header.header .main-navbar-wrapper .dropdown-menu.siber-mega-menu--yazilar {
    --siber-mega-img: url("../img/stock/pixabay-servers-rack.webp");
}

header.header .main-navbar-wrapper .dropdown-menu.siber-mega-menu--hizmetler {
    --siber-mega-img: url("../img/stock/pixabay-server-room.webp");
}

header.header .main-navbar-wrapper .dropdown-menu.siber-mega-menu--tasarim {
    --siber-mega-img: url("../img/stock/pixabay-web-domain.webp");
}

@media (max-width: 1199.98px) {
    header.header .main-navbar-wrapper .dropdown-menu.egn-mega-menu,
    header.header .main-navbar-wrapper .dropdown-menu.siber-mega-menu {
        min-width: 100%;
        width: 100%;
        max-height: none;
        overflow: visible;
    }

    header.header .main-navbar-wrapper .dropdown-menu.egn-mega-menu.show,
    header.header .main-navbar-wrapper .dropdown-menu.siber-mega-menu.show {
        display: block;
    }

    header.header .main-navbar-wrapper .dropdown-menu.egn-mega-menu > li.egn-mega-feature,
    header.header .main-navbar-wrapper .dropdown-menu.siber-mega-menu > li.siber-mega-feature {
        display: none;
    }

    header.header .main-navbar-wrapper .dropdown-menu.siber-mega-menu .siber-mega-group {
        margin-bottom: 10px;
    }
}


/* =========================================================================
   EGN Landing (Homepage + Domain Hero) - Premium Sections
   ========================================================================= */

/* Domain search hero: background image (Pixabay) + navy/black overlay */
.home-domain-search.egn-domain-hero {
    background:
        linear-gradient(90deg,
            rgba(0, 0, 0, 0.86) 0%,
            rgba(10, 46, 107, 0.78) 45%,
            rgba(0, 200, 83, 0.74) 100%),
        url("../img/stock/pixabay-server-room.webp") center / cover no-repeat;
    color: var(--egn-white);
}

.home-domain-search.egn-domain-hero h2 {
    color: var(--egn-white);
}

.egn-domain-hero__grid {
    display: grid;
    grid-template-columns: 1.05fr 0.95fr;
    gap: 2.25rem;
    align-items: center;
    padding: 2.75rem 0;
}

.egn-domain-hero__title {
    margin: 0 0 0.75rem 0;
    font-size: 2.1rem;
    line-height: 1.2;
}

.egn-domain-hero__subtitle {
    margin: 0;
    max-width: 70ch;
    opacity: 0.92;
    line-height: 1.65;
}

.egn-domain-hero__trust {
    margin-top: 1.25rem;
    display: flex;
    flex-wrap: wrap;
    gap: 0.6rem;
}

.egn-trust-badge {
    display: inline-flex;
    align-items: center;
    gap: 0.55rem;
    padding: 0.45rem 0.75rem;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.08);
    border: 1px solid rgba(255, 255, 255, 0.18);
    color: rgba(255, 255, 255, 0.92);
    font-size: 0.95rem;
    white-space: nowrap;
}

.egn-trust-badge i {
    opacity: 0.95;
}

.egn-home-cta--hero .btn-light {
    color: var(--egn-black);
}

.egn-domain-panel {
    background: #ffffff;
    border: 1px solid rgba(255, 255, 255, 0.22);
    border-radius: 18px;
    padding: 1.25rem;
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.28);
    color: var(--egn-black);
}

.egn-domain-panel__head {
    margin-bottom: 0.9rem;
}

/* Domain tabs (Search/Transfer) */
.egn-domain-tabs {
    display: flex;
    gap: 0.5rem;
    padding: 0.35rem;
    border-radius: 14px;
    background: rgba(0, 0, 0, 0.04);
    border: 1px solid rgba(0, 0, 0, 0.06);
    margin-bottom: 0.75rem;
}

.egn-domain-tab {
    flex: 1;
    border: 0;
    background: transparent;
    border-radius: 12px;
    padding: 0.55rem 0.75rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.45rem;
    font-weight: var(--egn-font-weight-emphasis);
    color: rgba(0, 0, 0, 0.72);
    transition: background 160ms ease, color 160ms ease, box-shadow 160ms ease, transform 160ms ease;
}

.egn-domain-tab:hover {
    background: rgba(10, 46, 107, 0.08);
    color: var(--egn-navy);
    transform: translateY(-1px);
}

.egn-domain-tab.is-active {
    background: var(--egn-gold);
    color: var(--egn-black);
    box-shadow:
        0 12px 30px rgba(212, 175, 55, 0.22),
        0 0 0 1px rgba(10, 46, 107, 0.18);
}

.egn-domain-help {
    font-size: 0.95rem;
    line-height: 1.55;
    color: rgba(0, 0, 0, 0.72);
    margin-bottom: 0.85rem;
}

.egn-domain-note {
    margin-top: 0.85rem;
    border-radius: 14px;
    padding: 0.65rem 0.75rem;
    border: 1px dashed rgba(10, 46, 107, 0.28);
    background: rgba(10, 46, 107, 0.06);
    color: rgba(0, 0, 0, 0.72);
    font-size: 0.92rem;
    line-height: 1.45;
    display: flex;
    gap: 0.5rem;
    align-items: flex-start;
}

.egn-domain-note i {
    margin-top: 0.15rem;
    color: rgba(10, 46, 107, 0.85);
}

.egn-panel-kicker {
    font-size: 0.8rem;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: rgba(0, 0, 0, 0.56);
    margin-bottom: 0.2rem;
}

.egn-panel-title {
    font-size: 1.1rem;
    font-weight: var(--egn-font-weight-emphasis);
    letter-spacing: -0.01em;
}

.egn-domain-input .form-control {
    border-radius: 14px 0 0 14px;
    border: 1px solid rgba(0, 0, 0, 0.14);
}

.egn-domain-input .form-control:focus {
    border-color: rgba(10, 46, 107, 0.35);
    box-shadow: 0 0 0 0.18rem rgba(10, 46, 107, 0.14);
}

.egn-domain-input .input-group-append .btn {
    border-radius: 0;
}

.egn-domain-input .egn-domain-action-btn {
    min-width: 110px;
    font-weight: var(--egn-font-weight-emphasis);
}

.egn-domain-input .input-group-append .btn:last-child {
    border-top-right-radius: 14px;
    border-bottom-right-radius: 14px;
}

.egn-domain-chips {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
    margin-top: 0.9rem;
}

.egn-chip {
    background: var(--egn-white);
    border: 1px solid rgba(0, 0, 0, 0.12);
    color: var(--egn-black);
    border-radius: 999px;
    padding: 0.35rem 0.7rem;
    font-size: 0.92rem;
    line-height: 1;
    transition: transform 160ms ease, border-color 160ms ease, box-shadow 160ms ease;
}

.egn-chip:hover,
.egn-chip:focus {
    border-color: rgba(10, 46, 107, 0.35);
    box-shadow: 0 10px 25px rgba(10, 46, 107, 0.12);
    transform: translateY(-1px);
}

.egn-featured-tlds.tld-logos {
    margin-top: 1.1rem;
}

.egn-featured-tlds.tld-logos li {
    width: auto;
    padding: 6px 10px;
    border-radius: 12px;
    border: 1px solid rgba(0, 0, 0, 0.10);
    background: rgba(255, 255, 255, 0.92);
    display: inline-flex;
    align-items: center;
    gap: 8px;
}

.egn-featured-tlds .egn-tld-price {
    font-size: 0.92rem;
    color: rgba(0, 0, 0, 0.72);
}

.egn-domain-panel__links {
    display: flex;
    justify-content: flex-end;
    margin-top: 0.65rem;
}

.egn-domain-panel__links .btn-link {
    color: var(--egn-navy);
}

.egn-domain-panel__links .btn-link:hover,
.egn-domain-panel__links .btn-link:focus {
    color: var(--egn-navy-hover);
    text-decoration: underline;
}

@media (max-width: 991.98px) {
    .egn-domain-hero__grid {
        grid-template-columns: 1fr;
        padding: 2.2rem 0;
    }

    .egn-domain-hero__title {
        font-size: 1.8rem;
    }
}

/* Homepage sections */
.egn-section {
    margin: 3.25rem 0;
}

.egn-kicker {
    display: inline-flex;
    align-items: center;
    gap: 0.55rem;
    font-size: 0.82rem;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: rgba(0, 0, 0, 0.56);
}

.egn-kicker--dark {
    color: rgba(0, 0, 0, 0.6);
}

.egn-home-h1 {
    margin-top: 0.5rem;
    margin-bottom: 0.85rem;
    font-size: 2.2rem;
    line-height: 1.18;
}

.egn-lead {
    margin: 0 0 1.25rem 0;
    max-width: 70ch;
    font-size: 1.07rem;
    line-height: 1.7;
    color: rgba(0, 0, 0, 0.78);
}

.egn-cta-row {
    display: flex;
    flex-wrap: wrap;
    gap: 0.65rem;
    align-items: center;
}

.egn-split {
    display: grid;
    grid-template-columns: 1.05fr 0.95fr;
    gap: 2.2rem;
    align-items: center;
}

.egn-media-card {
    border-radius: 18px;
    border: 1px solid rgba(0, 0, 0, 0.10);
    background: var(--egn-white);
    padding: 1rem;
    box-shadow: 0 18px 60px rgba(10, 46, 107, 0.10);
}

.egn-media-card img {
    width: 100%;
    height: auto;
    display: block;
    border-radius: 14px;
}

.egn-media-card--soft {
    background: var(--egn-navy-soft);
    border-color: rgba(10, 46, 107, 0.12);
}

@media (max-width: 991.98px) {
    .egn-split {
        grid-template-columns: 1fr;
    }

    .egn-home-h1 {
        font-size: 1.95rem;
    }

    .egn-section {
        margin: 2.6rem 0;
    }
}

/* Homepage: Stats */
.egn-home-stats {
    margin-top: 1.35rem;
    display: flex;
    flex-wrap: wrap;
    gap: 0.9rem;
}

.egn-stat {
    border: 1px solid rgba(0, 0, 0, 0.10);
    border-radius: 16px;
    padding: 0.9rem 1rem;
    min-width: 160px;
    background: var(--egn-white);
}

.egn-stat__value {
    color: var(--egn-navy);
    font-size: 1.4rem;
    letter-spacing: -0.02em;
}

.egn-stat__label {
    color: rgba(0, 0, 0, 0.65);
    font-size: 0.95rem;
    margin-top: 0.2rem;
}

/* Homepage: Section headings */
.egn-section-head .egn-section-title {
    margin-bottom: 0.6rem;
}

.egn-section-title {
    font-size: 1.6rem;
}

.egn-section-subtitle {
    color: rgba(0, 0, 0, 0.72);
    max-width: 80ch;
    margin: 0 auto 1.1rem auto;
    line-height: 1.65;
}

/* Homepage: Plan cards */
.egn-plan-grid {
    margin-top: 1.5rem;
}

.egn-plan-card {
    height: 100%;
    background: var(--egn-white);
    border: 1px solid rgba(0, 0, 0, 0.10);
    border-radius: 18px;
    padding: 1.6rem 1.5rem;
    box-shadow: 0 16px 50px rgba(0, 0, 0, 0.08);
    display: flex;
    flex-direction: column;
    transition: transform 160ms ease, box-shadow 160ms ease, border-color 160ms ease;
}

.egn-plan-card:hover {
    transform: translateY(-2px);
    border-color: var(--egn-link-border);
    box-shadow: 0 22px 70px rgba(29, 124, 242, 0.14);
}

.egn-plan-card.is-featured {
    border-color: rgba(10, 46, 107, 0.45);
    box-shadow: 0 26px 80px rgba(10, 46, 107, 0.18);
}

.egn-plan-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: fit-content;
    padding: 0.35rem 0.8rem;
    border-radius: 999px;
    background: var(--egn-navy-soft);
    border: 1px solid rgba(10, 46, 107, 0.18);
    color: var(--egn-navy);
    font-size: 0.85rem;
    margin-bottom: 0.85rem;
}

.egn-plan-title {
    margin: 0;
    font-size: 1.35rem;
}

.egn-plan-tagline {
    margin: 0.55rem 0 1rem 0;
    color: rgba(0, 0, 0, 0.70);
    line-height: 1.6;
}

.egn-plan-features {
    list-style: none;
    padding: 0;
    margin: 0 0 1.25rem 0;
    flex: 1 1 auto;
}

.egn-plan-features li {
    display: flex;
    gap: 0.65rem;
    padding: 0.35rem 0;
    color: rgba(0, 0, 0, 0.80);
}

.egn-plan-features i {
    color: var(--egn-navy);
    margin-top: 0.25rem;
}

/* Homepage: Checklist */
.egn-checklist {
    list-style: none;
    padding: 0;
    margin: 1rem 0 1.25rem 0;
}

.egn-checklist li {
    display: flex;
    gap: 0.65rem;
    padding: 0.35rem 0;
    color: rgba(0, 0, 0, 0.78);
}

.egn-checklist i {
    color: var(--egn-navy);
    margin-top: 0.25rem;
}

/* Homepage: Trust surface + quotes */
.egn-trust-surface {
    border-radius: 20px;
    border: 1px solid rgba(0, 0, 0, 0.10);
    background: #f6f8fb;
    padding: 1.6rem 1.5rem;
}

.egn-quote-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1rem;
}

.egn-quote {
    border-radius: 18px;
    border: 1px solid rgba(0, 0, 0, 0.08);
    background: var(--egn-white);
    padding: 1.2rem 1.1rem;
    box-shadow: 0 16px 50px rgba(0, 0, 0, 0.08);
}

.egn-quote__text {
    color: rgba(0, 0, 0, 0.82);
    line-height: 1.65;
}

.egn-quote__meta {
    margin-top: 0.75rem;
    color: rgba(0, 0, 0, 0.56);
    font-size: 0.95rem;
}

@media (max-width: 767.98px) {
    .egn-quote-grid {
        grid-template-columns: 1fr;
    }
}

/* Reduced motion: extend to new blocks */
@media (prefers-reduced-motion: reduce) {
    .egn-plan-card,
    .egn-chip {
        transition: none;
    }

    .egn-plan-card:hover,
    .egn-chip:hover {
        transform: none;
    }
}

/* =========================================================================
   Auth Pages (Login / Register) - Premium UX
   ========================================================================= */

.egn-auth-shell {
    margin: 1.25rem 0 2.25rem;
    padding: 1.25rem;
    border-radius: 20px;
    background: #f6f8fb;
    border: 1px solid rgba(0, 0, 0, 0.10);
}

.egn-auth-grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 0.95fr);
    gap: 1.25rem;
    align-items: stretch;
}

.egn-auth-panel {
    min-width: 0;
}

.egn-auth-card {
    background: var(--egn-white);
    border: 1px solid rgba(0, 0, 0, 0.10);
    border-radius: 20px;
    padding: 1.6rem 1.4rem;
    box-shadow: 0 20px 60px rgba(10, 46, 107, 0.10);
}

.egn-auth-card__head {
    margin-bottom: 1rem;
}

.egn-auth-kicker {
    display: inline-flex;
    align-items: center;
    gap: 0.55rem;
    font-size: 0.82rem;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: rgba(0, 0, 0, 0.58);
}

.egn-auth-title {
    margin: 0.55rem 0 0.45rem;
    font-size: 1.8rem;
    line-height: 1.2;
    font-weight: 500;
}

.egn-auth-subtitle {
    margin: 0;
    color: rgba(0, 0, 0, 0.72);
    line-height: 1.6;
    max-width: 70ch;
}

.egn-auth-form .form-control {
    border-radius: 14px;
}

.egn-auth-form .input-group.egn-input {
    border-radius: 14px;
    overflow: hidden;
    border: 1px solid rgba(0, 0, 0, 0.12);
}

.egn-auth-form .input-group.egn-input .input-group-text {
    background: #eef2f6;
    border: 0;
    color: rgba(0, 0, 0, 0.65);
}

.egn-auth-form .input-group.egn-input .form-control {
    border: 0;
}

.egn-auth-row {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin: 0.65rem 0 0.25rem;
}

.egn-auth-actions {
    margin-top: 0.9rem;
}

.egn-auth-link {
    color: var(--egn-navy);
    text-decoration: none;
    font-weight: 500;
}

.egn-auth-link:hover,
.egn-auth-link:focus {
    color: var(--egn-navy-hover);
    text-decoration: underline;
    text-underline-offset: 2px;
}

.egn-auth-link--strong {
    font-weight: 500;
}

.egn-auth-card__foot {
    margin-top: 1.1rem;
    padding-top: 1rem;
    border-top: 1px solid rgba(0, 0, 0, 0.08);
}

.egn-auth-footline {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
    align-items: center;
    justify-content: center;
}

.egn-auth-heading {
    margin-bottom: 1.25rem;
    padding: 1.25rem 1.1rem;
    border-radius: 20px;
    background: var(--egn-white);
    border: 1px solid rgba(0, 0, 0, 0.10);
    box-shadow: 0 18px 50px rgba(10, 46, 107, 0.08);
}

.egn-auth-heading__links {
    margin-top: 0.65rem;
    display: flex;
    gap: 0.55rem;
    flex-wrap: wrap;
    align-items: center;
}

.egn-register .card {
    border-radius: 18px;
}

.egn-register .card-title {
    font-weight: 500;
}

.egn-auth-aside {
    border-radius: 20px;
    overflow: hidden;
    position: relative;
    border: 1px solid rgba(0, 0, 0, 0.12);
    background:
        linear-gradient(180deg, #071a31 0%, #0a2e6b 55%, var(--egn-orange-1) 100%);
    color: var(--egn-white);
}

.egn-auth-aside__inner {
    padding: 1.6rem 1.4rem;
    display: flex;
    flex-direction: column;
    height: 100%;
}

.egn-auth-aside__kicker {
    font-size: 0.82rem;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    opacity: 0.92;
}

.egn-auth-aside__title {
    margin: 0.55rem 0 0.65rem;
    font-size: 1.45rem;
    font-weight: 500;
}

.egn-auth-aside__text {
    margin: 0 0 1rem;
    opacity: 0.93;
    line-height: 1.65;
}

.egn-auth-aside__bullets {
    list-style: none;
    padding: 0;
    margin: 0 0 1.2rem;
    display: flex;
    flex-direction: column;
    gap: 0.55rem;
}

.egn-auth-aside__bullets li {
    display: flex;
    gap: 0.65rem;
    align-items: flex-start;
    font-size: 0.98rem;
    opacity: 0.95;
}

.egn-auth-aside__bullets i {
    margin-top: 0.25rem;
}

.egn-auth-aside__cta {
    margin-top: auto;
    display: grid;
    gap: 0.6rem;
}

.egn-auth-aside__note {
    margin-top: 1rem;
    padding: 0.75rem 0.85rem;
    border-radius: 16px;
    background: #0b2f5f;
    border: 1px solid rgba(255, 255, 255, 0.18);
    display: flex;
    gap: 0.55rem;
    align-items: flex-start;
    opacity: 0.95;
}

@media (max-width: 991.98px) {
    .egn-auth-grid {
        grid-template-columns: 1fr;
    }
    .egn-auth-shell {
        padding: 0.85rem;
    }
}


/* =========================================================================
   Dashboard (Client Area Home) - Premium UX
   ========================================================================= */

.egn-dashboard-hero {
    position: relative;
    overflow: hidden;
    border-radius: 20px;
    padding: 1.75rem 1.5rem;
    margin: 0.25rem 0 1.25rem;
    background:
        linear-gradient(90deg, rgba(0, 0, 0, 0.86) 0%, rgba(10, 46, 107, 0.86) 58%, rgba(10, 46, 107, 0.78) 100%),
        var(--egn-dash-img) center / cover no-repeat;
    color: var(--egn-white);
    border: 1px solid rgba(0, 0, 0, 0.08);
    box-shadow: 0 24px 70px rgba(0, 0, 0, 0.18);
}

.egn-dashboard-hero__inner {
    display: grid;
    grid-template-columns: 1.05fr 0.95fr;
    gap: 1.5rem;
    align-items: center;
}

.egn-dashboard-kicker {
    display: inline-flex;
    align-items: center;
    gap: 0.55rem;
    font-size: 0.82rem;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    opacity: 0.92;
}

.egn-dashboard-title {
    margin: 0.6rem 0 0.55rem;
    font-size: 2rem;
    line-height: 1.18;
    font-weight: 500;
}

.egn-dashboard-subtitle {
    margin: 0;
    max-width: 76ch;
    opacity: 0.92;
    line-height: 1.65;
}

.egn-dashboard-trust {
    margin-top: 1.1rem;
    display: flex;
    flex-wrap: wrap;
    gap: 0.6rem;
}

.egn-dashboard-hero__media {
    min-height: 220px;
    border-radius: 18px;
    background: rgba(255, 255, 255, 0.08);
    border: 1px solid rgba(255, 255, 255, 0.14);
}

.egn-dashboard-stats {
    margin-bottom: 1.25rem;
}

.egn-stat-card {
    height: 100%;
    display: flex;
    flex-direction: column;
    gap: 0.55rem;
    padding: 1.1rem 1.05rem;
    border-radius: 18px;
    border: 1px solid rgba(0, 0, 0, 0.10);
    background: var(--egn-white);
    text-decoration: none;
    color: var(--egn-black);
    box-shadow: 0 16px 50px rgba(0, 0, 0, 0.08);
    transition: transform 160ms ease, box-shadow 160ms ease, border-color 160ms ease;
}

.egn-stat-card:hover,
.egn-stat-card:focus {
    transform: translateY(-2px);
    border-color: rgba(0, 0, 0, 0.18);
    box-shadow: 0 22px 70px rgba(0, 0, 0, 0.14);
    text-decoration: none;
}

.egn-stat-card__icon {
    width: 42px;
    height: 42px;
    border-radius: 14px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: var(--egn-link-soft);
    color: var(--egn-link);
}

.egn-stat-card__value {
    font-size: 1.65rem;
    letter-spacing: -0.02em;
    color: var(--egn-link);
}

.egn-stat-card__label {
    color: rgba(0, 0, 0, 0.68);
    font-size: 0.98rem;
}

@media (max-width: 991.98px) {
    .egn-dashboard-hero__inner {
        grid-template-columns: 1fr;
    }

    .egn-dashboard-title {
        font-size: 1.75rem;
    }

    .egn-dashboard-hero__media {
        display: none;
    }
}

/* Client panels: keep WHMCS data but unify colors */
.egn-client-panels .badge {
    background: var(--egn-link);
    color: var(--egn-white);
}

.egn-client-panels .list-group-item.active {
    background: var(--egn-link);
    border-color: var(--egn-link);
}

.egn-client-panels .card[class*="card-accent-"] {
    border-top: 4px solid var(--egn-link);
}

/* Map legacy accent helpers to EGN palette (reduces extra colors) */
.bg-color-blue,
.bg-color-green,
.bg-color-red,
.bg-color-gold {
    background-color: var(--egn-link) !important;
}


/* =========================================================================
   SPR-153: Dashboard IA redesign - Phase 1
   - Primary action card + wizard
   - Modern quick start cards + advanced panels collapse
   ========================================================================= */

.egn-priority-card {
    margin-top: 1.05rem;
    display: flex;
    align-items: flex-start;
    gap: 0.85rem;
    padding: 0.95rem 1rem;
    border-radius: 18px;
    background: rgba(255, 255, 255, 0.10);
    border: 1px solid rgba(255, 255, 255, 0.16);
    color: rgba(255, 255, 255, 0.92);
    text-decoration: none;
    box-shadow: 0 18px 55px rgba(0, 0, 0, 0.18);
    transition: transform 160ms ease, background 160ms ease, border-color 160ms ease;
}

/* =========================================================================
   SPR-164: Profil tamamlama (sonradan doldur) CTA
   ========================================================================= */

.egn-mini-pill {
    display: inline-flex;
    align-items: center;
    padding: 0.22rem 0.55rem;
    border-radius: 999px;
    font-size: 0.78rem;
    line-height: 1.2;
    letter-spacing: 0.01em;
    white-space: nowrap;
    border: 1px solid rgba(255, 255, 255, 0.18);
    background: rgba(255, 255, 255, 0.12);
    color: rgba(255, 255, 255, 0.92);
}

.egn-mini-pill--solid {
    border-color: var(--egn-link-border);
    background: var(--egn-link-soft);
    color: var(--egn-link);
}

.egn-profile-cta {
    margin-top: 0.95rem;
    padding: 0.75rem 0.85rem;
    border-radius: 18px;
    background: rgba(255, 255, 255, 0.08);
    border: 1px solid rgba(255, 255, 255, 0.16);
    display: flex;
    gap: 0.9rem;
    align-items: center;
    justify-content: space-between;
}

.egn-profile-cta__title {
    font-weight: 600;
    font-size: 0.98rem;
    margin-bottom: 0.15rem;
}

.egn-profile-cta__desc {
    opacity: 0.92;
    display: flex;
    flex-wrap: wrap;
    gap: 0.35rem;
    align-items: center;
}

.egn-profile-cta__btn {
    border-radius: 999px;
    border-color: rgba(255, 255, 255, 0.28);
}

.egn-profile-cta__btn:hover,
.egn-profile-cta__btn:focus {
    background: rgba(255, 255, 255, 0.14);
    border-color: rgba(255, 255, 255, 0.35);
}

@media (max-width: 991.98px) {
    .egn-profile-cta {
        flex-direction: column;
        align-items: flex-start;
    }
}

.egn-profile-wizard {
    border-radius: 18px;
    border: 1px solid rgba(0, 0, 0, 0.10);
    box-shadow: 0 14px 44px rgba(0, 0, 0, 0.08);
}

.egn-profile-wizard__row {
    display: flex;
    gap: 1rem;
    align-items: center;
    justify-content: space-between;
}

.egn-profile-wizard__title {
    font-size: 1.05rem;
    font-weight: 600;
    margin-bottom: 0.2rem;
}

.egn-profile-wizard__desc {
    color: rgba(0, 0, 0, 0.68);
    margin-bottom: 0.55rem;
}

.egn-profile-wizard__missing {
    display: flex;
    flex-wrap: wrap;
    gap: 0.35rem;
}

.egn-profile-wizard__actions {
    flex: 0 0 auto;
}

@media (max-width: 767.98px) {
    .egn-profile-wizard__row {
        flex-direction: column;
        align-items: flex-start;
    }
}

.egn-priority-card:hover,
.egn-priority-card:focus {
    background: rgba(255, 255, 255, 0.14);
    border-color: rgba(255, 255, 255, 0.22);
    transform: translateY(-1px);
    text-decoration: none;
    color: rgba(255, 255, 255, 0.98);
}

.egn-priority-card__icon {
    width: 44px;
    height: 44px;
    flex: 0 0 44px;
    border-radius: 16px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: rgba(255, 255, 255, 0.14);
}

.egn-priority-card__body {
    display: flex;
    flex-direction: column;
    gap: 0.15rem;
    min-width: 0;
}

.egn-priority-card__title {
    font-weight: 800;
    letter-spacing: -0.01em;
    line-height: 1.2;
}

.egn-priority-card__desc {
    margin: 0;
    font-size: 0.92rem;
    line-height: 1.45;
    opacity: 0.88;
}

.egn-priority-card__cta {
    margin-left: auto;
    display: inline-flex;
    align-items: center;
    gap: 0.45rem;
    white-space: nowrap;
    font-weight: 800;
    opacity: 0.95;
}

@media (max-width: 991.98px) {
    .egn-priority-card {
        flex-direction: column;
    }
    .egn-priority-card__cta {
        margin-left: 0;
    }
}

.egn-dashboard-hero__media {
    min-height: auto;
    background: transparent;
    border: none;
    padding: 0;
    display: flex;
    align-items: flex-end;
    justify-content: flex-end;
}

.egn-hero-wizard {
    width: 100%;
    max-width: 430px;
    margin-left: auto;
    padding: 1.05rem 1rem;
    border-radius: 18px;
    background: rgba(255, 255, 255, 0.10);
    border: 1px solid rgba(255, 255, 255, 0.16);
    box-shadow: 0 18px 55px rgba(0, 0, 0, 0.22);
    display: grid;
    gap: 0.65rem;
}

.egn-hero-wizard__title {
    font-size: 0.82rem;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    opacity: 0.9;
}

.egn-hero-wizard__item {
    display: flex;
    align-items: flex-start;
    gap: 0.75rem;
    padding: 0.7rem 0.75rem;
    border-radius: 16px;
    border: 1px solid rgba(255, 255, 255, 0.12);
    background: rgba(0, 0, 0, 0.12);
    color: rgba(255, 255, 255, 0.92);
    text-decoration: none;
    transition: transform 160ms ease, background 160ms ease, border-color 160ms ease;
}

.egn-hero-wizard__item:hover,
.egn-hero-wizard__item:focus {
    background: rgba(0, 0, 0, 0.18);
    border-color: rgba(255, 255, 255, 0.22);
    transform: translateY(-1px);
    color: rgba(255, 255, 255, 0.98);
    text-decoration: none;
}

.egn-hero-wizard__icon {
    width: 42px;
    height: 42px;
    flex: 0 0 42px;
    border-radius: 14px;
    background: rgba(255, 255, 255, 0.14);
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.egn-hero-wizard__label {
    display: block;
    font-weight: 800;
    line-height: 1.2;
}

.egn-hero-wizard__hint {
    display: block;
    margin-top: 0.2rem;
    font-size: 0.86rem;
    line-height: 1.25;
    opacity: 0.86;
}

.egn-dash-flow {
    margin: 1.25rem 0 1.1rem;
}

.egn-dash-section-head {
    margin-bottom: 0.75rem;
    display: flex;
    flex-wrap: wrap;
    align-items: flex-end;
    justify-content: space-between;
    gap: 0.4rem 1rem;
}

.egn-dash-section-title {
    margin: 0;
    font-size: 1.05rem;
    font-weight: 900;
    color: rgba(11, 11, 11, 0.92);
    letter-spacing: -0.01em;
}

.egn-dash-section-subtitle {
    color: rgba(0, 0, 0, 0.62);
    font-size: 0.95rem;
}

.egn-flow-card {
    height: 100%;
    display: flex;
    flex-direction: column;
    gap: 0.55rem;
    padding: 1.05rem 1.05rem;
    border-radius: 18px;
    border: 1px solid rgba(0, 0, 0, 0.10);
    background: var(--egn-white);
    text-decoration: none;
    color: var(--egn-black);
    box-shadow: 0 18px 55px rgba(0, 0, 0, 0.08);
    transition: transform 160ms ease, box-shadow 160ms ease, border-color 160ms ease;
}

.egn-flow-card:hover,
.egn-flow-card:focus {
    transform: translateY(-2px);
    border-color: rgba(0, 0, 0, 0.16);
    box-shadow: 0 26px 80px rgba(0, 0, 0, 0.14);
    text-decoration: none;
    color: var(--egn-black);
}

.egn-flow-card__icon {
    width: 44px;
    height: 44px;
    border-radius: 16px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: var(--egn-link-soft);
color: var(--egn-link);
}

.egn-flow-card__title {
    font-weight: 900;
    font-size: 1rem;
    color: rgba(11, 11, 11, 0.92);
}

.egn-flow-card__text {
    color: rgba(0, 0, 0, 0.66);
    line-height: 1.55;
}

.egn-flow-card__meta {
    margin-top: auto;
    display: inline-flex;
    align-items: center;
    gap: 0.45rem;
    font-weight: 900;
    color: var(--egn-link);
}

.egn-dash-advanced {
    margin: 1.25rem 0 0.5rem;
}

.egn-dash-section-head--compact {
    padding: 0.75rem 0.85rem;
    border-radius: 18px;
    background: rgba(255, 255, 255, 0.70);
    border: 1px solid rgba(0, 0, 0, 0.08);
    backdrop-filter: blur(6px);
}

.egn-dash-section-head--compact .btn,
.egn-dash-section-head--compact .egn-advanced-toggle {
    white-space: nowrap;
}


/* Advanced toggle (SPR-166): dashboard "Gelişmiş Bölümler" */
.egn-advanced-toggle {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    padding: 8px 12px;
    border-radius: 999px;

    background: rgba(11, 11, 11, 0.06);
    border: 1px solid rgba(0, 0, 0, 0.12);

    color: rgba(11, 11, 11, 0.92);
    font-weight: 900;
    letter-spacing: 0.2px;

    transition: background 160ms ease, border-color 160ms ease;
}

.egn-advanced-toggle:hover,
.egn-advanced-toggle:focus {
    background: rgba(11, 11, 11, 0.08);
    border-color: rgba(0, 0, 0, 0.16);
    color: rgba(11, 11, 11, 0.92);
    text-decoration: none;
}

.egn-advanced-toggle:focus-visible {
    outline: 2px solid rgba(11, 11, 11, 0.28);
    outline-offset: 3px;
}

.egn-advanced-toggle__chev {
    transition: transform 180ms ease;
}

.egn-advanced-toggle[aria-expanded="true"] .egn-advanced-toggle__chev {
    transform: rotate(180deg);
}

.egn-advanced-collapse {
    margin-top: 12px;
}

.egn-advanced-body {
    padding: 14px;
    border-radius: 18px;
    background: rgba(255, 255, 255, 0.74);
    border: 1px solid rgba(0, 0, 0, 0.08);
    backdrop-filter: blur(6px);
}

/*
  SPR-171:
  Dashboard "Gelişmiş Bölümler" içinde WHMCS'nin varsayılan panel/kartları
  tema ile tam bütünleşmediğinde (özellikle mobilde) uyumsuz/dağınık görünüyordu.
  Burada sadece advanced container içindeki kartları modern yüzeylere uyarlarız.
*/
.egn-advanced-body .card {
    background: rgba(255, 255, 255, 0.92);
    border: 1px solid rgba(0, 0, 0, 0.08);
    border-radius: 18px;
    box-shadow: 0 18px 55px rgba(0, 0, 0, 0.08);
    overflow: hidden;
}

.egn-advanced-body .card-header {
    background: transparent;
    border-bottom: 1px solid rgba(0, 0, 0, 0.06);
    padding: 0.8rem 0.95rem;
}

.egn-advanced-body .card-header,
.egn-advanced-body .card-header h3,
.egn-advanced-body .card-header h4,
.egn-advanced-body .card-header h5 {
    color: rgba(11, 11, 11, 0.90);
    font-weight: 900;
    letter-spacing: -0.01em;
}

.egn-advanced-body .card-body {
    padding: 0.95rem;
    color: rgba(0, 0, 0, 0.68);
}

.egn-advanced-body .card-footer {
    background: transparent;
    border-top: 1px solid rgba(0, 0, 0, 0.06);
}

.egn-advanced-body .card .btn-link {
    color: var(--egn-link);
    font-weight: 900;
    text-decoration: none;
}

.egn-advanced-body .card .btn-link:hover,
.egn-advanced-body .card .btn-link:focus {
    color: var(--egn-link-hover);
    text-decoration: none;
}


@media (prefers-reduced-motion: reduce) {
    .egn-auth-link,
    .egn-domain-tab,
    .egn-stat-card {
        transition: none;
    }

    .egn-stat-card:hover {
        transform: none;
    }
}

/* ===== Utility Bar Contact Pills (SiberMtema) ===== */
.egn-utilitybar__pill {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 4px 10px;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.06);
    border: 1px solid rgba(255, 255, 255, 0.14);
    color: rgba(10, 10, 10, 0.62);
    text-decoration: none;
}

.egn-utilitybar__pill:hover,
.egn-utilitybar__pill:focus {
    background: #0b2f5f;
    border-color: rgba(255, 255, 255, 0.22);
    color: var(--egn-white);
    text-decoration: none;
}

.egn-utilitybar__pill i {
    font-size: 14px;
}

.egn-utilitybar__number {
    letter-spacing: 0;
    text-transform: none;
    font-weight: 500;
}

/* ===== Siber Footer (SiberMtema) ===== */
.footer.siber-footer {
    background: var(--egn-black);
    color: rgba(255, 255, 255, 0.78);
    padding-top: 54px;
    padding-bottom: 34px;
}

.footer.siber-footer a {
    color: rgba(10, 10, 10, 0.62);
    text-decoration: none;
}

.footer.siber-footer a:hover,
.footer.siber-footer a:focus {
    color: var(--egn-white);
    text-decoration: none;
}

.siber-footer__brand {
    font-weight: 500;
    font-size: 18px;
    color: var(--egn-gold);
    margin-bottom: 12px;
}

.siber-footer__title {
    color: var(--egn-gold);
    font-weight: 500;
    font-size: 15px;
    margin-bottom: 12px;
}

.siber-footer__title-sm {
    color: rgba(255, 255, 255, 0.92);
    font-weight: 500;
    font-size: 12px;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    margin-bottom: 10px;
}

.siber-footer__list {
    list-style: none;
    padding-left: 0;
    margin-bottom: 0;
}

.siber-footer__list li {
    margin-bottom: 8px;
    line-height: 1.5;
}

.siber-footer__list i {
    width: 18px;
    text-align: center;
    margin-right: 8px;
    color: rgba(255, 255, 255, 0.65);
}

.siber-footer__dns {
    margin-top: 18px;
    padding: 14px;
    border-radius: 16px;
    background: rgba(255, 255, 255, 0.04);
    border: 1px solid rgba(255, 255, 255, 0.08);
}

.siber-footer__dns-label {
    font-size: 12px;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: rgba(255, 255, 255, 0.72);
    margin-bottom: 6px;
}

.siber-footer__dns-value {
    font-size: 13px;
    color: rgba(255, 255, 255, 0.88);
}

.siber-footer__contracts {
    margin-top: 28px;
    padding-top: 22px;
    border-top: 1px solid rgba(10, 46, 107, 0.45);
}

.siber-footer__hr {
    border-color: rgba(255, 255, 255, 0.12);
    margin: 24px 0 18px;
}

.siber-footer__bottom .btn {
    color: rgba(255, 255, 255, 0.92);
    border: 1px solid rgba(255, 255, 255, 0.18);
    background: transparent;
    border-radius: 999px;
    padding: 0.35rem 0.85rem;
}

.siber-footer__bottom .btn:hover,
.siber-footer__bottom .btn:focus {
    background: rgba(255, 255, 255, 0.06);
    color: var(--egn-white);
}

.siber-footer__contact-link {
    color: rgba(10, 10, 10, 0.62);
    font-size: 13px;
}

.siber-footer__sep {
    color: rgba(255, 255, 255, 0.35);
    margin: 0 8px;
}

/* ===== Siber Home (SPR-001) ===== */
.siber-hero {
    padding: 68px 0 34px;
    background: linear-gradient(180deg, rgba(0, 200, 83, 0.14), rgba(255, 255, 255, 0));
}

.siber-hero__title {
    font-size: 38px;
    line-height: 1.15;
    font-weight: 500;
    letter-spacing: -0.02em;
    margin: 12px 0 14px;
}

@media (max-width: 768px) {
    .siber-hero__title {
        font-size: 32px;
    }
}

.siber-hero__lead {
    font-size: 16px;
    color: rgba(0, 0, 0, 0.68);
    max-width: 520px;
}

.siber-hero__cta {
    display: flex;
    gap: 12px;
    flex-wrap: wrap;
    margin-top: 20px;
}

.siber-hero__cta .btn {
    border-radius: 999px;
    padding: 0.75rem 1.15rem;
    font-weight: 500;
}

.siber-hero__badges {
    margin-top: 14px;
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
}

.siber-domain-panel {
    margin-top: 24px;
}

.siber-section {
    padding: 54px 0;
}

.siber-section--soft {
    /* Popüler Paketler alanında cam/şeffaf yüzey istemiyoruz */
    background: #f6f8fb;
}

.siber-section__title {
    font-size: 26px;
    font-weight: 500;
    margin-bottom: 10px;
}

.siber-section__lead {
    color: rgba(0, 0, 0, 0.66);
    margin-bottom: 0;
}

.siber-feature-card {
    background: var(--egn-white);
    border: 1px solid rgba(0, 0, 0, 0.06);
    border-radius: 18px;
    padding: 18px;
    height: 100%;
    box-shadow: 0 12px 28px rgba(0, 0, 0, 0.06);
}

.siber-feature-card__icon {
    width: 44px;
    height: 44px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 14px;
    background: rgba(10, 46, 107, 0.08);
    color: var(--egn-navy);
    margin-bottom: 12px;
}

.siber-feature-card__title {
    font-weight: 500;
    margin-bottom: 6px;
}

.siber-feature-card__text {
    color: rgba(0, 0, 0, 0.68);
    font-size: 14px;
    margin-bottom: 0;
}

.siber-product-card {
    border-radius: 18px;
    border: 1px solid rgba(0, 0, 0, 0.06);
    box-shadow: 0 18px 40px rgba(0, 0, 0, 0.07);
}

.siber-product-card__name {
    font-weight: 500;
    font-size: 16px;
    margin-bottom: 6px;
}

.siber-product-card__tagline {
    color: rgba(0, 0, 0, 0.62);
    font-size: 14px;
    margin-bottom: 14px;
    min-height: 42px;
}

.siber-product-card__actions {
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
}

/* ===== Homepage Pricing Toggle (SPR-002) ===== */

.siber-cycle-toggle {
    display: inline-flex;
    align-items: center;
    border: 1px solid rgba(0, 0, 0, 0.10);
    border-radius: 999px;
    overflow: hidden;
    background: rgba(255, 255, 255, 0.85);
    box-shadow: 0 12px 24px rgba(0, 0, 0, 0.06);
}

.siber-cycle-toggle__btn {
    appearance: none;
    border: 0;
    background: transparent;
    padding: 8px 14px;
    font-size: 13px;
    font-weight: 500;
    color: rgba(0, 0, 0, 0.72);
    cursor: pointer;
}

.siber-cycle-toggle__btn.is-active {
    background: var(--egn-navy);
    color: var(--egn-white);
}

.siber-pricing {
    margin-top: 6px;
}

.siber-pricing[data-cycle="monthly"] .siber-price--annually {
    display: none;
}

.siber-pricing[data-cycle="annually"] .siber-price--monthly {
    display: none;
}

.siber-pricing-group {
    margin-bottom: 22px;
}

.siber-pricing-group__title {
    font-size: 18px;
    font-weight: 500;
    margin: 0;
}

.siber-pricing-group__lead {
    color: rgba(0, 0, 0, 0.62);
    font-size: 14px;
    margin: 8px 0 0;
}

.siber-plan-card {
    border-radius: 20px;
    border: 1px solid rgba(0, 0, 0, 0.06);
    box-shadow: 0 18px 40px rgba(0, 0, 0, 0.07);
    transition: transform 160ms ease, box-shadow 160ms ease;
}

.siber-plan-card:hover {
    transform: translateY(-2px);
    box-shadow: 0 24px 52px rgba(0, 0, 0, 0.08);
}

.siber-plan-card__top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    margin-bottom: 10px;
}

.siber-plan-card__name {
    font-weight: 500;
    font-size: 16px;
}

.siber-plan-card__badge {
    background: var(--egn-navy);
}

.siber-plan-card__desc {
    color: rgba(0, 0, 0, 0.66);
    font-size: 14px;
    margin-bottom: 14px;
    min-height: 44px;
}

.siber-plan-card__price {
    background: rgba(10, 46, 107, 0.03);
    border: 1px solid rgba(10, 46, 107, 0.10);
    border-radius: 16px;
    padding: 14px;
    margin-bottom: 14px;
}

.siber-price__value {
    font-size: 26px;
    font-weight: 500;
    letter-spacing: -0.02em;
}

.siber-price__unit {
    font-size: 14px;
    color: rgba(0, 0, 0, 0.60);
    margin-left: 6px;
}

.siber-price__meta {
    font-size: 13px;
    color: rgba(0, 0, 0, 0.62);
    margin-top: 6px;
}

.siber-plan-card__actions .btn {
    border-radius: 14px;
}

@media (max-width: 575.98px) {
    .siber-price__value {
        font-size: 22px;
    }
}

.siber-checklist {
    list-style: none;
    padding-left: 0;
    margin: 18px 0 0;
}

.siber-checklist li {
    margin-bottom: 10px;
    display: flex;
    gap: 10px;
    align-items: flex-start;
}

.siber-checklist i {
    color: var(--egn-navy);
    margin-top: 3px;
}

.siber-cta-card {
    background: var(--egn-white);
    border: 1px solid rgba(0, 0, 0, 0.06);
    border-radius: 20px;
    padding: 22px;
    box-shadow: 0 18px 40px rgba(0, 0, 0, 0.08);
}

.siber-cta-card__title {
    font-weight: 500;
    font-size: 18px;
    margin-bottom: 6px;
}

.siber-cta-card__text {
    color: rgba(0, 0, 0, 0.68);
    margin-bottom: 14px;
}

.siber-cta-card__actions {
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
}

/* =========================================================================
   SPR-009 Brand Refresh (FULL ORANGE SHELL)
   - Header / Footer / Body: Bright Orange Gradient
   - No large white surfaces (panel/body/header/footer)
   - Gold accents: White-highlight Gradient Gold (avoid "flat mud" gold)
   - Parliament Blue: line/border accents
   ========================================================================= */

:root {
    /* Surfaces: keep content readable without "white blocks" */
    --egn-surface: rgba(255, 255, 255, 0.08);
    --egn-surface-solid: rgba(255, 255, 255, 0.08);
    --egn-surface-strong: rgba(255, 255, 255, 0.12);

    /* Gold with white highlight (gradient) */
    --egn-gold-1: #fff6da;
    --egn-gold-2: #ffe08a;
    --egn-gold-3: #d4af37;
    --egn-gold-4: #fff1c2;

    --egn-gold-gradient: linear-gradient(135deg,
        var(--egn-gold-1) 0%,
        var(--egn-gold-2) 26%,
        var(--egn-gold-3) 58%,
        var(--egn-gold-4) 100%
    );

    --egn-gold-gradient-hover: linear-gradient(135deg,
        #ffffff 0%,
        #ffd36b 28%,
        #c79c2e 58%,
        #fff6da 100%
    );

    /* Keep base gold variables for compatibility */
    --egn-gold: #f0cf6a;
    --egn-gold-hover: #e4be56;

    /* Stronger parliament line on orange */
    --egn-border: rgba(10, 46, 107, 0.28);

    /* =========================================================================
       SPR-097: Global UI Kit vNext (Store dili + fullwidth okunabilirlik)
       - Token/utility standardı: spacing, radius, shadow, surface, text.
       ========================================================================= */
    --egn-page-max: 1760px;
    --egn-page-pad: clamp(16px, 2vw, 32px);
    --egn-page-pad-sm: 16px;

    --egn-radius-sm: 12px;
    --egn-radius-md: 16px;
    --egn-radius-lg: 20px;
    --egn-radius-xl: 24px;
    --egn-radius-pill: 999px;

    --egn-shadow-sm: 0 10px 28px rgba(0, 0, 0, 0.10);
    --egn-shadow-md: 0 18px 44px rgba(0, 0, 0, 0.14);
    --egn-shadow-lg: 0 26px 70px rgba(0, 0, 0, 0.18);

    --egn-surface-glass: linear-gradient(180deg, rgba(255, 255, 255, 0.22), rgba(255, 255, 255, 0.10));
    --egn-surface-glass-strong: rgba(255, 255, 255, 0.18);

    --egn-text: rgba(11, 11, 11, 0.92);
    --egn-text-soft: rgba(11, 11, 11, 0.74);
    --egn-text-muted: rgba(11, 11, 11, 0.62);

    --egn-text-on-orange: rgba(255, 255, 255, 0.92);
    --egn-text-muted-on-orange: rgba(255, 255, 255, 0.78);

    --egn-tap-min: 44px;
}


/* ---- Global Shell Background (No white header/footer/body) ---- */
body.primary-bg-color {
    /* Green gradient base (monitor-gamma balanced) */
    background: radial-gradient(circle at 18% 14%, rgba(255, 249, 220, 0.12), rgba(255, 249, 220, 0) 58%),
        radial-gradient(circle at 88% 86%, rgba(0, 0, 0, 0.12), rgba(0, 0, 0, 0) 62%),
        var(--egn-bg-gradient) !important;
    background-attachment: fixed;
}

.primary-bg-color {
    background-color: transparent !important;
}

header.header,
header.header .topbar,
.egn-utilitybar,
header.header .main-navbar,
header.header .main-navbar-wrapper,
footer.footer.siber-footer {
    background: radial-gradient(circle at 18% 14%, rgba(255, 249, 220, 0.10), rgba(255, 249, 220, 0) 58%),
        radial-gradient(circle at 88% 86%, rgba(0, 0, 0, 0.10), rgba(0, 0, 0, 0) 62%),
        var(--egn-bg-gradient) !important;
}

header.header .main-navbar-wrapper .navbar,
header.header .main-navbar-wrapper.navbar,
header.header .navbar-light {
    background: transparent !important;
}

/* Main body should not be a white slab */
#main-body {
    background: transparent !important;
    border-top: 1px solid var(--egn-border);
    backdrop-filter: none;
}

/* ---- Component Surfaces (glass-on-orange) ----
   SPR-097: Global UI Kit vNext
   - Store/Kategori (ORB) referansı: cam yüzey + net kontur + kontrollü gölge
*/

/* Yüzey konteynerleri (kart/panel/modal/dropdown) */
.card,
.panel,
.modal-content,
.dropdown-menu,
.siber-cta-card {
    background: var(--egn-surface-glass, rgba(255, 255, 255, 0.10)) !important;
    border-color: var(--egn-border) !important;
    border-radius: var(--egn-radius-lg, 20px) !important;
    box-shadow: var(--egn-shadow-sm, 0 10px 28px rgba(0, 0, 0, 0.10));
    backdrop-filter: blur(10px);
}

/* Liste/ikon kartları: container kadar ağır olmasın */
.list-group-item,
.egn-action-icon-btns a[class^="card-accent-"],
.egn-action-icon-btns a[class*=" card-accent-"] {
    background: rgba(255, 255, 255, 0.10) !important;
    border-color: var(--egn-border) !important;
}

.card-header,
.panel-heading,
.modal-header,
.modal-footer {
    background: var(--egn-surface-glass-strong, rgba(255, 255, 255, 0.18)) !important;
    border-color: var(--egn-border) !important;
}

/* Tablolar: cam yüzey + mobilde taşma engeli */
.table {
    background: rgba(255, 255, 255, 0.08) !important;
}

.table thead th {
    background: rgba(255, 255, 255, 0.14) !important;
}

.table tbody td {
    background: rgba(255, 255, 255, 0.06) !important;
}

@media (max-width: 767.98px) {
    /* Sayfa yatay taşma yapmasın: tablo kendi içinde scroll olur */
    #main-body .table {
        display: block;
        width: 100%;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
    }

    #main-body .table thead th,
    #main-body .table tbody td {
        white-space: nowrap;
    }
}

.alert {
    background: rgba(255, 255, 255, 0.14);
    border-color: var(--egn-border);
}

.form-control,
.custom-select,
.input-group-text {
    background: rgba(255, 255, 255, 0.16) !important;
    border-color: rgba(10, 46, 107, 0.22) !important;
    border-radius: var(--egn-radius-sm, 12px);
}

.form-control::placeholder {
    color: rgba(0, 0, 0, 0.55);
}


/* =========================================================================
   SPR-099: Global Components — Tables / Forms / Alerts / Pagination
   - Amaç: Klasik WHMCS tablo/form görünümünü kaldırıp Store/Kategori diliyle
     uyumlu cam yüzey standardı vermek.
   - Scope: #main-body (client area + içerik sayfaları)
   ========================================================================= */

/* ---------- Tables ---------- */
#main-body .table-responsive {
    border: 1px solid var(--egn-border);
    border-radius: var(--egn-radius-lg, 20px);
    background: rgba(255, 255, 255, 0.08);
    box-shadow: var(--egn-shadow-sm, 0 10px 28px rgba(0, 0, 0, 0.10));
    backdrop-filter: blur(10px);
    overflow-x: auto;
    overflow-y: hidden;
    -webkit-overflow-scrolling: touch;
}

#main-body .table-responsive > .table {
    margin-bottom: 0;
    background: transparent !important;
    border: 0;
    border-radius: 0;
    box-shadow: none;
}

#main-body .table {
    border: 1px solid var(--egn-border);
    border-radius: var(--egn-radius-lg, 20px);
    box-shadow: var(--egn-shadow-sm, 0 10px 28px rgba(0, 0, 0, 0.10));
}

#main-body .table th,
#main-body .table td {
    border-color: rgba(10, 46, 107, 0.18) !important;
    padding: 0.9rem 0.95rem;
    vertical-align: middle;
}

#main-body .table thead th {
    font-weight: var(--egn-font-weight-emphasis, 500);
    letter-spacing: -0.01em;
    color: rgba(11, 11, 11, 0.86);
}

#main-body .table-hover tbody tr:hover {
    background: rgba(255, 255, 255, 0.10) !important;
}

#main-body .table-striped tbody tr:nth-of-type(odd) {
    background: rgba(255, 255, 255, 0.05);
}

#main-body .table .btn {
    white-space: nowrap;
}

/* ---------- Forms ---------- */
#main-body label,
#main-body .form-label {
    font-weight: var(--egn-font-weight-emphasis, 500);
    color: rgba(11, 11, 11, 0.86);
}

#main-body .form-control,
#main-body .custom-select,
#main-body select.form-control,
#main-body .input-group-text {
    transition: box-shadow 160ms ease, border-color 160ms ease, background-color 160ms ease;
}

#main-body .form-control:not(.form-control-sm):not(textarea),
#main-body .custom-select:not(.custom-select-sm),
#main-body select.form-control:not(.form-control-sm) {
    min-height: var(--egn-tap-min, 44px);
}

#main-body .input-group-text {
    border-radius: var(--egn-radius-sm, 12px);
}

#main-body .form-control:focus,
#main-body .custom-select:focus {
    border-color: rgba(11, 62, 220, 0.55) !important;
    box-shadow: 0 0 0 0.22rem rgba(11, 62, 220, 0.16) !important;
}

#main-body .form-control.is-invalid,
#main-body .custom-select.is-invalid {
    border-color: rgba(220, 53, 69, 0.55) !important;
    box-shadow: 0 0 0 0.22rem rgba(220, 53, 69, 0.14);
}

#main-body .form-control.is-valid,
#main-body .custom-select.is-valid {
    border-color: rgba(40, 167, 69, 0.55) !important;
    box-shadow: 0 0 0 0.22rem rgba(40, 167, 69, 0.14);
}

/* Bootstrap 4 custom controls (WHMCS yoğun kullanır) */
#main-body .custom-control-label::before {
    background: rgba(255, 255, 255, 0.14);
    border-color: rgba(10, 46, 107, 0.35);
    box-shadow: none;
}

#main-body .custom-control-input:focus ~ .custom-control-label::before {
    box-shadow: 0 0 0 0.22rem rgba(212, 175, 55, 0.16);
    border-color: rgba(212, 175, 55, 0.55);
}

#main-body .custom-control-input:checked ~ .custom-control-label::before {
    background-image: var(--egn-gold-gradient);
    border-color: rgba(212, 175, 55, 0.70);
}

#main-body .form-check-input {
    width: 1.05rem;
    height: 1.05rem;
    border-color: rgba(10, 46, 107, 0.35);
    accent-color: var(--egn-gold, #d4af37);
}

#main-body .form-check-input:focus {
    box-shadow: 0 0 0 0.22rem rgba(212, 175, 55, 0.16);
}

/* ---------- Alerts ---------- */
#main-body .alert {
    border-radius: var(--egn-radius-md, 16px);
    border-width: 1px;
    border-left-width: 6px;
    box-shadow: var(--egn-shadow-sm, 0 10px 28px rgba(0, 0, 0, 0.10));
    backdrop-filter: blur(10px);
}

#main-body .alert-success {
    border-left-color: rgba(40, 167, 69, 0.75);
    background: rgba(40, 167, 69, 0.10) !important;
}

#main-body .alert-info,
#main-body .alert-primary {
    border-left-color: rgba(11, 62, 220, 0.75);
    background: rgba(11, 62, 220, 0.10) !important;
}

#main-body .alert-warning {
    border-left-color: rgba(255, 193, 7, 0.85);
    background: rgba(255, 193, 7, 0.12) !important;
}

#main-body .alert-danger {
    border-left-color: rgba(220, 53, 69, 0.80);
    background: rgba(220, 53, 69, 0.10) !important;
}

/* ---------- Pagination ---------- */
#main-body .pagination {
    gap: 8px;
}

#main-body .pagination .page-item {
    margin: 0 4px; /* gap fallback */
}

#main-body .pagination .page-item:first-child {
    margin-left: 0;
}

#main-body .pagination .page-item:last-child {
    margin-right: 0;
}

#main-body .page-link {
    min-width: var(--egn-tap-min, 44px);
    height: var(--egn-tap-min, 44px);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: var(--egn-radius-pill, 999px) !important;
    background: rgba(255, 255, 255, 0.14);
    border-color: var(--egn-border);
    color: rgba(11, 11, 11, 0.82);
    box-shadow: 0 10px 22px rgba(0, 0, 0, 0.10);
    backdrop-filter: blur(10px);
}

#main-body .page-link:hover,
#main-body .page-link:focus {
    background: rgba(255, 255, 255, 0.20);
    border-color: rgba(10, 46, 107, 0.30);
    color: rgba(11, 11, 11, 0.92);
}

#main-body .page-item.active .page-link {
    background-image: var(--egn-gold-gradient);
    background-color: transparent;
    border-color: rgba(212, 175, 55, 0.85);
    color: var(--egn-black);
    box-shadow: 0 12px 26px rgba(212, 175, 55, 0.26);
}

#main-body .page-item.disabled .page-link {
    opacity: 0.55;
    pointer-events: none;
}


/* ---- Nav text on orange header ---- */
header.header .main-navbar-wrapper .navbar-nav .nav-link {
    color: rgba(255, 255, 255, 0.92) !important;
}

header.header .main-navbar-wrapper .navbar-nav .nav-link:hover,
header.header .main-navbar-wrapper .navbar-nav .nav-link:focus {
    color: var(--egn-white) !important;
    background: rgba(10, 46, 107, 0.18) !important;
}

header.header .main-navbar-wrapper .nav-item.active > .nav-link,
header.header .main-navbar-wrapper .nav-link.active {
    background-image: var(--egn-gold-gradient) !important;
    background-color: transparent !important;
    color: var(--egn-black) !important;
    box-shadow:
        0 12px 26px rgba(212, 175, 55, 0.24),
        0 0 0 1px rgba(10, 46, 107, 0.22);
}

/* ---- Gold Gradient Accents ---- */
.btn-primary,
.btn-info,
a.btn-primary,
a.btn-info,
.egn-btn-primary {
    background-image: var(--egn-gold-gradient) !important;
    background-color: transparent !important;
    border-color: rgba(212, 175, 55, 0.75) !important;
    color: var(--egn-black) !important;
    box-shadow: 0 12px 26px rgba(212, 175, 55, 0.28);
}

.btn-primary:hover,
.btn-primary:focus,
.btn-info:hover,
.btn-info:focus,
a.btn-primary:hover,
a.btn-primary:focus,
a.btn-info:hover,
a.btn-info:focus,
.egn-btn-primary:hover,
.egn-btn-primary:focus {
    background-image: var(--egn-gold-gradient-hover) !important;
    background-color: transparent !important;
    border-color: rgba(212, 175, 55, 0.85) !important;
    color: var(--egn-black) !important;
}

.badge-info {
    background-image: var(--egn-gold-gradient) !important;
    background-color: transparent !important;
    color: var(--egn-black) !important;
}

/* ---- Footer text colors on orange ---- */
.footer.siber-footer {
    color: rgba(255, 255, 255, 0.88) !important;
}

.footer.siber-footer a {
    color: rgba(255, 255, 255, 0.92) !important;
}

.siber-footer__brand,
.siber-footer__title {
    color: #fff2c2 !important; /* bright gold-ish (no mud) */
}

#footer .designed-by {
    color: rgba(255, 255, 255, 0.78) !important;
}

#footer .designed-by a {
    color: rgba(255, 255, 255, 0.92) !important;
    border-bottom-color: rgba(255, 255, 255, 0.35) !important;
}

#footer .designed-by a:hover {
    color: var(--egn-white) !important;
    border-bottom-color: var(--egn-white) !important;
}


/* =========================================================================
   SPR-017 Hotfix: Mega Menu (Kontrast + Taşma)
   - Mega menüler artık çok şeffaf değil; arka plan daha opak parliament/navy.
   - Menü/alt menü yazıları #ffffff.
   - navbar-expand-xl ile uyumlu davranış (<=1199.98px mobil/kolay okunur).
   ========================================================================= */

header.header {
    position: relative;
    z-index: 1000;
}

/* SPR-119: Topbar dropdown'lar ana menünün arkasında kalmasın.
   - main-navbar-wrapper z-index: 1010
   - utilitybar z-index'ini daha yukarı al
*/
header.header .egn-utilitybar {
    position: relative;
    z-index: 1020;
}

header.header .egn-utilitybar .dropdown-menu {
    z-index: 1200;
}

header.header .main-navbar-wrapper {
    position: relative;
    z-index: 1010;
}

header.header .main-navbar-wrapper .dropdown-menu {
    z-index: 1100;
}

/* Mobile hamburger (toolbar) kontrast */
header.header .main-navbar-wrapper .toolbar .nav-link {
    color: rgba(255, 255, 255, 0.92) !important;
    background: rgba(255, 255, 255, 0.06);
    border: 1px solid rgba(255, 255, 255, 0.18);
    border-radius: 12px;
}

header.header .main-navbar-wrapper .toolbar .nav-link:hover,
header.header .main-navbar-wrapper .toolbar .nav-link:focus {
    background: #0b2f5f;
    border-color: rgba(255, 255, 255, 0.26);
    color: #ffffff !important;
}

/* Mega menüleri container içine sabitle (desktop) */
@media (min-width: 1200px) {
    header.header .main-navbar-wrapper .container {
        position: relative;
    }

    header.header .main-navbar-wrapper #nav > li.egn-has-mega,
    header.header .main-navbar-wrapper #nav > li.siber-has-mega {
        position: static;
    }

    header.header .main-navbar-wrapper #nav > li.egn-has-mega > ul.dropdown-menu,
    header.header .main-navbar-wrapper #nav > li.siber-has-mega > ul.dropdown-menu {
        left: 0 !important;
        right: 0 !important;
        width: 100% !important;
        min-width: 0 !important;
        margin-top: 10px;
    }
}

/* Mega menü arka plan + yazı rengi */
header.header .main-navbar-wrapper .dropdown-menu.egn-mega-menu,
header.header .main-navbar-wrapper .dropdown-menu.siber-mega-menu {
    background: linear-gradient(180deg, rgba(10, 46, 107, 0.96), rgba(10, 46, 107, 0.92)) !important;
    border: 1px solid rgba(255, 255, 255, 0.14) !important;
    box-shadow: 0 22px 55px rgba(0, 0, 0, 0.28) !important;
    backdrop-filter: blur(10px);
}

header.header .main-navbar-wrapper .dropdown-menu.egn-mega-menu .dropdown-item,
header.header .main-navbar-wrapper .dropdown-menu.siber-mega-menu .dropdown-item {
    color: rgba(255, 255, 255, 0.92) !important;
}

/* WHMCS auto mega (egn-mega) link kartları */
header.header .main-navbar-wrapper .dropdown-menu.egn-mega-menu > li.dropdown-item.egn-mega-item > a.egn-mega-link {
    background: rgba(255, 255, 255, 0.07) !important;
    border-color: rgba(255, 255, 255, 0.14) !important;
    color: rgba(255, 255, 255, 0.92) !important;
}

header.header .main-navbar-wrapper .dropdown-menu.egn-mega-menu > li.dropdown-item.egn-mega-item > a.egn-mega-link:hover,
header.header .main-navbar-wrapper .dropdown-menu.egn-mega-menu > li.dropdown-item.egn-mega-item > a.egn-mega-link:focus {
    background: rgba(255, 255, 255, 0.12) !important;
    border-color: rgba(255, 255, 255, 0.22) !important;
    color: #ffffff !important;
}

/* Siber mega (Kurumsal/Yazılar/Hizmetler/Tasarım) grupları */
header.header .main-navbar-wrapper .dropdown-menu.siber-mega-menu .siber-mega-group {
    background: rgba(255, 255, 255, 0.06) !important;
    border: 1px solid rgba(255, 255, 255, 0.14) !important;
    box-shadow: 0 16px 34px rgba(0, 0, 0, 0.18) !important;
}

header.header .main-navbar-wrapper .dropdown-menu.siber-mega-menu .siber-mega-group__title {
    color: rgba(255, 242, 194, 0.95) !important;
    border-bottom-color: rgba(255, 255, 255, 0.18) !important;
}

header.header .main-navbar-wrapper .dropdown-menu.siber-mega-menu .siber-mega-link {
    background: rgba(255, 255, 255, 0.07) !important;
    border-color: rgba(255, 255, 255, 0.14) !important;
    color: rgba(255, 255, 255, 0.92) !important;
}

header.header .main-navbar-wrapper .dropdown-menu.siber-mega-menu .siber-mega-link:hover,
header.header .main-navbar-wrapper .dropdown-menu.siber-mega-menu .siber-mega-link:focus {
    background: rgba(255, 255, 255, 0.12) !important;
    border-color: rgba(255, 255, 255, 0.22) !important;
    box-shadow: 0 12px 22px rgba(0, 0, 0, 0.20) !important;
    transform: translateY(-1px);
    color: #ffffff !important;
}

header.header .main-navbar-wrapper .dropdown-menu.siber-mega-menu .siber-mega-link__chevron {
    opacity: 0.82;
}


/* =========================================================================
   SPR-017 Hotfix: Homepage Hero (tema uyumu)
   - Orange shell üzerinde okunabilirlik için koyu overlay + beyaz metin.
   ========================================================================= */

.siber-hero {
    background: linear-gradient(180deg, rgba(0, 0, 0, 0.22), rgba(0, 0, 0, 0)) !important;
    border-bottom: 1px solid var(--egn-border);
    color: rgba(255, 255, 255, 0.92);
}

.siber-hero__title {
    text-shadow: 0 10px 22px rgba(0, 0, 0, 0.22);
}

.siber-hero__lead {
    color: rgba(10, 10, 10, 0.62);
}

.siber-hero .egn-kicker {
    background: rgba(255, 255, 255, 0.12);
    border: 1px solid rgba(255, 255, 255, 0.18);
    color: rgba(255, 255, 255, 0.92);
}


/* =========================================================================
   SPR-018: Homepage Refresh (Hero + Sections + Compact Domain Panel)
   - Hero: brand overlay + badges
   - Quick cards: premium shortcuts
   - Feature / plan cards: glass surface + gold accents
   - Domain search: compact mode styles
   ========================================================================= */

.siber-home {
    color: rgba(255, 255, 255, 0.90);
}

.siber-home .siber-section__title {
}

.siber-home .siber-section__lead {
    color: rgba(255, 255, 255, 0.84);
}

.siber-hero--brand {
    position: relative;
    overflow: hidden;
}

.siber-hero--brand::before {
    content: "";
    position: absolute;
    inset: -40% -30% auto auto;
    width: 520px;
    height: 520px;
    background: radial-gradient(circle at 30% 30%, rgba(10, 46, 107, 0.38), rgba(10, 46, 107, 0));
    transform: rotate(12deg);
    pointer-events: none;
}

.siber-hero--brand::after {
    content: "";
    position: absolute;
    left: -15%;
    bottom: -120px;
    width: 520px;
    height: 520px;
    background: radial-gradient(circle at 70% 60%, rgba(255, 255, 255, 0.10), rgba(255, 255, 255, 0));
    transform: rotate(-10deg);
    pointer-events: none;
}

.siber-hero--brand .container {
    position: relative;
    z-index: 1;
}

.siber-hero__badges .badge {
    background: rgba(255, 255, 255, 0.12) !important;
    border: 1px solid rgba(255, 255, 255, 0.18);
    color: rgba(255, 255, 255, 0.92) !important;
    border-radius: 999px;
    padding: 0.45rem 0.75rem;
    font-weight: 500;
}

.siber-hero__media img {
    border-radius: 18px !important;
    border: 1px solid rgba(255, 255, 255, 0.14);
    box-shadow: 0 22px 60px rgba(0, 0, 0, 0.28);
}

/* Quick shortcuts */
.siber-section--quick {
    padding-top: 34px;
    padding-bottom: 18px;
}

.siber-quick-card {
    display: block;
    height: 100%;
    text-decoration: none !important;
    color: rgba(255, 255, 255, 0.92) !important;
    background: rgba(10, 46, 107, 0.18);
    border: 1px solid rgba(255, 255, 255, 0.14);
    border-radius: 18px;
    padding: 18px;
    position: relative;
    overflow: hidden;
    box-shadow: 0 18px 40px rgba(0, 0, 0, 0.10);
    transition: transform 160ms ease, box-shadow 160ms ease, border-color 160ms ease;
}

.siber-quick-card::after {
    content: "";
    position: absolute;
    left: 14px;
    right: 14px;
    top: 14px;
    height: 3px;
    border-radius: 999px;
    background-image: var(--egn-gold-gradient);
    opacity: 0.72;
}

.siber-quick-card:hover,
.siber-quick-card:focus {
    transform: translateY(-2px);
    border-color: rgba(255, 255, 255, 0.22);
    box-shadow: 0 26px 54px rgba(0, 0, 0, 0.16);
    color: #ffffff !important;
}

.siber-quick-card__icon {
    width: 46px;
    height: 46px;
    border-radius: 16px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: rgba(255, 255, 255, 0.12);
    border: 1px solid rgba(255, 255, 255, 0.18);
    margin-bottom: 12px;
}

.siber-quick-card__icon i {
    color: #fff2c2;
}

.siber-quick-card__title {
    font-weight: 500;
    margin-bottom: 6px;
}

.siber-quick-card__text {
    margin: 0;
    font-size: 14px;
    color: rgba(255, 255, 255, 0.78);
}

/* Feature cards: remove white slabs */
.siber-feature-card {
    background: rgba(10, 46, 107, 0.18) !important;
    border: 1px solid rgba(255, 255, 255, 0.14) !important;
    box-shadow: 0 18px 44px rgba(0, 0, 0, 0.12);
}

.siber-feature-card__title {
    color: rgba(255, 255, 255, 0.94);
}

.siber-feature-card__text {
    color: rgba(255, 255, 255, 0.78);
}

.siber-feature-card__icon {
    background-image: var(--egn-gold-gradient);
    color: var(--egn-black);
    box-shadow: 0 16px 34px rgba(212, 175, 55, 0.22);
}

.siber-section--soft {
    background: rgba(0, 0, 0, 0.10);
    border-top: 1px solid var(--egn-border);
    border-bottom: 1px solid var(--egn-border);
}

/* SPR-113: Home Popüler Paketler - şeffaf çerçeve/panel istemiyoruz */
.siber-section--home-popular.siber-section--soft{
    background: transparent;
    border-top: 0;
    border-bottom: 0;
}

/* Pricing toggle on orange shell */
.siber-cycle-toggle {
    background: rgba(10, 46, 107, 0.18) !important;
    border-color: rgba(255, 255, 255, 0.16) !important;
}

.siber-cycle-toggle__btn {
    color: rgba(10, 10, 10, 0.62);
}

.siber-cycle-toggle__btn.is-active {
    background-image: var(--egn-gold-gradient);
    color: var(--egn-black);
}

/* Plan cards */
.card.siber-plan-card {
    background: rgba(10, 46, 107, 0.18) !important;
    border-color: rgba(255, 255, 255, 0.14) !important;
    color: rgba(255, 255, 255, 0.90);
}

.siber-plan-card__desc {
    color: rgba(255, 255, 255, 0.78);
}

.siber-plan-card__badge {
    background-image: var(--egn-gold-gradient) !important;
    border: 1px solid rgba(255, 255, 255, 0.14);
    color: var(--egn-black) !important;
}

.siber-plan-card__price {
    background: rgba(0, 0, 0, 0.12) !important;
    border-color: rgba(255, 255, 255, 0.12) !important;
}

.siber-plan-card .siber-price__value {
    background-image: var(--egn-gold-gradient);
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
}

.siber-plan-card .siber-price__unit,
.siber-plan-card .siber-price__meta {
    color: rgba(255, 255, 255, 0.72);
}

/* Compact domain search panel (homepage) */
.egn-domain-form--compact {
    margin: 0;
}

.egn-domain-compact {
    margin: 0;
}

.siber-domain-panel .egn-domain-panel--compact {
    background: rgba(10, 46, 107, 0.22) !important;
    border: 1px solid rgba(255, 255, 255, 0.16) !important;
    color: rgba(255, 255, 255, 0.92) !important;
    box-shadow: 0 26px 64px rgba(0, 0, 0, 0.22) !important;
    backdrop-filter: blur(10px);
}

.siber-domain-panel .egn-domain-panel--compact .egn-panel-kicker,
.siber-domain-panel .egn-domain-panel--compact .egn-panel-title,
.siber-domain-panel .egn-domain-panel--compact .egn-domain-help {
    color: rgba(255, 255, 255, 0.86) !important;
}

.siber-domain-panel .egn-domain-panel--compact .egn-domain-tabs {
    background: rgba(255, 255, 255, 0.08);
    border-color: rgba(255, 255, 255, 0.14);
}

.siber-domain-panel .egn-domain-panel--compact .egn-domain-tab {
    color: rgba(10, 10, 10, 0.62);
}

.siber-domain-panel .egn-domain-panel--compact .egn-domain-tab:hover {
    background: rgba(255, 255, 255, 0.08);
}

.siber-domain-panel .egn-domain-panel--compact .egn-domain-tab.is-active {
    background-image: var(--egn-gold-gradient);
    color: var(--egn-black);
}

.siber-domain-panel .egn-domain-panel--compact .form-control {
    background: rgba(255, 255, 255, 0.10) !important;
    border-color: rgba(255, 255, 255, 0.20) !important;
    color: rgba(255, 255, 255, 0.92) !important;
}

.siber-domain-panel .egn-domain-panel--compact .form-control::placeholder {
    color: rgba(255, 255, 255, 0.62);
}

.siber-domain-panel .egn-domain-panel--compact .egn-chip {
    background: #0b2f5f;
    border-color: rgba(255, 255, 255, 0.16);
    color: rgba(255, 255, 255, 0.92);
}

.siber-domain-panel .egn-domain-panel--compact .egn-domain-panel__links .btn-link {
    color: rgba(10, 10, 10, 0.62);
}

.siber-domain-panel .egn-domain-panel--compact .egn-domain-panel__links .btn-link:hover,
.siber-domain-panel .egn-domain-panel--compact .egn-domain-panel__links .btn-link:focus {
}

/*
  SPR-152:
  Body seviyesinde .btn-outline-primary'yi beyaza zorlamak, kart/tablolar gibi
  solid (beyaz) yüzeylerde butonların "kaybolmasına" neden oluyordu.
  (Örn: Client Area dashboard > Son Destek Bildirimleri > "Yeni Destek Bildirimi".)

  Çözüm: Beyaz outline görünümü sadece koyu hero yüzeyinde kullanılmalı.
*/
.egn-dashboard-hero .btn-outline-primary {
    color: rgba(255, 255, 255, 0.92);
    border-color: rgba(255, 255, 255, 0.32);
}

.egn-dashboard-hero .btn-outline-primary:hover,
.egn-dashboard-hero .btn-outline-primary:focus {
    border-color: rgba(255, 255, 255, 0.38);
}

/* =========================================================================
   SPR-019: Client Area Dashboard Layout (Services / Domains)
   - Card/Grid based lists
   - Readable glass surfaces on orange shell
   - Quick search + bulk action bar
   ========================================================================= */

.siber-dash {
    margin-bottom: 22px;
}

.siber-dash-header {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 16px;
    padding: 14px 16px;
    border: 1px solid rgba(255, 255, 255, 0.18);
    border-radius: 16px;
    background: rgba(10, 46, 107, 0.18);
    box-shadow: 0 22px 60px rgba(0, 0, 0, 0.18);
    backdrop-filter: blur(10px);
}

.siber-dash-header--details {
    margin-bottom: 16px;
}

.siber-dash-title {
    margin: 0;
    font-size: 1.45rem;
    line-height: 1.2;
    color: rgba(255, 255, 255, 0.94);
}

.siber-dash-subtitle {
    margin-top: 6px;
    color: rgba(255, 255, 255, 0.78);
    font-size: 0.95rem;
}

.siber-dash-header__actions {
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
    justify-content: flex-end;
}

.siber-dash-header__actions .btn {
    border-radius: 12px;
}

.siber-dash-toolbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    margin-top: 12px;
    margin-bottom: 16px;
}

@media (max-width: 767.98px) {
    .siber-dash-toolbar {
        flex-direction: column;
        align-items: stretch;
    }
}

.siber-dash-search {
    min-width: 260px;
    max-width: 520px;
    flex: 1 1 auto;
}

.siber-dash-search .input-group-text {
    background: rgba(255, 255, 255, 0.10) !important;
    border-color: rgba(255, 255, 255, 0.18) !important;
    color: rgba(255, 255, 255, 0.88);
}

.siber-dash-search .form-control {
    color: rgba(255, 255, 255, 0.92) !important;
}

.siber-dash-search .form-control::placeholder {
    color: rgba(255, 255, 255, 0.62);
}

.siber-dash-meta {
    color: rgba(10, 10, 10, 0.62);
}

.siber-dash-count {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 6px 10px;
    border: 1px solid rgba(255, 255, 255, 0.18);
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.08);
}

.siber-dash-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 16px;
}

@media (max-width: 1199.98px) {
    .siber-dash-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 767.98px) {
    .siber-dash-grid {
        grid-template-columns: 1fr;
    }
}

.siber-dash-card {
    cursor: pointer;
    transition: transform 0.12s ease, box-shadow 0.12s ease, background 0.12s ease;
    background: rgba(10, 46, 107, 0.14) !important;
}

.siber-dash-card:hover {
    transform: translateY(-2px);
    box-shadow: 0 18px 54px rgba(0, 0, 0, 0.22) !important;
    background: rgba(10, 46, 107, 0.18) !important;
}

.siber-dash-card__head {
    display: flex;
    align-items: flex-start;
    gap: 12px;
}

.siber-dash-card__check {
    padding-top: 6px;
}

.siber-dash-card__icon {
    width: 42px;
    height: 42px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 12px;
    background: rgba(255, 255, 255, 0.08);
    border: 1px solid rgba(255, 255, 255, 0.14);
    color: rgba(255, 255, 255, 0.90);
    flex: 0 0 auto;
}

.siber-dash-card__titles {
    min-width: 0;
    flex: 1 1 auto;
}

.siber-dash-card__title {
    font-size: 1.05rem;
    font-weight: var(--egn-font-weight-emphasis);
    color: rgba(255, 255, 255, 0.96);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.siber-dash-card__title a {
    color: rgba(255, 255, 255, 0.96);
    text-decoration: none;
}

.siber-dash-card__title a:hover,
.siber-dash-card__title a:focus {
    text-decoration: underline;
}

.siber-dash-card__subtitle {
    margin-top: 4px;
    font-size: 0.9rem;
    color: rgba(255, 255, 255, 0.74);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.siber-dash-card__status {
    flex: 0 0 auto;
    text-align: right;
}

.siber-dash-card__hint {
    margin-top: 6px;
    font-size: 0.8rem;
    color: rgba(255, 255, 255, 0.72);
}

.siber-dash-kv {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
    margin-top: 12px;
    padding-top: 12px;
    border-top: 1px solid rgba(255, 255, 255, 0.12);
}

.siber-dash-kv__item {
    background: rgba(255, 255, 255, 0.06);
    border: 1px solid rgba(255, 255, 255, 0.12);
    border-radius: 12px;
    padding: 10px 12px;
}

.siber-dash-kv__label {
    font-size: 0.78rem;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: rgba(255, 255, 255, 0.68);
}

.siber-dash-kv__value {
    margin-top: 4px;
    font-size: 0.95rem;
    color: rgba(255, 255, 255, 0.92);
}

.siber-dash-kv__value .text-muted {
    color: rgba(255, 255, 255, 0.66) !important;
}

.siber-dash-card__actions {
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
    margin-top: 12px;
}

.siber-dash-card__actions .btn {
    border-radius: 12px;
}

/* Gold CTA helper */
.siber-btn-gold {
    background-image: var(--egn-gold-gradient) !important;
    border: 1px solid rgba(255, 255, 255, 0.18) !important;
    color: var(--egn-black) !important;
}

.siber-btn-gold:hover,
.siber-btn-gold:focus {
    background-image: var(--egn-gold-gradient-hover) !important;
    color: var(--egn-black) !important;
}

/* Bulk actions bar (domains) */
.siber-bulkbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 14px;
    flex-wrap: wrap;
    padding: 10px 12px;
    border: 1px solid rgba(255, 255, 255, 0.18);
    border-radius: 14px;
    background: rgba(10, 46, 107, 0.14);
}

.siber-bulkbar__right {
    display: flex;
    align-items: center;
    gap: 10px;
}

.siber-bulkbar__check {
    margin: 0;
}

/* Empty state */
.siber-empty {
    text-align: center;
    padding: 26px 18px;
    border: 1px dashed rgba(255, 255, 255, 0.28);
    border-radius: 18px;
    background: rgba(10, 46, 107, 0.10);
}

.siber-empty__icon {
    font-size: 2rem;
    color: rgba(255, 255, 255, 0.88);
    margin-bottom: 10px;
}

.siber-empty__title {
    font-size: 1.2rem;
    color: rgba(255, 255, 255, 0.92);
    margin-bottom: 6px;
}

.siber-empty__text {
    color: rgba(255, 255, 255, 0.74);
    margin-bottom: 14px;
}

.siber-empty__actions {
    display: flex;
    justify-content: center;
    gap: 10px;
    flex-wrap: wrap;
}

/* Details pages: make right column readable */
.siber-detail-metrics {
    text-align: left;
    color: rgba(255, 255, 255, 0.92);
}

.siber-detail-metrics h4 {
    margin-top: 14px;
    font-size: 0.95rem;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: rgba(255, 255, 255, 0.72);
}

/* Tabs glass container (remove bg-white slab) */
.siber-tabs-glass {
    background: rgba(255, 255, 255, 0.06) !important;
    border: 1px solid rgba(255, 255, 255, 0.14);
    border-radius: 14px;
    padding: 10px;
}

.siber-tabs-glass .tab-pane {
    padding: 8px;
}


/* =========================================================================
   SPR-020 Visual Stabilization (Header / Body / Footer)
   - Arkaplan: turuncu + beyaz highlight + parlament cizgiler (kesik kesik yok)
   - Header menü yazıları: beyaz + daha kaliteli ebat
   - Mega menüler: daha az alan + içeride açılma + her link ikonlu
   - Mobil: logo ortada + topbar butonları altta dock
   ========================================================================= */

/* Global luxe background (fixed pseudo layer, prevents seams on long pages) */
html {
    background: var(--egn-orange-0);
}

body.primary-bg-color {
    background: transparent !important;
    position: relative;
    min-height: 100vh;
}

body.primary-bg-color::before {
    content: "";
    position: fixed;
    inset: 0;
    z-index: -2;
    background:
        radial-gradient(1400px 820px at 10% -10%, rgba(255, 255, 255, 0.26), rgba(255, 255, 255, 0) 62%),
        radial-gradient(980px 640px at 92% 12%, rgba(255, 255, 255, 0.14), rgba(255, 255, 255, 0) 70%),
        radial-gradient(1200px 820px at 62% 118%, rgba(10, 46, 107, 0.28), rgba(10, 46, 107, 0) 58%),
        radial-gradient(980px 720px at -10% 105%, rgba(10, 46, 107, 0.22), rgba(10, 46, 107, 0) 60%),
        linear-gradient(120deg,
            rgba(255, 255, 255, 0.05) 0%,
            rgba(255, 255, 255, 0.00) 55%,
            rgba(10, 46, 107, 0.08) 100%
        ),
        var(--egn-bg-gradient);
    background-repeat: no-repeat;
    background-size: cover;
}

body.primary-bg-color::after {
    content: "";
    position: fixed;
    inset: 0;
    z-index: -1;
    pointer-events: none;
    background-image: url("../img/noise.webp");
    background-repeat: repeat;
    background-size: 320px 320px;
    opacity: 0.055;
}



/*
  SPR-031: Sol üst marka wedge + büyük logo (desktop)
  - Pseudo element yerine DOM katmanı kullanılır (bazı kurulumlarda pseudo/z-index sorunlarını engeller).
  - Logo header içinde değil, arkaplan katmanında görünür.
  - Sol üstte çapraz beyaz alan logo gri tonunu boğmaz.
*/
.siber-bg-brand {
    display: none;
}

@media (min-width: 1200px) {
    .siber-bg-brand {
        display: block;
        position: fixed;
        top: 0;
        left: 0;
        width: 760px;
        height: 360px;
        z-index: 0;
        pointer-events: none;

        background-image:
            url("../img/brand/Siber-Mimar-Logo-1.webp"),
            linear-gradient(135deg,
                rgba(255, 255, 255, 0.96) 0%,
                rgba(255, 255, 255, 0.96) 56%,
                rgba(255, 255, 255, 0.0) 56.6%
            );
        background-repeat: no-repeat, no-repeat;
        background-size: 560px auto, cover;
        background-position: 18px 62px, 0 0;
        opacity: 0.98;
        filter: drop-shadow(0 18px 44px rgba(0, 0, 0, 0.18));
    }
}

/* Ensure content sits above background brand layer */
header.header {
    position: relative;
    /* Dropdown menüler (Hesabım vb.) main-body'nin arkasında kalmasın */
    z-index: 1000;
}

#main-body,
footer.footer.siber-footer {
    position: relative;
    z-index: 1;
}

/* Header / footer glass overlays (avoid pure black/white slabs) */
header.header .main-navbar-wrapper,
header.header .main-navbar,
.egn-utilitybar,
footer.footer.siber-footer {
    /* Daha net kontrast: beyaz menü metni için koyu cam yüzey */
    background: linear-gradient(135deg, rgba(10, 46, 107, 0.34), rgba(0, 200, 83, 0.22)) !important;
    border-color: rgba(255, 255, 255, 0.14) !important;
    backdrop-filter: blur(10px);
}

/* SPR-144: Topbar artık mobilde de görünür (mobil dock ile birlikte). */
@media (max-width: 1199.98px) {
    .egn-utilitybar {
        display: block !important;
    }
}

/*
  SPR-028: Logo kullanım modeli
  - Masaüstünde (>=1200px) logo header içinde değil, arkaplan katmanında büyük görünür.
  - Mobilde navbar-brand içinde logo görünür; "beyaz çerçeve" yok (sadece glow).
*/
@media (min-width: 1200px) {
    header.header .main-navbar-wrapper .siber-brand {
        display: none !important;
    }
}

.siber-brand {
    display: inline-flex;
    align-items: center;
    padding: 0;
    border-radius: 0;
    background: transparent;
    border: 0;
    box-shadow: none;
}

.siber-brand .logo-img {
    max-height: 98px;
    width: auto;
    height: auto;
    /* White glow without a hard frame */
    filter:
        drop-shadow(0 16px 28px rgba(255, 255, 255, 0.28))
        drop-shadow(0 18px 44px rgba(0, 0, 0, 0.18));
}

@media (max-width: 1199.98px) {
    .siber-brand .logo-img {
        max-height: 92px;
    }
}

/* Mobile: center logo */
@media (max-width: 1199.98px) {
    header.header .main-navbar-wrapper .container {
        position: relative;
    }
    header.header .main-navbar-wrapper .siber-brand {
        position: absolute;
        left: 50%;
        transform: translateX(-50%);
        margin-right: 0 !important;
        z-index: 2;
    }
}

/* Header menu quality + white text */
header.header .main-navbar-wrapper .navbar-nav .nav-link {
    font-size: 0.95rem;
    font-weight: 500;
    letter-spacing: 0.01em;
    color: rgba(255, 255, 255, 0.92) !important;
    padding: 0.55rem 0.75rem;
}

header.header .main-navbar-wrapper .navbar-nav .nav-link:hover,
header.header .main-navbar-wrapper .navbar-nav .nav-link:focus {
    background: rgba(255, 255, 255, 0.08) !important;
    color: #ffffff !important;
}

/* Topbar nav links (Hesabım vb.) */
.egn-utilitybar .nav-link {
    color: rgba(255, 255, 255, 0.92) !important;
}

.egn-utilitybar .nav-link:hover,
.egn-utilitybar .nav-link:focus {
    color: #ffffff !important;
    background: rgba(255, 255, 255, 0.08) !important;
}

/* Dropdown menus in header/topbar: not transparent */
.egn-utilitybar .dropdown-menu,
header.header .main-navbar-wrapper .dropdown-menu {
    background: linear-gradient(180deg, rgba(10, 46, 107, 0.96), rgba(10, 46, 107, 0.90)) !important;
    border: 1px solid rgba(255, 255, 255, 0.14) !important;
    box-shadow: 0 22px 55px rgba(0, 0, 0, 0.28) !important;
    backdrop-filter: blur(10px);
}

.egn-utilitybar .dropdown-item,
header.header .main-navbar-wrapper .dropdown-item {
    color: rgba(255, 255, 255, 0.92) !important;
}

.egn-utilitybar .dropdown-item:hover,
.egn-utilitybar .dropdown-item:focus,
header.header .main-navbar-wrapper .dropdown-item:hover,
header.header .main-navbar-wrapper .dropdown-item:focus {
    background: rgba(255, 255, 255, 0.10) !important;
    color: #ffffff !important;
}

/* =========================================================================
   SPR-142: Üst bardaki "Hesabım" (custom dropdown) link renkleri
   - WHMCS default dropdown-item sınıfını kullanmadığı için bazı kurulumlarda mavi link görünüyor.
   - İstek: Yazılar/butonlar her durumda beyaz olsun, hover rengi olmasın.
   ========================================================================= */

.siber-nav-account > a,
.siber-nav-account > a:hover,
.siber-nav-account > a:focus,
.siber-nav-account > a:active,
.siber-nav-account > a:visited {
    color: #ffffff !important;
    text-decoration: none !important;
    background: transparent !important;
}

.siber-account-dropdown > li > a,
.siber-account-dropdown > li > a:hover,
.siber-account-dropdown > li > a:focus,
.siber-account-dropdown > li > a:active,
.siber-account-dropdown > li > a:visited {
    display: block;
    padding: 10px 14px;
    color: #ffffff !important;
    text-decoration: none !important;
    background: transparent !important;
}

.siber-account-dropdown > li.divider {
    height: 1px;
    margin: 6px 0;
    background: rgba(255, 255, 255, 0.14);
}

/* Alan Adı dropdown icon spacing */
#siberMenuAlanAdi .dropdown-item {
    display: flex;
    align-items: center;
    gap: 10px;
}

/* Mega menus: less width, centered inside page (no full width) */
@media (min-width: 1200px) {
    header.header .main-navbar-wrapper #nav > li.egn-has-mega,
    header.header .main-navbar-wrapper #nav > li.siber-has-mega {
        position: static;
    }

    header.header .main-navbar-wrapper #nav > li.egn-has-mega > ul.dropdown-menu,
    header.header .main-navbar-wrapper #nav > li.siber-has-mega > ul.dropdown-menu {
        left: 50% !important;
        right: auto !important;
        transform: translateX(-50%);
        width: min(980px, calc(100vw - 56px)) !important;
        max-width: 980px;
        min-width: 720px;
        margin-top: 10px;
    }
}

/* Mega link thumbs (visual for every link) */
header.header .main-navbar-wrapper .egn-mega-link__thumb,
header.header .main-navbar-wrapper .siber-mega-link__thumb,
header.header .main-navbar-wrapper .siber-dd-thumb {
    width: 38px;
    height: 38px;
    border-radius: 12px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: #0b2f5f;
    border: 1px solid rgba(255, 255, 255, 0.18);
    color: rgba(255, 255, 255, 0.94);
    flex: 0 0 auto;
    position: relative;
    overflow: hidden;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
}

header.header .main-navbar-wrapper .egn-mega-link__thumb::after,
header.header .main-navbar-wrapper .siber-mega-link__thumb::after,
header.header .main-navbar-wrapper .siber-dd-thumb::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.16), rgba(10, 46, 107, 0.22));
}

header.header .main-navbar-wrapper .egn-mega-link__thumb i,
header.header .main-navbar-wrapper .siber-mega-link__thumb i,
header.header .main-navbar-wrapper .siber-dd-thumb i {
    font-size: 14px;
    line-height: 1;
    position: relative;
    z-index: 1;
    text-shadow: 0 8px 18px rgba(0, 0, 0, 0.35);
}

/* Alan Adı dropdown: thumb a little smaller */
#siberMenuAlanAdi .siber-dd-thumb {
    width: 30px;
    height: 30px;
    border-radius: 10px;
}

/* SPR-041: Mega menu thumbnail set (tiny WEBP) */
header.header .main-navbar-wrapper .siber-thumb--kurumsal .siber-mega-link__thumb,
header.header .main-navbar-wrapper .siber-thumb--kurumsal .egn-mega-link__thumb,
header.header .main-navbar-wrapper .siber-thumb--kurumsal .siber-dd-thumb {
    background-image: url('../img/mega/thumb-kurumsal.webp');
}

header.header .main-navbar-wrapper .siber-thumb--takim .siber-mega-link__thumb,
header.header .main-navbar-wrapper .siber-thumb--takim .egn-mega-link__thumb,
header.header .main-navbar-wrapper .siber-thumb--takim .siber-dd-thumb {
    background-image: url('../img/mega/thumb-takim.webp');
}

header.header .main-navbar-wrapper .siber-thumb--projeler .siber-mega-link__thumb,
header.header .main-navbar-wrapper .siber-thumb--projeler .egn-mega-link__thumb,
header.header .main-navbar-wrapper .siber-thumb--projeler .siber-dd-thumb {
    background-image: url('../img/mega/thumb-projeler.webp');
}

header.header .main-navbar-wrapper .siber-thumb--muzik .siber-mega-link__thumb,
header.header .main-navbar-wrapper .siber-thumb--muzik .egn-mega-link__thumb,
header.header .main-navbar-wrapper .siber-thumb--muzik .siber-dd-thumb {
    background-image: url('../img/mega/thumb-muzik.webp');
}

header.header .main-navbar-wrapper .siber-thumb--blog .siber-mega-link__thumb,
header.header .main-navbar-wrapper .siber-thumb--blog .egn-mega-link__thumb,
header.header .main-navbar-wrapper .siber-thumb--blog .siber-dd-thumb {
    background-image: url('../img/mega/thumb-blog.webp');
}

header.header .main-navbar-wrapper .siber-thumb--yazilar .siber-mega-link__thumb,
header.header .main-navbar-wrapper .siber-thumb--yazilar .egn-mega-link__thumb,
header.header .main-navbar-wrapper .siber-thumb--yazilar .siber-dd-thumb {
    background-image: url('../img/mega/thumb-yazilar.webp');
}

header.header .main-navbar-wrapper .siber-thumb--forum .siber-mega-link__thumb,
header.header .main-navbar-wrapper .siber-thumb--forum .egn-mega-link__thumb,
header.header .main-navbar-wrapper .siber-thumb--forum .siber-dd-thumb {
    background-image: url('../img/mega/thumb-forum.webp');
}

header.header .main-navbar-wrapper .siber-thumb--wiki .siber-mega-link__thumb,
header.header .main-navbar-wrapper .siber-thumb--wiki .egn-mega-link__thumb,
header.header .main-navbar-wrapper .siber-thumb--wiki .siber-dd-thumb {
    background-image: url('../img/mega/thumb-wiki.webp');
}

header.header .main-navbar-wrapper .siber-thumb--tasarim .siber-mega-link__thumb,
header.header .main-navbar-wrapper .siber-thumb--tasarim .egn-mega-link__thumb,
header.header .main-navbar-wrapper .siber-thumb--tasarim .siber-dd-thumb {
    background-image: url('../img/mega/thumb-tasarim.webp');
}

header.header .main-navbar-wrapper .siber-thumb--hizmetler .siber-mega-link__thumb,
header.header .main-navbar-wrapper .siber-thumb--hizmetler .egn-mega-link__thumb,
header.header .main-navbar-wrapper .siber-thumb--hizmetler .siber-dd-thumb {
    background-image: url('../img/mega/thumb-hizmetler.webp');
}

header.header .main-navbar-wrapper .siber-thumb--hosting .siber-mega-link__thumb,
header.header .main-navbar-wrapper .siber-thumb--hosting .egn-mega-link__thumb,
header.header .main-navbar-wrapper .siber-thumb--hosting .siber-dd-thumb {
    background-image: url('../img/mega/thumb-hosting.webp');
}

header.header .main-navbar-wrapper .siber-thumb--vps .siber-mega-link__thumb,
header.header .main-navbar-wrapper .siber-thumb--vps .egn-mega-link__thumb,
header.header .main-navbar-wrapper .siber-thumb--vps .siber-dd-thumb {
    background-image: url('../img/mega/thumb-vps.webp');
}

header.header .main-navbar-wrapper .siber-thumb--reseller .siber-mega-link__thumb,
header.header .main-navbar-wrapper .siber-thumb--reseller .egn-mega-link__thumb,
header.header .main-navbar-wrapper .siber-thumb--reseller .siber-dd-thumb {
    background-image: url('../img/mega/thumb-reseller.webp');
}

header.header .main-navbar-wrapper .siber-thumb--transfer .siber-mega-link__thumb,
header.header .main-navbar-wrapper .siber-thumb--transfer .egn-mega-link__thumb,
header.header .main-navbar-wrapper .siber-thumb--transfer .siber-dd-thumb {
    background-image: url('../img/mega/thumb-transfer.webp');
}

header.header .main-navbar-wrapper .siber-thumb--lisans .siber-mega-link__thumb,
header.header .main-navbar-wrapper .siber-thumb--lisans .egn-mega-link__thumb,
header.header .main-navbar-wrapper .siber-thumb--lisans .siber-dd-thumb {
    background-image: url('../img/mega/thumb-lisans.webp');
}

header.header .main-navbar-wrapper .siber-thumb--alanadi .siber-mega-link__thumb,
header.header .main-navbar-wrapper .siber-thumb--alanadi .egn-mega-link__thumb,
header.header .main-navbar-wrapper .siber-thumb--alanadi .siber-dd-thumb {
    background-image: url('../img/mega/thumb-alanadi.webp');
}

header.header .main-navbar-wrapper .siber-mega-link {
    justify-content: flex-start !important;
}

header.header .main-navbar-wrapper .egn-mega-link {
    justify-content: flex-start !important;
}

header.header .main-navbar-wrapper .egn-mega-link__label {
    flex: 1 1 auto;
}

header.header .main-navbar-wrapper .egn-mega-link__chevron {
    margin-left: auto;
}

header.header .main-navbar-wrapper .siber-mega-link__label {
    flex: 1 1 auto;
}

header.header .main-navbar-wrapper .siber-mega-link__chevron {
    margin-left: auto;
}

/* Domain hero: compact & premium */
.siber-hero--domain {
    padding-top: 54px;
    padding-bottom: 34px;
}

.siber-domain-hero {
    max-width: 980px;
    margin: 0 auto;
    text-align: center;
}

.siber-domain-hero__kicker {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 6px 12px;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.12);
    border: 1px solid rgba(255, 255, 255, 0.18);
    color: rgba(255, 255, 255, 0.92);
    font-size: 12px;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.siber-domain-hero__title {
    margin: 14px 0 10px;
    font-size: 42px;
    line-height: 1.12;
    font-weight: 500;
    text-shadow: 0 14px 28px rgba(0, 0, 0, 0.22);
}

.siber-domain-hero__lead {
    margin: 0 auto 18px;
    max-width: 740px;
    color: rgba(10, 10, 10, 0.62);
}

@media (max-width: 767.98px) {
    .siber-domain-hero__title {
        font-size: 30px;
    }
}



/* =========================================================================
   SPR-051: Tech Globe - Domain arama alaninin ustunde (decorative)
   - SVG + JS: templates/SiberMtema/includes/siber-tech-globe.tpl
   ========================================================================= */

.siber-domain-hero__globe {
    display: flex;
    justify-content: center;
    margin: 6px 0 8px;
    pointer-events: none;
}

.siber-tech-globe {
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.siber-tech-globe__svg {
    width: clamp(150px, 16vw, 240px);
    max-width: 100%;
    height: auto;

    /* Theme: white globe */
    --globe-color: rgba(255, 255, 255, 0.92);
    --front-opacity: 0.78;
    --back-opacity: 0.14;
    --stroke: 1.55;
    --stroke-major: 2.10;
    --spin-seconds: 18;
    --max-fps: 30;
    --globe-filter: drop-shadow(0 18px 44px rgba(0, 0, 0, 0.22));

    color: var(--globe-color);
    filter: var(--globe-filter);
    user-select: none;
    -webkit-user-select: none;
    contain: layout paint;
}

.siber-tech-globe__svg .sphere-outline {
    fill: none;
    stroke: currentColor;
    stroke-width: var(--stroke-major);
    opacity: 0.86;
    vector-effect: non-scaling-stroke;
}

.siber-tech-globe__svg .sphere-fill {
    fill: url(#siberGlobe_sphereShade);
    opacity: 1;
}

.siber-tech-globe__svg .grid {
    shape-rendering: geometricPrecision;
}

.siber-tech-globe__svg .grid-line {
    fill: none;
    stroke: currentColor;
    stroke-linecap: round;
    stroke-linejoin: round;
    vector-effect: non-scaling-stroke;
}

.siber-tech-globe__svg .grid-minor {
    stroke-width: var(--stroke);
}

.siber-tech-globe__svg .grid-major {
    stroke-width: var(--stroke-major);
}

.siber-tech-globe__svg .grid-front {
    opacity: var(--front-opacity);
}

.siber-tech-globe__svg .grid-back {
    opacity: var(--back-opacity);
}

.siber-tech-globe__svg .node {
    fill: currentColor;
    transform-box: fill-box;
    transform-origin: center;
    animation: siberGlobePulse 3.0s ease-in-out infinite;
}

.siber-tech-globe__svg .node.d2 {
    animation-delay: .35s;
}

.siber-tech-globe__svg .node.d3 {
    animation-delay: .70s;
}

.siber-tech-globe__svg .node.d4 {
    animation-delay: 1.05s;
}

@keyframes siberGlobePulse {
    0%,
    100% {
        transform: scale(1);
        opacity: 0.85;
    }

    50% {
        transform: scale(1.30);
        opacity: 1;
    }
}

@media (prefers-reduced-motion: reduce) {
    .siber-tech-globe__svg .node {
        animation: none !important;
    }
}

@media (max-width: 767.98px) {
    .siber-domain-hero__globe {
        margin: 2px 0 6px;
    }

    .siber-tech-globe__svg {
        width: min(56vw, 220px);
        --max-fps: 24;
    }
}


/* =========================================================================
   SPR-055: Tech Globe - Site geneli sol alt mini (homepage hariç)
   - Footer içinde inject edilir; UI'yi engellemez (pointer-events: none)
   ========================================================================= */

.siber-tech-globe-float{
    position: fixed;
    left: 18px;
    bottom: 24px;
    z-index: 1020;
    pointer-events: none;
    opacity: 0.92;
    filter: saturate(1.02);
}

.siber-tech-globe-float .siber-tech-globe__svg{
    width: 118px;
    --spin-seconds: 24;
    --max-fps: 18;
    --front-opacity: 0.74;
    --back-opacity: 0.12;
    --stroke: 1.35;
    --stroke-major: 1.95;
    --globe-filter: drop-shadow(0 16px 42px rgba(0,0,0,0.22));
}

/* Mobil alt dock ile çakışmasın */
@media (max-width: 1199.98px){
    .siber-tech-globe-float{
        left: 12px;
        /* Mobil dock + aux bar ile çakışmasın */
        bottom: 190px;
        opacity: 0.90;
    }

    .siber-tech-globe-float .siber-tech-globe__svg{
        width: 92px;
        --max-fps: 16;
    }
}


/* Domain tabs smaller (Ara/Transfer) */
.siber-domain-panel .egn-domain-panel--compact .egn-domain-tab {
    padding: 8px 12px;
    font-size: 13px;
}

/* Mobile bottom dock */
.siber-mobile-dock {
    position: fixed;
    left: 10px;
    right: 10px;
    bottom: 10px;
    z-index: 1030;
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 8px;
    padding: 10px;
    border-radius: 18px;
    background: linear-gradient(180deg, rgba(10, 46, 107, 0.92), rgba(10, 46, 107, 0.84));
    border: 1px solid rgba(255, 255, 255, 0.14);
    box-shadow: 0 22px 60px rgba(0, 0, 0, 0.30);
    backdrop-filter: blur(10px);
}


/* Logged-in: 6-item dock (Satın Aldıklarım eklendi) */
.siber-mobile-dock.siber-mobile-dock--6 {
    grid-template-columns: repeat(6, 1fr);
}

.siber-mobile-dock.siber-mobile-dock--6 .siber-mobile-dock__item i {
    font-size: 17px;
}

.siber-mobile-dock.siber-mobile-dock--6 .siber-mobile-dock__item span {
    font-size: 10px;
    white-space: nowrap;
    letter-spacing: 0.01em;
}

.siber-mobile-dock__item {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 6px;
    padding: 10px 6px;
    border-radius: 14px;
    color: rgba(255, 255, 255, 0.92);
    text-decoration: none;
    background: rgba(255, 255, 255, 0.06);
    border: 1px solid rgba(255, 255, 255, 0.12);
}

.siber-mobile-dock__item:hover,
.siber-mobile-dock__item:focus,
.siber-mobile-dock__item:active {
    /* Mobilde hover efekti istenmiyor: sabit görünüm */
    text-decoration: none;
    background: rgba(255, 255, 255, 0.06);
    border-color: rgba(255, 255, 255, 0.12);
    color: rgba(255, 255, 255, 0.92);
    opacity: 1;
    transition: none;
}

.siber-mobile-dock__item i {
    font-size: 18px;
}

.siber-mobile-dock__item span {
    font-size: 11px;
    letter-spacing: 0.02em;
}

/* Footer credit contrast */
#footer .designed-by {
    color: rgba(255, 255, 255, 0.72);
}

#footer .designed-by a {
    color: rgba(255, 255, 255, 0.88);
    border-bottom-color: rgba(255, 255, 255, 0.28);
}

#footer .designed-by a:hover {
    border-bottom-color: rgba(255, 255, 255, 0.55);
}

@media (max-width: 1199.98px) {
    body {
        padding-bottom: 94px;
    }
}

/* =========================================================================
   SPR-032: Logo görünürlüğü + Hero Slim + Header Z-Index Fix
   - Mobilde logo kırpılmasını kaldır, beyaz zemin ekle
   - Masaüstünde logo arkasındaki beyaz wedge daha geniş/oval ve geçiş soft
   - Hero: daha kısa ve sade (kicker kaldırıldı)
   - Dropdown/Mega menu: header her zaman üstte (tıklanabilir)
   ========================================================================= */

/* Header her zaman main-body üstünde olmalı (mega menüler tıklanabilir) */
header.header {
    position: relative;
    z-index: 1040;
}

#main-body,
footer.footer.siber-footer {
    position: relative;
    z-index: 1;
}

header.header .main-navbar-wrapper .dropdown-menu {
    z-index: 1100;
}

/* Menü linklerini net beyaz yap (bazı sayfalarda theme.css override edebilir) */
header.header .main-navbar-wrapper .navbar-nav .nav-link {
    color: #ffffff !important;
}

/* Mobil: Logo alanı düzelt (kırpılmasın, beyaz zemin) */
@media (max-width: 1199.98px) {
    header.header .main-navbar-wrapper .navbar {
        min-height: 84px;
    }

    header.header .main-navbar-wrapper .siber-brand {
        position: absolute;
        left: 50%;
        top: 50%;
        transform: translate(-50%, -50%);
        display: inline-flex;
        align-items: center;
        justify-content: center;
        padding: 8px 14px;
        border-radius: 18px;
        background: rgba(255, 255, 255, 0.98);
        border: 1px solid rgba(10, 46, 107, 0.12);
        box-shadow: 0 18px 48px rgba(0, 0, 0, 0.16);
        max-width: calc(100% - 92px);
        overflow: hidden;
    }

    header.header .main-navbar-wrapper .siber-brand .logo-img {
        max-height: 68px;
        width: auto;
    }
}

/* Masaüstü: Sol üst marka wedge + büyük logo (daha geniş, soft geçiş) */
@media (min-width: 1200px) {
    .siber-bg-brand {
        width: 920px;
        height: 440px;
        background-image:
            url("../img/brand/Siber-Mimar-Logo-1.webp"),
            radial-gradient(1100px 520px at -8% -12%, rgba(255, 255, 255, 0.98) 0%, rgba(255, 255, 255, 0.98) 60%, rgba(255, 255, 255, 0.00) 82%);
        background-size: 640px auto, cover;
        background-repeat: no-repeat, no-repeat;
        background-position: 18px 40px, left top;
        border-bottom-right-radius: 240px;
        filter: none;
    }

    /* Header üstünde kalan alan: logo bölgesinde daha şeffaf → wedge beyazı net görünsün */
    .egn-utilitybar,
    header.header .main-navbar-wrapper,
    header.header .main-navbar {
        background:
            linear-gradient(to right,
                rgba(255, 255, 255, 0.00) 0%,
                rgba(255, 255, 255, 0.00) 520px,
                rgba(10, 46, 107, 0.34) 740px,
                rgba(0, 200, 83, 0.22) 100%) !important;
        /* Logo bölgesinde netlik: frosted blur logo'yu kirletmesin */
        backdrop-filter: none !important;
    }
}

/* Hero: daha slim + sade */
.siber-hero {
    background: transparent !important;
    border-bottom: 0;
}

.siber-hero--domain {
    padding-top: 32px;
    padding-bottom: 22px;
}

.siber-domain-panel {
    margin-top: 16px;
}

.siber-domain-hero__title {
    font-size: 36px;
}

@media (max-width: 767.98px) {
    .siber-domain-hero__title {
        font-size: 28px;
    }
}

/* Domain panel: arkaplan şeffaflığı azalt (arkadaki noise/gradient görünmesin) */
.siber-domain-panel .egn-domain-panel--compact {
    background: linear-gradient(180deg, rgba(10, 46, 107, 0.92), rgba(10, 46, 107, 0.84)) !important;
    border: 1px solid rgba(255, 255, 255, 0.18) !important;
    box-shadow: 0 18px 44px rgba(0, 0, 0, 0.20) !important;
    backdrop-filter: blur(8px);
}

/* =========================================================================
   SPR-029: Siber Mega Menü V4 (Her linkte görsel kart + mobil uyum)
   ========================================================================= */

header.header .main-navbar-wrapper .dropdown-menu.siber-mega-menu.siber-mega-menu--v4 {
    display: none;
    padding: 14px 14px 16px 14px;
    border-radius: 20px;

    min-width: 760px;
    width: min(940px, calc(100vw - 56px));

    max-height: calc(100vh - 160px);
    overflow: auto;
}

header.header .main-navbar-wrapper .dropdown-menu.siber-mega-menu.siber-mega-menu--v4.show {
    display: block;
}

header.header .main-navbar-wrapper .dropdown-menu.siber-mega-menu.siber-mega-menu--v4 > li {
    padding: 0;
    background: transparent;
}

header.header .main-navbar-wrapper .siber-mega-v4__head {
    padding: 2px 2px 0 2px;
    margin-bottom: 12px;
}

header.header .main-navbar-wrapper .siber-mega-v4__eyebrow {
    display: inline-flex;
    align-items: center;
    gap: 0.45rem;
    font-size: 0.78rem;
    letter-spacing: 0.02em;
    opacity: 0.95;
    padding: 0.25rem 0.55rem;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.08);
    border: 1px solid rgba(255, 255, 255, 0.18);
    width: fit-content;
}

header.header .main-navbar-wrapper .siber-mega-v4__title {
    margin-top: 0;
    margin-bottom: 6px;
    font-size: 1.15rem;
    font-weight: 500;
    color: rgba(255, 242, 194, 0.98);
}

header.header .main-navbar-wrapper .siber-mega-v4__text {
    margin-top: 0;
    max-width: 78ch;
    font-size: 0.92rem;
    color: rgba(255, 255, 255, 0.92);
    line-height: 1.45;
}

header.header .main-navbar-wrapper .siber-mega-v4__grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 12px;
}

header.header .main-navbar-wrapper .siber-mega-v4__grid--compact {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

header.header .main-navbar-wrapper .siber-mega-v4__grid--scroll {
    max-height: 340px;
    overflow: auto;
    padding-right: 6px;
}

/* Kart tasarımı: her linkte görsel anlatım */
header.header .main-navbar-wrapper a.siber-mega-card.dropdown-item {
    --siber-card-img: url("../img/mega/thumb-hizmetler.webp");

    position: relative;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    gap: 4px;

    padding: 14px !important;
    border-radius: 16px;
    min-height: 118px;

    white-space: normal;
    overflow: hidden;
    text-decoration: none;

    background: rgba(255, 255, 255, 0.08) !important;
    border: 1px solid rgba(255, 255, 255, 0.16) !important;
    color: rgba(255, 255, 255, 0.96) !important;

    transition: transform 160ms ease, box-shadow 160ms ease, border-color 160ms ease;
}

header.header .main-navbar-wrapper a.siber-mega-card.dropdown-item::before {
    content: "";
    position: absolute;
    inset: 0;
    background: var(--siber-card-img) center / cover no-repeat;
    opacity: 0.98;
    transform: scale(1.02);
}

header.header .main-navbar-wrapper a.siber-mega-card.dropdown-item::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(135deg,
        rgba(0, 0, 0, 0.62) 0%,
        rgba(10, 46, 107, 0.55) 42%,
        rgba(0, 200, 83, 0.30) 100%);
}

header.header .main-navbar-wrapper a.siber-mega-card.dropdown-item > * {
    position: relative;
    z-index: 1;
}

header.header .main-navbar-wrapper .siber-mega-card__icon {
    width: 38px;
    height: 38px;
    border-radius: 14px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: #0b2f5f;
    border: 1px solid rgba(255, 255, 255, 0.18);
    box-shadow: 0 12px 26px rgba(0, 0, 0, 0.22);
    color: rgba(255, 255, 255, 0.95);
}

header.header .main-navbar-wrapper .siber-mega-card__icon i {
    font-size: 14px;
    line-height: 1;
    text-shadow: 0 10px 18px rgba(0, 0, 0, 0.25);
}

header.header .main-navbar-wrapper .siber-mega-card__title {
    font-size: 1.02rem;
    font-weight: 500;
    margin-top: 6px;
}

header.header .main-navbar-wrapper .siber-mega-card__desc {
    font-size: 0.86rem;
    opacity: 0.92;
    line-height: 1.35;

    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

header.header .main-navbar-wrapper .siber-mega-card__chevron {
    position: absolute;
    top: 12px;
    right: 12px;
    z-index: 2;
    opacity: 0.85;
    font-size: 1.2rem;
    line-height: 1;
}

header.header .main-navbar-wrapper a.siber-mega-card.dropdown-item:hover,
header.header .main-navbar-wrapper a.siber-mega-card.dropdown-item:focus {
    transform: translateY(-2px);
    box-shadow: 0 18px 40px rgba(0, 0, 0, 0.30);
    border-color: rgba(255, 255, 255, 0.26) !important;
}

/* Thumbnail set -> kart arkaplanlari */
header.header .main-navbar-wrapper a.siber-mega-card.siber-thumb--kurumsal { --siber-card-img: url('../img/mega/thumb-kurumsal.webp'); }
header.header .main-navbar-wrapper a.siber-mega-card.siber-thumb--takim { --siber-card-img: url('../img/mega/thumb-takim.webp'); }
header.header .main-navbar-wrapper a.siber-mega-card.siber-thumb--projeler { --siber-card-img: url('../img/mega/thumb-projeler.webp'); }
header.header .main-navbar-wrapper a.siber-mega-card.siber-thumb--muzik { --siber-card-img: url('../img/mega/thumb-muzik.webp'); }
header.header .main-navbar-wrapper a.siber-mega-card.siber-thumb--blog { --siber-card-img: url('../img/mega/thumb-blog.webp'); }
header.header .main-navbar-wrapper a.siber-mega-card.siber-thumb--forum { --siber-card-img: url('../img/mega/thumb-forum.webp'); }
header.header .main-navbar-wrapper a.siber-mega-card.siber-thumb--wiki { --siber-card-img: url('../img/mega/thumb-wiki.webp'); }
header.header .main-navbar-wrapper a.siber-mega-card.siber-thumb--tasarim { --siber-card-img: url('../img/mega/thumb-tasarim.webp'); }
header.header .main-navbar-wrapper a.siber-mega-card.siber-thumb--hizmetler { --siber-card-img: url('../img/mega/thumb-hizmetler.webp'); }
header.header .main-navbar-wrapper a.siber-mega-card.siber-thumb--hosting { --siber-card-img: url('../img/mega/thumb-hosting.webp'); }
header.header .main-navbar-wrapper a.siber-mega-card.siber-thumb--vps { --siber-card-img: url('../img/mega/thumb-vps.webp'); }
header.header .main-navbar-wrapper a.siber-mega-card.siber-thumb--reseller { --siber-card-img: url('../img/mega/thumb-reseller.webp'); }
header.header .main-navbar-wrapper a.siber-mega-card.siber-thumb--transfer { --siber-card-img: url('../img/mega/thumb-transfer.webp'); }
header.header .main-navbar-wrapper a.siber-mega-card.siber-thumb--lisans { --siber-card-img: url('../img/mega/thumb-lisans.webp'); }

/* Desktop: V4 mega menuleri daha kompakt tut */
@media (min-width: 1200px) {
    header.header .main-navbar-wrapper #nav > li.siber-has-mega > ul.dropdown-menu.siber-mega-menu--v4 {
        width: min(940px, calc(100vw - 56px)) !important;
        max-width: 940px !important;
        min-width: 740px !important;
    }
}

/* Mobile: tek sutun + daha kisa kartlar */
@media (max-width: 1199.98px) {
    header.header .main-navbar-wrapper .dropdown-menu.siber-mega-menu.siber-mega-menu--v4 {
        min-width: 0;
        width: 100%;
        max-height: none;
        padding: 10px;
    }

    header.header .main-navbar-wrapper .siber-mega-v4__grid,
    header.header .main-navbar-wrapper .siber-mega-v4__grid--compact {
        grid-template-columns: 1fr;
    }

    header.header .main-navbar-wrapper a.siber-mega-card.dropdown-item {
        min-height: 86px;
        padding: 12px !important;
    }

    header.header .main-navbar-wrapper .siber-mega-card__title {
        font-size: 0.98rem;
    }
}


/* =========================================================================
   SPR-036 Header/Topbar Şeffaflık + Logo Küçültme + Sağ Alt Floating Butonlar
   - Logo üstüne gelen header/topbar katmanlarında renk/opacity hissi olmaması için:
     desktop'ta background + blur kaldırılır (tam şeffaf).
   - WhatsApp / Telefon / Destek: desktop'ta sağ altta SVG ikonlu floating butonlar.
   ========================================================================= */

@media (min-width: 1200px) {
    header.header .egn-utilitybar,
    header.header .main-navbar {
        background: transparent !important;
        border-color: transparent !important;
        backdrop-filter: none !important;
    }

    header.header .egn-utilitybar {
        border-bottom-color: transparent !important;
    }

    header.header .main-navbar-wrapper {
        background: transparent !important;
        border-bottom-color: transparent !important;
    }
}

/* Desktop sol üst marka wedge (arka plan logo) biraz daha kompakt */
@media (min-width: 1200px) {
    .siber-bg-brand {
        width: 700px;
        height: 340px;
        background-size: 520px auto, cover;
        background-position: 18px 60px, 0 0;
    }
}

/* Mobil navbar logo boyutu biraz küçült */
.siber-brand .logo-img {
    max-height: 84px;
}

@media (max-width: 1199.98px) {
    .siber-brand .logo-img {
        max-height: 78px;
    }
}

/* Desktop sağ alt floating iletişim butonları */
.siber-fab {
    position: fixed;
    right: 18px;
    bottom: 18px;
    z-index: 1200;
    display: flex;
    flex-direction: column;
    gap: 10px;
}

/*
    SPR-161: Client panel içerik alanını sabit FAB butonlarıyla çakıştırmamak için
    butonları container "gutter" alanına yaklaştır.
    - max()/calc() desteklemeyen tarayıcılar: right:18px ile devam eder.
*/
@media (min-width: 1200px) {
    .siber-fab {
        right: 18px;
    }
}

.siber-fab__btn {
    height: 44px;
    padding: 0 14px;
    border-radius: 999px;

    display: inline-flex;
    align-items: center;
    justify-content: flex-start;
    gap: 10px;

    text-decoration: none;
    /* Kullanıcı isteği: buton/link rengi her durumda beyaz, hover rengi yok */
    color: #ffffff !important;

    background: linear-gradient(180deg, rgba(10, 46, 107, 0.92), rgba(10, 46, 107, 0.82));
    border: 1px solid rgba(255, 255, 255, 0.14);
    box-shadow: 0 22px 60px rgba(0, 0, 0, 0.26);
    backdrop-filter: blur(10px);

    transition: none;
}

.siber-fab__text {
    font-size: 12.5px;
    font-weight: 800;
    letter-spacing: 0.2px;
    white-space: nowrap;
}

.siber-fab--left {
    left: 18px;
    right: auto;
    bottom: 18px;
}

.siber-fab__btn--neutral {
    background: rgba(255, 255, 255, 0.92);
    color: #1a1a1a;
    border: 1px solid rgba(0, 0, 0, 0.10);
}


/* Hover yok: sabit görünüm */
.siber-fab__btn:hover,
.siber-fab__btn:focus,
.siber-fab__btn:active,
.siber-fab__btn:visited {
    text-decoration: none;
    color: #ffffff !important;
}

.siber-fab__btn--neutral:hover,
.siber-fab__btn--neutral:focus {
    border-color: rgba(0, 0, 0, 0.18);
    box-shadow: 0 26px 70px rgba(0, 0, 0, 0.22);
}

.siber-fab__btn:focus {
    outline: 2px solid rgba(255, 255, 255, 0.78);
    outline-offset: 3px;
}

.siber-fab__btn svg {
    width: 22px;
    height: 22px;
    flex: 0 0 auto;
}


/* =========================================================================
   SPR-141: Alt Hızlı Bar (Quickbar)
   - SPR-140 sol alt dikey butonlar çok büyük bulundu.
   - İstenen: Mobil + masaüstü uyumlu, sayfa ile birlikte hareket eden alt bar.
   - Sağ alt FAB (WhatsApp/Ara/Destek) ve sol alt Tech Globe ile çakışmaması için
     masaüstünde ortalanır; mobilde sol tarafta globe alanını boş bırakarak konumlanır.
   ========================================================================= */

.siber-quickbar {
    position: fixed;
    left: 50%;
    bottom: 18px;
    transform: translateX(-50%);
    z-index: 1185;

    /* Desktop'ta tüm linkler kesilmesin diye bar biraz daha geniş.
       Sağ alt FAB ile çakışmaması için sağdan güvenli boşluk bırakılır. */
    width: min(920px, calc(100vw - 320px));
    padding: 10px;
    border-radius: 18px;

    background: linear-gradient(180deg, rgba(10, 46, 107, 0.92), rgba(10, 46, 107, 0.82));
    border: 1px solid rgba(255, 255, 255, 0.14);
    box-shadow: 0 22px 60px rgba(0, 0, 0, 0.26);
    backdrop-filter: blur(10px);
}

.siber-quickbar__inner {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    /* Desktop: tüm butonlar görünsün diye wrap (scroll ile “kesik” hissi vermesin) */
    flex-wrap: wrap;
    overflow: visible;
}

.siber-quickbar__item {
    flex: 0 0 auto;
    height: 38px;
    padding: 0 11px;
    border-radius: 999px;

    display: inline-flex;
    align-items: center;
    gap: 8px;

    /* Kullanıcı isteği: link rengi her durumda beyaz, hover rengi yok */
    color: #ffffff !important;
    text-decoration: none;
    white-space: nowrap;

    background: rgba(255, 255, 255, 0.10);
    border: 1px solid rgba(255, 255, 255, 0.12);
    transition: none;
}

.siber-quickbar__item svg {
    width: 18px;
    height: 18px;
    flex: 0 0 auto;
}

.siber-quickbar__item span {
    font-size: 12px;
    font-weight: 800;
    letter-spacing: 0.2px;
}

/* Hover yok: renk sabit beyaz kalsın */
.siber-quickbar__item:hover,
.siber-quickbar__item:focus,
.siber-quickbar__item:active,
.siber-quickbar__item:visited {
    color: #ffffff !important;
    text-decoration: none;
}

/* Focus görünürlüğü kalsın (klavye erişilebilirlik) */
.siber-quickbar__item:focus {
    outline: 2px solid rgba(255, 255, 255, 0.78);
    outline-offset: 3px;
}

/* Mobilde: alt dock üstünde konumlanır, sol globe alanını boş bırakır */
@media (max-width: 1199.98px) {
    .siber-quickbar {
        left: 124px;
        right: 10px;
        transform: none;
        width: auto;
        bottom: 92px;
        padding: 8px;
        border-radius: 16px;
        z-index: 1040;
    }

    /* Mobil: wrap devam (tüm linkler görünür), ortalı hizala */
    .siber-quickbar__inner {
        justify-content: center;
        flex-wrap: wrap;
    }

    .siber-quickbar__item {
        height: 34px;
        padding: 0 10px;
    }

    .siber-quickbar__item span {
        font-size: 11px;
    }
}

@media (max-width: 420px) {
    .siber-quickbar {
        left: 112px;
    }
}

/* Alt sabit UI'ler içerik üstüne binmesin */
@media (min-width: 1200px) {
    body {
        /* Quickbar 2 satıra çıkabildiği için içerik altında rahat pay bırak */
        padding-bottom: 140px;
    }
}

@media (max-width: 1199.98px) {
    body {
        /* Mobilde: Quickbar + mobil dock üst üste geldiği için daha fazla pay */
        padding-bottom: 220px;
    }
}

@media (prefers-reduced-motion: reduce) {
    .siber-fab__btn {
        transition: none;
    }

    .siber-fab__btn:hover,
    .siber-fab__btn:focus {
        transform: none;
    }
}


/* =========================================================================
   SPR-037: Domain Arama Hero - Ultra Slim Tek Satır
   - Homepage domain panelinde sadece ince/uzun arama satırı kalır.
   - Üst yazılar, sekmeler ve çoklu buton satırları tpl tarafında kaldırıldı.
   - Parlement mavisi daha parlak tona çekildi (CSS değişkenleri).
   ========================================================================= */

.siber-hero--domain {
    padding-top: 18px;
    padding-bottom: 12px;
}

.siber-domain-hero--slim {
    max-width: 980px;
    margin: 0 auto;
    text-align: center;
}

/* SPR-044: Domain arama üst başlık */
.siber-domain-hero__title {
    display: inline-flex;
    align-items: center;
    justify-content: center;

    margin: 0 0 16px;
    padding: 10px 22px;
    border-radius: 999px;

    font-weight: 800;
    font-size: 1.55rem;
    letter-spacing: -0.02em;

    color: rgba(255, 255, 255, 0.96);
    text-shadow: 0 10px 26px rgba(0, 0, 0, 0.26);

    background: linear-gradient(135deg, rgba(11, 62, 220, 0.22), rgba(255, 255, 255, 0.08));
    border: 1px solid rgba(255, 255, 255, 0.22);
    box-shadow: 0 18px 52px rgba(0, 0, 0, 0.22);
    backdrop-filter: blur(10px);
}

@media (max-width: 575.98px) {
    .siber-domain-hero__title {
        font-size: 1.25rem;
        padding: 9px 16px;
    }
}

.siber-domain-hero--slim .siber-domain-panel {
    margin-top: 0;
}

/* Slim wrapper: default domain panel card still exists in theme; we neutralize it here */
.siber-domain-panel .egn-domain-panel--slim {
    background: transparent;
    border: 0;
    padding: 0;
    box-shadow: none;
    border-radius: 0;
    color: inherit;
}

.siber-domain-panel .egn-domain-panel--slim .input-group {
    border-radius: 999px;
    overflow: hidden;
    background: #ffffff;
    border: 1px solid rgba(255, 255, 255, 0.32);
    box-shadow: 0 22px 60px rgba(0, 0, 0, 0.26);
}

.siber-domain-panel .egn-domain-panel--slim .form-control {
    border: 0 !important;
    background: transparent !important;
    border-radius: 0 !important;

    height: 48px;
    padding-left: 18px;
    padding-right: 12px;

    font-size: 16px;
    color: var(--egn-black) !important;
}

.siber-domain-panel .egn-domain-panel--slim .form-control::placeholder {
    color: rgba(0, 0, 0, 0.48);
}

.siber-domain-panel .egn-domain-panel--slim .form-control:focus {
    box-shadow: none !important;
    outline: none;
}

.siber-domain-panel .egn-domain-panel--slim .egn-domain-action-btn--icon {
    min-width: 54px;
    width: 54px;
    padding: 0;

    display: inline-flex;
    align-items: center;
    justify-content: center;

    border: 0;
    background: var(--egn-parliament);
}

.siber-domain-panel .egn-domain-panel--slim .egn-domain-action-btn--icon:hover,
.siber-domain-panel .egn-domain-panel--slim .egn-domain-action-btn--icon:focus {
    background: var(--egn-parliament-hover);
}

.siber-domain-panel .egn-domain-panel--slim .egn-domain-action-btn--icon:focus {
    outline: 2px solid rgba(255, 255, 255, 0.86);
    outline-offset: -2px;
}

.siber-domain-panel .egn-domain-panel--slim .egn-domain-action-btn--icon i {
    font-size: 16px;
}

@media (max-width: 767.98px) {
    .siber-hero--domain {
        padding-top: 14px;
        padding-bottom: 10px;
    }

    .siber-domain-panel .egn-domain-panel--slim .form-control {
        height: 46px;
        font-size: 15px;
        padding-left: 16px;
    }

    .siber-domain-panel .egn-domain-panel--slim .egn-domain-action-btn--icon {
        min-width: 50px;
        width: 50px;
    }
}

/* =========================================================================
   SPR-038: Header Logo Katman Fix + Domain Bar Konum + Soft Wedge Geçiş
   - Header/topbar logo üstünde turuncu katman göstermemeli; sol üst wedge net görünmeli.
   - Domain arama barı logo ile çakışmasın diye desktop'ta biraz aşağı alınır.
   - Wedge beyazdan turuncuya geçiş daha soft hale getirilir.
   ========================================================================= */

@media (min-width: 1200px) {
    /* Sol üst wedge alanında header cam yüzeyi tamamen saydam olmalı */
    header.header .egn-utilitybar,
    header.header .main-navbar,
    header.header .main-navbar-wrapper {
        background:
            linear-gradient(to right,
                rgba(255, 255, 255, 0.00) 0%,
                rgba(255, 255, 255, 0.00) 840px,
                rgba(10, 46, 107, 0.28) 1040px,
                rgba(0, 200, 83, 0.20) 100%) !important;
        border-color: transparent !important;
        backdrop-filter: none !important;
        box-shadow: none !important;
    }

    /* Bazı kurulumlarda pseudo overlay ile renk dönebiliyor → kapat */
    header.header .egn-utilitybar::before,
    header.header .main-navbar::before,
    header.header .main-navbar-wrapper::before {
        content: none !important;
    }

    /* Navbar alt çizgisi (border-bottom) logo alanında çizgi gibi görünmemeli */
    header.header .navbar-light,
    header.header .main-navbar-wrapper {
        border-bottom-color: transparent !important;
    }

    /* Sol üst marka wedge: daha küçük logo + daha yumuşak geçiş */
    .siber-bg-brand {
        width: 880px;
        height: 420px;
        opacity: 1;

        background-image:
            url("../img/brand/Siber-Mimar-Logo-1.webp"),
            radial-gradient(1120px 560px at -14% -14%,
                rgba(255, 255, 255, 0.99) 0%,
                rgba(255, 255, 255, 0.99) 56%,
                rgba(255, 255, 255, 0.78) 66%,
                rgba(255, 255, 255, 0.32) 78%,
                rgba(255, 255, 255, 0.00) 100%),
            linear-gradient(120deg,
                rgba(255, 255, 255, 0.70) 0%,
                rgba(255, 255, 255, 0.46) 42%,
                rgba(255, 255, 255, 0.00) 78%);
        background-repeat: no-repeat, no-repeat, no-repeat;
        background-size: 480px auto, cover, cover;
        background-position: 18px 16px, left top, left top;

        border-bottom-right-radius: 260px;
        filter: none;
    }

    /* Domain arama: logo ile çakışmayı azaltmak için biraz aşağı */
    .siber-domain-hero--slim {
        max-width: 1080px;
        text-align: center;
    }

    .siber-domain-hero--slim .siber-domain-panel {
        margin-top: 92px;
    }
}


/* =========================================================================
   SPR-039: Homepage - Domain Bar Altı “En Uygun Fiyatlar” Kartları
   - Her ürün grubundan en uygun başlangıç fiyatı (hook: siberHomeBestDeals)
   - Parliament / Orange / White premium kart tasarımı
   ========================================================================= */

.siber-section--deals {
    padding-top: 18px;
    padding-bottom: 18px;
}

.siber-deals {
    margin-top: 10px;
}

.siber-deals__grid {
    display: grid;
    gap: 16px;
    /* Ürün sayısına göre ortalanan premium grid */
    grid-template-columns: repeat(auto-fit, minmax(280px, 360px));
    justify-content: center;
    align-items: stretch;
}

@media (max-width: 767.98px) {
    .siber-section--deals {
        padding-top: 14px;
        padding-bottom: 14px;
    }

    /* Mobil: tek kolon + ortalanmış kartlar (yatay kaydırma yok) */
    .siber-deals__grid {
        grid-template-columns: minmax(0, 1fr);
    }

    .siber-deal-card {
        max-width: 520px;
        margin: 0 auto;
    }

    .siber-deals__toolbar {
        justify-content: center;
    }
}

.siber-deal-card {
    position: relative;
    background: rgba(255, 255, 255, 0.94);
    border: 1px solid rgba(11, 62, 220, 0.18);
    border-radius: 18px;
    padding: 16px 16px 14px;

    color: var(--egn-black);
    overflow: hidden;

    box-shadow: 0 18px 44px rgba(0, 0, 0, 0.14);

    display: flex;
    flex-direction: column;
    gap: 10px;

    scroll-snap-align: start;

    transition: transform 160ms ease, box-shadow 160ms ease, border-color 160ms ease;
}

.siber-deal-card::before {
    content: "";
    position: absolute;
    right: -26px;
    top: -26px;
    width: 140px;
    height: 140px;
    background: radial-gradient(circle at 30% 30%, rgba(0, 200, 83, 0.22), rgba(0, 200, 83, 0));
    pointer-events: none;
}

.siber-deal-card::after {
    content: "";
    position: absolute;
    left: 14px;
    right: 14px;
    top: 12px;
    height: 3px;
    border-radius: 999px;
    background: linear-gradient(90deg, var(--egn-parliament), var(--egn-orange-1));
    opacity: 0.82;
    pointer-events: none;
}

.siber-deal-card:hover,
.siber-deal-card:focus-within {
    transform: translateY(-2px);
    border-color: rgba(11, 62, 220, 0.28);
    box-shadow: 0 26px 60px rgba(0, 0, 0, 0.18);
}

.siber-deal-card__head {
    display: flex;
    align-items: flex-start;
    gap: 12px;
}

.siber-deal-card__icon {
    width: 46px;
    height: 46px;
    border-radius: 16px;
    display: inline-flex;
    align-items: center;
    justify-content: center;

    background: linear-gradient(135deg, var(--egn-parliament), var(--egn-orange-1));
    border: 1px solid rgba(255, 255, 255, 0.24);

    box-shadow: 0 16px 34px rgba(11, 62, 220, 0.18);
    flex: 0 0 auto;
}

.siber-deal-card__icon i {
    font-size: 18px;
}

.siber-deal-card__group {
    font-size: 12px;
    font-weight: 500;
    letter-spacing: 0.02em;
    text-transform: uppercase;
    color: rgba(11, 62, 220, 0.92);
    line-height: 1.2;

    /* SPR-047: Grup basligi uzasa bile kart ic duzeni bozulmasin */
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    word-break: break-word;
}

.siber-deal-card__name {
    font-weight: 500;
    font-size: 15px;
    color: rgba(0, 0, 0, 0.86);
    line-height: 1.35;

    /* SPR-047: Urun adi 1-2 satirda sabit kalsin, diger alanlari itmesin */
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    min-height: 2.7em;
}

.siber-deal-card__price {
    display: flex;
    align-items: baseline;
    flex-wrap: nowrap;
    gap: 6px;

    /* SPR-047: Fiyat/unite sarmalamasin, kart icinde satir kaymasi olmasin */
    white-space: nowrap;
    overflow: hidden;
    min-width: 0;
}

.siber-deal-card__from {
    font-size: 12px;
    color: rgba(0, 0, 0, 0.62);
}

.siber-deal-card__value {
    font-size: 22px;
    font-weight: 600;
    line-height: 1;

    font-variant-numeric: tabular-nums;
    white-space: nowrap;

    background-image: linear-gradient(90deg, var(--egn-parliament), var(--egn-orange-1));
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
}

.siber-deal-card__unit {
    font-size: 13px;
    color: rgba(0, 0, 0, 0.70);

    white-space: nowrap;
}

.siber-deal-card__meta {
    font-size: 12px;
    color: rgba(0, 0, 0, 0.62);

    /* SPR-047: Meta uzunlugu/layout kaymasi kontrolu */
    line-height: 1.4;
    min-height: 1.4em;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.siber-deal-card__meta.is-empty {
    /* Alan sabit kalsin ama gorunmesin */
    visibility: hidden;
}

.siber-deal-card__actions {
    margin-top: auto;
    display: flex;
    gap: 10px;
}

.siber-deal-card__actions .btn {
    border-radius: 999px;
    padding-left: 14px;
    padding-right: 14px;
}

.siber-deal-card__actions .btn-outline-primary {
    border-color: rgba(11, 62, 220, 0.26);
}

.siber-deal-card__actions .btn-outline-primary:hover,
.siber-deal-card__actions .btn-outline-primary:focus {
    border-color: rgba(11, 62, 220, 0.42);
}




/* =========================================================================
   SPR-045: Homepage - Kategori Vitrini (Görselli / Otomatik)
   - WHMCS product group listesi; ürün sayısına göre ortalanan responsive grid
   - Kartlar: görsel arkaplan + parliament/orange overlay + okunaklı içerik
   ========================================================================= */

.siber-section--category-showcase {
    padding-top: 10px;
    padding-bottom: 22px;
}

.siber-cat-grid {
    display: grid;
    gap: 16px;

    /* Ürün sayısına göre otomatik kolon + ortalanma */
    grid-template-columns: repeat(auto-fit, minmax(260px, 340px));
    justify-content: center;
    align-items: stretch;
}

@media (max-width: 767.98px) {
    .siber-section--category-showcase {
        padding-top: 6px;
        padding-bottom: 18px;
    }

    .siber-cat-grid {
        grid-template-columns: minmax(0, 1fr);
    }

    .siber-cat-card {
        max-width: 560px;
        margin: 0 auto;
    }

    .siber-cat-card__text {
        max-width: none;
    }
}

.siber-cat-card {
    position: relative;
    display: block;
    min-height: 210px;
    border-radius: 18px;
    overflow: hidden;

    background: rgba(255, 255, 255, 0.92);
    border: 1px solid rgba(11, 62, 220, 0.16);
    box-shadow: 0 18px 44px rgba(0, 0, 0, 0.14);

    color: rgba(0, 0, 0, 0.86);
    text-decoration: none;

    transition: transform 160ms ease, box-shadow 160ms ease, border-color 160ms ease;
}

.siber-cat-card:hover,
.siber-cat-card:focus-within {
    transform: translateY(-2px);
    border-color: rgba(11, 62, 220, 0.26);
    box-shadow: 0 26px 60px rgba(0, 0, 0, 0.18);
    text-decoration: none;
}

.siber-cat-card__media {
    position: absolute;
    inset: 0;
    background-size: cover;
    background-position: center;
    transform: scale(1.04);
    filter: saturate(1.04) contrast(1.03);
}

.siber-cat-card::before {
    content: "";
    position: absolute;
    inset: 0;

    /* Premium overlay: parliament -> orange soft */
    background:
        radial-gradient(560px 280px at 20% 20%, rgba(11, 62, 220, 0.48) 0%, rgba(11, 62, 220, 0.18) 48%, rgba(11, 62, 220, 0.00) 72%),
        radial-gradient(540px 260px at 80% 0%, rgba(0, 200, 83, 0.42) 0%, rgba(0, 200, 83, 0.00) 70%),
        linear-gradient(135deg, rgba(11, 62, 220, 0.18) 0%, rgba(0, 200, 83, 0.12) 56%, rgba(255, 255, 255, 0.00) 100%);
    pointer-events: none;
}

.siber-cat-card::after {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    height: 64%;
    background: linear-gradient(to top, rgba(255, 255, 255, 0.98) 0%, rgba(255, 255, 255, 0.74) 46%, rgba(255, 255, 255, 0.00) 100%);
    pointer-events: none;
}

.siber-cat-card__content {
    position: relative;
    z-index: 1;
    display: flex;
    flex-direction: column;
    gap: 8px;
    padding: 16px 16px 14px;
    min-height: 210px;
    justify-content: flex-end;
}

.siber-cat-card__title {
    font-size: 16px;
    font-weight: 600;
    letter-spacing: 0.01em;
    color: rgba(11, 62, 220, 0.95);
}

.siber-cat-card__text {
    font-size: 13px;
    line-height: 1.45;
    color: rgba(0, 0, 0, 0.72);
    max-width: 36ch;
}

.siber-cat-card__cta {
    margin-top: 2px;
    font-size: 13px;
    font-weight: 600;
    display: inline-flex;
    align-items: center;
    gap: 8px;

    background-image: linear-gradient(90deg, var(--egn-parliament), var(--egn-orange-1));
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
}

.siber-cat-card__cta i {
    color: rgba(0, 0, 0, 0.55);
}



/* =========================================================================
   SPR-040: Desktop Header Base Background Fix (Brand Wedge Görünürlüğü)
   - Masaüstünde header'ın kendi arkaplanı (ve olası overlay katmanları)
     sol üst marka wedge'in (siber-bg-brand) üstünü kapatmamalı.
   - Logo üzerinde gelen kısımda renk/katman/blur olmamalı; arkaplan logo
     net görünmelidir.
   ========================================================================= */

@media (min-width: 1200px) {
    /* Bazı sprintlerde header kabuğu "tam turuncu" boyandığı için,
       wedge alanı görünmüyordu. Header'ın kendi zeminini tamamen saydamla. */
    header#header.header {
        background: transparent !important;
        background-color: transparent !important;
        box-shadow: none !important;
    }

    header#header.header::before,
    header#header.header::after {
        content: none !important;
    }

    /* Header iç barları da desktop'ta saydam olmalı (wedge üstü temiz). */
    header#header.header .egn-utilitybar,
    header#header.header .main-navbar,
    header#header.header .main-navbar-wrapper {
        background: transparent !important;
        background-color: transparent !important;
        border-color: transparent !important;
        box-shadow: none !important;
        backdrop-filter: none !important;
    }

    header#header.header .egn-utilitybar::before,
    header#header.header .egn-utilitybar::after,
    header#header.header .main-navbar::before,
    header#header.header .main-navbar::after,
    header#header.header .main-navbar-wrapper::before,
    header#header.header .main-navbar-wrapper::after {
        content: none !important;
    }
}

/* =========================================================================
   SPR-042: Header Çizgi Temizliği + Brand Wedge Scroll + Soft Geçiş + Deals Aylık/Yıllık
   - Header altında görünen ince çizgi (border/shadow) kaldırılır.
   - Sol üst marka wedge (arka plan logo) artık fixed değil; scroll ile sayfadan çıkar.
   - Wedge beyaz -> turuncu geçişi (alt/sağ) daha soft hale getirilir.
   - Domain arama satırı biraz aşağı alınır; logo biraz daha küçültülür.
   - “En Uygun Fiyatlar” kartlarında Aylık/Yıllık fiyat değiştirilebilir (varsayılan: Yıllık).
   ========================================================================= */

/* Header altında ince çizgi: border/shadow temizle */
header.header .navbar-light,
header.header .main-navbar-wrapper,
header.header .main-navbar,
header.header .egn-utilitybar,
header.header .topbar {
    border-bottom: 0 !important;
    box-shadow: none !important;
}

/* İçerik başlangıcındaki border çizgisini kaldır (header altı çizgi gibi görünüyordu) */
#main-body {
    border-top: 0 !important;
}

@media (min-width: 1200px) {
    /* Sol üst marka wedge: scroll ile kaybolmalı (fixed olmayacak) */
    .siber-bg-brand {
        position: absolute !important;
        top: 0;
        left: 0;
        z-index: 0;

        /* Boyutlar: logo biraz daha küçük, daha iyi boşluk */
        width: 760px;
        height: 380px;

        /* Soft geçiş: alt/sağ kenarlarda sert çizgi bırakma */
        background-image:
            url("../img/brand/Siber-Mimar-Logo-1.webp"),
            radial-gradient(980px 520px at 18% 18%, rgba(255, 255, 255, 0.98) 0%, rgba(255, 255, 255, 0.96) 48%, rgba(255, 255, 255, 0.62) 64%, rgba(255, 255, 255, 0.20) 74%, rgba(255, 255, 255, 0.00) 84%),
            radial-gradient(760px 420px at 30% 86%, rgba(255, 255, 255, 0.52) 0%, rgba(255, 255, 255, 0.18) 46%, rgba(255, 255, 255, 0.00) 76%),
            linear-gradient(to right, rgba(255, 255, 255, 0.90) 0%, rgba(255, 255, 255, 0.84) 42%, rgba(255, 255, 255, 0.45) 62%, rgba(255, 255, 255, 0.00) 84%);
        background-repeat: no-repeat, no-repeat, no-repeat, no-repeat;
        background-size: 500px auto, cover, cover, cover;
        background-position: 18px 74px, 0 0, 0 0, 0 0;

        opacity: 0.985;
        filter: none;
        border-bottom-right-radius: 320px;
        pointer-events: none;
    }

    /* Domain arama: biraz daha aşağı */
    .siber-home .siber-hero--domain {
        padding-top: 44px;
    }

    .siber-home .siber-domain-panel {
        margin-top: 40px;
    }
}

/* “En Uygun Fiyatlar” toolbar (toggle) */
.siber-deals__toolbar {
    display: flex;
    justify-content: flex-end;
    margin: 10px 0 14px;
}

/* Deals: Aylık/Yıllık görünüm */
.siber-deal-card__value--monthly,
.siber-deal-card__unit--monthly,
.siber-deal-card__value--annually,
.siber-deal-card__unit--annually {
    display: inline;
}

.siber-deals[data-cycle="annually"] .siber-deal-card__value--monthly,
.siber-deals[data-cycle="annually"] .siber-deal-card__unit--monthly {
    display: none;
}

.siber-deals[data-cycle="monthly"] .siber-deal-card__value--annually,
.siber-deals[data-cycle="monthly"] .siber-deal-card__unit--annually {
    display: none;
}



/* =========================================================================
   SPR-043: Brand Wedge %30 Küçültme + Geçişi Tam Soft + Mobile Header/Popup Menu
   - Masaüstü: sol üst marka wedge (logo + beyaz alan) ~%30 küçült, logoyu daha yukarı/sola al.
   - Beyaz→turuncu geçişi: tüm kenarlarda gradient/efektli yumuşak geçiş (keskin bitiş yok).
   - Domain arama / gövde biraz daha aşağı alınır (logo görünümü etkilenmez).
   - Mobil: header alanı üstten logo bitimine kadar beyaz; beyaz→turuncu geçiş soft.
   - Mobil: logo %30 büyük ve ortalanmış; hamburger menü popup olarak ortada açılır.
   ========================================================================= */

/* Menü/modal açıkken body scroll kilidi (JS ile class eklenir) */
body.siber-menu-open,
body.siber-sheet-open {
    overflow: hidden;
}

@media (min-width: 1200px) {
    /* Eski arkaplan image/gradient kombinlerini iptal edip pseudo ile soft blur geçiş uygula */
    .siber-bg-brand {
        position: absolute !important;
        top: 0;
        left: 0;

        /* ~%30 küçült (SPR-042 wedge'e göre) */
        width: 540px;
        height: 270px;

        display: block;
        z-index: 0;
        pointer-events: none;

        background: none !important;
        background-image: none !important;
        filter: none !important;
        opacity: 1;
        border-radius: 0;
        overflow: visible;
    }

    /* Soft geçiş katmanı (blur) */
    .siber-bg-brand::before {
        content: "";
        position: absolute;
        /* SPR-044: beyaz alan altı kısalt + sağa doğru biraz uzat */
        inset: -72px -148px -46px -72px;
        pointer-events: none;

        /* Tam yumuşak fade: 100%'de 0 opaklık (sert bitiş yok) */
        background:
            radial-gradient(860px 300px at 18% 14%, rgba(255, 255, 255, 0.985) 0%, rgba(255, 255, 255, 0.94) 34%, rgba(255, 255, 255, 0.58) 60%, rgba(255, 255, 255, 0.22) 78%, rgba(255, 255, 255, 0.00) 100%),
            radial-gradient(620px 240px at 34% 62%, rgba(255, 255, 255, 0.26) 0%, rgba(255, 255, 255, 0.12) 54%, rgba(255, 255, 255, 0.00) 100%),
            linear-gradient(to right, rgba(255, 255, 255, 0.86) 0%, rgba(255, 255, 255, 0.68) 50%, rgba(255, 255, 255, 0.30) 82%, rgba(255, 255, 255, 0.00) 100%);
        filter: blur(18px);
        transform: scale(1.02);
        opacity: 1;
    }

    /* Logo katmanı (net) */
    .siber-bg-brand::after {
        content: "";
        position: absolute;
        inset: 0;
        pointer-events: none;

        background-image: url("../img/brand/Siber-Mimar-Logo-1.webp");
        background-repeat: no-repeat;
        background-size: 350px auto; /* 500px → 350px (~%30 küçült) */
        background-position: 8px 14px; /* daha yukarı + sol */
        opacity: 1;
    }

    /* Domain arama + sayfa gövdesi biraz daha aşağı */
    .siber-home .siber-hero--domain {
        padding-top: 78px;
    }

    .siber-home .siber-domain-panel {
        margin-top: 74px;
    }
}

@media (max-width: 1199.98px) {
    /* Mobil header tamamen beyaz; altta soft geçiş */
    header#header.header {
        background: rgba(255, 255, 255, 0.98) !important;
        position: relative;
    }

    header#header.header::after {
        content: "";
        position: absolute;
        left: 0;
        right: 0;
        bottom: -1px;
        height: 44px;
        pointer-events: none;
        background: linear-gradient(to bottom, rgba(255, 255, 255, 1) 0%, rgba(255, 255, 255, 0.92) 42%, rgba(255, 255, 255, 0.00) 100%);
    }

    /* Mobilde iç barlar renk vermesin */
    header#header.header .main-navbar,
    header#header.header .main-navbar-wrapper {
        background: transparent !important;
        background-color: transparent !important;
        border-color: transparent !important;
        box-shadow: none !important;
        backdrop-filter: none !important;
    }

    /* Mobil header yüksekliği (logo absolute olduğu için taşma yapmasın) */
    header#header.header {
        --siber-mob-header-h: 104px;
    }

    /* Logo: %30 daha büyük + ortalı, beyaz çerçevesiz */
    header.header .main-navbar-wrapper {
        min-height: var(--siber-mob-header-h);
    }

    header.header .main-navbar-wrapper .siber-brand {
        position: absolute;
        left: 50% !important;
        top: 50% !important;
        transform: translate(-50%, -50%) !important;
        z-index: 2;

        padding: 0 !important;
        margin: 0 !important;
        border-radius: 0 !important;
        background: transparent !important;
        border: 0 !important;
        box-shadow: none !important;
        max-width: calc(100% - 120px);
        overflow: visible !important;
    }

    header.header .main-navbar-wrapper .siber-brand .logo-img {
        max-height: 90px !important; /* 68px → ~%30 büyüt */
        width: auto;
        height: auto;
        filter: drop-shadow(0 14px 28px rgba(0, 0, 0, 0.16));
    }

    /* Hamburger (toggler) beyaz zeminde koyu görünsün */
    header.header .toolbar .nav-link,
    header.header .toolbar .nav-link .fa-bars {
        color: rgba(10, 46, 107, 0.96) !important;
    }

    /* Mobil Menü: popup (center) + FULLPAGE backdrop
       Not: Bootstrap collapse açılırken `.collapsing` sınıfı ile yukarıdan aşağı animasyon yapar.
       İstek: Header şekli bozulmasın, menü direkt sayfanın ortasında odaklı açılsın.
    */
    #mainNavbar.collapse.show,
    #mainNavbar.collapsing {
        position: fixed !important;
        left: 0;
        right: 0;
        top: 0;
        bottom: 0;
        z-index: 3050;

        display: flex !important;
        align-items: center;
        justify-content: center;
        padding: 18px 14px 24px;

        background: rgba(0, 0, 0, 0.72);
    }

    /* collapse animasyonunda header'ın aşağı uzamasını engelle */
    #mainNavbar.collapsing {
        height: auto !important;
        transition: none !important;
    }

    #mainNavbar.collapse.show > #nav,
    #mainNavbar.collapsing > #nav {
        width: min(92vw, 440px);
        max-height: 74vh;
        overflow: auto;
        margin: 0;

        padding: 14px 12px;
        border-radius: 18px;
        border: 1px solid rgba(11, 62, 220, 0.14);
        background: linear-gradient(180deg, rgba(255, 255, 255, 0.98) 0%, rgba(255, 255, 255, 0.94) 100%);
        box-shadow: 0 22px 60px rgba(0, 0, 0, 0.28);
    }

    #mainNavbar.collapse.show > #nav .nav-item,
    #mainNavbar.collapsing > #nav .nav-item {
        margin: 2px 0;
    }

    #mainNavbar.collapse.show > #nav .nav-link,
    #mainNavbar.collapsing > #nav .nav-link {
        color: rgba(10, 46, 107, 0.96) !important;
        border-radius: 12px;
        padding: 12px 14px;
    }

    #mainNavbar.collapse.show > #nav .nav-link:hover,
    #mainNavbar.collapse.show > #nav .nav-link:focus,
    #mainNavbar.collapsing > #nav .nav-link:hover,
    #mainNavbar.collapsing > #nav .nav-link:focus {
        background: rgba(11, 62, 220, 0.08) !important;
        color: rgba(10, 46, 107, 1) !important;
    }

    /* Dropdown'lar mobil popup içinde daha temiz dursun */
    #mainNavbar.collapse.show > #nav .dropdown-menu,
    #mainNavbar.collapsing > #nav .dropdown-menu {
        position: static !important;
        float: none !important;
        display: none;
        background: transparent !important;
        border: 0 !important;
        box-shadow: none !important;
        padding: 0 0 0 12px;
        margin: 6px 0 4px;
    }

    #mainNavbar.collapse.show > #nav .dropdown.show > .dropdown-menu,
    #mainNavbar.collapsing > #nav .dropdown.show > .dropdown-menu {
        display: block;
    }

    #mainNavbar.collapse.show > #nav .dropdown-item,
    #mainNavbar.collapsing > #nav .dropdown-item {
        color: rgba(10, 46, 107, 0.92) !important;
        border-radius: 10px;
        padding: 10px 12px;
    }

    #mainNavbar.collapse.show > #nav .dropdown-item:hover,
    #mainNavbar.collapse.show > #nav .dropdown-item:focus,
    #mainNavbar.collapsing > #nav .dropdown-item:hover,
    #mainNavbar.collapsing > #nav .dropdown-item:focus {
        background: rgba(0, 200, 83, 0.12) !important;
        color: rgba(10, 46, 107, 1) !important;
    }
}

/* =====================================================================
   SPR-146: Mobil Hesabım menüsü -> modal/sheet
   - Mobilde bootstrap dropdown yerine sayfa ortasında odaklı panel.
   - Sepet/Bildirim/FAB gibi sabit ikonların ÜSTÜNDE açılmalı.
   ===================================================================== */

.siber-sheet-backdrop {
    position: fixed;
    inset: 0;
    background: rgba(0, 0, 0, 0.72);
    z-index: 3060;
    display: none;
}

.siber-sheet {
    position: fixed;
    inset: 0;
    z-index: 3070;
    display: none;
    align-items: center;
    justify-content: center;
    padding: 18px 14px 24px;
}

.siber-sheet.is-open,
.siber-sheet-backdrop.is-open {
    display: flex;
}

.siber-sheet-backdrop.is-open {
    display: block;
}

.siber-sheet__panel {
    width: min(92vw, 420px);
    max-height: 80vh;
    overflow: auto;
    border-radius: 18px;
    border: 1px solid rgba(255, 255, 255, 0.16);
    background: linear-gradient(180deg, rgba(10, 46, 107, 0.98), rgba(10, 46, 107, 0.92));
    box-shadow: 0 28px 72px rgba(0, 0, 0, 0.34);
}

.siber-sheet__header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    padding: 12px 14px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.12);
}

.siber-sheet__title {
    font-weight: 900;
    letter-spacing: 0.2px;
    color: #ffffff;
}

.siber-sheet__close {
    width: 38px;
    height: 38px;
    border-radius: 12px;
    border: 1px solid rgba(255, 255, 255, 0.16);
    background: rgba(255, 255, 255, 0.08);
    color: #ffffff;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0;
    line-height: 1;
}

.siber-sheet__body {
    padding: 10px 10px 14px;
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.siber-sheet__link,
.siber-sheet__link:hover,
.siber-sheet__link:focus,
.siber-sheet__link:active,
.siber-sheet__link:visited {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    padding: 12px 12px;
    border-radius: 14px;
    color: #ffffff !important;
    text-decoration: none !important;
    background: rgba(255, 255, 255, 0.06);
    border: 1px solid rgba(255, 255, 255, 0.12);
    transition: none;
}

.siber-sheet__divider {
    height: 1px;
    background: rgba(255, 255, 255, 0.14);
    margin: 6px 4px;
}

/* Mobil topbar Hesabım butonu: beyaz, hover yok */
.siber-account-openbtn,
.siber-account-openbtn:hover,
.siber-account-openbtn:focus,
.siber-account-openbtn:active {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    color: #ffffff !important;
    text-decoration: none !important;
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
    transition: none !important;
    white-space: nowrap;
}


/* =========================================================================
   SPR-046: Homepage UI İnce Ayarları
   - Brand wedge (logo beyaz alan): biraz daralt + sağ alt köşeyi daha oval yap,
     turuncu alanı daha fazla göster (keskin dikdörtgen hissi olmasın).
   - "Sitenin Adresini Bul!" başlığı: arkaplan çerçeve kaldır + arama alanı yaklaştır.
   - Deals grid: daraltma yok, satır kırıldığında alttaki kartlar da yatayda ortalansın.
   - "Çözümlerimizi Keşfedin" grid: aynı ortalama mantığı + okunaklı kart tasarımı.
   - Kategori görselleri: havuz 12'ye çıktı (hook tarafı) -> tekrar eden görsel yok.
   ========================================================================= */

@media (min-width: 1200px) {
    /* Beyaz alanı biraz daralt + daha oval sağ alt köşe */
    .siber-bg-brand::before {
        /* önceki: inset: -72px -148px -46px -72px; */
        inset: -62px -112px -26px -62px;
        border-radius: 0 360px 560px 0;

        /* Düz çizgi hissini azalt: linear yerine daha çok radial kullan */
        background:
            radial-gradient(860px 300px at 18% 14%, rgba(255, 255, 255, 0.985) 0%, rgba(255, 255, 255, 0.94) 36%, rgba(255, 255, 255, 0.52) 60%, rgba(255, 255, 255, 0.18) 78%, rgba(255, 255, 255, 0.00) 100%),
            radial-gradient(620px 260px at 36% 66%, rgba(255, 255, 255, 0.22) 0%, rgba(255, 255, 255, 0.10) 56%, rgba(255, 255, 255, 0.00) 100%),
            radial-gradient(760px 420px at 78% 34%, rgba(255, 255, 255, 0.26) 0%, rgba(255, 255, 255, 0.08) 52%, rgba(255, 255, 255, 0.00) 78%);

        filter: blur(18px);
        transform: scale(1.01);
    }
}

/* "Sitenin Adresini Bul!" başlığı: çerçevesiz (sadece metin) */
.siber-domain-hero__title {
    background: none;
    border: 0;
    box-shadow: none;
    backdrop-filter: none;

    padding: 0;
    border-radius: 0;
    display: block;

    margin: 0 0 10px;
}

/* Arama alanını başlığa yaklaştır */
.siber-domain-hero--slim .siber-domain-panel {
    margin-top: 8px;
}

@media (min-width: 1200px) {
    /* Desktop: logo ile çakışmadan, başlık + arama birbirine yakın dursun */
    .siber-home .siber-domain-panel {
        margin-top: 12px;
    }

    .siber-home .siber-hero--domain {
        padding-top: 86px;
    }
}

/* Deals grid: last-row ortalama + daraltma yok */
.siber-deals__grid {
    display: flex;
    flex-wrap: wrap;
    gap: 16px;
    justify-content: center;
    align-items: stretch;
}

.siber-deal-card {
    flex: 0 1 270px;
    max-width: 360px;
}

@media (max-width: 767.98px) {
    .siber-deals__grid {
        flex-direction: column;
    }

    .siber-deal-card {
        flex: 1 1 auto;
        max-width: 520px;
        width: 100%;
    }
}

/* Category showcase grid: aynı ortalama mantığı */
.siber-cat-grid {
    display: flex;
    flex-wrap: wrap;
    gap: 16px;
    justify-content: center;
    align-items: stretch;
}

.siber-cat-card {
    flex: 0 1 280px;
    max-width: 360px;

    min-height: auto;
    display: flex;
    flex-direction: column;
}

@media (max-width: 767.98px) {
    .siber-cat-card {
        flex: 1 1 100%;
        max-width: 560px;
        width: 100%;
    }
}

/* Eski overlay katmanlarını kapat (yazı okunurluğu) */
.siber-cat-card::before,
.siber-cat-card::after {
    content: none;
}

/* Görsel: artık kartın üst kısmında ayrı blok -> yazılar görselin üstüne binmez */
.siber-cat-card__media {
    position: relative;
    inset: auto;
    display: block;
    width: 100%;
    height: 170px;

    background-size: cover;
    background-position: center;

    transform: none;
    filter: saturate(1.05) contrast(1.04);
}

.siber-cat-card__media::after {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;

    /* Tema uyumlu soft overlay */
    background:
        radial-gradient(560px 280px at 20% 20%, rgba(11, 62, 220, 0.32) 0%, rgba(11, 62, 220, 0.00) 72%),
        radial-gradient(520px 260px at 86% 0%, rgba(0, 200, 83, 0.26) 0%, rgba(0, 200, 83, 0.00) 70%),
        linear-gradient(135deg, rgba(11, 62, 220, 0.10) 0%, rgba(0, 200, 83, 0.10) 56%, rgba(255, 255, 255, 0.00) 100%);
}

.siber-cat-card__content {
    position: relative;
    z-index: 1;

    min-height: auto;
    padding: 14px 16px 16px;
    justify-content: flex-start;

    background: #ffffff;
    border-top: 1px solid rgba(11, 62, 220, 0.10);
}

.siber-cat-card__title {
    font-size: 15px;
}


/* =========================================================================
   SPR-048: "En Uygun Fiyatlar" kartları - premium sabit kolon düzeni
   - Amaç: Başlık/fiyat/meta uzunluğu kart içi hizalamayı bozmasın.
   - Desktop'ta kart içi alanlar: Başlık (sol) | Fiyat (sağ) + Meta + CTA
   ========================================================================= */

@media (min-width: 992px) {
    .siber-deal-card {
        display: grid;
        grid-template-columns: minmax(0, 1fr) minmax(96px, 44%);
        grid-template-areas:
            "head head"
            "name price"
            "meta meta"
            ". ."
            "actions actions";
        grid-template-rows: auto auto auto 1fr auto;
        gap: 10px 14px;
    }

    .siber-deal-card__head {
        grid-area: head;
    }

    .siber-deal-card__name {
        grid-area: name;
    }

    .siber-deal-card__price {
        grid-area: price;

        /* Fiyat bloğunu sabit ve hizalı tut */
        display: grid;
        grid-template-columns: auto auto;
        grid-template-areas:
            "from from"
            "value unit";
        justify-content: end;
        align-content: start;
        gap: 2px 6px;

        white-space: nowrap;
        overflow: hidden;
        min-width: 0;
        text-align: right;
    }

    .siber-deal-card__from {
        grid-area: from;
        justify-self: end;
    }

    /* Aylık/Yıllık değerler aynı alanda; görünür olan yerleşir */
    .siber-deal-card__value--monthly,
    .siber-deal-card__value--annually {
        grid-area: value;
        justify-self: end;
    }

    .siber-deal-card__unit--monthly,
    .siber-deal-card__unit--annually {
        grid-area: unit;
        align-self: end;
    }

    .siber-deal-card__meta {
        grid-area: meta;
    }

    .siber-deal-card__actions {
        grid-area: actions;

        /* CTA alanı: solda "Detaylar", sağda "Seç" (DOM sırası bozulmadan) */
        display: grid;
        grid-template-columns: 1fr auto;
        align-items: center;
        column-gap: 12px;
    }

    .siber-deal-card__actions > a:nth-child(1) {
        /* 1. link: Seç -> sağa */
        grid-column: 2;
        justify-self: end;
    }

    .siber-deal-card__actions > a:nth-child(2) {
        /* 2. link: Detaylar -> sola */
        grid-column: 1;
        justify-self: start;
    }


    /* =========================================================================
       SPR-049: Deals - fiyat kolonu breakpoint/ölçek optimizasyonu
       - Amaç: 6 kart/tek satır gibi dar kart senaryolarında fiyat kırpılmasın.
       - Modern tarayıcılarda container query ile kart genişliğine göre ölçekleme yapılır.
       ========================================================================= */

    @supports (container-type: inline-size) {
        .siber-deal-card {
            /* Kart genişliğine göre ölçekleme (cqw) için konteyner */
            container-type: inline-size;
        }

        /* Fiyat değeri kart genişliğine göre otomatik küçülür/büyür */
        .siber-deal-card__value {
            font-size: clamp(18px, 7cqw, 22px);
        }

        .siber-deal-card__unit {
            font-size: clamp(11px, 4cqw, 13px);
        }

        /* Kart daraldığında üniteyi alt satıra al (kırpma olmasın) */
        @container (max-width: 320px) {
            .siber-deal-card__price {
                grid-template-columns: 1fr;
                grid-template-areas:
                    "from"
                    "value"
                    "unit";
                justify-content: end;
                text-align: right;
            }

            .siber-deal-card__from {
                justify-self: end;
            }

            .siber-deal-card__value--monthly,
            .siber-deal-card__value--annually {
                /* TRY gibi uzayan formatlarda kontrollü satır kırılımına izin ver */
                white-space: normal;
                overflow-wrap: anywhere;
                line-height: 1.05;
                text-align: right;
            }

            .siber-deal-card__unit--monthly,
            .siber-deal-card__unit--annually {
                justify-self: end;
            }
        }
    }
}

/* =========================================================================
   SPR-052: Homepage - Bölüm Ritmi + Derli Toplu Premium Görünüm (Spacing/Typo)
   - Amaç: Hero → Deals → Kategori vitrini → Feature → CTA akışında
     daha kontrollü max-width, daha dengeli padding ve tutarlı section head.
   - Scope: sadece .siber-home (diğer sayfalara sızmamalı)
   ========================================================================= */

/* Homepage: daha premium bir okuma genişliği (global full-width kuralını sadece home'da daralt) */
@media (min-width: 992px) {
    .siber-home .container {
        max-width: 1320px !important;
    }
}

@media (min-width: 1400px) {
    .siber-home .container {
        max-width: 1380px !important;
    }
}

/* Dikey ritim: home sayfasında bölüm padding standardı */
.siber-home .siber-section {
    padding: 56px 0;
}

@media (max-width: 767.98px) {
    .siber-home .siber-section {
        padding: 44px 0;
    }
}

/* Deals ve Kategori vitrini: hero sonrası daha sıkı ama nefesli */
.siber-home .siber-section--deals {
    padding-top: 18px;
    padding-bottom: 48px;
}

.siber-home .siber-section--category-showcase {
    padding-top: 0;
    padding-bottom: 56px;
}

@media (max-width: 767.98px) {
    .siber-home .siber-section--deals {
        padding-top: 14px;
        padding-bottom: 40px;
    }

    .siber-home .siber-section--category-showcase {
        padding-bottom: 44px;
    }
}

/* Section head: başlık + açıklama hiyerarşisi */
.siber-home .siber-section__title {
    font-size: clamp(22px, 2.4vw, 30px);
    line-height: 1.12;
    letter-spacing: -0.012em;
}

.siber-home .siber-section__lead {
    max-width: 72ch;
    line-height: 1.55;
}

.siber-section__head {
    margin-bottom: 18px;
}

.siber-section__head--split {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-end;
    justify-content: space-between;
    gap: 14px 18px;
}

.siber-section__head--split .siber-section__head-text {
    max-width: 62ch;
}

.siber-section__head--center {
    text-align: center;
    max-width: 980px;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 18px;
}

/* Home panel: bölümleri toparlayan cam yüzey */
.siber-home-panel {
    position: relative;
    overflow: hidden;

    background: #0b2f5f;
    border: 1px solid rgba(255, 255, 255, 0.14);
    border-radius: 24px;
    padding: 22px;

    box-shadow: 0 24px 60px rgba(0, 0, 0, 0.18);
    backdrop-filter: blur(10px);
}

.siber-home-panel::before {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;

    background:
        radial-gradient(680px 360px at 18% 0%, rgba(255, 255, 255, 0.18) 0%, rgba(255, 255, 255, 0.00) 68%),
        radial-gradient(720px 420px at 86% 12%, rgba(11, 62, 220, 0.14) 0%, rgba(11, 62, 220, 0.00) 72%),
        radial-gradient(720px 420px at 82% 88%, rgba(0, 200, 83, 0.18) 0%, rgba(0, 200, 83, 0.00) 66%);
    opacity: 0.95;
}

.siber-home-panel > * {
    position: relative;
    z-index: 1;
}

@media (max-width: 767.98px) {
    .siber-home-panel {
        border-radius: 18px;
        padding: 16px;
    }
}

/* Panel içi bootstrap row gutter kontrolü (negatif margin taşmasını azaltır) */
.siber-home-panel .row {
    margin-left: -10px;
    margin-right: -10px;
}

.siber-home-panel .row > [class^="col-"],
.siber-home-panel .row > [class*=" col-"] {
    padding-left: 10px;
    padding-right: 10px;
}

/* Deals panel: toolbar sağda, mobilde ortada */
.siber-home-panel--deals .siber-deals__toolbar {
    display: flex;
    justify-content: flex-end;
}

@media (max-width: 767.98px) {
    .siber-home-panel--deals .siber-deals__toolbar {
        justify-content: center;
        width: 100%;
    }

    .siber-home-panel--deals .siber-section__head--split {
        align-items: center;
    }
}

/* Kategori vitrini paneli: kartlar panel içinde daha dengeli görünür */
.siber-home-panel--cats {
    padding-top: 26px;
}

@media (max-width: 767.98px) {
    .siber-home-panel--cats {
        padding-top: 18px;
    }
}
/* =========================================================================
   SPR-054: Homepage Pro Polish (Kategori Kartları + Mobil Header Fit)
   - Mobilde logo absolute konumlandığı için header yüksekliği garanti altına alındı.
   - "Çözümlerimizi Keşfedin" kartları, Popüler Paketler ile uyumlu koyu cam yüzeye çekildi.
   ========================================================================= */

/* Mobile performance: fixed background jank'ini azalt */
@media (max-width: 1199.98px) {
    body.primary-bg-color {
        background-attachment: scroll;
    }
}

/* Category showcase cards: premium dark-glass (theme consistent) */
.siber-home .siber-cat-card {
    background: rgba(10, 46, 107, 0.18);
    border: 1px solid rgba(255, 255, 255, 0.14);
    box-shadow: 0 22px 60px rgba(0, 0, 0, 0.22);
    backdrop-filter: blur(10px);
    color: rgba(255, 255, 255, 0.90);
}

.siber-home .siber-cat-card:hover,
.siber-home .siber-cat-card:focus-within {
    border-color: rgba(255, 255, 255, 0.22);
    box-shadow: 0 28px 74px rgba(0, 0, 0, 0.26);
}

.siber-home .siber-cat-card__content {
    background: transparent;
    border-top: 1px solid rgba(255, 255, 255, 0.12);
}

.siber-home .siber-cat-card__title {
    color: rgba(255, 242, 194, 0.96);
    text-shadow: 0 12px 26px rgba(0, 0, 0, 0.28);
}

.siber-home .siber-cat-card__text {
    color: rgba(255, 255, 255, 0.78);
}

.siber-home .siber-cat-card__cta {
    margin-top: 10px;
    display: inline-flex;
    align-items: center;
    gap: 8px;

    padding: 7px 12px;
    border-radius: 999px;

    background: rgba(255, 255, 255, 0.08);
    border: 1px solid rgba(255, 255, 255, 0.18);

    background-image: none;
    -webkit-background-clip: border-box;
    background-clip: border-box;

    color: rgba(255, 255, 255, 0.94);
    font-weight: 600;
}

.siber-home .siber-cat-card__cta i {
    color: rgba(255, 255, 255, 0.85);
}

.siber-home .siber-cat-card:hover .siber-cat-card__cta,
.siber-home .siber-cat-card:focus-within .siber-cat-card__cta {
    background: rgba(255, 255, 255, 0.12);
    border-color: rgba(255, 255, 255, 0.22);
}

/* =========================================================================
   SPR-077: Homepage -> ORB kart görünümü (Store ORB ile uyum)
   - Ana sayfa ürün kartları: yuvarlak beyaz çerçeve + globe grid + satır altı arc
   - Aylık/Yıllık switch: beyaz zemin + siyah font (gri/white sorununu gider)
   ========================================================================= */

.siber-home{
    /* Store ile aynı arc svg (fit hissi için 6/94 stop) */
    --siber-orb-row: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%20240%2060%27%3E%3Cdefs%3E%3ClinearGradient%20id%3D%27e%27%20x1%3D%270%27%20y1%3D%270%27%20x2%3D%271%27%20y2%3D%270%27%3E%3Cstop%20offset%3D%270%25%27%20stop-color%3D%27%23fff%27%20stop-opacity%3D%270%27%2F%3E%3Cstop%20offset%3D%276%25%27%20stop-color%3D%27%23fff%27%20stop-opacity%3D%27.92%27%2F%3E%3Cstop%20offset%3D%2750%25%27%20stop-color%3D%27%23fff%27%20stop-opacity%3D%271%27%2F%3E%3Cstop%20offset%3D%2794%25%27%20stop-color%3D%27%23fff%27%20stop-opacity%3D%27.92%27%2F%3E%3Cstop%20offset%3D%27100%25%27%20stop-color%3D%27%23fff%27%20stop-opacity%3D%270%27%2F%3E%3C%2FlinearGradient%3E%3C%2Fdefs%3E%3Cpath%20d%3D%27M%20-20%2036%20C%2040%2056%2C%20200%2056%2C%20260%2036%27%20fill%3D%27none%27%20stroke%3D%27url(%23e)%27%20stroke-width%3D%273.2%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%2F%3E%3C%2Fsvg%3E");
    --siber-orb-row-size-x: 420%;
    --siber-home-orb-bleed: 26px;
}

/* Switch: beyaz dolgu + siyah font (siber-home içinde zorla) */
.siber-home .siber-cycle-toggle{
    background: rgba(255, 255, 255, 0.92) !important;
    border-color: rgba(0, 0, 0, 0.10) !important;
}

.siber-home .siber-cycle-toggle__btn{
    color: rgba(0, 0, 0, 0.76) !important;
}

.siber-home .siber-cycle-toggle__btn.is-active{
    background-image: var(--egn-gold-gradient);
    color: var(--egn-black);
}

/* Grid satırları: son satır(lar) ortalansın */
.siber-home .siber-home-panel--deals .row,
.siber-home .siber-pricing-group .row{
    justify-content: center;
}

.siber-home .siber-home-panel--deals .col-md-6.col-lg-4,
.siber-home .siber-pricing-group .col-md-6.col-lg-4{
    display: flex;
    justify-content: center;
}

/* ORB kart: ana gövde */
.siber-home .card.siber-plan-card{
    border-radius: 999px !important;
    border: 2px solid rgba(255, 255, 255, 0.92) !important;
    background:
        radial-gradient(circle at 18% 14%, rgba(255, 255, 255, 0.14) 0%, rgba(255, 255, 255, 0.06) 24%, rgba(255, 255, 255, 0.00) 48%),
        linear-gradient(145deg, rgba(0, 217, 106, 0.95) 0%, rgba(0, 200, 83, 0.95) 35%, rgba(0, 217, 106, 0.95) 70%, rgba(0, 200, 83, 0.95) 100%) !important;
    color: rgba(255, 255, 255, 0.94) !important;
    position: relative;
    overflow: hidden;
    box-shadow: 0 34px 96px rgba(0, 0, 0, 0.24);
    max-width: 380px;
    width: 100%;
    aspect-ratio: 1 / 1;
}

@media (max-width: 575.98px){
    .siber-home .card.siber-plan-card{
        max-width: 340px;
    }
}

/* Globe overlay */
.siber-home .card.siber-plan-card::before{
    content: "";
    position: absolute;
    inset: -6%;
    background: url("../img/globe-arcs.svg") center/155% no-repeat;
    opacity: 0.40;
    pointer-events: none;
}

.siber-home .card.siber-plan-card::after{
    content: "";
    position: absolute;
    inset: -8%;
    background: url("../img/globe-grid.svg") center/120% no-repeat;
    opacity: 0.56;
    pointer-events: none;
}

.siber-home .card.siber-plan-card .card-body{
    position: relative;
    z-index: 1;
    padding: 20px 18px;
    text-align: center;
}

/* Üst satır: badge gizle (store gibi daha temiz) */
.siber-home .siber-plan-card__top{
    justify-content: center;
    margin-bottom: 8px;
}

.siber-home .siber-plan-card__badge{
    display: none;
}

/* Ürün adı: arc underline */
.siber-home .siber-plan-card__name{
    font-weight: 700;
    font-size: 17px;
    color: rgba(255, 255, 255, 0.96);
    position: relative;
    padding: 0 20px 18px;
    margin: 0 -18px 4px;
}

.siber-home .siber-plan-card__name::after{
    content: "";
    position: absolute;
    left: calc(var(--siber-home-orb-bleed) * -1);
    right: calc(var(--siber-home-orb-bleed) * -1);
    bottom: 0;
    height: 40px;
    background-image: var(--siber-orb-row);
    background-repeat: no-repeat;
    background-position: center;
    background-size: var(--siber-orb-row-size-x) 100%;
    opacity: 0.64;
    pointer-events: none;
}

/* Açıklama: daha net + tekrar eden arc hissi */
.siber-home .siber-plan-card__desc{
    color: rgba(255, 255, 255, 0.84) !important;
    font-size: 14px;
    min-height: 44px;
    margin: 0 -18px 12px;
    padding: 0 42px 8px;
    position: relative;
}

.siber-home .siber-plan-card__desc::before{
    content: "";
    position: absolute;
    left: calc(var(--siber-home-orb-bleed) * -1);
    right: calc(var(--siber-home-orb-bleed) * -1);
    top: 0;
    bottom: 0;
    background-image: var(--siber-orb-row);
    background-repeat: repeat-y;
    background-position: center 0.95em;
    background-size: var(--siber-orb-row-size-x) 1.55em;
    opacity: 0.30;
    pointer-events: none;
}

/* Fiyat bloğu: kutu hissini kaldır, orb içi doğal akış + underline */
.siber-home .siber-plan-card__price{
    background: transparent !important;
    border: 0 !important;
    padding: 0 0 18px !important;
    margin: 0 -18px 12px !important;
    position: relative;
}

.siber-home .siber-plan-card__price::after{
    content: "";
    position: absolute;
    left: calc(var(--siber-home-orb-bleed) * -1);
    right: calc(var(--siber-home-orb-bleed) * -1);
    bottom: 0;
    height: 36px;
    background-image: var(--siber-orb-row);
    background-repeat: no-repeat;
    background-position: center;
    background-size: var(--siber-orb-row-size-x) 100%;
    opacity: 0.56;
    pointer-events: none;
}

.siber-home .siber-price__label{
    display: none;
}

.siber-home .siber-price__value{
    font-size: 30px;
    font-weight: 700;
    letter-spacing: -0.02em;
    color: rgba(255, 255, 255, 0.98);
}

.siber-home .siber-price__unit{
    font-size: 14px;
    font-weight: 600;
    color: rgba(255, 255, 255, 0.86) !important;
    margin-left: 8px;
}

.siber-home .siber-price__meta{
    font-size: 13px;
    color: rgba(255, 255, 255, 0.72) !important;
    margin-top: 6px;
}

/* Aksiyonlar: orb uyumlu butonlar */
.siber-home .siber-plan-card__actions{
    margin-top: auto;
    display: flex;
    flex-direction: column;
    gap: 10px;
    align-items: center;
}

.siber-home .siber-plan-card__actions .btn{
    border-radius: 999px;
    width: 100%;
    max-width: 260px;
}

.siber-home .siber-plan-card__actions .btn-primary{
    background: rgba(255, 255, 255, 0.12);
    border: 1px solid rgba(255, 255, 255, 0.68);
    color: rgba(255, 255, 255, 0.95);
    box-shadow: 0 18px 44px rgba(0, 0, 0, 0.22);
}

.siber-home .siber-plan-card__actions .btn-primary:hover{
    background: rgba(255, 255, 255, 0.20);
}

.siber-home .siber-plan-card__actions .btn-outline-primary{
    background: rgba(255, 255, 255, 0.86);
    border: 1px solid rgba(255, 255, 255, 0.92);
    color: rgba(10, 46, 107, 0.96);
}

.siber-home .siber-plan-card__actions .btn-outline-primary:hover{
    background: #ffffff;
}

/* SPR-077 (rafine): açıklama arc çizgileri text'in arkasında kalsın (pseudo yerine background) */
.siber-home .siber-plan-card__desc{
    background-image: var(--siber-orb-row);
    background-repeat: repeat-y;
    background-position: center 0.95em;
    background-size: var(--siber-orb-row-size-x) 1.55em;
}

.siber-home .siber-plan-card__desc::before{
    content: none;
    display: none;
}

/* =========================================================================
   SPR-078: HOME – ORB DETAYLAR BUTONU + 36 AY TAAHHÜT META + ARC DATA-URI FIX
   Author : SiberMimar "Güray Avcı"
   Website: www.sibermimar.com.tr
   ========================================================================= */

.siber-home{
  /* Firefox/Safari uyumu için parantezler (%28/%29) encode edildi */
  --siber-orb-row: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%20240%2060%22%3E%3Cdefs%3E%3ClinearGradient%20id%3D%22e%22%20x1%3D%220%22%20y1%3D%220%22%20x2%3D%221%22%20y2%3D%220%22%3E%3Cstop%20offset%3D%220%25%22%20stop-color%3D%22%23fff%22%20stop-opacity%3D%220%22%2F%3E%3Cstop%20offset%3D%226%25%22%20stop-color%3D%22%23fff%22%20stop-opacity%3D%220.92%22%2F%3E%3Cstop%20offset%3D%2250%25%22%20stop-color%3D%22%23fff%22%20stop-opacity%3D%221%22%2F%3E%3Cstop%20offset%3D%2294%25%22%20stop-color%3D%22%23fff%22%20stop-opacity%3D%220.92%22%2F%3E%3Cstop%20offset%3D%22100%25%22%20stop-color%3D%22%23fff%22%20stop-opacity%3D%220%22%2F%3E%3C%2FlinearGradient%3E%3C%2Fdefs%3E%3Cpath%20d%3D%22M%20-20%2036%20C%2040%2056%2C%20200%2056%2C%20260%2036%22%20fill%3D%22none%22%20stroke%3D%22url%28%23e%29%22%20stroke-width%3D%223.2%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%2F%3E%3C%2Fsvg%3E");
}

.siber-home .siber-orb-details--home{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: max-content;
  margin: 10px auto 8px;
  padding: 10px 14px 22px; /* alt çizgi için */
  position: relative;
  border-radius: 999px;
  border: 1px solid rgba(255,255,255,0.30);
  background: rgba(255,255,255,0.10);
  color: rgba(255,255,255,0.98);
  font-weight: 900;
  letter-spacing: 0.2px;
  text-decoration: none;
}

.siber-home .siber-orb-details--home:hover,
.siber-home .siber-orb-details--home:focus{
  background: rgba(255,255,255,0.14);
  color: var(--siber-auth-navy);
  text-decoration: none;
}

.siber-home .siber-orb-details--home::after{
  content: "";
  position: absolute;
  left: -26px;
  right: -26px;
  bottom: 6px;
  height: 26px;
  background: var(--siber-orb-row) center/var(--siber-orb-row-size-x) 100% no-repeat;
  opacity: 0.52;
  pointer-events: none;
}

/* 36 ay (yoksa 24 ay) taahhüt meta satırı */
.siber-home .siber-price__meta--commit{
  margin-top: 6px;
  font-weight: 900;
  opacity: 0.92;
}

/* =========================================================================
   SPR-110: PERF + Solid Form Inputs (No Blur / No Transparency)
   -------------------------------------------------------------------------
   Kullanıcı geri bildirimi:
   - "Tüm sayfalar donuyor" (özellikle üyelik girişinden sonra)
   - Kayıt/üyelik formları dağınık + veri giriş alanları şeffaf olmamalı

   Çözüm:
   - Cam/blur (backdrop-filter) katmanı global olarak devre dışı.
   - Kart/panel/modal/dropdown/table yüzeyleri solid (beyaz) + hafif gölge.
   - Form input yüzeyleri solid beyaz (şeffaflık yok).
   - Auth (login/register) ve client-area formları masaüstünde aşırı yayılmasın.
   ========================================================================= */

:root {
  /* Solid surfaces override (vNext: glass yerine solid) */
  --egn-surface: #ffffff;
  --egn-surface-solid: #ffffff;
  --egn-surface-strong: #f7f8fb;
  --egn-surface-glass: #ffffff;
  --egn-surface-glass-strong: #f7f8fb;
}

/* Performans: backdrop-filter (blur) düşük/orta cihazlarda ciddi takılma yapar */
body * {
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}

/* Solid UI surfaces */
/*
  NOTE (SPR-156):
  - Solid yüzey zorlaması (.dropdown-menu -> beyaz) koyu (navy) tasarlanmış menülerde
    "beyaz zemin + beyaz yazı" regresyonu üretebiliyordu (Header/Topbar dropdown + Client Panel Nav).
  - Çözüm:
    1) Beyaz zemin zorlamasını sadece #main-body içindeki dropdown'lara scope ettik.
    2) siber-clientpanel-nav dropdown'ı bu kuraldan hariç tutuldu.
*/
.card,
.panel,
.modal-content,
#main-body .dropdown-menu:not(.siber-clientpanel-nav__menu),
.siber-cta-card,
#main-body .table-responsive,
#main-body .table {
  background: #ffffff !important;
  border-color: rgba(10, 46, 107, 0.20) !important;
  box-shadow: 0 14px 40px rgba(0, 0, 0, 0.10);
}

.card-header,
.panel-heading,
.modal-header,
.modal-footer {
  background: #f7f8fb !important;
  border-color: rgba(10, 46, 107, 0.18) !important;
}

/* Solid form fields (no transparency) */
#main-body .form-control,
#main-body .custom-select,
#main-body select.form-control,
#main-body .input-group-text,
.egn-auth-form .form-control,
.egn-auth-form .input-group-text {
  background: #ffffff !important;
  color: rgba(11, 11, 11, 0.92);
}

#main-body .form-control,
#main-body .custom-select,
#main-body select.form-control {
  border-color: rgba(10, 46, 107, 0.22) !important;
}

#main-body .input-group-text,
.egn-auth-form .input-group-text {
  background: #f2f4f8 !important;
  border-color: rgba(10, 46, 107, 0.18) !important;
}

#main-body .form-control::placeholder,
.egn-auth-form .form-control::placeholder {
  color: rgba(11, 11, 11, 0.55);
}

/* Desktop'ta formlar çok yayılmasın */
.egn-auth-shell {
  max-width: 1400px;
  margin-left: auto;
  margin-right: auto;
}

.egn-auth-grid {
  max-width: 1200px;
  margin-left: auto;
  margin-right: auto;
}

#main-body .primary-content > form[role="form"] {
  max-width: 1160px;
  margin-left: auto;
  margin-right: auto;
}

/* Sipariş ekranları fullwidth kalmalı */
#main-body #order-standard_cart form[role="form"],
#main-body #order-standard_cart form {
  max-width: none;
}

@media (max-width: 991.98px) {
  /* Mobilde fixed background bazı tarayıcılarda takılma yapabiliyor */
  body.primary-bg-color {
    background-attachment: scroll !important;
  }

  #main-body .primary-content > form[role="form"] {
    max-width: none;
  }
}


/* ========================================================================== 
   SPR-112: Theme (theme.min.css) orange helper classes -> green
   ========================================================================== */
.card-accent-orange{
  border-top-color: var(--egn-orange-1) !important;
}

.card-accent-brand-cpanel-orange{
  border-top-color: var(--egn-orange-1) !important;
}

.bg-color-orange{
  background-color: var(--egn-orange-1) !important;
}

.status-customer-reply,
.status-pending-registration,
.status-redemption,
.status-grace{
  background-color: var(--egn-orange-1) !important;
}

.promo-banner a{
  color: var(--egn-orange-1) !important;
}

.promo-banner .btn{
  background-color: var(--egn-orange-1) !important;
  border-color: var(--egn-orange-1) !important;
}

.featured-tld .price.shop{
  background: var(--egn-orange-1) !important;
}

.featured-tld .price.social{
  background: var(--egn-orange-3) !important;
}

/* =========================================================================
   SPR-116: Fullpage Overlay (Donma) Fix
   -------------------------------------------------------------------------
   Sorun:
   - WHMCS theme.css içinde #fullpage-overlay için display: table tanımlı.
   - Markup'ta class="w-hidden" olsa bile ID selector daha baskın olduğu için
     overlay bazı sayfalarda görünür kalıp tüm sayfayı kilitliyordu.

   Çözüm:
   - w-hidden varken overlay'i açıkça gizle.
   - showOverlay() çağrısı geldiğinde jQuery .show() inline display ile açabilir.
   ========================================================================= */
#fullpage-overlay.w-hidden{
  display: none;
}

/* =========================================================================
   SPR-119: Auth v2 (Login + Register)
   -------------------------------------------------------------------------
   - Yeni .siber-auth yerleşimi: modern görsel panel + mobil öncelikli form
   - Eski egn-auth layout'undan bağımsız (tamamen yeni sınıflar)
   ========================================================================= */

.siber-auth{
  --siber-auth-radius: 22px;
  --siber-auth-border: rgba(10, 46, 107, 0.16);
  --siber-auth-shadow: 0 24px 70px rgba(0, 0, 0, 0.16);
  --siber-auth-navy: var(--egn-link);
  --siber-auth-dark: #071a31;
  --siber-auth-gold: #d4af37;
  position: relative;
  padding: clamp(28px, 4vw, 48px) 0;
}

.siber-auth__layout{
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 520px);
  gap: clamp(16px, 2vw, 24px);
  align-items: stretch;
}

@media (max-width: 991.98px){
  .siber-auth__layout{ grid-template-columns: 1fr; }
}

.siber-auth__panel{ border-radius: var(--siber-auth-radius); }

.siber-auth__panel--info{
  position: relative;
  padding: clamp(18px, 2.6vw, 26px);
  color: var(--siber-auth-navy);
  overflow: hidden;
  background:
    linear-gradient(135deg, rgba(7, 26, 49, 0.92) 0%, rgba(10, 46, 107, 0.82) 55%, rgba(0, 200, 83, 0.24) 100%),
    var(--siber-auth-img);
  background-size: cover;
  background-position: center;
  border: 1px solid rgba(255, 255, 255, 0.16);
  box-shadow: var(--siber-auth-shadow);
}

.siber-auth__panel--info::after{
  content: "";
  position: absolute;
  inset: 0;
  background: radial-gradient(600px 320px at 80% 15%, rgba(212, 175, 55, 0.20) 0%, rgba(212, 175, 55, 0) 60%);
  pointer-events: none;
}

.siber-auth__kicker{
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  font-size: 0.78rem;
  color: rgba(255, 255, 255, 0.85);
}

.siber-auth__headline{
  font-size: clamp(1.6rem, 2.2vw, 2.2rem);
  line-height: 1.1;
  margin-top: 10px;
  margin-bottom: 10px;
  font-weight: 950;
  letter-spacing: 0.2px;
}

.siber-auth__lead{
  color: rgba(255, 255, 255, 0.90);
  font-size: 1.02rem;
  line-height: 1.55;
  margin-bottom: 14px;
  max-width: 46ch;
}

.siber-auth__points{
  list-style: none;
  padding: 0;
  margin: 0 0 14px;
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.siber-auth__points li{
  display: flex;
  gap: 10px;
  align-items: flex-start;
  color: rgba(255, 255, 255, 0.92);
}

.siber-auth__points i{
  margin-top: 3px;
  color: rgba(212, 175, 55, 0.92);
}

.siber-auth__info-actions{
  margin-top: 14px;
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  align-items: center;
}

.siber-auth__info-muted{
  color: rgba(255, 255, 255, 0.78);
  font-weight: 700;
}

.siber-auth__fineprint{
  margin-top: 16px;
  padding-top: 14px;
  border-top: 1px solid rgba(255, 255, 255, 0.16);
  color: rgba(255, 255, 255, 0.78);
  font-size: 0.93rem;
  display: flex;
  gap: 10px;
  align-items: flex-start;
}

.siber-auth__panel--form{
  padding: 0;
}

.siber-auth__card{
  background: #ffffff;
  border: 1px solid var(--siber-auth-border);
  border-radius: var(--siber-auth-radius);
  box-shadow: var(--siber-auth-shadow);
  padding: clamp(18px, 2.4vw, 26px);
}

.siber-auth__card-head{
  margin-bottom: 14px;
}

.siber-auth__badge{
  display: inline-flex;
  align-items: center;
  padding: 0.28rem 0.7rem;
  border-radius: 999px;
  background: rgba(212, 175, 55, 0.14);
  border: 1px solid rgba(212, 175, 55, 0.32);
  color: var(--siber-auth-navy);
  font-weight: 900;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  font-size: 0.75rem;
}

.siber-auth__title{
  font-weight: 950;
  letter-spacing: 0.2px;
  margin-top: 10px;
  margin-bottom: 6px;
}

.siber-auth__sub{
  color: rgba(10, 10, 10, 0.65);
  margin-bottom: 0;
}

.siber-auth__form .input-group-text{
  background: #ffffff;
  border-color: rgba(10, 46, 107, 0.18);
  color: var(--siber-auth-navy);
}

.siber-auth__form .form-control{
  border-color: rgba(10, 46, 107, 0.18);
  border-left: 0;
}

.siber-auth__form .form-control:focus{
  box-shadow: 0 0 0 0.2rem rgba(10, 46, 107, 0.12);
  border-color: rgba(10, 46, 107, 0.32);
}

.siber-auth__form .input-group-append .btn{
  border-color: rgba(10, 46, 107, 0.18);
}

.siber-auth__link{
  font-weight: 800;
  text-decoration: none;
  color: var(--siber-auth-navy);
}

.siber-auth__link:hover{
  text-decoration: underline;
}

.siber-auth__divider{
  margin: 18px 0;
  display: flex;
  align-items: center;
  gap: 12px;
  color: rgba(10, 10, 10, 0.55);
  font-weight: 800;
}

.siber-auth__divider::before,
.siber-auth__divider::after{
  content: "";
  flex: 1;
  height: 1px;
  background: rgba(10, 46, 107, 0.12);
}

.siber-auth__steps{
  list-style: none;
  padding: 0;
  margin: 18px 0 14px;
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.siber-auth__steps li{
  display: flex;
  align-items: center;
  gap: 10px;
  color: rgba(255, 255, 255, 0.90);
  font-weight: 800;
}

.siber-auth__step-num{
  width: 28px;
  height: 28px;
  border-radius: 10px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: rgba(212, 175, 55, 0.18);
  border: 1px solid rgba(212, 175, 55, 0.35);
  color: var(--siber-auth-navy);
  font-weight: 950;
  font-size: 0.85rem;
}

/* Register içindeki kartları da tema ile uyumla */
.siber-auth--register .siber-register .card{
  border: 1px solid rgba(10, 46, 107, 0.14);
  border-radius: 18px;
  box-shadow: 0 12px 34px rgba(0, 0, 0, 0.08);
  overflow: hidden;
}

.siber-auth--register .siber-register .card .card-body{
  padding: 18px;
}

.siber-auth--register .siber-register .card-title{
  font-weight: 950;
  color: var(--siber-auth-navy);
}

.siber-auth--register .siber-register input.btn.btn-primary.btn-lg.btn-block{
  border-radius: 14px;
  font-weight: 900;
}

@media (max-width: 991.98px){
  .siber-auth__panel--info{ box-shadow: none; }
  .siber-auth__card{ box-shadow: 0 18px 50px rgba(0, 0, 0, 0.14); }
}

@media (max-width: 575.98px){
  .siber-auth__info-actions{
    flex-direction: column;
    align-items: stretch;
  }
  .siber-auth__info-actions .btn{
    width: 100%;
  }
}

/* =========================================================================
   SPR-123: Auth v3 (Login + Register)
   -------------------------------------------------------------------------
   - Daha giriş/kayıt odaklı tek kolon yerleşim (info panel kaldırıldı)
   - Fotoğraf arkaplan kaldırıldı (SPR-127)
   - Mobil öncelikli, sade ve profesyonel switch (Giriş / Kayıt)
   ========================================================================= */

.siber-auth--simple{
  overflow: hidden;
}

.siber-auth--simple::before{
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  /* SPR-127: Fotoğraf arkaplan kaldırıldı (tema uyumu + okunabilirlik) */
  background:
    radial-gradient(680px 360px at 18% 18%, rgba(212, 175, 55, 0.14) 0%, rgba(212, 175, 55, 0) 62%),
    radial-gradient(640px 360px at 82% 18%, rgba(0, 200, 83, 0.10) 0%, rgba(0, 200, 83, 0) 60%),
    linear-gradient(135deg, rgba(7, 26, 49, 0.06) 0%, rgba(10, 46, 107, 0.07) 55%, rgba(0, 200, 83, 0.05) 100%);
  background-size: cover;
  background-position: center;
  transform: scale(1.02);
  z-index: 0;
}

.siber-auth--simple > .container{
  position: relative;
  z-index: 1;
}

.siber-auth__layout--solo{
  grid-template-columns: 1fr;
  justify-items: center;
}

.siber-auth__layout--solo .siber-auth__panel--form{
  width: 100%;
  max-width: 560px;
}

.siber-auth--register.siber-auth--simple .siber-auth__layout--solo .siber-auth__panel--form{
  max-width: 920px;
}

.siber-auth__card-head--center{
  text-align: center;
}

.siber-auth__brand{
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 10px;
}

.siber-auth__brand img{
  max-width: 190px;
  height: auto;
}


/* =========================================================================
   SPR-127: Auth v3 - Görsel mozaik (kart içi çerçeveli)
   -------------------------------------------------------------------------
   - Arkaplana foto koymadan görsel anlatım
   - Mobil uyumlu (2/3 kolon -> tek kolon)
   ========================================================================= */

.siber-auth__mosaic{
  display: grid;
  gap: 10px;
  margin: 12px auto 0;
  max-width: 520px;
}

.siber-auth__mosaic--2{ grid-template-columns: repeat(2, minmax(0, 1fr)); }
.siber-auth__mosaic--3{ grid-template-columns: repeat(3, minmax(0, 1fr)); }

.siber-auth__mosaic-item{
  position: relative;
  border-radius: 16px;
  overflow: hidden;
  border: 1px solid rgba(10, 46, 107, 0.16);
  box-shadow: 0 10px 22px rgba(0, 0, 0, 0.10);
  background: #ffffff;
}

.siber-auth__mosaic-item img{
  width: 100%;
  height: 78px;
  object-fit: cover;
  display: block;
}

@media (max-width: 575.98px){
  .siber-auth__mosaic{ max-width: 100%; }
  .siber-auth__mosaic--2,
  .siber-auth__mosaic--3{ grid-template-columns: 1fr; }
  .siber-auth__mosaic-item img{ height: 120px; }
}

.siber-auth__switch{
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 6px;
  border-radius: 999px;
  background: #ffffff;
  border: 1px solid rgba(10, 46, 107, 0.18);
  box-shadow: 0 10px 26px rgba(0, 0, 0, 0.10);
  margin: 0 auto 12px;
}

.siber-auth__switch-btn{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 10px 14px;
  border-radius: 999px;
  font-weight: 900;
  letter-spacing: 0.2px;
  color: var(--siber-auth-navy);
  text-decoration: none;
  line-height: 1;
  min-width: 110px;
}

.siber-auth__switch-btn:hover{
  text-decoration: none;
  box-shadow: inset 0 0 0 1px rgba(10, 46, 107, 0.16);
}

.siber-auth__switch-btn.is-active{
  background: var(--siber-auth-navy);
  color: #ffffff;
  box-shadow: 0 10px 24px rgba(10, 46, 107, 0.24);
}

.siber-auth__meta{
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-top: 8px;
}

.siber-auth__helper{
  margin-top: 14px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  color: rgba(10, 10, 10, 0.62);
  font-weight: 800;
}

.siber-auth__helper .siber-auth__link{
  color: var(--siber-auth-navy);
  text-decoration: underline;
}

@media (max-width: 575.98px){
  .siber-auth__layout--solo .siber-auth__panel--form{ max-width: 100%; }
  .siber-auth__switch{ width: 100%; justify-content: space-between; }
  .siber-auth__switch-btn{ min-width: 0; flex: 1; }
  .siber-auth__meta{ flex-direction: column; align-items: flex-start; }
}


/* =========================================================================
   SPR-124: Social Login (Google) - Sign-In Integrations (UI)
   -------------------------------------------------------------------------
   - WHMCS linkedaccounts.tpl çıktısını Auth v3 kartına uyumlu hale getirir
   - Butonlar: full width, modern, mobil uyumlu
   ========================================================================= */

.siber-auth__social{
  margin-top: 14px;
  margin-bottom: 4px;
}

.siber-auth__social-title{
  font-weight: 950;
  color: var(--siber-auth-navy);
  text-align: center;
  margin-bottom: 10px;
}

.siber-auth__divider--compact{
  margin: 14px 0;
}

.siber-auth .sub-heading,
.siber-auth .sub-heading-borderless{
  margin-top: 0;
  margin-bottom: 10px;
  text-align: center;
}

.siber-auth .sub-heading span,
.siber-auth .sub-heading-borderless span{
  font-weight: 900;
  color: rgba(10, 10, 10, 0.62);
}

.siber-auth .providerPreLinking{
  margin-top: 0;
}

.siber-auth .social-signin-btns{
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.siber-auth .social-signin-btns > a,
.siber-auth .social-signin-btns > button,
.siber-auth .social-signin-btns .btn{
  width: 100%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  padding: 12px 14px;
  border-radius: 14px;
  font-weight: 900;
  letter-spacing: 0.2px;
  background: rgba(255, 255, 255, 0.98);
  border: 1px solid rgba(10, 46, 107, 0.18);
  color: var(--siber-auth-navy);
  text-decoration: none;
  box-shadow: 0 12px 28px rgba(0, 0, 0, 0.10);
  transition: transform 0.15s ease, box-shadow 0.15s ease, border-color 0.15s ease;
}

.siber-auth .social-signin-btns i{
  font-size: 16px;
  width: 18px;
  text-align: center;
}

.siber-auth .social-signin-btns > a:hover,
.siber-auth .social-signin-btns > button:hover,
.siber-auth .social-signin-btns .btn:hover{
  transform: translateY(-1px);
  border-color: rgba(10, 46, 107, 0.30);
  box-shadow: 0 16px 34px rgba(0, 0, 0, 0.14);
  text-decoration: none;
}

@media (prefers-reduced-motion: reduce){
  .siber-auth .social-signin-btns > a,
  .siber-auth .social-signin-btns > button,
  .siber-auth .social-signin-btns .btn{
    transition: none;
  }

  .siber-auth .social-signin-btns > a:hover,
  .siber-auth .social-signin-btns > button:hover,
  .siber-auth .social-signin-btns .btn:hover{
    transform: none;
  }
}

.siber-auth .providerLinkingFeedback{
  margin-top: 12px;
}

/* --------------------------------------------------------------------------
   SPR-130: Auth pages polish
   - Overlay (koyulaşma) kaldır
   - Kayıt kartını biraz genişlet
   - WHMCS default "existing user" sütunu kalırsa gizle
   -------------------------------------------------------------------------- */
.siber-auth--simple::before{
  display: none;
}

.siber-auth__card--register{
  max-width: 980px;
}

#containerExistingUserSignin,
.existing-user-signin,
.already-registered{
  display: none;
}

/* =====================================================================
   SPR-144: Mobil topbar görünür + Sol orta ikonlar + Yeni alt kısayollar
   - Destek Taleplerim: Mobilde topbar sol, masaüstünde Hesabım menüsünün sağı
   - Sepet + Bildirimler: Mobilde sayfa orta-sol sabit
   - Teklifler/Yenile/Faturalar: Masaüstünde globe üstü, mobilde dock üstü tek satır
   ===================================================================== */

/* Support tickets pill: always white, no hover color changes */
.egn-utilitybar__pill--tickets,
.egn-utilitybar__pill--tickets:hover,
.egn-utilitybar__pill--tickets:focus,
.egn-utilitybar__pill--tickets:active,
.egn-utilitybar__pill--tickets:visited {
    color: #ffffff !important;
    text-decoration: none !important;
    background: rgba(255, 255, 255, 0.08) !important;
    border-color: rgba(255, 255, 255, 0.16) !important;
    transition: none !important;
}

/* Mobile topbar layout + hide extra items */
@media (max-width: 1199.98px) {
/* Mobile topbar readability (requested): solid navy surface */
header.header .egn-utilitybar,
.egn-utilitybar {
    background: linear-gradient(180deg, rgba(10, 46, 107, 0.96), rgba(10, 46, 107, 0.90)) !important;
    border-color: rgba(255, 255, 255, 0.14) !important;
}

    /* Keep only account dropdown in right actions; cart/notify will float */
    .egn-utilitybar__actions > li:not(.siber-nav-account):not(.siber-mobile-floaticon) {
        display: none;
    }

    /* Ensure the topbar grid keeps left/center/right on mobile */
    .egn-utilitybar__inner {
        grid-template-columns: 1fr auto 1fr;
        gap: 10px;
    }

    .egn-utilitybar__left {
        display: flex;
        justify-content: flex-start;
        align-items: center;
    }

    .egn-utilitybar__center {
        justify-content: center;
    }

    .egn-utilitybar__right {
        justify-content: flex-end;
    }

    /* Mobile floating icons: cart + notifications */
    .siber-mobile-floaticon {
        position: fixed;
        left: 12px;
        left: calc(env(safe-area-inset-left) + 12px);
        z-index: 1046;
    }

    .siber-mobile-floaticon .btn.nav-link,
    .siber-mobile-floaticon a.btn.nav-link {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        gap: 8px;
        padding: 10px 12px;
        border-radius: 16px;
        background: linear-gradient(180deg, rgba(10,46,107,0.92), rgba(10,46,107,0.80));
        border: 1px solid rgba(255, 255, 255, 0.16);
        color: #ffffff !important;
        box-shadow: 0 18px 44px rgba(0, 0, 0, 0.22);
        text-decoration: none !important;
        transition: none !important;
        min-width: 54px;
        opacity: 1 !important;
        filter: none !important;
        -webkit-tap-highlight-color: transparent;
        touch-action: manipulation;

    }

    .siber-mobile-floaticon .badge {
        background: rgba(255, 255, 255, 0.20) !important;
        color: #ffffff !important;
        border: 1px solid rgba(255, 255, 255, 0.22);
        min-width: 22px;
        height: 18px;
        padding: 0 6px;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        font-weight: 700;
        border-radius: 999px;
    }

    .siber-mobile-floaticon--notif {
        top: 50%;
        transform: translateY(-38px);
    }

    .siber-mobile-floaticon--cart {
        top: 50%;
        transform: translateY(18px);
    }

    /* Prevent hover on mobile floating icons */
    .siber-mobile-floaticon .btn.nav-link:hover,
    .siber-mobile-floaticon .btn.nav-link:focus,
    .siber-mobile-floaticon .btn.nav-link:active,
    .siber-mobile-floaticon a.btn.nav-link:hover,
    .siber-mobile-floaticon a.btn.nav-link:focus,
    .siber-mobile-floaticon a.btn.nav-link:active {
        background: linear-gradient(180deg, rgba(10,46,107,0.92), rgba(10,46,107,0.80));
        color: #ffffff !important;
        text-decoration: none !important;
        opacity: 1 !important;
        filter: none !important;

    }

    /*
    Author : SiberMimar "Güray Avcı" | Website: www.sibermimar.com.tr

    Cart/Checkout (WHMCS cart.php) sayfalarında mobildeki sol "float" ikonlar
    sipariş adımlarının üstüne biniyordu. Bu ikonlar mobil dock içinde tekrar
    bulunduğu için alışveriş akışında gizlenir.
    */
    body.siber-shopping-cart .siber-mobile-floaticon {
        display: none !important;
    }

    /* Satın alma akışında (sepet/checkout) ikincil alt bar alanı daraltıp içerik üstüne biniyordu */
    body.siber-shopping-cart .siber-mobile-auxdock {
        display: none !important;
    }

    /* Checkout CTA'nin dock arkasinda kalmamasi icin ekstra nefes payi */
    body.siber-shopping-cart {
        padding-bottom: 120px;
    }
}

/* Desktop globe actions (bottom-left) */
.siber-globe-actions {
    position: fixed;
    left: 18px;
    /* Globe: bottom 24px + svg 118px + gap */
    bottom: 156px;
    z-index: 1184;
    display: flex;
    flex-direction: column;
    gap: 10px;
}

/* SPR-161: Desktop'ta butonları container gutter alanına taşı (içerikle çakışmasın) */
@media (min-width: 1200px) {
    .siber-globe-actions {
        left: 18px;
    }
}

.siber-globe-actions__item,
.siber-globe-actions__item:hover,
.siber-globe-actions__item:focus,
.siber-globe-actions__item:active,
.siber-globe-actions__item:visited {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    padding: 10px 12px;
    border-radius: 18px;
    background: linear-gradient(180deg, rgba(10,46,107,0.92), rgba(10,46,107,0.78));
    border: 1px solid rgba(255, 255, 255, 0.14);
    color: #ffffff !important;
    text-decoration: none !important;
    font-weight: 800;
    font-size: 12px;
    line-height: 1;
    white-space: nowrap;
    box-shadow: 0 18px 44px rgba(0, 0, 0, 0.22);
    backdrop-filter: blur(10px);
    transition: none !important;
}

.siber-globe-actions__item svg {
    opacity: 0.95;
    flex: 0 0 auto;
}

/* Mobile aux dock (3 items) */
.siber-mobile-auxdock {
    position: fixed;
    left: 10px;
    right: 10px;
    bottom: 92px;
    z-index: 1031;
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 10px;
    padding: 10px;
    border-radius: 18px;
    background: linear-gradient(180deg, rgba(10,46,107,0.92), rgba(10,46,107,0.84));
    border: 1px solid rgba(255, 255, 255, 0.14);
    box-shadow: 0 18px 44px rgba(0, 0, 0, 0.26);
    backdrop-filter: blur(10px);
}

.siber-mobile-auxdock__item,
.siber-mobile-auxdock__item:hover,
.siber-mobile-auxdock__item:focus,
.siber-mobile-auxdock__item:active,
.siber-mobile-auxdock__item:visited {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 6px;
    color: #ffffff !important;
    text-decoration: none !important;
    font-weight: 700;
    font-size: 11px;
    line-height: 1.1;
    padding: 8px 6px;
    border-radius: 14px;
    background: rgba(255, 255, 255, 0.06);
    border: 1px solid rgba(255, 255, 255, 0.10);
    transition: none !important;
}

.siber-mobile-auxdock__item i {
    font-size: 18px;
    opacity: 0.95;
}

@media (max-width: 360px) {
    .siber-mobile-auxdock {
        gap: 8px;
        padding: 8px;
    }

    .siber-mobile-auxdock__item {
        font-size: 10px;
        padding: 7px 4px;
    }
}

/* =====================================================================
   SPR-151: Mobil hamburger menü hardening
   - Sepet/Bildirim float ikonları ve diğer fixed aksiyonlar menü overlay'in önüne geçmesin.
   - Menü paneli daha premium/odaklı görünsün (navy panel + başlık + kapat).
   ===================================================================== */

/* Mobil menü başlık satırı (JS ile #nav içine eklenir) */
.siber-mnav-head {
    display: none;
}

.siber-mnav-head__inner {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    padding: 10px 10px 12px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.12);
    margin: -4px -2px 10px;
}

.siber-mnav-head__title {
    font-weight: 900;
    letter-spacing: 0.2px;
    color: #ffffff;
}

.siber-mnav-head__close {
    width: 38px;
    height: 38px;
    border-radius: 12px;
    border: 1px solid rgba(255, 255, 255, 0.16);
    background: rgba(255, 255, 255, 0.08);
    color: #ffffff;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0;
    line-height: 1;
    cursor: pointer;
}

@media (max-width: 1199.98px) {
    /* Menu overlay her şeyin üstünde olmalı */
    #mainNavbar.collapse.show,
    #mainNavbar.collapsing {
        z-index: 10050 !important;
    }

    /* Hesabım sheet menünün üstünde kalmaya devam etsin */
    .siber-sheet-backdrop {
        z-index: 10060 !important;
    }

    .siber-sheet {
        z-index: 10070 !important;
    }

    /* Mobil nav paneli: navy yüzey, beyaz linkler */
    #mainNavbar.collapse.show > #nav,
    #mainNavbar.collapsing > #nav {
        width: min(92vw, 520px);
        max-height: 80vh;
        padding: 12px 12px 14px;

        border-radius: 20px;
        border: 1px solid rgba(255, 255, 255, 0.16);
        background: linear-gradient(180deg, rgba(10, 46, 107, 0.98) 0%, rgba(10, 46, 107, 0.92) 100%) !important;
        box-shadow: 0 28px 76px rgba(0, 0, 0, 0.36);
    }

    /* Başlık sadece mobil overlay durumunda görünür */
    #mainNavbar.collapse.show > #nav .siber-mnav-head,
    #mainNavbar.collapsing > #nav .siber-mnav-head {
        display: block;
        margin: 0 0 8px;
    }

    #mainNavbar.collapse.show > #nav .nav-link,
    #mainNavbar.collapsing > #nav .nav-link {
        color: #ffffff !important;
        text-shadow: none !important;
        border-radius: 14px;
        padding: 12px 14px;
    }

    #mainNavbar.collapse.show > #nav .nav-link:hover,
    #mainNavbar.collapse.show > #nav .nav-link:focus,
    #mainNavbar.collapsing > #nav .nav-link:hover,
    #mainNavbar.collapsing > #nav .nav-link:focus {
        background: rgba(255, 255, 255, 0.08) !important;
        color: #ffffff !important;
    }

    #mainNavbar.collapse.show > #nav .dropdown-item,
    #mainNavbar.collapsing > #nav .dropdown-item {
        color: rgba(255, 255, 255, 0.92) !important;
    }

    #mainNavbar.collapse.show > #nav .dropdown-item:hover,
    #mainNavbar.collapse.show > #nav .dropdown-item:focus,
    #mainNavbar.collapsing > #nav .dropdown-item:hover,
    #mainNavbar.collapsing > #nav .dropdown-item:focus {
        background: rgba(0, 200, 83, 0.14) !important;
        color: #ffffff !important;
    }

    /* Menü/sheet açıkken fixed ikonlar (sepet/bildirim/FAB/dock) görünmesin.
       iOS Safari compositing bug'larında z-index'e rağmen öne geçebiliyor.
    */
    body.siber-menu-open .siber-mobile-floaticon,
    body.siber-menu-open .siber-fab,
    body.siber-menu-open .siber-globe-actions,
    body.siber-menu-open .siber-mobile-auxbar,
    body.siber-menu-open .siber-mobile-auxdock,
    body.siber-menu-open .siber-mobile-dock,

    body.siber-sheet-open .siber-mobile-floaticon,
    body.siber-sheet-open .siber-fab,
    body.siber-sheet-open .siber-globe-actions,
    body.siber-sheet-open .siber-mobile-auxbar,
    body.siber-sheet-open .siber-mobile-auxdock,
    body.siber-sheet-open .siber-mobile-dock {
        display: none !important;
    }
}

/* =========================================================================
   SPR-162: Satın Aldıklarım (Unified Purchases)
   - Hizmetler + Alan adları + Eklentiler tek listede
   - Filtre + Arama + Yakında bitecekler
   ========================================================================= */

.siber-purchases {
    padding-top: 8px;
    padding-bottom: 26px;
}

.siber-purchases__header {
    margin: 6px 0 14px;
}

.siber-purchases__title {
    margin: 0;
    font-weight: 900;
    letter-spacing: -0.02em;
}

.siber-purchases__subtitle {
    margin: 8px 0 0;
    color: rgba(11, 11, 11, 0.65);
    max-width: 980px;
}

.siber-purchases__alert {
    border-radius: 14px;
}

.siber-purchases__upcoming.panel {
    border-radius: 18px;
    overflow: hidden;
    border: 1px solid rgba(0,0,0,0.10);
    box-shadow: 0 16px 40px rgba(0,0,0,0.12);
}

.siber-purchases__upcoming .panel-heading {
    background: rgba(255,255,255,0.92);
    border-bottom: 1px solid rgba(0,0,0,0.08);
}

.siber-purchases__upcoming .panel-title {
    font-weight: 900;
}

.siber-purchases__upcoming-list {
    display: grid;
    grid-template-columns: repeat(3, minmax(220px, 1fr));
    gap: 12px;
}

.siber-up-item {
    border-radius: 16px;
    background: rgba(255,255,255,0.94);
    border: 1px solid rgba(0,0,0,0.10);
    padding: 12px;
}

.siber-up-item__top {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 10px;
}

.siber-up-item__title {
    font-weight: 900;
    color: rgba(11, 11, 11, 0.92);
    line-height: 1.25;
}

.siber-up-item__meta {
    margin-top: 8px;
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
}

.siber-up-item__actions {
    margin-top: 10px;
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.siber-purchases__stats {
    margin-top: 6px;
    margin-bottom: 2px;
}

.siber-stat {
    border-radius: 18px;
    background: rgba(255,255,255,0.92);
    border: 1px solid rgba(0,0,0,0.10);
    padding: 14px 14px;
    box-shadow: 0 16px 40px rgba(0,0,0,0.10);
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    margin-bottom: 12px;
}

.siber-stat__label {
    font-weight: 800;
    color: rgba(11, 11, 11, 0.70);
}

.siber-stat__value {
    font-weight: 900;
    font-size: 28px;
    color: rgba(11, 11, 11, 0.92);
}

.siber-purchases__toolbar {
    margin: 8px 0 10px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    flex-wrap: wrap;
}

.siber-purchases__filters {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.siber-filter {
    appearance: none;
    border: 1px solid rgba(0,0,0,0.12);
    background: rgba(255,255,255,0.84);
    color: rgba(11,11,11,0.82);
    padding: 8px 12px;
    border-radius: 999px;
    font-weight: 800;
    line-height: 1;
}

.siber-filter:hover,
.siber-filter:focus {
    border-color: var(--egn-link-border);
    box-shadow: 0 0 0 3px rgba(27, 94, 32, 0.14);
    outline: none;
}

.siber-filter.is-active {
    background: rgba(27, 94, 32, 0.12);
    border-color: rgba(27, 94, 32, 0.30);
    color: rgba(11,11,11,0.92);
}

.siber-purchases__search {
    min-width: 240px;
    flex: 1;
    max-width: 460px;
}

.siber-purchases__list {
    display: flex;
    flex-direction: column;
    gap: 12px;
    margin-top: 8px;
}

.siber-purchase-card {
    display: flex;
    align-items: stretch;
    gap: 12px;
    padding: 14px;
    border-radius: 18px;
    background: rgba(255,255,255,0.92);
    border: 1px solid rgba(0,0,0,0.10);
    box-shadow: 0 16px 40px rgba(0,0,0,0.10);
}

.siber-purchase-card__icon {
    width: 44px;
    height: 44px;
    border-radius: 14px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(27, 94, 32, 0.12);
    border: 1px solid rgba(27, 94, 32, 0.22);
    color: rgba(11,11,11,0.86);
    flex: 0 0 44px;
}

.siber-purchase-card__body {
    flex: 1;
    min-width: 220px;
}

.siber-purchase-card__title {
    font-weight: 900;
    color: rgba(11, 11, 11, 0.92);
    line-height: 1.25;
}

.siber-purchase-card__meta {
    margin-top: 6px;
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    color: rgba(11, 11, 11, 0.62);
    font-weight: 600;
}

.siber-purchase-card__pills {
    margin-top: 10px;
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
}

.siber-purchase-card__side {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    justify-content: space-between;
    gap: 10px;
    min-width: 220px;
}

.siber-purchase-card__date-label {
    color: rgba(11, 11, 11, 0.55);
    font-weight: 800;
    font-size: 12px;
    text-transform: uppercase;
    letter-spacing: 0.2px;
}

.siber-purchase-card__date-value {
    color: rgba(11, 11, 11, 0.88);
    font-weight: 900;
}

.siber-purchase-card__actions {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 8px;
}

.siber-purchases__empty {
    border-radius: 16px;
    margin-top: 10px;
}

.siber-purchases__note {
    border-radius: 16px;
    margin-top: 14px;
    background: rgba(255, 255, 255, 0.90);
    border: 1px solid rgba(0,0,0,0.10);
}

/* Pills */
.siber-pill {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 6px 10px;
    border-radius: 999px;
    font-weight: 800;
    font-size: 12px;
    line-height: 1;
    border: 1px solid rgba(0,0,0,0.10);
}

.siber-pill--soft {
    background: rgba(0,0,0,0.04);
    color: rgba(11,11,11,0.72);
}

.siber-pill--success {
    background: rgba(0, 200, 83, 0.14);
    border-color: rgba(0, 200, 83, 0.22);
    color: rgba(11,11,11,0.86);
}

.siber-pill--warning {
    background: rgba(255, 193, 7, 0.20);
    border-color: rgba(255, 193, 7, 0.24);
    color: rgba(11,11,11,0.86);
}

.siber-pill--danger {
    background: rgba(220, 53, 69, 0.16);
    border-color: rgba(220, 53, 69, 0.22);
    color: rgba(11,11,11,0.90);
}

.siber-pill--default {
    background: rgba(0,0,0,0.04);
    border-color: rgba(0,0,0,0.10);
    color: rgba(11,11,11,0.70);
}

@media (max-width: 991.98px) {
    .siber-purchases__upcoming-list {
        grid-template-columns: repeat(2, minmax(220px, 1fr));
    }
    .siber-purchase-card__side {
        min-width: 190px;
    }
}

@media (max-width: 767.98px) {
    .siber-purchases__upcoming-list {
        grid-template-columns: 1fr;
    }
    .siber-purchase-card {
        flex-direction: column;
        align-items: flex-start;
    }
    .siber-purchase-card__side {
        width: 100%;
        align-items: flex-start;
        min-width: 0;
    }
    .siber-purchase-card__actions {
        justify-content: flex-start;
    }
    .siber-purchases__search {
        width: 100%;
        max-width: 100%;
    }
}

/* =========================================================================
   SPR-163: Guide bileşeni (İşlem Rehberi)
   - Kullanıcıya teknik altyapı detayı göstermeden, aksiyonları netleştirir.
   ========================================================================= */

.siber-guide {
    margin-top: 14px;
    border-radius: 18px;
    background: rgba(255, 255, 255, 0.92);
    border: 1px solid rgba(0,0,0,0.10);
    box-shadow: 0 16px 40px rgba(0,0,0,0.08);
    padding: 14px;
}

.siber-guide__head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
    flex-wrap: wrap;
}

.siber-guide__title {
    font-weight: 900;
    letter-spacing: -0.01em;
    color: rgba(11, 11, 11, 0.92);
}

.siber-guide__actions {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.siber-guide__actions .btn {
    border-radius: 999px;
    font-weight: 800;
}

.siber-guide__list {
    margin: 10px 0 0;
    padding-left: 18px;
    color: rgba(11, 11, 11, 0.70);
}

.siber-guide__list li {
    margin: 6px 0;
}

/* =========================================================================
   SPR-163: Destek Merkezi (Ticket)
   - Ticket listesi kart görünüm
   - Mobil uyumlu filtre + arama
   ========================================================================= */

.siber-support {
    padding-top: 8px;
    padding-bottom: 26px;
}

.siber-support__header {
    margin: 6px 0 14px;
}

.siber-support__title {
    margin: 0;
    font-weight: 900;
    letter-spacing: -0.02em;
}

.siber-support__subtitle {
    margin: 8px 0 0;
    color: rgba(11, 11, 11, 0.65);
    max-width: 980px;
}

.siber-support__actions {
    margin-top: 12px;
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}

.siber-support__actions .btn {
    border-radius: 999px;
    font-weight: 800;
}

.siber-support__toolbar {
    margin: 8px 0 10px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    flex-wrap: wrap;
}

.siber-support__filters {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.siber-support__search {
    min-width: 240px;
    flex: 1;
    max-width: 460px;
}

.siber-ticket-list {
    display: grid;
    grid-template-columns: repeat(2, minmax(280px, 1fr));
    gap: 12px;
    margin-top: 8px;
}

.siber-ticket-card {
    display: flex;
    align-items: stretch;
    gap: 12px;
    padding: 14px;
    border-radius: 18px;
    background: rgba(255,255,255,0.92);
    border: 1px solid rgba(0,0,0,0.10);
    box-shadow: 0 16px 40px rgba(0,0,0,0.10);
    text-decoration: none !important;
    color: rgba(11, 11, 11, 0.92);
}

.siber-ticket-card:hover,
.siber-ticket-card:focus {
    border-color: rgba(27, 94, 32, 0.22);
    box-shadow: 0 18px 46px rgba(0,0,0,0.12);
    transform: translateY(-1px);
}

.siber-ticket-card__icon {
    width: 44px;
    height: 44px;
    border-radius: 14px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(27, 94, 32, 0.12);
    border: 1px solid rgba(27, 94, 32, 0.22);
    color: rgba(11,11,11,0.86);
    flex: 0 0 44px;
}

.siber-ticket-card__body {
    flex: 1;
    min-width: 220px;
}

.siber-ticket-card__top {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 10px;
}

.siber-ticket-card__subject {
    font-weight: 900;
    line-height: 1.25;
    color: rgba(11,11,11,0.92);
}

.siber-ticket-card__subject.is-unread {
    color: rgba(11,11,11,1);
}

.siber-ticket-card__meta {
    margin-top: 8px;
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
}

.siber-ticket-card__bottom {
    margin-top: 10px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    color: rgba(11, 11, 11, 0.66);
    font-weight: 700;
}

.siber-ticket-card__date {
    display: inline-flex;
    align-items: center;
    gap: 6px;
}

.siber-ticket-card__cta {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    color: rgba(11, 11, 11, 0.88);
    font-weight: 900;
}

/* Departman kartları (Ticket submit step 1) */
.siber-dept-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(240px, 1fr));
    gap: 12px;
}

.siber-dept-card {
    display: flex;
    flex-direction: column;
    gap: 8px;
    padding: 16px;
    border-radius: 18px;
    background: rgba(255,255,255,0.92);
    border: 1px solid rgba(0,0,0,0.10);
    box-shadow: 0 16px 40px rgba(0,0,0,0.10);
    text-decoration: none !important;
    color: rgba(11,11,11,0.92);
}

.siber-dept-card:hover,
.siber-dept-card:focus {
    border-color: rgba(27, 94, 32, 0.22);
    box-shadow: 0 18px 46px rgba(0,0,0,0.12);
    transform: translateY(-1px);
}

.siber-dept-card__icon {
    width: 44px;
    height: 44px;
    border-radius: 14px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: rgba(27, 94, 32, 0.12);
    border: 1px solid rgba(27, 94, 32, 0.22);
}

.siber-dept-card__title {
    font-weight: 900;
    letter-spacing: -0.01em;
}

.siber-dept-card__text {
    color: rgba(11,11,11,0.66);
    font-weight: 600;
}

.siber-dept-card__meta {
    margin-top: auto;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-weight: 900;
    color: rgba(11,11,11,0.86);
}

/* Ticket detay (viewticket) */
.siber-ticket-viewwrap .view-ticket {
    border-radius: 18px;
    overflow: hidden;
    border: 1px solid rgba(0,0,0,0.10);
    box-shadow: 0 16px 40px rgba(0,0,0,0.12);
}

.siber-ticket-viewwrap .ticket-reply {
    border-radius: 18px;
    overflow: hidden;
    border: 1px solid rgba(0,0,0,0.10);
    background: rgba(255,255,255,0.92);
    box-shadow: 0 14px 34px rgba(0,0,0,0.10);
}

.siber-ticket-viewwrap .ticket-reply .posted-by {
    padding: 12px 14px;
    background: rgba(0,0,0,0.03);
}

.siber-ticket-viewwrap .ticket-reply.staff {
    border-color: rgba(27, 94, 32, 0.22);
}

.siber-ticket-viewwrap .ticket-reply.staff .posted-by {
    background: rgba(27, 94, 32, 0.10);
}

.siber-ticket-viewwrap .ticket-reply .message {
    background: rgba(255,255,255,0.92);
}

.siber-ticket-viewwrap .ticket-reply.staff .message {
    background: rgba(27, 94, 32, 0.06);
}

@media (max-width: 991.98px) {
    .siber-dept-grid {
        grid-template-columns: repeat(2, minmax(220px, 1fr));
    }
}

@media (max-width: 767.98px) {
    .siber-ticket-list {
        grid-template-columns: 1fr;
    }
    .siber-dept-grid {
        grid-template-columns: 1fr;
    }
    .siber-support__search {
        width: 100%;
        max-width: 100%;
    }
}

/* =========================================================================
   SPR-168 (REQ-023): Mobil Tablo Sütun Seçici (DataTables)
   - Teklifler/Faturalar gibi tablo listelerinde mobilde gereksiz sütunlar
     varsayılan gizlenir.
   - Kullanıcı "Sütunlar" ile görünür sütunları belirleyebilir.
   - Mobilde sığacak kadar seçim (maxVisible) JS tarafında sınırlandırılır.
   ========================================================================= */

.siber-colpicker {
    display: none;
    position: relative;
    align-items: center;
    justify-content: flex-end;
    gap: 10px;
    margin: 8px 0 10px;
}

.siber-colpicker__btn {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    border-radius: 999px;
    padding: 8px 12px;
    background: rgba(10, 46, 107, 0.86);
    border: 1px solid rgba(255, 255, 255, 0.16);
    color: #ffffff;
    font-weight: 800;
    line-height: 1;
}

.siber-colpicker__btn:focus {
    outline: none;
    box-shadow: 0 0 0 3px rgba(255, 255, 255, 0.18);
}

.siber-colpicker__panel {
    position: absolute;
    top: calc(100% + 8px);
    right: 0;
    width: min(340px, 92vw);
    border-radius: 14px;
    padding: 12px;
    background: rgba(10, 46, 107, 0.96);
    border: 1px solid rgba(255, 255, 255, 0.14);
    box-shadow: 0 18px 45px rgba(0, 0, 0, 0.28);
    z-index: 1060;
}

.siber-colpicker__title {
    font-weight: 900;
    letter-spacing: 0.2px;
    color: rgba(255, 255, 255, 0.96);
    margin-bottom: 8px;
}

.siber-colpicker__items {
    display: grid;
    grid-template-columns: 1fr;
    gap: 6px;
}

.siber-colpicker__item {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 8px 10px;
    border-radius: 10px;
    background: rgba(255, 255, 255, 0.06);
}

.siber-colpicker__item input[type="checkbox"] {
    width: 18px;
    height: 18px;
}

.siber-colpicker__label {
    flex: 1;
    color: rgba(255, 255, 255, 0.92);
    font-weight: 700;
    font-size: 13px;
    line-height: 1.25;
}

.siber-colpicker__hint {
    margin-top: 10px;
    font-size: 12px;
    color: rgba(255, 255, 255, 0.72);
}

.siber-colpicker__msg {
    margin-top: 8px;
    font-size: 12px;
    color: rgba(255, 255, 255, 0.90);
    background: rgba(255, 193, 7, 0.16);
    border: 1px solid rgba(255, 193, 7, 0.22);
    padding: 8px 10px;
    border-radius: 10px;
    display: none;
}

@media (max-width: 767.98px) {
    .siber-colpicker {
        display: flex;
    }
}


/* =========================================================================
   SPR-170: Mobil Tablo Kart Görünümü (DataTables)
   - Çok küçük ekranlarda (telefon) satırları kart gibi gösterir.
   - Etiketler TD[data-label] üzerinden gelir (Siber.initMobileTableCards).
   ========================================================================= */

@media (max-width: 575.98px) {

    table.siber-table-cards {
        width: 100% !important;
    }

    /* Başlıkları erişilebilir tut, fakat görsel olarak gizle */
    table.siber-table-cards thead {
        position: absolute !important;
        left: -9999px !important;
        top: -9999px !important;
        width: 1px !important;
        height: 1px !important;
        overflow: hidden !important;
    }

    table.siber-table-cards tbody,
    table.siber-table-cards tr,
    table.siber-table-cards td {
        display: block;
        width: 100%;
    }

    table.siber-table-cards tbody tr {
        background: rgba(255, 255, 255, 0.96);
        border: 1px solid rgba(0, 0, 0, 0.07);
        border-radius: 14px;
        box-shadow: 0 10px 25px rgba(0, 0, 0, 0.10);
        padding: 10px 12px;
        margin: 0 0 12px 0;
    }

    table.siber-table-cards tbody td {
        border: none !important;
        padding: 7px 0 !important;
        display: flex;
        align-items: flex-start;
        justify-content: space-between;
        gap: 12px;
    }

    table.siber-table-cards tbody td:before {
        content: attr(data-label);
        color: rgba(0, 0, 0, 0.62);
        font-weight: 800;
        font-size: 12px;
        line-height: 1.25;
        min-width: 92px;
        max-width: 48%;
        flex: 0 0 auto;
    }

    table.siber-table-cards tbody td[data-label=""]:before {
        content: "";
        display: none;
    }

    /* İçerik */
    table.siber-table-cards tbody td > * {
        max-width: 100%;
    }

    /* Action/btn kolonları sağa yaslansın */
    table.siber-table-cards tbody td.text-center,
    table.siber-table-cards tbody td.text-right {
        justify-content: flex-end;
    }

    /* Büyük butonlar mobile card'da taşmasın */
    table.siber-table-cards tbody td .btn,
    table.siber-table-cards tbody td button,
    table.siber-table-cards tbody td a.btn {
        max-width: 100%;
    }
}