/**
 * FariHost LIVE — Cart & domain register layout fix
 * Upload to: /templates/farihost-modern/css/cart-order-fix.css
 * Add to head.tpl AFTER whmcs-global.css:
 * <link href="{$WEB_ROOT}/templates/{$template}/css/cart-order-fix.css?v=3.0.0" rel="stylesheet">
 */

/* Fix fh-shell full-width breaking cart grid */
body.fh-page.page-cart .fh-main-body--cart,
body.fh-page.page-domainregister .fh-main-body--cart {
  padding: 24px 0 48px !important;
  background: #f5f8ff !important;
}

body.fh-page.page-cart .fh-main-body--cart > .fh-shell,
body.fh-page.page-domainregister .fh-main-body--cart > .fh-shell {
  max-width: 1280px !important;
  margin: 0 auto !important;
  padding-left: 20px !important;
  padding-right: 20px !important;
}

body.fh-page.page-cart .primary-content.fh-content,
body.fh-page.page-domainregister .primary-content.fh-content {
  padding: 0 !important;
  width: 100% !important;
  max-width: 100% !important;
}

/* RESTORE cart sidebar — whmcs-global.css wrongly hides it */
body.fh-page.page-cart #order-standard_cart .cart-sidebar,
body.fh-page.page-domainregister #order-standard_cart .cart-sidebar,
body.fh-page.page-domaintransfer #order-standard_cart .cart-sidebar {
  display: block !important;
  visibility: visible !important;
}

body.fh-page.page-cart #order-standard_cart .cart-body,
body.fh-page.page-domainregister #order-standard_cart .cart-body {
  width: auto !important;
  float: none !important;
  min-width: 0 !important;
}

/* Cart grid layout */
#order-standard_cart {
  max-width: 1240px !important;
  margin: 0 auto !important;
  padding: 16px 0 40px !important;
  width: 100% !important;
  float: none !important;
}

#order-standard_cart > .row {
  display: grid !important;
  grid-template-columns: minmax(240px, 280px) minmax(0, 1fr) !important;
  gap: 24px !important;
  margin: 0 !important;
  width: 100% !important;
}

#order-standard_cart > .row::before,
#order-standard_cart > .row::after {
  display: none !important;
}

#order-standard_cart .cart-sidebar,
#order-standard_cart .cart-body {
  float: none !important;
  width: auto !important;
  max-width: 100% !important;
  padding: 0 !important;
  min-width: 0 !important;
}

#order-standard_cart .cart-sidebar {
  position: sticky !important;
  top: 90px !important;
  align-self: start !important;
}

/* Domain register header banner */
#order-standard_cart .header-lined {
  margin-bottom: 24px !important;
  padding: 28px 32px !important;
  border-radius: 24px !important;
  background: linear-gradient(135deg, #07152f, #114caf 55%, #7c3aed) !important;
  color: #fff !important;
}

#order-standard_cart .header-lined h1 {
  color: #fff !important;
  font-size: clamp(1.5rem, 3vw, 2rem) !important;
  margin: 0 !important;
}

#order-standard_cart .header-lined p {
  color: rgba(255,255,255,.85) !important;
  margin: 8px 0 0 !important;
}

/* Domain search input */
#order-standard_cart .domain-checker-container {
  margin-bottom: 24px !important;
}

#order-standard_cart .domain-input-group {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 12px !important;
  max-width: 100% !important;
}

#order-standard_cart .domain-input-group .form-control {
  flex: 1 1 280px !important;
  min-height: 48px !important;
  border-radius: 14px !important;
}

#order-standard_cart .domain-input-group .input-group-btn,
#order-standard_cart .domain-input-group .input-group-append {
  flex: 0 0 auto !important;
}

#order-standard_cart .domain-input-group .btn {
  min-height: 48px !important;
  border-radius: 14px !important;
  padding: 0 28px !important;
  background: linear-gradient(135deg, #2563eb, #7c3aed) !important;
  color: #fff !important;
  border: 0 !important;
  font-weight: 700 !important;
}

/* Spotlight TLD cards — fix huge logos stacked on left */
#order-standard_cart .spotlight-tlds {
  margin: 28px 0 !important;
  clear: both !important;
  width: 100% !important;
}

#order-standard_cart .spotlight-tlds-container {
  display: grid !important;
  grid-template-columns: repeat(auto-fill, minmax(130px, 1fr)) !important;
  gap: 16px !important;
  width: 100% !important;
}

#order-standard_cart .spotlight-tld-container {
  float: none !important;
  width: auto !important;
  max-width: none !important;
  padding: 0 !important;
  margin: 0 !important;
}

#order-standard_cart .spotlight-tld {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  text-align: center !important;
  padding: 18px 12px !important;
  border: 1px solid #dbe5f0 !important;
  border-radius: 18px !important;
  background: #fff !important;
  box-shadow: 0 8px 24px rgba(15,23,42,.06) !important;
  min-height: 160px !important;
  position: relative !important;
}

#order-standard_cart .spotlight-tld img {
  display: block !important;
  max-width: 72px !important;
  max-height: 48px !important;
  width: auto !important;
  height: auto !important;
  margin: 0 auto 10px !important;
  object-fit: contain !important;
}

#order-standard_cart .spotlight-tld .domain-lookup-loader {
  position: absolute !important;
  inset: 0 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  background: rgba(255,255,255,.9) !important;
  border-radius: 18px !important;
}

#order-standard_cart .spotlight-tld-hot,
#order-standard_cart .spotlight-tld-sale,
#order-standard_cart .spotlight-tld-new {
  position: absolute !important;
  top: 8px !important;
  right: 8px !important;
  font-size: 10px !important;
  padding: 3px 8px !important;
  border-radius: 999px !important;
}

/* Domain suggestions */
#order-standard_cart .domain-suggestions,
#order-standard_cart .suggested-domains {
  width: 100% !important;
  margin-top: 24px !important;
}

#order-standard_cart .domain-suggestion,
#order-standard_cart .suggested-domains .domain-suggestion {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 12px !important;
  padding: 14px 18px !important;
  margin-bottom: 10px !important;
  border: 1px solid #dbe5f0 !important;
  border-radius: 14px !important;
  background: #fff !important;
}

#order-standard_cart .domain-checker-result-headline {
  margin: 16px 0 !important;
  font-weight: 700 !important;
}

#order-standard_cart .domain-checker-available { color: #16a34a !important; }
#order-standard_cart .domain-checker-unavailable { color: #dc2626 !important; }

/* Full-width cart — portal-order.css centers + shrinks content */
body.fh-page.page-cart .fh-main-body--cart .primary-content.fh-content {
  align-items: stretch !important;
  width: 100% !important;
}

body.fh-page.page-cart #order-standard_cart,
body.fh-page.page-cart .fh-domain-order-wrap,
body.fh-page.page-cart .fh-domain-order-page {
  width: 100% !important;
  max-width: 1320px !important;
  margin-left: auto !important;
  margin-right: auto !important;
  align-self: stretch !important;
  box-sizing: border-box !important;
}

/* Empty featured TLD boxes — whmcs-global.css hides .img-container and .price */
body.fh-page .fh-domain-featured-card .img-container,
body.fh-page .fh-domain-featured-card .price,
body.fh-page .fh-domain-featured-card .img-container img {
  display: block !important;
}

body.fh-page .fh-domain-featured-grid {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 16px !important;
  width: 100% !important;
  margin-bottom: 24px !important;
}

/* Domain pricing table — bootstrap grid broken inside flex parent */
body.fh-page .fh-domain-pricing-table,
body.fh-page .domain-pricing.fh-domain-panel {
  width: 100% !important;
  max-width: 100% !important;
  overflow-x: auto !important;
}

body.fh-page .fh-domain-pricing-table .tld-pricing-header,
body.fh-page .fh-domain-pricing-table .tld-row,
body.fh-page .domain-pricing .tld-pricing-header,
body.fh-page .domain-pricing .tld-row {
  display: grid !important;
  grid-template-columns: minmax(140px, 28%) minmax(0, 1fr) !important;
  gap: 0 !important;
  width: 100% !important;
  margin: 0 !important;
  float: none !important;
}

body.fh-page .fh-domain-pricing-table .tld-pricing-header::before,
body.fh-page .fh-domain-pricing-table .tld-pricing-header::after,
body.fh-page .fh-domain-pricing-table .tld-row::before,
body.fh-page .fh-domain-pricing-table .tld-row::after,
body.fh-page .domain-pricing .tld-row::before,
body.fh-page .domain-pricing .tld-row::after {
  display: none !important;
}

body.fh-page .fh-domain-pricing-table .tld-row > .col-md-4,
body.fh-page .fh-domain-pricing-table .tld-row > .col-md-8,
body.fh-page .fh-domain-pricing-table .tld-pricing-header > .col-md-4,
body.fh-page .fh-domain-pricing-table .tld-pricing-header > .col-md-8,
body.fh-page .domain-pricing .tld-row > [class*="col-"],
body.fh-page .domain-pricing .tld-pricing-header > [class*="col-"] {
  width: 100% !important;
  max-width: 100% !important;
  flex: none !important;
  float: none !important;
  min-width: 0 !important;
  padding-left: 16px !important;
  padding-right: 16px !important;
}

body.fh-page .fh-domain-pricing-table .tld-row .row,
body.fh-page .fh-domain-pricing-table .tld-pricing-header .row,
body.fh-page .domain-pricing .tld-row .row,
body.fh-page .domain-pricing .tld-pricing-header .row {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 0 !important;
  width: 100% !important;
  margin: 0 !important;
}

body.fh-page .fh-domain-pricing-table .tld-row .row > [class*="col-"],
body.fh-page .fh-domain-pricing-table .tld-pricing-header .row > [class*="col-"],
body.fh-page .domain-pricing .tld-row .row > [class*="col-"],
body.fh-page .domain-pricing .tld-pricing-header .row > [class*="col-"] {
  width: 100% !important;
  max-width: 100% !important;
  flex: none !important;
  float: none !important;
  text-align: center !important;
}

body.fh-page .fh-domain-pricing-table .tld-pricing-header {
  color: #fff !important;
  background: linear-gradient(135deg, #06113f, #1e40af) !important;
}

body.fh-page .fh-domain-pricing-table .tld-pricing-header .tld-column,
body.fh-page .fh-domain-pricing-table .tld-pricing-header .col-4 {
  color: #fff !important;
  font-weight: 800 !important;
}

body.fh-page .domain-pricing .fh-domain-pricing-table .tld-pricing-header .col-xs-4,
body.fh-page .domain-pricing .fh-domain-pricing-table .tld-pricing-header .col-sm-4,
body.fh-page .domain-pricing .fh-domain-pricing-table .tld-pricing-header div:nth-child(odd),
body.fh-page .domain-pricing .fh-domain-pricing-table .tld-pricing-header div:nth-child(even),
body.fh-page .domain-pricing .fh-domain-pricing-table .tld-pricing-header .row > [class*="col-"] {
  background: transparent !important;
  background-color: transparent !important;
  border: 0 !important;
  border-bottom: 0 !important;
  color: #fff !important;
}

body.fh-page .fh-domain-pricing-table .tld-row:nth-child(even) {
  background: #f8fafc !important;
}

body.fh-page .fh-domain-pricing-table .two-row-center {
  border-right: 1px solid #e2e8f0 !important;
}

/* Sidebar panels */
#order-standard_cart .cart-sidebar .panel,
#order-standard_cart .cart-sidebar .card {
  border-radius: 18px !important;
  overflow: hidden !important;
  margin-bottom: 16px !important;
  border: 1px solid #dbe5f0 !important;
  box-shadow: 0 8px 24px rgba(15,23,42,.06) !important;
}

#order-standard_cart .cart-sidebar .panel-heading,
#order-standard_cart .cart-sidebar .card-header {
  background: linear-gradient(135deg, #07152f, #173c82) !important;
  color: #fff !important;
}

#order-standard_cart .cart-sidebar .list-group-item.active {
  background: linear-gradient(135deg, #2563eb, #7c3aed) !important;
  color: #fff !important;
  border-color: transparent !important;
}

@media (max-width: 991px) {
  #order-standard_cart > .row {
    grid-template-columns: 1fr !important;
  }
  #order-standard_cart .cart-sidebar {
    position: static !important;
    display: block !important;
  }
  #order-standard_cart .spotlight-tlds-container {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
}

@media (max-width: 480px) {
  #order-standard_cart .spotlight-tlds-container {
    grid-template-columns: 1fr 1fr !important;
  }
  #order-standard_cart .domain-input-group {
    display: grid !important;
    grid-template-columns: 1fr !important;
  }
  #order-standard_cart .domain-input-group .btn {
    width: 100% !important;
  }
}
