/* ============================================================
   LS Cart — configure product page  (orderforms/standard_cart)
   scope: #order-standard_cart.ls-configure
   ============================================================ */

@media (min-width: 992px) {
  body.ls-page-configureproduct #main-body > .container {
    max-width: 1180px;
  }
}

/* ---- responsive two-column layout: config (main) + summary (side) ---- */
#order-standard_cart.ls-configure form > .row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 316px;
  gap: 24px;
  align-items: start;
  margin: 0;
}
#order-standard_cart.ls-configure .secondary-cart-body,
#order-standard_cart.ls-configure .secondary-cart-sidebar {
  width: auto !important;
  max-width: none !important;
  float: none !important;
  margin: 0;
  padding: 0;
  min-width: 0;
}
#order-standard_cart.ls-configure .secondary-cart-body { grid-column: 1; }
#order-standard_cart.ls-configure .secondary-cart-sidebar { grid-column: 2; position: sticky; top: 96px; }
#order-standard_cart.ls-configure #scrollingPanelContainer {
  position: static !important;
  width: auto !important;
  float: none !important;
}
#order-standard_cart.ls-configure #orderSummary { position: sticky; top: 96px; }

/* ---- hero ---- */
#order-standard_cart.ls-configure .ls-config-hero,
#order-standard_cart.ls-viewcart .ls-config-hero {
  position: relative;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  text-align: start;
  padding: 30px 32px 28px;
  margin-bottom: 22px;
  border: 1px solid #cfe6df;
  border-radius: 24px;
  background:
    radial-gradient(420px 220px at 96% -40px, rgba(25, 97, 92, 0.10) 0%, rgba(25, 97, 92, 0) 70%),
    linear-gradient(135deg, #ffffff 0%, #eef8f4 55%, #ddf0ea 100%);
  box-shadow: 0 1px 2px rgba(14, 43, 39, 0.04), 0 18px 44px -18px rgba(20, 97, 87, 0.22);
}
#order-standard_cart .ls-config-kicker {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 12px;
  padding: 5px 14px;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.92);
  border: 1px solid #cfe6df;
  box-shadow: 0 6px 16px -10px rgba(20, 97, 87, 0.4);
  color: #19615c;
  font-size: 12px;
  font-weight: 800;
}
#order-standard_cart .ls-config-kicker::before {
  content: "";
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: #1fc08b;
  box-shadow: 0 0 0 3px rgba(31, 192, 139, 0.18);
}
#order-standard_cart.ls-configure .ls-config-hero h1,
#order-standard_cart.ls-viewcart .ls-config-hero h1 {
  margin: 0 0 8px;
  color: #0b3d37;
  font-size: 30px;
  font-weight: 800;
  line-height: 1.4;
}
#order-standard_cart.ls-configure .ls-config-hero p,
#order-standard_cart.ls-viewcart .ls-config-hero p {
  margin: 0;
  max-width: 46em;
  color: #3d5a55;
  font-size: 14.5px;
  font-weight: 600;
  line-height: 1.9;
}

/* ---- main config panel ---- */
#order-standard_cart.ls-configure .ls-config-panel {
  background: #fff;
  border: 1px solid #dcebe7;
  border-radius: 24px;
  padding: 24px 26px 20px;
  box-shadow: 0 1px 2px rgba(14, 43, 39, 0.03), 0 20px 44px -24px rgba(20, 97, 87, 0.16);
}
#order-standard_cart .ls-product-specs {
  background: linear-gradient(180deg, #f6fbfa 0%, #fff 100%);
  border: 1px solid #e2efeb;
  border-radius: 18px;
  padding: 20px 20px 18px;
  margin-bottom: 24px;
}
#order-standard_cart .ls-specs-heading {
  margin: 0 0 14px;
  color: #0b3d37;
  font-size: 15px;
  font-weight: 800;
}
#order-standard_cart .ls-spec-grid {
  grid-template-columns: repeat(auto-fill, minmax(208px, 1fr));
  gap: 10px;
}
#order-standard_cart .ls-spec {
  min-height: 44px;
  padding: 8px 12px 8px 8px;
  background: #fff;
  border: 1px solid #e5f0ed;
  border-radius: 13px;
  color: #243140;
  font-size: 13px;
  font-weight: 700;
  transition: border-color 0.15s ease, box-shadow 0.15s ease;
}
#order-standard_cart .ls-spec:hover {
  border-color: #9cc9c1;
  box-shadow: 0 6px 14px -10px rgba(20, 97, 87, 0.35);
}
#order-standard_cart .ls-spec::before {
  content: "\f00c";
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 auto;
  width: 22px;
  height: 22px;
  border-radius: 8px;
  background: #19615c;
  color: #fff;
  font-family: "Font Awesome 5 Pro", "Font Awesome 5 Free", "Font Awesome 5 Duotone";
  font-weight: 900;
  font-size: 10px;
}

/* ---- billing cycle cards ---- */
#order-standard_cart .ls-billing-wrap .form-group > label {
  display: block;
  margin-bottom: 12px;
  color: #0b3d37;
  font-size: 15px;
  font-weight: 800;
}
#order-standard_cart .ls-billing-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 18px 14px;
  margin-bottom: 0;
  padding-top: 6px;
}
@media (min-width: 1200px) {
  #order-standard_cart .ls-billing-grid {
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  }
}
#order-standard_cart .ls-billing-card {
  min-height: 88px;
  padding: 16px 16px 13px;
  background: #f7fbfa;
  border: 1.5px solid #dfe9e7;
  border-radius: 16px;
  color: #243140;
  gap: 6px;
  transition: border-color 0.16s ease, background 0.16s ease, box-shadow 0.16s ease, transform 0.16s ease;
}
#order-standard_cart .ls-billing-card:hover {
  border-color: #19615c;
  background: #fff;
  transform: translateY(-2px);
  box-shadow: 0 12px 26px -16px rgba(20, 97, 87, 0.45);
}
#order-standard_cart .ls-billing-card:focus-visible {
  outline: none;
  border-color: #19615c;
  box-shadow: 0 0 0 4px rgba(25, 97, 92, 0.18);
}
#order-standard_cart .ls-billing-card.is-active {
  background: #fff;
  border-color: #19615c;
  box-shadow: 0 0 0 4px rgba(25, 97, 92, 0.13), 0 14px 28px -18px rgba(20, 97, 87, 0.5);
  transform: none;
}
#order-standard_cart .ls-billing-card.is-active .ls-billing-period { color: #19615c; }
#order-standard_cart .ls-billing-period {
  color: #5c6b7a;
  font-size: 12px;
  font-weight: 800;
}
#order-standard_cart .ls-billing-price {
  color: #0b3d37;
  font-size: 16px;
  font-weight: 800;
  line-height: 1.5;
}
#order-standard_cart .ls-billing-badge {
  top: -10px;
  inset-inline-end: 12px;
  padding: 3px 10px;
  border-radius: 999px;
  background: #19615c;
  color: #fff;
  font-size: 10.5px;
  font-weight: 800;
  box-shadow: 0 0 0 3px #fff;
}
/* soft tint for the featured (recommended) card when not active */
#order-standard_cart .ls-billing-featured:not(.is-active) {
  background: #f2f9f7;
  border-color: #bcd8d1;
}

/* ---- form fields ---- */
#order-standard_cart.ls-configure input[type="radio"],
#order-standard_cart.ls-configure input[type="checkbox"] {
  accent-color: #19615c;
}
#order-standard_cart.ls-configure .form-control {
  border-color: #dfe9e7;
  border-radius: 12px;
  box-shadow: none;
  transition: border-color 0.15s ease, box-shadow 0.15s ease;
}
#order-standard_cart.ls-configure .form-control:focus {
  border-color: #19615c;
  box-shadow: 0 0 0 3px rgba(25, 97, 92, 0.14);
}
#order-standard_cart.ls-configure .sub-heading {
  margin: 26px 0 12px;
}
#order-standard_cart.ls-configure .product-configurable-options .form-group,
#order-standard_cart.ls-configure .field-container .form-group {
  background: #f8fcfb;
  border: 1px solid #e5f0ed;
  border-radius: 14px;
  padding: 16px 18px;
  transition: border-color 0.15s ease;
}
#order-standard_cart.ls-configure .product-configurable-options .form-group:hover,
#order-standard_cart.ls-configure .field-container .form-group:hover {
  border-color: #bcd8d1;
}
#order-standard_cart.ls-configure .form-group > label {
  color: #243140;
  font-weight: 800;
}

/* the twenty-one theme hides all .fas icons globally (icons.css) — restore only
   the three functional icons used on this page, scoped and safe */
#order-standard_cart.ls-configure .ls-config-help i,
#order-standard_cart.ls-configure .order-summary .loader i,
#order-standard_cart.ls-configure #btnCompleteProductConfig i {
  display: inline-flex !important;
}
#order-standard_cart.ls-configure .order-summary .loader i { font-size: 22px; color: #19615c; }
#order-standard_cart.ls-configure #btnCompleteProductConfig i { font-size: 17px; }

/* ---- help banner ---- */
#order-standard_cart .ls-config-help {
  align-items: center;
  gap: 14px;
  margin-top: 24px;
  padding: 14px 18px;
  background: linear-gradient(135deg, #f3faf9 0%, #fff 100%);
  border: 1px solid #dcebe7;
  border-radius: 16px;
  color: #3d5a55;
  font-size: 13.5px;
  font-weight: 600;
}
#order-standard_cart .ls-config-help i {  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 auto;
  width: 40px;
  height: 40px;
  margin-top: 0;
  border-radius: 13px;
  background: linear-gradient(135deg, #134a47, #19615c);
  color: #fff;
  font-size: 16px;
  box-shadow: 0 8px 18px -10px rgba(20, 97, 87, 0.6);
}
#order-standard_cart .ls-config-help a {
  color: #19615c;
  font-weight: 800;
  text-underline-offset: 3px;
}

/* ---- order summary card ---- */
#order-standard_cart .order-summary {
  position: relative;
  border: 1px solid #d9e8e4 !important;
  border-radius: 22px !important;
  box-shadow: 0 1px 2px rgba(14, 43, 39, 0.03), 0 26px 52px -28px rgba(20, 97, 87, 0.28) !important;
}
#order-standard_cart .order-summary .loader {
  position: absolute;
  inset: 0;
  z-index: 2;
  display: none;
  align-items: center;
  justify-content: center;
  margin: 0;
  border-radius: 22px;
  background: rgba(255, 255, 255, 0.75);
  backdrop-filter: blur(2px);
}
#order-standard_cart .order-summary .loader[style*="block"],
#order-standard_cart .order-summary .loader[style*="flex"] { display: flex; }
#order-standard_cart .order-summary .loader.w-hidden { display: none; }
#order-standard_cart .order-summary h2 {
  margin: 0;
  padding: 15px 18px;
  background: linear-gradient(135deg, #0f564f 0%, #19615c 55%, #25766e 100%);
  color: #fff;
  text-align: center;
  font-size: 15px !important;
  font-weight: 800;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 9px;
}
#order-standard_cart .order-summary h2::before {
  content: "\f290";
  font-family: "Font Awesome 5 Pro", "Font Awesome 5 Free";
  font-weight: 900;
  font-size: 15px;
  opacity: 0.9;
}
#order-standard_cart .summary-container {
  min-height: 0;
  padding: 18px 18px 6px;
  font-size: 13.5px;
  color: #243140;
}
#order-standard_cart .order-summary .product-name {
  display: block;
  color: #0b3d37;
  font-size: 15px;
  font-weight: 800;
  line-height: 1.6;
}
#order-standard_cart .order-summary .product-group {
  display: block;
  margin-bottom: 12px;
  color: #647c78;
  font-size: 12.5px;
  font-weight: 600;
}
#order-standard_cart .order-summary .clearfix {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  gap: 12px;
  padding: 7px 0;
  margin-bottom: 0;
}
#order-standard_cart .order-summary .clearfix::before,
#order-standard_cart .order-summary .clearfix::after { content: none; }
#order-standard_cart .order-summary .float-left,
#order-standard_cart .order-summary .float-right {
  float: none !important;
}
#order-standard_cart .order-summary .pull-left {
  color: #647c78;
  font-weight: 600;
  font-size: 13px;
}
#order-standard_cart .order-summary .pull-right {
  color: #243140;
  font-weight: 700;
}
#order-standard_cart .order-summary .summary-totals {
  margin-top: 12px;
  padding-top: 10px;
  border-top: 1px dashed #dfe9e7;
}
#order-standard_cart .order-summary .total-due-today {
  display: flex;
  flex-direction: column;
  align-items: center;
  margin-top: 14px;
  padding: 14px 16px 16px;
  border: 0;
  border-radius: 14px;
  background: linear-gradient(135deg, #eefaf6 0%, #ddf3ec 100%);
  text-align: center;
}
#order-standard_cart .order-summary .total-due-today .amt { order: 2; }
#order-standard_cart .order-summary .total-due-today span {
  color: #3d5a55;
  font-size: 12.5px;
  font-weight: 700;
  letter-spacing: 0.2px;
}
#order-standard_cart .order-summary .total-due-today .amt {
  display: block;
  margin-top: 4px;
  color: #0b3d37;
  font-size: 1.9rem;
  font-weight: 800;
  letter-spacing: 0.2px;
}
/* ---- summary CTA ---- */
#order-standard_cart .ls-summary-actions,
#order-standard_cart #orderSummary .text-center {
  padding: 10px 18px 18px;
}
#order-standard_cart #btnCompleteProductConfig {
  width: 100%;
  min-height: 54px;
  border: 0;
  border-radius: 14px;
  background: linear-gradient(135deg, #134a47 0%, #19615c 55%, #23776e 100%);
  color: #fff;
  font-weight: 800;
  letter-spacing: 0.2px;
  box-shadow: 0 16px 30px -14px rgba(20, 97, 87, 0.55);
  transition: transform 0.16s ease, box-shadow 0.16s ease, filter 0.16s ease;
}
#order-standard_cart #btnCompleteProductConfig:hover {
  transform: translateY(-1px);
  filter: brightness(1.06);
  box-shadow: 0 20px 34px -14px rgba(20, 97, 87, 0.65);
}
#order-standard_cart #btnCompleteProductConfig:focus-visible {
  outline: none;
  box-shadow: 0 0 0 4px rgba(25, 97, 92, 0.3);
}
#order-standard_cart #btnCompleteProductConfig i {
  margin-inline-start: 6px;
  transition: transform 0.16s ease;
}
#order-standard_cart #btnCompleteProductConfig:hover i {
  transform: translateX(-3px);
}

/* ---- responsive ---- */
@media (max-width: 991.98px) {
  #order-standard_cart.ls-configure form > .row {
    grid-template-columns: minmax(0, 1fr);
    gap: 20px;
  }
  #order-standard_cart.ls-configure .secondary-cart-sidebar {
    grid-column: 1;
    position: static;
  }
  #order-standard_cart.ls-configure #orderSummary { position: static; }
}
@media (max-width: 767.98px) {
  #order-standard_cart.ls-configure .ls-config-hero {
    padding: 24px 22px 22px;
    border-radius: 20px;
  }
  #order-standard_cart.ls-configure .ls-config-hero h1 { font-size: 24px; }
  #order-standard_cart.ls-configure .ls-config-hero p { font-size: 13.5px; }
  #order-standard_cart.ls-configure .ls-config-hero::after { display: none; }
  #order-standard_cart.ls-configure .ls-config-panel {
    padding: 18px 16px 16px;
    border-radius: 20px;
  }
  #order-standard_cart .ls-product-specs { padding: 16px 14px 14px; }
  #order-standard_cart .ls-spec-grid { gap: 8px; }
  #order-standard_cart .ls-spec { font-size: 12.5px; padding: 7px 10px 7px 7px; }
}
@media (max-width: 460px) {
  #order-standard_cart .ls-billing-grid {
    grid-template-columns: 1fr;
  }
  #order-standard_cart .ls-spec-grid {
    grid-template-columns: 1fr;
  }
  #order-standard_cart .ls-billing-card {
    min-height: 0;
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
    padding: 13px 15px;
  }
  #order-standard_cart .ls-billing-card .ls-billing-price { order: -1; }
  #order-standard_cart .ls-billing-card .ls-billing-period { order: 0; }
  #order-standard_cart .ls-billing-badge {
    top: auto;
    bottom: -9px;
  }
  #order-standard_cart .order-summary .total-due-today .amt { font-size: 1.6rem; }
}

/* reduced motion respect */
@media (prefers-reduced-motion: reduce) {
  #order-standard_cart .ls-billing-card,
  #order-standard_cart #btnCompleteProductConfig,
  #order-standard_cart #btnCompleteProductConfig i {
    transition: none !important;
  }
}

/* ============================================================
   LS Cart — view cart page
   scope: #order-standard_cart.ls-viewcart
   ============================================================ */

#order-standard_cart.ls-viewcart > .row > .cart-sidebar,
#order-standard_cart.ls-viewcart .sidebar-collapsed {
  display: none !important;
}
#order-standard_cart.ls-viewcart > .row > .cart-body {
  width: 100% !important;
  float: none !important;
  padding-left: 15px;
  padding-right: 15px;
}
@media (min-width: 992px) {
  body.ls-page-viewcart #main-body > .container {
    max-width: 1180px;
  }
}

/* ---- two-column layout: cart (main) + summary (side) ---- */
#order-standard_cart.ls-viewcart .row:has(> .secondary-cart-body) {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 316px;
  gap: 24px;
  align-items: start;
  margin: 0;
}
#order-standard_cart.ls-viewcart .secondary-cart-body,
#order-standard_cart.ls-viewcart .secondary-cart-sidebar {
  width: auto !important;
  max-width: none !important;
  float: none !important;
  margin: 0;
  padding: 0;
  min-width: 0;
}
#order-standard_cart.ls-viewcart .secondary-cart-body { grid-column: 1; }
#order-standard_cart.ls-viewcart .secondary-cart-sidebar {
  grid-column: 2;
  position: sticky;
  top: 96px;
}
#order-standard_cart.ls-viewcart #orderSummary {
  position: sticky;
  top: 96px;
}
#order-standard_cart.ls-viewcart #scrollingPanelContainer {
  position: static !important;
  width: auto !important;
  float: none !important;
}

/* ---- shared icons: restore the FA glyphs the theme hides,
   ONLY for the icons used on this page ---- */
#order-standard_cart.ls-viewcart .view-cart-empty i,
#order-standard_cart.ls-viewcart .view-cart-items .item-title i,
#order-standard_cart.ls-viewcart .empty-cart .btn i,
#order-standard_cart.ls-viewcart .view-cart-tabs .prepend-icon .field-icon i,
#order-standard_cart.ls-viewcart #checkout i,
#order-standard_cart.ls-viewcart .order-summary .loader i {
  display: inline-flex !important;
  font-family: "Font Awesome 5 Pro", "Font Awesome 5 Free";
}
#order-standard_cart.ls-viewcart .order-summary .loader i {
  font-size: 22px;
  color: #19615c;
}

/* ---- items list ---- */
#order-standard_cart.ls-viewcart .view-cart-items-header {
  display: flex;
  align-items: center;
  gap: 10px;
  margin: 0 0 14px;
  padding: 0 4px;
  color: #0b3d37;
  font-size: 15px;
  font-weight: 800;
}
#order-standard_cart.ls-viewcart .view-cart-items-header .row > div:not(:first-child) { display: none; }
#order-standard_cart.ls-viewcart .view-cart-items-header .row,
#order-standard_cart.ls-viewcart .view-cart-items-header .row > div {
  display: block;
  width: 100%;
  max-width: 100%;
  flex: 0 0 auto;
  margin: 0;
  padding: 0;
  white-space: nowrap;
}
#order-standard_cart.ls-viewcart .view-cart-items-header::before {
  content: "";
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: #1fc08b;
  box-shadow: 0 0 0 3px rgba(31, 192, 139, 0.18);
  flex: 0 0 auto;
}
#order-standard_cart.ls-viewcart .view-cart-items .item {
  margin: 0 0 14px;
  padding: 18px 20px;
  background: #fff;
  border: 1px solid #e3eef1;
  border-radius: 18px;
  box-shadow: 0 1px 2px rgba(14, 43, 39, 0.03), 0 16px 36px -24px rgba(20, 97, 87, 0.22);
  transition: border-color 0.16s ease, box-shadow 0.16s ease;
}
#order-standard_cart.ls-viewcart .view-cart-items .item:hover {
  border-color: #bcd8d1;
  box-shadow: 0 1px 2px rgba(14, 43, 39, 0.03), 0 20px 40px -24px rgba(20, 97, 87, 0.35);
}
#order-standard_cart.ls-viewcart .view-cart-items .item-title {
  margin-bottom: 6px;
  color: #0b3d37;
  font-size: 16px;
  font-weight: 800;
}
#order-standard_cart.ls-viewcart .view-cart-items .item-title .btn-link,
#order-standard_cart.ls-viewcart .view-cart-items .btn-remove-from-cart {
  align-items: center;
  gap: 6px;
  padding: 5px 11px;
  border-radius: 10px;
  background: #f2f9f7;
  color: #19615c;
  font-size: 12.5px;
  font-weight: 800;
  transition: background 0.15s ease, color 0.15s ease;
}
#order-standard_cart.ls-viewcart .view-cart-items .item-title .btn-link:hover,
#order-standard_cart.ls-viewcart .view-cart-items .btn-remove-from-cart:hover {
  background: #e4f2ee;
  color: #0b3d37;
}
#order-standard_cart.ls-viewcart .view-cart-items .btn-remove-from-cart:hover { color: #b3402f; }
#order-standard_cart.ls-viewcart .view-cart-items .item-group {
  color: #647c78;
  font-size: 13px;
  font-weight: 700;
}
#order-standard_cart.ls-viewcart .view-cart-items .item-domain {
  color: #19615c;
  font-size: 13.5px;
  font-weight: 800;
}
#order-standard_cart.ls-viewcart .view-cart-items .item-price span:not(.cycle):not(.renewal-price):not(.caret) {
  color: #134a47;
  font-size: 17px;
  font-weight: 800;
}
#order-standard_cart.ls-viewcart .view-cart-items .item-price .cycle {
  color: #647c78;
  font-size: 12.5px;
  font-weight: 700;
}
#order-standard_cart.ls-viewcart .empty-cart .btn {
  align-items: center;
  gap: 7px;
  padding: 8px 0;
  background: transparent;
  color: #8a97a6;
  font-weight: 700;
}
#order-standard_cart.ls-viewcart .empty-cart .btn:hover { color: #b3402f; }

/* ---- empty cart state ---- */
#order-standard_cart.ls-viewcart .view-cart-empty {
  padding: 48px 24px 42px;
  text-align: center;
  border: 1px solid #e2efeb;
  border-radius: 22px;
  background: linear-gradient(180deg, #f8fcfb 0%, #fff 100%);
  color: #3d5a55;
  font-size: 15px;
  font-weight: 700;
  box-shadow: 0 1px 2px rgba(14, 43, 39, 0.03), 0 20px 44px -28px rgba(20, 97, 87, 0.2);
}
#order-standard_cart.ls-viewcart .view-cart-empty i {
  align-items: center;
  justify-content: center;
  width: 88px;
  height: 88px;
  margin: 0 auto 16px;
  border-radius: 26px;
  background: linear-gradient(135deg, #eef8f4 0%, #d9efe8 100%);
  color: #19615c;
  font-size: 36px;
  box-shadow: 0 14px 30px -18px rgba(20, 97, 87, 0.45);
}
#order-standard_cart.ls-viewcart .view-cart-empty p {
  margin: 0 0 20px;
  color: #3d5a55;
  font-size: 15.5px;
  font-weight: 700;
}
#order-standard_cart.ls-viewcart .view-cart-empty .btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 220px;
  min-height: 52px;
  padding: 12px 24px;
  border: 0;
  border-radius: 14px;
  background: linear-gradient(135deg, #134a47 0%, #19615c 55%, #23776e 100%);
  color: #fff;
  font-weight: 800;
  letter-spacing: 0.2px;
  box-shadow: 0 16px 30px -14px rgba(20, 97, 87, 0.55);
  transition: transform 0.16s ease, filter 0.16s ease, box-shadow 0.16s ease;
}
#order-standard_cart.ls-viewcart .view-cart-empty .btn:hover {
  transform: translateY(-1px);
  filter: brightness(1.06);
}

/* ---- promo code / tax tabs ---- */
#order-standard_cart.ls-viewcart .view-cart-tabs {
  margin: 0 0 18px;
  background: #fff;
  border: 1px solid #dcebe7;
  border-radius: 22px;
  overflow: hidden;
  box-shadow: 0 1px 2px rgba(14, 43, 39, 0.03), 0 20px 44px -28px rgba(20, 97, 87, 0.2);
}
#order-standard_cart.ls-viewcart .view-cart-tabs .nav-tabs {
  display: flex;
  gap: 4px;
  margin: 0;
  padding: 12px 14px 0;
  border-bottom: 1px solid #eef4f2;
}
#order-standard_cart.ls-viewcart .view-cart-tabs .nav-tabs .nav-link {
  margin: 0;
  padding: 10px 16px;
  border: 0;
  border-bottom: 2.5px solid transparent;
  border-radius: 0;
  color: #647c78;
  font-size: 13.5px;
  font-weight: 800;
  transition: color 0.15s ease, border-color 0.15s ease;
}
#order-standard_cart.ls-viewcart .view-cart-tabs .nav-tabs .nav-link:hover { color: #0b3d37; }
#order-standard_cart.ls-viewcart .view-cart-tabs .nav-tabs a[aria-selected="true"],
#order-standard_cart.ls-viewcart .view-cart-tabs .nav-tabs a[aria-expanded="true"],
#order-standard_cart.ls-viewcart .view-cart-tabs .nav-tabs .nav-link.active {
  background: transparent;
  border-color: transparent transparent #19615c;
  color: #0b3d37;
}
#order-standard_cart.ls-viewcart .view-cart-tabs .tab-content {
  padding: 18px 18px 20px;
  background: #fff;
}
#order-standard_cart.ls-viewcart .view-cart-tabs .prepend-icon .field {
  min-height: 52px;
  padding-inline-start: 48px;
  border: 1px solid #e3eef1;
  border-radius: 14px;
  box-shadow: none;
  transition: border-color 0.15s ease, box-shadow 0.15s ease;
}
#order-standard_cart.ls-viewcart .view-cart-tabs .prepend-icon .field:focus {
  border-color: #19615c;
  box-shadow: 0 0 0 3px rgba(25, 97, 92, 0.14);
}
#order-standard_cart.ls-viewcart .view-cart-tabs .prepend-icon .field-icon {
  width: 42px;
  color: #19615c;
  font-size: 15px;
}
#order-standard_cart.ls-viewcart .view-cart-tabs .btn-block {
  min-height: 50px;
  border: 0 !important;
  border-radius: 12px;
  background: linear-gradient(135deg, #134a47 0%, #19615c 55%, #23776e 100%) !important;
  color: #fff !important;
  font-weight: 800;
  letter-spacing: 0.2px;
  box-shadow: 0 14px 28px -14px rgba(20, 97, 87, 0.55);
  transition: transform 0.16s ease, filter 0.16s ease;
}
#order-standard_cart.ls-viewcart .view-cart-tabs .btn-block:hover {
  transform: translateY(-1px);
  filter: brightness(1.06);
}
#order-standard_cart.ls-viewcart .view-cart-promotion-code {
  margin: 0 0 12px;
  padding: 13px 15px;
  background: #f3faf9;
  border: 1px dashed #19615c;
  border-radius: 13px;
  color: #0b3d37;
  font-weight: 700;
}

/* ---- checkout CTA ---- */
#order-standard_cart.ls-viewcart #checkout:not(.w-hidden) {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  width: 100%;
  min-height: 54px;
  border: 0;
  border-radius: 14px;
  background: linear-gradient(135deg, #134a47 0%, #19615c 55%, #23776e 100%);
  color: #fff !important;
  font-weight: 800;
  letter-spacing: 0.2px;
  box-shadow: 0 16px 30px -14px rgba(20, 97, 87, 0.55);
  transition: transform 0.16s ease, box-shadow 0.16s ease, filter 0.16s ease;
}
#order-standard_cart.ls-viewcart #checkout:not(.disabled):hover:not(.disabled) {
  transform: translateY(-1px);
  filter: brightness(1.06);
}
#order-standard_cart.ls-viewcart #checkout.disabled {
  opacity: 0.6;
  filter: grayscale(0.35);
  cursor: not-allowed;
  box-shadow: none;
}
#order-standard_cart.ls-viewcart #continueShopping {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  margin-top: 10px;
  padding: 10px 14px;
  border-radius: 12px;
  background: #f2f9f7;
  color: #19615c;
  font-weight: 800;
  transition: background 0.15s ease, color 0.15s ease;
}
#order-standard_cart.ls-viewcart #continueShopping:hover {
  background: #e4f2ee;
  color: #0b3d37;
  text-decoration: none;
}

/* ---- responsive ---- */
@media (max-width: 991.98px) {
  #order-standard_cart.ls-viewcart .row:has(> .secondary-cart-body) {
    grid-template-columns: minmax(0, 1fr);
    gap: 20px;
  }
  #order-standard_cart.ls-viewcart .secondary-cart-sidebar {
    grid-column: 1;
    position: static;
  }
  #order-standard_cart.ls-viewcart #orderSummary { position: static; }
}
@media (max-width: 767.98px) {
  #order-standard_cart.ls-viewcart .ls-config-hero {
    padding: 24px 22px 22px;
    border-radius: 20px;
  }
  #order-standard_cart.ls-viewcart .ls-config-hero h1 { font-size: 24px; }
  #order-standard_cart.ls-viewcart .view-cart-empty {
    padding: 36px 18px 34px;
    border-radius: 20px;
  }
  #order-standard_cart.ls-viewcart .view-cart-empty i {
    width: 76px;
    height: 76px;
    font-size: 30px;
  }
  #order-standard_cart.ls-viewcart .view-cart-tabs .nav-tabs {
    padding: 10px 10px 0;
  }
  #order-standard_cart.ls-viewcart .view-cart-tabs .nav-tabs .nav-link {
    padding: 9px 12px;
    font-size: 12.5px;
  }
  #order-standard_cart.ls-viewcart .view-cart-tabs .tab-content {
    padding: 14px 12px 16px;
  }
}
@media (max-width: 575.98px) {
  #order-standard_cart.ls-viewcart .view-cart-items .item {
    padding: 15px 14px;
  }
}

/* ============================================================
   LS Cart — domain transfer page
   scope: body.ls-page-domaintransfer
   ============================================================ */

#order-standard_cart.ls-domain-transfer > .row > .cart-sidebar,
#order-standard_cart.ls-domain-transfer .sidebar-collapsed {
  display: none !important;
}
#order-standard_cart.ls-domain-transfer > .row > .cart-body {
  width: 100% !important;
  float: none !important;
  padding-left: 15px;
  padding-right: 15px;
}
@media (min-width: 992px) {
  body.ls-page-domaintransfer #main-body > .container {
    max-width: 1080px;
  }
}

/* ---- hero (same look as other cart pages) ---- */
#order-standard_cart.ls-domain-transfer .ls-config-hero {
  position: relative;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  text-align: start;
  padding: 30px 32px 28px;
  margin-bottom: 24px;
  border: 1px solid #cfe6df;
  border-radius: 24px;
  background:
    radial-gradient(420px 220px at 96% -40px, rgba(25, 97, 92, 0.10) 0%, rgba(25, 97, 92, 0) 70%),
    linear-gradient(135deg, #ffffff 0%, #eef8f4 55%, #ddf0ea 100%);
  box-shadow: 0 1px 2px rgba(14, 43, 39, 0.04), 0 18px 44px -18px rgba(20, 97, 87, 0.22);
}
#order-standard_cart.ls-domain-transfer .ls-config-hero h1 {
  margin: 0 0 8px;
  color: #0b3d37;
  font-size: 30px;
  font-weight: 800;
  line-height: 1.4;
}
#order-standard_cart.ls-domain-transfer .ls-config-hero p {
  margin: 0;
  max-width: 46em;
  color: #3d5a55;
  font-size: 14.5px;
  font-weight: 600;
  line-height: 1.9;
}
body.ls-page-domaintransfer #order-standard_cart .ls-config-kicker {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 12px;
  padding: 5px 14px;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.92);
  border: 1px solid #cfe6df;
  box-shadow: 0 6px 16px -10px rgba(20, 97, 87, 0.4);
  color: #19615c;
  font-size: 12px;
  font-weight: 800;
}
body.ls-page-domaintransfer #order-standard_cart .ls-config-kicker::before {
  content: "";
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: #1fc08b;
  box-shadow: 0 0 0 3px rgba(31, 192, 139, 0.18);
}

/* ---- transfer card ---- */
body.ls-page-domaintransfer #order-standard_cart .panel.card.panel-default {
  max-width: 640px;
  margin: 0 auto 14px;
  border: 1px solid #dcebe7;
  border-radius: 24px;
  background: #fff;
  overflow: hidden;
  box-shadow: 0 1px 2px rgba(14, 43, 39, 0.03), 0 26px 52px -28px rgba(20, 97, 87, 0.28);
}
body.ls-page-domaintransfer #order-standard_cart .panel.card.panel-default .panel-heading {
  margin: 0;
  padding: 15px 22px;
  background: linear-gradient(135deg, #0f564f 0%, #19615c 55%, #25766e 100%);
  border: 0;
}
body.ls-page-domaintransfer #order-standard_cart .panel-title {
  margin: 0;
  color: #fff;
  font-size: 16px !important;
  font-weight: 800;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 9px;
}
body.ls-page-domaintransfer #order-standard_cart .panel-title::before {
  content: "\f362";
  font-family: "Font Awesome 5 Pro", "Font Awesome 5 Free";
  font-weight: 900;
  font-size: 15px;
  opacity: 0.9;
}
body.ls-page-domaintransfer #order-standard_cart .panel-body {
  padding: 22px 24px 18px;
  background: #fff;
}
body.ls-page-domaintransfer #order-standard_cart .form-group > label {
  color: #243140;
  font-weight: 800;
  font-size: 13.5px;
  margin-bottom: 8px;
}
body.ls-page-domaintransfer #order-standard_cart .form-group label a {
  color: #19615c;
  font-weight: 800;
  display: inline-flex;
  align-items: center;
  gap: 6px;
}
body.ls-page-domaintransfer #order-standard_cart .form-group label a i {
  display: inline-flex !important;
}
body.ls-page-domaintransfer #order-standard_cart .form-group input.form-control {
  min-height: 50px;
  background: #f8fcfb;
  border: 1px solid #e3eef1;
  border-radius: 14px;
  box-shadow: none;
  transition: border-color 0.15s ease, box-shadow 0.15s ease;
}
body.ls-page-domaintransfer #order-standard_cart .form-group input.form-control:focus {
  background: #fff;
  border-color: #19615c;
  box-shadow: 0 0 0 3px rgba(25, 97, 92, 0.14);
}
body.ls-page-domaintransfer #order-standard_cart #transferUnavailable {
  border-radius: 13px;
  border: 1px solid #f5d68a;
  background: #fff8e8;
  color: #8a6116;
  font-weight: 700;
}

/* ---- captcha ---- */
body.ls-page-domaintransfer #order-standard_cart .default-captcha {
  margin-top: 16px;
  padding: 14px 16px;
  background: #f8fcfb;
  border: 1px solid #e5f0ed;
  border-radius: 16px;
}
body.ls-page-domaintransfer #order-standard_cart .default-captcha p {
  margin: 0 0 10px;
  color: #3d5a55;
  font-size: 13px;
  font-weight: 700;
}
body.ls-page-domaintransfer #order-standard_cart .default-captcha div {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  flex-wrap: wrap;
}
body.ls-page-domaintransfer #order-standard_cart .default-captcha img {
  height: 44px;
  border-radius: 10px;
  box-shadow: 0 6px 16px -10px rgba(20, 97, 87, 0.35);
}
body.ls-page-domaintransfer #order-standard_cart .default-captcha input {
  min-height: 44px;
  width: 170px;
  background: #fff;
  border: 1px solid #e3eef1;
  border-radius: 12px;
  text-align: center;
  font-weight: 800;
  letter-spacing: 2px;
  box-shadow: none;
}
body.ls-page-domaintransfer #order-standard_cart .default-captcha input:focus {
  border-color: #19615c;
  box-shadow: 0 0 0 3px rgba(25, 97, 92, 0.14);
}

/* ---- footer CTA ---- */
body.ls-page-domaintransfer #order-standard_cart .panel-footer {
  padding: 16px 22px;
  background: #fff;
  border: 0;
  border-top: 1px solid #eef4f2;
}
body.ls-page-domaintransfer #order-standard_cart #btnTransferDomain {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  width: 100%;
  min-height: 54px;
  padding: 12px 24px;
  border: 0;
  border-radius: 14px;
  background: linear-gradient(135deg, #134a47 0%, #19615c 55%, #23776e 100%);
  color: #fff !important;
  font-weight: 800;
  letter-spacing: 0.2px;
  box-shadow: 0 16px 30px -14px rgba(20, 97, 87, 0.55);
  transition: transform 0.16s ease, filter 0.16s ease;
}
body.ls-page-domaintransfer #order-standard_cart #btnTransferDomain:hover {
  transform: translateY(-1px);
  filter: brightness(1.06);
}
body.ls-page-domaintransfer #order-standard_cart #btnTransferDomain .loader i {
  display: inline-flex !important;
}

/* ---- footnote ---- */
body.ls-page-domaintransfer #order-standard_cart p.small {
  margin-top: 6px;
  color: #647c78;
  font-size: 12.5px;
  font-weight: 600;
}

/* ---- branded tooltips (validation hints) ---- */
body.ls-page-domaintransfer .tooltip {
  font-size: 12px;
  font-weight: 700;
}
body.ls-page-domaintransfer .tooltip .tooltip-inner {
  max-width: 280px;
  padding: 9px 14px;
  border: 1px solid #0f564f;
  border-radius: 12px;
  background: linear-gradient(135deg, #134a47 0%, #19615c 100%);
  color: #fff;
  font-family: inherit;
  letter-spacing: 0;
  box-shadow: 0 14px 30px -14px rgba(20, 97, 87, 0.7);
}

/* ============================================================
   LS Affiliates — dashboard (twenty-one theme)
   scope: .ls-aff
   ============================================================ */

/* ---- hero subtitle ---- */
.ls-aff-hero p {
  margin: 10px 0 0;
  max-width: 560px;
  color: #3d5a55;
  font-size: 15px;
  font-weight: 600;
  line-height: 1.9;
}

/* ---- stat cards ---- */
.ls-aff .affiliate-stat {
  justify-content: flex-start;
  min-height: 148px;
  padding: 20px 20px 18px;
  border: 1px solid #e2efeb !important;
  border-radius: 20px;
  background: linear-gradient(180deg, #f9fdfc 0%, #fff 100%) !important;
  color: #3d5a55 !important;
  font-size: 13.5px !important;
  font-weight: 700;
  transition: transform 0.16s ease, box-shadow 0.16s ease;
}
.ls-aff .affiliate-stat:hover {
  transform: translateY(-2px);
  box-shadow: 0 14px 30px -18px rgba(20, 97, 87, 0.45);
}
.ls-aff .affiliate-stat i,
.ls-aff .affiliate-stat span {
  float: none !important;
}
.ls-aff .affiliate-stat i {
  /* the theme hides .fas globally — must win with !important */
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  width: 50px;
  height: 50px;
  margin: 0 0 14px;
  border-radius: 15px;
  background: linear-gradient(135deg, #134a47 0%, #19615c 55%, #23776e 100%) !important;
  color: #fff !important;
  font-family: "Font Awesome 5 Pro", "Font Awesome 5 Free";
  font-size: 19px;
  box-shadow: 0 10px 22px -12px rgba(20, 97, 87, 0.6);
}
.ls-aff .affiliate-stat span {
  margin: 0 0 6px;
  color: #0b3d37 !important;
  font-size: 34px !important;
  font-weight: 800 !important;
}

/* ---- referral link card ---- */
.ls-aff .ls-aff-link-card .h3 {
  margin: 0 0 14px;
  color: #0b3d37;
  font-size: 17px !important;
  font-weight: 800;
}
.ls-aff .ls-aff-link-row {
  display: flex;
  gap: 10px;
  align-items: stretch;
}
.ls-aff .ls-aff-link-row .form-control {
  flex: 1 1 auto;
  min-height: 54px;
  direction: ltr;
  text-align: left;
  background: #f6faf9;
  border: 1px solid #e3eef1;
  border-radius: 14px;
  color: #0b3d37;
  font-size: 14px;
  font-weight: 700;
}
.ls-aff .ls-aff-link-row .form-control:focus {
  border-color: #bcd8d1;
  box-shadow: none;
}
.ls-aff .ls-copy-btn {
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-height: 54px;
  min-width: 108px;
  padding: 12px 20px;
  border: 0;
  border-radius: 14px;
  background: linear-gradient(135deg, #134a47 0%, #19615c 55%, #23776e 100%);
  color: #fff !important;
  font-weight: 800;
  box-shadow: 0 14px 28px -14px rgba(20, 97, 87, 0.55);
  transition: transform 0.16s ease, filter 0.16s ease;
}
.ls-aff .ls-copy-btn:hover {
  transform: translateY(-1px);
  filter: brightness(1.06);
}
.ls-aff .ls-copy-btn i {
  display: inline-flex !important;
}
@media (max-width: 575.98px) {
  .ls-aff .ls-aff-link-row { flex-direction: column; }
  .ls-aff .ls-copy-btn { width: 100%; }
}

/* ---- balance card ---- */
.ls-aff .ls-aff-balance-card {
  border: 1px solid #e2efeb;
  border-radius: 22px;
  box-shadow: 0 1px 2px rgba(14, 43, 39, 0.03), 0 20px 44px -26px rgba(20, 97, 87, 0.2);
}
.ls-aff .ls-aff-balance-card .table {
  margin: 4px 0 16px;
  border: 0;
}
.ls-aff .ls-aff-balance-card .table-striped tbody tr:nth-of-type(odd),
.ls-aff .ls-aff-balance-card .table-striped tbody tr:nth-of-type(even) {
  background: transparent;
}
.ls-aff .ls-aff-balance-card .table td {
  padding: 14px 6px;
  border: 0 !important;
  border-bottom: 1px dashed #dfe9e7 !important;
  background: transparent !important;
  vertical-align: middle;
}
.ls-aff .ls-aff-balance-card .table tr:last-child td {
  border-bottom: 0 !important;
}
.ls-aff .ls-aff-balance-card .table td:first-child {
  color: #647c78;
  font-size: 13.5px;
  font-weight: 700;
}
.ls-aff .ls-aff-balance-card .table strong {
  color: #0b3d37 !important;
  font-size: 15.5px;
  font-weight: 800 !important;
}

/* ---- section title ---- */
.ls-aff .ls-aff-section-title {
  margin: 26px 0 14px;
  color: #0b3d37;
  font-size: 19px;
  font-weight: 800;
}

/* ---- referrals data table + card ---- */
.ls-aff .card {
  border: 1px solid #e2efeb;
  border-radius: 22px;
  box-shadow: 0 1px 2px rgba(14, 43, 39, 0.03), 0 20px 44px -26px rgba(20, 97, 87, 0.2);
}
.ls-aff .card .card-body { border-radius: inherit; }
.ls-aff .dataTables_filter input,
.ls-aff input[type="search"] {
  min-height: 42px;
  border: 1px solid #e3eef1 !important;
  border-radius: 12px !important;
  box-shadow: none;
  transition: border-color 0.15s ease, box-shadow 0.15s ease;
}
.ls-aff .dataTables_filter input:focus {
  border-color: #19615c !important;
}
.ls-aff .dataTables_length select {
  min-height: 42px;
  border: 1px solid #e3eef1 !important;
  border-radius: 12px !important;
  box-shadow: none;
}
.ls-aff table.table-list {
  border-radius: 14px;
  overflow: hidden;
}
.ls-aff table.table-list thead th {
  border: 0 !important;
  background: #f4f9f8;
  color: #0b3d37;
  font-size: 13px;
  font-weight: 800;
  white-space: nowrap;
}
.ls-aff table.table-list tbody td {
  border: 0 !important;
  border-bottom: 1px solid #eff4f3 !important;
  background: transparent !important;
  color: #243140;
  font-weight: 600;
}
.ls-aff table.table-list tbody tr:hover td {
  background: #f7fbfa !important;
}
.ls-aff table.table-list tbody tr:last-child td { border-bottom: 0 !important; }

/* ============================================================
   LS Store v2 — group listing page (orderforms/standard_cart)
   matches Order.dc mock: sidebar cards + hero + plan cards
   scope: body.ls-page-products, .ls2
   ============================================================ */

body.ls-page-products #main-body > .container { max-width: 1280px; padding: 0 24px; }
/* base stroke-icon sizing for the mock svgs in this scope */
body.ls-page-products .ic { width: 20px; height: 20px; flex: none; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
body.ls-page-products .sm { width: 16px; height: 16px; }
body .ls2-row {
  display: grid;
  grid-template-columns: 320px minmax(0, 1fr);
  gap: 24px;
  align-items: start;
  margin: 0;
}
body .ls2-side {
  display: flex;
  flex-direction: column;
  gap: 20px;
  min-width: 0;
}
body .ls2-main {
  display: flex;
  flex-direction: column;
  gap: 20px;
  min-width: 0;
}
body #order-standard_cart .cart-sidebar,
body #order-standard_cart .cart-body {
  width: 100% !important;
  float: none !important;
  padding: 0;
  margin: 0;
}

/* ---- shared bits ---- */
body .ls2-panel.card {
  background: #fff;
  border: 1px solid #e2ebe8;
  border-radius: 24px;
  box-shadow: 0 1px 2px rgba(14, 43, 39, 0.04), 0 14px 34px -14px rgba(14, 43, 39, 0.12);
}
/* base .ib: always a centered flex chip (sizes come from context) */
body .ib {
  display: flex;
  align-items: center;
  justify-content: center;
  flex: none;
}
body .ls2-panel a:focus-visible,
body .ls2-panel button:focus-visible { outline: 3px solid #7fd6c0; outline-offset: 2px; }

/* ---- sidebar panels ---- */
body .ls2-panel {
  padding-bottom: 12px;
}
body .ls2-panel-head {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 20px 22px 12px;
}
body .ls2-panel-head h2 {
  margin: 0;
  color: #0b3d37;
  font-size: 16px;
  font-weight: 800;
}
body .ls2-panel-head .ib {
  width: 40px;
  height: 40px;
  border-radius: 12px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0;
  flex: none;
}
body .ls2-panel-head .ib .ic { width: 20px; height: 20px; flex: none; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
body .ls2-ib-grid { background: #dcf0ea; color: #146157; }
body .ls2-ib-bolt { background: #fff0d2; color: #8a5200; }
body .ls2-panel-body {
  display: flex;
  flex-direction: column;
  padding: 0 12px;
}
body .ls2-panel-body .cat {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 11px 14px;
  border-radius: 14px;
  color: #3d5a55;
  font-size: 14px;
  font-weight: 600;
  text-decoration: none;
  transition: background 0.15s ease, color 0.15s ease;
}
body .ls2-panel-body .cat i {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: #a9d6c9;
  flex: none;
  transition: background 0.15s ease;
}
body .ls2-panel-body .cat:hover { background: #f1f8f5; color: #146157; }
body .ls2-panel-body .cat:hover i { background: #146157; }
body .ls2-panel-body .cat.on {
  background: #dcf0ea;
  color: #0f4d45;
  font-weight: 800;
}
body .ls2-panel-body .cat.on i {
  background: #146157;
  box-shadow: 0 0 0 4px rgba(20, 97, 87, 0.16);
}

/* operations rows */
body .ls2-panel-body .row.ls2-op-row {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 10px;
  border-radius: 14px;
  color: #0e2b27;
  font-size: 14px;
  font-weight: 600;
  text-decoration: none;
  transition: background 0.15s ease;
}
body .ls2-panel-body .row.ls2-op-row:hover { background: #f1f8f5; }
body .ls2-panel-body .row.ls2-op-row .ib {
  width: 36px;
  height: 36px;
  border-radius: 11px;
}
body .ls2-panel-body .row.ls2-op-row .ic { width: 16px; height: 16px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }

/* ---- hero ---- */
body.ls-page-products .ls2-hero {
  position: relative;
  overflow: hidden;
  border-radius: 28px;
  border: 1px solid #d3eae2;
  background: linear-gradient(135deg, #ffffff 0%, #eaf7f2 48%, #d9efe8 100%);
  padding: 36px 40px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 32px;
  box-shadow: 0 1px 2px rgba(14, 43, 39, 0.04), 0 18px 44px -18px rgba(20, 97, 87, 0.25);
}
body.ls-page-products .ls2-hero-dots {
  position: absolute;
  inset: 0;
  background-image: radial-gradient(rgba(20, 97, 87, 0.16) 1.3px, transparent 1.4px);
  background-size: 20px 20px;
  -webkit-mask-image: linear-gradient(to left, transparent 25%, #000 100%);
  mask-image: linear-gradient(to left, transparent 25%, #000 100%);
  pointer-events: none;
}
body.ls-page-products .ls2-hero-glow {
  position: absolute;
  left: -40px;
  bottom: -110px;
  width: 340px;
  height: 340px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(47, 181, 155, 0.28), rgba(47, 181, 155, 0) 70%);
  pointer-events: none;
}
body.ls-page-products .ls2-hero-body {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 14px;
  min-width: 0;
  flex: 1;
}
body.ls-page-products .ls2-hero-chip {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 6px 14px;
  border-radius: 999px;
  background: #fff;
  border: 1px solid #cfe6df;
  color: #146157;
  font-size: 13px;
  font-weight: 700;
}
body.ls-page-products .ls2-hero-chip .dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: #1fc08b;
  box-shadow: 0 0 0 4px rgba(31, 192, 139, 0.2);
}
body.ls-page-products .ls2-hero-body h1 {
  margin: 0;
  color: #0b3d37;
  font-size: 42px;
  line-height: 1.4; /* rtl-design: Persian heading floor */
  font-weight: 800;
  letter-spacing: 0; /* rtl-design: never track Persian script */
}
body.ls-page-products .ls2-hero-body p {
  margin: 0;
  color: #3d5a55;
  font-size: 16px;
  line-height: 1.9;
  max-width: 460px;
}
body.ls-page-products .ls2-hero-art { position: relative; flex: none; width: 200px; height: 150px; }

/* ---- plans grid ---- */
body.ls-page-products .ls2-plans {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
  gap: 20px;
  align-items: stretch;
}

/* ---- plan card ---- */
body.ls-page-products .plan {
  display: flex;
  flex-direction: column;
  gap: 20px;
  padding: 24px 20px 20px;
  text-align: start;
  transition: transform 0.2s ease, box-shadow 0.2s ease, border-color 0.2s ease;
}
body.ls-page-products .plan:hover {
  transform: translateY(-4px);
  border-color: #b9ddd2;
  box-shadow: 0 2px 4px rgba(14, 43, 39, 0.04), 0 26px 44px -18px rgba(20, 97, 87, 0.32);
}
body.ls-page-products .plan header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}
body.ls-page-products .plan header .ls2-plan-group {
  color: #567069;
  font-size: 13px;
  font-weight: 600;
}
body.ls-page-products .plan header h2 {
  margin: 2px 0 0;
  color: #0b3d37;
  font-size: 22px;
  font-weight: 800;
}
body.ls-page-products .tier {
  display: flex;
  align-items: flex-end;
  gap: 3px;
  height: 22px;
}
body.ls-page-products .tier b {
  width: 6px;
  border-radius: 3px;
  background: #cfe6df;
}
body.ls-page-products .tier b:first-child { height: 8px; }
body.ls-page-products .tier b:nth-child(2) { height: 15px; }
body.ls-page-products .tier b:nth-child(3) { height: 22px; }
body.ls-page-products .tier b.f { background: #146157; }

body.ls-page-products .ls2-pricebox {
  display: flex;
  flex-direction: column;
  gap: 10px;
}
body.ls-page-products .ls2-price {
  display: flex;
  align-items: baseline;
  gap: 8px;
  flex-wrap: wrap;
}
body.ls-page-products .ls2-price strong {
  color: #0b3d37;
  font-size: 38px;
  line-height: 1.1;
  font-weight: 800;
}
body.ls-page-products .ls2-price span {
  color: #3d5a55;
  font-size: 15px;
  font-weight: 700;
}
body.ls-page-products .ls2-cycle {
  display: inline-block;
  align-self: flex-start;
  margin-top: 0;
  padding: 4px 12px;
  border-radius: 999px;
  background: #eef7f4;
  border: 1px solid #d3eae2;
  font-size: 13px;
  font-weight: 700;
  color: #0f4d45;
}

/* tiles */
body.ls-page-products .tiles {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}
body.ls-page-products .tile {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 8px;
  padding: 14px;
  border-radius: 16px;
  background: #f5faf8;
  border: 1px solid #e2ebe8;
}
body.ls-page-products .tile .ib {
  width: 34px;
  height: 34px;
  border-radius: 10px;
}
body.ls-page-products .tile .ls2-tile-ib-1 { background: #dcf0ea; color: #146157; }
body.ls-page-products .tile .ls2-tile-ib-2 { background: #e0efff; color: #1d5fa8; }
body.ls-page-products .tile .ls2-tile-ib-3 { background: #fff0d2; color: #8a5200; }
body.ls-page-products .tile .ls2-tile-ib-4 { background: #ece8ff; color: #5239c4; }
body.ls-page-products .tile strong {
  color: #0b3d37;
  font-size: 20px;
  font-weight: 800;
  line-height: 1.2;
}
body.ls-page-products .tile strong small {
  color: #3d5a55;
  font-size: 12px;
  font-weight: 600;
  margin-inline-start: 4px;
}
body.ls-page-products .tile span.l {
  color: #567069;
  font-size: 13px;
  font-weight: 600;
}
body.ls-page-products .tile .ic { fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }

/* specs */
body.ls-page-products .ls2-specs .spec {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 11px 2px;
  border-bottom: 1px dashed #dbe8e4;
  color: #3d5a55;
  font-size: 14px;
  font-weight: 600;
}
body.ls-page-products .ls2-specs .spec:last-child { border-bottom: 0; }
body.ls-page-products .ls2-specs .spec b {
  margin-inline-start: auto;
  color: #0e2b27;
  font-weight: 800;
}
body.ls-page-products .ls2-specs .spec .ic { fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }

/* free domain banner */
body.ls-page-products .ls2-freecard {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 12px 14px;
  border-radius: 16px;
  background: linear-gradient(120deg, #e3f6ec, #e4eeff);
  border: 1px solid #d3eae2;
}
body.ls-page-products .ls2-freecard .ib {
  width: 36px;
  height: 36px;
  border-radius: 11px;
  background: #fff;
  color: #146157;
  flex: none;
}
body.ls-page-products .ls2-freecard .t {
  color: #0b3d37;
  font-size: 14px;
  font-weight: 800;
}
body.ls-page-products .ls2-freecard .s {
  color: #3d5a55;
  font-size: 13px;
  font-weight: 600;
}
body.ls-page-products .ls2-freecard .ic { fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }

/* CTA */
body.ls-page-products .btn-p {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  height: 52px;
  padding: 0 18px;
  border-radius: 14px;
  border: 1px solid transparent;
  background: #146157;
  color: #fff !important;
  font-size: 15px;
  font-weight: 700;
  text-decoration: none;
  white-space: nowrap;
  margin-top: auto;
  transition: background 0.15s ease, transform 0.15s ease;
}
body.ls-page-products .btn-p:hover { background: #0f4d45; }
body.ls-page-products .btn-p:active { transform: scale(0.98); }
body.ls-page-products .btn-p .ic { fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }

/* keep flash/errors visible */
body.ls-page-products .ls-store-alert {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  margin: 0 0 18px;
  padding: 14px 16px;
  border-radius: 16px;
  background: #ffeae7;
  border: 1px solid #ffc9c2;
  color: #a8312a;
  font-size: 13px;
  font-weight: 600;
  line-height: 1.9;
}
body.ls-page-products .ls-store-alert .ic {
  width: 18px;
  height: 18px;
  flex: none;
  margin-top: 2px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.9;
  stroke-linecap: round;
  stroke-linejoin: round;
}

/* ============================================================
   LS unified sidebars — site-wide (v2)
   matching the store page (ls2) design: white head + teal icon
   chip + dot rows; works for .panel-heading & .card-title heads
   ============================================================ */

body .card.card-sidebar,
#order-standard_cart .panel.card.card-sidebar,
body .card.card-sidebar {
  background: #fff !important;
  border: 1px solid #e2ebe8 !important;
  border-radius: 24px !important;
  box-shadow: 0 1px 2px rgba(14, 43, 39, 0.04), 0 14px 34px -14px rgba(14, 43, 39, 0.12) !important;
  margin-bottom: 20px !important;
  overflow: hidden;
  padding-bottom: 12px;
}
body .card.card-sidebar > .panel-heading,
body .card.card-sidebar > .card-header,
body .card.card-sidebar .card-title,
#order-standard_cart .panel.card.card-sidebar .panel-heading.panel-heading,
#order-standard_cart .panel.card.card-sidebar .card-header {
  display: flex;
  align-items: center;
  gap: 12px;
  margin: 0 !important;
  padding: 20px 22px 12px !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: #fff !important;
  background-image: none !important;
}
body .card.card-sidebar .panel-title,
body .card.card-sidebar .card-title,
#order-standard_cart .panel.card.card-sidebar .panel-title.panel-title {
  display: flex;
  align-items: center;
  gap: 12px;
  flex: 1 1 auto;
  margin: 0 !important;
  padding: 0 !important;
  color: #0b3d37 !important;
  font-size: 16px !important;
  font-weight: 800 !important;
}
body .card.card-sidebar .panel-title i,
body .card.card-sidebar .card-title i,
#order-standard_cart .panel.card.card-sidebar .panel-title i {
  display: flex !important;
  align-items: center;
  justify-content: center;
  flex: none;
  width: 40px !important;
  height: 40px !important;
  border-radius: 12px !important;
  background: #dcf0ea !important;
  color: #146157 !important;
  font-family: "Font Awesome 5 Pro", "Font Awesome 5 Free";
  font-size: 18px;
  line-height: 1;
}
body .card.card-sidebar .panel-title .card-minimise,
body .card.card-sidebar .card-minimise,
#order-standard_cart .panel.card.card-sidebar .card-minimise {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  float: none !important;
  order: 3;
  margin: 0 !important;
  margin-inline-start: auto !important;
  background: none !important;
  border: 0 !important;
  color: #8aa49e !important;
  opacity: 1;
  font-size: 14px;
}
body .card.card-sidebar .list-group,
body .card.card-sidebar .collapsable-card-body .list-group,
#order-standard_cart .panel.card.card-sidebar .list-group {
  display: flex;
  flex-direction: column;
  gap: 0;
  padding: 0 12px !important;
  border: 0 !important;
  background: transparent !important;
  margin: 0;
}
body .card.card-sidebar .list-group-item,
#order-standard_cart .panel.card.card-sidebar .list-group-item {
  display: flex;
  align-items: center;
  gap: 12px;
  border: 0 !important;
  border-radius: 14px !important;
  background: transparent !important;
  color: #3d5a55 !important;
  font-size: 14px !important;
  font-weight: 600;
  padding: 11px 14px !important;
  text-decoration: none !important;
  transition: background 0.15s ease, color 0.15s ease;
}
body .card.card-sidebar .list-group-item::before,
#order-standard_cart .panel.card.card-sidebar .list-group-item::before {
  content: "";
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: #a9d6c9;
  flex: none;
  transition: background 0.15s ease, box-shadow 0.15s ease;
}
body .card.card-sidebar .list-group-item:has(i)::before,
body .card.card-sidebar .list-group-item:has(svg)::before,
#order-standard_cart .panel.card.card-sidebar .list-group-item:has(i)::before {
  content: none;
}
body .card.card-sidebar .list-group-item:hover,
#order-standard_cart .panel.card.card-sidebar .list-group-item:hover {
  background: #f1f8f5 !important;
  color: #146157 !important;
}
body .card.card-sidebar .list-group-item:hover::before {
  background: #146157;
}
body .card.card-sidebar .list-group-item.active,
#order-standard_cart .panel.card.card-sidebar .list-group-item.active {
  background: #dcf0ea !important;
  color: #0f4d45 !important;
  font-weight: 800 !important;
}
body .card.card-sidebar .list-group-item.active::before,
#order-standard_cart .panel.card.card-sidebar .list-group-item.active::before {
  background: #146157;
  box-shadow: 0 0 0 4px rgba(20, 97, 87, 0.16);
}
body .card.card-sidebar .list-group-item i,
#order-standard_cart .panel.card.card-sidebar .list-group-item i {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  flex: none;
  width: 18px;
  font-family: "Font Awesome 5 Pro", "Font Awesome 5 Free";
  color: #19615c;
  font-size: 14px;
}
body .card.card-sidebar .list-group-item .badge,
#order-standard_cart .panel.card.card-sidebar .list-group-item .badge {
  margin-inline-start: auto;
  margin-inline-end: 0 !important;
  border-radius: 999px;
  background: #eef7f4;
  border: 1px solid #d3eae2;
  color: #0f4d45;
  font-size: 11px;
  font-weight: 700;
}
body .card.card-sidebar .panel-body,
body .card.card-sidebar .card-body,
#order-standard_cart .panel.card.card-sidebar .panel-body,
#order-standard_cart .panel.card.card-sidebar .card-body {
  padding: 0 12px 12px;
  background: transparent;
  color: #3d5a55;
  font-size: 13px;
  font-weight: 600;
}

/* ============================================================
   LS Ticket view (viewticket.php) — polish, scoped b.ls-page-viewticket
   ============================================================ */

/* hero: split layout — body LEFT, animated art RIGHT (RTL: row-reverse) */
body.ls-page-viewticket .ls-ticket-hero {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-direction: row-reverse;
  gap: 30px;
}

/* hero */
body.ls-page-viewticket .ls-ticket-hero {
  position: relative;
  padding: 30px 32px 28px;
  border-radius: 24px;
  border: 1px solid #d3eae2;
  background:
    radial-gradient(420px 220px at 96% -40px, rgba(25, 97, 92, 0.1) 0%, rgba(25, 97, 92, 0) 70%),
    linear-gradient(135deg, #ffffff 0%, #eef8f4 55%, #ddf0ea 100%);
  box-shadow: 0 1px 2px rgba(14, 43, 39, 0.04), 0 18px 44px -18px rgba(20, 97, 87, 0.22);
}
body.ls-page-viewticket .ls-ticket-kicker {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 12px;
  padding: 5px 14px;
  border-radius: 999px;
  background: #fff;
  border: 1px solid #cfe6df;
  box-shadow: 0 6px 16px -10px rgba(20, 97, 87, 0.4);
  color: #19615c;
  font-size: 12px;
  font-weight: 800;
  direction: ltr;
}
body.ls-page-viewticket .ls-ticket-kicker::before {
  content: "";
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: #1fc08b;
  box-shadow: 0 0 0 3px rgba(31, 192, 139, 0.18);
  flex: none;
}
body.ls-page-viewticket .ls-ticket-hero h1 {
  margin: 0 0 8px;
  color: #0b3d37;
  font-size: 30px;
  font-weight: 800;
  line-height: 1.4;
}
body.ls-page-viewticket .ls-ticket-hero p {
  margin: 0;
  color: #3d5a55;
  font-size: 14.5px;
  font-weight: 600;
  line-height: 1.9;
}
body.ls-page-viewticket .ls-ticket-hero .ticket-actions {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  align-items: center;
  justify-content: flex-start;
  gap: 10px;
  margin-top: 18px;
}
body.ls-page-viewticket .ls-ticket-hero .btn {
  min-height: 46px;
  padding: 10px 18px;
  border-radius: 12px;
  font-weight: 800;
  text-decoration: none;
  transition: transform 0.16s ease, box-shadow 0.16s ease, filter 0.16s ease, background 0.16s ease;
}
body.ls-page-viewticket .ls-ticket-hero .btn i {
  display: inline-flex !important;
}
body.ls-page-viewticket .ls-ticket-hero .btn-primary {
  border: 0;
  background: linear-gradient(135deg, #134a47 0%, #19615c 55%, #23776e 100%);
  color: #fff !important;
  box-shadow: 0 14px 28px -14px rgba(20, 97, 87, 0.55);
}
body.ls-page-viewticket .ls-ticket-hero .btn-primary:hover {
  transform: translateY(-1px);
  filter: brightness(1.06);
}
body.ls-page-viewticket .ls-ticket-hero .btn-danger {
  background: #fff;
  border: 1.5px solid #f3c1bd;
  color: #c0392b !important;
  font-weight: 800;
}
body.ls-page-viewticket .ls-ticket-hero .btn-danger:hover {
  background: #fdebe9;
  transform: translateY(-1px);
}
body.ls-page-viewticket .ls-ticket-hero .btn-default {
  background: #f2f9f7;
  border: 0;
  color: #19615c !important;
}
body.ls-page-viewticket .ls-ticket-hero .btn-default:hover {
  background: #e4f2ee;
  color: #0b3d37 !important;
}

/* thread bubbles */
body.ls-page-viewticket .ls-ticket-thread {
  overflow: hidden;
  border-radius: 24px;
}
body.ls-page-viewticket .ticket-reply {
  margin: 0;
  border-radius: 18px;
  overflow: hidden;
}
body.ls-page-viewticket .ticket-reply .message {
  padding: 4px 16px 14px;
  color: #243140;
  font-size: 14px;
  line-height: 1.85;
}
body.ls-page-viewticket .ticket-reply .message hr {
  margin: 12px -16px 8px;
  border-top: 1px dashed #dfe9e7;
  opacity: 1;
}
body.ls-page-viewticket .ticket-reply.staff .posted-by-name::before {
  content: "\f591";
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 28px;
  height: 28px;
  margin-inline-end: 8px;
  border-radius: 9px;
  background: linear-gradient(135deg, #134a47, #23776e);
  color: #fff;
  font-family: "Font Awesome 5 Pro", "Font Awesome 5 Free";
  font-weight: 900;
  font-size: 12px;
  vertical-align: middle;
}
body.ls-page-viewticket .ticket-reply:not(.staff) .posted-by-name::before {
  content: "";
  display: inline-block;
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: #1fc08b;
  box-shadow: 0 0 0 3px rgba(31, 192, 139, 0.18);
  margin-inline-end: 8px;
  vertical-align: middle;
}
/* rating rows */
body.ls-page-viewticket .ticket-reply .rating,
body.ls-page-viewticket .ticket-reply .rating-done {
  display: flex;
  align-items: center;
  gap: 6px;
  margin: 12px 0 2px;
  padding: 10px 14px;
  border: 1px dashed #dfe9e7;
  border-radius: 12px;
  background: #f8fcfb;
}
body.ls-page-viewticket .ticket-reply .rating-done .rated {
  margin-inline-start: 6px;
}
/* attachments inside bubbles */
body.ls-page-viewticket .ticket-reply .attachments {
  padding: 12px 16px 14px;
}
body.ls-page-viewticket .ticket-reply .attachments strong {
  color: #3d5a55;
  font-size: 12.5px;
  font-weight: 700;
}
body.ls-page-viewticket .ticket-reply .attachment-list {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin: 10px 0 0;
  padding: 0;
  list-style: none;
}
body.ls-page-viewticket .ticket-reply .attachment-list li {
  margin: 0;
}
body.ls-page-viewticket .ticket-reply .attachment-list a {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 7px 12px 7px 8px;
  border: 1px solid #e3eef1;
  border-radius: 12px;
  background: #fff;
  color: #0b3d37 !important;
  text-decoration: none;
  transition: border-color 0.15s ease, background 0.15s ease;
}
body.ls-page-viewticket .ticket-reply .attachment-list a:hover {
  border-color: #9cc9c1;
  background: #f7fcfa;
}
/* the a > span wrapper stacks figure+caption — force horizontal row */
body.ls-page-viewticket .ticket-reply .attachment-list a > span {
  display: flex;
  align-items: center;
  gap: 10px;
  min-width: 0;
}
/* kill the legacy "file card" grid (li width 180 etc.) */
body.ls-page-viewticket .ticket-reply .attachment-list li {
  float: none !important;
  display: inline-flex !important;
  align-items: center;
  width: auto !important;
  min-width: 0 !important;
  padding: 0 !important;
  margin: 0 !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  text-align: start !important;
}
body.ls-page-viewticket .ticket-reply .attachment-list a {
  width: auto !important;
  height: auto !important;
  min-height: 0 !important;
  display: inline-flex !important;
  align-items: center;
  padding: 7px 12px 7px 8px !important;
  border: 1px solid #e3eef1 !important;
  border-radius: 12px !important;
  background: #fff !important;
  box-shadow: none !important;
}
body.ls-page-viewticket .ticket-reply .attachment-list a > span {
  display: flex !important;
  align-items: center;
  gap: 10px;
  min-width: 0;
  padding: 0 !important;
  margin: 0 !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}
body.ls-page-viewticket .ticket-reply .attachment-list figure {
  margin: 0;
}
body.ls-page-viewticket .ticket-reply .attachment-list .caption {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: 260px;
}
body.ls-page-viewticket .ticket-reply .attachment-list figure {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 36px;
  height: 36px;
  border-radius: 11px;
  background: #eef6f3;
  color: #19615c;
  font-size: 15px;
}
body.ls-page-viewticket .ticket-reply .attachment-list .caption {
  color: #0b3d37 !important;
  font-size: 13px;
  font-weight: 700;
}
body.ls-page-viewticket .ticket-reply .attachment-list i {
  display: inline-flex !important;
}

/* reply form */
body.ls-page-viewticket .ls-ticket-reply-card {
  border-radius: 24px;
}
body.ls-page-viewticket .ls-ticket-reply-card .card-body {
  padding: 24px;
}
body.ls-page-viewticket .ls-ticket-reply-card .card-title {
  margin-bottom: 18px;
  padding-bottom: 12px;
  border-bottom: 1px solid #eef4f2;
  color: #0b3d37;
}
body.ls-page-viewticket #ticketReplyContainer {
  scroll-margin-top: 110px;
}
body.ls-page-viewticket .ls-ticket-actions .btn-primary {
  border: 0;
  border-radius: 12px;
  background: linear-gradient(135deg, #134a47 0%, #19615c 55%, #23776e 100%);
  color: #fff !important;
  box-shadow: 0 14px 28px -14px rgba(20, 97, 87, 0.55);
  transition: transform 0.16s ease, filter 0.16s ease;
}
body.ls-page-viewticket .ls-ticket-actions .btn-primary:hover {
  transform: translateY(-1px);
  filter: brightness(1.06);
}
body.ls-page-viewticket .ls-ticket-actions .btn-default {
  border: 0;
  background: #f2f9f7;
  color: #19615c !important;
  border-radius: 12px;
  font-weight: 800;
}
body.ls-page-viewticket .ls-ticket-actions .btn-default:hover {
  background: #e4f2ee;
  color: #0b3d37 !important;
}
body.ls-page-viewticket .md-editor.cke,
body.ls-page-viewticket .cke {
  border-radius: 14px !important;
}

/* sidebar polish: label/value rows + inline widgets */
body .card.card-sidebar .list-group-item:has(> .title) {
  display: block;
  border-radius: 0;
  margin: 0 -12px;
  padding: 10px 14px;
  border-bottom: 1px dashed #e9f1ef !important;
  background: transparent !important;
}
body .card.card-sidebar .list-group-item:has(> .title):last-child {
  border-bottom: 0 !important;
}
body .card.card-sidebar .list-group-item:has(> .title)::before {
  content: none !important;
}
body .card.card-sidebar .list-group-item .title {
  display: block;
  color: #8aa49e;
  font-size: 11.5px;
  font-weight: 700;
  margin-bottom: 5px;
}
body .card.card-sidebar .list-group-item:has(> .title) {
  color: #0e2b27 !important;
  font-weight: 700;
  font-size: 13.5px;
  line-height: 1.6;
}
body .card.card-sidebar .list-group-item .label.requestor-type-owner {
  display: inline-flex;
  align-items: center;
  padding: 2px 9px;
  border-radius: 999px;
  background: #eef7f4;
  color: #19615c;
  font-size: 10.5px;
  font-weight: 800;
  margin-inline-start: 6px;
}
/* compact action buttons inside the sidebar ticket-info panel */
body .card.card-sidebar .card-body .btn,
body .card.card-sidebar .collapsable-card-body .btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 34px;
  padding: 6px 12px;
  margin: 12px 12px 4px;
  font-size: 12px;
  font-weight: 800;
  border-radius: 10px;
  width: auto !important;
}
body .card.card-sidebar .card-body .btn-danger {
  background: #fff !important;
  border: 1.5px solid #f3c1bd;
  color: #c0392b !important;
}
body .card.card-sidebar .card-body .btn-primary {
  background: linear-gradient(135deg, #134a47, #23776e) !important;
  border: 0 !important;
  color: #fff !important;
  box-shadow: 0 10px 20px -12px rgba(20, 97, 87, 0.6);
}
/* attachments sidebar rows -> file chips */
body .card.card-sidebar .list-group-item .figure {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 34px;
  height: 34px;
  border-radius: 10px;
  background: #eef6f3;
  color: #19615c;
  font-size: 14px;
}
body .card.card-sidebar .list-group-item .caption {
  color: #0b3d37 !important;
  font-weight: 700;
  font-size: 12.5px;
}
body .card.card-sidebar .list-group-item i {
  display: inline-flex !important;
}
/* inline input groups (cc panel) */
body .card.card-sidebar .input-group .form-control {
  min-height: 40px;
  border: 1px solid #e3eef1 !important;
  border-radius: 10px 0 0 10px !important;
  font-size: 12.5px;
  font-weight: 600;
}
body .card.card-sidebar .input-group .btn {
  min-height: 40px;
  font-weight: 800;
  border-radius: 0 10px 10px 0 !important;
}
[dir="rtl"] body .card.card-sidebar .input-group .form-control {
  border-radius: 0 10px 10px 0 !important;
}
[dir="rtl"] body .card.card-sidebar .input-group .btn {
  border-radius: 10px 0 0 10px !important;
}
body .card.card-sidebar .card-title i {
  display: inline-flex !important;
}
/* ticket page — show the card sidebar exactly ONCE.
   WHMCS renders the sidebar twice: the card set (d-none d-lg-block) and a
   duplicated collapsed/secondary copy (d-lg-none). The old blanket
   `.sidebar { display:block !important }` un-hid BOTH copies → duplicates.
   Now: force only the real card sidebar visible at all widths, and kill the
   duplicate everywhere. The plain `.sidebar` (info card wrapper) is unique
   and stays untouched. */
body.ls-page-viewticket .sidebar.d-none.d-lg-block {
  display: block !important;
}
body.ls-page-viewticket .sidebar-collapsed,
body.ls-page-viewticket .sidebar-secondary {
  display: none !important;
}
/* the theme rails this page in a 720px container → sidebar (col-lg-4) too
   small for the chip design; switch to the wide store layout + fixed sidebar.
   Structure (verified): #main-body > .container > .row >
     [col-lg-4 col-xl-3  = sidebar] + [col-lg-8 col-xl-9.primary-content].
   No :has() here — it silently fails on older browsers and leaves the
   sidebar at bootstrap's native 25% (~300px), which reads as "tiny". */
body.ls-page-viewticket #main-body > .container {
  max-width: 1360px;
  padding: 0 28px;
}
body.ls-page-viewticket #main-body > .container > .row {
  display: grid !important;
  /* RTL: first track sits on the RIGHT → sidebar (first DOM child) */
  grid-template-columns: minmax(350px, 28%) minmax(0, 1fr);
  gap: 30px;
  align-items: start;
}
body.ls-page-viewticket #main-body > .container > .row > [class*="col"] {
  width: auto !important;
  max-width: none !important;
  flex: none !important;
  float: none !important;
  padding: 0 !important;
}
@media (max-width: 991px) {
  body.ls-page-viewticket #main-body > .container > .row {
    grid-template-columns: minmax(0, 1fr);
  }
  body.ls-page-viewticket #main-body > .container > .row > .col-lg-4.col-xl-3 {
    grid-row: 2;
    margin-top: 20px;
  }
}

/* WHMCS utility (.w-hidden = display:none) — theme declares it WITHOUT
   !important, so any flex/justify rule can un-hide templates. Make it robust,
   but keep collapsible panel bodies (toggled open/closed by WHMCS js) alive.
   Tables are excluded: DataTable pages ship table.w-hidden and reveal them
   via jQuery .show() — an !important here would hide every list forever. */
body .w-hidden:not(.collapsable-card-body):not(table),
body [class~="w-hidden"]:not(.collapsable-card-body):not(table) {
  display: none !important;
}

/* ---- CC گیرندگان panel — polished email add row ---- */
body .card.card-sidebar form#frmAddCcEmail {
  padding: 0 12px 12px;
}
body .card.card-sidebar form#frmAddCcEmail .input-group {
  display: flex;
  align-items: center;
  gap: 6px;
  background: #f6faf9;
  border: 1px solid #e3eef1;
  border-radius: 14px;
  padding: 4px;
  transition: border-color 0.15s ease, box-shadow 0.15s ease;
  margin: 0 !important;
}
body .card.card-sidebar form#frmAddCcEmail:has(.form-control:focus) .input-group {
  border-color: #19615c;
  box-shadow: 0 0 0 3px rgba(25, 97, 92, 0.14);
}
body .card.card-sidebar form#frmAddCcEmail .input-group .form-control {
  flex: 1 1 auto;
  min-height: 40px;
  background: transparent !important;
  border: 0 !important;
  border-radius: 10px !important;
  box-shadow: none !important;
  color: #0e2b27;
  font-weight: 600;
  font-size: 13.5px;
}
body .card.card-sidebar form#frmAddCcEmail .input-group .form-control::placeholder {
  color: #8aa49e;
}
body .card.card-sidebar form#frmAddCcEmail .input-group .btn#btnAddCcEmail {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: none;
  min-height: 38px;
  padding: 0 16px;
  border: 0 !important;
  border-radius: 10px !important;
  background: linear-gradient(135deg, #134a47 0%, #19615c 55%, #23776e 100%) !important;
  color: #fff !important;
  font-weight: 800 !important;
  font-size: 12.5px;
  box-shadow: 0 10px 20px -12px rgba(20, 97, 87, 0.6);
  transition: transform 0.16s ease, filter 0.16s ease;
}
body .card.card-sidebar form#frmAddCcEmail .input-group .btn#btnAddCcEmail:hover {
  transform: translateY(-1px);
  filter: brightness(1.06);
}
/* hint under the input */
body .card.card-sidebar form#frmAddCcEmail::after {
  content: "ایمیل کس دیگری را برای دریافت کپی پاسخ‌ها اضافه کنید";
  display: block;
  margin-top: 8px;
  color: #8aa49e;
  font-size: 11.5px;
  font-weight: 600;
}
/* empty state hint when no recipient added yet */
body .card.card-sidebar form#frmAddCcEmail ~ .list-group:has(> .w-hidden):not(:has(> .list-group-item:not(.w-hidden)))::before {
  content: "هنوز گیرنده‌ای اضافه نشده است";
  display: flex;
  align-items: center;
  gap: 8px;
  margin: 0 0 8px;
  padding: 11px 14px;
  border-radius: 12px;
  background: #f8fcfb;
  border: 1px dashed #d6e6e2;
  color: #647c78;
  font-size: 12.5px;
  font-weight: 600;
}
body .card.card-sidebar form#frmAddCcEmail ~ .list-group {
  padding-bottom: 6px !important;
}
/* existing CC recipient rows */
body .card.card-sidebar .list-group-item.ticket-cc-item:not(.w-hidden) {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 10px 12px !important;
  border-radius: 12px !important;
  background: #fff !important;
  border: 1px solid #e3eef1 !important;
  color: #0e2b27;
  font-weight: 600;
  font-size: 13px;
}
body .card.card-sidebar .list-group-item.ticket-cc-item:not(.w-hidden)::before {
  content: "\f0e0" !important;
  font-family: "Font Awesome 5 Pro", "Font Awesome 5 Free";
  font-weight: 400;
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  width: 28px;
  height: 28px;
  border-radius: 9px;
  background: #eef6f3;
  color: #19615c;
  font-size: 12px;
}
body .card.card-sidebar .card-minimise {
  color: #8aa49e !important;
  opacity: 1;
}

/* panels that are plain (no icon chip) still get a spacing rhythm */
body .card.card-sidebar .panel-title:not(:has(i)) { gap: 0; }

/* ============================================================
   ticket hero: split layout + animated SVG (ticket & server)
   body LEFT, art RIGHT (RTL uses row-reverse)
   ============================================================ */
body.ls-page-viewticket .ls-ticket-hero {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-direction: row-reverse;
  gap: 30px;
}
body.ls-page-viewticket .ls-ticket-hero-body { min-width: 0; }
body.ls-page-viewticket .ls-ticket-hero-art { position: relative; flex: none; width: 230px; }
body.ls-page-viewticket .ls-ticket-hero [class*="ls-a-"] { transform-box: fill-box; transform-origin: center; }
body.ls-page-viewticket .ls-ticket-hero .ls-a-float { animation: ls-float 3.6s ease-in-out infinite; }
body.ls-page-viewticket .ls-ticket-hero .ls-a-dash { animation: ls-dashflow 1.6s linear infinite; }
body.ls-page-viewticket .ls-ticket-hero .ls-a-led { animation: ls-led 2.4s ease-in-out infinite; }
body.ls-page-viewticket .ls-ticket-hero .ls-a-led2 { animation: ls-led 2.4s ease-in-out .7s infinite; }
body.ls-page-viewticket .ls-ticket-hero .ls-a-spin { animation: ls-spin 3s linear infinite; }
body.ls-page-viewticket .ls-ticket-hero .ls-a-badge { animation: ls-pop 2.4s ease-in-out infinite; }
body.ls-page-viewticket .ls-ticket-hero .ls-a-spark circle:nth-child(1) { animation: ls-twinkle 2.2s ease-in-out infinite; }
body.ls-page-viewticket .ls-ticket-hero .ls-a-spark circle:nth-child(2) { animation: ls-twinkle 2.6s ease-in-out 0.4s infinite; }
body.ls-page-viewticket .ls-ticket-hero .ls-a-spark circle:nth-child(3) { animation: ls-twinkle 3s ease-in-out 0.8s infinite; }
@keyframes ls-float {
  0%, 100% { transform: translateY(0); }
  50% { transform: translateY(-7px); }
}
@keyframes ls-dashflow {
  to { stroke-dashoffset: -24; }
}
@keyframes ls-led {
  0%, 40% { opacity: 1; }
  55%, 75% { opacity: 0.25; }
  100% { opacity: 1; }
}
@keyframes ls-spin {
  to { transform: rotate(360deg); }
}
@keyframes ls-pop {
  0%, 100% { transform: scale(1); }
  50% { transform: scale(1.12); }
}
@keyframes ls-twinkle {
  0%, 100% { opacity: 0.25; transform: scale(0.85); }
  50% { opacity: 1; transform: scale(1.25); }
}
@media (max-width: 900px) {
  body.ls-page-viewticket .ls-ticket-hero-art { display: none !important; }
  body.ls-page-viewticket .ls-ticket-hero { flex-direction: row-reverse; }
}
@media (prefers-reduced-motion: reduce) {
  body.ls-page-viewticket .ls-ticket-hero [class*="ls-a-"] { animation: none !important; }
}

/* ============================================================
   Ticket reply markdown editor icons — theme hides .fas globally;
   restore inside the editor toolbar + style the toolbar/footer
   ============================================================ */
body.ls-page-viewticket .ls-ticket-page .md-header i,
body.ls-page-viewticket .ls-ticket-page .md-header span.fas,
body.ls-page-viewticket .ls-ticket-page .md-header span.far,
body.ls-page-viewticket .ls-ticket-page .md-footer i,
body.ls-page-viewticket .ls-ticket-page .md-footer span.fas {
  display: inline-flex !important;
  font-family: "Font Awesome 5 Pro", "Font Awesome 5 Free";
  align-items: center;
  justify-content: center;
  font-size: 13px;
  color: #3d5a55;
}
body.ls-page-viewticket .ls-ticket-page .md-header .btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 32px;
  min-height: 32px;
  padding: 0 !important;
  border: 1px solid transparent;
  border-radius: 9px;
  background: transparent !important;
  color: #3d5a55;
  transition: background 0.15s ease, color 0.15s ease, border-color 0.15s ease;
}
body.ls-page-viewticket .ls-ticket-page .md-header .btn:hover {
  background: #eef7f4 !important;
  color: #146157 !important;
  border-color: #cfe6df;
}
body.ls-page-viewticket .ls-ticket-page .md-header .btn-primary {
  display: inline-flex;
  width: auto;
  padding: 6px 14px !important;
  border: 0;
  border-radius: 9px;
  background: linear-gradient(135deg, #134a47 0%, #19615c 55%, #23776e 100%) !important;
  color: #fff !important;
  font-weight: 800;
  gap: 6px;
}
body.ls-page-viewticket .ls-ticket-page .md-header .btn-primary:hover {
  filter: brightness(1.06);
}
body.ls-page-viewticket .ls-ticket-page .md-header .md-control-fullscreen {
  color: #3d5a55;
}
body.ls-page-viewticket .ls-ticket-page .md-editor {
  border-radius: 14px;
  background: #fff;
}
body.ls-page-viewticket .ls-ticket-page .md-header {
  padding: 8px 10px;
  background: #f8fcfb;
  border-bottom: 1px solid #eef4f2;
  flex-wrap: wrap;
  gap: 4px;
}
body.ls-page-viewticket .ls-ticket-page .md-footer {
  padding: 8px 12px;
  background: #f8fcfb;
  border-top: 1px solid #eef4f2;
  color: #647c78;
  font-size: 11.5px;
  font-weight: 600;
}
body.ls-page-viewticket .ls-ticket-page .md-editor .md-input {
  min-height: 240px;
  font-size: 14px;
}

/* ---- specific page fixes: domain renewals ---- */
/* mobile collapsed sidebar widgets — styled consistently (not hidden) */
#order-standard_cart .panel.card.panel-default:has(> .panel-heading select),
#order-standard_cart .panel.card.panel-default:has(> .panel-heading ~ .panel-body select) {
  background: #fff !important;
  border: 1px solid #e2ebe8 !important;
  border-radius: 18px !important;
  margin-bottom: 18px !important;
  overflow: hidden;
  box-shadow: 0 1px 2px rgba(14, 43, 39, 0.03), 0 14px 32px -22px rgba(20, 97, 87, 0.2) !important;
}
#order-standard_cart .panel.card.panel-default .panel-heading {
  display: flex;
  align-items: center;
  gap: 10px;
  margin: 0 !important;
  padding: 13px 16px !important;
  border: 0 !important;
  border-radius: 0 !important;
  background-color: #19615c !important;
  background-image: linear-gradient(135deg, rgb(15, 86, 79) 0%, rgb(25, 97, 92) 55%, rgb(37, 118, 110) 100%) !important;
}
#order-standard_cart .panel.card.panel-default .panel-title i {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  flex: 0 0 32px;
  width: 32px !important;
  height: 32px !important;
  border-radius: 9px;
  background: rgba(255, 255, 255, 0.16) !important;
  color: #fff !important;
  font-family: "Font Awesome 5 Pro", "Font Awesome 5 Free";
  font-size: 14px;
  line-height: 1;
}
#order-standard_cart .panel.card.panel-default .panel-title {
  display: flex;
  align-items: center;
  gap: 10px;
  color: #fff !important;
  font-size: 14px !important;
  font-weight: 800 !important;
}
#order-standard_cart .panel.card.panel-default .panel-body,
#order-standard_cart .panel.card.panel-default .card-body {
  padding: 12px !important;
  background: transparent !important;
}
#order-standard_cart .panel.card.panel-default .card-header select,
#order-standard_cart .panel.card.panel-default select {
  width: 100%;
  min-height: 46px;
  border: 1px solid #dfe9e7 !important;
  border-radius: 12px;
  background: #f8fcfb !important;
  color: #0e2b27;
  font-weight: 600;
  box-shadow: none;
}
body.ls-page-domain-renewals #order-standard_cart .header-lined {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  text-align: start;
  padding: 26px 28px;
  margin: 0 0 20px;
  border: 1px solid #d3eae2;
  border-radius: 24px;
  background:
    radial-gradient(420px 220px at 96% -40px, rgba(25, 97, 92, 0.10) 0%, rgba(25, 97, 92, 0) 70%),
    linear-gradient(135deg, #ffffff 0%, #eef8f4 55%, #ddf0ea 100%);
  box-shadow: 0 1px 2px rgba(14, 43, 39, 0.04), 0 18px 44px -18px rgba(20, 97, 87, 0.22);
}
body.ls-page-domain-renewals #order-standard_cart .header-lined h1 {
  margin: 0;
  color: #0b3d37;
  font-size: 26px;
  font-weight: 800;
  display: flex;
  align-items: center;
  gap: 12px;
}
body.ls-page-domain-renewals #order-standard_cart .header-lined .domain-renewals-filter {
  min-height: 42px;
  width: 220px;
  border: 1px solid #dfe9e7;
  border-radius: 12px;
  font-size: 13px;
  box-shadow: none;
}

/* ---- responsive ---- */
@media (min-width: 992px) {
  body.ls-page-products .ls-crumb { margin-top: 4px; }
}
@media (max-width: 1040px) {
  body .ls2-row {
    grid-template-columns: minmax(0, 1fr);
    gap: 20px;
  }
  body .ls2-side {
    order: 2;
    display: flex !important;
    flex-direction: column;
    gap: 16px;
  }
  body .ls2-main { order: 1; }
  body.ls-page-products .sidebar-collapsed { display: none !important; }
}
@media (max-width: 760px) {
  body.ls-page-products .ls2-hero { padding: 28px 22px; }
  body.ls-page-products .ls2-hero-body h1 { font-size: 32px; }
  body.ls-page-products .ls2-hero-art { display: none !important; }
}
@media (max-width: 520px) {
  body.ls-page-products .ls2-hero-body h1 { font-size: 27px; }
  body.ls-page-products .ls2-price strong { font-size: 32px; }
  body.ls-page-products .tiles { grid-template-columns: 1fr; }
  body.ls-page-products .plan { padding: 20px 16px 16px; }
}

/* ============================================================
   LS Knowledgebase — list & category pages
   scope: body.ls-page-knowledgebase, .ls-kb
   ============================================================ */

/* ---- hero (same family as cart pages) ---- */
.ls-kb .ls-config-hero {
  position: relative;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  text-align: start;
  padding: 30px 32px 28px;
  margin-bottom: 20px;
  border: 1px solid #cfe6df;
  border-radius: 24px;
  background:
    radial-gradient(420px 220px at 96% -40px, rgba(25, 97, 92, 0.10) 0%, rgba(25, 97, 92, 0) 70%),
    linear-gradient(135deg, #ffffff 0%, #eef8f4 55%, #ddf0ea 100%);
  box-shadow: 0 1px 2px rgba(14, 43, 39, 0.04), 0 18px 44px -18px rgba(20, 97, 87, 0.22);
}
.ls-kb .ls-config-hero h1 {
  margin: 0 0 8px;
  color: #0b3d37;
  font-size: 30px;
  font-weight: 800;
  line-height: 1.4;
}
.ls-kb .ls-config-hero p {
  margin: 0;
  max-width: 46em;
  color: #3d5a55;
  font-size: 14.5px;
  font-weight: 600;
  line-height: 1.9;
}
body.ls-page-knowledgebase .ls-config-kicker {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 12px;
  padding: 5px 14px;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.92);
  border: 1px solid #cfe6df;
  box-shadow: 0 6px 16px -10px rgba(20, 97, 87, 0.4);
  color: #19615c;
  font-size: 12px;
  font-weight: 800;
}
body.ls-page-knowledgebase .ls-config-kicker::before {
  content: "";
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: #1fc08b;
  box-shadow: 0 0 0 3px rgba(31, 192, 139, 0.18);
}

/* ---- icons blocked by theme: restore only KB glyphs ---- */
body.ls-page-knowledgebase .fal,
body.ls-page-knowledgebase .ls-kb .fal,
body.ls-page-knowledgebase .ls-kb .fas,
body.ls-page-knowledgebase .ls-kb .far {
  display: inline-flex !important;
  font-family: "Font Awesome 5 Pro", "Font Awesome 5 Free";
  align-items: center;
  justify-content: center;
}
/* sidebar widget head icons: white head design → teal chip chip */
body.ls-page-knowledgebase .card-sidebar .card-title > i {
  position: relative;
  display: flex !important;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  line-height: 1;
  border-radius: 12px !important;
  background: #dcf0ea !important;
  color: #146157 !important;
  font-size: 18px !important;
  margin: 0;
  flex: 0 0 auto;
}
body.ls-page-knowledgebase .card-sidebar .card-title > i::before {
  position: absolute;
  inset: 0;
  margin: auto;
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  line-height: 1;
}
/* the theme's "FA Pro" is a custom subset: f591 maps to a marker glyph.
   fa-life-ring (f1cd) renders correctly, keep it and size it */
body.ls-page-knowledgebase .card-sidebar .card-title > i.far.fa-life-ring::before {
  content: "\f1cd" !important;
  font-family: "Font Awesome 5 Pro", "Font Awesome 5 Free" !important;
  font-weight: 400 !important;
  line-height: 1;
}
/* collapse chevron stays a subtle ghost, no disc */
body.ls-page-knowledgebase .card-sidebar .card-title i.fas.fa-chevron-up {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  width: auto !important;
  height: auto !important;
  background: transparent !important;
  opacity: 1;
  color: #8aa49e;
  font-size: 13px;
  margin-inline-start: 6px;
}

/* ---- search bar ---- */
body.ls-page-knowledgebase .kb-search,
body.ls-page-knowledgebase .ls-kb-search .kb-search {
  position: relative;
  display: flex;
  align-items: stretch;
  border: 1px solid #e3eef1;
  border-radius: 16px;
  background: #fff;
  box-shadow: 0 1px 2px rgba(14, 43, 39, 0.03), 0 14px 32px -20px rgba(20, 97, 87, 0.25);
  transition: border-color 0.15s ease, box-shadow 0.15s ease;
}
body.ls-page-knowledgebase .kb-search:focus-within {
  border-color: #19615c;
  box-shadow: 0 0 0 4px rgba(25, 97, 92, 0.14), 0 14px 32px -20px rgba(20, 97, 87, 0.25);
}
body.ls-page-knowledgebase .kb-search .form-control {
  flex: 1 1 auto;
  min-height: 56px;
  margin: 0;
  padding: 12px 18px;
  background: transparent;
  border: 0;
  border-radius: 16px;
  color: #243140;
  font-size: 15px;
  font-weight: 600;
  box-shadow: none;
  text-align: start;
}
body.ls-page-knowledgebase .kb-search .form-control:focus {
  background: transparent;
  border: 0;
  box-shadow: none;
}
body.ls-page-knowledgebase .kb-search .input-group-append .btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 46px;
  min-width: 96px;
  margin: 5px;
  padding: 10px 18px;
  border: 0;
  border-radius: 12px;
  background: linear-gradient(135deg, #134a47 0%, #19615c 55%, #23776e 100%) !important;
  color: #fff !important;
  font-weight: 800;
  box-shadow: 0 12px 24px -12px rgba(20, 97, 87, 0.6);
}
body.ls-page-knowledgebase .kb-search .input-group-append .btn:hover {
  filter: brightness(1.07);
}

/* ---- article / category cards ---- */
body.ls-page-knowledgebase .kb-category {
  margin-bottom: 16px;
  border: 1px solid #e2efeb;
  border-radius: 18px;
  background: linear-gradient(180deg, #f9fdfc 0%, #fff 100%);
  box-shadow: 0 1px 2px rgba(14, 43, 39, 0.03), 0 16px 36px -24px rgba(20, 97, 87, 0.2);
  transition: transform 0.16s ease, box-shadow 0.16s ease, border-color 0.16s ease;
}
body.ls-page-knowledgebase .kb-category:hover {
  transform: translateY(-2px);
  border-color: #bcd8d1;
  box-shadow: 0 1px 2px rgba(14, 43, 39, 0.03), 0 22px 44px -24px rgba(20, 97, 87, 0.35);
  text-decoration: none;
}
body.ls-page-knowledgebase .kb-category a.card-body,
body.ls-page-knowledgebase a.kb-category {
  text-decoration: none;
  padding: 18px 20px;
  border-radius: inherit;
}
body.ls-page-knowledgebase .kb-category .h5 {
  margin: 0 0 6px;
  color: #0b3d37;
  font-size: 15.5px !important;
  font-weight: 800;
  display: flex;
  align-items: center;
  gap: 10px;
}
body.ls-page-knowledgebase .kb-category .h5 i {
  flex: 0 0 auto;
  width: 38px;
  height: 38px;
  border-radius: 12px;
  background: linear-gradient(135deg, #eef8f4, #ddf3ec);
  color: #19615c;
  font-size: 16px;
}
body.ls-page-knowledgebase .kb-category .badge.badge-info {
  margin-inline-start: auto;
  padding: 4px 10px;
  border-radius: 999px;
  background: #eaf5f3 !important;
  border: 0;
  color: #19615c !important;
  font-size: 11px;
  font-weight: 800;
  white-space: nowrap;
}
body.ls-page-knowledgebase .kb-category p, 
body.ls-page-knowledgebase .kb-category p small {
  color: #647c78;
  font-size: 12.5px !important;
  font-weight: 600;
}

/* ---- article list cards (popular / in-category) ---- */
body.ls-page-knowledgebase .card {
  border: 1px solid #e2efeb;
  border-radius: 20px;
  background: #fff;
  box-shadow: 0 1px 2px rgba(14, 43, 39, 0.03), 0 20px 44px -26px rgba(20, 97, 87, 0.2);
}
body.ls-page-knowledgebase .card .card-title {
  margin: 0;
  color: #0b3d37;
  font-size: 16px !important;
  font-weight: 800;
  display: flex;
  align-items: center;
  gap: 9px;
}
body.ls-page-knowledgebase .card .card-title i {
  width: 38px;
  height: 38px;
  border-radius: 12px;
  background: linear-gradient(135deg, #eef8f4, #ddf3ec);
  color: #19615c;
  font-size: 16px;
  flex: 0 0 auto;
}
body.ls-page-knowledgebase .list-group-item.kb-article-item,
body.ls-page-knowledgebase .list-group-item {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  padding: 14px 20px;
  border: 0 !important;
  border-bottom: 1px solid #eff4f3 !important;
  background: transparent !important;
  color: #243140 !important;
  font-size: 14px;
  font-weight: 700;
  text-decoration: none;
  transition: background 0.15s ease;
}
body.ls-page-knowledgebase .list-group-item.kb-article-item:hover,
body.ls-page-knowledgebase .list-group-item:hover {
  background: #f7fbfa !important;
  text-decoration: none;
}
body.ls-page-knowledgebase .list-group-item:last-child {
  border-bottom: 0 !important;
}
body.ls-page-knowledgebase .list-group-item.kb-article-item i {
  margin-top: 2px;
  color: #19615c;
  width: 18px;
  height: 18px;
  font-size: 14px;
}
body.ls-page-knowledgebase .list-group-item.kb-article-item small {
  color: #647c78;
  font-weight: 600;
  font-size: 12.5px;
}

/* ---- empty / info alerts ---- */
body.ls-page-knowledgebase .alert-info {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  padding: 26px 20px;
  border: 1px dashed #bcd8d1 !important;
  border-radius: 18px !important;
  background: linear-gradient(180deg, #f8fcfb 0%, #fff 100%) !important;
  color: #3d5a55 !important;
  font-weight: 700;
}

/* ---- sidebar widgets on KB page (keep in sync with global ls2 design) ---- */
body.ls-page-knowledgebase .card-sidebar .card-title {
  margin: 0 !important;
  padding: 20px 22px 12px !important;
  background: #fff !important;
  background-image: none !important;
  border-radius: 0 !important;
  color: #0b3d37 !important;
  font-size: 16px !important;
  font-weight: 800 !important;
  text-align: start;
}
body.ls-page-knowledgebase .card-sidebar {
  border: 1px solid #e2ebe8 !important;
  border-radius: 24px !important;
  background: #fff !important;
  box-shadow: 0 1px 2px rgba(14, 43, 39, 0.04), 0 14px 34px -14px rgba(14, 43, 39, 0.12) !important;
  overflow: hidden;
}
body.ls-page-knowledgebase .card-sidebar .card-header {
  padding: 0 !important;
  margin: 0 !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
}
body.ls-page-knowledgebase .card-sidebar .card-text,
body.ls-page-knowledgebase .card-sidebar .card-body {
  padding: 0 12px 12px !important;
  margin: 0 !important;
  color: #3d5a55;
  font-size: 13px;
  font-weight: 600;
}
body.ls-page-knowledgebase .card-text a {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 11px 14px !important;
  border-radius: 14px;
  color: #3d5a55 !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  text-decoration: none;
  transition: background 0.15s ease, color 0.15s ease;
}
body.ls-page-knowledgebase .card-text a::before {
  content: "";
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: #a9d6c9;
  flex: none;
  transition: background 0.15s ease;
}
body.ls-page-knowledgebase .card-text a:hover {
  background: #f1f8f5;
  color: #146157 !important;
  text-decoration: none;
}
body.ls-page-knowledgebase .card-text a:hover::before {
  background: #146157;
}

/* ---- responsive ---- */
@media (max-width: 767.98px) {
  .ls-kb .ls-config-hero {
    padding: 24px 22px 22px;
    border-radius: 20px;
  }
  .ls-kb .ls-config-hero h1 { font-size: 24px; }
  .ls-kb .ls-config-hero p { font-size: 13.5px; }
}

/* ---- responsive ---- */
@media (max-width: 767.98px) {
  #order-standard_cart.ls-domain-transfer .ls-config-hero {
    padding: 24px 22px 22px;
    border-radius: 20px;
  }
  #order-standard_cart.ls-domain-transfer .ls-config-hero h1 { font-size: 24px; }
  body.ls-page-domaintransfer #order-standard_cart .panel-body { padding: 18px 16px 16px; }
  body.ls-page-domaintransfer #order-standard_cart .default-captcha div {
    justify-content: center;
  }
}

/* ticket sidebar footer buttons + labels (clientarea panels have .card.card-sidebar without .panel) */
body .card.card-sidebar .card-footer {
  display: flex;
  padding: 12px 14px 14px !important;
  background: transparent !important;
  border-top: 1px dashed #e9f1ef !important;
  border-bottom: 0;
}
body .card.card-sidebar .card-footer .row {
  display: grid !important;
  grid-template-columns: 1fr !important;
  gap: 10px;
  margin: 0 !important;
  width: 100%;
}
body .card.card-sidebar .card-footer .row > [class*="col"] {
  padding: 0 !important;
  width: 100% !important;
  max-width: 100% !important;
  flex: none !important;
  float: none !important;
}
body .card.card-sidebar .card-footer .btn {
  width: 100% !important;
  min-height: 46px;
  border-radius: 12px !important;
  font-size: 13.5px !important;
  font-weight: 800 !important;
  border: 0 !important;
  text-decoration: none;
}
body .card.card-sidebar .card-footer .btn-success,
body .card.card-sidebar .card-footer .btn-primary {
  background: linear-gradient(135deg, #134a47 0%, #19615c 55%, #23776e 100%) !important;
  color: #fff !important;
  box-shadow: 0 12px 24px -14px rgba(20, 97, 87, 0.55);
  transition: transform 0.16s ease, filter 0.16s ease;
}
body .card.card-sidebar .card-footer .btn-success:hover,
body .card.card-sidebar .card-footer .btn-primary:hover {
  transform: translateY(-1px);
  filter: brightness(1.06);
}
body .card.card-sidebar .card-footer .btn-danger {
  background: #fff !important;
  border: 1.5px solid #f3c1bd !important;
  color: #c0392b !important;
}
body .card.card-sidebar .card-footer .btn-danger:disabled,
body .card.card-sidebar .card-footer .btn-danger.disabled {
  background: #f2f6f5 !important;
  border-color: #e3eef1 !important;
  color: #8aa49e !important;
  opacity: 1 !important;
}
body .card.card-sidebar .label.label-success,
body .card.card-sidebar .label.label-success.label-label {
  display: inline-flex;
  padding: 3px 10px;
  border-radius: 999px;
  background: #e6f6ed !important;
  color: #1c8a5e !important;
  font-size: 10.5px;
  font-weight: 800;
}
/* plain .label without status class → neutral chip */
body .card.card-sidebar .list-group-item .label.label:not([class*="type-"]):not([class*="status-"]):not(.label-success) {
  display: inline-flex !important;
  align-items: center;
  padding: 3px 10px;
  border-radius: 999px;
  background: #f2f6f5 !important;
  color: #0b3d37 !important;
  font-size: 10.5px;
  font-weight: 800;
  text-transform: none;
}
/* disabled inputs (client name/email on logged-in reply) — replace the
   grey bootstrap wash with calm mint so they read as info, not voids */
body.ls-page-viewticket .ls-ticket-page .form-control:disabled,
body.ls-page-viewticket .ls-ticket-page .form-control[disabled],
body.ls-page-viewticket .ls-ticket-page .form-control[readonly] {
  background: #f8fcfb !important;
  border: 1px dashed #cfe3df !important;
  color: #40625c !important;
  opacity: 1 !important;
  box-shadow: none !important;
  font-weight: 600;
}

/* desktop scale-up (readable sizes on big screens) ---- */
@media (min-width: 992px) {
  body.ls-page-viewticket .ls-ticket-hero {
    padding: 34px 36px 30px;
  }
  body.ls-page-viewticket .ls-ticket-hero h1 {
    font-size: 34px;
  }
  body.ls-page-viewticket .ls-ticket-hero p {
    font-size: 15.5px;
  }
  body.ls-page-viewticket .ls-ticket-hero .ticket-actions .btn {
    min-height: 50px;
    padding: 12px 22px;
    font-size: 14.5px;
  }
  body.ls-page-viewticket .ls-ticket-thread .ticket-reply .message {
    font-size: 15px;
    line-height: 1.9;
    padding: 6px 18px 16px;
  }
  body.ls-page-viewticket .ls-ticket-thread .ticket-reply .posted-by {
    font-size: 14px;
  }
  body.ls-page-viewticket .ls-ticket-thread .ticket-reply .posted-by-name {
    font-size: 15px;
  }
  body.ls-page-viewticket .card.card-sidebar .card-title {
    font-size: 17px !important;
  }
  body.ls-page-viewticket .card.card-sidebar .list-group-item {
    font-size: 14.5px !important;
  }
  body.ls-page-viewticket .ls-ticket-page label {
    font-size: 14.5px;
  }
  body.ls-page-viewticket .ls-ticket-page .form-control,
  body.ls-page-viewticket .ls-ticket-page select.form-control {
    height: 50px;
    min-height: 50px;
    font-size: 15px;
  }
  /* the tall box is ONLY for the message field — never the name/email inputs */
  body.ls-page-viewticket .ls-ticket-page textarea.form-control {
    min-height: 240px;
  }
  body.ls-page-viewticket .ls-ticket-page .md-editor .md-input {
    min-height: 260px;
    font-size: 15px;
  }
  body.ls-page-viewticket .ls-ticket-actions .btn-primary {
    min-height: 54px;
    font-size: 15px;
  }
}

/* ==================================================================
   Header dropdowns — site-wide
   WHMCS wraps the <a> inside an <li class="dropdown-item">, so BOTH
   rows repaint on hover, and the a (which carries utility py-0) is
   only text-height → tiny click target.
   • hover/focus must never repaint the background
   • the link swallows the whole row as the hit target
   ================================================================== */
#header .dropdown-menu .dropdown-item,
#header .dropdown-menu .dropdown-item a,
#header .dropdown-menu .dropdown-item:hover,
#header .dropdown-menu .dropdown-item a:hover,
#header .dropdown-menu .dropdown-item:focus,
#header .dropdown-menu .dropdown-item a:focus,
#header .dropdown-menu .dropdown-item:focus-within,
#header .dropdown-menu .dropdown-item.active,
#header .dropdown-menu .dropdown-item a.active {
  background: transparent !important;
  background-color: transparent !important;
}
/* …but give the full row a deliberate soft hover so items feel alive.
   Paint the same box the a fills → continuous highlight, no seams */
#header .dropdown-menu .dropdown-item:hover,
#header .dropdown-menu .dropdown-item:focus-within,
#header .dropdown-menu .dropdown-item a:hover,
#header .dropdown-menu .dropdown-item a:focus {
  background-color: var(--ls-primary-subtle, #eef7f4) !important;
  color: var(--ls-primary, #19615c) !important;
}
#header .dropdown-menu > li.dropdown-item {
  padding: 0 !important;
  margin: 0;
}
#header .dropdown-menu .dropdown-item a {
  display: block !important;
  width: 100% !important;
  box-sizing: border-box;
  padding: 0.6rem 1.1rem !important;
  margin: 0 !important;
  line-height: 1.55;
  cursor: pointer;
}

/* ==================================================================
   Mobile header menu (<1200px: navbar-expand-xl is collapsed)
   • #nav fills the whole width (it was shrink-to-fit ~150px)
   • rows are full-width, right-aligned, hairline-separated
   • submenus unfold inline as flush soft panels (no floating cards)
   ================================================================== */
@media (max-width: 1199.98px) {
  #header .main-navbar-wrapper.collapse,
  #header .main-navbar-wrapper.collapsing {
    width: 100% !important;
    padding: 0 !important;
  }
  #header .ls-header-menus {
    width: 100% !important;
  }
  #nav {
    width: 100% !important;
    flex-direction: column !important;
    align-items: stretch;
    padding: 4px 0 10px;
  }
  #nav > li {
    width: 100%;
    margin: 0;
  }
  #nav > li > a {
    width: 100%;
    justify-content: flex-start;
    text-align: right;
    font-weight: 700;
    color: #0e2b27;
    padding: 13px 8px !important;
    border-bottom: 1px solid #eef4f2;
    border-radius: 0 !important;
  }
  #nav > li:last-child > a {
    border-bottom: 0;
  }
  /* submenu folds inline — flush soft panel instead of a floating card */
  #nav > li > .dropdown-menu {
    position: static !important;
    float: none !important;
    width: 100% !important;
    margin: 0 !important;
    padding: 6px 0;
    border: 0 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    background: #f6faf9 !important;
  }
  #nav > li > .dropdown-menu .dropdown-item a {
    padding: 10px 20px !important;
    font-weight: 600;
    color: #33514c;
  }
  #nav > li > .dropdown-menu .dropdown-item:last-child a {
    border-bottom: 0;
  }
}

/* ==================================================================
   DOMAINS PAGE — full redesign (body.ls-page-clientareadomains)
   Same chrome as dashboard/viewticket: 1360px rail, hero + art card,
   segmented bulk toolbar, DataTable as soft row-cards.
   ================================================================== */
/* layout rail -------------------------------------------------- */
body.ls-page-clientareadomains #main-body > .container {
  max-width: 1360px;
  padding: 0 28px;
}
body.ls-page-clientareadomains #main-body > .container > .row {
  display: grid !important;
  /* RTL: track1 (right) holds the first child = sidebar */
  grid-template-columns: minmax(300px, 27%) minmax(0, 1fr);
  gap: 30px;
  align-items: start;
}
body.ls-page-clientareadomains #main-body > .container > .row > [class*="col"] {
  width: auto !important;
  max-width: none !important;
  flex: none !important;
  float: none !important;
  padding: 0 !important;
}
@media (max-width: 991px) {
  body.ls-page-clientareadomains #main-body > .container > .row {
    grid-template-columns: minmax(0, 1fr);
  }
  body.ls-page-clientareadomains #main-body > .container > .row > .col-lg-4 {
    grid-row: 2;
    margin-top: 20px;
  }
}
/* fonts/labels base -------------------------------------------- */
body.ls-page-clientareadomains {
  --ls-dom-ink: #10312c;
  --ls-dom-line: #e3eef1;
}
body.ls-page-clientareadomains .ls2-dom-hero .fal,
body.ls-page-clientareadomains .ls2-dom-toolbar .fal,
body.ls-page-clientareadomains .ls2-dom-table .fal,
body.ls-page-clientareadomains .ls2-dom-table .fas {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
}
/* hero --------------------------------------------------------- */
body.ls-page-clientareadomains .ls2-dom-hero {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 26px;
  margin: 6px 0 18px;
  background: linear-gradient(135deg, #f3fbf6 0%, #eaf6f0 60%, #f6fcf9 100%);
  border: 1px solid #dcefe4;
  border-radius: 26px;
  padding: 26px 30px;
  overflow: hidden;
  position: relative;
}
body.ls-page-clientareadomains .ls2-dom-hero-body { min-width: 0; }
body.ls-page-clientareadomains .ls2-dom-kicker {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  background: #fff;
  border: 1px solid #d8ebe2;
  color: #1b6a5a;
  border-radius: 999px;
  padding: 7px 14px;
  font-size: 12px;
  font-weight: 800;
  margin-bottom: 12px;
  box-shadow: 0 6px 14px -10px rgba(20, 97, 87, 0.35);
}
body.ls-page-clientareadomains .ls2-dom-title {
  margin: 0 0 12px;
  font-size: 28px;
  font-weight: 900;
  color: var(--ls-dom-ink);
  letter-spacing: 0; /* rtl-design: never track Persian script */
}
body.ls-page-clientareadomains .ls2-dom-stats {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-bottom: 16px;
}
body.ls-page-clientareadomains .ls2-dom-chip {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  background: rgba(255, 255, 255, 0.85);
  border: 1px solid #d8ebe2;
  color: #2c544d;
  border-radius: 999px;
  padding: 6px 13px;
  font-size: 12.5px;
  font-weight: 700;
}
body.ls-page-clientareadomains .ls2-dom-chip .fal { color: #23957f; font-size: 12px; }
body.ls-page-clientareadomains .ls2-dom-chip b { color: #10312c; font-weight: 900; }
body.ls-page-clientareadomains .ls2-dom-chipdot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: #23957f;
  box-shadow: 0 0 0 3px rgba(35, 149, 127, 0.15);
}
body.ls-page-clientareadomains .ls2-dom-ctas {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}
body.ls-page-clientareadomains .ls2-dom-cta {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  min-height: 46px;
  padding: 11px 20px;
  border-radius: 14px;
  font-size: 13.5px;
  font-weight: 800;
  text-decoration: none;
  transition: transform 0.16s ease, filter 0.16s ease, box-shadow 0.16s ease;
}
body.ls-page-clientareadomains .ls2-dom-cta .fal { font-size: 13px; }
body.ls-page-clientareadomains .ls2-dom-cta:hover { transform: translateY(-1.5px); text-decoration: none; }
body.ls-page-clientareadomains .ls2-dom-cta-primary {
  color: #fff !important;
  background: linear-gradient(135deg, #124b46 0%, #19615c 55%, #23796f 100%);
  box-shadow: 0 14px 26px -14px rgba(17, 84, 73, 0.55);
}
body.ls-page-clientareadomains .ls2-dom-cta-primary:hover { filter: brightness(1.05); }
body.ls-page-clientareadomains .ls2-dom-cta-ghost {
  color: #1c6a5b;
  background: #fff;
  border: 1px solid #cfe5dc;
}
body.ls-page-clientareadomains .ls2-dom-cta-ghost:hover { box-shadow: 0 10px 20px -14px rgba(23, 122, 105, 0.4); }
body.ls-page-clientareadomains .ls2-dom-art {
  flex: none;
  width: 330px;
  max-width: 46%;
}
body.ls-page-clientareadomains .ls2-dom-art svg { width: 100% !important; height: auto !important; max-width: 380px; }
@media (max-width: 767px) {
  body.ls-page-clientareadomains .ls2-dom-hero { flex-direction: column; align-items: flex-start; padding: 22px; }
  body.ls-page-clientareadomains .ls2-dom-art { display: none; }
  body.ls-page-clientareadomains .ls2-dom-title { font-size: 22px; }
  body.ls-page-clientareadomains .ls2-dom-cta { min-height: 42px; padding: 9px 16px; font-size: 12.5px; }
}
/* bulk toolbar ------------------------------------------------- */
body.ls-page-clientareadomains .ls2-dom-toolbar {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px;
  background: #fff;
  border: 1px solid var(--ls-dom-line);
  border-radius: 20px;
  padding: 10px 14px;
  margin-bottom: 14px;
  box-shadow: 0 1px 2px rgba(14, 43, 39, 0.03), 0 16px 30px -26px rgba(20, 97, 87, 0.28);
}
body.ls-page-clientareadomains .ls2-dom-toolbar-label {
  display: inline-flex;
  align-items: center;
  color: #2c544d;
  font-size: 12.5px;
  font-weight: 800;
}
body.ls-page-clientareadomains .ls2-dom-tdot {
  display: inline-block;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: #23957f;
  margin-inline-end: 8px;
}
body.ls-page-clientareadomains .ls2-dom-toolbar-group {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-inline-start: auto;
}
body.ls-page-clientareadomains .ls2-dom-tool {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  background: #f4faf7 !important;
  border: 1px solid #dfeae7 !important;
  color: #23564f !important;
  border-radius: 999px !important;
  font-weight: 800;
  font-size: 12.5px;
  padding: 9px 16px !important;
  min-height: 0 !important;
  box-shadow: none !important;
  transition: background 0.15s ease, border-color 0.15s ease, color 0.15s ease;
}
body.ls-page-clientareadomains .ls2-dom-tool:hover,
body.ls-page-clientareadomains .ls2-dom-tool:focus {
  background: #e9f5ef !important;
  border-color: #bcd9cf !important;
  color: #174b43 !important;
  text-decoration: none;
}
body.ls-page-clientareadomains .ls2-dom-toolbar .dropdown-menu {
  border: 1px solid var(--ls-dom-line);
  border-radius: 14px;
  box-shadow: 0 18px 40px -22px rgba(14, 43, 39, 0.4);
  overflow: hidden;
  padding: 6px;
}
body.ls-page-clientareadomains .ls2-dom-toolbar .dropdown-menu .dropdown-item {
  color: #2c544d;
  font-weight: 700;
  font-size: 12.5px;
  border-radius: 10px;
  padding: 9px 12px;
  background: transparent;
}
body.ls-page-clientareadomains .ls2-dom-toolbar .dropdown-menu .dropdown-item:hover,
body.ls-page-clientareadomains .ls2-dom-toolbar .dropdown-menu .dropdown-item:focus {
  background: #eef7f4;
  color: #19615c;
}
body.ls-page-clientareadomains .ls2-dom-toolbar .dropdown-menu .dropdown-item i {
  display: inline-flex !important;
  margin-inline-end: 7px;
}
/* DataTable shell ---------------------------------------------- */
body.ls-page-clientareadomains .ls2-dom-table {
  background: #fff;
  border: 1px solid var(--ls-dom-line);
  border-radius: 22px;
  padding: 8px 18px 16px;
  box-shadow: 0 1px 2px rgba(14, 43, 39, 0.03), 0 20px 40px -30px rgba(20, 97, 87, 0.3);
}
body.ls-page-clientareadomains #tableDomainsList_wrapper { padding: 0; }
body.ls-page-clientareadomains .listtable {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px;
  padding: 10px 0 12px;
  border-bottom: 1px solid #edf4f1;
  margin-bottom: 2px;
}
body.ls-page-clientareadomains .listtable .dataTables_filter {
  order: 1;
  margin: 0;
}
body.ls-page-clientareadomains .listtable .dataTables_filter label {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  color: #647c78;
  font-size: 12.5px;
  font-weight: 700;
  margin: 0;
}
body.ls-page-clientareadomains .listtable .dataTables_filter input[type="search"],
body.ls-page-clientareadomains .listtable .dataTables_filter input[type="text"] {
  width: 250px;
  min-height: 44px;
  border: 1px solid #ddeae6 !important;
  background: #fbfdfc !important;
  border-radius: 13px !important;
  box-shadow: none !important;
  padding: 8px 14px !important;
  color: #123a34;
  font-weight: 600;
  font-size: 13.5px;
  transition: border-color 0.15s ease, box-shadow 0.15s ease;
}
body.ls-page-clientareadomains .listtable .dataTables_filter input:focus {
  outline: none;
  border-color: #19615c !important;
  box-shadow: 0 0 0 3px rgba(25, 97, 92, 0.12) !important;
}
body.ls-page-clientareadomains .listtable .dataTables_info {
  order: 2;
  margin-inline-start: auto;
  color: #647c78;
  font-size: 12.5px;
  font-weight: 600;
}
body.ls-page-clientareadomains .listtable table {
  order: 10;
  flex: 1 1 100%;
}
/* table -------------------------------------------------------- */
body.ls-page-clientareadomains #tableDomainsList {
  border-collapse: separate !important;
  border-spacing: 0 10px;
  width: 100% !important;
  margin: 4px 0 2px !important;
}
body.ls-page-clientareadomains #tableDomainsList thead th {
  background: transparent !important;
  border: 0 !important;
  color: #84a29b;
  font-size: 11.5px;
  font-weight: 800;
  padding: 4px 14px !important;
  white-space: nowrap;
  border-bottom: 0 !important;
}
body.ls-page-clientareadomains #tableDomainsList thead th::after,
body.ls-page-clientareadomains #tableDomainsList thead th::before {
  color: #a7c0ba;
  font-size: 10px;
}
body.ls-page-clientareadomains #tableDomainsList tbody tr {
  background: #fff !important;
  box-shadow: 0 1px 2px rgba(14, 43, 39, 0.04), 0 12px 26px -20px rgba(20, 97, 87, 0.3);
  cursor: pointer;
  transition: background 0.15s ease;
}
body.ls-page-clientareadomains #tableDomainsList tbody tr:hover {
  background: #f8fcfb !important;
}
body.ls-page-clientareadomains #tableDomainsList tbody tr:has(input[type="checkbox"]:checked),
body.ls-page-clientareadomains #tableDomainsList tbody tr.ls2-row-checked {
  background: #f0f9f5 !important;
  box-shadow: 0 0 0 1px #bfe0d5 inset, 0 12px 26px -20px rgba(20, 97, 87, 0.35);
}
body.ls-page-clientareadomains #tableDomainsList tbody td {
  border: 0 !important;
  background: transparent !important;
  vertical-align: middle;
  padding: 13px 14px !important;
}
body.ls-page-clientareadomains #tableDomainsList tbody td:first-child {
  border-radius: 0 16px 16px 0;
}
body.ls-page-clientareadomains #tableDomainsList tbody td:last-child {
  border-radius: 16px 0 0 16px;
}
body.ls-page-clientareadomains #tableDomainsList .ls2-th-check,
body.ls-page-clientareadomains #tableDomainsList .ls2-td-check { width: 46px; }
body.ls-page-clientareadomains #tableDomainsList .ls2-th-ssl,
body.ls-page-clientareadomains #tableDomainsList .ls2-td-ssl { width: 60px; text-align: center; }
/* custom checkbox ---------------------------------------------- */
body.ls-page-clientareadomains #tableDomainsList input[type="checkbox"] {
  appearance: none;
  -webkit-appearance: none;
  display: block;
  width: 20px;
  height: 20px;
  border: 1.6px solid #c9ddd8;
  border-radius: 7px;
  background: #fff;
  cursor: pointer;
  margin: 0 auto;
  transition: border-color 0.15s ease, background 0.15s ease;
}
body.ls-page-clientareadomains #tableDomainsList input[type="checkbox"]:hover { border-color: #19615c; }
body.ls-page-clientareadomains #tableDomainsList input[type="checkbox"]:checked {
  background: #19615c
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23fff' d='M20.2 6.6 9.9 16.9l-6.1-6.1 1.4-1.4 4.7 4.7 8.9-8.9z'/%3E%3C/svg%3E")
    center / 12px no-repeat;
  border-color: #19615c;
}
/* name + autorenew ---------------------------------------------- */
body.ls-page-clientareadomains .ls2-dom-namecell { min-width: 180px; }
body.ls-page-clientareadomains .ls2-dom-name {
  color: #123a34;
  font-weight: 800;
  font-size: 14.5px;
  text-decoration: none;
  word-break: break-word;
}
body.ls-page-clientareadomains .ls2-dom-name:hover { color: #19615c; text-decoration: underline; }
body.ls-page-clientareadomains .ls2-dom-renew {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  margin-top: 6px;
  background: #f4faf7;
  border: 1px solid #dcebe6;
  color: #23695c;
  border-radius: 999px;
  padding: 3px 11px;
  font-size: 11px;
  font-weight: 800;
  line-height: 1.5;
}
body.ls-page-clientareadomains .ls2-dom-renew .fa-check { color: #2f9c82; }
body.ls-page-clientareadomains .ls2-dom-renew .fa-times { color: #cf5f5f; }
/* dates --------------------------------------------------------- */
body.ls-page-clientareadomains .ls2-td-date {
  color: #4b6a63;
  font-weight: 700;
  font-size: 13.5px;
  white-space: nowrap;
}
/* status chips --------------------------------------------------- */
body.ls-page-clientareadomains .ls2-td-status .ls2-dom-statusls,
body.ls-page-clientareadomains .ls2-td-status span.label {
  display: inline-flex;
  align-items: center;
  font-family: inherit;
  font-size: 11.5px !important;
  font-weight: 800;
  padding: 5px 12px !important;
  border-radius: 999px !important;
  background: #eef2f4 !important;
  color: #44586a !important;
  text-shadow: none !important;
}
body.ls-page-clientareadomains .ls2-td-status .label[class*="status-active"],
body.ls-page-clientareadomains table td .label.status-active {
  background: #e6f7f0 !important;
  color: #157a5f !important;
}
body.ls-page-clientareadomains .ls2-td-status .label[class*="status-pending"],
body.ls-page-clientareadomains .ls2-td-status .label[class*="status-unpaid"],
body.ls-page-clientareadomains .ls2-td-status .label[class*="status-renewing"],
body.ls-page-clientareadomains .ls2-td-status .label[class*="status-grace"] {
  background: #fdf3df !important;
  color: #8a6a1f !important;
}
body.ls-page-clientareadomains .ls2-td-status .label[class*="status-expired"],
body.ls-page-clientareadomains .ls2-td-status .label[class*="status-cancelled"],
body.ls-page-clientareadomains .ls2-td-status .label[class*="status-fraud"] {
  background: #fdecec !important;
  color: #a8393a !important;
}
/* empty state ---------------------------------------------------- */
body.ls-page-clientareadomains #tableDomainsList td.dataTables_empty {
  background: #f9fcfb !important;
  border-radius: 16px !important;
  text-align: center;
  color: #748f88;
  font-weight: 700;
  font-size: 13.5px;
  padding: 34px 12px !important;
}
body.ls-page-clientareadomains #tableDomainsList td.dataTables_empty::before {
  content: "";
  display: block;
  width: 46px;
  height: 46px;
  border-radius: 50%;
  background: #e4f1ec;
  margin: 0 auto 10px;
}
/* pagination + length -------------------------------------------- */
body.ls-page-clientareadomains .dataTables_paginate {
  float: none !important;
  display: flex;
  justify-content: center;
  width: 100% !important;
  margin: 6px 0 0;
  padding: 12px 0 2px;
}
body.ls-page-clientareadomains .dataTables_paginate ul.pagination {
  display: flex;
  gap: 6px;
  margin: 0;
  flex-wrap: wrap;
}
body.ls-page-clientareadomains .dataTables_paginate .pagination > li > a,
body.ls-page-clientareadomains .dataTables_paginate .pagination > li > span {
  border: 0 !important;
  background: #f2f7f5;
  color: #2f5d55;
  font-weight: 800;
  min-width: 34px;
  min-height: 34px;
  line-height: 34px;
  text-align: center;
  border-radius: 11px;
  margin: 0;
  padding: 0 10px;
  font-size: 12.5px;
}
body.ls-page-clientareadomains .dataTables_paginate .pagination > li.active > a,
body.ls-page-clientareadomains .dataTables_paginate .pagination > li.active > span {
  color: #fff !important;
  background: linear-gradient(135deg, #134a47, #19615c 60%, #237a6e) !important;
  box-shadow: 0 10px 18px -12px rgba(19, 84, 73, 0.65);
}
body.ls-page-clientareadomains .dataTables_paginate .pagination > li.disabled > a,
body.ls-page-clientareadomains .dataTables_paginate .pagination > li.disabled > span {
  background: #f7faf9;
  color: #9db3ad;
}
body.ls-page-clientareadomains .dataTables_paginate ul.pagination > li > a:hover {
  background: #e7f2ee;
  color: #174b43;
}
body.ls-page-clientareadomains .dataTables_length {
  float: none !important;
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 8px;
  width: 100% !important;
  margin: 10px auto 0;
  color: #647c78;
  font-size: 12.5px;
  font-weight: 600;
}
body.ls-page-clientareadomains .dataTables_length select {
  border: 1px solid #ddeae6;
  background: #fbfdfc;
  border-radius: 11px;
  color: #123a34;
  font-weight: 700;
  padding: 5px 9px;
  min-height: 34px;
  box-shadow: none;
}
body.ls-page-clientareadomains #tableLoading {
  padding: 26px 0;
  color: #5d7a73;
  font-weight: 700;
}
body.ls-page-clientareadomains #tableLoading .fa-spinner { color: #23957f; }
/* phone -----------------------------------------------------------
   Responsive plugin handles column folding; keep the list swipeable. */
@media (max-width: 767px) {
  body.ls-page-clientareadomains .ls2-dom-table { padding: 8px 12px 14px; overflow-x: auto; }
  body.ls-page-clientareadomains .listtable .dataTables_filter input[type="search"],
  body.ls-page-clientareadomains .listtable .dataTables_filter input[type="text"] { width: 190px; }
  body.ls-page-clientareadomains .listtable .dataTables_info { margin-inline-start: 0; }
}
@media (prefers-reduced-motion: reduce) {
  body.ls-page-clientareadomains .ls2-dom-cta { transition: none; }
}

/* ==================================================================
   DOMAIN DETAILS PAGE (body.ls-page-clientareadomaindetails)
   - hero keeps custom.css look but gains the animated art panel on
     the empty left side (grid rows so the CTA block stays stacked)
   - invoice alert becomes a message|action grid (same class ships on
     hosting details too, so this rule is global but specificity-safe)
   ================================================================== */
body.ls-page-clientareadomaindetails .ls-product-hero {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(230px, 300px);
  align-items: center;
  column-gap: 26px;
}
body.ls-page-clientareadomaindetails .ls-product-hero-art {
  grid-column: 2;
  grid-row: 1 / span 2;
  width: 100%;
  max-width: 300px;
}
body.ls-page-clientareadomaindetails .ls-product-hero-art svg {
  width: 100%;
  height: auto;
  max-width: 300px;
}
body.ls-page-clientareadomaindetails .ls-domain-card.card {
  border: 1px solid var(--ls-border, #dde8e6);
  box-shadow: 0 1px 2px rgba(14, 43, 39, 0.03), 0 20px 40px -30px rgba(20, 97, 87, 0.3);
}
/* invoice alert: message right / button left, chip top-aligned on mobile */
html body .ls-product-invoice-alert {
  display: grid;
  grid-template-columns: minmax(0, 1fr) max-content;
  align-items: center;
  gap: 12px;
  border-radius: 16px;
}
html body .ls-product-invoice-alert > div {
  grid-column: 2;
  grid-row: 1;
  float: none !important;
  margin: 0;
}
@media (max-width: 575px) {
  html body .ls-product-invoice-alert {
    grid-template-columns: minmax(0, 1fr);
  }
  html body .ls-product-invoice-alert > div {
    grid-row: 1;
  }
}
html body .ls-product-invoice-alert .btn {
  min-height: 40px;
  padding: 8px 18px;
  border-radius: 999px;
  font-weight: 800;
  font-size: 13px;
  white-space: nowrap;
  box-shadow: 0 10px 20px -12px rgba(23, 122, 105, 0.55);
}
@media (max-width: 767px) {
  body.ls-page-clientareadomaindetails .ls-product-hero {
    grid-template-columns: minmax(0, 1fr);
  }
  body.ls-page-clientareadomaindetails .ls-product-hero-art {
    display: none;
  }
}

/* small inline glyphs inside stat-tile labels (ls-stat-ico spans) */
body .ls-product-stat span .ls-ico {
  width: 14px;
  height: 14px;
  margin-inline-end: 6px;
  vertical-align: -2px;
  color: #23957f;
}

/* page-wide solid-icon restore for THIS page: canvas-verified that these
   .fas glyphs exist in the FA Pro subset, so the global font-only fix
   (icons.css) that hides .fas must be lifted here surgicaly, scoped. */
html body.ls-page-clientareadomaindetails .fas {
  display: inline-block !important;
}
/* registrar module output cards: swap the foreign blue chips for the
   theme soft-teal icon tiles and center the now-visible glyphs */
html body .domain-info-card-icon {
  background: var(--ls-primary-subtle, #eef7f4) !important;
  color: #19615c !important;
  border-radius: 12px;
}
html body .domain-info-card-icon .fas {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
  font-size: 15px;
}

/* disabled management entries (unmanaged/pending domains) must LOOK and
   FEEL non-clickable instead of masquerading as available actions. */
html body .card-sidebar .list-group-item.disabled,
html body .list-group-item-action.disabled {
  color: #9cb6af !important;
  cursor: not-allowed !important;
  pointer-events: none;
  background: transparent !important;
  box-shadow: none;
}
html body .card-sidebar .list-group-item.disabled:hover,
html body .card-sidebar .list-group-item.disabled:focus {
  background: transparent !important;
  box-shadow: none;
}

/* ==================================================================
   USER PASSWORD PAGE (body.ls-page-user-password) — index.php?rp=/user/password
   Same chrome as the other account pages: 1360 rail, hero + art, one
   form card with mint inputs, themed strength meter, generator pill.
   Hooks kept: .using-password-strength, #passwordStrengthBar,
   input ids, #inputNewPassword2Msg, generate-password[data-targetfields],
   input[type=submit]/[type=reset] (pwstrength.js disables on mismatch).
   ================================================================== */
body.ls-page-user-password #main-body > .container {
  max-width: 1360px;
  padding: 0 28px;
}
body.ls-page-user-password #main-body > .container > .row {
  display: grid !important;
  grid-template-columns: minmax(320px, 27%) minmax(0, 1fr);
  gap: 30px;
  align-items: start;
}
body.ls-page-user-password #main-body > .container > .row > [class*="col"] {
  width: auto !important;
  max-width: none !important;
  flex: none !important;
  float: none !important;
  padding: 0 !important;
}
@media (max-width: 991px) {
  body.ls-page-user-password #main-body > .container > .row {
    grid-template-columns: minmax(0, 1fr);
  }
  body.ls-page-user-password #main-body > .container > .row > .col-lg-4 {
    grid-row: 2;
    margin-top: 20px;
  }
}
/* hero ---------------------------------------------------------- */
body.ls-page-user-password .ls2-userpw-hero {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  margin: 6px 0 16px;
  background: linear-gradient(135deg, #f3fbf6 0%, #eaf6f0 60%, #f6fcf9 100%);
  border: 1px solid #dcefe4;
  border-radius: 26px;
  padding: 24px 28px;
  overflow: hidden;
}
body.ls-page-user-password .ls2-userpw-kicker {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  background: #fff;
  border: 1px solid #d8ebe2;
  color: #1b6a5a;
  border-radius: 999px;
  padding: 6px 13px;
  font-size: 12px;
  font-weight: 800;
  margin-bottom: 11px;
  box-shadow: 0 6px 14px -10px rgba(20, 97, 87, 0.35);
}
body.ls-page-user-password .ls2-userpw-kicker .ls-ico {
  width: 13px;
  height: 13px;
  color: #23957f;
}
body.ls-page-user-password .ls2-userpw-title {
  margin: 0 0 10px;
  font-size: 27px;
  font-weight: 900;
  color: #10312c;
  letter-spacing: 0; /* rtl-design: never track Persian script */
}
body.ls-page-user-password .ls2-userpw-sub {
  margin: 0;
  color: #3f6059;
  font-size: 13.5px;
  font-weight: 600;
  line-height: 1.9;
}
body.ls-page-user-password .ls2-userpw-hero-art {
  flex: none;
  width: 280px;
  max-width: 42%;
}
body.ls-page-user-password .ls2-userpw-hero-art svg {
  width: 100% !important;
  height: auto !important;
  max-width: 300px;
}
@media (max-width: 767px) {
  body.ls-page-user-password .ls2-userpw-hero {
    flex-direction: column;
    align-items: flex-start;
    padding: 20px;
  }
  body.ls-page-user-password .ls2-userpw-hero-art {
    display: none;
  }
  body.ls-page-user-password .ls2-userpw-title {
    font-size: 21px;
  }
}
/* form card ------------------------------------------------------ */
body.ls-page-user-password .ls2-userpw-form {
  background: #fff;
  border: 1px solid #e3eef1;
  border-radius: 22px;
  padding: 24px 26px 22px;
  box-shadow: 0 1px 2px rgba(14, 43, 39, 0.03), 0 20px 40px -30px rgba(20, 97, 87, 0.3);
}
body.ls-page-user-password .ls2-userpw-field + .ls2-userpw-field {
  margin-top: 16px;
}
body.ls-page-user-password .ls2-userpw-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}
body.ls-page-user-password .ls2-userpw-label {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  color: #2c544d;
  font-size: 12.5px;
  font-weight: 800;
  margin: 0 0 8px;
}
body.ls-page-user-password .ls2-userpw-row .ls2-userpw-label {
  margin: 0;
}
body.ls-page-user-password .ls2-userpw-label .ls-ico {
  width: 15px;
  height: 15px;
  color: #23957f;
}
body.ls-page-user-password .ls2-userpw-input {
  width: 100%;
  min-height: 50px;
  border: 1px solid #ddeae6 !important;
  background: #fbfdfc !important;
  border-radius: 14px !important;
  box-shadow: none !important;
  padding: 10px 16px !important;
  color: #123a34;
  font-weight: 700;
  font-size: 14px;
  transition: border-color 0.15s ease, box-shadow 0.15s ease;
}
body.ls-page-user-password .ls2-userpw-input:focus {
  outline: none;
  border-color: #19615c !important;
  box-shadow: 0 0 0 3px rgba(25, 97, 92, 0.12) !important;
}
body.ls-page-user-password .ls2-userpw-input.is-valid {
  border-color: #7fcdb6 !important;
  background: #f6fcf9 !important;
}
body.ls-page-user-password .ls2-userpw-input.is-invalid {
  border-color: #e7a6a6 !important;
  background: #fdf7f6 !important;
}
body.ls-page-user-password .ls2-userpw-inputgrp {
  display: flex;
  align-items: stretch;
  gap: 10px;
}
body.ls-page-user-password .ls2-userpw-inputgrp .ls2-userpw-input {
  flex: 1 1 auto;
  width: auto !important;
}
body.ls-page-user-password .ls2-userpw-inputgrp .ls2-userpw-gen {
  flex: 0 0 auto;
  align-self: stretch;
  min-height: 0;
}
/* generator pill -------------------------------------------------- */
body.ls-page-user-password .ls2-userpw-gen {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  min-height: 38px;
  padding: 8px 16px;
  border: 1px solid #d8ebe2;
  background: #f4faf7;
  color: #1c6a5b;
  border-radius: 999px;
  font-size: 12.5px;
  font-weight: 800;
  white-space: nowrap;
  transition: background 0.15s ease, border-color 0.15s ease;
}
body.ls-page-user-password .ls2-userpw-gen .ls-ico {
  width: 13px;
  height: 13px;
  color: #23957f;
}
body.ls-page-user-password .ls2-userpw-gen:hover {
  background: #e9f5ef;
  border-color: #bcd9cf;
  text-decoration: none;
}
/* matching message ------------------------------------------------ */
body.ls-page-user-password #inputNewPassword2Msg #nonMatchingPasswordResult {
  margin: 8px 0 0;
  color: #a8393a;
  background: #fdecec;
  border: 1px solid #f3d3d3;
  border-radius: 11px;
  padding: 7px 12px;
  font-size: 12.5px;
  font-weight: 700;
}
/* strength meter -------------------------------------------------- */
body.ls-page-user-password #passwordStrengthBar {
  height: 8px;
  margin: 12px 0 0;
  background: #e8f1ee;
  border-radius: 999px;
  overflow: hidden;
  flex: none;
}
body.ls-page-user-password #passwordStrengthBar .progress-bar {
  background: linear-gradient(90deg, #237a6e, #19615c);
  border-radius: 999px;
  transition: width 0.25s ease;
}
body.ls-page-user-password #passwordStrengthBar .progress-bar.bg-danger {
  background: #e05a5b !important;
}
body.ls-page-user-password #passwordStrengthBar .progress-bar.bg-warning {
  background: #d9952c !important;
}
body.ls-page-user-password #passwordStrengthBar .progress-bar.bg-success {
  background: #2f9c82 !important;
}
/* tips alert (pwstrength include) --------------------------------- */
body.ls-page-user-password .ls2-userpw-form .alert-info {
  margin-top: 14px;
  background: #eef7f4;
  border: 1px solid #d3eae2;
  border-radius: 14px;
  color: #2c544d;
  font-weight: 600;
  text-align: right;
}
body.ls-page-user-password .ls2-userpw-form .alert-info small {
  font-size: 12px;
}
html body.ls-page-user-password .ls2-userpw-form .alert-info .fa {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  margin-inline-end: 7px;
  color: #23957f;
}
/* actions ---------------------------------------------------------- */
body.ls-page-user-password .ls2-userpw-actions {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-top: 20px;
}
body.ls-page-user-password .ls2-userpw-actions input {
  min-height: 46px;
  border: 0;
  cursor: pointer;
  font-weight: 800;
  border-radius: 14px;
  font-family: inherit;
  font-size: 13.5px;
  transition: filter 0.15s ease, background 0.15s ease, box-shadow 0.15s ease;
}
body.ls-page-user-password .ls2-userpw-save {
  color: #fff !important;
  background: linear-gradient(135deg, #124b46 0%, #19615c 55%, #23796f 100%) !important;
  box-shadow: 0 14px 26px -14px rgba(17, 84, 73, 0.55);
  padding: 11px 24px;
}
body.ls-page-user-password .ls2-userpw-save:hover {
  filter: brightness(1.06);
}
body.ls-page-user-password .ls2-userpw-cancel {
  background: #f4faf7;
  color: #2c544d;
  border: 1px solid #dfeae7 !important;
  padding: 11px 20px;
}
body.ls-page-user-password .ls2-userpw-cancel:hover {
  background: #e9f5ef;
}
body.ls-page-user-password .ls2-userpw-actions input[disabled] {
  opacity: 0.55;
  cursor: not-allowed;
  filter: grayscale(0.3);
}
@media (max-width: 575px) {
  body.ls-page-user-password .ls2-userpw-form {
    padding: 18px 16px 18px;
  }
  body.ls-page-user-password .ls2-userpw-actions {
    flex-direction: column-reverse;
    align-items: stretch;
  }
  body.ls-page-user-password .ls2-userpw-actions input {
    width: 100%;
  }
}

/* ==================================================================
   USER SECURITY PAGE (body.ls-page-user-security) — index.php?rp=/user/security
   Hero + art, 2FA status card with themed chips and actions, security
   questions form. Hooks kept: .twofa-config-link .disable/.enable +
   w-hidden toggling, .open-modal data-modal-* attrs, form ids/routes.
   ================================================================== */
body.ls-page-user-security #main-body > .container {
  max-width: 1360px;
  padding: 0 28px;
}
body.ls-page-user-security #main-body > .container > .row {
  display: grid !important;
  grid-template-columns: minmax(320px, 27%) minmax(0, 1fr);
  gap: 30px;
  align-items: start;
}
body.ls-page-user-security #main-body > .container > .row > [class*="col"] {
  width: auto !important;
  max-width: none !important;
  flex: none !important;
  float: none !important;
  padding: 0 !important;
}
@media (max-width: 991px) {
  body.ls-page-user-security #main-body > .container > .row {
    grid-template-columns: minmax(0, 1fr);
  }
  body.ls-page-user-security #main-body > .container > .row > .col-lg-4 {
    grid-row: 2;
    margin-top: 20px;
  }
}
/* hero ---------------------------------------------------------- */
body.ls-page-user-security .ls2-sec-hero {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  margin: 6px 0 16px;
  background: linear-gradient(135deg, #f3fbf6 0%, #eaf6f0 60%, #f6fcf9 100%);
  border: 1px solid #dcefe4;
  border-radius: 26px;
  padding: 24px 28px;
  overflow: hidden;
}
body.ls-page-user-security .ls2-sec-kicker {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  background: #fff;
  border: 1px solid #d8ebe2;
  color: #1b6a5a;
  border-radius: 999px;
  padding: 6px 13px;
  font-size: 12px;
  font-weight: 800;
  margin-bottom: 11px;
  box-shadow: 0 6px 14px -10px rgba(20, 97, 87, 0.35);
}
body.ls-page-user-security .ls2-sec-kicker .ls-ico {
  width: 13px;
  height: 13px;
  color: #23957f;
}
body.ls-page-user-security .ls2-sec-hero-title {
  margin: 0 0 10px;
  font-size: 25px;
  font-weight: 900;
  color: #10312c;
  letter-spacing: 0; /* rtl-design: never track Persian script */
}
body.ls-page-user-security .ls2-sec-sub {
  margin: 0;
  color: #3f6059;
  font-size: 13.5px;
  font-weight: 600;
  line-height: 1.9;
}
body.ls-page-user-security .ls2-sec-hero-art {
  flex: none;
  width: 280px;
  max-width: 42%;
}
body.ls-page-user-security .ls2-sec-hero-art svg {
  width: 100% !important;
  height: auto !important;
  max-width: 300px;
}
@media (max-width: 767px) {
  body.ls-page-user-security .ls2-sec-hero {
    flex-direction: column;
    align-items: flex-start;
    padding: 20px;
  }
  body.ls-page-user-security .ls2-sec-hero-art {
    display: none;
  }
  body.ls-page-user-security .ls2-sec-hero-title {
    font-size: 20px;
  }
}
/* cards ---------------------------------------------------------- */
body.ls-page-user-security .ls2-sec-card {
  background: #fff;
  border: 1px solid #e3eef1;
  border-radius: 22px;
  box-shadow: 0 1px 2px rgba(14, 43, 39, 0.03), 0 20px 40px -30px rgba(20, 97, 87, 0.3);
  margin-bottom: 16px;
}
body.ls-page-user-security .ls2-sec-card .card-body {
  padding: 22px 24px;
}
body.ls-page-user-security .ls2-sec-head {
  display: flex;
  align-items: flex-start;
  gap: 14px;
}
body.ls-page-user-security .ls2-sec-chip {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 46px;
  height: 46px;
  flex: 0 0 46px;
  border-radius: 14px;
  background: #e6f2f1;
  color: #19615c;
}
body.ls-page-user-security .ls2-sec-chip .ls-ico {
  width: 20px;
  height: 20px;
}
body.ls-page-user-security .ls2-sec-cardtitle {
  margin: 0 0 4px;
  color: #10312c;
  font-size: 17px;
  font-weight: 800;
}
body.ls-page-user-security .copy .ls2-sec-cardtitle,
body.ls-page-user-security .ls2-sec-head-copy {
  min-width: 0;
}
/* status chip (twofa state paragraphs tweaked by whmcs js) -------- */
body.ls-page-user-security .twofa-config-link {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  margin: 0;
  padding: 5px 12px;
  border-radius: 999px;
  font-size: 12px;
  font-weight: 800;
}
body.ls-page-user-security .twofa-config-link.enable {
  background: #fff6e5;
  color: #8a6a1f;
}
body.ls-page-user-security .twofa-config-link.disable {
  background: #e6f7f0;
  color: #157a5f;
}
body.ls-page-user-security .twofa-config-link strong {
  font-weight: 900;
}
/* warning panel ---------------------------------------------------- */
body.ls-page-user-security .ls2-sec-twofa .alert-warning {
  margin: 16px 0 0;
  background: #fff6e5;
  border: 1px solid #f4dcae;
  border-radius: 14px;
  color: #8a6a1f;
  font-weight: 600;
  font-size: 12.5px;
  text-align: right;
}
/* benefits ---------------------------------------------------------- */
body.ls-page-user-security .ls2-sec-benefits {
  margin: 16px 0 0;
  padding: 14px 16px;
  list-style: none;
  background: #f8fcfb;
  border: 1px dashed #d3e6df;
  border-radius: 14px;
}
body.ls-page-user-security .ls2-sec-benefits li {
  position: relative;
  padding: 0;
  padding-inline-start: 18px;
  color: #2c544d;
  font-size: 12.5px;
  font-weight: 600;
  line-height: 2.1;
}
body.ls-page-user-security .ls2-sec-benefits li::before {
  content: "";
  position: absolute;
  inset-inline-start: 0;
  top: 9px;
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: #23957f;
}
/* action buttons ---------------------------------------------------- */
body.ls-page-user-security .ls2-sec-act {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px;
  margin-top: 18px;
}
body.ls-page-user-security .ls2-sec-act .btn {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  min-height: 46px;
  border-radius: 14px !important;
  font-weight: 800;
  font-size: 13.5px;
  transition: filter 0.15s ease, background 0.15s ease, box-shadow 0.15s ease, transform 0.16s ease;
}
body.ls-page-user-security .ls2-sec-act .btn .ls-ico,
body.ls-page-user-security .ls2-sec-act .btn i {
  width: 15px;
  height: 15px;
  display: inline-flex !important;
  color: currentColor;
}
body.ls-page-user-security .ls2-sec-act .btn:hover {
  transform: translateY(-1.5px);
  text-decoration: none;
}
body.ls-page-user-security .ls2-sec-act .btn.btn-success {
  color: #fff !important;
  background: linear-gradient(135deg, #124b46 0%, #19615c 55%, #23796f 100%) !important;
  border: 0;
  padding: 12px 24px;
  box-shadow: 0 14px 26px -14px rgba(17, 84, 73, 0.55);
}
body.ls-page-user-security .ls2-sec-act .btn.btn-success:hover {
  filter: brightness(1.06);
}
body.ls-page-user-security .ls2-sec-act .btn.btn-danger {
  color: #a8393a;
  background: #fdeeee !important;
  border: 1px solid #f1cccc;
  padding: 12px 20px;
  box-shadow: none !important;
}
body.ls-page-user-security .ls2-sec-act .btn.btn-danger:hover {
  background: #fbdede !important;
}
/* fields (security questions) --------------------------------------- */
body.ls-page-user-security .ls2-sec-field + .ls2-sec-field {
  margin-top: 14px;
}
body.ls-page-user-security .ls2-sec-field {
  margin-top: 14px;
  min-width: 0;
}
body.ls-page-user-security .ls2-sec-label {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  color: #2c544d;
  font-size: 12.5px;
  font-weight: 800;
  margin: 0 0 8px;
}
body.ls-page-user-security .ls2-sec-label .ls-ico {
  width: 15px;
  height: 15px;
  color: #23957f;
}
body.ls-page-user-security .ls2-sec-input {
  width: 100%;
  min-height: 50px;
  border: 1px solid #ddeae6 !important;
  background: #fbfdfc !important;
  border-radius: 14px !important;
  box-shadow: none !important;
  padding: 10px 16px !important;
  color: #123a34;
  font-weight: 700;
  font-size: 14px;
  transition: border-color 0.15s ease, box-shadow 0.15s ease;
}
body.ls-page-user-security .ls2-sec-input:focus {
  outline: none;
  border-color: #19615c !important;
  box-shadow: 0 0 0 3px rgba(25, 97, 92, 0.12) !important;
}
body.ls-page-user-security .ls2-sec-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 0 16px;
}
@media (max-width: 991px) {
  body.ls-page-user-security .ls2-sec-grid {
    grid-template-columns: 1fr;
  }
}
/* actions ------------------------------------------------------------ */
body.ls-page-user-security .ls2-sec-actions {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-top: 20px;
}
body.ls-page-user-security .ls2-sec-actions input {
  min-height: 46px;
  border: 0;
  cursor: pointer;
  font-weight: 800;
  border-radius: 14px;
  font-family: inherit;
  font-size: 13.5px;
  transition: filter 0.15s ease, background 0.15s ease;
}
body.ls-page-user-security .ls2-sec-save {
  color: #fff !important;
  background: linear-gradient(135deg, #124b46 0%, #19615c 55%, #23796f 100%) !important;
  box-shadow: 0 14px 26px -14px rgba(17, 84, 73, 0.55);
  padding: 11px 24px;
}
body.ls-page-user-security .ls2-sec-save:hover {
  filter: brightness(1.06);
}
body.ls-page-user-security .ls2-sec-cancel {
  background: #f4faf7;
  color: #2c544d;
  border: 1px solid #dfeae7 !important;
  padding: 11px 20px;
}
body.ls-page-user-security .ls2-sec-cancel:hover {
  background: #e9f5ef;
}
@media (max-width: 575px) {
  body.ls-page-user-security .ls2-sec-card .card-body {
    padding: 18px 16px;
  }
  body.ls-page-user-security .ls2-sec-actions {
    flex-direction: column-reverse;
    align-items: stretch;
  }
  body.ls-page-user-security .ls2-sec-actions input {
    width: 100%;
  }
  body.ls-page-user-security .ls2-sec-act .btn {
    width: 100%;
    justify-content: center;
  }
}

/* profile / account quick-forms (ls-dash redesign): the action row renders
   flush under the field grid — give it clear breathing room everywhere. */
html body .lsacc-actions {
  margin-top: 18px !important;
}
@media (max-width: 575px) {
  html body .lsacc-actions {
    margin-top: 14px !important;
  }
}

/* ==================================================================
   DOMAIN RENEWALS (body.ls-page-domain-renewals) — index.php?rp=/cart/domain/renew
   The shared LS2 cart rail exists, but something forces .cart-sidebar
   to display:none only on this route — re-assert it explicitly, then
   dress the renewal list, order summary sidebar and actions.
   Hooks: .domain-renewal[data-domain], .select-renewal-pricing,
   .btn-add-renewal-to-cart (.to-add/.added), #producttotal, #btnGoToCart.
   ================================================================== */
body #order-standard_cart .cart-sidebar.ls2-side {
  display: flex !important;
}
body.ls-page-domain-renewals #order-standard_cart > .ls2-row {
  grid-template-columns: 240px minmax(0, 1fr);
  max-width: 1360px;
  margin: 0 auto;
  padding: 0 28px;
}
body.ls-page-domain-renewals #order-standard_cart > .ls2-row > .ls2-main,
body.ls-page-domain-renewals #order-standard_cart > .ls2-row > .ls2-side {
  width: auto !important;
}
/* inner split: form | sticky summary */
body.ls-page-domain-renewals #order-standard_cart .ls2-main > .row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 280px;
  gap: 22px;
  margin: 0;
  align-items: start;
}
body.ls-page-domain-renewals #order-standard_cart .ls2-main > .row > .secondary-cart-body,
body.ls-page-domain-renewals #order-standard_cart .ls2-main > .row > .secondary-cart-sidebar {
  width: auto !important;
  float: none !important;
  padding: 0 !important;
  min-width: 0;
}
body.ls-page-domain-renewals #order-standard_cart .ls2-main > .row > .secondary-cart-sidebar {
  position: sticky;
  top: 96px;
}
@media (max-width: 991px) {
  body.ls-page-domain-renewals #order-standard_cart .ls2-main > .row {
    grid-template-columns: minmax(0, 1fr);
  }
  body.ls-page-domain-renewals #order-standard_cart .ls2-main > .row > .secondary-cart-sidebar {
    order: 2;
    position: static;
  }
}
/* renewal item cards ---------------------------------------------- */
body.ls-page-domain-renewals #order-standard_cart #domainRenewals {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 14px;
  margin: 0;
}
body.ls-page-domain-renewals #order-standard_cart .domain-renewal {
  display: flex;
  flex-direction: column;
  width: auto !important;
  float: none !important;
  margin: 0 !important;
  background: #fff;
  border: 1px solid #e2ebe8;
  border-radius: 20px;
  padding: 18px 20px 16px;
  box-shadow: 0 1px 2px rgba(14, 43, 39, 0.03), 0 16px 34px -22px rgba(20, 97, 87, 0.25);
}
body.ls-page-domain-renewals #order-standard_cart .domain-renewal .pull-right,
body.ls-page-domain-renewals #order-standard_cart .domain-renewal .float-right {
  float: none !important;
  align-self: flex-start;
  margin: 0 0 10px;
}
body.ls-page-domain-renewals #order-standard_cart .domain-renewal h3 {
  margin: 0 0 6px;
  color: #10312c;
  font-size: 18px;
  font-weight: 800;
  word-break: break-word;
}
body.ls-page-domain-renewals #order-standard_cart .domain-renewal > p {
  margin: 0 0 10px;
  color: #4b6a63;
  font-size: 12.5px;
  font-weight: 600;
}
body.ls-page-domain-renewals #order-standard_cart .domain-renewal .domain-renewal-desc {
  color: #74c2ad;
}
/* status chips ------------------------------------------------------ */
body.ls-page-domain-renewals #order-standard_cart .domain-renewal .label {
  display: inline-flex;
  align-items: center;
  font-family: inherit;
  font-size: 11px !important;
  font-weight: 800;
  padding: 4px 11px !important;
  border-radius: 999px !important;
}
body.ls-page-domain-renewals #order-standard_cart .domain-renewal .label-success {
  background: #e6f7f0 !important;
  color: #157a5f !important;
}
body.ls-page-domain-renewals #order-standard_cart .domain-renewal .label-warning {
  background: #fdf3df !important;
  color: #8a6a1f !important;
}
body.ls-page-domain-renewals #order-standard_cart .domain-renewal .label-danger {
  background: #fdecec !important;
  color: #a8393a !important;
}
body.ls-page-domain-renewals #order-standard_cart .domain-renewal .label-info,
body.ls-page-domain-renewals #order-standard_cart .domain-renewal .label-grey {
  background: #eef7f4 !important;
  color: #2c544d !important;
}
/* period picker ------------------------------------------------------ */
body.ls-page-domain-renewals #order-standard_cart .domain-renewal .form-horizontal .form-group.row {
  display: flex;
  flex-direction: column;
  gap: 8px;
  margin: 4px 0 0;
}
body.ls-page-domain-renewals #order-standard_cart .domain-renewal .form-horizontal .control-label,
body.ls-page-domain-renewals #order-standard_cart .domain-renewal .form-horizontal .col-sm-6,
body.ls-page-domain-renewals #order-standard_cart .domain-renewal .form-horizontal .col-md-5 {
  flex: 0 0 100% !important;
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0;
  padding: 0 !important;
  text-align: right;
  color: #2c544d;
  font-size: 12px;
  font-weight: 800;
  margin: 0 !important;
}
body.ls-page-domain-renewals #order-standard_cart .domain-renewal .select-renewal-pricing {
  width: 100% !important;
  min-height: 46px;
  border: 1px solid #dfe9e7 !important;
  background: #f8fcfb !important;
  border-radius: 12px;
  color: #0e2b27;
  font-weight: 700;
  font-size: 13px;
  box-shadow: none !important;
  padding: 8px 12px !important;
}
/* add-to-cart -------------------------------------------------------- */
body.ls-page-domain-renewals #order-standard_cart .domain-renewal .text-right {
  text-align: right;
  margin-top: auto;
  padding-top: 12px;
}
body.ls-page-domain-renewals #order-standard_cart .btn-add-renewal-to-cart {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-height: 42px;
  color: #fff !important;
  background: linear-gradient(135deg, #124b46 0%, #19615c 55%, #23796f 100%) !important;
  border: 0 !important;
  border-radius: 12px !important;
  font-weight: 800;
  font-size: 13px;
  box-shadow: 0 12px 22px -14px rgba(17, 84, 73, 0.55) !important;
  transition: filter 0.15s ease;
}
body.ls-page-domain-renewals #order-standard_cart .btn-add-renewal-to-cart:hover {
  filter: brightness(1.06);
}
body.ls-page-domain-renewals #order-standard_cart .btn-add-renewal-to-cart.added {
  background: #e6f7f0 !important;
  color: #157a5f !important;
  box-shadow: none !important;
}
/* icons restored for this page (spinner, cart, times all verified) ----- */
html body.ls-page-domain-renewals .fas,
html body.ls-page-domain-renewals .far {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
}
/* summary sidebar ------------------------------------------------------ */
body.ls-page-domain-renewals #order-standard_cart .order-summary {
  background: #fff;
  border: 1px solid #e2ebe8;
  border-radius: 20px;
  padding: 20px 20px 16px;
  box-shadow: 0 1px 2px rgba(14, 43, 39, 0.03), 0 16px 34px -22px rgba(20, 97, 87, 0.25);
}
body.ls-page-domain-renewals #order-standard_cart .order-summary .loader {
  display: none;
}
#order-standard_cart.loading .order-summary .loader {
  display: flex;
}
body.ls-page-domain-renewals #order-standard_cart #producttotal .summary-totals .clearfix,
body.ls-page-domain-renewals #order-standard_cart #producttotal .clearfix {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 7px 0;
  color: #4b6a63;
  font-size: 12.5px;
  font-weight: 600;
}
body.ls-page-domain-renewals #order-standard_cart #producttotal .total-due-today {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-top: 8px;
  padding: 12px 0 2px;
  border-top: 1px solid #e6efec;
  color: #10312c;
  font-weight: 900;
}
body.ls-page-domain-renewals #order-standard_cart #producttotal .total-due-today .amt {
  color: #157a5f;
  font-size: 16px;
}
body.ls-page-domain-renewals #order-standard_cart #orderSummary .text-center {
  margin-top: 14px;
}
body.ls-page-domain-renewals #order-standard_cart #btnGoToCart {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  width: 100%;
  min-height: 46px;
  color: #fff !important;
  background: linear-gradient(135deg, #124b46 0%, #19615c 55%, #23796f 100%) !important;
  border: 0 !important;
  border-radius: 12px !important;
  font-weight: 800;
  box-shadow: 0 12px 22px -14px rgba(17, 84, 73, 0.55) !important;
  text-decoration: none;
}
body.ls-page-domain-renewals #order-standard_cart #btnGoToCart:hover {
  filter: brightness(1.06);
}
/* grace-period footnote ------------------------------------------------ */
body.ls-page-domain-renewals #order-standard_cart .secondary-cart-body > .text-center small {
  display: block;
  padding: 10px 0 0;
  color: #647c78;
  font-size: 11.5px;
  font-weight: 600;
}
/* no-domains empty state ------------------------------------------------ */
body.ls-page-domain-renewals #order-standard_cart #no-domains {
  background: #fdf3df !important;
  border: 1px solid #f4dcae !important;
  border-radius: 16px !important;
  color: #8a6a1f !important;
  font-weight: 700;
  padding: 22px 18px !important;
}
body.ls-page-domain-renewals #order-standard_cart #no-domains + .text-center .btn-default {
  margin-top: 14px;
  border-radius: 12px;
  padding: 10px 18px;
  background: #fff;
  border: 1px solid #dfe9e7;
  color: #19615c;
  font-weight: 700;
}
/* remove-item modal polish --------------------------------------------- */
body.ls-page-domain-renewals .modal-remove-item .modal-content {
  overflow: hidden;
  border: 0;
  border-radius: 18px;
}
body.ls-page-domain-renewals .modal-remove-item .modal-header {
  border: 0;
  background: #fff;
}
body.ls-page-domain-renewals .modal-remove-item .modal-header .fas {
  color: #e05a5b;
}
body.ls-page-domain-renewals .modal-remove-item .btn {
  border-radius: 12px;
  min-height: 42px;
  font-weight: 800;
}

/* ======================== RTL + a11y pass (rtl-design / frontend-design) */
/* Persian headings must never get letter-spacing — it tears the joined
   script and breaks text extraction. rtl-design rule 10. */
body.ls-page-clientareadomains .ls2-dom-title,
body.ls-page-user-password .ls2-userpw-title,
body.ls-page-user-security .ls2-sec-hero-title {
  letter-spacing: 0;
}
/* WCAG AA contrast for helper copy (was #74c2ad / #647c78 on white) */
body.ls-page-domain-renewals #order-standard_cart .domain-renewal .domain-renewal-desc {
  color: #3f8577;
}
body.ls-page-domain-renewals #order-standard_cart .secondary-cart-body > .text-center small {
  color: #4b6a63;
}
/* visible keyboard focus for the new controls (frontend-design a11y) */
.btn-add-renewal-to-cart:focus-visible,
#btnGoToCart:focus-visible,
.ls-page-domain-renewals .select-renewal-pricing:focus,
.ls2-userpw-gen:focus-visible,
.ls2-userpw-input:focus,
.ls2-userpw-actions input:focus-visible,
.ls2-sec-input:focus,
.ls2-sec-actions input:focus-visible,
.ls2-sec-act .btn:focus-visible,
.ls2-dom-tool:focus-visible,
.ls2-dom-cta:focus-visible {
  outline: 2px solid #19615c !important;
  outline-offset: 2px !important;
}

/* dashboard info panels (invoices / expiring domains / affiliate): the
   server ships a one-line notice as the whole body, which reads as an
   empty card. Dress it exactly like the tickets empty-state: soft-glyph
   block + compact centered copy. */
body.ls-dash-page .lsdash .panel-card[data-panel="Overdue Invoices"] .panel-body > p:only-child,
body.ls-dash-page .lsdash .panel-card[data-panel="Domains Expiring Soon"] .panel-body > p:only-child,
body.ls-dash-page .lsdash .panel-card[data-panel="Affiliate Program"] .panel-body > p:only-child {
  padding: 20px 10px 22px;
  text-align: center;
  max-width: none;
  font-size: 12.5px;
  line-height: 1.85;
}
body.ls-dash-page .lsdash .panel-card[data-panel="Overdue Invoices"] .panel-body > p:only-child::before,
body.ls-dash-page .lsdash .panel-card[data-panel="Domains Expiring Soon"] .panel-body > p:only-child::before,
body.ls-dash-page .lsdash .panel-card[data-panel="Affiliate Program"] .panel-body > p:only-child::before {
  content: '';
  display: block;
  width: 56px;
  height: 56px;
  margin: 0 auto 12px;
  border-radius: 50%;
  background-color: #e8f3f0;
  background-position: center;
  background-size: 26px;
  background-repeat: no-repeat;
}
body.ls-dash-page .lsdash .panel-card[data-panel="Overdue Invoices"] .panel-body > p:only-child::before {
  background-color: #e8f3f0;
  background-image: url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%239ec9bd' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='5' y='3' width='14' height='18' rx='2'/%3E%3Cpath d='M9 7h6'/%3E%3Ccircle cx='9.2' cy='11.4' r='.95' fill='%239ec9bd' stroke='none'/%3E%3Ccircle cx='12' cy='11.4' r='.95' fill='%239ec9bd' stroke='none'/%3E%3Ccircle cx='14.8' cy='11.4' r='.95' fill='%239ec9bd' stroke='none'/%3E%3Ccircle cx='9.2' cy='14.6' r='.95' fill='%239ec9bd' stroke='none'/%3E%3Ccircle cx='12' cy='14.6' r='.95' fill='%239ec9bd' stroke='none'/%3E%3Ccircle cx='14.8' cy='14.6' r='.95' fill='%239ec9bd' stroke='none'/%3E%3C/svg%3E");
}
body.ls-dash-page .lsdash .panel-card[data-panel="Domains Expiring Soon"] .panel-body > p:only-child::before {
  background-color: #e8f3f0;
  background-image: url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%239ec9bd' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='9.2'/%3E%3Cpath d='M2.8 12h18.4'/%3E%3Cpath d='M12 2.8a14.6 14.6 0 0 1 3.8 9.2 14.6 14.6 0 0 1-3.8 9.2 14.6 14.6 0 0 1-3.8-9.2A14.6 14.6 0 0 1 12 2.8z'/%3E%3C/svg%3E");
}
body.ls-dash-page .lsdash .panel-card[data-panel="Affiliate Program"] .panel-body > p:only-child::before {
  background-color: #e8f3f0;
  background-image: url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%239ec9bd' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='8.6' cy='8.4' r='3.4'/%3E%3Cpath d='M3 19.8c.9-3.2 3-4.9 5.6-4.9s4.7 1.7 5.6 4.9'/%3E%3Ccircle cx='16.8' cy='9.4' r='2.5'/%3E%3Cpath d='M15.8 14.8c1.9.3 3.5 1.6 4.2 3.9'/%3E%3C/svg%3E");
}