/* Galaxy IPTV — shared portal shell, navigation and remaining WHMCS surfaces */

body {
    --itb-shell-bg: #090f16;
    --itb-shell-surface: #111b28;
    --itb-shell-surface-2: #172536;
    --itb-shell-border: rgba(148, 163, 184, .18);
    --itb-shell-blue: #0878df;
    --itb-shell-blue-2: #18a8f5;
    --itb-shell-gold: #e7b72b;
    --itb-shell-text: #f5f8fc;
    --itb-shell-muted: #98a9bd;
    background: var(--itb-shell-bg);
}

/* Top identity bar */
section#header {
    position: relative;
    z-index: 1020;
    min-height: 78px;
    padding: 9px 0;
    background:
        radial-gradient(circle at 75% -80%, rgba(0, 115, 225, .38), transparent 45%),
        linear-gradient(110deg, #080d13, #101a27 58%, #082c52);
    border-bottom: 1px solid rgba(255, 255, 255, .065);
    box-shadow: 0 10px 35px rgba(0, 0, 0, .22);
}

section#header .container {
    display: flex;
    min-height: 60px;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
}

section#header .logo {
    order: 1;
    display: inline-flex;
    align-items: center;
    min-width: 0;
}

section#header .logo img {
    display: block;
    max-width: 210px;
    max-height: 56px;
    object-fit: contain;
    filter: drop-shadow(0 8px 18px rgba(0, 0, 0, .28));
}

section#header .top-nav {
    order: 2;
    display: flex;
    float: none;
    align-items: center;
    gap: 7px;
    margin: 0;
}

section#header .top-nav > li {
    float: none;
    margin: 0;
}

section#header .top-nav > li > a,
section#header .top-nav > li > a:not(.btn) {
    display: inline-flex;
    min-height: 38px;
    align-items: center;
    gap: 7px;
    padding: 9px 12px;
    border: 1px solid transparent;
    border-radius: 10px;
    color: #b9c6d5;
    font-size: 12px;
    font-weight: 650;
    transition: background .18s ease, border-color .18s ease, color .18s ease, transform .18s ease;
}

section#header .top-nav > li > a:hover,
section#header .top-nav > li > a:focus {
    border-color: rgba(94, 190, 255, .22);
    background: rgba(30, 130, 222, .12);
    color: #fff;
}

section#header .top-nav .primary-action .btn {
    min-height: 38px;
    padding: 9px 15px;
    border: 1px solid rgba(255, 255, 255, .1);
    border-radius: 10px;
    background: linear-gradient(135deg, #075db7, #0a8cf1);
    box-shadow: 0 7px 18px rgba(0, 93, 190, .25);
}

section#header .top-nav .primary-action .btn:hover {
    transform: translateY(-1px);
    background: linear-gradient(135deg, #086dce, #19a2ff);
}

section#header .top-nav .label {
    margin-left: 2px;
    border-radius: 999px;
    background: #e64e59;
    color: #fff;
    font-size: 9px;
}

/* Primary navigation */
section#main-menu {
    position: sticky;
    z-index: 1010;
    top: 0;
}

.navbar-main {
    min-height: 58px;
    margin: 0;
    border: 0 !important;
    border-bottom: 1px solid rgba(231, 183, 43, .38) !important;
    border-radius: 0;
    background: rgba(13, 22, 33, .97) !important;
    box-shadow: 0 13px 30px rgba(0, 0, 0, .2);
    backdrop-filter: blur(16px);
}

.navbar-main .navbar-nav > li {
    margin: 7px 2px;
}

.navbar-main .navbar-nav > li > a {
    position: relative;
    display: flex;
    min-height: 44px;
    align-items: center;
    gap: 8px;
    padding: 11px 14px !important;
    border: 1px solid transparent;
    border-radius: 11px;
    color: #cbd5e1 !important;
    font-size: 13px;
    font-weight: 650;
    letter-spacing: -.01em;
    transition: background .18s ease, border-color .18s ease, color .18s ease, transform .18s ease;
}

.navbar-main .navbar-nav > li > a > i {
    width: 17px;
    color: #69caff;
    font-size: 14px;
    text-align: center;
}

.navbar-main .navbar-nav > li > a:hover,
.navbar-main .navbar-nav > li > a:focus,
.navbar-main .navbar-nav > .active > a,
.navbar-main .navbar-nav > .open > a {
    border-color: rgba(41, 154, 255, .26);
    background: linear-gradient(135deg, rgba(8, 103, 200, .24), rgba(17, 105, 172, .12)) !important;
    color: #fff !important;
    transform: translateY(-1px);
}

.navbar-main .navbar-nav > .active > a::after {
    content: "";
    position: absolute;
    right: 12px;
    bottom: 4px;
    left: 12px;
    height: 2px;
    border-radius: 999px;
    background: linear-gradient(90deg, var(--itb-shell-gold), #ffdf67);
}

.navbar-main .navbar-nav > li[menuitemname="Open Ticket"] > a {
    border-color: rgba(47, 167, 255, .25);
    background: rgba(8, 104, 203, .12);
}

.navbar-main .navbar-nav.navbar-right > li.account > a,
.navbar-main .navbar-nav.navbar-right > li:last-child > a {
    border-color: rgba(255, 255, 255, .08);
    background: rgba(255, 255, 255, .045);
}

.navbar-main .badge {
    min-width: 20px;
    padding: 4px 6px;
    border-radius: 999px;
    background: #e44d5c;
    color: #fff;
    font-size: 9px;
}

.navbar-main .dropdown-menu {
    min-width: 225px;
    margin-top: 7px !important;
    padding: 8px;
    border: 1px solid rgba(122, 163, 203, .22);
    border-radius: 14px;
    background: #111c29;
    box-shadow: 0 22px 55px rgba(0, 0, 0, .42);
}

.navbar-main .dropdown-menu > li > a {
    display: flex;
    align-items: center;
    gap: 9px;
    padding: 10px 11px;
    border-radius: 9px;
    color: #dbe5ef !important;
    font-size: 12px;
}

.navbar-main .dropdown-menu > li > a > i {
    width: 17px;
    color: #6dcaff;
    text-align: center;
}

.navbar-main .dropdown-menu > li > a:hover,
.navbar-main .dropdown-menu > li > a:focus {
    background: #0867be !important;
    color: #fff !important;
}

.navbar-main .navbar-toggle {
    margin: 10px 0;
    padding: 10px;
    border: 1px solid rgba(76, 173, 255, .3);
    border-radius: 10px;
    background: rgba(7, 88, 171, .18);
}

.navbar-main .navbar-toggle:hover,
.navbar-main .navbar-toggle:focus { background: rgba(7, 111, 213, .3); }
.navbar-main .navbar-toggle .icon-bar { background: #7ed4ff; }

/* Shared remaining WHMCS surfaces */
body:not(.itb-template-homepage) section#main-body { min-height: calc(100vh - 250px); }

.main-content > .header-lined,
.main-content > .page-header {
    margin-bottom: 22px;
    padding-bottom: 14px;
    border-bottom-color: var(--itb-shell-border);
}

.main-content > .header-lined h1,
.main-content > .page-header h1 { color: #fff; }

.main-content > .header-lined small,
.main-content > .page-header small { color: var(--itb-shell-muted); }

.breadcrumb {
    padding: 0;
    background: transparent;
    color: var(--itb-shell-muted);
    font-size: 11px;
}

.breadcrumb > li + li::before { color: #63758a; }

.sidebar .panel {
    overflow: hidden;
    border-radius: 14px;
    box-shadow: 0 12px 28px rgba(0, 0, 0, .16);
}

.sidebar .panel-heading {
    min-height: 50px;
    padding: 14px 16px;
    background: linear-gradient(115deg, #074f9b, #087bd8) !important;
}

.sidebar .panel-title {
    color: #fff !important;
    font-family: Inter, sans-serif;
    font-size: 14px;
    font-weight: 700;
}

.sidebar .list-group-item {
    padding: 12px 15px;
    border-color: var(--itb-shell-border);
    background: #111a26;
    color: #d7e1ec;
    font-size: 12px;
}

.sidebar .list-group-item:hover,
.sidebar .list-group-item.active {
    background: rgba(7, 102, 196, .2);
    color: #fff;
}

.form-control,
select.form-control,
textarea.form-control {
    border-color: #33455a;
    border-radius: 10px;
    background: #0b1420;
    color: #edf5ff;
    box-shadow: none;
}

.form-control:focus,
select.form-control:focus,
textarea.form-control:focus {
    border-color: #198de8;
    box-shadow: 0 0 0 3px rgba(25, 141, 232, .14);
}

.input-group-addon {
    border-color: #33455a;
    background: #182536;
    color: #aab9c9;
}

.btn:not(.btn-link) { border-radius: 10px; }
.btn-primary,
.btn-success {
    border-color: transparent;
    background: linear-gradient(135deg, #0666c5, #0b94ee);
    box-shadow: 0 7px 18px rgba(0, 102, 197, .18);
}
.btn-primary:hover,
.btn-primary:focus,
.btn-success:hover,
.btn-success:focus { border-color: transparent; background: linear-gradient(135deg, #0876d8, #19a8fa); }

.btn-default {
    border-color: #394b60;
    background: #182536;
    color: #e5edf6;
}
.btn-default:hover,
.btn-default:focus { border-color: #167fda; background: #213247; color: #fff; }

.panel,
.well,
.modal-content {
    border-color: var(--itb-shell-border);
    border-radius: 15px;
    background: #111b28;
    color: #dce6f1;
    box-shadow: 0 18px 45px rgba(0, 0, 0, .22);
}

.panel-heading,
.modal-header {
    border-color: var(--itb-shell-border);
    background: #172536;
    color: #fff;
}

.panel-footer,
.modal-footer {
    border-color: var(--itb-shell-border);
    background: #0d1722;
}

.nav-tabs { border-bottom-color: var(--itb-shell-border); }
.nav-tabs > li > a { border-radius: 10px 10px 0 0; color: #9eb0c4; }
.nav-tabs > li > a:hover { border-color: var(--itb-shell-border); background: #182638; color: #fff; }
.nav-tabs > li.active > a,
.nav-tabs > li.active > a:hover,
.nav-tabs > li.active > a:focus { border-color: #2f4359; border-bottom-color: #172536; background: #172536; color: #fff; }

.pagination > li > a,
.pagination > li > span {
    border-color: #314157;
    background: #111b28;
    color: #b9c8d9;
}
.pagination > .active > a,
.pagination > .active > span,
.pagination > li > a:hover { border-color: #087bd8; background: #087bd8; color: #fff; }

/* Shopping flow: keep WHMCS behaviour, replace the hosting-store appearance */
.itb-shopping-cart section#main-body { padding-top: 24px; }
.itb-shopping-cart .main-content {
    padding: 0;
    border: 0;
    background: transparent;
    box-shadow: none;
}

#order-standard_cart,
.cart-body {
    color: #dce6f1;
}

#order-standard_cart .products .product,
#order-standard_cart .product-info,
#order-standard_cart .view-cart-items,
#order-standard_cart .summary-container,
#order-standard_cart .order-summary,
#order-standard_cart .sub-heading,
#order-standard_cart .field-container,
#order-standard_cart .domain-selection-options .option {
    border-color: var(--itb-shell-border) !important;
    border-radius: 16px !important;
    background: linear-gradient(145deg, #172536, #101a27) !important;
    color: #e7eef7 !important;
    box-shadow: 0 16px 35px rgba(0, 0, 0, .16);
}

#order-standard_cart .products .product header,
#order-standard_cart .view-cart-items-header,
#order-standard_cart .order-summary h2,
#order-standard_cart .sub-heading span {
    border-color: var(--itb-shell-border) !important;
    background: transparent !important;
    color: #fff !important;
}

#order-standard_cart .products .product .product-desc,
#order-standard_cart .products .product .product-pricing,
#order-standard_cart .summary-container .subtotal,
#order-standard_cart .summary-container .recurring-totals { color: #aab9ca !important; }

#order-standard_cart .products .product .btn-success,
#order-standard_cart .btn-checkout,
#order-standard_cart .btn-primary {
    min-height: 44px;
    border: 0 !important;
    border-radius: 11px !important;
    background: linear-gradient(135deg, #0668c8, #0c9bf4) !important;
    font-weight: 750;
}

#order-standard_cart .view-cart-tabs .nav-tabs > li.active > a,
#order-standard_cart .view-cart-tabs .tab-content { border-color: var(--itb-shell-border); background: #111b28; color: #dce6f1; }

/* Footer */
section#footer {
    padding: 27px 0;
    border-top: 1px solid rgba(148, 163, 184, .14);
    background: #070c12;
    color: #7f90a4;
}

section#footer p { margin: 0; font-size: 11px; }
section#footer .back-to-top {
    display: grid;
    width: 36px;
    height: 36px;
    place-items: center;
    border: 1px solid rgba(55, 170, 255, .24);
    border-radius: 10px;
    background: rgba(5, 95, 183, .16);
    color: #67c8ff;
}

@media (max-width: 1199px) {
    .navbar-main .navbar-nav > li > a { gap: 6px; padding-right: 10px !important; padding-left: 10px !important; font-size: 12px; }
}

@media (max-width: 991px) {
    section#header { min-height: 68px; }
    section#header .container { min-height: 50px; }
    section#header .logo img { max-width: 165px; max-height: 48px; }
    .navbar-main .navbar-nav > li > a > i { display: none; }
}

@media (max-width: 767px) {
    section#header { min-height: 62px; padding: 6px 0; }
    section#header .container { min-height: 50px; gap: 10px; }
    section#header .logo img { max-width: 142px; max-height: 44px; }
    section#header .top-nav { gap: 3px; }
    section#header .top-nav > li > a,
    section#header .top-nav > li > a:not(.btn),
    section#header .top-nav .primary-action .btn {
        min-width: 36px;
        min-height: 36px;
        justify-content: center;
        padding: 8px 9px;
        font-size: 0;
    }
    section#header .top-nav > li > a i { margin: 0; font-size: 14px; }
    section#header .top-nav .caret { display: none; }
    section#header .top-nav .label { position: absolute; margin: -21px 0 0 -7px; font-size: 8px; }

    .navbar-main { min-height: 56px; }
    .navbar-main .navbar-header { min-height: 56px; }
    .navbar-main .navbar-collapse {
        max-height: calc(100vh - 130px);
        padding: 8px 12px 16px;
        border: 0;
        background: #0d1723;
        box-shadow: 0 22px 35px rgba(0, 0, 0, .36);
    }
    .navbar-main .navbar-nav { margin: 0; }
    .navbar-main .navbar-nav > li { margin: 4px 0; }
    .navbar-main .navbar-nav > li > a { min-height: 44px; padding: 11px 13px !important; }
    .navbar-main .navbar-nav > li > a > i { display: inline-block; }
    .navbar-main .navbar-nav .open .dropdown-menu { margin: 5px 0 8px !important; padding: 6px; border: 1px solid var(--itb-shell-border); background: #111e2c; }
    .navbar-main .navbar-nav .open .dropdown-menu > li > a { padding: 10px 12px; color: #c9d7e6 !important; }

    section#main-body { padding-top: 18px; }
    section#main-body .main-content { padding: 18px; border-radius: 14px; }
    .itb-shopping-cart section#main-body .main-content { padding: 0; }
    .sidebar .panel { margin-bottom: 12px; }
}
