/* LWB Theme — thème enfant de Twenty-One · LEWEBMAX Admin · MIT */
@import url("https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap");

:root {
    --lwm-bg: #f5f7fb;
    --lwm-surface: #ffffff;
    --lwm-border: #e6eaf2;
    --lwm-border-strong: #d7dde9;
    --lwm-text: #0f172a;
    --lwm-muted: #64748b;
    --lwm-primary: #030673;
    --lwm-primary-600: #020452;
    --lwm-primary-50: #eef1fc;
    --lwm-ok: #0f8a5f;
    --lwm-ok-50: #e8f7f0;
    --lwm-warn: #a15c07;
    --lwm-warn-50: #fff5e5;
    --lwm-danger: #c62828;
    --lwm-danger-50: #fdecec;
    --lwm-radius: 14px;
    --lwm-radius-sm: 10px;
}

/* =====================================================================
   GLOBAL LAYER — applies to every page of the client area
   ===================================================================== */

/* ---------- Base ---------- */
body.primary-bg-color {
    background: var(--lwm-bg);
    color: var(--lwm-text);
    font-family: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
    font-size: 15px;
    -webkit-font-smoothing: antialiased;
}
body.primary-bg-color h1, body.primary-bg-color h2, body.primary-bg-color h3,
body.primary-bg-color h4, body.primary-bg-color h5, body.primary-bg-color h6 {
    color: var(--lwm-text); font-weight: 600; letter-spacing: -0.01em;
}
a { color: var(--lwm-primary); }
a:hover { color: var(--lwm-primary-600); }
.text-primary { color: var(--lwm-primary) !important; }
.bg-primary { background-color: var(--lwm-primary) !important; }
.text-muted { color: var(--lwm-muted) !important; }
hr { border-top-color: var(--lwm-border); }
::selection { background: rgba(3, 6, 115, .15); }

/* ---------- Header ---------- */
header.header .topbar { background: var(--lwm-text); padding: 4px 0; }
header.header .topbar .btn,
header.header .topbar .active-client .btn,
header.header .topbar .active-client .input-group-text { color: rgba(255, 255, 255, .72); font-size: 13px; }
header.header .topbar .btn:hover { color: #fff; }
header.header .topbar .active-client .btn.btn-active-client span { border-bottom-color: rgba(255, 255, 255, .35); }
header.header .navbar-light { background: var(--lwm-surface); padding-top: 14px; padding-bottom: 14px; }
header.header .logo-img { max-height: 46px; }
header.header .search { border-color: var(--lwm-border-strong); border-radius: var(--lwm-radius-sm); overflow: hidden; background: #fff; }
header.header .search:focus-within { border-color: var(--lwm-primary); box-shadow: 0 0 0 3px rgba(3, 6, 115, .12); }
header.header .toolbar .nav-link { border-color: var(--lwm-border-strong); color: var(--lwm-muted); border-radius: var(--lwm-radius-sm); }
header.header .toolbar .nav-link:hover { color: var(--lwm-primary); border-color: var(--lwm-primary); }
header.header .toolbar .nav-link .badge { background: var(--lwm-primary); color: #fff; opacity: 1; }
header.header .main-navbar-wrapper { background: var(--lwm-surface); border-top: 1px solid var(--lwm-border); border-bottom: 1px solid var(--lwm-border); }
header.header .navbar a, header.header .main-navbar-wrapper .navbar-nav .nav-link { color: var(--lwm-text); font-weight: 500; font-size: 14.5px; }
header.header .main-navbar-wrapper .navbar-nav .nav-link:hover,
header.header .main-navbar-wrapper .navbar-nav .active > .nav-link,
header.header .main-navbar-wrapper .navbar-nav .show > .nav-link { color: var(--lwm-primary); }
.dropdown-menu {
    border: 1px solid var(--lwm-border); border-radius: 12px; padding: 6px;
    box-shadow: 0 12px 32px rgba(15, 23, 42, .10);
}
.dropdown-item { border-radius: 8px; padding: 8px 12px; color: var(--lwm-text) !important; font-size: 14px; }
.dropdown-item:hover, .dropdown-item:focus { background: var(--lwm-primary-50); color: var(--lwm-primary) !important; }
header.header .dropdown-item.active, header.header .dropdown-item:active, .dropdown-item.active, .dropdown-item:active {
    background: var(--lwm-primary-50); color: var(--lwm-primary) !important;
}
.dropdown-divider { border-top-color: var(--lwm-border); }
.popover { border-color: var(--lwm-border); border-radius: 12px; box-shadow: 0 12px 32px rgba(15, 23, 42, .10); }

/* ---------- Breadcrumb & page body ---------- */
.master-breadcrumb { background: transparent; }
.master-breadcrumb .breadcrumb { background: transparent; padding: 16px 0 0; font-size: 13px; }
.master-breadcrumb .breadcrumb-item, .master-breadcrumb .breadcrumb-item a { color: var(--lwm-muted); }
.master-breadcrumb .breadcrumb-item.active { color: var(--lwm-text); }
#main-body { padding-top: 22px; padding-bottom: 48px; }
.primary-content .card-title { font-size: 20px; font-weight: 600; margin-bottom: 16px; }
.header-lined h1 { font-size: 24px; }

/* ---------- Cards ---------- */
.card, .mc-promo-manage, .mc-promo-login {
    border: 1px solid var(--lwm-border); border-radius: var(--lwm-radius); box-shadow: none; background: var(--lwm-surface);
}
.card-header, .card-footer { background: transparent; border-color: var(--lwm-border); }
.card-header:first-child { border-radius: var(--lwm-radius) var(--lwm-radius) 0 0; }
.card-footer:last-child { border-radius: 0 0 var(--lwm-radius) var(--lwm-radius); }
.card-body { padding: 1.35rem; }

/* ---------- Sidebar ---------- */
.sidebar .card { margin-bottom: 18px; overflow: hidden; }
.sidebar .card-header { padding: 14px 18px; }
.sidebar .card-title { font-size: 14px !important; font-weight: 600; color: var(--lwm-text); }
.sidebar .card-title i { color: var(--lwm-muted); }
.sidebar .list-group { font-size: 14px; }
.sidebar .list-group-item { padding: 10px 18px; border-color: var(--lwm-border); color: var(--lwm-text); }
.sidebar .list-group-item:hover { background: #f8fafc; color: var(--lwm-primary); }
.sidebar .list-group-item.active, .sidebar .list-group-item.active:hover, .sidebar .list-group-item.active:focus {
    background: var(--lwm-primary-50); border-color: var(--lwm-border); color: var(--lwm-primary); font-weight: 600;
    box-shadow: inset 3px 0 0 var(--lwm-primary);
}
.sidebar .list-group-item .badge { background: #f1f4f9; color: var(--lwm-muted); border-radius: 999px; width: auto; min-width: 26px; padding: 4px 8px; }
.sidebar .list-group-item.active .badge { background: #fff; color: var(--lwm-primary); }
.sidebar .list-group-item > i.far.fa-circle { color: var(--lwm-border-strong); }

/* ---------- Buttons ---------- */
.btn { border-radius: var(--lwm-radius-sm); font-weight: 500; transition: background .15s ease, border-color .15s ease, color .15s ease; }
.btn:focus, .btn.focus { box-shadow: 0 0 0 3px rgba(3, 6, 115, .15) !important; }
.btn-primary, .btn-success, .btn-info {
    background: var(--lwm-primary); border-color: var(--lwm-primary); color: #fff;
}
.btn-primary:hover, .btn-primary:focus, .btn-primary:not(:disabled):not(.disabled):active,
.btn-success:hover, .btn-success:focus, .btn-success:not(:disabled):not(.disabled):active,
.btn-info:hover, .btn-info:focus {
    background: var(--lwm-primary-600); border-color: var(--lwm-primary-600); color: #fff;
}
.btn-default, .btn-secondary, .btn-light, .btn-outline-secondary {
    background: #fff; border-color: var(--lwm-border-strong); color: var(--lwm-text);
}
.btn-default:hover, .btn-default:focus, .btn-secondary:hover, .btn-light:hover, .btn-outline-secondary:hover,
.btn-default:not(:disabled):not(.disabled):active {
    background: #fff; border-color: var(--lwm-primary); color: var(--lwm-primary);
}
.btn-outline-primary { color: var(--lwm-primary); border-color: var(--lwm-primary); }
.btn-outline-primary:hover { background: var(--lwm-primary); border-color: var(--lwm-primary); color: #fff; }
.btn-danger { background: #fff; border-color: #f3c9c9; color: var(--lwm-danger); }
.btn-danger:hover, .btn-danger:focus { background: var(--lwm-danger); border-color: var(--lwm-danger); color: #fff; }
.btn-warning { background: var(--lwm-warn-50); border-color: #f6d9a8; color: var(--lwm-warn); }
.btn-link { color: var(--lwm-primary); }

/* ---------- Forms ---------- */
.form-control, .custom-select {
    border-radius: var(--lwm-radius-sm); border-color: var(--lwm-border-strong); color: var(--lwm-text);
}
.form-control:focus, .custom-select:focus {
    border-color: var(--lwm-primary); box-shadow: 0 0 0 3px rgba(3, 6, 115, .12);
}
.input-group-text { background: #f8fafc; border-color: var(--lwm-border-strong); color: var(--lwm-muted); }
.input-group > .form-control:not(:first-child):not(:last-child) { border-radius: 0; }
.input-group > .form-control:first-child:not(:last-child) { border-radius: var(--lwm-radius-sm) 0 0 var(--lwm-radius-sm); }
.input-group > .form-control:not(:first-child):last-child { border-radius: 0 var(--lwm-radius-sm) var(--lwm-radius-sm) 0; }
.input-group > .input-group-prepend > .input-group-text,
.input-group > .input-group-prepend > .btn { border-radius: var(--lwm-radius-sm) 0 0 var(--lwm-radius-sm); }
.input-group > .input-group-append > .input-group-text,
.input-group > .input-group-append > .btn { border-radius: 0 var(--lwm-radius-sm) var(--lwm-radius-sm) 0; }
label, .col-form-label { font-weight: 500; color: var(--lwm-text); }
.custom-control-input:checked ~ .custom-control-label::before,
.custom-checkbox .custom-control-input:indeterminate ~ .custom-control-label::before {
    background-color: var(--lwm-primary); border-color: var(--lwm-primary);
}
.custom-control-input:focus ~ .custom-control-label::before { box-shadow: 0 0 0 3px rgba(3, 6, 115, .15); }

/* ---------- Tables & lists (services, invoices, domains, tickets...) ---------- */
.table { color: var(--lwm-text); }
.table th, .table td { border-top-color: var(--lwm-border); }
.table thead th { border-bottom: 1px solid var(--lwm-border); }
.dataTables_wrapper table.table-list, table.table-list {
    border: 1px solid var(--lwm-border) !important; border-radius: var(--lwm-radius) !important;
    border-collapse: separate !important; border-spacing: 0; overflow: hidden; background: #fff;
}
.dataTables_wrapper table.table-list thead th, table.table-list thead th {
    background: #f8fafc; color: var(--lwm-muted); font-size: 12px; font-weight: 600;
    text-transform: uppercase; letter-spacing: .04em; border-bottom: 1px solid var(--lwm-border) !important; padding: 12px 10px;
}
.dataTables_wrapper table.table-list thead th.sorting_asc,
.dataTables_wrapper table.table-list thead th.sorting_desc { background: var(--lwm-primary-50); color: var(--lwm-primary); }
table.table-list tbody td { padding: 14px 10px; font-size: 14px; border-top: 1px solid var(--lwm-border); }
.table-list > tbody > tr:hover > td { background: #f7f8fd; }
.dataTables_wrapper .dataTables_filter label .form-control { border-radius: var(--lwm-radius-sm); }
.dataTables_wrapper .dataTables_info { color: var(--lwm-muted); font-size: 13px; }
.dataTables_wrapper .dataTables_length select { border-radius: 8px; }

/* Pagination */
.page-link { color: var(--lwm-text); border-color: var(--lwm-border); }
.page-link:hover { color: var(--lwm-primary); background: var(--lwm-primary-50); border-color: var(--lwm-border); }
.page-item.active .page-link { background: var(--lwm-primary); border-color: var(--lwm-primary); }
.page-item:first-child .page-link { border-radius: 8px 0 0 8px; }
.page-item:last-child .page-link { border-radius: 0 8px 8px 0; }

/* ---------- Status labels as soft pills ---------- */
.label, .label.status {
    display: inline-block; border-radius: 999px; padding: .38em .85em; font-size: 12px; font-weight: 600;
    line-height: 1.2; letter-spacing: .01em; color: var(--lwm-muted); background: #f1f4f9;
}
.status-active, .status-open, .status-completed, .status-paid, .status-accepted, .label-success {
    background: var(--lwm-ok-50) !important; color: var(--lwm-ok) !important;
}
.status-pending, .status-pending-transfer, .status-pending-registration, .status-suspended,
.status-customer-reply, .status-refunded, .status-grace, .status-redemption, .status-payment-pending, .label-warning {
    background: var(--lwm-warn-50) !important; color: var(--lwm-warn) !important;
}
.status-unpaid, .status-inprogress, .status-collections, .label-danger {
    background: var(--lwm-danger-50) !important; color: var(--lwm-danger) !important;
}
.status-answered, .status-onhold, .status-delivered, .label-info {
    background: var(--lwm-primary-50) !important; color: var(--lwm-primary) !important;
}
.status-closed, .status-cancelled, .status-terminated, .status-expired, .status-transferred-away, .label-default {
    background: #f1f4f9 !important; color: var(--lwm-muted) !important;
}
.status-fraud, .status-lost, .status-dead { background: var(--lwm-text) !important; color: #fff !important; }

/* Badges */
.badge { border-radius: 999px; font-weight: 600; padding: .4em .7em; }
.badge-primary, .badge-info { background: var(--lwm-primary); }
.badge-success { background: var(--lwm-ok); }
.badge-warning { background: #f59e0b; color: #fff; }
.badge-danger { background: var(--lwm-danger); }

/* ---------- Tabs ---------- */
.nav-tabs { border-bottom: 1px solid var(--lwm-border); gap: 4px; }
.nav-tabs .nav-link {
    border: 0; border-bottom: 2px solid transparent; border-radius: 0; color: var(--lwm-muted);
    font-weight: 500; padding: 10px 14px;
}
.nav-tabs .nav-link:hover { color: var(--lwm-text); border-bottom-color: var(--lwm-border-strong); }
.nav-tabs .nav-link.active, .nav-tabs .nav-item.show .nav-link {
    color: var(--lwm-primary); background: transparent; border-bottom-color: var(--lwm-primary);
}
.nav-pills .nav-link { border-radius: var(--lwm-radius-sm); color: var(--lwm-text); }
.nav-pills .nav-link.active, .nav-pills .show > .nav-link { background: var(--lwm-primary); }

/* ---------- Product / service details ---------- */
div.product-details div.product-icon { background: var(--lwm-primary-50); color: var(--lwm-primary); border-radius: var(--lwm-radius); }
.product-status { border-radius: var(--lwm-radius-sm); overflow: hidden; }
.product-status-text { font-weight: 600; letter-spacing: .04em; font-size: 12px; }
.product-status-active { background: var(--lwm-ok); }
.product-status-pending { background: #f59e0b; }
.product-status-suspended { background: var(--lwm-danger); }
.product-status-terminated, .product-status-cancelled { background: var(--lwm-muted); }
div.product-details-tab-container { border-color: var(--lwm-border); border-radius: 0 0 var(--lwm-radius) var(--lwm-radius); }

/* ---------- Alerts, modals, misc ---------- */
.alert { border-radius: var(--lwm-radius-sm); border: 1px solid transparent; font-size: 14px; }
.alert-info, .alert-primary { background: var(--lwm-primary-50); border-color: #d5daf3; color: #030673; }
.alert-success { background: var(--lwm-ok-50); border-color: #c7ecdc; color: #0b6b4a; }
.alert-warning { background: var(--lwm-warn-50); border-color: #f6dfb4; color: #7a4705; }
.alert-danger { background: var(--lwm-danger-50); border-color: #f5cccc; color: #9b1c1c; }
.modal-content { border: 0; border-radius: 16px; box-shadow: 0 24px 60px rgba(15, 23, 42, .18); }
.modal-header, .modal-footer { border-color: var(--lwm-border); }
.list-group-item.active { background: var(--lwm-primary); border-color: var(--lwm-primary); }
.progress { border-radius: 999px; background: #eef1f6; }
.progress-bar { background: var(--lwm-primary); }
.ticket-reply { border-radius: var(--lwm-radius); }

/* ---------- Footer ---------- */
footer.footer { background: var(--lwm-text); color: rgba(255, 255, 255, .72); padding: 40px 0 36px; }
footer.footer .nav-link { color: rgba(255, 255, 255, .8); font-size: 14px; }
footer.footer .nav-link:hover { color: #fff; }
footer.footer .btn { background: rgba(255, 255, 255, .08); border-radius: 8px; }
footer.footer .copyright { color: rgba(255, 255, 255, .55); margin: 20px 0 0; }

@media (max-width: 575.98px) {
    body.primary-bg-color { font-size: 14px; }
    /* Recherche de domaine de l'accueil : le p-5 de Twenty-One coupait « Rechercher » / « Transférer » à 320 px. */
    .home-domain-search .p-5 { padding: 1.5rem 0 !important; }
    .home-domain-search .btn { padding-left: 10px; padding-right: 10px; }
    #main-body { padding-top: 14px; }
    .card-body { padding: 1rem; }
    header.header .navbar-light { padding-top: 10px; padding-bottom: 10px; }
}

/* =====================================================================
   APP SHELL v2 (lwx) — sidebar + top bar + list pages · LWB Theme
   ===================================================================== */
:root {
    --lwx-side-w: 248px;
    --lwx-side-bg: var(--lwm-primary);
    --lwx-accent: #ff6a3d;
    --lwx-line: #e4e8ef;
    --lwx-soft: #f2f4f7;
    --lwx-shadow: 0 1px 2px rgba(16, 24, 40, .03), 0 8px 24px rgba(16, 24, 40, .035);
}
body.lwx { background: var(--lwm-bg); font-size: 14px; }
body.lwx .lwx-shell { min-height: 100vh; }

/* ---------- Sidebar ---------- */
body.lwx .lwx-side {
    position: fixed; top: 0; bottom: 0; left: 0; width: var(--lwx-side-w); z-index: 1040;
    background: var(--lwx-side-bg); color: rgba(255, 255, 255, .72);
    display: flex; flex-direction: column; padding: 20px 0 16px;
}
body.lwx .lwx-brand { display: flex; align-items: center; padding: 4px 22px 18px; text-decoration: none !important; }
body.lwx .lwx-brand img { max-height: 36px; max-width: 170px; display: block; filter: brightness(0) invert(1); }
body.lwx .lwx-brand span { color: #fff; font-weight: 800; font-size: 17px; }
body.lwx .lwx-nav { flex: 1; overflow-y: auto; overflow-x: hidden; padding: 4px 0 4px 14px; scrollbar-width: none; }
body.lwx .lwx-nav::-webkit-scrollbar { display: none; }
body.lwx .lwx-link {
    position: relative; display: flex; align-items: center; gap: 12px; margin: 2px 12px 2px 0; padding: 10px 12px;
    border-radius: 8px; color: rgba(255, 255, 255, .72) !important; font-size: 13.5px; font-weight: 600;
    text-decoration: none !important; transition: background .15s ease, color .15s ease;
}
body.lwx .lwx-link i { width: 18px; text-align: center; font-size: 15px; opacity: .9; }
body.lwx .lwx-link:hover { background: rgba(255, 255, 255, .08); color: #fff !important; }
body.lwx .lwx-link.active {
    margin-right: 0; padding: 12px 24px 12px 14px; border-radius: 10px 0 0 10px;
    background: var(--lwm-bg); color: var(--lwm-text) !important; box-shadow: inset 4px 0 0 var(--lwx-accent);
}
body.lwx .lwx-link.active i { color: var(--lwm-primary); opacity: 1; }
body.lwx .lwx-link.active::before, body.lwx .lwx-link.active::after {
    content: ""; position: absolute; right: 0; width: 16px; height: 16px; pointer-events: none; background: transparent;
}
body.lwx .lwx-link.active::before { top: -16px; border-bottom-right-radius: 16px; box-shadow: 6px 6px 0 6px var(--lwm-bg); }
body.lwx .lwx-link.active::after { bottom: -16px; border-top-right-radius: 16px; box-shadow: 6px -6px 0 6px var(--lwm-bg); }
body.lwx .lwx-count {
    margin-left: auto; font-style: normal; background: var(--lwx-accent); color: #fff;
    font-size: 11px; font-weight: 800; border-radius: 999px; padding: 1px 7px; line-height: 1.5;
}
body.lwx .lwx-label {
    margin: 18px 0 6px; padding: 0 12px; color: rgba(255, 255, 255, .45);
    font-size: 10px; font-weight: 800; letter-spacing: .12em; text-transform: uppercase;
}
body.lwx .lwx-side-foot { flex: none; margin: 12px 14px 0; padding-top: 12px; border-top: 1px solid rgba(255, 255, 255, .1); }
body.lwx .lwx-side-foot .lwx-link { margin-right: 0; }
body.lwx .lwx-help {
    display: flex; align-items: center; gap: 12px; padding: 12px; margin-bottom: 6px; border-radius: 10px;
    background: rgba(255, 255, 255, .08); color: #fff !important; text-decoration: none !important;
}
body.lwx .lwx-help:hover { background: rgba(255, 255, 255, .14); }
body.lwx .lwx-help i { font-size: 22px; color: #25d366; }
body.lwx .lwx-help span { font-size: 12px; color: rgba(255, 255, 255, .72); line-height: 1.35; }
body.lwx .lwx-help b { display: block; color: #fff; font-size: 13px; }

/* ---------- Main column & top bar ---------- */
body.lwx .lwx-main { margin-left: var(--lwx-side-w); min-height: 100vh; display: flex; flex-direction: column; min-width: 0; }
body.lwx .lwx-top {
    display: flex; align-items: center; gap: 16px; padding: 22px 34px 6px;
    max-width: calc(1280px + 68px); width: 100%; margin: 0 auto;
}
body.lwx .lwx-top-title { min-width: 0; }
body.lwx .lwx-top h1 { font-size: 24px; font-weight: 700; margin: 2px 0 0; color: var(--lwm-text); line-height: 1.3; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
body.lwx .lwx-eyebrow { display: block; color: var(--lwm-primary); opacity: .75; font-size: 10px; font-weight: 800; letter-spacing: .14em; text-transform: uppercase; }
body.lwx .lwx-top-actions { margin-left: auto; display: flex; align-items: center; gap: 10px; }
body.lwx .lwx-icon {
    position: relative; width: 40px; height: 40px; flex: none; display: inline-flex; align-items: center; justify-content: center;
    border-radius: 10px; border: 1px solid var(--lwx-line); background: #fff; color: var(--lwm-text) !important;
    font-size: 15px; text-decoration: none !important; cursor: pointer; padding: 0;
}
body.lwx .lwx-icon:hover, body.lwx .lwx-icon:focus { border-color: var(--lwm-primary); color: var(--lwm-primary) !important; outline: 0; }
body.lwx .lwx-dot {
    position: absolute; top: -6px; right: -6px; min-width: 18px; height: 18px; padding: 0 5px; border-radius: 999px;
    background: var(--lwx-accent); color: #fff; font-size: 11px; font-weight: 800; font-style: normal;
    display: flex; align-items: center; justify-content: center; border: 2px solid var(--lwm-bg); box-sizing: content-box;
}
body.lwx .lwx-account {
    display: flex; align-items: center; gap: 10px; padding: 6px 10px 6px 6px; border: 0; border-radius: 10px;
    background: transparent; color: var(--lwm-text); cursor: pointer; text-align: left;
}
body.lwx .lwx-account:hover, body.lwx .lwx-account:focus, body.lwx .lwx-account[aria-expanded=true] { background: #fff; outline: 0; box-shadow: var(--lwx-shadow); }
body.lwx .lwx-avatar {
    width: 34px; height: 34px; border-radius: 50%; flex: none; background: var(--lwm-primary-50); color: var(--lwm-primary);
    display: flex; align-items: center; justify-content: center; font-weight: 800; font-size: 14px;
}
body.lwx .lwx-account-text { display: flex; flex-direction: column; line-height: 1.25; max-width: 190px; }
body.lwx .lwx-account-text b { font-size: 13px; font-weight: 700; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
body.lwx .lwx-account-text small { font-size: 11px; color: var(--lwm-muted); }
body.lwx .lwx-account .fa-chevron-down { font-size: 10px; color: var(--lwm-muted); }
body.lwx .lwx-menu { min-width: 240px; margin-top: 8px !important; border: 1px solid var(--lwx-line); border-radius: 10px; box-shadow: 0 12px 32px rgba(16, 24, 40, .12); padding: 6px; }
body.lwx .lwx-menu .dropdown-item { border-radius: 6px; padding: 8px 10px; font-size: 13.5px; color: var(--lwm-text); }
body.lwx .lwx-menu .dropdown-item i { color: var(--lwm-muted); margin-right: 6px; }
body.lwx .lwx-menu .dropdown-item:hover { background: var(--lwm-primary-50); color: var(--lwm-primary); }

body.lwx .lwx-container { width: 100%; max-width: calc(1280px + 68px); margin: 0 auto; padding: 0 34px; }
body.lwx .lwx-crumb { width: 100%; max-width: calc(1280px + 68px); margin: 0 auto; padding: 0 34px; background: transparent; }
body.lwx .lwx-crumb .breadcrumb { padding: 6px 0 0 !important; margin: 0; }
body.lwx .lwx-main #main-body { flex: 1; padding-top: 18px; padding-bottom: 52px; }

/* ---------- Mobile bar ---------- */
body.lwx .lwx-mbar { display: none; background: var(--lwx-side-bg); padding-top: 12px; position: sticky; top: 0; z-index: 1030; }
body.lwx .lwx-mbar-top { display: flex; align-items: center; gap: 8px; padding: 0 16px 10px; }
body.lwx .lwx-mbar-top .lwx-brand { padding: 0; margin-right: auto; }
body.lwx .lwx-mbar-top .lwx-brand img { max-height: 30px; }
body.lwx .lwx-mbar-icon { position: relative; width: 38px; height: 38px; display: inline-flex; align-items: center; justify-content: center; color: #fff !important; font-size: 16px; border-radius: 10px; text-decoration: none !important; }
body.lwx .lwx-mbar-icon:hover { background: rgba(255, 255, 255, .1); }
body.lwx .lwx-mbar-icon em { position: absolute; top: 2px; right: 0; font-style: normal; background: var(--lwx-accent); color: #fff; font-size: 10px; font-weight: 800; border-radius: 999px; padding: 0 5px; }
body.lwx .lwx-mtabs { display: flex; gap: 4px; overflow-x: auto; padding: 0 12px; scrollbar-width: none; -webkit-overflow-scrolling: touch; }
body.lwx .lwx-mtabs::-webkit-scrollbar { display: none; }
body.lwx .lwx-mtabs a {
    flex: none; display: inline-flex; align-items: center; gap: 8px; padding: 11px 14px; border-radius: 10px 10px 0 0;
    color: rgba(255, 255, 255, .78) !important; font-weight: 600; font-size: 13px; white-space: nowrap; text-decoration: none !important;
}
body.lwx .lwx-mtabs a.active { background: var(--lwm-bg); color: var(--lwm-text) !important; }
body.lwx .lwx-mtabs a.active i { color: var(--lwm-primary); }

/* ---------- Building blocks ---------- */
body.lwx .lwx-card { background: #fff; border: 1px solid var(--lwx-line); border-radius: 10px; box-shadow: var(--lwx-shadow); padding: 22px; }
body.lwx .lwx-btn {
    display: inline-flex; align-items: center; justify-content: center; gap: 8px; height: 40px; padding: 0 16px;
    border-radius: 8px; border: 1px solid transparent; font-size: 14px; font-weight: 700; line-height: 1;
    text-decoration: none !important; white-space: nowrap; cursor: pointer; transition: background .15s ease, border-color .15s ease;
}
body.lwx .lwx-btn-primary { background: var(--lwm-primary); color: #fff !important; }
body.lwx .lwx-btn-primary:hover { background: var(--lwm-primary-600); }
body.lwx .lwx-btn-dark { background: var(--lwm-primary-600); color: #fff !important; }
body.lwx .lwx-btn-dark:hover { background: var(--lwm-primary); }
body.lwx .lwx-btn-ghost { background: var(--lwx-soft); border-color: #e4e7ec; color: #344054 !important; }
body.lwx .lwx-btn-ghost:hover { background: #fff; border-color: var(--lwm-primary); color: var(--lwm-primary) !important; }
body.lwx .lwx-btn-danger-ghost { background: #fff; border-color: #f3c9c9; color: var(--lwm-danger) !important; }
body.lwx .lwx-btn-danger-ghost:hover { background: var(--lwm-danger-50); }
body.lwx .lwx-btn-sm { height: 34px; padding: 0 12px; font-size: 13px; }
body.lwx .lwx-btn-xs { height: 28px; padding: 0 12px; font-size: 12px; }
body.lwx .lwx-btn-block { width: 100%; }
body.lwx .lwx-btn .fa-arrow-right { font-size: 11px; }
body.lwx .lwx-iconbtn {
    width: 34px; height: 34px; display: inline-flex; align-items: center; justify-content: center; border-radius: 8px;
    border: 1px solid #e4e7ec; background: #fff; color: var(--lwm-muted) !important; text-decoration: none !important;
}
body.lwx .lwx-iconbtn:hover { border-color: var(--lwm-primary); color: var(--lwm-primary) !important; }
body.lwx .lwx-link-strong { font-weight: 700; font-size: 14px; color: var(--lwm-primary); white-space: nowrap; }

body.lwx .lwx-ico {
    width: 40px; height: 40px; flex: none; display: inline-flex; align-items: center; justify-content: center;
    border-radius: 10px; background: var(--lwm-primary-50); color: var(--lwm-primary); font-size: 16px;
}

body.lwx .lwx-badge {
    display: inline-block; font-style: normal; border-radius: 999px; padding: 4px 10px; font-size: 11px; font-weight: 800;
    line-height: 1.35; white-space: nowrap; background: var(--lwx-soft); color: #475467;
}
body.lwx .lwx-badge-active, body.lwx .lwx-badge-paid, body.lwx .lwx-badge-open, body.lwx .lwx-badge-completed, body.lwx .lwx-badge-accepted { background: #ecfdf3; color: #067647; }
body.lwx .lwx-badge-pending, body.lwx .lwx-badge-pending-transfer, body.lwx .lwx-badge-pending-registration, body.lwx .lwx-badge-payment-pending,
body.lwx .lwx-badge-customer-reply, body.lwx .lwx-badge-grace, body.lwx .lwx-badge-refunded, body.lwx .lwx-badge-onhold, body.lwx .lwx-badge-inprogress { background: #fff6e5; color: #b54708; }
body.lwx .lwx-badge-suspended, body.lwx .lwx-badge-unpaid, body.lwx .lwx-badge-collections, body.lwx .lwx-badge-redemption, body.lwx .lwx-badge-fraud { background: #fef3f2; color: #b42318; }
body.lwx .lwx-badge-answered, body.lwx .lwx-badge-info { background: var(--lwm-primary-50); color: var(--lwm-primary); }
body.lwx .lwx-badge-custom { background: color-mix(in srgb, var(--c) 14%, #fff); color: var(--c); }

/* Page header, search, tabs */
body.lwx .lwx-page > * + * { margin-top: 20px; }
body.lwx .lwx-pagehead { display: flex; align-items: flex-end; justify-content: space-between; gap: 16px; flex-wrap: wrap; }
body.lwx .lwx-pagehead h2, body.lwx .lwx-welcome h2 { font-size: 24px; font-weight: 800; margin: 4px 0 4px; color: var(--lwm-text); letter-spacing: -.01em; }
body.lwx .lwx-pagehead p, body.lwx .lwx-welcome p { margin: 0; color: var(--lwm-muted); font-size: 14px; }
body.lwx .lwx-search {
    display: flex; align-items: center; gap: 12px; height: 54px; padding: 0 8px 0 18px; margin-bottom: 0;
    background: #fff; border: 1px solid var(--lwx-line); border-radius: 10px; box-shadow: var(--lwx-shadow); color: var(--lwm-muted);
}
body.lwx .lwx-search:focus-within { border-color: var(--lwm-primary); box-shadow: 0 0 0 3px rgba(3, 6, 115, .1); }
body.lwx .lwx-search input { flex: 1; min-width: 0; border: 0; outline: 0; background: transparent; font-size: 14px; color: var(--lwm-text); }
body.lwx .lwx-search input::-webkit-search-cancel-button { cursor: pointer; }
body.lwx .lwx-tabs { display: inline-flex; flex-wrap: wrap; gap: 4px; padding: 4px; background: #eaedf3; border-radius: 10px; }
body.lwx .lwx-tabs button {
    border: 0; background: transparent; border-radius: 8px; padding: 8px 14px; font-size: 13px; font-weight: 600;
    color: var(--lwm-muted); cursor: pointer;
}
body.lwx .lwx-tabs button:hover { color: var(--lwm-text); }
body.lwx .lwx-tabs button.active { background: #fff; color: var(--lwm-text); box-shadow: 0 1px 3px rgba(16, 24, 40, .1); }
body.lwx .lwx-page > .lwx-meta, body.lwx .lwx-meta { margin: 10px 0 0 2px; color: var(--lwm-muted); font-size: 12px; }
body.lwx .lwx-page > .lwx-tabs + .lwx-meta { margin-top: 10px; }
body.lwx .lwx-page > .lwx-meta + .lwx-list { margin-top: 10px; }

/* Welcome & notice */
body.lwx .lwx-welcome { display: flex; align-items: center; justify-content: space-between; gap: 20px; padding: 28px; }
body.lwx .lwx-actions { display: flex; gap: 10px; flex-wrap: wrap; flex: none; }
body.lwx .lwx-notice { display: inline-flex !important; align-items: center; gap: 8px; margin-top: 12px !important; padding: 6px 12px; border-radius: 999px; font-size: 13px !important; font-weight: 600; }
body.lwx .lwx-notice i { font-size: 7px; }
body.lwx .lwx-notice-warning { background: #fff6e5; color: #b54708 !important; }
body.lwx .lwx-notice-danger { background: #fef3f2; color: #b42318 !important; }

/* Stats */
body.lwx .lwx-stats { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; }
body.lwx .lwx-stats-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
body.lwx .lwx-stat {
    display: flex; align-items: center; gap: 14px; padding: 18px; background: #fff; border: 1px solid var(--lwx-line);
    border-radius: 10px; box-shadow: var(--lwx-shadow); color: var(--lwm-text) !important; text-decoration: none !important; min-width: 0;
}
body.lwx a.lwx-stat:hover { border-color: #c9cee0; }
body.lwx .lwx-stat > div { min-width: 0; }
body.lwx .lwx-stat b { display: block; font-size: 21px; font-weight: 700; line-height: 1.15; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
body.lwx .lwx-stat span:not(.lwx-ico) { display: block; font-size: 12.5px; color: var(--lwm-muted); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
body.lwx .lwx-stat.is-alert .lwx-ico { background: #fef3f2; color: #b42318; }
body.lwx .lwx-stat-actions { flex-direction: column; align-items: stretch; justify-content: center; gap: 8px; padding: 14px; }

/* Cards with rows (dashboard) */
body.lwx .lwx-grid2 { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px; }
body.lwx .lwx-card-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 6px; }
body.lwx .lwx-card-head h3 { font-size: 16px; font-weight: 700; margin: 0; color: var(--lwm-text); }
body.lwx .lwx-card-head a { font-size: 14px; font-weight: 700; color: var(--lwm-primary); }
body.lwx .lwx-rowlink {
    display: flex; align-items: center; justify-content: space-between; gap: 14px; padding: 14px 2px;
    border-top: 1px solid #eef1f6; color: var(--lwm-text) !important; text-decoration: none !important;
}
body.lwx .lwx-card-head + .lwx-rowlink { border-top: 0; }
body.lwx a.lwx-rowlink:hover b, body.lwx .lwx-rowmain:hover b { color: var(--lwm-primary); }
body.lwx .lwx-rowlink > div:first-child, body.lwx .lwx-rowmain { min-width: 0; color: inherit !important; text-decoration: none !important; }
body.lwx .lwx-rowlink b, body.lwx .lwx-rowmain b { display: block; font-size: 14px; font-weight: 700; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
body.lwx .lwx-rowlink small, body.lwx .lwx-rowmain small { display: block; font-size: 12px; color: var(--lwm-muted); margin-top: 2px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
body.lwx .lwx-rowside { display: flex; align-items: center; gap: 10px; flex: none; }
body.lwx .lwx-rowside strong { font-size: 14px; font-weight: 700; }
body.lwx .lwx-empty { text-align: center; padding: 26px 12px; color: var(--lwm-muted); }
body.lwx .lwx-empty p { margin: 0 0 12px; }
body.lwx .lwx-contact { display: flex; gap: 10px; margin-top: 14px; }
body.lwx .lwx-contact a {
    flex: 1; display: inline-flex; align-items: center; justify-content: center; gap: 8px; padding: 10px; border-radius: 8px;
    background: var(--lwx-soft); color: var(--lwm-text) !important; font-size: 13px; font-weight: 600; text-decoration: none !important;
}
body.lwx .lwx-contact a:hover { background: var(--lwm-primary-50); color: var(--lwm-primary) !important; }
body.lwx .lwx-contact .fa-whatsapp { color: #25d366; font-size: 15px; }

/* List pages */
body.lwx .lwx-list { display: flex; flex-direction: column; gap: 12px; }
body.lwx .lwx-item {
    display: flex; align-items: center; gap: 18px; padding: 16px 18px; background: #fff; border: 1px solid var(--lwx-line);
    border-radius: 10px; box-shadow: var(--lwx-shadow); color: var(--lwm-text) !important; text-decoration: none !important;
}
body.lwx a.lwx-item:hover, body.lwx .lwx-item:hover { border-color: #c9cee0; }
body.lwx .lwx-item-main { flex: 1; min-width: 0; }
body.lwx .lwx-item-main a { color: var(--lwm-text) !important; text-decoration: none !important; }
body.lwx .lwx-item-main a:hover b { color: var(--lwm-primary); }
body.lwx .lwx-item-main b { display: block; font-size: 14.5px; font-weight: 700; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
body.lwx .lwx-item-main small { display: block; margin-top: 3px; font-size: 12px; color: var(--lwm-muted); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
body.lwx .lwx-item-col { width: 140px; flex: none; min-width: 0; }
body.lwx .lwx-item-col > span { display: block; font-size: 10px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; color: var(--lwm-muted); margin-bottom: 3px; }
body.lwx .lwx-item-col b { display: block; font-size: 13.5px; font-weight: 700; }
body.lwx .lwx-item-col small { display: block; font-size: 12px; color: var(--lwm-muted); }
body.lwx .lwx-item-actions { display: flex; align-items: center; gap: 8px; flex: none; justify-content: flex-end; min-width: 104px; }
body.lwx .lwx-item-amount { display: flex; align-items: center; gap: 12px; flex: none; }
body.lwx .lwx-item-amount b { font-size: 15px; font-weight: 700; }
body.lwx .lwx-item-ticket.is-unread .lwx-item-main b::after { content: ""; display: inline-block; width: 8px; height: 8px; border-radius: 50%; background: var(--lwx-accent); margin-left: 8px; vertical-align: 2px; }
body.lwx .lwx-chev { color: #98a2b3; font-size: 13px; }
body.lwx .lwx-soon { display: block; margin-top: 4px; font-size: 11px; color: #b54708; font-weight: 600; }
body.lwx .lwx-check { width: 18px; height: 18px; flex: none; accent-color: var(--lwm-primary); cursor: pointer; }
body.lwx .lwx-bulk { display: flex; align-items: center; justify-content: space-between; gap: 10px; flex-wrap: wrap; margin: 10px 0; }
body.lwx .lwx-bulk .lwx-meta { margin: 0; }
body.lwx .lwx-bulk .btn { border-radius: 8px; font-weight: 600; }

/* Footer */
body.lwx .lwx-footer { border-top: 1px solid var(--lwx-line); padding: 18px 0; color: var(--lwm-muted); font-size: 13px; }
body.lwx .lwx-footer-inner { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 10px; }
body.lwx .lwx-footer p { margin: 0; }
body.lwx .lwx-footer ul { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; align-items: center; gap: 18px; }
body.lwx .lwx-footer a { color: var(--lwm-muted); }
body.lwx .lwx-footer a:hover { color: var(--lwm-primary); }
body.lwx .lwx-locale { display: inline-flex; align-items: center; gap: 6px; border: 1px solid var(--lwx-line); background: #fff; border-radius: 8px; padding: 5px 10px; color: var(--lwm-muted); font-size: 13px; cursor: pointer; }

/* Generic pages inside the new shell */
body.lwx .primary-content > .card, body.lwx .sidebar .card { border-color: var(--lwx-line); border-radius: 10px; box-shadow: var(--lwx-shadow); }
body.lwx .header-lined { display: none; }
body.lwx .popover { border: 1px solid var(--lwx-line); border-radius: 10px; box-shadow: 0 12px 32px rgba(16, 24, 40, .12); }

/* ---------- Responsive ---------- */
@media (max-width: 1199.98px) {
    body.lwx .lwx-item-col { width: 118px; }
    body.lwx .lwx-stats { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    body.lwx .lwx-stats-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 991.98px) {
    body.lwx .lwx-side { display: none; }
    body.lwx .lwx-main { margin-left: 0; }
    body.lwx .lwx-mbar { display: block; }
    body.lwx .lwx-top { padding: 16px 16px 2px; }
    body.lwx .lwx-top-actions { display: none; }
    body.lwx .lwx-top h1 { font-size: 21px; }
    body.lwx .lwx-container, body.lwx .lwx-crumb { padding: 0 16px; }
    body.lwx .lwx-grid2 { grid-template-columns: minmax(0, 1fr); }
    body.lwx .lwx-item { flex-wrap: wrap; gap: 12px 16px; }
    body.lwx .lwx-item-main { flex-basis: calc(100% - 60px); }
    body.lwx .lwx-item-col { width: auto; flex: 1 1 30%; }
    body.lwx .lwx-item-actions { margin-left: auto; }
    body.lwx .lwx-item-amount { margin-left: 56px; }
}
@media (max-width: 575.98px) {
    body.lwx .lwx-welcome { flex-direction: column; align-items: stretch; padding: 22px; }
    body.lwx .lwx-actions { display: grid; grid-template-columns: 1fr 1fr; }
    body.lwx .lwx-stats, body.lwx .lwx-stats-3 { grid-template-columns: 1fr 1fr; gap: 12px; }
    body.lwx .lwx-stat { flex-direction: column; align-items: flex-start; gap: 10px; padding: 16px; }
    body.lwx .lwx-stat > div { width: 100%; }
    body.lwx .lwx-stat-actions { grid-column: 1 / -1; }
    body.lwx .lwx-card { padding: 18px; }
    body.lwx .lwx-search { height: 48px; }
    body.lwx .lwx-search .lwx-btn { display: none; }
    body.lwx .lwx-tabs { display: flex; flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none; }
    body.lwx .lwx-tabs button { flex: none; }
    body.lwx .lwx-item-col:not(.lwx-keep) { display: none; }
    body.lwx .lwx-item-col.lwx-keep { flex: 1 1 auto; margin-left: 56px; }
    body.lwx .lwx-item-col.lwx-keep > span { display: none; }
    body.lwx .lwx-item-actions { flex-basis: 100%; }
    body.lwx .lwx-item-actions .lwx-btn { flex: 1; }
    body.lwx .lwx-item-amount { margin-left: 56px; }
    body.lwx .lwx-pagehead .lwx-btn { width: 100%; }
}

/* =====================================================================
   INVOICE PAGE (viewinvoice.tpl)
   ===================================================================== */
body.lwi-body {
    background: var(--lwm-bg); color: var(--lwm-text); margin: 0;
    font-family: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif; font-size: 15px;
    -webkit-font-smoothing: antialiased;
}
.lwi { max-width: 880px; margin: 0 auto; padding: 24px 16px 56px; }
.lwi-top { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 16px; }
.lwi a, .lwi a:hover { text-decoration: none; }
.lwi address { font-style: normal; }
.lwi-method .custom-select {
    height: 42px; padding: 0 36px 0 12px; border: 1px solid var(--lwm-border-strong); border-radius: var(--lwm-radius-sm);
    font-size: 14px; color: var(--lwm-text); width: 100%;
}
.lwi-back { color: var(--lwm-muted) !important; font-weight: 500; font-size: 14px; }
.lwi-back:hover { color: var(--lwm-primary) !important; text-decoration: none; }
.lwi-tools { display: flex; gap: 8px; }
.lwi-tool {
    display: inline-flex; align-items: center; gap: 8px; height: 38px; padding: 0 14px;
    background: #fff; border: 1px solid var(--lwm-border-strong); border-radius: var(--lwm-radius-sm);
    color: var(--lwm-text) !important; font-size: 13px; font-weight: 600;
}
.lwi-tool:hover { border-color: var(--lwm-primary); color: var(--lwm-primary) !important; text-decoration: none; }
.lwi-sheet {
    background: #fff; border: 1px solid var(--lwm-border); border-radius: 18px; padding: 32px;
}
.lwi-head { display: grid; grid-template-columns: 1fr auto; gap: 18px 24px; align-items: start; padding-bottom: 24px; border-bottom: 1px solid var(--lwm-border); margin-bottom: 24px; }
.lwi-brand img { max-height: 52px; max-width: 240px; }
.lwi-brand strong { font-size: 20px; }
.lwi-title { grid-column: 1; display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
.lwi-title h1 { font-size: 24px; font-weight: 700; margin: 0; color: var(--lwm-text); }
.lwi-dates { grid-column: 2; grid-row: 1 / span 2; margin: 0; display: flex; flex-direction: column; gap: 10px; text-align: right; }
.lwi-dates dt { font-size: 12px; font-weight: 500; color: var(--lwm-muted); text-transform: uppercase; letter-spacing: .04em; }
.lwi-dates dd { margin: 0; font-weight: 600; }
.lwi-status { display: inline-flex; align-items: center; height: 28px; padding: 0 12px; border-radius: 999px; font-size: 13px; font-weight: 700; }
.lwi-s-ok { background: var(--lwm-ok-50); color: var(--lwm-ok); }
.lwi-s-danger { background: var(--lwm-danger-50); color: var(--lwm-danger); }
.lwi-s-warn { background: var(--lwm-warn-50); color: var(--lwm-warn); }
.lwi-s-info { background: var(--lwm-primary-50); color: var(--lwm-primary); }
.lwi-s-neutral { background: #f1f4f9; color: var(--lwm-muted); }
.lwi-label { display: block; font-size: 12px; font-weight: 600; color: var(--lwm-muted); text-transform: uppercase; letter-spacing: .04em; margin-bottom: 6px; }
.lwi-muted { color: var(--lwm-muted); font-size: 13px; }
.lwi-center { text-align: center; }

.lwi-pay {
    display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.25fr); gap: 24px; align-items: start;
    background: var(--lwm-primary-50); border: 1px solid #d5daf3; border-radius: var(--lwm-radius); padding: 22px; margin-bottom: 24px;
}
.lwi-pay-summary { display: flex; flex-direction: column; gap: 4px; }
.lwi-balance { font-size: 32px; font-weight: 700; color: var(--lwm-text); line-height: 1.15; font-variant-numeric: tabular-nums; }
.lwi-method { margin-top: 16px; }
.lwi-method .custom-select { max-width: 280px; background-color: #fff; }
.lwi-pay-action { min-width: 0; }
.lwi-pay-action .fpw { margin: 0; max-width: none; }
.lwi-pay-action form { margin: 0; }
.lwi-pay-action .btn, .lwi-pay-action input[type=submit], .lwi-pay-action button {
    min-height: 44px; border-radius: var(--lwm-radius-sm); font-weight: 600;
}

.lwi-box { border: 1px solid var(--lwm-border); border-radius: var(--lwm-radius); padding: 20px 22px; margin-bottom: 24px; }
.lwi-box h2 { font-size: 15px; font-weight: 600; margin: 0 0 12px; }
.lwi-credit-input { max-width: 360px; }

.lwi-parties { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 20px; margin-bottom: 24px; }
.lwi-parties address { margin: 0; font-size: 14px; line-height: 1.6; color: var(--lwm-text); }

.lwi-table { width: 100%; border-collapse: collapse; }
.lwi-table th {
    text-align: left; font-size: 12px; font-weight: 600; color: var(--lwm-muted); text-transform: uppercase;
    letter-spacing: .04em; padding: 0 0 10px; border-bottom: 1px solid var(--lwm-border);
}
.lwi-table td { padding: 14px 0; border-bottom: 1px solid var(--lwm-border); vertical-align: top; font-size: 14px; }
.lwi-table th + th, .lwi-table td + td { padding-left: 16px; }
.lwi-table-sm td { padding: 10px 0; }
.lwi-num { text-align: right !important; white-space: nowrap; font-variant-numeric: tabular-nums; }
.lwi-mono { font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; font-size: 13px; word-break: break-all; }
.lwi-totals { margin: 16px 0 0 auto; max-width: 340px; }
.lwi-totals div { display: flex; justify-content: space-between; gap: 16px; padding: 6px 0; font-size: 14px; }
.lwi-totals dt { font-weight: 500; color: var(--lwm-muted); }
.lwi-totals dd { margin: 0; font-variant-numeric: tabular-nums; }
.lwi-totals .lwi-grand { border-top: 1px solid var(--lwm-border); margin-top: 6px; padding-top: 12px; font-size: 17px; }
.lwi-totals .lwi-grand dt, .lwi-totals .lwi-grand dd { color: var(--lwm-text); font-weight: 700; }
.lwi-note { margin: 12px 0 0; }
.lwi-balance-row { display: flex; justify-content: flex-end; gap: 16px; padding-top: 12px; font-size: 15px; }
.lwi .card { border-radius: var(--lwm-radius); margin-bottom: 24px; }

@media (max-width: 767.98px) {
    .lwi-sheet { padding: 20px 16px; border-radius: 14px; }
    .lwi-head { grid-template-columns: 1fr; }
    .lwi-dates { grid-column: 1; grid-row: auto; flex-direction: row; gap: 24px; text-align: left; }
    .lwi-pay { grid-template-columns: 1fr; padding: 12px; margin-left: -4px; margin-right: -4px; }
    .lwi-pay .fpw { padding: 14px; }
    .lwi-pay .fpw-tab { padding: 10px 4px; font-size: 13px; }
    .lwi-balance { font-size: 28px; }
    .lwi-tool span { display: none; }
}
@media print {
    body.lwi-body { background: #fff; }
    .lwi { max-width: none; padding: 0; }
    .lwi-sheet { border: 0; padding: 0; }
    .lwi-box { break-inside: avoid; }
}

/* ---------- Responsive ---------- */
@media (max-width: 991.98px) {
    .lwm-grid { grid-template-columns: 1fr; }
    .lwm-kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 575.98px) {
    .lwm { font-size: 14px; }
    .lwm-hero h1 { font-size: 23px; }
    .lwm-hero-actions { width: 100%; }
    .lwm-hero-actions .lwm-btn { flex: 1; }
    .lwm-kpis { gap: 10px; margin-bottom: 18px; }
    .lwm-kpi { padding: 14px; }
    .lwm-kpi-value { font-size: 21px; }
    .lwm-card { padding: 16px; margin-bottom: 18px; border-radius: 12px; }
    .lwm-grid { gap: 18px; }
    .lwm-due .lwm-row { flex-wrap: wrap; }
    .lwm-due .lwm-row-side { width: 100%; justify-content: space-between; }
    .lwm-row-title { white-space: normal; }
}
@media (prefers-reduced-motion: reduce) {
    .lwm * { transition: none !important; }
}


/* Base de connaissances : contact WhatsApp (classes optionnelles lwm-wa-btn / lwm-wa-link) */
.lwm-wa-box{border-radius:12px}
.lwm-wa-btn{display:inline-block;border-radius:999px;transition:filter .2s}
.lwm-wa-btn:hover,.lwm-wa-btn:focus{filter:brightness(.92);color:#fff!important;text-decoration:none!important}
.lwm-wa-btn .fa-whatsapp{font-size:1.25em;vertical-align:-2px;margin-right:.35em}
.lwm-wa-link .fa-whatsapp{margin-right:.2em}

/* Base de connaissances : encadrés d'appel à l'action et image d'en-tête */
.lwm-cta{border-radius:12px}
.lwm-cta-btn{display:inline-block;border-radius:999px;transition:filter .2s}
.lwm-cta-btn:hover,.lwm-cta-btn:focus{filter:brightness(.92);color:#fff!important;text-decoration:none!important}
.lwm-kb-hero img{border-radius:12px;max-height:420px;object-fit:cover}

/* =====================================================================
   ALL PAGES (lwx) — native WHMCS components in the new design · LWB Theme
   ===================================================================== */

/* ---------- Detail hero (service / domain) ---------- */
body.lwx .lwx-hero { display: flex; flex-wrap: wrap; align-items: center; gap: 16px 18px; margin-bottom: 20px; }
body.lwx .lwx-back { flex: none; }
body.lwx .lwx-ico-lg { width: 52px; height: 52px; font-size: 21px; border-radius: 12px; }
body.lwx .lwx-hero-main { flex: 1; min-width: 0; }
body.lwx .lwx-hero-main h2 { font-size: 22px; font-weight: 800; margin: 3px 0 2px; color: var(--lwm-text); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
body.lwx .lwx-hero-main a { font-size: 13px; font-weight: 600; color: var(--lwm-primary); }
body.lwx .lwx-hero-main a i { font-size: 10px; margin-left: 2px; }
body.lwx .lwx-hero > .lwx-badge { font-size: 12px; padding: 6px 12px; }
body.lwx .lwx-hero-meta { flex-basis: 100%; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; margin: 6px 0 0; padding-top: 16px; border-top: 1px solid #eef1f6; }
body.lwx .lwx-hero-meta dt { font-size: 10px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; color: var(--lwm-muted); margin-bottom: 3px; }
body.lwx .lwx-hero-meta dd { margin: 0; font-size: 14px; font-weight: 700; color: var(--lwm-text); }
body.lwx .lwx-hero-meta small { color: var(--lwm-muted); font-weight: 500; }

/* ---------- Page menus (sidebar.tpl) ---------- */
body.lwx .lwx-aside .sidebar { position: sticky; top: 18px; }
body.lwx .lwx-panel {
    background: #fff; border: 1px solid var(--lwx-line); border-radius: 10px; box-shadow: var(--lwx-shadow);
    margin-bottom: 16px; overflow: hidden;
}
body.lwx .lwx-panel-head {
    display: flex; align-items: center; gap: 10px; padding: 14px 18px 8px;
    font-size: 10px; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; color: var(--lwm-primary);
}
body.lwx .lwx-panel-head i { font-size: 12px; opacity: .8; }
body.lwx .lwx-panel-head .lwx-badge { margin-left: auto; }
body.lwx .lwx-panel-body { padding: 4px 18px 16px; font-size: 13.5px; color: var(--lwm-text); }
body.lwx .lwx-panel-body .btn { margin-top: 6px; }
body.lwx .lwx-panel-list { display: flex !important; flex-direction: column; padding: 4px 8px 10px; border: 0; }
body.lwx .lwx-panel-list .list-group-item,
body.lwx .sidebar .list-group-item {
    border: 0 !important; border-radius: 8px !important; margin: 1px 0; padding: 9px 10px; background: transparent;
    color: #344054; font-size: 13.5px; font-weight: 600;
}
body.lwx .lwx-panel-list .list-group-item:hover { background: var(--lwx-soft); color: var(--lwm-text); }
body.lwx .lwx-panel-list .list-group-item.active, body.lwx .lwx-panel-list .list-group-item.active:hover, body.lwx .lwx-panel-list .list-group-item.active:focus {
    background: var(--lwm-primary-50) !important; color: var(--lwm-primary) !important; box-shadow: inset 3px 0 0 var(--lwx-accent);
}
body.lwx .lwx-panel-list .list-group-item.disabled { opacity: .5; }
body.lwx .lwx-panel .sidebar-menu-item-wrapper { display: flex; align-items: center; gap: 10px; }
body.lwx .lwx-panel .sidebar-menu-item-icon-wrapper { width: 18px; text-align: center; flex: none; color: var(--lwm-muted); }
body.lwx .lwx-panel .list-group-item.active .sidebar-menu-item-icon-wrapper { color: var(--lwm-primary); }
body.lwx .lwx-panel .sidebar-menu-item-label { flex: 1; min-width: 0; }
body.lwx .lwx-panel .sidebar-menu-item-badge .badge, body.lwx .lwx-panel-text .badge { background: var(--lwm-primary-50); color: var(--lwm-primary); font-size: 11px; }
body.lwx .lwx-panel-text { display: flex; align-items: center; gap: 10px; color: var(--lwm-muted) !important; font-weight: 500 !important; }
body.lwx .lwx-panel-text .badge { margin-left: auto; }
body.lwx .lwx-panel-foot { padding: 12px 18px 16px; border-top: 1px solid #eef1f6; font-size: 13px; }
body.lwx .lwx-panel-foot .btn { width: 100%; }
body.lwx .card-sidebar .card-minimise { display: none !important; }
body.lwx .card-sidebar .collapsable-card-body { display: block !important; }

/* ---------- Typography inside pages ---------- */
body.lwx .primary-content h1, body.lwx .primary-content .h1 { font-size: 24px; font-weight: 800; }
body.lwx .primary-content h2, body.lwx .primary-content .h2 { font-size: 20px; font-weight: 800; }
body.lwx .primary-content h3, body.lwx .primary-content .h3 { font-size: 17px; font-weight: 700; }
body.lwx .primary-content h4, body.lwx .primary-content .h4 { font-size: 15px; font-weight: 700; }
body.lwx .primary-content .card-body > h5,
body.lwx .primary-content .tab-pane .row > [class*="col-"] > h5 {
    font-size: 10px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; color: var(--lwm-muted); margin-bottom: 4px;
}
body.lwx .primary-content .tab-pane .row.mb-3 > [class*="col-"] { font-size: 14px; font-weight: 600; color: var(--lwm-text); margin-bottom: 6px; }
body.lwx .font-size-36 { font-size: 24px !important; }
body.lwx .text-muted { color: var(--lwm-muted) !important; }

/* ---------- Cards (native & modules) ---------- */
body.lwx .primary-content .card,
body.lwx .primary-content .panel,
body.lwx #order-standard_cart .card,
body.lwx .login-form, body.lwx .register-form {
    background: #fff; border: 1px solid var(--lwx-line) !important; border-radius: 10px !important; box-shadow: var(--lwx-shadow);
    margin-bottom: 20px;
}
body.lwx .primary-content .card-header,
body.lwx .primary-content .panel-heading,
body.lwx #order-standard_cart .card-header {
    background: #fff; border-bottom: 1px solid #eef1f6; padding: 16px 22px; border-radius: 10px 10px 0 0 !important;
}
body.lwx .primary-content .card-header .card-title,
body.lwx .primary-content .panel-title,
body.lwx .primary-content .card-header h3,
body.lwx .primary-content .card-body > .card-title:first-child {
    font-size: 16px !important; font-weight: 700; color: var(--lwm-text); margin: 0;
}
body.lwx .primary-content .card-body > .card-title:first-child { margin-bottom: 16px; }
body.lwx .primary-content .card-body, body.lwx .primary-content .panel-body { padding: 22px; }
body.lwx .primary-content .card-footer { background: #fafbfc; border-top: 1px solid #eef1f6; padding: 14px 22px; border-radius: 0 0 10px 10px; }

/* cPanel module (overview) */
body.lwx #cPanelPackagePanel .card-body { padding: 22px; }
body.lwx #cPanelPackagePanel em { font-style: normal; font-size: 11px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; color: var(--lwm-muted); }
body.lwx #cPanelPackagePanel h4 { font-size: 22px; font-weight: 800; margin: 4px 0; }
body.lwx .cpanel-usage-stats { padding-top: 18px !important; }
body.lwx .cpanel-feature-row { margin: -6px; }
body.lwx .cpanel-feature-row > div { padding: 6px; }
body.lwx .cpanel-feature-row a {
    display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 8px; height: 100%; min-height: 104px;
    padding: 16px 8px; border: 1px solid var(--lwx-line); border-radius: 10px; background: #fff;
    color: var(--lwm-text) !important; font-size: 13px; font-weight: 600; text-decoration: none !important; transition: border-color .15s, box-shadow .15s;
}
body.lwx .cpanel-feature-row a:hover { border-color: var(--lwm-primary); box-shadow: 0 6px 18px rgba(3, 6, 115, .08); }
body.lwx .cpanel-feature-row a img { width: 40px; height: 40px; margin: 0 !important; }
body.lwx .cpanel-feature-row br { display: none; }
body.lwx #cPanelBillingOverviewPanel .row > div > .row { margin-bottom: 8px; }
body.lwx #cPanelBillingOverviewPanel .text-right { text-align: left !important; font-size: 10px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; color: var(--lwm-muted); }

/* Native product details (no module output) */
body.lwx .product-status { border-radius: 10px; overflow: hidden; border: 1px solid var(--lwx-line); }
body.lwx .product-status .product-icon { background: var(--lwm-primary-50); color: var(--lwm-primary); padding: 22px; }
body.lwx .product-status .product-icon .fa-circle { color: var(--lwm-primary); }
body.lwx .product-status-text { background: var(--lwm-primary) !important; color: #fff; font-weight: 700; padding: 8px; }
body.lwx .product-details-tab-container, body.lwx .product-details .row + .row { margin-top: 12px; }

/* ---------- Buttons ---------- */
body.lwx .btn {
    border-radius: 8px; font-weight: 700; font-size: 14px; padding: 9px 16px; line-height: 1.3; box-shadow: none !important;
    transition: background .15s ease, border-color .15s ease, color .15s ease;
}
body.lwx .btn-sm, body.lwx .btn-xs { font-size: 12.5px; padding: 6px 12px; }
body.lwx .btn-lg { font-size: 15px; padding: 12px 22px; }
body.lwx .btn-primary, body.lwx .btn-success, body.lwx .btn-info, body.lwx .btn-order-now, body.lwx .btn-checkout {
    background: var(--lwm-primary) !important; border-color: var(--lwm-primary) !important; color: #fff !important;
}
body.lwx .btn-primary:hover, body.lwx .btn-success:hover, body.lwx .btn-info:hover, body.lwx .btn-order-now:hover, body.lwx .btn-checkout:hover {
    background: var(--lwm-primary-600) !important; border-color: var(--lwm-primary-600) !important;
}
body.lwx .btn-default, body.lwx .btn-secondary, body.lwx .btn-light, body.lwx .btn-outline-secondary, body.lwx .btn-outline-primary, body.lwx .btn-link.btn-default {
    background: var(--lwx-soft) !important; border: 1px solid #e4e7ec !important; color: #344054 !important;
}
body.lwx .btn-default:hover, body.lwx .btn-secondary:hover, body.lwx .btn-light:hover, body.lwx .btn-outline-secondary:hover, body.lwx .btn-outline-primary:hover {
    background: #fff !important; border-color: var(--lwm-primary) !important; color: var(--lwm-primary) !important;
}
body.lwx .btn-danger { background: #fff !important; border: 1px solid #f3c9c9 !important; color: var(--lwm-danger) !important; }
body.lwx .btn-danger:hover { background: var(--lwm-danger-50) !important; }
body.lwx .btn-warning { background: #fff6e5 !important; border: 1px solid #f6dfb4 !important; color: #b54708 !important; }
body.lwx .btn-group > .btn:not(:first-child) { border-top-left-radius: 0; border-bottom-left-radius: 0; }
body.lwx .btn-group > .btn:not(:last-child):not(.dropdown-toggle) { border-top-right-radius: 0; border-bottom-right-radius: 0; }

/* ---------- Forms ---------- */
body.lwx .form-control, body.lwx .custom-select, body.lwx select.form-control, body.lwx .field {
    min-height: 42px; border: 1px solid #d0d5dd; border-radius: 8px; font-size: 14px; color: var(--lwm-text); background-color: #fff; box-shadow: 0 1px 2px rgba(16, 24, 40, .04);
}
body.lwx textarea.form-control { min-height: 120px; }
body.lwx .form-control-sm { min-height: 34px; }
body.lwx .form-control:focus, body.lwx .custom-select:focus, body.lwx .field:focus { border-color: var(--lwm-primary); box-shadow: 0 0 0 3px rgba(3, 6, 115, .12); }
body.lwx label, body.lwx .col-form-label, body.lwx .control-label { font-size: 13px; font-weight: 600; color: #344054; }
body.lwx .input-group-text, body.lwx .input-group-addon { background: #f9fafb; border-color: #d0d5dd; color: var(--lwm-muted); }
body.lwx .input-group > .form-control:not(:last-child) { border-top-right-radius: 0; border-bottom-right-radius: 0; }
body.lwx .input-group > .input-group-append > .btn, body.lwx .input-group > .input-group-append > .input-group-text { border-top-left-radius: 0; border-bottom-left-radius: 0; }
body.lwx .input-group > .input-group-prepend > .input-group-text { border-top-right-radius: 0; border-bottom-right-radius: 0; }
body.lwx .custom-control-input:checked ~ .custom-control-label::before { background: var(--lwm-primary); border-color: var(--lwm-primary); }
body.lwx .help-block, body.lwx .form-text { font-size: 12px; color: var(--lwm-muted); }

/* ---------- Tabs ---------- */
body.lwx .nav-tabs { display: inline-flex; flex-wrap: wrap; gap: 4px; padding: 4px; background: #eaedf3; border-radius: 10px; border: 0; margin-bottom: 20px; }
body.lwx .nav-tabs .nav-link { border: 0 !important; border-radius: 8px; padding: 8px 14px; font-size: 13px; font-weight: 600; color: var(--lwm-muted); background: transparent; }
body.lwx .nav-tabs .nav-link:hover { color: var(--lwm-text); }
body.lwx .nav-tabs .nav-link.active, body.lwx .nav-tabs .nav-item.show .nav-link { background: #fff !important; color: var(--lwm-text) !important; box-shadow: 0 1px 3px rgba(16, 24, 40, .1); }
body.lwx .nav-pills .nav-link { border-radius: 8px; font-weight: 600; color: var(--lwm-muted); }
body.lwx .nav-pills .nav-link.active { background: var(--lwm-primary-50); color: var(--lwm-primary); }

/* ---------- Tables ---------- */
body.lwx .primary-content .table, body.lwx #order-standard_cart .table { background: #fff; color: var(--lwm-text); font-size: 14px; margin-bottom: 0; }
body.lwx .primary-content .table thead th, body.lwx #order-standard_cart .table thead th {
    background: #f9fafb; color: var(--lwm-muted); font-size: 10.5px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase;
    border-top: 0; border-bottom: 1px solid var(--lwx-line); padding: 12px 14px; white-space: nowrap;
}
body.lwx .primary-content .table td { padding: 13px 14px; border-top: 1px solid #eef1f6; vertical-align: middle; }
body.lwx .table-responsive, body.lwx .table-container { border: 1px solid var(--lwx-line); border-radius: 10px; overflow: auto; background: #fff; box-shadow: var(--lwx-shadow); }
body.lwx .table-container table.table-list, body.lwx .dataTables_wrapper table.table-list { border: 0 !important; border-radius: 0 !important; box-shadow: none; }
body.lwx .dataTables_wrapper .dataTables_filter input { min-height: 38px; border-radius: 8px; }
body.lwx .dataTables_wrapper .listtable { border: 0; }

/* ---------- Alerts, badges, misc ---------- */
body.lwx .alert { border: 1px solid transparent; border-radius: 10px; font-size: 14px; padding: 14px 18px; }
body.lwx .alert-info, body.lwx .alert-primary { background: var(--lwm-primary-50); border-color: #d5daf3; color: var(--lwm-primary); }
body.lwx .alert-success { background: #ecfdf3; border-color: #c7ecdc; color: #067647; }
body.lwx .alert-warning { background: #fff6e5; border-color: #f6dfb4; color: #93370d; }
body.lwx .alert-danger { background: #fef3f2; border-color: #f5cccc; color: #b42318; }
body.lwx .alert .btn { margin-left: 8px; }
body.lwx .primary-content .list-group-item { border-color: #eef1f6; }
body.lwx .primary-content .list-group-item.active { background: var(--lwm-primary-50); border-color: #d5daf3; color: var(--lwm-primary); }
body.lwx .modal-content { border: 0; border-radius: 12px; box-shadow: 0 24px 48px rgba(16, 24, 40, .18); }
body.lwx .modal-header { border-bottom-color: #eef1f6; padding: 18px 22px; }
body.lwx .modal-footer { border-top-color: #eef1f6; }
body.lwx .dropdown-menu { border: 1px solid var(--lwx-line); border-radius: 10px; box-shadow: 0 12px 32px rgba(16, 24, 40, .12); padding: 6px; }
body.lwx .dropdown-item { border-radius: 6px; font-size: 13.5px; padding: 8px 10px; }
body.lwx .dropdown-item:hover, body.lwx .dropdown-item:focus { background: var(--lwm-primary-50); color: var(--lwm-primary); }
body.lwx .breadcrumb { background: transparent; font-size: 12.5px; }
body.lwx .progress { border-radius: 999px; background: #eef1f6; }
body.lwx .progress-bar { background: var(--lwm-primary); }

/* ---------- Tickets ---------- */
body.lwx .ticket-reply { border: 1px solid var(--lwx-line); border-radius: 10px; background: #fff; box-shadow: var(--lwx-shadow); margin-bottom: 16px; overflow: hidden; }
body.lwx .ticket-reply .posted-by { background: #f9fafb; border-bottom: 1px solid #eef1f6; padding: 12px 18px; font-size: 13px; }
body.lwx .ticket-reply.staff .posted-by { background: var(--lwm-primary-50); }
body.lwx .ticket-reply .message { padding: 18px; font-size: 14px; }
body.lwx .ticket-reply .requestor-badge { border-radius: 999px; font-size: 11px; }
body.lwx .ticket-subject { font-weight: 700; }

/* ---------- Knowledge base & announcements ---------- */
body.lwx .kb-category, body.lwx .kb-article-item, body.lwx .announcement-single {
    display: block; background: #fff; border: 1px solid var(--lwx-line); border-radius: 10px; padding: 16px 18px; margin-bottom: 12px; box-shadow: var(--lwx-shadow);
}
body.lwx .kb-search, body.lwx .announcement-single h3 { margin-bottom: 8px; }

/* ---------- Login, register, password ---------- */
body.lwx .login-form, body.lwx .register-form { padding: 6px; }
body.lwx .login-form .card-body, body.lwx .login-form .h3 { font-weight: 800; }
body.lwx .login-form .card-footer { background: #fafbfc; border-top: 1px solid #eef1f6; }

/* =====================================================================
   SHOPPING CART (standard_cart)
   ===================================================================== */
body.lwx #order-standard_cart { font-size: 14px; color: var(--lwm-text); }
body.lwx #order-standard_cart .header-lined { display: block; margin-bottom: 16px; }
body.lwx #order-standard_cart .header-lined h1 { font-size: 24px !important; font-weight: 800; margin: 0 0 4px; border: 0; }
body.lwx #order-standard_cart .header-lined p { color: var(--lwm-muted); }
body.lwx #order-standard_cart .cart-sidebar .card { box-shadow: var(--lwx-shadow); border: 1px solid var(--lwx-line) !important; border-radius: 10px !important; margin-bottom: 16px; overflow: hidden; }
body.lwx #order-standard_cart .cart-sidebar .card-header { background: #fff; border: 0; padding: 14px 18px 8px; }
body.lwx #order-standard_cart .cart-sidebar .panel-title,
body.lwx #order-standard_cart .cart-sidebar .card-title { font-size: 10px !important; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; color: var(--lwm-primary); margin: 0; }
body.lwx #order-standard_cart .cart-sidebar .panel-title i { display: none; }
body.lwx #order-standard_cart .cart-sidebar .list-group { padding: 4px 8px 10px; display: block !important; }
body.lwx #order-standard_cart .cart-sidebar .list-group-item { border: 0 !important; border-radius: 8px !important; padding: 9px 10px; font-weight: 600; font-size: 13.5px; color: #344054; background: transparent; margin: 1px 0; }
body.lwx #order-standard_cart .cart-sidebar .list-group-item:hover { background: var(--lwx-soft); }
body.lwx #order-standard_cart .cart-sidebar .list-group-item.active { background: var(--lwm-primary-50) !important; color: var(--lwm-primary) !important; box-shadow: inset 3px 0 0 var(--lwx-accent); }
body.lwx #order-standard_cart .sidebar-collapsed .card { margin-bottom: 12px; }

/* Product boxes */
body.lwx #order-standard_cart .products .product {
    display: flex; flex-direction: column; height: calc(100% - 20px); background: #fff; border: 1px solid var(--lwx-line); border-radius: 12px;
    box-shadow: var(--lwx-shadow); padding: 22px; margin-bottom: 20px; transition: border-color .15s, box-shadow .15s;
}
body.lwx #order-standard_cart .products .product:hover { border-color: #c9cee0; box-shadow: 0 12px 30px rgba(3, 6, 115, .08); }
body.lwx #order-standard_cart .products .product header { background: transparent; padding: 0 0 12px; margin: 0 0 14px; border-bottom: 1px solid #eef1f6; }
body.lwx #order-standard_cart .products .product header span { font-size: 18px; font-weight: 800; color: var(--lwm-text); }
body.lwx #order-standard_cart .products .product header .qty { font-size: 12px; color: var(--lwm-muted); font-style: normal; }
body.lwx #order-standard_cart .products .product div.product-desc { float: none; width: auto; flex: 1; font-size: 13.5px; color: #475467; line-height: 1.7; padding: 0; }
body.lwx #order-standard_cart .products .product div.product-desc ul { padding-left: 18px; }
body.lwx #order-standard_cart .products .product footer, body.lwx #order-standard_cart .products .product div.product-pricing {
    float: none; width: auto; text-align: left; margin: 16px 0 0; padding: 14px 0 0; border-top: 1px solid #eef1f6; font-size: 12.5px; color: var(--lwm-muted);
}
body.lwx #order-standard_cart .products .product .price { display: block; font-size: 26px; font-weight: 800; color: var(--lwm-primary); line-height: 1.2; }
body.lwx #order-standard_cart .products .product .btn-order-now { width: 100%; margin-top: 12px; padding: 11px 16px; }
body.lwx #order-standard_cart .row-eq-height > [class*="col-"] { margin-bottom: 0; }

/* Configure product / domain */
body.lwx #order-standard_cart .product-info { background: var(--lwm-primary-50); border: 0; border-radius: 10px; padding: 16px 18px; color: var(--lwm-text); }
body.lwx #order-standard_cart .product-info .product-title { font-size: 18px; font-weight: 800; }
body.lwx #order-standard_cart .sub-heading { height: auto; margin: 26px 0 14px; border-top: 0; text-align: left; }
body.lwx #order-standard_cart .sub-heading span, body.lwx #order-standard_cart .sub-heading-borderless span {
    position: static; display: inline-block; padding: 0; background: transparent; font-size: 11px; font-weight: 800; letter-spacing: .1em;
    text-transform: uppercase; color: var(--lwm-primary);
}
body.lwx #order-standard_cart .field-container, body.lwx #order-standard_cart .domain-selection-options .option {
    background: #fff; border: 1px solid var(--lwx-line); border-radius: 10px; padding: 16px 18px; margin-bottom: 12px; box-shadow: var(--lwx-shadow);
}
body.lwx #order-standard_cart .domain-selection-options .option-selected { border-color: var(--lwm-primary); box-shadow: 0 0 0 3px rgba(3, 6, 115, .08); background: #fff; }
body.lwx #order-standard_cart .domain-selection-options label { font-weight: 600; color: var(--lwm-text); }
body.lwx #order-standard_cart .addon-products .panel-addon, body.lwx #order-standard_cart .panel-addon {
    border: 1px solid var(--lwx-line); border-radius: 10px; overflow: hidden; box-shadow: var(--lwx-shadow);
}
body.lwx #order-standard_cart .panel-addon-selected { border-color: var(--lwm-primary); }
body.lwx #order-standard_cart .panel-addon .panel-add { background: var(--lwx-soft); color: var(--lwm-text); font-weight: 700; }
body.lwx #order-standard_cart .panel-addon-selected .panel-add { background: var(--lwm-primary); color: #fff; }
body.lwx #order-standard_cart .irs-bar, body.lwx #order-standard_cart .irs-from, body.lwx #order-standard_cart .irs-to, body.lwx #order-standard_cart .irs-single { background: var(--lwm-primary); border-color: var(--lwm-primary); }

/* Order summary */
body.lwx #order-standard_cart .order-summary {
    background: var(--lwm-primary); border: 0; border-radius: 12px; overflow: hidden; box-shadow: 0 16px 36px rgba(3, 6, 115, .18); margin-bottom: 20px;
}
body.lwx #order-standard_cart .order-summary h2 { background: transparent; color: #fff; font-size: 11px !important; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; padding: 18px 20px 4px; margin: 0; }
body.lwx #order-standard_cart .summary-container { background: #fff; margin: 12px; border-radius: 10px; padding: 16px; font-size: 13.5px; color: var(--lwm-text); }
body.lwx #order-standard_cart .summary-container .product-name { font-size: 15px; font-weight: 800; }
body.lwx #order-standard_cart .summary-container .product-group { color: var(--lwm-muted); font-size: 12px; }
body.lwx #order-standard_cart .summary-container .total-due-today, body.lwx #order-standard_cart .total-due-today .amt { color: var(--lwm-primary); }
body.lwx #order-standard_cart .total-due-today .amt { font-size: 26px; font-weight: 800; }
body.lwx #order-standard_cart .order-summary .btn-checkout, body.lwx #order-standard_cart .summary-container .btn { width: 100%; }
body.lwx #order-standard_cart .order-summary .text-right .btn-link, body.lwx #order-standard_cart .order-summary a.btn-link { color: rgba(255, 255, 255, .85); }

/* View cart */
body.lwx #order-standard_cart .view-cart-items-header { background: #f9fafb; color: var(--lwm-muted); border: 1px solid var(--lwx-line); border-bottom: 0; border-radius: 10px 10px 0 0; padding: 12px 16px; font-size: 10.5px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
body.lwx #order-standard_cart .view-cart-items { border: 1px solid var(--lwx-line); border-radius: 0 0 10px 10px; background: #fff; box-shadow: var(--lwx-shadow); overflow: hidden; }
body.lwx #order-standard_cart .view-cart-items .item { padding: 16px; border-bottom: 1px solid #eef1f6; }
body.lwx #order-standard_cart .view-cart-items .item:last-child { border-bottom: 0; }
body.lwx #order-standard_cart .view-cart-items .item-title { font-weight: 800; font-size: 15px; }
body.lwx #order-standard_cart .view-cart-items .item-group, body.lwx #order-standard_cart .view-cart-items .item-domain { color: var(--lwm-muted); font-size: 12.5px; }
body.lwx #order-standard_cart .view-cart-items .item-price span:first-child { font-weight: 800; font-size: 15px; }
body.lwx #order-standard_cart .view-cart-empty { background: #fff; border: 1px dashed #d0d5dd; border-radius: 10px; padding: 36px; color: var(--lwm-muted); }
body.lwx #order-standard_cart .view-cart-tabs .nav-tabs { margin-bottom: 0; }
body.lwx #order-standard_cart .view-cart-tabs .tab-content { background: #fff; border: 1px solid var(--lwx-line); border-radius: 10px; padding: 18px; margin-top: 12px; }
body.lwx #order-standard_cart .empty-cart .btn { background: transparent !important; border: 0 !important; color: var(--lwm-danger) !important; }

/* Checkout */
body.lwx #order-standard_cart .already-registered { background: var(--lwm-primary-50); border: 0; border-radius: 10px; padding: 14px 18px; }
body.lwx #order-standard_cart .prepend-icon .field-icon { color: var(--lwm-muted); top: 50%; transform: translateY(-50%); }
body.lwx #order-standard_cart .prepend-icon .field { padding-left: 40px; }
body.lwx #order-standard_cart .payment-methods { display: flex; flex-wrap: wrap; gap: 10px; }
body.lwx #order-standard_cart .payment-methods label { margin: 0; padding: 12px 16px; border: 1px solid var(--lwx-line); border-radius: 10px; background: #fff; font-weight: 600; cursor: pointer; }
body.lwx #order-standard_cart .btn-checkout { padding: 13px 26px; font-size: 15px; }
body.lwx #order-standard_cart .marketing-email-optin, body.lwx #order-standard_cart .account-select-container .account { border-radius: 10px; }
body.lwx #order-standard_cart .account-select-container .account { border: 1px solid var(--lwx-line); background: #fff; }
body.lwx #order-standard_cart .account-select-container .account.active { border-color: var(--lwm-primary); background: var(--lwm-primary-50); }

/* Domain search banner (cart & home page) */
body.lwx .domain-checker-container {
    background: linear-gradient(135deg, var(--lwm-primary) 0%, #0a1199 60%, #2b33b8 100%) !important;
    border-radius: 14px; margin: 0 0 22px; padding: 0; overflow: hidden; box-shadow: 0 16px 36px rgba(3, 6, 115, .18);
}
body.lwx .domain-checker-bg { background: none !important; padding: 38px 28px !important; }
body.lwx .domain-checker-container .input-group-box { background: #fff; border-radius: 12px; padding: 6px; box-shadow: 0 10px 28px rgba(0, 0, 0, .18); }
body.lwx .domain-checker-container .input-group-box .form-control { border: 0; box-shadow: none; font-size: 16px; min-height: 48px; }
body.lwx .domain-checker-container .input-group-box .btn { border-radius: 9px !important; min-height: 48px; padding: 0 22px; }
body.lwx .domain-checker-container .domain-checker-label, body.lwx .domain-checker-container .tooltip { display: none !important; }
body.lwx #order-standard_cart .domain-checker-result-headline .domain-available { color: #067647; }
body.lwx #order-standard_cart .domain-checker-result-headline .domain-unavailable { color: #b42318; }
body.lwx #order-standard_cart .domain-suggestions .domain-suggestion,
body.lwx #order-standard_cart .spotlight-tlds .spotlight-tld { border: 1px solid var(--lwx-line); border-radius: 10px; background: #fff; }
body.lwx #order-standard_cart .spotlight-tlds .spotlight-tld-container { margin-bottom: 12px; }
body.lwx #order-standard_cart .tld-filters a, body.lwx .tld-filters .badge {
    border-radius: 999px !important; background: var(--lwx-soft) !important; color: #344054 !important; border: 1px solid #e4e7ec;
    padding: 6px 12px; font-size: 12px; font-weight: 600; margin: 0 6px 6px 0;
}
body.lwx #order-standard_cart .tld-filters a.badge-success, body.lwx .tld-filters a.active { background: var(--lwm-primary) !important; color: #fff !important; border-color: var(--lwm-primary); }
body.lwx .domain-pricing .tld-pricing-header > div, body.lwx .domain-pricing .tld-pricing-header .tld-column { background: #f9fafb !important; color: var(--lwm-muted) !important; border: 0 !important; font-size: 10.5px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
body.lwx .domain-pricing .tld-row { border-bottom: 1px solid #eef1f6; background: #fff !important; }
body.lwx .domain-pricing .tld-row:hover { background: #f7f8fd !important; }
body.lwx .domain-pricing .tld-row > div { border: 0 !important; }
body.lwx .domain-pricing .tld-row strong { font-weight: 800; }
body.lwx .domain-pricing .bg-white { background: #fff !important; }
body.lwx .domain-pricing { border: 1px solid var(--lwx-line); border-radius: 12px; overflow: hidden; background: #fff; box-shadow: var(--lwx-shadow); padding: 0 !important; }
body.lwx .domain-pricing h4 { padding: 18px 20px 4px; font-size: 16px; font-weight: 800; }
body.lwx .domain-pricing .tld-filters { padding: 0 20px 12px; }

@media (max-width: 991.98px) {
    body.lwx .lwx-aside { margin-bottom: 4px; }
    body.lwx .lwx-aside .sidebar { position: static; }
    body.lwx .lwx-panel-list { flex-direction: row !important; flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none; gap: 4px; }
    body.lwx .lwx-panel-list::-webkit-scrollbar { display: none; }
    body.lwx .lwx-panel-list .list-group-item { flex: none; width: auto; white-space: nowrap; }
    /* Un panneau qui contient du texte (ex. « Vous avez déjà un compte ? ») ne défile pas : le texte passe à la ligne, les liens en dessous. */
    body.lwx .lwx-panel-list:has(.lwx-panel-text) { flex-wrap: wrap; overflow-x: visible; }
    body.lwx .lwx-panel-list .lwx-panel-text { flex: 1 1 100%; white-space: normal; }
    body.lwx .lwx-hero-meta { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 575.98px) {
    body.lwx .lwx-hero { padding: 18px; }
    body.lwx .lwx-hero-main { flex-basis: calc(100% - 120px); }
    body.lwx .lwx-hero-main h2 { font-size: 19px; }
    body.lwx .lwx-ico-lg { display: none; }
    body.lwx .domain-checker-bg { padding: 22px 14px !important; }
}
/* Pages sans conteneur (404…) : la .row de Twenty-One dépassait de 15 px et faisait défiler la page sur le côté. */
body.lwx #main-body > div:not(.lwx-container) > .row { margin-left: 0; margin-right: 0; }
body.lwx .domain-checker-container .input-group-box .input-group { flex-wrap: nowrap; }
body.lwx .domain-checker-container .input-group-box .btn { flex: none; width: auto; min-width: 140px; white-space: nowrap; }
body.lwx .domain-pricing .tld-pricing-header, body.lwx .domain-pricing .tld-pricing-header * { border: 0 !important; box-shadow: none !important; }
body.lwx .domain-pricing .tld-pricing-header { background: #f9fafb; }
body.lwx .login-form, body.lwx .register-form { background: transparent !important; border: 0 !important; box-shadow: none !important; padding: 0 !important; }

/* Invoice page (LWM Factures module): keep every column inside the screen on mobile */
body.lwx-body .lwx-main { grid-template-columns: minmax(0, 1fr); }
body.lwx-body .lwx-table-wrap { max-width: 100%; overflow-x: auto; -webkit-overflow-scrolling: touch; }
@media (max-width: 991.98px) {
    body.lwx-body .lwx-grid { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 767.98px) {
    body.lwx-body .lwx-parties { grid-template-columns: minmax(0, 1fr); }
    body.lwx-body .lwx-table { width: 100%; }
    body.lwx-body .lwx-table th { white-space: normal; word-break: normal; overflow-wrap: normal; hyphens: none; }
    body.lwx-body .lwx-table td:not(.lwx-num) { white-space: normal; overflow-wrap: break-word; }
    body.lwx-body .lwx-table .lwx-num { white-space: nowrap; word-break: normal; width: 1%; }
}

/* ---------- Detail pages: section heads, facts grid, quick actions ---------- */
body.lwx .lwx-sec-head { margin-bottom: 18px; }
body.lwx .lwx-sec-head h3 { font-size: 17px !important; font-weight: 800; margin: 3px 0 0; color: var(--lwm-text); }
body.lwx .lwx-facts { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0; margin: 0; border: 1px solid #eef1f6; border-radius: 10px; overflow: hidden; }
body.lwx .lwx-facts > div { padding: 14px 16px; border-right: 1px solid #eef1f6; border-bottom: 1px solid #eef1f6; min-width: 0; }
body.lwx .lwx-facts > div:nth-child(3n) { border-right: 0; }
body.lwx .lwx-facts dt { font-size: 10px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; color: var(--lwm-muted); margin-bottom: 4px; }
body.lwx .lwx-facts dd { margin: 0; font-size: 14px; font-weight: 700; color: var(--lwm-text); overflow-wrap: anywhere; }
body.lwx .lwx-facts dd small { color: var(--lwm-muted); font-weight: 500; }
body.lwx .lwx-facts dd img { vertical-align: -2px; margin-right: 4px; }
body.lwx .lwx-actions-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
body.lwx .lwx-action {
    display: flex; align-items: center; gap: 14px; padding: 14px 16px; border: 1px solid var(--lwx-line); border-radius: 10px; background: #fff;
    color: var(--lwm-text) !important; text-decoration: none !important; transition: border-color .15s, box-shadow .15s;
}
body.lwx .lwx-action:hover { border-color: var(--lwm-primary); box-shadow: 0 6px 18px rgba(3, 6, 115, .08); }
body.lwx .lwx-action b { display: block; font-size: 14px; font-weight: 700; }
body.lwx .lwx-action small { display: block; font-size: 12px; color: var(--lwm-muted); margin-top: 2px; }
body.lwx .lwx-toggle-row { display: flex; align-items: center; justify-content: space-between; gap: 16px; flex-wrap: wrap; padding: 16px 18px; border: 1px solid #eef1f6; border-radius: 10px; background: #f9fafb; }
body.lwx .lwx-toggle-row form { margin: 0; }
body.lwx .lwx-toggle-label { display: block; font-size: 10px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; color: var(--lwm-muted); margin-bottom: 6px; }
body.lwx .lwx-choice { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; margin-bottom: 18px; }
body.lwx .lwx-choice-item { display: flex; align-items: center; gap: 10px; margin: 0; padding: 12px 14px; border: 1px solid var(--lwx-line); border-radius: 10px; cursor: pointer; font-weight: 600; }
body.lwx .lwx-choice-item:has(input:checked) { border-color: var(--lwm-primary); background: var(--lwm-primary-50); color: var(--lwm-primary); }
body.lwx .lwx-choice-item input { accent-color: var(--lwm-primary); }
body.lwx .lwx-ns-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 14px; margin-bottom: 8px; }
body.lwx .lwx-addon-list { display: flex; flex-direction: column; gap: 12px; }
body.lwx .lwx-addon { display: flex; align-items: center; gap: 14px; padding: 14px 16px; border: 1px solid var(--lwx-line); border-radius: 10px; }
body.lwx .lwx-addon-main { flex: 1; min-width: 0; }
body.lwx .lwx-addon-main b { display: block; font-size: 14px; }
body.lwx .lwx-addon-main small { display: block; font-size: 12.5px; color: var(--lwm-muted); }
body.lwx .lwx-addon form { margin: 0; display: flex; gap: 6px; flex-wrap: wrap; }
body.lwx .lwx-alert-row { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; }

/* ---------- Verification banners (e-mail / identity) ---------- */
body.lwx .verification-banner {
    width: auto; max-width: calc(1280px - 0px); margin: 14px 34px 0; padding: 12px 16px; border-radius: 10px;
    background: #fff6e5 !important; border: 1px solid #f6dfb4; color: #93370d; box-shadow: none;
}
body.lwx .verification-banner .container { max-width: none; padding: 0; }
body.lwx .verification-banner .row { align-items: center; margin: 0; }
body.lwx .verification-banner .fas.fa-exclamation-triangle, body.lwx .verification-banner .fa-exclamation-triangle { font-size: 16px !important; color: #b54708; margin-right: 8px; }
body.lwx .verification-banner .text { font-size: 13.5px; font-weight: 600; color: #93370d; }
body.lwx .verification-banner .btn { font-size: 12.5px; padding: 6px 12px; }
body.lwx .verification-banner .close { color: #b54708; opacity: .7; font-size: 14px; }
@media (min-width: 1416px) { body.lwx .verification-banner { margin-left: auto; margin-right: auto; max-width: 1280px; } }
@media (max-width: 991.98px) {
    body.lwx .verification-banner { margin: 12px 16px 0; }
    body.lwx .lwx-facts { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    body.lwx .lwx-facts > div:nth-child(3n) { border-right: 1px solid #eef1f6; }
    body.lwx .lwx-facts > div:nth-child(2n) { border-right: 0; }
}
@media (max-width: 575.98px) {
    body.lwx .lwx-actions-grid, body.lwx .lwx-choice, body.lwx .lwx-ns-grid { grid-template-columns: minmax(0, 1fr); }
    body.lwx .lwx-addon { flex-wrap: wrap; }
}

/* Cart radio/checkbox ticks (iCheck sprites) in the brand navy */
body.lwx .iradio_square-blue.checked, body.lwx .icheckbox_square-blue.checked { filter: hue-rotate(18deg) saturate(1.8) brightness(.5); }

/* ---------- Checkout: payment methods as cards with logos · LWB Theme ---------- */
#paymentGatewaysContainer.lwb-pay > .small { text-align: left; margin-bottom: 10px; }
.lwb-pay-grid { display: grid !important; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; text-align: left !important; }
@media (max-width: 575.98px) { .lwb-pay-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; } }
.lwb-pay-grid label.lwb-pay-card {
    position: relative; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 8px;
    margin: 0 !important; padding: 16px 12px 12px; min-height: 108px; cursor: pointer;
    background: var(--lwm-surface); border: 1.5px solid var(--lwm-border); border-radius: var(--lwm-radius-sm);
    transition: border-color .15s, box-shadow .15s, background-color .15s;
}
.lwb-pay-grid label.lwb-pay-card:hover { border-color: var(--lwm-border-strong); box-shadow: 0 4px 14px rgba(16, 24, 40, .06); }
.lwb-pay-grid label.lwb-pay-card.is-checked { border-color: var(--lwm-primary); background: var(--lwm-primary-50); box-shadow: 0 0 0 3px rgba(3, 6, 115, .08); }
.lwb-pay-card > .iradio_square-blue, .lwb-pay-card > input[type="radio"] { position: absolute !important; top: 8px; right: 8px; margin: 0; transform: scale(.85); }
.lwb-pay-logo { display: flex; align-items: center; justify-content: center; width: 100%; height: 50px; }
.lwb-pay-logo img { max-width: min(150px, 100%); max-height: 48px; width: auto; height: auto; object-fit: contain; }
.lwb-pay-logo i { font-size: 30px; color: var(--lwm-primary); }
.lwb-pay-name { font-size: 12.5px; font-weight: 500; line-height: 1.3; color: var(--lwm-text); text-align: center; }

/* =====================================================================
   DESIGN PASS 2 · LWB Theme — checkout footer, knowledge base, news, status
   ===================================================================== */

/* Checkout: notes, newsletter, terms, button, security note */
body.lwx #order-standard_cart #frmCheckout textarea[name="notes"] { border-radius: 10px; min-height: 96px; }
body.lwx #order-standard_cart .marketing-email-optin {
    display: flex; align-items: center; gap: 14px; margin: 18px 0 0; padding: 14px 16px; background: #fff; border: 1px solid var(--lwx-line); box-shadow: var(--lwx-shadow);
}
body.lwx #order-standard_cart .marketing-email-optin h4 { display: none; }
body.lwx #order-standard_cart .marketing-email-optin p { flex: 1; margin: 0; font-size: 13.5px; line-height: 1.5; color: #475467; }
body.lwx .lwb-switch { position: relative; flex: 0 0 auto; width: 44px; height: 24px; margin: 0; cursor: pointer; }
body.lwx .lwb-switch input { position: absolute; opacity: 0; width: 100%; height: 100%; margin: 0; cursor: pointer; }
body.lwx .lwb-switch span { position: absolute; inset: 0; border-radius: 999px; background: #d0d5dd; transition: background .15s; }
body.lwx .lwb-switch span::after { content: ""; position: absolute; top: 3px; left: 3px; width: 18px; height: 18px; border-radius: 50%; background: #fff; box-shadow: 0 1px 3px rgba(16, 24, 40, .2); transition: transform .15s; }
body.lwx .lwb-switch input:checked + span { background: var(--lwm-ok); }
body.lwx .lwb-switch input:checked + span::after { transform: translateX(20px); }
body.lwx .lwb-switch input:focus-visible + span { box-shadow: 0 0 0 3px rgba(3, 6, 115, .18); }
body.lwx #order-standard_cart #frmCheckout > .text-center { text-align: left !important; margin-top: 18px; }
body.lwx #order-standard_cart #frmCheckout > .text-center > p { margin: 0 0 14px; }
body.lwx #order-standard_cart #frmCheckout .checkbox-inline {
    display: flex; align-items: center; gap: 10px; margin: 0; padding: 12px 16px; border-radius: 10px; background: var(--lwm-primary-50);
    font-size: 13.5px; font-weight: 500; color: var(--lwm-text); cursor: pointer;
}
body.lwx #order-standard_cart #frmCheckout .checkbox-inline a { font-weight: 700; text-decoration: underline; text-underline-offset: 2px; }
body.lwx #order-standard_cart #btnCompleteOrder { display: flex; align-items: center; justify-content: center; gap: 8px; width: 100%; padding: 15px 22px; font-size: 16px; font-weight: 700; border-radius: 12px; }
body.lwx #order-standard_cart .checkout-security-msg {
    display: block; margin: 14px 0 0; padding: 10px 14px; border: 0; border-radius: 10px; text-align: center;
    background: transparent; color: var(--lwm-muted); font-size: 12.5px; line-height: 1.5;
}
body.lwx #order-standard_cart .checkout-security-msg i { float: none !important; margin: 0 6px 0 0 !important; font-size: 13px !important; color: var(--lwm-ok); }
body.lwx #order-standard_cart .checkout-security-msg .clearfix { display: none; }
body.lwx #order-standard_cart #frmCheckout .lwb-reveal { margin-top: 16px; }
body.lwx #order-standard_cart .checkout-security-msg strong { color: #475467; }

/* Knowledge base */
body.lwx .kb-search { border-radius: 12px; overflow: hidden; box-shadow: var(--lwx-shadow); border: 1px solid var(--lwx-line); background: #fff; }
body.lwx .kb-search .form-control { border: 0 !important; box-shadow: none !important; font-size: 15px !important; min-height: 52px; padding-left: 18px; }
body.lwx .kb-search .btn { border-radius: 10px !important; margin: 6px; min-height: 40px; padding: 0 20px; font-size: 14px; }
body.lwx .card.kb-category { padding: 0; margin-bottom: 16px !important; transition: border-color .15s, box-shadow .15s, transform .15s; }
body.lwx .card.kb-category:hover { border-color: #c9cee0; box-shadow: 0 12px 28px rgba(3, 6, 115, .08); transform: translateY(-1px); }
body.lwx .kb-category .card-body { display: grid; grid-template-columns: 42px 1fr; column-gap: 14px; row-gap: 2px; padding: 16px 18px; text-decoration: none; }
body.lwx .kb-category .card-body > .h5 { display: contents; }
body.lwx .kb-category .card-body .fa-folder {
    grid-row: 1 / span 2; display: inline-flex; align-items: center; justify-content: center; width: 42px; height: 42px; border-radius: 12px;
    background: var(--lwm-primary-50); color: var(--lwm-primary); font-size: 0; align-self: start;
}
body.lwx .kb-category .card-body .fa-folder::before { content: "\f02d"; font-family: "Font Awesome 5 Pro", "Font Awesome 5 Free"; font-weight: 400; font-size: 17px; }
body.lwx .kb-category .card-body > .h5 { font-size: 15.5px; font-weight: 700; color: var(--lwm-text); }
body.lwx .kb-category .badge { float: none !important; order: 3; justify-self: start; grid-column: 2; margin-top: 8px; padding: 4px 9px; border-radius: 999px; background: var(--lwx-soft) !important; color: var(--lwm-muted) !important; font-size: 11.5px; font-weight: 600; }
body.lwx .kb-category .card-body p { grid-column: 2; color: var(--lwm-muted); line-height: 1.45; }
body.lwx .kb-article-item, body.lwx a.kb-article-item { color: var(--lwm-text); font-weight: 600; text-decoration: none; }
body.lwx .kb-article-item:hover { border-color: #c9cee0; color: var(--lwm-primary); }
body.lwx .kb-article-item .fa-file-alt, body.lwx .kb-article-item i { color: var(--lwm-primary); margin-right: 6px; }
body.lwx .tag-cloud, body.lwx [menuitemname="Support Knowledgebase Tag Cloud"] .card-body, body.lwx [menuitemname="Support Knowledgebase Tag Cloud"] .lwx-panel-body { display: flex; flex-wrap: wrap; gap: 6px; line-height: 1.2; }
body.lwx [menuitemname="Support Knowledgebase Tag Cloud"] a, body.lwx .tag-cloud a {
    display: inline-block; padding: 5px 10px; border-radius: 999px; background: var(--lwx-soft); color: #475467 !important; font-size: 12px !important; font-weight: 500; text-decoration: none;
}
body.lwx [menuitemname="Support Knowledgebase Tag Cloud"] a:hover, body.lwx .tag-cloud a:hover { background: var(--lwm-primary-50); color: var(--lwm-primary) !important; }

/* Announcements */
body.lwx .announcement-single blockquote, body.lwx .announcements blockquote, body.lwx .primary-content blockquote {
    margin: 10px 0 14px; padding: 0; border: 0; background: none; color: #475467; font-size: 14px; line-height: 1.65;
}
body.lwx .announcement-single blockquote p, body.lwx .primary-content blockquote p { margin: 0; }
body.lwx .announcement-single h3 a, body.lwx .announcement-single .h3 a { color: var(--lwm-text); font-weight: 800; }
body.lwx .announcement-single .btn, body.lwx .announcements .btn-default { border-radius: 9px; font-weight: 600; }

/* Service status (LWB Statut): sidebar pill, dashboard and login cards */
body.lwx .lwx-status {
    display: flex; align-items: center; gap: 10px; margin: 0 0 10px; padding: 10px 12px; border-radius: 10px;
    background: rgba(255, 255, 255, .08); color: #fff !important; font-size: 12.5px; line-height: 1.3; text-decoration: none !important;
}
body.lwx .lwx-status:hover { background: rgba(255, 255, 255, .14); }
body.lwx .lwx-status b { display: block; font-weight: 700; }
body.lwx .lwx-status small { opacity: .75; }
.lwb-dot { position: relative; flex: 0 0 auto; width: 10px; height: 10px; border-radius: 50%; background: #16a34a; }
.lwb-dot::after { content: ""; position: absolute; inset: -4px; border-radius: 50%; background: inherit; opacity: .35; animation: lwb-pulse 2s ease-out infinite; }
.lwb-dot.lwb-tone-info { background: #3b82f6; }
.lwb-dot.lwb-tone-warn { background: #f59e0b; }
.lwb-dot.lwb-tone-partial { background: #f97316; }
.lwb-dot.lwb-tone-danger { background: #ef4444; }
@keyframes lwb-pulse { 0% { transform: scale(.6); opacity: .5; } 100% { transform: scale(1.6); opacity: 0; } }
@media (prefers-reduced-motion: reduce) { .lwb-dot::after { animation: none; } }

body.lwx .lwx-statuscard { display: flex; align-items: center; gap: 16px; flex-wrap: wrap; padding: 16px 20px; }
body.lwx .lwx-statuscard-main { display: flex; align-items: center; gap: 12px; flex: 1 1 260px; min-width: 0; }
body.lwx .lwx-statuscard-main b { display: block; font-size: 15px; font-weight: 700; color: var(--lwm-text); }
body.lwx .lwx-statuscard-main small { color: var(--lwm-muted); font-size: 12.5px; }
body.lwx .lwx-statuscard-chips { display: flex; flex-wrap: wrap; gap: 6px; flex: 2 1 320px; }
body.lwx .lwx-chip { display: inline-flex; align-items: center; gap: 6px; padding: 5px 10px; border-radius: 999px; background: var(--lwx-soft); font-size: 12px; font-weight: 500; color: #475467; }
body.lwx .lwx-chip i { width: 7px; height: 7px; border-radius: 50%; background: #16a34a; }
body.lwx .lwx-chip.lwb-tone-info i { background: #3b82f6; }
body.lwx .lwx-chip.lwb-tone-warn i { background: #f59e0b; }
body.lwx .lwx-chip.lwb-tone-partial i { background: #f97316; }
body.lwx .lwx-chip.lwb-tone-danger i { background: #ef4444; }
body.lwx .lwx-statuscard .lwx-btn { flex: 0 0 auto; }
body.lwx .lwx-statuscard.is-alert { border-color: #fcd34d; background: #fffbeb; }
body.lwx .lwx-login-status { max-width: 540px; margin: 18px auto 0; }

/* =====================================================================
   DESIGN PASS 3 · LWB Theme — tables, add funds, e-mails, ticket form
   ===================================================================== */
body.lwx .primary-content .table-striped tbody tr:nth-of-type(odd) { background: transparent; }
body.lwx .primary-content .table tbody tr:hover { background: #fafbfd; }
body.lwx .primary-content .table tbody th {
    background: #f9fafb; color: var(--lwm-muted); font-size: 10.5px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase;
    border-top: 0; border-bottom: 1px solid var(--lwx-line); padding: 12px 14px; white-space: nowrap;
}
body.lwx .primary-content .card > .table { border-radius: 10px; overflow: hidden; }
body.lwx .primary-content .card .card-title { font-size: 17px; font-weight: 800; }
body.lwx #payMethodList td[colspan] { padding: 28px 14px; color: var(--lwm-muted); }

/* Add funds: limits as a key / value list */
body.lwx .primary-content .card > .table td.textright { width: 50%; text-align: left; color: var(--lwm-muted); }
body.lwx .primary-content .card > .table td.textright strong { font-weight: 500; }
body.lwx .primary-content .card > .table td.textright + td { text-align: right; font-weight: 700; }
body.lwx .primary-content .card-footer { background: #fafbfc; border-top: 1px solid #eef1f6; color: var(--lwm-muted); }

/* DataTables lists (e-mails, quotes, etc.) */
body.lwx .dataTables_wrapper .listtable { padding: 0; }
body.lwx .dataTables_wrapper .dataTables_filter { padding: 14px 14px 6px; }
body.lwx .dataTables_wrapper .dataTables_filter input { min-width: 240px; }
body.lwx .dataTables_wrapper .dataTables_info { padding: 12px 14px; }
body.lwx .dataTables_wrapper .dataTables_paginate { padding: 10px 14px; }
body.lwx .dataTables_wrapper .dataTables_length { padding: 0 14px 14px; color: var(--lwm-muted); font-size: 13px; }
body.lwx .pagination { gap: 4px; }
body.lwx .pagination .page-link { border: 0; border-radius: 8px !important; color: #475467; font-weight: 600; font-size: 13px; min-width: 34px; text-align: center; background: transparent; }
body.lwx .pagination .page-link:hover { background: var(--lwx-soft); color: var(--lwm-text); }
body.lwx .pagination .page-item.active .page-link { background: var(--lwm-primary); color: #fff; }
body.lwx .pagination .page-item.disabled .page-link { color: #c0c6d4; background: transparent; }
body.lwx table.table-list .btn-sm, body.lwx #tableEmailsList .btn {
    background: #fff !important; color: var(--lwm-text) !important; border: 1px solid var(--lwx-line) !important; border-radius: 8px; font-weight: 600; font-size: 12.5px; padding: 6px 12px; box-shadow: none;
}
body.lwx table.table-list .btn-sm:hover, body.lwx #tableEmailsList .btn:hover { border-color: var(--lwm-primary) !important; color: var(--lwm-primary) !important; background: var(--lwm-primary-50) !important; }

/* Ticket form: markdown editor and attachments */
body.lwx .md-editor { border: 1px solid var(--lwx-line) !important; border-radius: 10px; overflow: hidden; box-shadow: none !important; }
body.lwx .md-editor > .md-header { background: #f9fafb; border-bottom: 1px solid var(--lwx-line); padding: 6px 8px; }
body.lwx .md-editor .btn-group { margin-right: 6px; }
body.lwx .md-editor .md-header .btn {
    background: transparent !important; border: 0 !important; border-radius: 7px !important; color: #475467 !important; box-shadow: none !important; padding: 5px 9px;
}
body.lwx .md-editor .md-header .btn:hover { background: #eef1f6 !important; color: var(--lwm-text) !important; }
body.lwx .md-editor .md-header .btn-primary, body.lwx .md-editor .md-header .btn.active { background: var(--lwm-primary-50) !important; color: var(--lwm-primary) !important; }
body.lwx .md-editor > textarea, body.lwx .md-editor .md-preview { border: 0 !important; background: #fff !important; padding: 14px 16px; font-size: 14px; }
body.lwx .md-editor > .md-footer, body.lwx .markdown-editor-status { background: #fafbfc; border-top: 1px solid #eef1f6; color: var(--lwm-muted); font-size: 12px; }
body.lwx .custom-file-label { border-radius: 10px; border-color: var(--lwx-line); color: var(--lwm-muted); }
body.lwx .custom-file-label::after { border-radius: 0 10px 10px 0; background: var(--lwx-soft); color: var(--lwm-text); font-weight: 600; }
body.lwx #ticketReplyAttachments .btn, body.lwx .btn-add-attachment, body.lwx #btnTicketAttachmentsAdd { border-radius: 9px; font-weight: 600; }
body.lwx .primary-content form .col-form-label, body.lwx .primary-content form label { font-weight: 600; font-size: 13.5px; color: var(--lwm-text); }

/* =====================================================================
   DESIGN PASS 4 · LWB Theme — service details (cPanel module panels)
   ===================================================================== */
body.lwx #tabOverview .card { border: 1px solid var(--lwx-line); border-radius: 12px; box-shadow: var(--lwx-shadow); overflow: hidden; }
body.lwx #tabOverview .card-header { background: #fff; border-bottom: 1px solid #eef1f6; padding: 14px 18px; }
body.lwx #tabOverview .card-header .card-title { font-size: 11px !important; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; color: var(--lwm-primary); }
body.lwx #tabOverview .card-body { padding: 18px; }

/* Offer / domain */
body.lwx #cPanelPackagePanel .card-body { display: flex; align-items: center; justify-content: space-between; gap: 14px; flex-wrap: wrap; text-align: left !important; }
body.lwx #cPanelPackagePanel .cpanel-package-details em { display: block; font-style: normal; font-size: 12px; color: var(--lwm-muted); }
body.lwx #cPanelPackagePanel .cpanel-package-details h4 { font-size: 20px; font-weight: 800; color: var(--lwm-text); margin: 2px 0 !important; }
body.lwx #cPanelPackagePanel .cpanel-package-details a { font-size: 13.5px; font-weight: 600; }
body.lwx #cPanelPackagePanel .card-body > p { margin: 0; }
body.lwx #cPanelPackagePanel .btn, body.lwx #cPanelExtrasPurchasePanel .btn { border-radius: 9px; font-weight: 600; }
body.lwx #cPanelExtrasPurchasePanel .card-body { text-align: left !important; width: 100%; }
body.lwx #cPanelExtrasPurchasePanel .btn { margin-top: 10px !important; }

/* Usage bars (replace the dials) */
body.lwx .cpanel-usage-stats { text-align: left !important; }
body.lwx .cpanel-usage-stats > .row { row-gap: 18px; }
body.lwx .lwb-usage-head { display: flex; justify-content: space-between; align-items: baseline; gap: 10px; margin-bottom: 8px; }
body.lwx .lwb-usage-head span { font-size: 13.5px; font-weight: 600; color: var(--lwm-text); }
body.lwx .lwb-usage-head b { font-size: 18px; font-weight: 800; color: var(--lwm-text); }
body.lwx .lwb-usage-bar { height: 8px; border-radius: 999px; background: #eef1f6; overflow: hidden; }
body.lwx .lwb-usage-bar i { display: block; height: 100%; min-width: 4px; border-radius: 999px; transition: width .6s ease; }
body.lwx .lwb-usage-ok { background: var(--lwm-primary); }
body.lwx .lwb-usage-warn { background: #f59e0b; }
body.lwx .lwb-usage-danger { background: var(--lwm-danger); }
body.lwx .lwb-usage small { display: block; margin-top: 6px; font-size: 12px; color: var(--lwm-muted); }
body.lwx .cpanel-usage-stats .limit-near { margin-top: 16px; padding-top: 12px; border-top: 1px solid #eef1f6; font-size: 12px; color: var(--lwm-muted) !important; text-align: left; }

/* Shortcuts as tiles */
body.lwx .cpanel-feature-row { row-gap: 10px; }
body.lwx .cpanel-feature-row a {
    display: flex !important; flex-direction: column; align-items: center; justify-content: center; gap: 8px; height: 100%; min-height: 96px; margin: 0 !important;
    padding: 14px 8px; border: 1px solid var(--lwx-line); border-radius: 10px; background: #fff; color: var(--lwm-text); font-size: 12.5px; font-weight: 600; text-align: center; text-decoration: none;
    transition: border-color .15s, background-color .15s, transform .15s;
}
body.lwx .cpanel-feature-row a:hover { border-color: var(--lwm-primary); background: var(--lwm-primary-50); color: var(--lwm-primary); transform: translateY(-1px); }
body.lwx .cpanel-feature-row img { width: 36px; height: 36px; object-fit: contain; }

/* Billing overview as a key / value grid */
body.lwx #cPanelBillingOverviewPanel .card-body > .row > [class*="col-"] > .row { margin: 0; padding: 10px 0; border-bottom: 1px solid #eef1f6; }
body.lwx #cPanelBillingOverviewPanel .card-body > .row > [class*="col-"] > .row:last-child { border-bottom: 0; }
body.lwx #cPanelBillingOverviewPanel .text-right { text-align: left !important; color: var(--lwm-muted); font-size: 13px; padding-left: 0; }
body.lwx #cPanelBillingOverviewPanel .text-right + [class*="col-"] { text-align: right; font-weight: 700; color: var(--lwm-text); padding-right: 0; }
body.lwx .cpanel-usage-stats > .row > .lwb-usage { flex: 0 0 100%; max-width: 100%; }
body.lwx .lwb-usage-head b { white-space: nowrap; }

/* Service details sidebar: overview and actions as icon cards (like the payment cards) */
body.lwx .lwx-panel[menuitemname="Service Details Overview"] .lwx-panel-list,
body.lwx .lwx-panel[menuitemname="Service Details Actions"] .lwx-panel-list {
    display: grid !important; grid-template-columns: repeat(auto-fit, minmax(110px, 1fr)); gap: 8px; padding: 4px 12px 12px !important;
}
body.lwx .lwx-panel[menuitemname^="Service Details"] .lwx-panel-link {
    display: block; margin: 0 !important; padding: 14px 8px 12px !important; border: 1.5px solid var(--lwm-border) !important; border-radius: var(--lwm-radius-sm) !important;
    background: var(--lwm-surface) !important; box-shadow: none !important; text-align: center; transition: border-color .15s, box-shadow .15s, background-color .15s;
}
body.lwx .lwx-panel[menuitemname^="Service Details"] .lwx-panel-link:hover { border-color: var(--lwm-border-strong) !important; box-shadow: 0 4px 14px rgba(16, 24, 40, .06) !important; }
body.lwx .lwx-panel[menuitemname^="Service Details"] .lwx-panel-link.active {
    border-color: var(--lwm-primary) !important; background: var(--lwm-primary-50) !important; box-shadow: 0 0 0 3px rgba(3, 6, 115, .08) !important;
}
body.lwx .lwx-panel[menuitemname^="Service Details"] .sidebar-menu-item-wrapper { display: flex; flex-direction: column; align-items: center; gap: 8px; }
body.lwx .lwx-panel[menuitemname^="Service Details"] .sidebar-menu-item-icon-wrapper {
    display: inline-flex; align-items: center; justify-content: center; width: 40px; height: 40px; margin: 0; border-radius: 12px;
    background: var(--lwm-primary-50); color: var(--lwm-primary);
}
body.lwx .lwx-panel[menuitemname^="Service Details"] .lwx-panel-link.active .sidebar-menu-item-icon-wrapper { background: var(--lwm-primary); color: #fff; }
body.lwx .lwx-panel[menuitemname^="Service Details"] .sidebar-menu-item-icon { font-size: 16px; width: auto; color: inherit !important; margin: 0 !important; }
body.lwx .lwx-panel[menuitemname^="Service Details"] .sidebar-menu-item-label { font-size: 12.5px; font-weight: 600; line-height: 1.3; color: var(--lwm-text); white-space: normal; }
body.lwx .lwx-panel[menuitemname^="Service Details"] .lwx-panel-link.active .sidebar-menu-item-label { color: var(--lwm-primary); }
body.lwx .lwx-panel[menuitemname^="Service Details"] .lwx-panel-link::before,
body.lwx .lwx-panel[menuitemname^="Service Details"] .lwx-panel-link::after { display: none !important; }
body.lwx .lwx-panel[menuitemname^="Service Details"] .sidebar-menu-item-badge { display: none; }
/* Clearer icons */
body.lwx .lwx-panel[menuitemname^="Service Details"] [menuitemname="Information"] .sidebar-menu-item-icon::before { content: "\f05a"; }
body.lwx .lwx-panel[menuitemname^="Service Details"] [menuitemname="Downloads"] .sidebar-menu-item-icon::before { content: "\f019"; }
body.lwx .lwx-panel[menuitemname^="Service Details"] [menuitemname="Addons"] .sidebar-menu-item-icon::before { content: "\f12e"; }
body.lwx .lwx-panel[menuitemname^="Service Details"] [menuitemname="cpanel"] .sidebar-menu-item-icon::before { content: "\f3fd"; }
body.lwx .lwx-panel[menuitemname^="Service Details"] [menuitemname="webmail"] .sidebar-menu-item-icon::before { content: "\f0e0"; }
body.lwx .lwx-panel[menuitemname^="Service Details"] [menuitemname="Upgrade/Downgrade"] .sidebar-menu-item-icon::before { content: "\f201"; }
body.lwx .lwx-panel[menuitemname^="Service Details"] [menuitemname="Cancel"] .sidebar-menu-item-icon::before { content: "\f05e"; }
body.lwx .lwx-panel[menuitemname^="Service Details"] .loading { position: absolute; }

/* Service details cards: coloured icons (img/actions/*.svg) */
body.lwx .lwx-panel[menuitemname^="Service Details"] .sidebar-menu-item-icon-wrapper { width: 44px; height: 44px; border-radius: 12px; background: transparent no-repeat center / 44px 44px; }
body.lwx .lwx-panel[menuitemname^="Service Details"] .lwx-panel-link.active .sidebar-menu-item-icon-wrapper { background-color: transparent; box-shadow: 0 0 0 3px #fff, 0 0 0 5px var(--lwm-primary); }
body.lwx .lwx-panel[menuitemname^="Service Details"] [menuitemname="Information"] .sidebar-menu-item-icon-wrapper { background-image: url(../img/actions/info.svg) !important; }
body.lwx .lwx-panel[menuitemname^="Service Details"] [menuitemname="Downloads"] .sidebar-menu-item-icon-wrapper { background-image: url(../img/actions/downloads.svg) !important; }
body.lwx .lwx-panel[menuitemname^="Service Details"] [menuitemname="Addons"] .sidebar-menu-item-icon-wrapper { background-image: url(../img/actions/addons.svg) !important; }
body.lwx .lwx-panel[menuitemname^="Service Details"] [menuitemname="cpanel"] .sidebar-menu-item-icon-wrapper { background-image: url(../img/actions/cpanel.svg) !important; }
body.lwx .lwx-panel[menuitemname^="Service Details"] [menuitemname="webmail"] .sidebar-menu-item-icon-wrapper { background-image: url(../img/actions/webmail.svg) !important; }
body.lwx .lwx-panel[menuitemname^="Service Details"] [menuitemname="Change Password"] .sidebar-menu-item-icon-wrapper { background-image: url(../img/actions/password.svg) !important; }
body.lwx .lwx-panel[menuitemname^="Service Details"] [menuitemname="Upgrade/Downgrade"] .sidebar-menu-item-icon-wrapper { background-image: url(../img/actions/upgrade.svg) !important; }
body.lwx .lwx-panel[menuitemname^="Service Details"] [menuitemname="Cancel"] .sidebar-menu-item-icon-wrapper { background-image: url(../img/actions/cancel.svg) !important; }
body.lwx .lwx-panel[menuitemname^="Service Details"] [menuitemname="zoneeditor"] .sidebar-menu-item-icon-wrapper { background-image: url(../img/actions/dns.svg) !important; }
body.lwx .lwx-panel[menuitemname^="Service Details"] [menuitemname="zoneeditor"] .sidebar-menu-item-icon,
body.lwx .lwx-panel[menuitemname^="Service Details"] [menuitemname="Information"] .sidebar-menu-item-icon,
body.lwx .lwx-panel[menuitemname^="Service Details"] [menuitemname="Downloads"] .sidebar-menu-item-icon,
body.lwx .lwx-panel[menuitemname^="Service Details"] [menuitemname="Addons"] .sidebar-menu-item-icon,
body.lwx .lwx-panel[menuitemname^="Service Details"] [menuitemname="cpanel"] .sidebar-menu-item-icon,
body.lwx .lwx-panel[menuitemname^="Service Details"] [menuitemname="webmail"] .sidebar-menu-item-icon,
body.lwx .lwx-panel[menuitemname^="Service Details"] [menuitemname="Change Password"] .sidebar-menu-item-icon,
body.lwx .lwx-panel[menuitemname^="Service Details"] [menuitemname="Upgrade/Downgrade"] .sidebar-menu-item-icon,
body.lwx .lwx-panel[menuitemname^="Service Details"] [menuitemname="Cancel"] .sidebar-menu-item-icon { visibility: hidden; }

/* =====================================================================
   DESIGN PASS 5 · LWB Theme — order process (store → configure → cart → checkout)
   ===================================================================== */

/* Product features: one regular checklist for every offer */
body.lwx #order-standard_cart .lwb-features { list-style: none; margin: 0; padding: 0 !important; }
body.lwx #order-standard_cart .lwb-features li { position: relative; padding: 0 0 0 26px; margin: 0 0 9px; font-size: 13.5px; line-height: 1.45; color: #344054; }
body.lwx #order-standard_cart .lwb-features li:last-child { margin-bottom: 0; }
body.lwx #order-standard_cart .lwb-features li::before {
    content: "\f00c"; font-family: "Font Awesome 5 Pro", "Font Awesome 5 Free"; font-weight: 900; position: absolute; left: 0; top: 2px;
    display: inline-flex; align-items: center; justify-content: center; width: 17px; height: 17px; border-radius: 50%;
    background: var(--lwm-ok-50); color: var(--lwm-ok); font-size: 9px;
}
body.lwx #order-standard_cart .products .product div.product-desc { line-height: 1.45; }
body.lwx #order-standard_cart .product-info .lwb-features { columns: 2; column-gap: 24px; margin-top: 10px; }
body.lwx #order-standard_cart .product-info .lwb-features li { break-inside: avoid; }
@media (max-width: 575.98px) { body.lwx #order-standard_cart .product-info .lwb-features { columns: 1; } }
body.lwx #order-standard_cart .product-info { padding: 18px 20px; }

/* Add-ons (product and domain) as selectable cards */
body.lwx #order-standard_cart .addon-products { row-gap: 14px; }
body.lwx #order-standard_cart .panel-addon {
    display: flex; flex-direction: column; height: 100%; margin: 0 !important; border: 1.5px solid var(--lwm-border) !important; border-radius: var(--lwm-radius-sm) !important;
    background: var(--lwm-surface); box-shadow: none !important; overflow: hidden; cursor: pointer; transition: border-color .15s, box-shadow .15s;
}
body.lwx #order-standard_cart .panel-addon:hover { border-color: var(--lwm-border-strong) !important; box-shadow: 0 4px 14px rgba(16, 24, 40, .06) !important; }
body.lwx #order-standard_cart .panel-addon .panel-body {
    flex: 1; padding: 16px 16px 12px !important; text-align: left !important; font-size: 13px; line-height: 1.5; color: var(--lwm-muted);
}
body.lwx #order-standard_cart .panel-addon .panel-body label { display: flex; align-items: center; gap: 10px; margin: 0 0 4px; font-size: 14.5px; font-weight: 700; color: var(--lwm-text); cursor: pointer; }
body.lwx #order-standard_cart .panel-addon .panel-body label + br { display: none; }
body.lwx #order-standard_cart .panel-addon .panel-body img { max-height: 28px; width: auto; margin-right: 2px; }
body.lwx #order-standard_cart .panel-addon .panel-price {
    margin: 0 16px; padding: 10px 0 0; border-top: 1px solid #eef1f6; background: none !important; text-align: left;
    font-size: 15px; font-weight: 800; color: var(--lwm-primary);
}
body.lwx #order-standard_cart .panel-addon .panel-add {
    margin: 10px 16px 16px; padding: 9px 12px; border-radius: 9px; background: var(--lwx-soft) !important; color: var(--lwm-text) !important;
    font-size: 13px; font-weight: 700; text-align: center; transition: background-color .15s, color .15s;
}
body.lwx #order-standard_cart .panel-addon:hover .panel-add { background: var(--lwm-primary-50) !important; color: var(--lwm-primary) !important; }
body.lwx #order-standard_cart .panel-addon-selected { border-color: var(--lwm-primary) !important; background: var(--lwm-primary-50); box-shadow: 0 0 0 3px rgba(3, 6, 115, .08) !important; }
body.lwx #order-standard_cart .panel-addon-selected .panel-add { background: var(--lwm-primary) !important; color: #fff !important; }

/* Domain configuration */
body.lwx #order-standard_cart #frmConfigureDomains .sub-heading + .row, body.lwx #order-standard_cart .domain-addon-container { margin-bottom: 8px; }
body.lwx #order-standard_cart #frmConfigureDomains .text-success { color: var(--lwm-ok) !important; font-weight: 600; }

/* "Questions?" note */
body.lwx #order-standard_cart .info-text-sm {
    display: flex; align-items: center; justify-content: center; gap: 8px; flex-wrap: wrap; margin-top: 18px; padding: 12px 16px;
    border: 1px dashed var(--lwm-border-strong) !important; border-radius: 10px; background: transparent !important; color: var(--lwm-muted) !important; font-size: 13px;
}
body.lwx #order-standard_cart .info-text-sm i { color: var(--lwm-primary); }
body.lwx #order-standard_cart .info-text-sm .alert-link { color: var(--lwm-primary); font-weight: 700; }

/* Domain registrant contact (checkout) */
body.lwx #order-standard_cart #inputDomainContact { max-width: 420px; }
body.lwx #order-standard_cart #inputDomainContact.form-control { margin: 0; }
body.lwx #order-standard_cart #frmCheckout .offset-sm-3:has(#inputDomainContact) { margin-left: 0; flex: 0 0 100%; max-width: 100%; }
body.lwx #order-standard_cart #frmCheckout .sub-heading + p.small.text-muted { text-align: left !important; font-size: 13px; margin-bottom: 10px; }

/* Domain choice: www. prefix and TLD */
body.lwx #order-standard_cart .domain-selection-options .input-group-text, body.lwx #order-standard_cart .domain-selection-options .input-group-addon {
    background: var(--lwx-soft); border-color: var(--lwm-border); color: var(--lwm-muted); font-weight: 600; border-radius: 10px 0 0 10px;
}
body.lwx #order-standard_cart .domain-selection-options .form-control { border-color: var(--lwm-border); min-height: 42px; }
body.lwx #order-standard_cart .domain-selection-options .btn { min-height: 42px; border-radius: 10px; padding: 0 20px; }

/* Cart review: quantity, promo code */
body.lwx #order-standard_cart .view-cart-items .item-qty input { max-width: 64px; margin: 0 auto 6px; border-radius: 9px; border-color: var(--lwm-border); min-height: 36px; }
body.lwx #order-standard_cart .view-cart-items .item-qty .btn-xs {
    display: block; margin: 0 auto; padding: 4px 10px; border: 1px solid var(--lwx-line); border-radius: 8px; background: #fff; color: var(--lwm-text);
    font-size: 11.5px; font-weight: 600; line-height: 1.3; white-space: normal;
}
body.lwx #order-standard_cart .view-cart-items .item-qty .btn-xs:hover { border-color: var(--lwm-primary); color: var(--lwm-primary); }
body.lwx #order-standard_cart .view-cart-items .item:hover { background: #fafbfd; }
body.lwx #order-standard_cart .view-cart-tabs .nav-tabs { display: none; }
body.lwx #order-standard_cart .view-cart-tabs .tab-content { margin-top: 16px; padding: 16px; }
body.lwx #order-standard_cart .view-cart-tabs .tab-content::before { content: "Code promo"; display: block; margin-bottom: 10px; font-size: 11px; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; color: var(--lwm-primary); }
body.lwx #order-standard_cart .view-cart-tabs .promo form { display: flex; gap: 10px; flex-wrap: wrap; }
body.lwx #order-standard_cart .view-cart-tabs .promo .form-group { flex: 1 1 240px; margin: 0; }
body.lwx #order-standard_cart .view-cart-tabs .promo .btn { width: auto !important; flex: 0 0 auto; border-radius: 10px; padding: 0 20px; min-height: 42px; font-weight: 700; background: var(--lwm-primary); color: #fff; border: 0; }
body.lwx #order-standard_cart .view-cart-tabs .promo .field { min-height: 42px; border-radius: 10px; }
body.lwx #order-standard_cart .info-text-sm { display: block !important; text-align: center; }
body.lwx #order-standard_cart .info-text-sm i { margin-right: 6px; }
body.lwx #order-standard_cart .view-cart-tabs .promo .btn, body.lwx #order-standard_cart .view-cart-tabs .promo .btn:hover { background: var(--lwm-primary) !important; color: #fff !important; border: 0 !important; }
body.lwx #order-standard_cart .view-cart-items .item { background: #fff !important; }
body.lwx #order-standard_cart .view-cart-items .item:hover { background: #fafbfd !important; }

/* Dashboard stats: long amounts wrap instead of being cut */
body.lwx .lwx-stat div span { white-space: normal !important; overflow: visible !important; text-overflow: clip !important; }

/* === Boutique mobile (audit 10/2026) ============================== */
/* Onglets mobiles : les 5 onglets tiennent sur l'écran (icône au-dessus du texte). */
@media (max-width: 575.98px) {
    body.lwx .lwx-mtabs { gap: 2px; padding: 0 6px; overflow-x: hidden; }
    body.lwx .lwx-mtabs a {
        flex: 1 1 0; min-width: 0; flex-direction: column; justify-content: center; gap: 3px;
        padding: 8px 2px 9px; font-size: 11.5px; line-height: 1.2; text-align: center;
    }
    body.lwx .lwx-mtabs a i { font-size: 16px; margin: 0 !important; }
}
/* Aide, annonces… : le contenu passe avant la colonne latérale sur mobile. */
@media (max-width: 991.98px) {
    body.lwx .row > .lwx-aside { order: 2; }
    body.lwx .row > .primary-content { order: 1; }
    body.lwx .lwx-aside .sidebar { position: static; }
}
/* Panier : catégories et actions en une ligne compacte au lieu de deux grands blocs. */
@media (max-width: 991.98px) {
    body.lwx #order-standard_cart .sidebar-collapsed { display: grid !important; grid-template-columns: 1fr 1fr; gap: 8px; margin-bottom: 14px; }
    body.lwx #order-standard_cart .sidebar-collapsed .card,
    body.lwx #order-standard_cart .sidebar-collapsed .panel { margin: 0 !important; border: 0; box-shadow: none; background: transparent; }
    body.lwx #order-standard_cart .sidebar-collapsed .card-header,
    body.lwx #order-standard_cart .sidebar-collapsed .panel-heading { display: none; }
    body.lwx #order-standard_cart .sidebar-collapsed .card-body,
    body.lwx #order-standard_cart .sidebar-collapsed .panel-body { padding: 0 !important; }
    body.lwx #order-standard_cart .sidebar-collapsed select { height: 42px; font-size: 13px; padding-left: 10px; }
}
/* Configuration de l'offre : la liste des cycles ne déborde plus de l'écran. */
body.lwx #order-standard_cart select,
body.lwx #order-standard_cart .form-control { max-width: 100%; }
body.lwx #order-standard_cart #inputBillingcycle { width: 100%; min-width: 0; text-overflow: ellipsis; }
body.lwx #order-standard_cart .secondary-cart-body,
body.lwx #order-standard_cart .cart-body { min-width: 0; }
@media (max-width: 991.98px) {
    body.lwx #order-standard_cart #scrollingPanelContainer,
    body.lwx #order-standard_cart #orderSummary { position: static !important; top: auto !important; transform: none !important; }
}
/* Domaine inclus dans l'offre (voir includes/hooks/lewebmax_storefront.php). */
body.lwx #order-standard_cart .lwb-free-domain { color: #0f8a4b !important; font-weight: 800; }

/* Sécurité du compte (module LWB IP) : dernières connexions sur le tableau de bord. */
body.lwx .lwx-ipcard .lwx-card-head h3 i { color: var(--lwm-primary); margin-right: 6px; }
body.lwx .lwx-ipcard.is-alert { border-color: #fdb022 !important; }
body.lwx .lwx-ipcard .lwx-notice { margin: 0 0 10px !important; border-radius: 12px; }
body.lwx .lwx-iplist { list-style: none; margin: 0 0 12px; padding: 0; }
body.lwx .lwx-iplist li { display: flex; align-items: center; gap: 12px; padding: 10px 0; border-bottom: 1px solid var(--lwm-border); }
body.lwx .lwx-iplist li:last-child { border-bottom: 0; }
body.lwx .lwx-iplist li > div { flex: 1; min-width: 0; }
body.lwx .lwx-iplist b { display: block; font-weight: 700; }
body.lwx .lwx-iplist small { display: block; color: var(--lwm-muted); font-size: 12.5px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

/* === Téléphone (audit 13/10/2026) ================================= */
/* Onglets mobiles : libellé court sous 576 px (Accueil, Factures, Aide) pour que les 7 onglets du client tiennent. */
body.lwx .lwx-mtabs .lwx-ts { display: none; }
@media (max-width: 575.98px) {
    body.lwx .lwx-mtabs .lwx-tl { display: none; }
    body.lwx .lwx-mtabs .lwx-ts { display: inline; }
    body.lwx .lwx-mtabs:has(> a:nth-child(6)) a { font-size: 10.5px; letter-spacing: -.01em; }
    /* Domaines : les actions groupées passent à la ligne au lieu de pousser la page. */
    body.lwx .lwx-bulk .btn-group { display: flex; flex-wrap: wrap; gap: 6px; max-width: 100%; }
    body.lwx .lwx-bulk .btn-group > .btn, body.lwx .lwx-bulk .btn-group > .btn-group > .btn { border-radius: 8px !important; margin: 0 !important; }
    /* Tableaux (e-mails, devis…) : plus compacts, le bouton passe sur deux lignes. */
    body.lwx table.table-list thead th { padding: 10px 6px; }
    body.lwx table.table-list tbody td { padding: 10px 6px; font-size: 13px; }
    body.lwx table.table-list .btn-sm, body.lwx #tableEmailsList .btn { white-space: normal; padding: 5px 8px; font-size: 12px; line-height: 1.2; }
    /* Montants des cartes (ex. « 1,961.00 USD ») : jamais coupés. */
    body.lwx .lwx-stat b { white-space: normal; overflow: visible; text-overflow: clip; overflow-wrap: anywhere; font-size: 19px; }
    /* Carte « Sécurité du compte » : le bouton du bas suffit, l'en-tête reste sur une ligne. */
    body.lwx .lwx-ipcard .lwx-card-head > a { display: none; }
}
@media (max-width: 340px) {
    body.lwx .lwx-mtabs { overflow-x: auto; }
    body.lwx .lwx-mtabs a { flex: 0 0 auto; min-width: 52px; }
}
/* Sous-onglets du compte sur mobile (Coordonnées, Connexions et IP, Sécurité…). */
body.lwx .lwx-msub { display: flex; gap: 6px; overflow-x: auto; scrollbar-width: none; padding: 10px 12px; background: var(--lwm-bg); border-bottom: 1px solid var(--lwm-border); }
body.lwx .lwx-msub::-webkit-scrollbar { display: none; }
body.lwx .lwx-msub a { flex: none; padding: 7px 13px; border-radius: 999px; border: 1px solid var(--lwm-border); background: #fff; color: var(--lwm-text) !important; font-size: 13px; font-weight: 600; white-space: nowrap; text-decoration: none !important; }
body.lwx .lwx-msub a.active { background: var(--lwm-primary); border-color: var(--lwm-primary); color: #fff !important; }


/* Renouvellement des services : le bouton flottant du filtre sortait de .header-lined (display:block) et comprimait les colonnes. flow-root contient les flottants. */
body.lwx #order-standard_cart .header-lined { display: flow-root; }