/*
 * HostingGird Crimson Professional UI
 * Brand primary: #FF0F40
 * This file intentionally overrides the base WHMCS/Hostingard styles without
 * changing template logic, route variables, hooks or module compatibility.
 */
:root {
  --brand-primary: #FF0F40;
  --brand-primary-hover: #E60038;
  --brand-primary-dark: #C90032;
  --brand-primary-darker: #8F0024;
  --brand-accent: #FF5275;
  --brand-light: #FFE2E9;
  --brand-lighter: #FFF5F7;
  --brand-border: #FF9AB0;
  --brand-rgb: 255, 15, 64;
  --brand-gradient: linear-gradient(135deg, #FF0F40 0%, #E60052 52%, #B80048 100%);
  --brand-gradient-hover: linear-gradient(135deg, #E60038 0%, #C90049 55%, #98003C 100%);
  --ui-heading: #101828;
  --ui-body: #475467;
  --ui-muted: #667085;
  --ui-surface: #FFFFFF;
  --ui-canvas: #F7F8FC;
  --ui-border: #EAECF0;
  --ui-radius-sm: 10px;
  --ui-radius: 16px;
  --ui-radius-lg: 24px;
  --ui-shadow-sm: 0 8px 24px rgba(16,24,40,.06);
  --ui-shadow: 0 18px 48px rgba(16,24,40,.10);
  --ui-shadow-brand: 0 18px 45px rgba(255,15,64,.25);
  --blue: #2583EB;
  --indigo: #6941C6;
  --purple: #7F56D9;
  --pink: #FF0F40;
  --red: #FF0F40;
  --orange: #F79009;
  --yellow: #FEC84B;
  --green: #16A36A;
  --teal: #0E9384;
  --cyan: #06AED4;
  --primary: #FF0F40;
  --success: #16A36A;
  --info: #2583EB;
  --warning: #F59E0B;
  --danger: #FF0F40;
}

:root[data-bs-theme="dark"] {
  --ui-heading: #F9FAFB;
  --ui-body: #D0D5DD;
  --ui-muted: #98A2B3;
  --ui-surface: #171014;
  --ui-canvas: #0F090C;
  --ui-border: #35232B;
  --brand-light: #3A0D1A;
  --brand-lighter: #250B13;
  --brand-border: #A93A58;
  --ui-shadow-sm: 0 10px 28px rgba(0,0,0,.24);
  --ui-shadow: 0 20px 54px rgba(0,0,0,.34);
}

html { scroll-behavior: smooth; }
body {
  color: var(--ui-body);
  background:
    radial-gradient(circle at 8% -8%, rgba(var(--brand-rgb),.07), transparent 28rem),
    radial-gradient(circle at 96% 18%, rgba(var(--brand-rgb),.045), transparent 24rem),
    var(--ui-canvas);
  font-family: 'Inter','Open Sans',sans-serif;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}
h1,h2,h3,h4,h5,h6,
.h1,.h2,.h3,.h4,.h5,.h6 {
  color: var(--ui-heading);
  font-family: 'Manrope','Rubik',sans-serif;
  font-weight: 700;
  letter-spacing: -.025em;
}
p { color: inherit; }
a { color: var(--brand-primary); transition: color .2s ease, opacity .2s ease, transform .2s ease; }
a:hover:not(.btn) { color: var(--brand-primary-hover); text-decoration: none; }
::selection { color: #fff; background: var(--brand-primary); }

/* Layout rhythm */
.ptb-100 { padding-top: 92px !important; padding-bottom: 92px !important; }
.ptb-60 { padding-top: 64px !important; padding-bottom: 64px !important; }
#main-body { position: relative; }
#main-body > .container { position: relative; z-index: 1; }
.primary-content { min-width: 0; }

/* Brand backgrounds */
.bg-primary { background: var(--brand-gradient) !important; }
.bg-accent { background-color: var(--brand-primary-dark) !important; }
.bg-gradient {
  position: relative;
  overflow: hidden;
  background-color: var(--brand-primary) !important;
  background-image:
    radial-gradient(circle at 15% 18%, rgba(255,255,255,.19) 0, rgba(255,255,255,0) 28%),
    radial-gradient(circle at 88% 76%, rgba(255,255,255,.12) 0, rgba(255,255,255,0) 25%),
    var(--brand-gradient) !important;
}
.bg-gradient::before,
.bg-gradient::after {
  content: '';
  position: absolute;
  border-radius: 999px;
  pointer-events: none;
  border: 1px solid rgba(255,255,255,.14);
}
.bg-gradient::before { width: 420px; height: 420px; right: -180px; top: -210px; }
.bg-gradient::after { width: 260px; height: 260px; left: -130px; bottom: -130px; }
.bg-gradient > * { position: relative; z-index: 1; }
.bg-dark { background-color: #19090F !important; }
.bg-gray-light { background-color: var(--ui-canvas) !important; }
.bg-primary-light { background-color: var(--brand-lighter) !important; }
.text-primary { color: var(--brand-primary) !important; }
.border-primary { border-color: var(--brand-primary) !important; }

/* Buttons */
.btn {
  min-height: 44px;
  padding: .72rem 1.45rem;
  border-radius: 11px;
  font-family: 'Manrope','Rubik',sans-serif;
  font-weight: 700;
  letter-spacing: -.01em;
  transition: transform .2s ease, box-shadow .2s ease, background .2s ease, border-color .2s ease;
}
.btn:hover { transform: translateY(-2px); }
.btn:active { transform: translateY(0); }
.btn:focus,.btn.focus { box-shadow: 0 0 0 .22rem rgba(var(--brand-rgb),.18) !important; }
.btn-primary,
.btn-primary.disabled,
.btn-primary:disabled {
  color: #fff !important;
  border-color: transparent !important;
  background: var(--brand-gradient) !important;
  box-shadow: 0 10px 24px rgba(var(--brand-rgb),.22);
}
.btn-primary:hover,.btn-primary:focus,.btn-primary:active,
.btn-primary:not(:disabled):not(.disabled):active {
  color: #fff !important;
  border-color: transparent !important;
  background: var(--brand-gradient-hover) !important;
  box-shadow: var(--ui-shadow-brand) !important;
}
.btn-outline-primary {
  color: var(--brand-primary) !important;
  border: 1.5px solid rgba(var(--brand-rgb),.55) !important;
  background: rgba(var(--brand-rgb),.03) !important;
}
.btn-outline-primary:hover,.btn-outline-primary:focus {
  color: #fff !important;
  border-color: transparent !important;
  background: var(--brand-gradient) !important;
  box-shadow: 0 10px 24px rgba(var(--brand-rgb),.18);
}
.btn-default,.btn-light {
  color: var(--ui-heading) !important;
  border-color: var(--ui-border) !important;
  background: var(--ui-surface) !important;
  box-shadow: 0 3px 10px rgba(16,24,40,.04);
}
.btn-default:hover,.btn-light:hover { color: var(--brand-primary) !important; border-color: var(--brand-border) !important; }
.btn-link { color: var(--brand-primary) !important; box-shadow: none !important; }
.btn-success { background:#16A36A !important; border-color:#16A36A !important; color:#fff !important; }
.btn-info { background:#2583EB !important; border-color:#2583EB !important; color:#fff !important; }
.btn-warning { background:#F59E0B !important; border-color:#F59E0B !important; color:#211A05 !important; }
.btn-danger { background:var(--brand-primary) !important; border-color:var(--brand-primary) !important; color:#fff !important; }
.btn-sm { min-height: 36px; border-radius: 9px; }

/* Header and navigation */
.tt-header {
  z-index: 1030;
  border-bottom: 1px solid rgba(234,236,240,.85);
  background: rgba(255,255,255,.92);
  box-shadow: 0 4px 22px rgba(16,24,40,.04);
  backdrop-filter: blur(16px);
  -webkit-backdrop-filter: blur(16px);
}
:root[data-bs-theme="dark"] .tt-header { background: rgba(23,16,20,.92); border-color: var(--ui-border); }
.tt-header.affix { box-shadow: 0 10px 34px rgba(16,24,40,.09); }
.tt-header .navbar { min-height: 72px; }
.tt-header .navbar-brand { display:flex; align-items:center; font-family:'Manrope',sans-serif; font-weight:800; color:var(--ui-heading); }
.tt-header .logo-img { max-height: 42px; width: auto; }
.tt-main-header #nav > li > a,
.tt-secondary-list > li > a {
  color: var(--ui-heading) !important;
  font-weight: 650;
  border-radius: 9px;
}
.tt-main-header #nav > li > a { padding: .65rem .8rem; }
.tt-main-header #nav > li > a:hover,
.tt-main-header #nav > li.active > a { color: var(--brand-primary) !important; background: var(--brand-lighter); }
.tt-main-header .dropdown-menu,
.dropdown-menu {
  margin-top: .55rem;
  padding: .65rem;
  border: 1px solid var(--ui-border);
  border-radius: 15px;
  background: var(--ui-surface);
  box-shadow: var(--ui-shadow);
}
.dropdown-item { color: var(--ui-body); border-radius: 9px; padding: .6rem .75rem; }
.dropdown-item:hover,.dropdown-item:focus { color: var(--brand-primary); background: var(--brand-lighter); }
.dropdown-item.active,.dropdown-item:active { color:#fff !important; background:var(--brand-gradient) !important; }
.tt-cart-badge,.tt-circle { background: var(--brand-primary) !important; box-shadow:0 0 0 3px var(--ui-surface); }
.tt-theme-light,.tt-theme-dark,.tt-notification button,.cart-btn {
  border-radius: 10px !important;
  color: var(--ui-heading) !important;
}
.tt-theme-light:hover,.tt-theme-dark:hover,.tt-notification button:hover,.cart-btn:hover { color:var(--brand-primary) !important; background:var(--brand-lighter) !important; }

/* Hero */
.tt-hero { padding: 24px 0; }
.tt-hero h1 {
  max-width: 720px;
  margin-bottom: 1.15rem;
  font-size: clamp(2.45rem,5vw,4.35rem);
  line-height: 1.08;
  letter-spacing: -.055em;
  text-wrap: balance;
}
.tt-hero .lead { max-width: 640px; color: rgba(255,255,255,.86) !important; font-size: 1.08rem; }
.tt-hero-btns { display:flex; flex-wrap:wrap; gap:12px; margin-top:1.8rem; }
.tt-hero-btns .btn { min-width: 150px; }
.tt-hero .btn-primary { color:var(--brand-primary) !important; background:#fff !important; box-shadow:0 15px 34px rgba(70,0,23,.22); }
.tt-hero .btn-primary:hover { color:var(--brand-primary-hover) !important; background:#fff !important; box-shadow:0 20px 44px rgba(70,0,23,.30) !important; }
.tt-hero .btn-outline-light { color:#fff !important; border:1.5px solid rgba(255,255,255,.66) !important; background:rgba(255,255,255,.08) !important; backdrop-filter:blur(8px); }
.tt-hero .btn-outline-light:hover { color:var(--brand-primary) !important; border-color:#fff !important; background:#fff !important; }
.hero-img { position:relative; z-index:2; max-height:500px; filter:drop-shadow(0 30px 45px rgba(76,0,26,.25)); animation:brandFloat 6s ease-in-out infinite; }
.tt-shape { margin-bottom:-1px; line-height:0; }
.tt-shape img { width:100%; }
@keyframes brandFloat { 0%,100%{transform:translateY(0)} 50%{transform:translateY(-12px)} }

/* Section headings */
.tt-section-heading,.section-heading { margin-bottom: 2.4rem; }
.tt-section-heading h2,.section-heading h2 {
  margin-bottom:.75rem;
  font-size:clamp(1.9rem,3vw,2.7rem);
  line-height:1.2;
}
.tt-section-heading h2::after,.section-heading h2::after {
  content:'';
  display:block;
  width:54px;
  height:4px;
  margin-top:14px;
  border-radius:99px;
  background:var(--brand-gradient);
}
.text-center.tt-section-heading h2::after,.text-center.section-heading h2::after { margin-left:auto; margin-right:auto; }
.tt-section-heading p,.section-heading p { color:var(--ui-muted); font-size:1rem; }

/* Cards, panels and common containers */
.card,.panel,.modal-content,.popover,
.mc-promo-login,.mc-promo-manage,
.tt-promo,.tt-price-single,.tt-service-single,.tt-testimonial-item,
.tt-announcement-single,.tt-account,.tt-custom-card,.tt-client-home-cards {
  border: 1px solid var(--ui-border) !important;
  border-radius: var(--ui-radius) !important;
  background: var(--ui-surface) !important;
  box-shadow: var(--ui-shadow-sm);
}
.card,.panel,.tt-promo,.tt-price-single,.tt-service-single,.tt-testimonial-item,.tt-announcement-single,.tt-account {
  transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease;
}
.card:hover,.tt-promo:hover,.tt-price-single:hover,.tt-service-single:hover,.tt-testimonial-item:hover,.tt-announcement-single:hover,.tt-account:hover {
  transform: translateY(-6px);
  border-color: rgba(var(--brand-rgb),.28) !important;
  box-shadow: var(--ui-shadow);
}
.card-header,.panel-heading { color:var(--ui-heading); border-bottom:1px solid var(--ui-border); background:linear-gradient(180deg,var(--ui-surface),var(--ui-canvas)); }
.card-footer,.panel-footer { border-top:1px solid var(--ui-border); background:var(--ui-surface); }
.tt-rounded { border-radius:var(--ui-radius) !important; }
.card-accent-blue,.card-accent-green,.card-accent-red,.card-accent-yellow,.card-accent-midnight-blue { border-top:3px solid var(--brand-primary) !important; }

/* Promo, pricing, services and testimonials */
.tt-promo,.tt-service-single,.tt-testimonial-item,.tt-announcement-single { padding:1.65rem !important; }
.tt-promo img,.tt-service-single img { filter:drop-shadow(0 10px 18px rgba(var(--brand-rgb),.12)); }
.tt-promo h5,.tt-service-single h5,.tt-announcement-single h3 { font-weight:750; }
.tt-price-single { position:relative; overflow:hidden; padding:2rem !important; }
.tt-price-single::before {
  content:''; position:absolute; inset:0 0 auto; height:5px; background:var(--brand-gradient);
}
.tt-price-single:hover { transform:translateY(-8px); box-shadow:0 24px 58px rgba(16,24,40,.13); }
.tt-price,.price,.pricing-item .price { color:var(--brand-primary) !important; font-family:'Manrope',sans-serif; font-weight:800; letter-spacing:-.04em; }
.tt-featured-badge,.tt-popular-badge,.pricing-table-row .popular-plan { color:#fff !important; background:var(--brand-gradient) !important; }
.tt-review img { max-height:20px; }
.swiper-pagination-bullet { background:var(--brand-border) !important; opacity:.55; }
.swiper-pagination-bullet-active { width:24px; border-radius:99px; background:var(--brand-primary) !important; opacity:1; }
.tt-account { min-height:150px; color:var(--ui-heading) !important; font-weight:700; }
.tt-account img { height:52px; margin-bottom:14px; }
.tt-read-more { font-weight:700; }
.tt-read-more i { transition:transform .2s ease; }
.tt-read-more:hover i { transform:translateX(4px); }

/* Domain search */
.tt-domain-search-wrap,.domain-search,.domain-checker-container {
  position:relative;
  border:1px solid rgba(var(--brand-rgb),.15);
  border-radius:var(--ui-radius-lg);
  background:var(--ui-surface);
  box-shadow:var(--ui-shadow);
}
.tt-domain-search-wrap { padding:2rem; }
.tt-domain-search-wrap .form-control,.domain-search .form-control { min-height:58px; border-radius:13px 0 0 13px; font-size:1rem; }
.tt-domain-search-wrap .btn,.domain-search .btn { min-height:58px; border-radius:0 13px 13px 0; }
.tt-domain-list li,.tt-domain-list > div { border-color:var(--ui-border) !important; }

/* Forms */
.form-control,.custom-select,.input-group-text,
select.form-control,textarea.form-control {
  color:var(--ui-heading);
  border:1px solid var(--ui-border);
  border-radius:10px;
  background-color:var(--ui-surface);
  box-shadow:0 1px 2px rgba(16,24,40,.03);
  transition:border-color .2s ease,box-shadow .2s ease,background .2s ease;
}
.form-control { min-height:46px; }
textarea.form-control { min-height:120px; }
.form-control::placeholder { color:#98A2B3; }
.form-control:focus,.custom-select:focus,.page-link:focus,
.custom-control-input:focus ~ .custom-control-label::before {
  color:var(--ui-heading);
  border-color:var(--brand-primary) !important;
  background-color:var(--ui-surface);
  box-shadow:0 0 0 .22rem rgba(var(--brand-rgb),.13) !important;
}
.input-group > .form-control:not(:first-child),.input-group > .custom-select:not(:first-child) { border-top-left-radius:0; border-bottom-left-radius:0; }
.input-group-text { color:var(--ui-muted); }
.custom-control-input:checked ~ .custom-control-label::before { border-color:var(--brand-primary) !important; background-color:var(--brand-primary) !important; }
label { color:var(--ui-heading); font-weight:600; }

/* Tables and lists */
.table { color:var(--ui-body); border-radius:var(--ui-radius); overflow:hidden; background:var(--ui-surface); }
.table thead th { color:var(--ui-heading); font-size:.78rem; letter-spacing:.04em; text-transform:uppercase; border-bottom:1px solid var(--ui-border); background:var(--ui-canvas); }
.table td,.table th { border-color:var(--ui-border); vertical-align:middle; }
.table-hover tbody tr:hover { color:var(--ui-heading); background:var(--brand-lighter); }
.list-group-item { color:var(--ui-body); border-color:var(--ui-border); background:var(--ui-surface); }
.list-group-item.active { color:#fff !important; border-color:transparent !important; background:var(--brand-gradient) !important; }

/* Tabs, pagination and badges */
.nav-tabs { border-bottom-color:var(--ui-border); }
.nav-tabs .nav-link { color:var(--ui-muted); border:0; border-bottom:3px solid transparent; border-radius:0; font-weight:650; }
.nav-tabs .nav-link:hover,.nav-tabs .nav-link.active { color:var(--brand-primary); border-bottom-color:var(--brand-primary); background:transparent; }
.nav-pills .nav-link { border-radius:10px; }
.nav-pills .nav-link.active,.nav-pills .show > .nav-link { color:#fff !important; background:var(--brand-gradient) !important; }
.page-link { color:var(--brand-primary); border-color:var(--ui-border); background:var(--ui-surface); }
.page-item.active .page-link { border-color:transparent; background:var(--brand-gradient); }
.badge-primary,.progress-bar { background:var(--brand-gradient) !important; }
.badge-success { background:#16A36A !important; }.badge-info{background:#2583EB !important;}.badge-warning{background:#F59E0B !important;color:#211A05!important;}.badge-danger{background:var(--brand-primary)!important;}
.progress { border-radius:99px; background:var(--brand-light); }

/* Alerts keep semantic meaning while sharing the brand styling language */
.alert { border:1px solid transparent; border-radius:12px; box-shadow:0 4px 16px rgba(16,24,40,.04); }
.alert-primary,.alert-danger { color:#8F0024; border-color:#FFC1CF; background:#FFF0F4; }
.alert-success { color:#067647; border-color:#ABEFC6; background:#ECFDF3; }
.alert-info { color:#175CD3; border-color:#B2DDFF; background:#EFF8FF; }
.alert-warning { color:#93370D; border-color:#FEDF89; background:#FFFAEB; }

/* Sidebars, account pages and knowledgebase */
.sidebar .card,.sidebar .panel,.sidebar .list-group { overflow:hidden; border-radius:var(--ui-radius) !important; box-shadow:var(--ui-shadow-sm); }
.sidebar .list-group-item:hover { color:var(--brand-primary); background:var(--brand-lighter); }
.sidebar .list-group-item.active { box-shadow:inset 4px 0 0 rgba(255,255,255,.8); }
.client-home-cards .card-icon,.tt-title-with-icon-link i,.kb-article-item i { color:var(--brand-primary) !important; }
.tt-page-header {
  position:relative;
  overflow:hidden;
  padding:54px 0 !important;
  background-image:radial-gradient(circle at 82% 20%,rgba(255,255,255,.16),transparent 20rem),var(--brand-gradient) !important;
}
.tt-page-header h1,.tt-page-header h2,.tt-page-header p,.tt-page-header a,.tt-page-header .breadcrumb-item { color:#fff !important; }
.tt-page-header .breadcrumb-item + .breadcrumb-item::before { color:rgba(255,255,255,.7); }

/* Authentication and modals */
.tt-auth-wrap { min-height:calc(100vh - 150px); padding:70px 0; background:radial-gradient(circle at 15% 18%,rgba(var(--brand-rgb),.10),transparent 24rem),var(--ui-canvas); }
.tt-form-wrap,.tt-form-container,.tt-registration-form,.tt-contact-form { border:1px solid var(--ui-border); border-radius:var(--ui-radius-lg); background:var(--ui-surface); box-shadow:var(--ui-shadow); }
.modal-content { overflow:hidden; }
.modal-header { border-bottom-color:var(--ui-border); }
.modal-footer { border-top-color:var(--ui-border); }
.modal-backdrop.show { opacity:.62; }

/* Footer */
.footer.tt-footer {
  position:relative;
  overflow:hidden;
  color:rgba(255,255,255,.75) !important;
  background:
    radial-gradient(circle at 15% 8%,rgba(255,15,64,.22),transparent 24rem),
    radial-gradient(circle at 90% 80%,rgba(255,15,64,.15),transparent 22rem),
    linear-gradient(145deg,#18070D 0%,#250A14 48%,#0C0609 100%) !important;
}
.footer.tt-footer::before { content:''; position:absolute; inset:0; pointer-events:none; background-image:linear-gradient(rgba(255,255,255,.025) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.025) 1px,transparent 1px); background-size:38px 38px; mask-image:linear-gradient(to bottom,black,transparent); }
.footer.tt-footer > * { position:relative; z-index:1; }
.footer.tt-footer h6 { font-size:1rem; color:#fff !important; }
.footer.tt-footer address,.footer.tt-footer p,.footer.tt-footer span,.footer.tt-footer .copyright { color:rgba(255,255,255,.70) !important; }
.footer.tt-footer a { color:rgba(255,255,255,.72) !important; }
.footer.tt-footer a:hover { color:#fff !important; transform:translateX(2px); }
.footer.tt-footer .tt-footer-menu li { margin-bottom:.55rem; }
.footer.tt-footer .tt-footer-bottom { border-top:1px solid rgba(255,255,255,.09); background:rgba(0,0,0,.16); }
.footer.tt-footer .btn { color:#fff !important; border-color:rgba(255,255,255,.14) !important; background:rgba(255,255,255,.06) !important; }

/* Store/cart compatibility */
#order-standard_cart .products .product,#order-standard_cart .product-info,#order-standard_cart .view-cart-items-header,
#order-standard_cart .view-cart-tabs .nav-tabs,#order-standard_cart .summary-container,
.cart-body .sidebar-collapsed { border-radius:var(--ui-radius) !important; }
#order-standard_cart .products .product:hover { border-color:rgba(var(--brand-rgb),.35) !important; box-shadow:var(--ui-shadow); }
#order-standard_cart .products .product header { background:linear-gradient(180deg,var(--ui-surface),var(--ui-canvas)) !important; }
#order-standard_cart .products .product .btn-success,#order-standard_cart .btn-checkout { background:var(--brand-gradient) !important; border-color:transparent !important; }

/* Dark-mode corrections */
:root[data-bs-theme="dark"] body { color:var(--ui-body); background:radial-gradient(circle at 8% -8%,rgba(var(--brand-rgb),.11),transparent 28rem),var(--ui-canvas); }
:root[data-bs-theme="dark"] .text-dark { color:var(--ui-heading) !important; }
:root[data-bs-theme="dark"] .text-muted { color:var(--ui-muted) !important; }
:root[data-bs-theme="dark"] .bg-white { background-color:var(--ui-surface) !important; }
:root[data-bs-theme="dark"] .table-striped tbody tr:nth-of-type(odd) { background:rgba(255,255,255,.018); }
:root[data-bs-theme="dark"] .alert-primary,:root[data-bs-theme="dark"] .alert-danger { color:#FFB4C4; border-color:#632039; background:#2A0D17; }
:root[data-bs-theme="dark"] .alert-success { color:#75E0A7; border-color:#14532D; background:#0E251B; }
:root[data-bs-theme="dark"] .alert-info { color:#84CAFF; border-color:#194E7A; background:#0C2035; }
:root[data-bs-theme="dark"] .alert-warning { color:#FEC84B; border-color:#713B12; background:#2B1B0B; }

/* Accessibility and responsive behavior */
:focus-visible { outline:3px solid rgba(var(--brand-rgb),.28); outline-offset:2px; }
@media (max-width:1199.98px) {
  .offcanvas-collapse { background:var(--ui-surface); box-shadow:-20px 0 50px rgba(16,24,40,.14); }
  .tt-main-header #nav > li > a { padding:.8rem 1rem; }
}
@media (max-width:991.98px) {
  .ptb-100 { padding-top:70px !important; padding-bottom:70px !important; }
  .tt-hero { padding-top:10px; text-align:center; }
  .tt-hero .lead { margin-left:auto; margin-right:auto; }
  .tt-hero-btns { justify-content:center; }
  .hero-img { display:block; max-height:390px; margin:32px auto 0; }
}
@media (max-width:575.98px) {
  .ptb-100 { padding-top:56px !important; padding-bottom:56px !important; }
  .ptb-60 { padding-top:48px !important; padding-bottom:48px !important; }
  .tt-header .navbar { min-height:64px; }
  .tt-header .logo-img { max-height:35px; max-width:165px; }
  .tt-hero h1 { font-size:2.35rem; }
  .tt-hero-btns .btn { width:100%; margin:0 !important; }
  .tt-domain-search-wrap { padding:1.15rem; border-radius:18px; }
  .tt-domain-search-wrap .input-group { display:block; }
  .tt-domain-search-wrap .form-control,.tt-domain-search-wrap .btn { width:100%; border-radius:11px !important; }
  .tt-domain-search-wrap .btn { margin-top:10px; }
  .card,.tt-price-single,.tt-service-single,.tt-testimonial-item,.tt-announcement-single { border-radius:14px !important; }
}
@media (prefers-reduced-motion: reduce) {
  *,*::before,*::after { scroll-behavior:auto !important; animation-duration:.01ms !important; animation-iteration-count:1 !important; transition-duration:.01ms !important; }
}

/* === Flyex Digital homepage layout fixes v2 === */
/* Header: keep navigation and authentication controls in one clean row. */
.tt-header > .navbar > .container {
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  gap: 18px;
}
.tt-header .navbar-brand {
  flex: 0 0 auto;
  margin-right: 0;
}
.tt-header .main-navbar-wrapper {
  flex: 1 1 auto;
  min-width: 0;
  justify-content: center;
  padding-left: 0;
  padding-right: 0;
}
.tt-header .main-navbar-wrapper #mainNavbar {
  width: 100%;
}
.tt-header .main-navbar-wrapper #nav {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  align-items: center;
  justify-content: center;
  white-space: nowrap;
}
.tt-header .tt-toolbar-wrap {
  flex: 0 0 auto;
  width: auto;
  margin-left: auto;
}
.tt-header .tt-toolbar-wrap .navbar-nav {
  display: flex;
  flex-direction: row !important;
  flex-wrap: nowrap;
  align-items: center;
  gap: 5px;
}
.tt-header .tt-toolbar-wrap .navbar-nav > li {
  display: flex;
  align-items: center;
  margin: 0;
}
.tt-header .tt-toolbar-wrap .navbar-nav > li > a,
.tt-header .tt-toolbar-wrap .navbar-nav > li > button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
.tt-auth-link {
  min-height: 38px;
  padding: .52rem .82rem;
  border: 1px solid transparent;
  border-radius: 10px;
  color: var(--ui-heading) !important;
  font-family: 'Manrope','Rubik',sans-serif;
  font-size: 13px;
  font-weight: 750;
  line-height: 1;
  white-space: nowrap;
  transition: color .2s ease, background .2s ease, border-color .2s ease, box-shadow .2s ease, transform .2s ease;
}
.tt-auth-link:hover {
  text-decoration: none;
  transform: translateY(-1px);
}
.tt-auth-register {
  border-color: rgba(var(--brand-rgb),.28);
  background: var(--brand-lighter);
}
.tt-auth-register:hover {
  color: var(--brand-primary) !important;
  border-color: rgba(var(--brand-rgb),.48);
  background: #fff;
  box-shadow: 0 8px 20px rgba(var(--brand-rgb),.10);
}
.tt-header .tt-auth-login,
.tt-header .tt-secondary-list > li > a.tt-auth-login {
  color: #fff !important;
  border-color: transparent;
  background: var(--brand-gradient);
  box-shadow: 0 8px 20px rgba(var(--brand-rgb),.20);
}
.tt-header .tt-auth-login:hover,
.tt-header .tt-secondary-list > li > a.tt-auth-login:hover {
  color: #fff !important;
  background: var(--brand-gradient-hover);
  box-shadow: 0 12px 26px rgba(var(--brand-rgb),.28);
}
.tt-auth-link i {
  font-size: 14px;
}

/* Domain search: remove the dark side blocks and use a single premium card. */
.home-domain-search {
  position: relative;
  padding: 70px 0 76px;
  background:
    radial-gradient(circle at 10% 25%, rgba(var(--brand-rgb),.07), transparent 22rem),
    radial-gradient(circle at 90% 85%, rgba(var(--brand-rgb),.05), transparent 20rem),
    var(--ui-canvas);
}
.tt-domain-search-shell {
  position: relative;
  max-width: 1060px;
  margin: 0 auto;
  padding: clamp(28px, 4vw, 52px);
  overflow: hidden;
  border: 1px solid rgba(var(--brand-rgb),.16);
  border-radius: 28px;
  background:
    linear-gradient(135deg, rgba(255,255,255,.98) 0%, rgba(255,247,250,.98) 55%, rgba(255,255,255,.98) 100%);
  box-shadow: 0 24px 70px rgba(16,24,40,.11), 0 8px 26px rgba(var(--brand-rgb),.08);
}
.tt-domain-search-shell::before {
  position: absolute;
  top: 0;
  right: 0;
  left: 0;
  height: 5px;
  content: '';
  background: var(--brand-gradient);
}
.tt-domain-search-decoration {
  position: absolute;
  pointer-events: none;
  border: 1px solid rgba(var(--brand-rgb),.12);
  border-radius: 999px;
}
.tt-domain-search-decoration-one {
  top: -90px;
  right: -55px;
  width: 220px;
  height: 220px;
  background: radial-gradient(circle, rgba(var(--brand-rgb),.09), transparent 68%);
}
.tt-domain-search-decoration-two {
  bottom: -95px;
  left: -65px;
  width: 190px;
  height: 190px;
  background: radial-gradient(circle, rgba(var(--brand-rgb),.06), transparent 68%);
}
.tt-domain-search-heading,
.tt-domain-search-wrap {
  position: relative;
  z-index: 2;
}
.tt-domain-search-heading {
  max-width: 720px;
  margin: 0 auto 24px;
}
.tt-domain-search-icon {
  display: inline-flex;
  width: 48px;
  height: 48px;
  margin-bottom: 13px;
  align-items: center;
  justify-content: center;
  border: 1px solid rgba(var(--brand-rgb),.15);
  border-radius: 14px;
  color: var(--brand-primary);
  background: var(--brand-lighter);
  box-shadow: 0 8px 20px rgba(var(--brand-rgb),.10);
}
.tt-domain-search-icon i {
  font-size: 19px;
}
.tt-domain-search-heading h2 {
  margin: 0;
  color: var(--ui-heading) !important;
  font-size: clamp(1.75rem, 3vw, 2.45rem);
  line-height: 1.2;
}
.tt-domain-search-heading h2::after {
  content: '';
  display: block;
  width: 54px;
  height: 4px;
  margin: 14px auto 0;
  border-radius: 99px;
  background: var(--brand-gradient);
}
.tt-domain-search-wrap,
.tt-domain-search-panel,
.home-domain-search .input-group-wrapper {
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}
.tt-domain-search-wrap {
  padding: 0 !important;
}
.tt-domain-search-input-group {
  display: flex;
  flex-wrap: nowrap;
  align-items: stretch;
  padding: 7px;
  overflow: hidden;
  border: 1px solid var(--ui-border);
  border-radius: 16px;
  background: var(--ui-surface);
  box-shadow: 0 12px 34px rgba(16,24,40,.08);
  transition: border-color .2s ease, box-shadow .2s ease;
}
.tt-domain-search-input-group:focus-within {
  border-color: rgba(var(--brand-rgb),.55);
  box-shadow: 0 0 0 4px rgba(var(--brand-rgb),.10), 0 15px 38px rgba(16,24,40,.09);
}
.tt-domain-search-wrap .tt-domain-search-input-group .form-control {
  flex: 1 1 auto;
  min-width: 0;
  min-height: 58px;
  padding: .75rem 1.1rem;
  border: 0 !important;
  border-radius: 11px !important;
  color: var(--ui-heading);
  background: transparent !important;
  box-shadow: none !important;
  font-size: 1rem;
}
.tt-domain-search-actions {
  display: flex;
  flex: 0 0 auto;
  align-items: stretch;
  gap: 7px;
  margin-left: 7px;
}
.tt-domain-search-wrap .tt-domain-search-actions .btn {
  min-height: 58px;
  margin: 0;
  padding-right: 1.35rem;
  padding-left: 1.35rem;
  border-radius: 11px !important;
  white-space: nowrap;
}
.tt-domain-search-wrap .tt-domain-transfer-btn {
  color: var(--brand-primary) !important;
  border-color: rgba(var(--brand-rgb),.36) !important;
  background: var(--brand-lighter) !important;
  box-shadow: none;
}
.tt-domain-search-wrap .tt-domain-transfer-btn:hover,
.tt-domain-search-wrap .tt-domain-transfer-btn:focus {
  color: #fff !important;
  border-color: transparent !important;
  background: var(--brand-gradient) !important;
}
.tt-domain-search-meta {
  gap: 18px;
  margin-top: 20px;
  padding: 18px 2px 0;
  border-top: 1px solid var(--ui-border);
}
.tt-domain-list {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 9px;
}
.tt-domain-list .list-inline-item {
  display: inline-flex;
  min-height: 36px;
  margin: 0 !important;
  padding: 6px 10px;
  align-items: center;
  gap: 8px;
  border: 1px solid var(--ui-border);
  border-radius: 10px;
  background: var(--ui-surface);
}
.tt-domain-list .list-inline-item img {
  width: auto;
  max-width: 54px;
  max-height: 22px;
  object-fit: contain;
}
.tt-domain-list li span {
  color: var(--ui-heading) !important;
  font-family: 'Manrope','Rubik',sans-serif;
  font-size: 13px;
  font-weight: 700;
}
.tt-domain-pricing-link {
  display: inline-flex;
  flex: 0 0 auto;
  align-items: center;
  gap: 7px;
  color: var(--brand-primary) !important;
  white-space: nowrap;
}
.tt-domain-search-mobile-actions {
  margin-top: 10px;
  row-gap: 10px;
}
.tt-domain-search-mobile-actions .btn {
  margin: 0 !important;
}

/* Account shortcuts: show the labels fully and stop the following section from covering the cards. */
.tt-account-section {
  position: relative;
  z-index: 2;
  margin: 0 !important;
  padding: 64px 0 74px;
  overflow: hidden;
  background:
    radial-gradient(circle at 8% 15%, rgba(255,255,255,.14), transparent 18rem),
    radial-gradient(circle at 92% 85%, rgba(255,255,255,.10), transparent 20rem),
    var(--brand-gradient) !important;
}
.tt-account-section::before,
.tt-account-section::after {
  position: absolute;
  content: '';
  pointer-events: none;
  border: 1px solid rgba(255,255,255,.12);
  border-radius: 999px;
}
.tt-account-section::before {
  top: -130px;
  right: -90px;
  width: 300px;
  height: 300px;
}
.tt-account-section::after {
  bottom: -160px;
  left: -100px;
  width: 340px;
  height: 340px;
}
.tt-account-section .container {
  position: relative;
  z-index: 2;
}
.tt-account-section .tt-section-heading h2 {
  color: #fff !important;
}
.tt-account-section .tt-section-heading h2::after {
  background: rgba(255,255,255,.92);
}
.tt-account-grid {
  margin-right: -9px;
  margin-left: -9px;
  row-gap: 18px;
}
.tt-account-grid > [class*='col-'] {
  padding-right: 9px;
  padding-left: 9px;
}
.tt-account-section .tt-account {
  display: flex;
  min-height: 154px;
  height: 100%;
  margin: 0 !important;
  padding: 22px 14px !important;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 13px;
  overflow: hidden;
  border: 1px solid rgba(255,255,255,.30) !important;
  border-top: 1px solid rgba(255,255,255,.30) !important;
  border-radius: 17px !important;
  color: var(--ui-heading) !important;
  background: rgba(255,255,255,.97) !important;
  box-shadow: 0 16px 38px rgba(83,0,29,.18);
  isolation: isolate;
}
.tt-account-section .tt-account::before {
  position: absolute;
  z-index: -1;
  top: 0;
  right: 0;
  left: 0;
  height: 4px;
  content: '';
  background: var(--brand-gradient);
}
.tt-account-section .tt-account:hover {
  color: var(--brand-primary) !important;
  transform: translateY(-7px);
  border-color: rgba(255,255,255,.70) !important;
  box-shadow: 0 22px 48px rgba(83,0,29,.25);
}
.tt-account-icon-wrap {
  display: inline-flex;
  width: 58px;
  height: 58px;
  flex: 0 0 58px;
  align-items: center;
  justify-content: center;
  border: 1px solid rgba(var(--brand-rgb),.12);
  border-radius: 16px;
  background: var(--brand-lighter);
}
.tt-account-section .tt-account img {
  display: block;
  width: 34px;
  height: 34px;
  margin: 0 !important;
  object-fit: contain;
}
.tt-account-label {
  display: block;
  width: 100%;
  color: inherit !important;
  font-family: 'Manrope','Rubik',sans-serif;
  font-size: 14px;
  font-weight: 750;
  line-height: 1.35;
  text-align: center;
  white-space: normal;
  overflow-wrap: anywhere;
}

:root[data-bs-theme="dark"] .tt-domain-search-shell {
  border-color: var(--ui-border);
  background: linear-gradient(135deg, #1D1217 0%, #171014 58%, #211018 100%);
}
:root[data-bs-theme="dark"] .tt-domain-search-input-group,
:root[data-bs-theme="dark"] .tt-domain-list .list-inline-item {
  background: var(--ui-surface);
}
:root[data-bs-theme="dark"] .tt-auth-register {
  color: var(--ui-heading) !important;
  background: var(--brand-lighter);
}

@media (max-width: 1199.98px) {
  .tt-header > .navbar > .container {
    gap: 12px;
  }
  .tt-header .main-navbar-wrapper {
    flex: 0 0 0;
    width: 0;
    padding: 0;
  }
  .tt-header .offcanvas-collapse {
    width: 300px;
  }
  .tt-header .offcanvas-collapse #mainNavbar,
  .tt-header .offcanvas-collapse #nav {
    width: 100%;
  }
  .tt-header .offcanvas-collapse #nav {
    flex-direction: column;
    align-items: stretch;
    white-space: normal;
  }
}

@media (max-width: 767.98px) {
  .tt-header > .navbar > .container {
    padding-right: 15px;
    padding-left: 15px;
  }
  .tt-auth-link {
    min-width: 38px;
    min-height: 38px;
    padding: .55rem .7rem;
  }
  .tt-domain-search-shell {
    padding: 25px 20px;
    border-radius: 22px;
  }
  .tt-domain-search-heading {
    margin-bottom: 18px;
  }
  .tt-account-section {
    padding: 54px 0 60px;
  }
  .tt-account-section .tt-account {
    min-height: 145px;
    padding: 18px 10px !important;
  }
}

@media (max-width: 575.98px) {
  .tt-header > .navbar > .container {
    flex-wrap: nowrap !important;
  }
  .tt-header .navbar-brand {
    width: auto !important;
    max-width: calc(100% - 142px);
    text-align: left !important;
  }
  .tt-header .tt-toolbar-wrap {
    width: auto !important;
    justify-content: flex-end !important;
  }
  .tt-header .tt-toolbar-wrap .navbar-nav {
    gap: 2px;
  }
  .tt-auth-link .tt-hide-sm {
    display: none;
  }
  .tt-domain-search-input-group {
    display: block !important;
    padding: 6px;
  }
  .tt-domain-search-wrap .tt-domain-search-input-group .form-control {
    width: 100%;
    min-height: 54px;
    margin: 0;
    border-radius: 10px !important;
  }
  .tt-domain-search-mobile-actions .btn {
    width: 100%;
    min-height: 52px;
    border-radius: 11px !important;
  }
  .tt-domain-search-meta {
    margin-top: 16px;
    padding-top: 16px;
  }
  .tt-domain-pricing-link {
    width: 100%;
    justify-content: center;
  }
  .tt-account-grid > [class*='col-'] {
    flex: 0 0 50%;
    max-width: 50%;
  }
  .tt-account-label {
    font-size: 13px;
  }
}

@media (max-width: 380px) {
  .tt-header .logo-img {
    max-width: 135px;
  }
  .tt-auth-register {
    display: none !important;
  }
  .tt-header .navbar-brand {
    max-width: calc(100% - 92px);
  }
  .tt-account-grid > [class*='col-'] {
    flex-basis: 100%;
    max-width: 100%;
  }
}

/* =========================================================
   Flyex Digital UI hotfix — registration, navigation & cart
   Updated: 2026-07-23
   ========================================================= */

/* 1) Registration telephone selector
   Keep the country list attached to the phone field, compact and above cards. */
#registration,
#registration .tt-registration-form,
#registration .tt-registration-form .card,
#registration .tt-registration-form .card-body,
.tt-auth-wrap .tt-form-wrap,
.tt-auth-wrap .tt-form-container,
.tt-auth-wrap .tt-form-content,
.tt-phone-field-group {
  overflow: visible !important;
}

#registration .tt-phone-field-group {
  position: relative;
  z-index: 35;
}

#registration .tt-phone-field-icon {
  display: none !important;
}

#registration .tt-phone-field-group .intl-tel-input {
  position: relative;
  z-index: 40;
  display: block;
  width: 100% !important;
}

#registration .tt-phone-field-group .tt-phone-input,
#registration .tt-phone-field-group .intl-tel-input input,
#registration .tt-phone-field-group .intl-tel-input input[type="tel"] {
  width: 100% !important;
  min-height: 47px;
  height: 47px;
  border: 1px solid var(--ui-border) !important;
  border-radius: 8px !important;
  background: var(--ui-surface) !important;
  box-shadow: none !important;
}

#registration .tt-phone-field-group .intl-tel-input.separate-dial-code input,
#registration .tt-phone-field-group .intl-tel-input.separate-dial-code input[type="tel"] {
  padding-left: 92px !important;
}

#registration .tt-phone-field-group .intl-tel-input .flag-container {
  z-index: 4;
  border-right: 1px solid var(--ui-border);
  border-radius: 8px 0 0 8px;
  background: var(--brand-lighter);
}

#registration .tt-phone-field-group .intl-tel-input .selected-flag {
  height: 45px;
  border-radius: 8px 0 0 8px;
  outline: 0;
}

#registration .tt-phone-field-group .intl-tel-input .country-list {
  z-index: 12000 !important;
  top: calc(100% + 8px);
  right: 0;
  left: auto;
  width: min(360px, calc(100vw - 36px));
  min-width: 100%;
  max-width: 360px;
  max-height: 260px;
  margin: 0 !important;
  padding: 7px 0;
  overflow-x: hidden;
  overflow-y: auto;
  white-space: normal;
  border: 1px solid var(--ui-border);
  border-radius: 12px;
  color: var(--ui-body);
  background: var(--ui-surface);
  box-shadow: 0 22px 55px rgba(16,24,40,.18);
}

#registration .tt-phone-field-group .intl-tel-input .country-list.dropup,
#registration .tt-phone-field-group .intl-tel-input .country-list.flyex-country-dropup {
  top: auto !important;
  bottom: calc(100% + 8px) !important;
  margin: 0 !important;
}

#registration .tt-phone-field-group .intl-tel-input .country-list .country {
  display: flex;
  min-height: 38px;
  padding: 9px 12px;
  align-items: center;
  border-radius: 8px;
  font-size: 13px;
  line-height: 1.35;
}

#registration .tt-phone-field-group .intl-tel-input .country-list .country.highlight,
#registration .tt-phone-field-group .intl-tel-input .country-list .country:hover {
  color: var(--brand-primary);
  background: var(--brand-lighter);
}

#registration .tt-phone-field-group .intl-tel-input .country-list .dial-code {
  margin-left: auto;
  padding-left: 10px;
  color: var(--ui-muted);
}

/* 2) Header navigation dropdowns
   Desktop submenus must float above the page instead of changing page flow. */
@media (min-width: 1200px) {
  .tt-header,
  .tt-header > .navbar,
  .tt-header > .navbar > .container,
  .tt-header .main-navbar-wrapper,
  .tt-header .offcanvas-collapse,
  .tt-header #mainNavbar,
  .tt-header #nav,
  .tt-header #nav > li.dropdown,
  .tt-header .tt-toolbar-wrap,
  .tt-header .tt-secondary-list,
  .tt-header .tt-secondary-list > li.dropdown {
    overflow: visible !important;
  }

  .tt-header {
    position: relative;
    z-index: 1500 !important;
  }

  .tt-header #nav > li.dropdown,
  .tt-header .tt-secondary-list > li.dropdown {
    position: relative !important;
  }

  .tt-header #nav > li.dropdown > .dropdown-menu {
    position: absolute !important;
    z-index: 1550 !important;
    top: calc(100% + 10px) !important;
    right: auto !important;
    bottom: auto !important;
    left: 0 !important;
    margin: 0 !important;
    transform: none !important;
  }

  .tt-header .tt-secondary-list > li.dropdown > .dropdown-menu,
  .tt-header .tt-toolbar-wrap .dropdown-menu-right {
    position: absolute !important;
    z-index: 1550 !important;
    top: calc(100% + 10px) !important;
    right: 0 !important;
    bottom: auto !important;
    left: auto !important;
    margin: 0 !important;
    transform: none !important;
  }

  .tt-header .dropdown-menu.show {
    display: block !important;
    opacity: 1 !important;
    visibility: visible !important;
  }
}

/* Mobile/offcanvas dropdowns should expand normally inside the drawer. */
@media (max-width: 1199.98px) {
  .tt-header .offcanvas-collapse #nav > li.dropdown > .dropdown-menu {
    position: static !important;
    top: auto !important;
    right: auto !important;
    bottom: auto !important;
    left: auto !important;
    width: 100% !important;
    min-width: 0 !important;
    margin: 6px 0 10px !important;
    transform: none !important;
    box-shadow: none !important;
  }
}

/* 3) WHMCS Standard Cart confirmation modals
   The main container previously created a stacking context below the backdrop. */
body.modal-open #main-body > .container,
body.modal-open #main-body .primary-content,
body.modal-open #order-standard_cart {
  z-index: auto !important;
}

body.modal-open .modal-backdrop {
  z-index: 2000 !important;
  opacity: .56 !important;
  background-color: #09060A !important;
}

#modalRemoveItem,
#modalEmptyCart,
.modal.modal-remove-item {
  z-index: 2010 !important;
  opacity: 1 !important;
  filter: none !important;
}

#modalRemoveItem.show,
#modalEmptyCart.show,
.modal.modal-remove-item.show {
  display: block !important;
}

#modalRemoveItem .modal-dialog,
#modalEmptyCart .modal-dialog,
.modal.modal-remove-item .modal-dialog {
  width: calc(100% - 30px);
  max-width: 460px;
  margin: 8vh auto 30px;
  transform: none !important;
}

#modalRemoveItem .modal-content,
#modalEmptyCart .modal-content,
.modal.modal-remove-item .modal-content {
  overflow: hidden;
  border: 1px solid rgba(var(--brand-rgb),.14) !important;
  border-radius: 20px !important;
  color: var(--ui-body) !important;
  background: var(--ui-surface) !important;
  box-shadow: 0 28px 80px rgba(16,24,40,.30) !important;
  opacity: 1 !important;
  filter: none !important;
}

#modalRemoveItem .modal-body,
#modalEmptyCart .modal-body,
.modal.modal-remove-item .modal-body {
  position: relative;
  padding: 34px 34px 18px !important;
  color: var(--ui-body) !important;
  background: var(--ui-surface) !important;
  text-align: center;
  opacity: 1 !important;
}

#modalRemoveItem .modal-body > .float-right,
#modalEmptyCart .modal-body > .float-right,
.modal.modal-remove-item .modal-body > .float-right {
  position: absolute;
  top: 14px;
  right: 16px;
  float: none !important;
}

#modalRemoveItem .close,
#modalEmptyCart .close,
.modal.modal-remove-item .close {
  display: inline-flex;
  width: 34px;
  height: 34px;
  padding: 0 !important;
  align-items: center;
  justify-content: center;
  border: 0;
  border-radius: 10px;
  color: var(--ui-muted) !important;
  background: var(--ui-canvas) !important;
  font-size: 24px;
  line-height: 1;
  opacity: 1 !important;
  text-shadow: none !important;
}

#modalRemoveItem .close:hover,
#modalEmptyCart .close:hover,
.modal.modal-remove-item .close:hover {
  color: #fff !important;
  background: var(--brand-gradient) !important;
}

#modalRemoveItem .modal-title,
#modalEmptyCart .modal-title,
.modal.modal-remove-item .modal-title {
  display: flex !important;
  margin: 0 0 14px !important;
  flex-direction: column;
  align-items: center;
  gap: 14px;
  color: var(--ui-heading) !important;
  font-size: 24px !important;
  line-height: 1.25;
  text-align: center;
}

#modalRemoveItem .modal-title > i,
#modalEmptyCart .modal-title > i,
.modal.modal-remove-item .modal-title > i {
  display: inline-flex;
  width: 72px;
  height: 72px;
  margin: 0 !important;
  align-items: center;
  justify-content: center;
  border: 1px solid rgba(var(--brand-rgb),.18);
  border-radius: 22px;
  color: var(--brand-primary) !important;
  background: var(--brand-lighter);
  font-size: 30px !important;
  line-height: 1 !important;
}

#modalRemoveItem .modal-body > p,
#modalEmptyCart .modal-body > p,
.modal.modal-remove-item .modal-body > p {
  max-width: 340px;
  margin: 0 auto;
  color: var(--ui-muted) !important;
  font-size: 14px;
  line-height: 1.65;
  text-align: center;
}

#modalRemoveItem .modal-footer,
#modalEmptyCart .modal-footer,
.modal.modal-remove-item .modal-footer {
  gap: 10px;
  padding: 12px 34px 30px !important;
  border-top: 0 !important;
  background: var(--ui-surface) !important;
  opacity: 1 !important;
}

#modalRemoveItem .modal-footer .btn,
#modalEmptyCart .modal-footer .btn,
.modal.modal-remove-item .modal-footer .btn {
  min-width: 104px;
  min-height: 46px;
  margin: 0 !important;
  border-radius: 11px !important;
}

#modalRemoveItem .modal-footer .btn-default,
#modalEmptyCart .modal-footer .btn-default,
.modal.modal-remove-item .modal-footer .btn-default {
  color: var(--ui-heading) !important;
  border: 1px solid var(--ui-border) !important;
  background: var(--ui-canvas) !important;
}

#modalRemoveItem .modal-footer .btn-primary,
#modalEmptyCart .modal-footer .btn-primary,
.modal.modal-remove-item .modal-footer .btn-primary {
  color: #fff !important;
  border-color: transparent !important;
  background: var(--brand-gradient) !important;
  box-shadow: 0 12px 26px rgba(var(--brand-rgb),.22) !important;
}

@media (max-width: 575.98px) {
  #registration .tt-phone-field-group .intl-tel-input .country-list {
    right: auto;
    left: 0;
    width: 100%;
    min-width: 100%;
    max-width: 100%;
    max-height: 230px;
  }

  #modalRemoveItem .modal-dialog,
  #modalEmptyCart .modal-dialog,
  .modal.modal-remove-item .modal-dialog {
    margin-top: 4vh;
  }

  #modalRemoveItem .modal-body,
  #modalEmptyCart .modal-body,
  .modal.modal-remove-item .modal-body {
    padding: 30px 20px 14px !important;
  }

  #modalRemoveItem .modal-footer,
  #modalEmptyCart .modal-footer,
  .modal.modal-remove-item .modal-footer {
    padding: 10px 20px 24px !important;
  }
}

/* =========================================================
   Flyex Digital registration & localisation final fix v3
   Phone dropdown portal, guaranteed state icon, light locale UI
   ========================================================= */

/* The phone list is moved to <body> by custom.js, so no form/card can clip it. */
.flyex-phone-country-list {
  position: fixed !important;
  z-index: 2147483000 !important;
  display: block;
  margin: 0 !important;
  padding: 7px !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
  overscroll-behavior: contain;
  list-style: none;
  white-space: normal !important;
  border: 1px solid #EAECF0 !important;
  border-radius: 13px !important;
  color: #344054 !important;
  background: #FFFFFF !important;
  box-shadow: 0 24px 64px rgba(16, 24, 40, .22) !important;
}
.flyex-phone-country-list.hide {
  display: none !important;
}
.flyex-phone-country-list:not(.hide) {
  display: block !important;
}
.flyex-phone-country-list .country {
  display: flex !important;
  min-height: 40px !important;
  margin: 0 !important;
  padding: 9px 11px !important;
  align-items: center !important;
  border: 0 !important;
  border-radius: 8px !important;
  color: #344054 !important;
  background: transparent !important;
  font-size: 13px !important;
  line-height: 1.35 !important;
  cursor: pointer;
}
.flyex-phone-country-list .country + .country {
  margin-top: 2px !important;
}
.flyex-phone-country-list .country.highlight,
.flyex-phone-country-list .country:hover {
  color: #FF0F40 !important;
  background: #FFF1F4 !important;
}
.flyex-phone-country-list .flag-box {
  display: inline-flex !important;
  width: 24px !important;
  min-width: 24px !important;
  align-items: center;
}
.flyex-phone-country-list .country-name {
  min-width: 0;
  overflow: hidden;
  color: inherit !important;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.flyex-phone-country-list .dial-code {
  margin-left: auto !important;
  padding-left: 12px !important;
  color: #667085 !important;
  white-space: nowrap;
}
.flyex-phone-country-list .divider {
  height: 1px !important;
  margin: 6px 4px !important;
  padding: 0 !important;
  border: 0 !important;
  background: #EAECF0 !important;
}

/* Keep the telephone control clean; the country list no longer affects form flow. */
#registration .tt-phone-field-group {
  position: relative !important;
  z-index: 20 !important;
  margin-bottom: 1rem !important;
}
#registration .tt-phone-field-group .intl-tel-input {
  display: block !important;
  width: 100% !important;
}
#registration .tt-phone-field-group .intl-tel-input .country-list {
  height: 260px !important;
  max-height: 260px !important;
}

/* State/Region: inline SVG avoids missing Font Awesome glyphs. */
#registration .tt-state-field-icon {
  z-index: 7 !important;
  display: flex !important;
  width: 42px !important;
  height: 47px !important;
  align-items: center !important;
  justify-content: center !important;
  color: #FF0F40 !important;
  line-height: 1 !important;
  opacity: 1 !important;
  visibility: visible !important;
}
#registration .tt-state-field-icon svg {
  display: block !important;
  width: 16px !important;
  height: 16px !important;
  overflow: visible !important;
  color: #FF0F40 !important;
}
#registration #state,
#registration #stateselect,
#registration #stateinput,
#registration select[name="state"],
#registration input[name="state"] {
  padding-left: 42px !important;
}

/* Language/currency trigger: clean on both registration page and dark footer. */
.tt-localisation-trigger {
  display: inline-flex !important;
  min-height: 38px !important;
  padding: 8px 12px !important;
  align-items: center !important;
  gap: 6px !important;
  border: 1px solid #E4E7EC !important;
  border-radius: 9px !important;
  color: #344054 !important;
  background: #FFFFFF !important;
  box-shadow: 0 4px 12px rgba(16,24,40,.06) !important;
}
.tt-localisation-trigger:hover,
.tt-localisation-trigger:focus {
  color: #FF0F40 !important;
  border-color: #FFB3C3 !important;
  background: #FFF7F9 !important;
  box-shadow: 0 0 0 3px rgba(255,15,64,.10) !important;
}
.footer.tt-footer .tt-localisation-trigger {
  color: #FFFFFF !important;
  border-color: rgba(255,255,255,.18) !important;
  background: rgba(255,255,255,.08) !important;
  box-shadow: none !important;
}
.footer.tt-footer .tt-localisation-trigger:hover,
.footer.tt-footer .tt-localisation-trigger:focus {
  color: #FFFFFF !important;
  border-color: rgba(255,255,255,.32) !important;
  background: rgba(255,255,255,.14) !important;
}

/* Force the Language/Currency chooser to stay light and readable even if dark mode was saved. */
#modalChooseLanguage.modal-localisation .modal-dialog {
  max-width: 820px;
}
#modalChooseLanguage.modal-localisation .modal-content,
:root[data-bs-theme="dark"] #modalChooseLanguage.modal-localisation .modal-content {
  overflow: hidden !important;
  border: 1px solid #EAECF0 !important;
  border-radius: 18px !important;
  color: #344054 !important;
  background: #FFFFFF !important;
  box-shadow: 0 28px 80px rgba(16,24,40,.24) !important;
}
#modalChooseLanguage.modal-localisation .modal-body,
:root[data-bs-theme="dark"] #modalChooseLanguage.modal-localisation .modal-body {
  padding: 30px !important;
  color: #344054 !important;
  background-color: #FFFFFF !important;
  background-image:
    radial-gradient(circle at 100% 0, rgba(255,15,64,.08), transparent 18rem),
    radial-gradient(circle at 0 100%, rgba(255,15,64,.05), transparent 16rem) !important;
  background-repeat: no-repeat !important;
}
#modalChooseLanguage h5,
#modalChooseLanguage .h5,
#modalChooseLanguage .text-dark,
:root[data-bs-theme="dark"] #modalChooseLanguage h5,
:root[data-bs-theme="dark"] #modalChooseLanguage .h5,
:root[data-bs-theme="dark"] #modalChooseLanguage .text-dark {
  color: #101828 !important;
}
#modalChooseLanguage .close,
:root[data-bs-theme="dark"] #modalChooseLanguage .close {
  display: inline-flex !important;
  width: 38px !important;
  height: 38px !important;
  align-items: center !important;
  justify-content: center !important;
  border-radius: 10px !important;
  color: #475467 !important;
  background: #F2F4F7 !important;
  opacity: 1 !important;
  text-shadow: none !important;
}
#modalChooseLanguage .item-selector {
  row-gap: 10px;
}
#modalChooseLanguage .item-selector .item,
:root[data-bs-theme="dark"] #modalChooseLanguage .item-selector .item {
  display: flex !important;
  min-height: 44px !important;
  margin: 0 !important;
  padding: 10px 12px !important;
  align-items: center !important;
  justify-content: center !important;
  border: 1px solid #E4E7EC !important;
  border-radius: 10px !important;
  color: #344054 !important;
  background: #FFFFFF !important;
  box-shadow: 0 3px 10px rgba(16,24,40,.04) !important;
  font-weight: 650 !important;
  text-decoration: none !important;
}
#modalChooseLanguage .item-selector .item:hover,
#modalChooseLanguage .item-selector .item:focus,
:root[data-bs-theme="dark"] #modalChooseLanguage .item-selector .item:hover,
:root[data-bs-theme="dark"] #modalChooseLanguage .item-selector .item:focus {
  color: #FF0F40 !important;
  border-color: #FFB3C3 !important;
  background: #FFF5F7 !important;
}
#modalChooseLanguage .item-selector .item.active,
:root[data-bs-theme="dark"] #modalChooseLanguage .item-selector .item.active {
  color: #FFFFFF !important;
  border-color: transparent !important;
  background: linear-gradient(135deg, #FF0F40 0%, #E60052 100%) !important;
  box-shadow: 0 10px 24px rgba(255,15,64,.20) !important;
}
#modalChooseLanguage .btn-primary {
  min-width: 130px;
}

@media (max-width: 575.98px) {
  #modalChooseLanguage.modal-localisation .modal-body {
    padding: 22px 18px !important;
  }
  .flyex-phone-country-list {
    border-radius: 11px !important;
  }
}
