/* ==========================================================================
   ElypseCloud - Order Form (Standard Cart)
   Same design tokens as the client area theme. This file only restyles
   colors/typography/spacing on top of WHMCS's own structural CSS
   (css/style.css) - no layout logic is touched, so the checkout flow's
   markup and JS keep working exactly as shipped by WHMCS.
   ========================================================================== */

@font-face{
  font-family:"Inter";
  font-weight:100 900;
  font-style:normal;
  font-display:swap;
  src:url(../fonts/inter-variable.woff2) format("woff2");
}
@font-face{
  font-family:"Manrope";
  font-weight:100 900;
  font-style:normal;
  font-display:swap;
  src:url(../fonts/manrope-variable.woff2) format("woff2");
}

:root{
  --ec-bg:#f5f7fa;
  --ec-card:#ffffff;
  --ec-border:rgba(15,23,42,.09);
  --ec-border-strong:rgba(15,23,42,.16);
  --ec-blue:#2e5f9e;
  --ec-blue-dark:#1c3c63;
  --ec-blue-light:#3b6fb0;
  --ec-blue-tint:rgba(46,95,158,.09);
  --ec-text:#182230;
  --ec-text-muted:#5b6b80;
  --ec-text-faint:#8695a8;
  --ec-green:#1a8a54;
  --ec-orange:#b35900;
  --ec-red:#c4342a;
  --ec-radius-lg:16px;
  --ec-radius-md:10px;
  --ec-radius-sm:7px;
  --ec-font-display:"Manrope",sans-serif;
  --ec-font-body:"Inter",-apple-system,BlinkMacSystemFont,sans-serif;
}

/* ==========================================================================
   Dark theme - same values as the client area's tokens (css/custom.css), so
   both themes share one palette. The client area's own dark block also
   reaches order-form pages (identical --ec-* names, higher specificity than
   this file's plain :root), but it's mirrored here explicitly so this file
   stays self-contained instead of quietly depending on another stylesheet's
   cascade order.
   Most component rules above already read var(--ec-*) and adapt on their
   own - this only needs the handful of selectors that used a hardcoded
   rgba(15,23,42,X) wash (a dark tint meant for a light card) instead of a
   token; those go nearly invisible on a dark card, so they're inverted to a
   white-based tint at roughly the same visual weight. */
:root[data-theme="dark"]{
  color-scheme:dark;
  --ec-bg:#0f1720;
  --ec-card:#151f2b;
  --ec-border:rgba(255,255,255,.10);
  --ec-border-strong:rgba(255,255,255,.18);
  --ec-blue:#4d8bd8;
  --ec-blue-dark:#3b6fb0;
  --ec-blue-light:#7ab0ea;
  --ec-blue-tint:rgba(77,139,216,.16);
  --ec-text:#e8eef6;
  --ec-text-muted:#a3b2c4;
  --ec-text-faint:#7a8ba0;
  --ec-green:#3fbe83;
  --ec-orange:#e0913c;
  --ec-red:#f0736a;
}
:root[data-theme="dark"] #order-standard_cart .products .product header,
:root[data-theme="dark"] #order-standard_cart .well,
:root[data-theme="dark"] #order-standard_cart .domain-bulk-domain-well,
:root[data-theme="dark"] #order-standard_cart .domain-bulk-options-box,
:root[data-theme="dark"] #order-standard_cart table th{background-color:rgba(255,255,255,.04);}
:root[data-theme="dark"] #order-standard_cart .btn-default:hover,
:root[data-theme="dark"] #order-standard_cart .btn-default:focus,
:root[data-theme="dark"] #order-standard_cart .form-control[readonly],
:root[data-theme="dark"] #order-standard_cart .form-control[disabled],
:root[data-theme="dark"] #order-standard_cart .field[readonly],
:root[data-theme="dark"] #order-standard_cart .field[disabled]{background-color:rgba(255,255,255,.06);}
:root[data-theme="dark"] #order-standard_cart .ec-step-dot{background-color:rgba(255,255,255,.08);}

#order-standard_cart{
  font-family:var(--ec-font-body);
  color:var(--ec-text);
  font-size:14px;
}
#order-standard_cart h1,#order-standard_cart h2,#order-standard_cart h3,#order-standard_cart h4{
  font-family:var(--ec-font-display);color:var(--ec-text);font-weight:800;
}
#order-standard_cart a{color:var(--ec-blue-light);}
#order-standard_cart a:hover{color:var(--ec-blue-dark);}
#order-standard_cart label,
#order-standard_cart p.domain-renewal-desc{color:var(--ec-text-muted);font-weight:500;}

/* section titles ("header-lined" underlines a page/section heading) */
#order-standard_cart .header-lined{border-bottom:1px solid var(--ec-border);padding-bottom:14px;margin-bottom:22px;}
#order-standard_cart .header-lined h1{font-size:1.5em;margin:0;}
#order-standard_cart .sub-heading,
#order-standard_cart .sub-heading-borderless{color:var(--ec-text-muted);}
#order-standard_cart .sub-heading span,
#order-standard_cart .sub-heading-borderless span{background:var(--ec-bg);color:var(--ec-text-muted);}
#order-standard_cart .sub-heading-borderless{border-top-color:var(--ec-border);}

/* category sidebar */
#order-standard_cart .cart-sidebar h3,
#order-standard_cart .sidebar-collapsed h3{color:var(--ec-text);font-family:var(--ec-font-display);}
#order-standard_cart .cart-sidebar .list-group-item{
  border-color:var(--ec-border);color:var(--ec-text-muted);font-weight:500;
}
#order-standard_cart .cart-sidebar .list-group-item.active,
#order-standard_cart .cart-sidebar .list-group-item:hover{
  background:var(--ec-blue-tint);color:var(--ec-blue-dark);
}
#order-standard_cart .cart-sidebar .card,
#order-standard_cart .sidebar-collapsed .card{border-radius:var(--ec-radius-lg);}

/* product boxes */
#order-standard_cart .products .product{
  background:var(--ec-card);border:1px solid var(--ec-border);
  border-radius:var(--ec-radius-lg);box-shadow:0 1px 2px rgba(15,23,42,.04);
  transition:.15s;overflow:hidden;
}
#order-standard_cart .products .product:hover{border-color:var(--ec-border-strong);box-shadow:0 8px 20px rgba(15,23,42,.08);}
#order-standard_cart .products .product header{background:rgba(15,23,42,.02);border-bottom:1px solid var(--ec-border);}
#order-standard_cart .products .product header span{color:var(--ec-text);font-family:var(--ec-font-display);font-weight:700;}
#order-standard_cart .products .product header .qty{color:var(--ec-text-faint);}
#order-standard_cart .products .product div.product-desc{color:var(--ec-text-muted);}
#order-standard_cart .products .product span.feature-value{color:var(--ec-blue-dark);}
#order-standard_cart .products .product div.product-pricing span.price{
  font-family:var(--ec-font-display);color:var(--ec-text);font-weight:800;
}
#order-standard_cart .products .product .btn-order-now{
  background:var(--ec-blue);border-color:var(--ec-blue);border-radius:var(--ec-radius-sm);font-weight:600;
}
#order-standard_cart .products .product .btn-order-now:hover{background:var(--ec-blue-dark);border-color:var(--ec-blue-dark);}

/* ---------- base button system ----------
   WHMCS's stock cart markup uses plain .btn/.btn-default/.btn-primary/.btn-link
   all over (edit, remove, update qty, apply promo, continue shopping, modal
   confirm/cancel...) but only a handful of bespoke buttons (checkout, order-
   now) were ever restyled - everything else fell back to WHMCS's unstyled
   defaults, which is what reads as low-contrast next to the rest of the page. */
#order-standard_cart .btn{border-radius:var(--ec-radius-sm);font-weight:600;}
#order-standard_cart .btn-primary{background-color:var(--ec-blue);border-color:var(--ec-blue);color:#fff;}
#order-standard_cart .btn-primary:hover,
#order-standard_cart .btn-primary:focus{background-color:var(--ec-blue-dark);border-color:var(--ec-blue-dark);color:#fff;}
#order-standard_cart .btn-default{background-color:var(--ec-card);border-color:var(--ec-border-strong);color:var(--ec-text);}
#order-standard_cart .btn-default:hover,
#order-standard_cart .btn-default:focus{background-color:rgba(15,23,42,.03);border-color:var(--ec-border-strong);color:var(--ec-text);}
#order-standard_cart .btn-link{color:var(--ec-blue-light);font-weight:600;}
#order-standard_cart .btn-link:hover,
#order-standard_cart .btn-link:focus{color:var(--ec-blue-dark);text-decoration:none;}
#order-standard_cart .btn:focus,
#order-standard_cart .btn.focus{outline:none;box-shadow:0 0 0 3px rgba(46,95,158,.15);}
#order-standard_cart .btn.disabled,
#order-standard_cart .btn[disabled]{opacity:.5;cursor:not-allowed;box-shadow:none;}

/* "remove from cart" buttons: icon-only, discreet by default, red on hover.
   Not scoped to one section - this same class is reused for every product/
   addon/domain/renewal/upgrade row in the cart. */
#order-standard_cart .btn-remove-from-cart{
  padding:6px 8px;border-radius:999px;display:inline-flex;align-items:center;gap:6px;
  color:var(--ec-text-faint);background:transparent;border:none;
}
#order-standard_cart .btn-remove-from-cart:hover,
#order-standard_cart .btn-remove-from-cart:focus{background:rgba(196,52,42,.08);color:var(--ec-red);}

/* form fields (.field / .prepend-icon is WHMCS's own icon-prefixed input pattern) */
#order-standard_cart .field,
#order-standard_cart .form-control{
  background-color:var(--ec-card);border:1px solid var(--ec-border-strong);
  color:var(--ec-text);border-radius:var(--ec-radius-sm);
}
#order-standard_cart .field:focus,
#order-standard_cart .form-control:focus{
  border-color:var(--ec-blue-light);box-shadow:0 0 0 3px rgba(46,95,158,.15);
}
#order-standard_cart .field-icon i{color:var(--ec-text-faint);}
#order-standard_cart .field-help-text{color:var(--ec-text-faint);}
#order-standard_cart .field-error-msg{color:var(--ec-red);}
#order-standard_cart .field[disabled],
#order-standard_cart .field[readonly],
#order-standard_cart .form-control[disabled],
#order-standard_cart .form-control[readonly]{background-color:rgba(15,23,42,.03);}

/* cart / checkout totals + line items */
#order-standard_cart .cart-body .card,
#order-standard_cart .cart-body .panel{
  border-radius:var(--ec-radius-lg);border-color:var(--ec-border);box-shadow:0 1px 2px rgba(15,23,42,.04);
}
#order-standard_cart .bordered-totals,
#order-standard_cart .order-summary{border-color:var(--ec-border);}
#order-standard_cart .item{border-bottom:1px solid var(--ec-border);}
#order-standard_cart .item-domain,#order-standard_cart .item-group{color:var(--ec-text-faint);}
#order-standard_cart .item-price,#order-standard_cart .cost,#order-standard_cart .amt{
  font-family:var(--ec-font-display);font-weight:700;color:var(--ec-text);
}
#order-standard_cart .empty-cart{color:var(--ec-text-muted);}
#order-standard_cart .empty-cart .fa-3x{color:var(--ec-border-strong);}

/* express checkout / payment methods */
#order-standard_cart .express-checkout-buttons .separator{color:var(--ec-text-faint);}
#order-standard_cart .express-checkout-buttons .separator::before,
#order-standard_cart .express-checkout-buttons .separator::after{background:var(--ec-border);}
#order-standard_cart .account-select-container div.account{
  border-color:var(--ec-border);border-radius:var(--ec-radius-md);
}
#order-standard_cart .account-select-container div.account.active{
  border-color:var(--ec-blue);background:var(--ec-blue-tint);
}
#order-standard_cart .existing-cc-grid .card{border-radius:var(--ec-radius-md);border-color:var(--ec-border);}
#order-standard_cart .checkout-security-msg{color:var(--ec-text-faint);}

/* domain checker */
#order-standard_cart .domain-checker-bg{background:var(--ec-blue-dark);}
#order-standard_cart .domain-checker-container .field,
#order-standard_cart .domain-checker-container .form-control{border-radius:var(--ec-radius-sm) 0 0 var(--ec-radius-sm);}
#order-standard_cart .domain-checker-result-headline{color:var(--ec-text);}
#order-standard_cart .domain-checker-available{color:var(--ec-green);}
#order-standard_cart .domain-checker-unavailable,
#order-standard_cart .domain-checker-invalid{color:var(--ec-red);}

/* TLD spotlight tiles */
#order-standard_cart .spotlight-tld{
  border:1px solid var(--ec-border);border-radius:var(--ec-radius-md);background:var(--ec-card);
}
#order-standard_cart .spotlight-tld-hot,
#order-standard_cart .spotlight-tld-sale{color:var(--ec-orange);}
#order-standard_cart .spotlight-tld-new{color:var(--ec-green);}

/* misc */
#order-standard_cart .well,
#order-standard_cart .domain-bulk-domain-well,
#order-standard_cart .domain-bulk-options-box{
  background:rgba(15,23,42,.02);border:1px solid var(--ec-border);border-radius:var(--ec-radius-md);
}
#order-standard_cart .mc-promo{border-radius:var(--ec-radius-lg);border-color:var(--ec-border);}

/* categories sidebar removed - content takes the full width */
#order-standard_cart .ec-cart-body-full{width:100% !important;float:none !important;}

/* ---------- progress steps ---------- */
#order-standard_cart .ec-steps{
  display:flex;align-items:center;justify-content:center;flex-wrap:wrap;
  gap:0;margin:0 0 26px;padding:16px;background:var(--ec-card);border:1px solid var(--ec-border);
  border-radius:var(--ec-radius-lg);box-shadow:0 1px 2px rgba(15,23,42,.04);
}
#order-standard_cart .ec-step{
  display:flex;align-items:center;gap:9px;font-size:.85em;font-weight:600;color:var(--ec-text-faint);
}
#order-standard_cart .ec-step-dot{
  width:26px;height:26px;border-radius:50%;display:flex;align-items:center;justify-content:center;
  font-size:.8em;font-weight:700;background:rgba(15,23,42,.05);color:var(--ec-text-faint);flex-shrink:0;
}
#order-standard_cart .ec-step.done{color:var(--ec-text-muted);}
#order-standard_cart .ec-step.done .ec-step-dot{background:var(--ec-green);color:#fff;}
#order-standard_cart .ec-step.done .ec-step-dot .icon{width:12px;height:12px;}
#order-standard_cart .ec-step.active{color:var(--ec-text);}
#order-standard_cart .ec-step.active .ec-step-dot{background:var(--ec-blue);color:#fff;}
#order-standard_cart .ec-step-line{width:44px;height:1.5px;background:var(--ec-border-strong);margin:0 14px;}

/* ---------- configure product ---------- */
#order-standard_cart .ec-config-header{
  background:var(--ec-card);border:1px solid var(--ec-border);border-radius:var(--ec-radius-lg);
  padding:22px 24px;margin-bottom:20px;box-shadow:0 1px 2px rgba(15,23,42,.04);
}
#order-standard_cart .ec-config-header h1{font-size:1.3em;margin:0 0 4px;}
#order-standard_cart .ec-config-header p{color:var(--ec-text-muted);margin:0;}

/* Product description spec list - admin-authored HTML (<ul class="list-unstyled"><li
   class="d-flex justify-content-between">). This targets the classes it always uses,
   so it works for every product/offer that follows the same pattern, with no per-
   product code. */
#order-standard_cart .ec-config-desc{margin-top:16px;contain:layout paint;color:var(--ec-text-muted);line-height:1.65;font-size:.92em;}

/* Generic typography for whatever an admin actually typed into the
   description field - a plain paragraph, a basic bullet/numbered list, bold
   text, links - so descriptions look polished even when they don't follow
   the specific spec-list markup pattern targeted below. */
#order-standard_cart .ec-config-desc p{margin:0 0 12px;}
#order-standard_cart .ec-config-desc p:last-child{margin-bottom:0;}
#order-standard_cart .ec-config-desc strong,
#order-standard_cart .ec-config-desc b{color:var(--ec-text);font-weight:700;}
#order-standard_cart .ec-config-desc a{color:var(--ec-blue-light);font-weight:600;}
#order-standard_cart .ec-config-desc a:hover{color:var(--ec-blue-dark);}
#order-standard_cart .ec-config-desc ul:not(.list-unstyled){margin:0 0 12px;padding-left:0;list-style:none;}
#order-standard_cart .ec-config-desc ul:not(.list-unstyled) li{position:relative;padding-left:20px;margin-bottom:7px;}
#order-standard_cart .ec-config-desc ul:not(.list-unstyled) li::before{
  content:"";position:absolute;left:2px;top:.65em;width:6px;height:6px;border-radius:50%;background:var(--ec-blue);
}
#order-standard_cart .ec-config-desc ol:not(.list-unstyled){margin:0 0 12px;padding-left:0;list-style:none;counter-reset:ecdesc;}
#order-standard_cart .ec-config-desc ol:not(.list-unstyled) li{position:relative;padding-left:24px;margin-bottom:7px;}
#order-standard_cart .ec-config-desc ol:not(.list-unstyled) li::before{
  content:counter(ecdesc) ".";counter-increment:ecdesc;
  position:absolute;left:0;top:0;font-weight:700;color:var(--ec-blue);font-size:.95em;
}
#order-standard_cart .ec-config-desc .list-unstyled{
  display:grid !important;
  grid-template-columns:repeat(3,minmax(0,1fr)) !important;
  align-items:stretch !important;
  gap:10px 16px !important;
  list-style:none !important;margin:0 !important;padding:0 !important;
}
@media (max-width:1000px){#order-standard_cart .ec-config-desc .list-unstyled{grid-template-columns:repeat(2,minmax(0,1fr)) !important;}}
@media (max-width:600px){#order-standard_cart .ec-config-desc .list-unstyled{grid-template-columns:minmax(0,1fr) !important;}}
/* Admins paste multi-line HTML into the description field, and WHMCS's editor
   turns the blank lines between each <li> into stray <br>/text nodes that land
   as direct children of the <ul>. On a grid those become invisible extra cells
   that shove every real item sideways (the checkerboard bug) - so anything
   that isn't an <li> is dropped from layout entirely. */
#order-standard_cart .ec-config-desc .list-unstyled > *:not(li){display:none !important;}
#order-standard_cart .ec-config-desc .list-unstyled > li br{display:none !important;}
#order-standard_cart .ec-config-desc .list-unstyled > li{
  display:flex !important;align-items:center;justify-content:space-between !important;
  min-width:0 !important;
  gap:10px;background:var(--ec-card) !important;border:1px solid var(--ec-border) !important;
  box-shadow:0 1px 2px rgba(15,23,42,.04);
  border-radius:var(--ec-radius-md) !important;padding:11px 14px !important;margin:0 !important;
}
#order-standard_cart .ec-config-desc .list-unstyled > li .text-primary,
#order-standard_cart .ec-config-desc .list-unstyled > li .text-success,
#order-standard_cart .ec-config-desc .list-unstyled > li [class*="text-"]{
  display:flex !important;align-items:center;gap:9px;flex-shrink:0;
  color:var(--ec-text) !important;font-size:.85em;font-weight:600 !important;
  white-space:nowrap;
}
/* Font Awesome glyphs don't render in the order-form context (no icon font
   loaded here) - swap each known spec icon for a real SVG (the exact same
   shapes as the site's icon sprite, baked in as data-URIs since a CSS
   background-image can't reference a <symbol> by id) via background-image,
   keyed off the specific fa-* class the admin's description HTML uses. This
   is generic across every product: any li following the pattern gets an
   icon chip automatically, defaulting to a neutral dot for unmapped classes.
   Colors are hardcoded to match --ec-blue/--ec-green - custom properties
   aren't readable from inside a data-URI's own SVG markup. */
#order-standard_cart .ec-config-desc .list-unstyled > li i.fas,
#order-standard_cart .ec-config-desc .list-unstyled > li i.far{
  display:inline-flex !important;align-items:center;justify-content:center;
  width:28px;height:28px;flex-shrink:0;border-radius:8px;
  background-color:var(--ec-blue-tint);
  background-repeat:no-repeat !important;background-position:center !important;background-size:16px !important;
  font-size:0;line-height:1;margin:0 !important;color:transparent;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Ccircle cx='10' cy='10' r='2.5' fill='%232e5f9e'/%3E%3C/svg%3E") !important;
}
#order-standard_cart .ec-config-desc .list-unstyled > li i.fa-microchip{
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20' fill='none' stroke='%232e5f9e' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 10.5h3l2-5 4 9 2-6h3'/%3E%3C/svg%3E") !important;
}
#order-standard_cart .ec-config-desc .list-unstyled > li i.fa-memory,
#order-standard_cart .ec-config-desc .list-unstyled > li i.fa-server{
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Crect x='3' y='3' width='14' height='6' rx='1.4' fill='none' stroke='%232e5f9e' stroke-width='1.6'/%3E%3Crect x='3' y='11' width='14' height='6' rx='1.4' fill='none' stroke='%232e5f9e' stroke-width='1.6'/%3E%3Ccircle cx='6.2' cy='6' r='.9' fill='%232e5f9e'/%3E%3Ccircle cx='6.2' cy='14' r='.9' fill='%232e5f9e'/%3E%3C/svg%3E") !important;
}
#order-standard_cart .ec-config-desc .list-unstyled > li i.fa-hdd,
#order-standard_cart .ec-config-desc .list-unstyled > li i.fa-database{
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20' fill='none' stroke='%232e5f9e' stroke-width='1.6' stroke-linejoin='round'%3E%3Cpath d='M10 2.8 17 6.5v7L10 17.2 3 13.5v-7Z'/%3E%3Cpath d='M3 6.5 10 10l7-3.5M10 10v7.2'/%3E%3C/svg%3E") !important;
}
#order-standard_cart .ec-config-desc .list-unstyled > li i.fa-network-wired,
#order-standard_cart .ec-config-desc .list-unstyled > li i.fa-wifi,
#order-standard_cart .ec-config-desc .list-unstyled > li i.fa-globe,
#order-standard_cart .ec-config-desc .list-unstyled > li i.fa-globe-americas{
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20' fill='none' stroke='%232e5f9e' stroke-width='1.6'%3E%3Ccircle cx='10' cy='10' r='7'/%3E%3Cpath d='M3 10h14M10 3c2.2 2 2.2 12 0 14M10 3c-2.2 2-2.2 12 0 14'/%3E%3C/svg%3E") !important;
}
#order-standard_cart .ec-config-desc .list-unstyled > li i.fa-map-marker-alt{
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20' fill='none' stroke='%232e5f9e' stroke-width='1.6' stroke-linejoin='round'%3E%3Cpath d='M10 17.5S15.5 12.4 15.5 8a5.5 5.5 0 0 0-11 0c0 4.4 5.5 9.5 5.5 9.5Z'/%3E%3Ccircle cx='10' cy='8' r='2'/%3E%3C/svg%3E") !important;
}
#order-standard_cart .ec-config-desc .list-unstyled > li i.fa-shield-alt{
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20' fill='none' stroke='%232e5f9e' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M10 2.5 16 5v5c0 4.2-2.7 6.6-6 8-3.3-1.4-6-3.8-6-8V5Z'/%3E%3Cpath d='m7.3 10 1.9 1.9L13 8'/%3E%3C/svg%3E") !important;
}
#order-standard_cart .ec-config-desc .list-unstyled > li i.fa-lock{
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20' fill='none' stroke='%232e5f9e' stroke-width='1.6'%3E%3Crect x='4.5' y='9' width='11' height='7.5' rx='1.6'/%3E%3Cpath d='M6.5 9V6.5a3.5 3.5 0 0 1 7 0V9'/%3E%3C/svg%3E") !important;
}
#order-standard_cart .ec-config-desc .list-unstyled > li i.fa-check,
#order-standard_cart .ec-config-desc .list-unstyled > li i.fa-check-circle{
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20' fill='none' stroke='%232e5f9e' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m4.5 10.5 3.5 3.5 7.5-8'/%3E%3C/svg%3E") !important;
}
#order-standard_cart .ec-config-desc .list-unstyled > li i.fa-bolt{
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cpath d='M11 2.5 4.5 11h4.2L8 17.5 15.5 9h-4.2L11 2.5Z' fill='%232e5f9e'/%3E%3C/svg%3E") !important;
}
#order-standard_cart .ec-config-desc .list-unstyled > li i.fa-cloud{
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20' fill='none' stroke='%232e5f9e' stroke-width='1.6' stroke-linejoin='round'%3E%3Cpath d='M6.5 14.5a3.3 3.3 0 0 1-.5-6.56 4 4 0 0 1 7.74-1.2A3.3 3.3 0 0 1 13.5 14.5Z'/%3E%3C/svg%3E") !important;
}
#order-standard_cart .ec-config-desc .list-unstyled > li .text-success i{
  background-color:rgba(26,138,84,.12);
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20' fill='none' stroke='%231a8a54' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m4.5 10.5 3.5 3.5 7.5-8'/%3E%3C/svg%3E") !important;
}
#order-standard_cart .ec-config-desc .list-unstyled > li .badge{
  background:transparent !important;border:none !important;
  color:var(--ec-text) !important;font-weight:700 !important;
  font-size:.9em !important;padding:0 !important;
  flex:1 1 auto;min-width:0;text-align:right;white-space:normal;
  overflow-wrap:break-word;
}
#order-standard_cart .ec-config-desc .list-unstyled > li .badge-success{color:var(--ec-green) !important;}
#order-standard_cart .ec-config-desc .list-unstyled > li .badge i{
  width:auto;height:auto;background:none !important;color:inherit !important;
  border-radius:0;font-size:1em;margin-right:4px !important;
}
#order-standard_cart .ec-section-label{
  font-size:.72em;font-weight:700;text-transform:uppercase;letter-spacing:.05em;
  color:var(--ec-text-faint);margin:22px 2px 10px;
}
#order-standard_cart .ec-option-icon{
  width:38px;height:38px;min-width:38px;border-radius:10px;flex-shrink:0;
  background:var(--ec-blue-tint) !important;color:var(--ec-blue) !important;
  display:flex !important;align-items:center;justify-content:center;
}
#order-standard_cart .ec-option-icon .icon{width:18px;height:18px;}

/* ---------- order summary sidebar ---------- */
/* #orderSummary is WHMCS's own wrapper around .ec-summary-card - it carries a
   stock light background/border of its own that we never touched, so even
   with .ec-summary-card correctly dark, its wrapper still showed through as
   a light seam around it. Strip its own chrome so only the card is visible. */
#order-standard_cart #orderSummary,
#order-standard_cart .secondary-cart-sidebar{background:transparent !important;border:none !important;box-shadow:none !important;}
#order-standard_cart .ec-summary-card{
  /* !important: this card is the one thing on the page that stayed stock-white
     even after the wrapper/everything else around it went dark and the CSS
     cache-bust confirmed fresh - WHMCS's own recalctotals() AJAX refresh
     likely re-renders this fragment with its own inline/stock background,
     which a plain rule can't outrank. */
  background:var(--ec-card) !important;color:var(--ec-text);
  border:1px solid var(--ec-border);border-radius:var(--ec-radius-lg);
  padding:22px;margin-bottom:14px;box-shadow:0 1px 2px rgba(15,23,42,.04);position:relative;
}
#order-standard_cart .ec-summary-card h2{font-size:1.05em;margin:0 0 14px;}
#order-standard_cart .ec-summary-cta{border-radius:var(--ec-radius-sm);font-weight:600;}
#order-standard_cart #orderSummaryLoader{position:absolute;top:20px;right:20px;color:var(--ec-blue);}
#order-standard_cart .product-name{display:block;font-family:var(--ec-font-display);font-weight:700;color:var(--ec-text);font-size:1.02em;}
#order-standard_cart .product-group{
  display:block;color:var(--ec-text-faint);font-size:.8em;
  padding-bottom:14px;margin-bottom:14px;border-bottom:1px solid var(--ec-border);
}
#order-standard_cart .ec-trust-badge{
  display:flex;align-items:center;justify-content:center;gap:6px;
  margin:10px 0 0;color:var(--ec-text-faint);font-size:.78em;font-weight:600;
}
#order-standard_cart .ec-trust-badge .icon{width:12px;height:12px;}

#order-standard_cart .ec-promo-disclosure{margin-top:16px;text-align:center;}
#order-standard_cart .ec-promo-disclosure summary{
  cursor:pointer;font-size:.83em;font-weight:600;color:var(--ec-blue-light);list-style:none;
}
#order-standard_cart .ec-promo-disclosure summary::-webkit-details-marker{display:none;}
#order-standard_cart .ec-promo-disclosure summary:hover{color:var(--ec-blue-dark);}
#order-standard_cart .ec-promo-disclosure[open] summary{margin-bottom:10px;}
#order-standard_cart .ec-promo-form{display:flex;gap:8px;text-align:left;}
#order-standard_cart .ec-promo-form input{flex:1;min-width:0;}
#order-standard_cart .ec-promo-form button{flex-shrink:0;}
/* #producttotal is the AJAX-refreshed price-breakdown block (recalctotals())
   nested inside .ec-summary-card - only its .clearfix rows were ever styled,
   so the container itself kept whatever stock background WHMCS renders it
   with, showing as a separate light box floating inside the otherwise-dark
   card (title above and CTA below sit directly on .ec-summary-card and were
   already fine). */
#order-standard_cart #producttotal{background:transparent !important;color:var(--ec-text);}
#order-standard_cart #producttotal .clearfix{
  display:flex;justify-content:space-between;gap:10px;padding:8px 0;
  border-bottom:1px solid var(--ec-border);font-size:.87em;color:var(--ec-text-muted);
}
#order-standard_cart #producttotal .clearfix .pull-left,
#order-standard_cart #producttotal .clearfix .pull-right{float:none;}
#order-standard_cart .summary-totals{margin-top:6px;}
#order-standard_cart .summary-totals .clearfix{color:var(--ec-text);}
#order-standard_cart .total-due-today{
  display:flex;align-items:baseline;justify-content:space-between;
  margin-top:14px;padding-top:14px;border-top:2px solid var(--ec-border);
}
#order-standard_cart .total-due-today .amt{
  font-family:var(--ec-font-display);font-size:1.6em;font-weight:800;color:var(--ec-text);
}
#order-standard_cart .total-due-today span:not(.amt){color:var(--ec-text-muted);font-size:.83em;}

@media (max-width:700px){
  #order-standard_cart .ec-steps{gap:6px 0;}
  #order-standard_cart .ec-step span:not(.ec-step-dot){display:none;}
  #order-standard_cart .ec-step-line{width:20px;margin:0 6px;}
}

/* ---------- cart: configured-offer recap card ---------- */
#order-standard_cart .ec-cart-items{display:flex;flex-direction:column;gap:14px;}
#order-standard_cart .ec-offer-card{
  background:var(--ec-card);border:1px solid var(--ec-border);border-radius:var(--ec-radius-lg);
  padding:20px 22px;box-shadow:0 1px 2px rgba(15,23,42,.04);
}
#order-standard_cart .ec-offer-card-head{
  display:flex;align-items:flex-start;justify-content:space-between;gap:16px;flex-wrap:wrap;
  padding-bottom:16px;margin-bottom:16px;border-bottom:1px solid var(--ec-border);
}
#order-standard_cart .ec-offer-card-head h3{font-size:1.15em;margin:0;}
#order-standard_cart .ec-offer-domain{color:var(--ec-text-muted);font-weight:500;font-size:.7em;margin-left:8px;}
#order-standard_cart .ec-offer-card-actions{display:flex;align-items:center;gap:10px;flex-wrap:wrap;}
#order-standard_cart .ec-offer-card-actions .item-price{text-align:right;}
#order-standard_cart .ec-offer-price{
  display:block;font-family:var(--ec-font-display);font-weight:800;font-size:1.15em;color:var(--ec-text);
}
#order-standard_cart .ec-offer-card-actions .cycle{color:var(--ec-text-faint);font-size:.78em;}

#order-standard_cart .ec-offer-spec-grid{
  display:grid !important;grid-template-columns:repeat(3,1fr) !important;gap:16px 20px;
}
@media (max-width:900px){#order-standard_cart .ec-offer-spec-grid{grid-template-columns:repeat(2,1fr) !important;}}
@media (max-width:560px){#order-standard_cart .ec-offer-spec-grid{grid-template-columns:1fr !important;}}
#order-standard_cart .ec-spec-tile{display:flex !important;align-items:center;gap:12px;}
#order-standard_cart .ec-spec-value{font-weight:700;color:var(--ec-text);font-size:.95em;}
#order-standard_cart .ec-spec-label{color:var(--ec-text-faint);font-size:.78em;}

#order-standard_cart .ec-offer-qty{display:flex;align-items:center;gap:10px;margin-top:16px;padding-top:16px;border-top:1px solid var(--ec-border);}
#order-standard_cart .ec-offer-qty label{margin:0;}
#order-standard_cart .ec-offer-qty .form-control{width:80px;}
#order-standard_cart .ec-offer-note{color:var(--ec-text-faint);font-size:.8em;margin:12px 0 0;}

#order-standard_cart .ec-continue-link{display:block;text-align:center;margin-top:10px;color:var(--ec-text-muted);}
#order-standard_cart .btn-checkout{border-radius:var(--ec-radius-sm);font-weight:600;display:flex;align-items:center;justify-content:center;gap:8px;}

/* ---------- shop: step 1 - pick a category ---------- */
#order-standard_cart .header-lined p{color:var(--ec-text-muted);margin:6px 0 0;}
#order-standard_cart .ec-cat-grid{
  display:grid !important;grid-template-columns:repeat(3,minmax(0,1fr)) !important;gap:16px;
}
@media (max-width:900px){#order-standard_cart .ec-cat-grid{grid-template-columns:repeat(2,minmax(0,1fr)) !important;}}
@media (max-width:560px){#order-standard_cart .ec-cat-grid{grid-template-columns:minmax(0,1fr) !important;}}
#order-standard_cart .ec-cat-card{
  display:flex !important;align-items:center;gap:14px;
  background:var(--ec-card);border:1px solid var(--ec-border);border-radius:var(--ec-radius-lg);
  padding:20px 20px;box-shadow:0 1px 2px rgba(15,23,42,.04);transition:.15s;
}
#order-standard_cart .ec-cat-card:hover,
#order-standard_cart .ec-cat-card.active{border-color:var(--ec-blue);box-shadow:0 8px 20px rgba(15,23,42,.08);}
#order-standard_cart .ec-cat-icon{
  width:44px;height:44px;flex-shrink:0;border-radius:var(--ec-radius-md);
  display:flex;align-items:center;justify-content:center;
  background:var(--ec-blue-tint);font-size:1.3em;
}
#order-standard_cart .ec-cat-label{flex:1;min-width:0;font-family:var(--ec-font-display);font-weight:700;color:var(--ec-text);}
#order-standard_cart .ec-cat-label .badge{margin-left:8px;background:var(--ec-blue-tint);color:var(--ec-blue);font-weight:600;}
#order-standard_cart .ec-cat-arrow{width:14px;height:14px;flex-shrink:0;color:var(--ec-text-faint);}

/* ---------- shop: step 2 - category pills + offer cards ---------- */
#order-standard_cart .ec-cat-pills{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:24px;}
#order-standard_cart .ec-cat-pill{
  display:inline-flex;align-items:center;
  background:var(--ec-card);border:1px solid var(--ec-border-strong);border-radius:999px;
  padding:10px 20px;font-family:var(--ec-font-display);font-weight:700;font-size:.88em;
  color:var(--ec-text-muted);box-shadow:0 1px 2px rgba(15,23,42,.04);transition:.15s;
}
#order-standard_cart .ec-cat-pill:hover{border-color:var(--ec-blue);color:var(--ec-blue-dark);box-shadow:0 4px 12px rgba(15,23,42,.08);}
#order-standard_cart .ec-cat-pill.active{background:var(--ec-blue);border-color:var(--ec-blue);color:#fff;}

#order-standard_cart .ec-offer-grid{
  display:grid !important;grid-template-columns:repeat(3,minmax(0,1fr)) !important;gap:18px;
}
@media (max-width:1000px){#order-standard_cart .ec-offer-grid{grid-template-columns:repeat(2,minmax(0,1fr)) !important;}}
@media (max-width:640px){#order-standard_cart .ec-offer-grid{grid-template-columns:minmax(0,1fr) !important;}}
#order-standard_cart .ec-shop-card{
  display:flex;flex-direction:column;
  background:var(--ec-card);border:1px solid var(--ec-border);border-radius:var(--ec-radius-lg);
  padding:22px;box-shadow:0 1px 2px rgba(15,23,42,.04);transition:.15s;
}
#order-standard_cart .ec-shop-card:hover{border-color:var(--ec-border-strong);box-shadow:0 8px 20px rgba(15,23,42,.08);}
#order-standard_cart .ec-shop-card-head{display:flex;align-items:flex-start;justify-content:space-between;gap:10px;margin-bottom:6px;}
#order-standard_cart .ec-shop-card-head h3{font-size:1.1em;margin:0;}
#order-standard_cart .ec-shop-stock{flex-shrink:0;color:var(--ec-text-faint);font-size:.75em;font-weight:600;white-space:nowrap;}

/* The offer card is a narrow 1/3-width column, so the description's spec list
   (a 3-column grid of bordered chips on the wide configure page) collapses to
   a single stacked column here - and the per-item box is dropped in favour of
   plain rows separated by hairlines, matching the upgrade/downgrade plan cards
   in the client area. Scoped to .ec-shop-desc so the configure page keeps its
   own chip treatment. */
#order-standard_cart .ec-shop-desc{flex:1;margin-top:14px !important;}
#order-standard_cart .ec-shop-desc .list-unstyled{
  grid-template-columns:1fr !important;gap:0 !important;
}
#order-standard_cart .ec-shop-desc .list-unstyled>li{
  background:none !important;border:none !important;box-shadow:none !important;
  border-radius:0 !important;padding:9px 0 !important;
  border-bottom:1px solid var(--ec-border) !important;
}
#order-standard_cart .ec-shop-desc .list-unstyled>li:last-child{border-bottom:none !important;}
/* the spec icons carry no information the label doesn't already give, and
   dropping them is what makes these rows read as the same quiet list */
#order-standard_cart .ec-shop-desc .list-unstyled>li i{display:none !important;}
#order-standard_cart .ec-shop-desc .list-unstyled>li [class*="text-"]{
  color:var(--ec-text-muted) !important;font-weight:600 !important;
}
/* valeur : texte gras aligné à droite, sans pastille (une pastille grise étirée sur
   la ligne par la règle générique faisait une barre) */
#order-standard_cart .ec-shop-desc .list-unstyled>li .badge,
#order-standard_cart .ec-shop-desc .list-unstyled>li .label{
  background:none !important;color:var(--ec-text) !important;
  font-weight:700 !important;font-size:.9em !important;
  padding:0 !important;border-radius:0 !important;
  margin-left:auto !important;text-align:right;
}
#order-standard_cart .ec-shop-desc .list-unstyled>li .badge-success{color:var(--ec-green) !important;}

#order-standard_cart .ec-shop-card-foot{
  margin-top:18px;padding-top:16px;border-top:1px solid var(--ec-border);
  display:flex;flex-direction:column;align-items:stretch;gap:12px;
}
#order-standard_cart .ec-shop-price{display:flex;flex-wrap:wrap;align-items:baseline;gap:0 7px;line-height:1.3;}
/* the caption and the setup fee each take their own line; the amount and its
   billing cycle read together on one */
#order-standard_cart .ec-shop-price-label{
  width:100%;color:var(--ec-text-faint);font-size:.7em;font-weight:800;
  letter-spacing:.05em;text-transform:uppercase;
}
#order-standard_cart .ec-shop-price-amt{font-family:var(--ec-font-display);font-size:1.35em;font-weight:800;color:var(--ec-text);}
#order-standard_cart .ec-shop-price-cycle{color:var(--ec-text-faint);font-size:.78em;}
#order-standard_cart .ec-shop-setup{width:100%;color:var(--ec-text-faint);font-size:.72em;}
/* full-width call to action, like the plan cards it now matches - a bigger
   target than the old inline button squeezed beside the price */
#order-standard_cart .ec-shop-cta{
  display:flex;align-items:center;justify-content:center;gap:8px;width:100%;
  border-radius:var(--ec-radius-sm);font-weight:600;
  background:var(--ec-blue) !important;border-color:var(--ec-blue) !important;color:#fff !important;
  opacity:1 !important;
}
#order-standard_cart .ec-shop-cta:hover,
#order-standard_cart .ec-shop-cta:focus{
  background:var(--ec-blue-dark) !important;border-color:var(--ec-blue-dark) !important;color:#fff !important;
}
#order-standard_cart .ec-shop-cta .icon{width:14px;height:14px;}

/* ---------- domain register/transfer page - restyle only, stock domainregister.tpl ----------
   No template override here (deliberately - see conversation: a full rewrite risked
   guessing WHMCS's internal Smarty variables wrong on a live purchase flow). Same
   idea as the .domain-checker-*/.spotlight-tld rules above: target WHMCS's own
   real markup/classes so the page keeps using WHMCS's stock search + availability
   logic untouched, only the visuals change. */

/* sidebar removed. products.tpl/viewcart.tpl achieve this by simply not rendering
   the sidebar markup at all (see .ec-cart-body-full above) - this page still uses
   WHMCS's stock template, which does render it, so it's hidden via CSS instead.
   Confirmed via live page source: WHMCS renders BOTH a desktop version
   (.cart-sidebar, containing the "Catégories"/"Actions" panels directly) AND a
   separate mobile-breakpoint version nested inside .cart-body itself
   (.sidebar-collapsed, same panels as a <select> dropdown) - both must be hidden. */
#order-standard_cart .cart-sidebar,
#order-standard_cart .sidebar-collapsed{display:none !important;}
#order-standard_cart .cart-body{width:100% !important;float:none !important;}

/* search hero: give the existing dark banner (.domain-checker-bg is WHMCS's own
   class, already dark-blue via the rule above) a proper card treatment instead of
   a flat full-bleed rectangle, and center the search form inside it. border/outline
   reset in case the odd corner highlight seen in testing comes from a stock
   validation-state border (e.g. .has-warning) landing on this container. */
#order-standard_cart .domain-checker-bg{
  border-radius:var(--ec-radius-lg);padding:36px 28px;margin-bottom:28px;
  box-shadow:0 1px 2px rgba(15,23,42,.04);
  border:none !important;outline:none !important;
}
#order-standard_cart .domain-checker-bg h1,
#order-standard_cart .domain-checker-bg h2,
#order-standard_cart .domain-checker-bg h3,
#order-standard_cart .domain-checker-bg p{color:#fff;}
#order-standard_cart .domain-checker-container{max-width:640px;margin:0 auto;}
#order-standard_cart .domain-checker-container .btn{
  border-radius:0 var(--ec-radius-sm) var(--ec-radius-sm) 0 !important;
}

/* TLD category filter pills ("Popular"/"Other") - WHMCS renders these as
   Bootstrap badges (badge/badge-secondary, badge-success for the active one) */
#order-standard_cart .badge-secondary{
  display:inline-flex;align-items:center;background:var(--ec-card) !important;
  border:1px solid var(--ec-border-strong);border-radius:999px;
  padding:8px 16px;font-family:var(--ec-font-display);font-weight:700;font-size:.85em;
  color:var(--ec-text-muted) !important;box-shadow:0 1px 2px rgba(15,23,42,.04);
}
#order-standard_cart .badge-success{
  background:var(--ec-blue) !important;border-color:var(--ec-blue) !important;color:#fff !important;
}

/* TLD pricing table: round it into a card and clean up the header/row styling */
#order-standard_cart table{
  background:var(--ec-card);border-collapse:separate;border-spacing:0;width:100%;
  border:1px solid var(--ec-border);border-radius:var(--ec-radius-lg);overflow:hidden;
  box-shadow:0 1px 2px rgba(15,23,42,.04);
}
#order-standard_cart table th{
  background:rgba(15,23,42,.02);font-family:var(--ec-font-display);font-weight:700;
  color:var(--ec-text);border-color:var(--ec-border) !important;
}
#order-standard_cart table td{border-color:var(--ec-border) !important;color:var(--ec-text-muted);}
#order-standard_cart table tr:hover td{background:rgba(15,23,42,.015);}
#order-standard_cart table td strong,
#order-standard_cart table td b{font-family:var(--ec-font-display);color:var(--ec-text);}

/* ==========================================================================
   Configuration produit - sections numérotées, durée en cartes avec économie,
   options en lignes, fiche technique sobre (configureproduct.tpl).
   Style : grille nette, hiérarchie typographique, peu de décoration ; un seul
   accent (le bleu) pour la sélection, le vert réservé aux économies.
   ========================================================================== */

/* Champ masqué mais toujours atteignable au clavier (radios et cases stylées) */
#order-standard_cart .ec-cycle-card input,
#order-standard_cart .ec-seg-item input,
#order-standard_cart .ec-choice-card input,
#order-standard_cart .ec-switch input{
  position:absolute;opacity:0;width:1px;height:1px;margin:0;pointer-events:none;
}

/* ---------- en-tête produit + fiche technique ---------- */
#order-standard_cart .ec-config-header{padding:24px 26px;}
#order-standard_cart .ec-config-eyebrow{
  font-size:.8em;font-weight:600;color:var(--ec-blue);margin-bottom:6px;
}
#order-standard_cart .ec-config-header h1{font-size:1.6em;letter-spacing:-.015em;line-height:1.2;margin:0;}
#order-standard_cart .ec-config-header .ec-config-desc{margin-top:18px;}
/* Caractéristiques en tableau : valeur en gras au-dessus, libellé discret en
   dessous, cellules séparées par de simples filets (pas de pastilles ni d'icônes). */
/* Lignes toujours pleines : le nombre de colonnes suit le nombre de caractéristiques
   (6 → 3 × 2, 8 → 4 × 2…) et une dernière ligne incomplète s'étire, donc ni case vide
   ni filet interrompu. */
#order-standard_cart .ec-config-header .ec-config-desc .list-unstyled{
  --ec-spec-cols:4;
  display:flex !important;flex-wrap:wrap;gap:0 !important;
  border:1px solid var(--ec-border) !important;border-radius:var(--ec-radius-md) !important;
  overflow:hidden;background:var(--ec-card);
}
#order-standard_cart .ec-config-header .ec-config-desc .list-unstyled:has(> li:nth-of-type(3):last-of-type),
#order-standard_cart .ec-config-header .ec-config-desc .list-unstyled:has(> li:nth-of-type(5):last-of-type),
#order-standard_cart .ec-config-header .ec-config-desc .list-unstyled:has(> li:nth-of-type(6):last-of-type),
#order-standard_cart .ec-config-header .ec-config-desc .list-unstyled:has(> li:nth-of-type(9):last-of-type){--ec-spec-cols:3;}
#order-standard_cart .ec-config-header .ec-config-desc .list-unstyled:has(> li:nth-of-type(2):last-of-type){--ec-spec-cols:2;}
@media (max-width:600px){#order-standard_cart .ec-config-header .ec-config-desc .list-unstyled{--ec-spec-cols:2 !important;}}
#order-standard_cart .ec-config-header .ec-config-desc .list-unstyled > li{
  flex:1 0 calc(100% / var(--ec-spec-cols) - 1px);
  flex-direction:column-reverse !important;align-items:flex-start !important;justify-content:center !important;
  gap:3px !important;background:transparent !important;border:none !important;border-radius:0 !important;
  /* filets : à gauche et au-dessus de chaque cellule ; ceux du bord sont coupés par overflow:hidden */
  box-shadow:-1px 0 0 var(--ec-border),0 -1px 0 var(--ec-border) !important;
  padding:14px 18px !important;
}
#order-standard_cart .ec-config-header .ec-config-desc .list-unstyled > li i{display:none !important;}
#order-standard_cart .ec-config-header .ec-config-desc .list-unstyled > li [class*="text-"]{
  color:var(--ec-text-faint) !important;font-size:.78em !important;font-weight:500 !important;
  white-space:normal;gap:0 !important;
}
#order-standard_cart .ec-config-header .ec-config-desc .list-unstyled > li .badge,
#order-standard_cart .ec-config-header .ec-config-desc .list-unstyled > li .label{
  flex:0 0 auto !important;text-align:left !important;padding:0 !important;
  font-family:var(--ec-font-display);font-size:1.05em !important;font-weight:700 !important;
  color:var(--ec-text) !important;background:none !important;line-height:1.3;
}
#order-standard_cart .ec-config-header .ec-config-desc .list-unstyled > li .badge-success{color:var(--ec-green) !important;}

/* ---------- sections numérotées ---------- */
#order-standard_cart .ec-cfg-section{
  background:var(--ec-card);border:1px solid var(--ec-border);border-radius:var(--ec-radius-lg);
  padding:22px 24px 24px;margin-bottom:16px;box-shadow:0 1px 2px rgba(15,23,42,.04);
}
#order-standard_cart .ec-cfg-head{display:flex;align-items:flex-start;gap:14px;margin-bottom:18px;}
#order-standard_cart .ec-cfg-num{
  width:28px;height:28px;flex-shrink:0;margin-top:1px;border-radius:50%;
  display:grid;place-items:center;background:var(--ec-text);color:var(--ec-card);
  font-family:var(--ec-font-display);font-size:.82em;font-weight:700;
}
#order-standard_cart .ec-cfg-head h2{font-size:1.08em;font-weight:700;margin:0 0 3px;letter-spacing:-.005em;}
#order-standard_cart .ec-cfg-head p{margin:0;color:var(--ec-text-muted);font-size:.88em;line-height:1.5;}
#order-standard_cart .ec-metric-list{margin:0;padding-left:18px;color:var(--ec-text-muted);}

/* ---------- durée d'engagement ---------- */
#order-standard_cart .ec-cycle-grid{
  display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:12px;padding-top:6px;
}
#order-standard_cart .ec-cycle-card{
  position:relative;display:flex;flex-direction:column;gap:6px;margin:0;cursor:pointer;
  padding:16px 16px 14px;background:var(--ec-card);
  border:1.5px solid var(--ec-border-strong);border-radius:var(--ec-radius-md);
  font-weight:400;transition:border-color .15s,box-shadow .15s;
}
#order-standard_cart .ec-cycle-card:hover{border-color:var(--ec-blue-light);}
#order-standard_cart .ec-cycle-card:has(input:checked){border-color:var(--ec-blue);box-shadow:0 0 0 3px var(--ec-blue-tint);}
#order-standard_cart .ec-cycle-card:has(input:focus-visible){outline:2px solid var(--ec-blue);outline-offset:2px;}
#order-standard_cart .ec-cycle-tags{display:flex;min-height:20px;margin-top:2px;}
#order-standard_cart .ec-cycle-name{
  display:inline-flex;align-items:center;gap:8px;font-size:.88em;font-weight:600;color:var(--ec-text);white-space:nowrap;
}
/* indicateur radio */
#order-standard_cart .ec-cycle-name::before{
  content:"";width:15px;height:15px;flex-shrink:0;border-radius:50%;
  border:1.5px solid var(--ec-border-strong);background:var(--ec-card);transition:border .15s;
}
#order-standard_cart .ec-cycle-card:has(input:checked) .ec-cycle-name::before{border:4.5px solid var(--ec-blue);}
#order-standard_cart .ec-cycle-save{
  flex-shrink:0;padding:2px 8px;border-radius:999px;background:rgba(26,138,84,.1);
  color:var(--ec-green);font-size:.72em;font-weight:700;font-variant-numeric:tabular-nums;
}
#order-standard_cart .ec-cycle-save.is-neutral{background:var(--ec-bg-soft);color:var(--ec-text-muted);font-weight:600;}
#order-standard_cart .ec-cycle-price{display:flex;align-items:baseline;gap:3px;margin-top:4px;}
#order-standard_cart .ec-cycle-price strong{
  font-family:var(--ec-font-display);font-size:1.5em;font-weight:800;color:var(--ec-text);
  letter-spacing:-.015em;font-variant-numeric:tabular-nums;
}
#order-standard_cart .ec-cycle-price small{color:var(--ec-text-muted);font-size:.8em;font-weight:500;}
#order-standard_cart .ec-cycle-billed{color:var(--ec-text-faint);font-size:.78em;line-height:1.4;}
#order-standard_cart .ec-cycle-best{
  position:absolute;top:-10px;left:14px;padding:2px 9px;border-radius:999px;
  background:var(--ec-green);color:#fff;font-size:.68em;font-weight:700;letter-spacing:.01em;
}

/* ---------- options : une ligne par option ---------- */
#order-standard_cart .ec-opt-list{display:flex;flex-direction:column;}
#order-standard_cart .ec-opt-row{
  display:grid;grid-template-columns:minmax(140px,210px) minmax(0,1fr);align-items:center;gap:10px 24px;
  padding:16px 0;border-top:1px solid var(--ec-border);
}
#order-standard_cart .ec-opt-row:first-child{border-top:0;padding-top:2px;}
#order-standard_cart .ec-opt-row-stack{grid-template-columns:minmax(0,1fr);align-items:start;}
#order-standard_cart .ec-opt-label,
#order-standard_cart .ec-opt-label label{margin:0;font-size:.9em;font-weight:600;color:var(--ec-text);}
#order-standard_cart .ec-opt-control{min-width:0;}

/* contrôle segmenté (2 à 4 choix courts) */
#order-standard_cart .ec-seg{
  display:inline-flex;flex-wrap:wrap;gap:3px;padding:3px;
  background:var(--ec-bg);border:1px solid var(--ec-border);border-radius:10px;
}
#order-standard_cart .ec-seg-item{position:relative;margin:0;cursor:pointer;font-weight:400;}
#order-standard_cart .ec-seg-item span{
  display:block;padding:8px 15px;border-radius:7px;font-size:.86em;font-weight:600;
  color:var(--ec-text-muted);white-space:nowrap;transition:background .15s,color .15s,box-shadow .15s;
}
#order-standard_cart .ec-seg-item:hover span{color:var(--ec-text);}
#order-standard_cart .ec-seg-item:has(input:checked) span{
  background:var(--ec-card);color:var(--ec-text);
  box-shadow:0 1px 2px rgba(15,23,42,.12),0 0 0 1px var(--ec-border);
}
#order-standard_cart .ec-seg-item:has(input:focus-visible) span{outline:2px solid var(--ec-blue);outline-offset:1px;}

/* cartes de choix (systèmes, applications…) */
#order-standard_cart .ec-choice-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:8px;}
#order-standard_cart .ec-choice-card{
  position:relative;display:flex;align-items:center;gap:12px;margin:0;cursor:pointer;
  padding:12px 14px;background:var(--ec-card);font-weight:400;
  border:1.5px solid var(--ec-border-strong);border-radius:var(--ec-radius-md);
  transition:border-color .15s,box-shadow .15s;
}
#order-standard_cart .ec-choice-card:hover{border-color:var(--ec-blue-light);}
#order-standard_cart .ec-choice-card:has(input:checked){border-color:var(--ec-blue);box-shadow:0 0 0 3px var(--ec-blue-tint);}
#order-standard_cart .ec-choice-card:has(input:focus-visible){outline:2px solid var(--ec-blue);outline-offset:2px;}
/* Logo officiel sur une tuile claire, dans les deux thèmes : les logos sombres
   (AlmaLinux, CentOS, Debian) restent lisibles sur le fond foncé. */
#order-standard_cart .ec-choice-logo{
  display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;
  width:38px;height:38px;border-radius:10px;background:#fff;color:#1d1d1f;
  border:1px solid var(--ec-border);box-shadow:0 1px 2px rgba(15,23,42,.05);
}
#order-standard_cart .ec-choice-logo svg{width:22px;height:22px;}
#order-standard_cart .ec-choice-logo.is-generic{background:var(--ec-bg-soft);color:var(--ec-text-faint);box-shadow:none;}
#order-standard_cart .ec-choice-card:has(input:checked) .ec-choice-logo.is-generic{color:var(--ec-blue);}
:root[data-theme="dark"] #order-standard_cart .ec-choice-logo:not(.is-generic){background:#f3f5f9;border-color:transparent;}
/* logos-textes (Plesk, cPanel) : un peu plus larges pour rester lisibles */
#order-standard_cart .ec-choice-logo.is-plesk svg,
#order-standard_cart .ec-choice-logo.is-cpanel svg{width:30px;height:30px;}
#order-standard_cart .ec-choice-text{flex:1;min-width:0;display:flex;flex-direction:column;gap:1px;}
#order-standard_cart .ec-choice-name{font-size:.88em;font-weight:600;color:var(--ec-text);line-height:1.3;overflow-wrap:anywhere;}
#order-standard_cart .ec-choice-price{font-size:.76em;color:var(--ec-text-muted);}
#order-standard_cart .ec-choice-price.is-free{color:var(--ec-green);font-weight:600;}
#order-standard_cart .ec-choice-radio{
  width:16px;height:16px;flex-shrink:0;border-radius:50%;
  border:1.5px solid var(--ec-border-strong);transition:border .15s;
}
#order-standard_cart .ec-choice-card:has(input:checked) .ec-choice-radio{border:5px solid var(--ec-blue);}

/* interrupteur (option oui / non) */
#order-standard_cart .ec-switch{display:inline-flex;align-items:center;gap:10px;margin:0;cursor:pointer;font-weight:500;color:var(--ec-text);position:relative;}
#order-standard_cart .ec-switch-track{
  position:relative;width:38px;height:22px;flex-shrink:0;border-radius:999px;
  background:var(--ec-border-strong);transition:background .15s;
}
#order-standard_cart .ec-switch-track::after{
  content:"";position:absolute;top:3px;left:3px;width:16px;height:16px;border-radius:50%;
  background:#fff;box-shadow:0 1px 2px rgba(15,23,42,.25);transition:transform .15s;
}
#order-standard_cart .ec-switch:has(input:checked) .ec-switch-track{background:var(--ec-blue);}
#order-standard_cart .ec-switch:has(input:checked) .ec-switch-track::after{transform:translateX(16px);}
#order-standard_cart .ec-switch:has(input:focus-visible) .ec-switch-track{outline:2px solid var(--ec-blue);outline-offset:2px;}
#order-standard_cart .ec-switch-text{font-size:.88em;}
#order-standard_cart .ec-qty{display:flex;align-items:center;gap:10px;color:var(--ec-text-muted);}
#order-standard_cart .ec-qty .form-control{width:96px;}

/* ---------- paramètres du serveur ---------- */
#order-standard_cart .ec-form-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px 20px;}
#order-standard_cart .ec-form-grid-1{grid-template-columns:minmax(0,1fr);}
#order-standard_cart .ec-form-field label{display:block;margin:0 0 6px;font-size:.86em;font-weight:600;color:var(--ec-text);}
#order-standard_cart .ec-form-field .form-control{height:42px;}
#order-standard_cart .ec-form-field textarea.form-control{height:auto;}
#order-standard_cart .ec-form-field .field-help-text{display:block;margin-top:6px;font-size:.78em;line-height:1.45;}
#order-standard_cart .ec-pass{display:flex;gap:6px;}
#order-standard_cart .ec-pass .form-control{flex:1;min-width:0;font-family:ui-monospace,Menlo,monospace;}
#order-standard_cart .ec-pass-btn{
  flex-shrink:0;display:inline-flex;align-items:center;justify-content:center;
  height:42px;min-width:42px;padding:0 12px;cursor:pointer;
  background:var(--ec-card);border:1px solid var(--ec-border-strong);border-radius:var(--ec-radius-sm);
  color:var(--ec-text-muted);font-size:.82em;font-weight:600;transition:border-color .15s,color .15s;
}
#order-standard_cart .ec-pass-btn:hover{border-color:var(--ec-blue);color:var(--ec-text);}
#order-standard_cart .ec-pass-btn:focus-visible{outline:2px solid var(--ec-blue);outline-offset:2px;}
#order-standard_cart .ec-pass-btn .icon{width:16px;height:16px;}
#order-standard_cart .ec-advanced{margin-top:18px;padding-top:14px;border-top:1px solid var(--ec-border);}
#order-standard_cart .ec-advanced summary{
  display:inline-flex;align-items:center;gap:8px;cursor:pointer;list-style:none;
  font-size:.86em;font-weight:600;color:var(--ec-text-muted);
}
#order-standard_cart .ec-advanced summary::-webkit-details-marker{display:none;}
#order-standard_cart .ec-advanced summary::before{
  content:"";width:7px;height:7px;border-right:1.6px solid currentColor;border-bottom:1.6px solid currentColor;
  transform:rotate(-45deg);transition:transform .15s;
}
#order-standard_cart .ec-advanced[open] summary::before{transform:rotate(45deg);}
#order-standard_cart .ec-advanced summary:hover{color:var(--ec-text);}
#order-standard_cart .ec-advanced[open] summary{margin-bottom:16px;}

/* ---------- options supplémentaires (balisage WHMCS d'origine) ---------- */
#order-standard_cart .ec-addon-list .panel-addon{
  background:var(--ec-card);border:1.5px solid var(--ec-border-strong);border-radius:var(--ec-radius-md);
  box-shadow:none;overflow:hidden;transition:border-color .15s,box-shadow .15s;
}
#order-standard_cart .ec-addon-list .panel-addon:hover{border-color:var(--ec-blue-light);}
#order-standard_cart .ec-addon-list .panel-addon-selected{border-color:var(--ec-blue);box-shadow:0 0 0 3px var(--ec-blue-tint);}
#order-standard_cart .ec-addon-list .panel-addon label{color:var(--ec-text);font-weight:600;}
#order-standard_cart .ec-addon-list .panel-addon .panel-body{color:var(--ec-text-muted);font-size:.86em;}
#order-standard_cart .ec-addon-list .panel-price{font-family:var(--ec-font-display);font-weight:700;color:var(--ec-text);}
#order-standard_cart .ec-addon-list .panel-add{background:var(--ec-blue-tint);color:var(--ec-blue-dark);font-weight:600;}
#order-standard_cart .ec-addon-list .panel-addon-selected .panel-add{background:var(--ec-blue);color:#fff;}

/* ---------- récapitulatif ---------- */
#order-standard_cart .ec-summary-card .ec-summary-cta{
  display:flex;align-items:center;justify-content:center;gap:8px;margin-top:18px;
}
#order-standard_cart .ec-summary-card .ec-summary-cta .icon{width:15px;height:15px;}
#order-standard_cart .ec-help-line{margin:20px 0 6px;text-align:center;color:var(--ec-text-faint);font-size:.85em;}

@media (max-width:760px){
  #order-standard_cart .ec-cfg-section{padding:18px 16px 20px;}
  #order-standard_cart .ec-opt-row{grid-template-columns:minmax(0,1fr);}
  #order-standard_cart .ec-form-grid{grid-template-columns:minmax(0,1fr);}
  #order-standard_cart .ec-cycle-grid{grid-template-columns:repeat(2,minmax(0,1fr));}
  #order-standard_cart .ec-seg{display:flex;}
  #order-standard_cart .ec-seg-item{flex:1;}
  #order-standard_cart .ec-seg-item span{text-align:center;}
}
@media (prefers-reduced-motion:reduce){
  #order-standard_cart .ec-cfg-section *{transition:none !important;}
}