/* ==========================================================================
   WhyShared client area — custom.css
   Loaded after the Six base stylesheet (all.min.css). Matches whyshared.com
   ("Cobalt & Paper"). No animation: the client area favours speed.

    1. Tokens & base          9. Labels, badges, alerts
    2. App shell + sidebar   10. Tabs, pagination, dropdowns, modals
    3. Top bar               11. Dashboard
    4. Public header/footer  12. Service, domain, ticket, KB pages
    5. Page layout           13. Login, register, password
    6. Page header           14. Order forms (comparison + standard cart)
    7. Panels & lists        15. Responsive
    8. Buttons, forms, tables
   ========================================================================== */

/* 1. Tokens & base -------------------------------------------------------- */
:root {
    --paper: #f4f2ec;
    --paper-2: #ebe8e0;
    --card: #ffffff;
    --ink: #0c0e13;
    --ink-2: #2a2e37;
    --ink-3: #5a5f6a;
    --ink-4: #62676f;
    --rule: rgba(12, 14, 19, .12);
    --rule-2: rgba(12, 14, 19, .2);
    --cobalt: #0052e0;
    --cobalt-deep: #003cae;
    --cobalt-wash: #e2eafa;
    --marigold: #f4a51c;
    --marigold-wash: #fdf0d5;
    --green: #0d7a3c;
    --green-wash: #e1f3e8;
    --red: #b42318;
    --red-wash: #fbe7e5;
    --amber: #8a5300;
    --night: #0c0e13;
    --night-muted: #9a9ea8;
    --night-rule: rgba(237, 235, 229, .12);

    --font-display: 'Bricolage Grotesque', 'Geist', system-ui, sans-serif;
    --font: 'Geist', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
    --font-mono: 'Geist Mono', ui-monospace, Menlo, Consolas, monospace;

    --r-sm: 8px;
    --r-md: 12px;
    --r-lg: 16px;
    --sidebar-w: 252px;
    --topbar-h: 64px;
    --shadow: 0 1px 0 rgba(12, 14, 19, .04), 0 12px 32px -20px rgba(12, 14, 19, .3);
}

/* The client area is intentionally static */
.ws *, .ws *::before, .ws *::after { transition: none !important; animation-duration: 0s !important; }
.ws .fa-spin, .ws .fa-spinner, .ws .fa-circle-notch { animation-duration: 1s !important; }

html { -webkit-text-size-adjust: 100%; }
body.ws {
    background: var(--paper);
    color: var(--ink-2);
    font-family: var(--font);
    font-size: 15px;
    line-height: 1.6;
    -webkit-font-smoothing: antialiased;
}
.ws input, .ws button, .ws select, .ws textarea { font-family: var(--font); }
.ws h1, .ws h2, .ws h3, .ws h4, .ws h5, .ws h6 {
    font-family: var(--font-display);
    color: var(--ink);
    font-weight: 700;
    letter-spacing: -.02em;
}
.ws h4, .ws h5, .ws h6 { font-family: var(--font); letter-spacing: -.01em; font-weight: 600; }
.ws a { color: var(--cobalt); }
.ws a:hover, .ws a:focus { color: var(--cobalt-deep); }
.ws hr { border-color: var(--rule); }
.ws small, .ws .small { color: var(--ink-3); }
.ws .text-muted { color: var(--ink-3); }
.ws .text-success { color: var(--green); }
.ws .text-danger { color: var(--red); }
.ws .text-warning { color: var(--amber); }
.ws .text-info, .ws .text-primary { color: var(--cobalt); }
.ws code, .ws kbd, .ws pre { font-family: var(--font-mono); }
.ws code { background: var(--paper-2); color: var(--ink); border-radius: 4px; }
.ws ::selection { background: var(--cobalt); color: #fff; }
.ws :focus-visible { outline: 2px solid var(--cobalt); outline-offset: 2px; }

.ws-skip { position: absolute; left: 12px; top: -60px; z-index: 2000; padding: 8px 14px; border-radius: var(--r-sm); background: var(--ink); color: #fff !important; font-weight: 600; }
.ws-skip:focus { top: 12px; }

.ws-logo { display: inline-flex; align-items: center; }
.ws-logo img { height: 28px; width: auto; }
.ws-logo-text, .ws-wordmark { font-family: var(--font-display); font-size: 22px; font-weight: 700; color: var(--ink); letter-spacing: -.03em; }
.ws-wordmark span { color: var(--cobalt); }

.ws-icon-btn {
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 40px; height: 40px;
    border: 1px solid var(--rule);
    border-radius: var(--r-sm);
    background: var(--card);
    color: var(--ink) !important;
    font-size: 15px;
}
.ws-icon-btn:hover { border-color: var(--rule-2); background: var(--paper); }
.ws-count {
    position: absolute;
    top: -6px; right: -6px;
    min-width: 18px; height: 18px;
    padding: 0 5px;
    border-radius: 9px;
    background: var(--cobalt);
    color: #fff;
    font-family: var(--font-mono);
    font-size: 11px;
    line-height: 18px;
    text-align: center;
}

/* 2. App shell + sidebar --------------------------------------------------- */
.ws-shell { min-height: 100vh; }
.ws-sidebar {
    position: fixed;
    top: 0; bottom: 0; left: 0;
    z-index: 1030;
    width: var(--sidebar-w);
    display: flex;
    flex-direction: column;
    background: var(--card);
    border-right: 1px solid var(--rule);
}
.ws-sidebar-brand {
    display: flex;
    align-items: center;
    justify-content: space-between;
    height: var(--topbar-h);
    padding: 0 20px;
    border-bottom: 1px solid var(--rule);
}
.ws-sidebar-close { display: none; }
.ws-nav { flex: 1; overflow-y: auto; padding: 14px 12px; }
.ws-nav-label {
    margin: 18px 10px 6px;
    font-family: var(--font-mono);
    font-size: 11px;
    font-weight: 500;
    letter-spacing: .08em;
    text-transform: uppercase;
    color: var(--ink-4);
}
.ws-nav-link {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 9px 12px;
    margin-bottom: 2px;
    border-radius: var(--r-sm);
    color: var(--ink-2) !important;
    font-size: 14.5px;
    font-weight: 500;
    text-decoration: none !important;
}
.ws-nav-link i { width: 18px; color: var(--ink-4); font-size: 15px; text-align: center; }
.ws-nav-link:hover { background: var(--paper); color: var(--ink) !important; }
.ws-nav-link.active { background: var(--cobalt-wash); color: var(--cobalt) !important; font-weight: 600; }
.ws-nav-link.active i { color: var(--cobalt); }
.ws-sidebar-foot { padding: 12px; border-top: 1px solid var(--rule); }
.ws-nav-quiet { font-size: 14px; color: var(--ink-3) !important; }

.ws-scrim { display: none; }

.ws-main {
    margin-left: var(--sidebar-w);
    min-height: 100vh;
    display: flex;
    flex-direction: column;
}

/* 3. Top bar ---------------------------------------------------------------- */
.ws-topbar {
    position: sticky;
    top: 0;
    z-index: 1020;
    display: flex;
    align-items: center;
    gap: 14px;
    height: var(--topbar-h);
    padding: 0 32px;
    background: var(--paper);
    border-bottom: 1px solid var(--rule);
}
.ws-menu-btn, .ws-topbar-logo { display: none; }
.ws-topbar-logo img { height: 24px; }
.ws-topbar-actions { display: flex; align-items: center; gap: 10px; margin-left: auto; }
.ws-user { position: relative; }
.ws-user-btn {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    height: 40px;
    padding: 0 12px 0 5px;
    border: 1px solid var(--rule);
    border-radius: 999px;
    background: var(--card);
    color: var(--ink);
    font-weight: 600;
    font-size: 14px;
}
.ws-user-btn:hover { border-color: var(--rule-2); }
.ws-avatar {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 30px; height: 30px;
    border-radius: 50%;
    background: var(--ink);
    color: #fff;
    font-family: var(--font-mono);
    font-size: 13px;
}
.ws-caret { font-size: 10px; color: var(--ink-4); }
.ws-admin-return { white-space: nowrap; }

/* 4. Public header + footer ---------------------------------------------- */
.ws-header {
    position: sticky;
    top: 0;
    z-index: 1020;
    background: rgba(244, 242, 236, .97);
    border-bottom: 1px solid var(--rule);
}
.ws-header-in {
    display: flex;
    align-items: center;
    gap: 28px;
    max-width: 1240px;
    height: 68px;
    margin: 0 auto;
    padding: 0 24px;
}
.ws-header-nav { display: flex; gap: 4px; }
.ws-header-nav a, .ws-header-login {
    padding: 8px 12px;
    border-radius: var(--r-sm);
    color: var(--ink-2) !important;
    font-size: 15px;
    font-weight: 500;
    text-decoration: none !important;
}
.ws-header-nav a:hover, .ws-header-login:hover { background: rgba(12, 14, 19, .05); color: var(--ink) !important; }
.ws-header-nav a.active, .ws-header-login.active { color: var(--cobalt) !important; }
.ws-header-actions { display: flex; align-items: center; gap: 10px; margin-left: auto; }
.ws-public-menu-btn { display: none; }

.ws-footer { background: var(--night); color: var(--night-muted); margin-top: 80px; }
.ws-footer-in {
    display: grid;
    grid-template-columns: 2fr repeat(3, 1fr);
    gap: 40px;
    max-width: 1240px;
    margin: 0 auto;
    padding: 56px 24px 40px;
}
.ws-footer .ws-wordmark { color: #fff; }
.ws-footer .ws-wordmark span { color: #7aa2ff; }
.ws-footer-brand p { max-width: 36ch; margin-top: 10px; font-size: 14px; }
.ws-footer-loc { color: #edebe5; }
.ws-footer-loc i { color: #7aa2ff; margin-right: 6px; }
.ws-footer-col h3 {
    margin: 0 0 14px;
    font-family: var(--font-mono);
    font-size: 11px;
    font-weight: 500;
    letter-spacing: .08em;
    text-transform: uppercase;
    color: #edebe5;
}
.ws-footer-col a { display: block; padding: 4px 0; color: var(--night-muted) !important; font-size: 14px; }
.ws-footer-col a:hover { color: #fff !important; }
.ws-footer-bottom {
    display: flex;
    justify-content: space-between;
    gap: 16px;
    flex-wrap: wrap;
    max-width: 1240px;
    margin: 0 auto;
    padding: 20px 24px 28px;
    border-top: 1px solid var(--night-rule);
    font-size: 13px;
}
.ws-footer-bottom p { margin: 0; }
.ws-pay { font-family: var(--font-mono); font-size: 12px; color: #edebe5; }

.ws-app-footer {
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 10px 20px;
    margin-top: auto;
    padding: 20px 32px 28px;
    border-top: 1px solid var(--rule);
    font-size: 13px;
    color: var(--ink-3);
}
.ws-app-footer p { margin: 0; }
.ws-app-footer nav { display: flex; flex-wrap: wrap; gap: 16px; }
.ws-app-footer a { color: var(--ink-3); }

/* 5. Page layout ------------------------------------------------------------ */
.ws section#main-body {
    background: transparent;
    padding: 32px 0 48px;
    min-height: 0;
}
.ws #main-body > .container { width: auto; max-width: 1240px; padding: 0 24px; }
.ws-app #main-body > .container { max-width: 1320px; padding: 0 32px; }
.ws #main-body > .container-fluid.without-padding { padding: 0; }

.ws-page { display: block; }
.ws-page-with-sidebar {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 290px;
    gap: 28px;
    align-items: start;
}
.ws .main-content { min-width: 0; float: none; width: auto; padding: 0; }
.ws-context .sidebar { float: none; width: auto; padding: 0; }

/* 6. Page header ------------------------------------------------------------ */
.ws .header-lined { margin: 0 0 24px; padding: 0; border: 0; }
.ws .header-lined h1 {
    margin: 0;
    padding: 0;
    border: 0;
    color: var(--ink);
    font-size: 30px;
    line-height: 1.15;
    letter-spacing: -.03em;
}
.ws .header-lined h1 small { display: block; margin-top: 6px; font-family: var(--font); font-size: 15px; letter-spacing: 0; color: var(--ink-3); }
.ws .breadcrumb {
    margin: 10px 0 0;
    padding: 0;
    background: none;
    font-family: var(--font-mono);
    font-size: 12px;
}
.ws .header-lined .breadcrumb { margin: 10px 0 0; padding: 0; border: 0; }
.ws .breadcrumb > li + li::before { content: "/"; color: var(--ink-4); padding: 0 8px; }
.ws .breadcrumb a { color: var(--ink-3); }
.ws .breadcrumb > .active { color: var(--ink); }

/* 7. Panels & list groups --------------------------------------------------- */
.ws .panel, .ws .card {
    margin-bottom: 20px;
    background: var(--card);
    border: 1px solid var(--rule);
    border-radius: var(--r-md);
    box-shadow: none;
}
.ws .panel > .panel-heading, .ws .card > .card-header {
    padding: 14px 18px;
    background: var(--card);
    border-bottom: 1px solid var(--rule);
    border-radius: var(--r-md) var(--r-md) 0 0;
    color: var(--ink);
}
.ws .panel-title, .ws .card-title {
    font-family: var(--font);
    font-size: 15px;
    font-weight: 600;
    letter-spacing: -.01em;
    color: var(--ink);
}
.ws .panel-body { padding: 18px; }
.ws .panel-footer {
    padding: 12px 18px;
    background: #fbfaf7;
    border-top: 1px solid var(--rule);
    border-radius: 0 0 var(--r-md) var(--r-md);
}
.ws .panel-footer:empty { display: none; }
.ws .panel-primary > .panel-heading,
.ws .panel-info > .panel-heading,
.ws .panel-success > .panel-heading,
.ws .panel-warning > .panel-heading,
.ws .panel-danger > .panel-heading { background: var(--card); color: var(--ink); border-color: var(--rule); }
.ws .panel-danger { border-color: rgba(180, 35, 24, .35); }
.ws .panel-danger > .panel-heading .panel-title { color: var(--red); }
.ws .panel-success > .panel-heading .panel-title { color: var(--green); }

.ws .list-group { margin-bottom: 0; }
.ws .list-group-item {
    padding: 11px 18px;
    border: 0;
    border-top: 1px solid var(--rule);
    background: transparent;
    color: var(--ink-2);
}
.ws .panel > .list-group .list-group-item:first-child { border-top: 0; }
.ws a.list-group-item:hover, .ws a.list-group-item:focus { background: var(--paper); color: var(--ink); }
.ws .list-group-item.active, .ws .list-group-item.active:hover, .ws .list-group-item.active:focus {
    background: var(--cobalt-wash);
    color: var(--cobalt);
    font-weight: 600;
    border-color: var(--rule);
    box-shadow: inset 3px 0 0 var(--cobalt);
}
.ws .list-group-item.active .badge { background: var(--cobalt); color: #fff; }
.ws .list-group-item.disabled { color: var(--ink-4); background: transparent; }
.ws .list-group-item i { color: var(--ink-4); margin-right: 4px; }
.ws .list-group-item.active i { color: var(--cobalt); }

/* WHMCS context sub-menus (right column) */
.ws .panel-sidebar .panel-heading { padding: 12px 16px; }
.ws .panel-sidebar .panel-title { font-size: 13px; font-family: var(--font-mono); font-weight: 500; letter-spacing: .06em; text-transform: uppercase; color: var(--ink-3); }
.ws .panel-sidebar .panel-title > i:first-child { color: var(--ink-4); }
.ws .panel-minimise { color: var(--ink-4); cursor: pointer; }
.ws .panel-sidebar .list-group-item { padding: 9px 16px; font-size: 14px; }
.ws .panel-sidebar .list-group-item.active,
.ws .panel-sidebar .list-group-item.active:hover,
.ws .panel-sidebar .list-group-item.active:focus { background: var(--cobalt-wash) !important; color: var(--cobalt) !important; border-color: var(--rule); }
.ws .panel-sidebar .panel-body { padding: 14px 16px; font-size: 14px; }
.ws .sidebar .badge { background: var(--paper-2); color: var(--ink-2); }

/* 8. Buttons, forms, tables -------------------------------------------------- */
.ws .btn {
    padding: 9px 16px;
    border-radius: var(--r-sm);
    font-weight: 600;
    font-size: 14px;
    line-height: 1.35;
    box-shadow: none;
    text-shadow: none;
}
.ws .btn-lg { padding: 12px 22px; font-size: 16px; }
.ws .btn-sm { padding: 7px 12px; font-size: 13px; }
.ws .btn-xs { padding: 3px 9px; font-size: 12px; border-radius: 6px; }
.ws .btn-primary, .ws .btn-primary:focus { background: var(--cobalt); border-color: var(--cobalt); color: #fff; }
.ws .btn-primary:hover, .ws .btn-primary:active, .ws .btn-primary.active, .ws .open > .dropdown-toggle.btn-primary { background: var(--cobalt-deep); border-color: var(--cobalt-deep); color: #fff; }
.ws .btn-default, .ws .btn-default:focus { background: var(--card); border-color: var(--rule-2); color: var(--ink); }
.ws .btn-default:hover, .ws .btn-default:active, .ws .btn-default.active, .ws .open > .dropdown-toggle.btn-default { background: var(--paper); border-color: var(--ink); color: var(--ink); }
.ws .btn-success, .ws .btn-success:focus { background: var(--ink); border-color: var(--ink); color: #fff; }
.ws .btn-success:hover, .ws .btn-success:active { background: #000; border-color: #000; color: #fff; }
.ws .btn-info, .ws .btn-info:focus { background: var(--cobalt-wash); border-color: var(--cobalt-wash); color: var(--cobalt); }
.ws .btn-info:hover, .ws .btn-info:active { background: #cfdcf6; border-color: #cfdcf6; color: var(--cobalt-deep); }
.ws .btn-warning, .ws .btn-warning:focus { background: var(--marigold); border-color: var(--marigold); color: var(--ink); }
.ws .btn-warning:hover { background: #e39612; border-color: #e39612; color: var(--ink); }
.ws .btn-danger, .ws .btn-danger:focus { background: var(--card); border-color: rgba(180, 35, 24, .45); color: var(--red); }
.ws .btn-danger:hover, .ws .btn-danger:active { background: var(--red); border-color: var(--red); color: #fff; }
.ws .btn-link { color: var(--cobalt); font-weight: 600; }
.ws .btn.disabled, .ws .btn[disabled] { opacity: .5; }
.ws .btn-group > .btn:first-child:not(:last-child) { border-top-right-radius: 0; border-bottom-right-radius: 0; }

.ws label, .ws .control-label { font-weight: 600; font-size: 14px; color: var(--ink); }
.ws .form-control {
    height: 42px;
    padding: 9px 12px;
    border: 1px solid var(--rule-2);
    border-radius: var(--r-sm);
    background: var(--card);
    color: var(--ink);
    font-size: 15px;
    box-shadow: none;
}
.ws textarea.form-control { height: auto; }
.ws select.form-control, .ws .custom-select { padding-right: 30px; }
.ws .form-control:focus { border-color: var(--cobalt); box-shadow: 0 0 0 3px rgba(0, 82, 224, .15); }
.ws .form-control::placeholder { color: #8a8e97; }
.ws .form-control[disabled], .ws .form-control[readonly] { background: var(--paper); color: var(--ink-3); }
.ws .input-lg { height: 50px; font-size: 16px; }
.ws .input-sm { height: 34px; font-size: 13px; }
.ws .input-group-addon, .ws .input-group-text {
    background: var(--paper);
    border-color: var(--rule-2);
    color: var(--ink-3);
    border-radius: var(--r-sm);
}
.ws .input-group .form-control:first-child, .ws .input-group-addon:first-child { border-top-right-radius: 0; border-bottom-right-radius: 0; }
.ws .input-group .form-control:last-child, .ws .input-group-addon:last-child, .ws .input-group-btn:last-child > .btn { border-top-left-radius: 0; border-bottom-left-radius: 0; }
.ws .input-group-btn > .btn { height: 42px; }
.ws .help-block { color: var(--ink-3); font-size: 13px; }
.ws .has-error .form-control { border-color: var(--red); }
.ws .has-error .help-block, .ws .has-error .control-label { color: var(--red); }
.ws .has-success .form-control { border-color: var(--green); }
.ws .checkbox label, .ws .radio label { font-weight: 400; }
.ws input[type="checkbox"], .ws input[type="radio"] { accent-color: var(--cobalt); }
.ws fieldset legend, .ws .sub-heading {
    border: 0;
    margin-bottom: 14px;
    font-family: var(--font-mono);
    font-size: 12px;
    font-weight: 500;
    letter-spacing: .06em;
    text-transform: uppercase;
    color: var(--ink-3);
}
.ws .sub-heading { position: relative; height: auto; margin: 28px 0 16px; border-top: 1px solid var(--rule); text-align: left; }
.ws .sub-heading span,
.ws .sub-heading .primary-bg-color {
    position: relative;
    top: -10px;
    display: inline-block;
    padding: 0 10px 0 0;
    background: var(--paper) !important;
    color: var(--ink-3) !important;
    font-family: var(--font-mono);
    font-size: 12px;
    font-weight: 500;
    letter-spacing: .06em;
    text-transform: uppercase;
}
.ws .panel .sub-heading span, .ws .logincontainer .sub-heading span { background: var(--card) !important; }

.ws .table { color: var(--ink-2); margin-bottom: 0; }
.ws .table > thead > tr > th {
    padding: 12px 14px;
    border-bottom: 1px solid var(--rule);
    background: #fbfaf7;
    font-family: var(--font-mono);
    font-size: 11.5px;
    font-weight: 500;
    letter-spacing: .06em;
    text-transform: uppercase;
    color: var(--ink-3);
    white-space: nowrap;
}
.ws .table > tbody > tr > td, .ws .table > tbody > tr > th {
    padding: 14px;
    border-top: 1px solid var(--rule);
    vertical-align: middle;
}
.ws .table-striped > tbody > tr:nth-of-type(odd) { background: #fbfaf7; }
.ws .table-bordered, .ws .table-bordered > thead > tr > th, .ws .table-bordered > tbody > tr > td { border-color: var(--rule); }

/* DataTables lists (services, domains, invoices, tickets...) */
.ws .table-container { background: var(--card); border: 1px solid var(--rule); border-radius: var(--r-md); overflow: hidden; }
.ws .table-container .listtable { overflow-x: auto; -webkit-overflow-scrolling: touch; }
.ws .dataTables_wrapper { display: flex; flex-wrap: wrap; align-items: center; padding: 0; background: var(--card) !important; }
.ws .dataTables_wrapper > .listtable { flex: 0 0 100%; }
.ws div.dataTables_wrapper div.dataTables_length { order: 1; flex: 1 1 auto; margin: 0; padding: 12px 16px; background: transparent !important; border-top: 1px solid var(--rule); }
.ws div.dataTables_wrapper div.dataTables_paginate { order: 2; flex: 0 0 auto; margin: 0; padding: 10px 16px; background: transparent !important; border-top: 1px solid var(--rule); }
.ws div.dataTables_wrapper div.dataTables_length label { margin: 0; font-weight: 400; color: var(--ink-3); }
.ws div.dataTables_wrapper .pagination { margin: 0; }
.ws .dataTables_wrapper .listtable { display: flex; flex-wrap: wrap; align-items: center; background: var(--card); }
.ws .dataTables_wrapper .listtable > table { flex: 0 0 100%; }
.ws div.dataTables_wrapper div.dataTables_filter {
    flex: 1 1 260px;
    position: static;
    float: none;
    height: auto;
    margin: 0;
    padding: 12px 16px;
    background: transparent;
    text-align: left;
}
.ws div.dataTables_wrapper div.dataTables_filter label { display: block; width: 100%; margin: 0; height: auto; font-weight: 400; }
.ws div.dataTables_wrapper div.dataTables_filter input {
    display: block;
    width: 100% !important;
    max-width: 360px;
    height: 40px;
    margin: 0 !important;
    padding: 8px 12px 8px 36px;
    border: 1px solid var(--rule-2);
    border-radius: var(--r-sm);
    background: var(--card) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='none' stroke='%235a5f6a' stroke-width='2' viewBox='0 0 24 24'%3E%3Ccircle cx='11' cy='11' r='7'/%3E%3Cpath d='m20 20-3.5-3.5'/%3E%3C/svg%3E") no-repeat 12px center;
    font-size: 14px;
    box-shadow: none;
}
.ws div.dataTables_wrapper div.dataTables_info {
    flex: 0 0 auto;
    position: static;
    margin: 0;
    padding: 12px 16px;
    background: transparent !important;
    color: var(--ink-3) !important;
    font-family: var(--font-mono);
    font-size: 12px;
    border: 0;
    white-space: nowrap;
}
.ws table.dataTable thead > tr > th,
.ws table.dataTable thead > tr > th.sorting_asc,
.ws table.dataTable thead > tr > th.sorting_desc { border-bottom: 1px solid var(--rule) !important; }
.ws table.dataTable { border-top: 1px solid var(--rule) !important; }
.ws .dataTables_length select { width: auto; display: inline-block; height: 34px; margin: 0 6px; }
.ws table.table-list { border: 0; margin: 0 !important; width: 100% !important; }
.ws table.table-list > thead > tr > th { background: #fbfaf7; border-bottom: 1px solid var(--rule); text-align: left; }
.ws table.table-list > thead > tr > th.sorting::after,
.ws table.table-list > thead > tr > th.sorting_asc::after,
.ws table.table-list > thead > tr > th.sorting_desc::after { color: var(--ink-4); opacity: .6; }
.ws table.table-list > tbody > tr > td { background: transparent; border-top: 1px solid var(--rule); text-align: left; }
.ws table.table-list > tbody > tr > td.text-center { text-align: left; }
.ws table.table-list > tbody > tr:hover > td { background: #fbfaf7; cursor: pointer; }
.ws table.table-list strong { color: var(--ink); font-weight: 600; }
.ws table.table-list td a { font-size: 13.5px; }
.ws .table-list .dataTables_empty { padding: 32px; text-align: center !important; color: var(--ink-3); }
#tableLoading { padding: 24px; color: var(--ink-3); }

/* 9. Labels, badges, alerts --------------------------------------------------- */
.ws .label, .ws .label.status {
    display: inline-block;
    padding: 4px 9px;
    border-radius: 999px;
    background: var(--paper-2);
    color: var(--ink-2);
    font-family: var(--font-mono);
    font-size: 11.5px;
    font-weight: 500;
    letter-spacing: .02em;
    line-height: 1.3;
    text-transform: none;
    border: 0;
}
.ws .label-success, .ws .status-active, .ws .status-paid, .ws .status-completed, .ws .status-accepted, .ws .status-delivered, .ws .status-open { background: var(--green-wash); color: var(--green); }
.ws .label-warning, .ws .status-pending, .ws .status-pending-registration, .ws .status-pending-transfer, .ws .status-inprogress, .ws .status-onhold, .ws .status-customer-reply, .ws .status-grace, .ws .status-draft { background: var(--marigold-wash); color: var(--amber); }
.ws .label-danger, .ws .status-unpaid, .ws .status-overdue, .ws .status-suspended, .ws .status-fraud, .ws .status-collections, .ws .status-redemption, .ws .status-expired, .ws .status-dead, .ws .status-lost { background: var(--red-wash); color: var(--red); }
.ws .label-info, .ws .label-primary, .ws .status-answered, .ws .status-refunded { background: var(--cobalt-wash); color: var(--cobalt); }
.ws .label-default, .ws .status-terminated, .ws .status-cancelled, .ws .status-closed, .ws .status-transferred-away, .ws .status-custom { background: var(--paper-2); color: var(--ink-3); }
.ws .badge { background: var(--cobalt); color: #fff; font-family: var(--font-mono); font-weight: 500; font-size: 11px; border-radius: 999px; padding: 3px 7px; }
.ws .badge-secondary { background: var(--paper-2); color: var(--ink-2); }

.ws .alert {
    padding: 14px 16px;
    border: 1px solid transparent;
    border-radius: var(--r-md);
    font-size: 14.5px;
}
.ws .alert-success { background: var(--green-wash); border-color: rgba(13, 122, 60, .25); color: #08512a; }
.ws .alert-info { background: var(--cobalt-wash); border-color: rgba(0, 82, 224, .2); color: #0a2f78; }
.ws .alert-warning { background: var(--marigold-wash); border-color: rgba(244, 165, 28, .45); color: #5c3a00; }
.ws .alert-danger { background: var(--red-wash); border-color: rgba(180, 35, 24, .25); color: #7a1610; }
.ws .alert a:not(.btn) { color: inherit; font-weight: 600; text-decoration: underline; }
.ws .alert h2 { font-size: 17px; margin: 0 0 6px; }

/* 10. Tabs, pagination, dropdowns, modals, tooltips -------------------------- */
.ws .nav-tabs { border-bottom: 1px solid var(--rule); margin-bottom: 0; }
.ws .nav-tabs > li > a {
    margin-right: 4px;
    border: 0;
    border-bottom: 2px solid transparent;
    border-radius: 0;
    color: var(--ink-3);
    font-weight: 600;
    font-size: 14px;
    padding: 11px 14px;
}
.ws .nav-tabs > li > a:hover { background: transparent; color: var(--ink); border-color: transparent; }
.ws .nav-tabs > li.active > a, .ws .nav-tabs > li.active > a:hover, .ws .nav-tabs > li.active > a:focus { border: 0; border-bottom: 2px solid var(--cobalt); background: transparent; color: var(--cobalt); }
.ws .tab-content > .tab-pane { padding-top: 18px; }
.ws .nav-pills > li > a { border-radius: var(--r-sm); color: var(--ink-2); font-weight: 600; }
.ws .nav-pills > li.active > a, .ws .nav-pills > li.active > a:hover { background: var(--cobalt); color: #fff; }

.ws .pagination > li > a, .ws .pagination > li > span {
    margin: 0 2px;
    border: 1px solid var(--rule);
    border-radius: var(--r-sm) !important;
    color: var(--ink-2);
    background: var(--card);
    font-size: 13px;
}
.ws .pagination > li > a:hover { background: var(--paper); color: var(--ink); }
.ws .pagination > .active > a, .ws .pagination > .active > a:hover, .ws .pagination > .active > span { background: var(--ink); border-color: var(--ink); color: #fff; }
.ws .pagination > .disabled > a, .ws .pagination > .disabled > span { color: var(--ink-4); background: var(--card); }

.ws .dropdown-menu {
    padding: 6px;
    border: 1px solid var(--rule);
    border-radius: var(--r-md);
    box-shadow: 0 1px 0 rgba(12, 14, 19, .05), 0 24px 48px -24px rgba(12, 14, 19, .4);
    font-size: 14px;
    min-width: 220px;
}
.ws .dropdown-menu > li > a { padding: 8px 12px; border-radius: 6px; color: var(--ink-2); }
.ws .dropdown-menu > li > a i { color: var(--ink-4); margin-right: 6px; }
.ws .dropdown-menu > li > a:hover, .ws .dropdown-menu > li > a:focus { background: var(--paper); color: var(--ink); }
.ws .dropdown-menu > .active > a, .ws .dropdown-menu > .active > a:hover { background: var(--cobalt-wash); color: var(--cobalt); }
.ws .dropdown-menu .divider { margin: 6px 0; background: var(--rule); }
.ws .dropdown-header { padding: 8px 12px 6px; font-family: var(--font-mono); font-size: 11px; letter-spacing: .06em; text-transform: uppercase; color: var(--ink-4); }

.ws .modal-content { border: 0; border-radius: var(--r-lg); box-shadow: 0 30px 80px -30px rgba(12, 14, 19, .6); overflow: hidden; }
.ws .modal-header { padding: 16px 20px; border-bottom: 1px solid var(--rule); background: var(--card); color: var(--ink); }
.ws .modal-title { font-family: var(--font-display); font-size: 19px; }
.ws .modal-body { padding: 20px; }
.ws .modal-footer { padding: 14px 20px; border-top: 1px solid var(--rule); background: #fbfaf7; }
.ws .modal-backdrop.in { opacity: .45; }
.ws .modal.fade .modal-dialog { transform: none; }
.ws .close { opacity: .5; text-shadow: none; color: var(--ink); }
.ws .tooltip-inner { background: var(--ink); border-radius: 6px; font-size: 12.5px; padding: 6px 10px; }
.ws .popover { border-radius: var(--r-md); border-color: var(--rule); }
.ws .well { background: #fbfaf7; border: 1px solid var(--rule); border-radius: var(--r-md); box-shadow: none; }
.ws .progress { height: 8px; border-radius: 4px; background: var(--paper-2); box-shadow: none; }
.ws .progress-bar { background: var(--cobalt); box-shadow: none; }
.ws #fullpage-overlay { background: rgba(244, 242, 236, .85); }
.ws #fullpage-overlay .msg { color: var(--ink); }

/* 11. Dashboard -------------------------------------------------------------------- */
.ws-stats {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 14px;
    margin-bottom: 18px;
}
.ws-stat {
    display: grid;
    grid-template-columns: auto 1fr;
    grid-template-rows: auto auto;
    column-gap: 14px;
    align-items: center;
    padding: 18px;
    background: var(--card);
    border: 1px solid var(--rule);
    border-radius: var(--r-md);
    color: var(--ink) !important;
    text-decoration: none !important;
}
.ws-stat:hover { border-color: var(--rule-2); box-shadow: var(--shadow); }
.ws-stat-ic {
    grid-row: 1 / span 2;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 44px; height: 44px;
    border-radius: 10px;
    background: var(--cobalt-wash);
    color: var(--cobalt);
    font-size: 18px;
}
.ws-stat-num { font-family: var(--font-display); font-size: 28px; font-weight: 700; letter-spacing: -.03em; line-height: 1; }
.ws-stat-label { font-size: 13px; color: var(--ink-3); }
.ws-stat-alert .ws-stat-ic { background: var(--marigold-wash); color: var(--amber); }

.ws-quick {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 14px;
    margin-bottom: 18px;
}
.ws-quick-item {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 14px 16px;
    border: 1px dashed var(--rule-2);
    border-radius: var(--r-md);
    color: var(--ink) !important;
    text-decoration: none !important;
    background: transparent;
}
.ws-quick-item:hover { border-style: solid; border-color: var(--cobalt); background: var(--card); }
.ws-quick-item i { color: var(--cobalt); font-size: 18px; width: 22px; text-align: center; }
.ws-quick-item strong { display: block; font-size: 14px; font-weight: 600; }
.ws-quick-item small { display: block; font-size: 12.5px; color: var(--ink-3); }

.ws-kb-search {
    position: relative;
    display: flex;
    gap: 8px;
    margin-bottom: 24px;
}
.ws-kb-search > i { position: absolute; left: 16px; top: 15px; color: var(--ink-4); }
.ws-kb-search .form-control { height: 46px; padding-left: 42px; }
.ws-kb-search .btn { height: 46px; padding: 0 20px; }

.ws .client-home-panels .panel { margin-bottom: 18px; }
.ws .client-home-panels .panel-heading .btn { margin-top: -3px; }
.ws .client-home-panels .panel-title > i { color: var(--cobalt); margin-right: 2px; }
.ws .client-home-panels .list-group-item { font-size: 14px; }
.ws .client-home-panels .list-group-item .label { float: right; }
.ws .client-home-panels .panel-body { font-size: 14px; }
.ws [class*="panel-accent-"] { border-top-width: 1px; }

.ws-empty { padding: 60px 20px; text-align: center; }

/* 12. Service, domain, ticket, KB pages ---------------------------------------- */
.ws .product-details { margin-bottom: 24px; }
.ws .product-status {
    padding: 28px 20px 20px;
    border: 1px solid var(--rule);
    border-radius: var(--r-md);
    background: var(--card);
    color: var(--ink);
}
.ws .product-status .product-icon .fa-stack-2x { color: var(--cobalt-wash); }
.ws .product-status .product-icon .fa-inverse { color: var(--cobalt); }
.ws .product-status h3 { font-size: 22px; margin: 12px 0 2px; color: var(--ink); }
.ws .product-status h4 { font-family: var(--font); font-size: 14px; color: var(--ink-3); }
.ws .product-status-text { margin-top: 14px; padding: 8px; border-radius: var(--r-sm); background: var(--paper-2); color: var(--ink-2); font-family: var(--font-mono); font-size: 12px; letter-spacing: .06em; text-transform: uppercase; }
.ws .product-status-active .product-status-text { background: var(--green-wash); color: var(--green); }
.ws .product-status-pending .product-status-text { background: var(--marigold-wash); color: var(--amber); }
.ws .product-status-suspended .product-status-text, .ws .product-status-fraud .product-status-text { background: var(--red-wash); color: var(--red); }
.ws .product-actions-wrapper .btn { margin-top: 10px; }
.ws .product-details h4 { font-size: 12px; font-family: var(--font-mono); font-weight: 500; text-transform: uppercase; letter-spacing: .06em; color: var(--ink-3); margin-top: 18px; }
.ws .tab-content .row + .row, .ws .product-details-tab-container { margin-top: 10px; }

/* Service page: "Connect your domain" card (nameservers + IP) */
.ws .ws-connect { margin-bottom: 24px; border: 1px solid var(--rule); border-radius: var(--r-md); background: var(--card); overflow: hidden; }
.ws .ws-connect-head { display: flex; align-items: center; gap: 14px; padding: 20px 24px; border-bottom: 1px solid var(--rule); }
.ws .ws-connect-ic { flex: none; display: grid; place-items: center; width: 40px; height: 40px; border-radius: 10px; background: var(--cobalt-wash); color: var(--cobalt); font-size: 17px; }
.ws .ws-connect-intro { flex: 1; min-width: 0; }
.ws .ws-connect-intro h3 { margin: 0 0 2px; font-size: 18px; color: var(--ink); }
.ws .ws-connect-intro p { margin: 0; color: var(--ink-3); font-size: 13.5px; }
.ws .ws-connect-intro strong { color: var(--ink); }
.ws .ws-rec-group { padding: 20px 24px 22px; }
.ws .ws-rec-group + .ws-rec-group { border-top: 1px dashed var(--rule); }
.ws .ws-rec-title { display: flex; align-items: center; gap: 10px; margin: 0 0 4px; font-weight: 600; color: var(--ink); font-size: 15px; }
.ws .ws-rec-step { display: grid; place-items: center; width: 22px; height: 22px; border-radius: 50%; background: var(--ink); color: #fff; font-family: var(--font-mono); font-size: 11.5px; }
.ws .ws-rec-tag { padding: 2px 8px; border-radius: 999px; background: var(--green-wash); color: var(--green); font-family: var(--font-mono); font-size: 10.5px; font-weight: 500; letter-spacing: .06em; text-transform: uppercase; }
.ws .ws-rec-help { margin: 0 0 14px 32px; color: var(--ink-3); font-size: 13px; }
.ws .ws-rec-list { margin: 0 0 0 32px; padding: 0; list-style: none; border: 1px solid var(--rule); border-radius: var(--r-sm); overflow: hidden; }
.ws .ws-rec { display: grid; grid-template-columns: 44px 150px minmax(0, 1fr) auto; align-items: center; gap: 14px; padding: 10px 10px 10px 14px; background: #fbfaf7; }
.ws .ws-rec + .ws-rec { border-top: 1px solid var(--rule); }
.ws .ws-rec-type { justify-self: start; padding: 3px 8px; border-radius: 6px; background: var(--card); border: 1px solid var(--rule-2); font-family: var(--font-mono); font-size: 11px; font-weight: 500; color: var(--cobalt); }
.ws .ws-rec-name { color: var(--ink-3); font-size: 13px; }
.ws .ws-rec-name small { color: var(--ink-4); font-size: 11.5px; }
.ws .ws-rec code { padding: 0; background: none; color: var(--ink); font-family: var(--font-mono); font-size: 14.5px; font-weight: 500; overflow-wrap: anywhere; }
.ws .ws-rec .ws-copy { display: inline-flex; align-items: center; gap: 6px; height: 30px; padding: 0 12px; border: 1px solid var(--rule-2); border-radius: 6px; background: var(--card); color: var(--ink-2); font-size: 12.5px; font-weight: 600; transition: none; }
.ws .ws-rec .ws-copy:hover { border-color: var(--cobalt); color: var(--cobalt); }
.ws .ws-copy.is-copied, .ws .ws-copy.is-copied:hover { border-color: var(--green); background: var(--green-wash); color: var(--green); }
.ws .ws-copy.is-copied .fa-copy:before { content: "\f00c"; font-weight: 900; }
.ws .ws-connect-foot { display: flex; flex-wrap: wrap; gap: 8px 24px; padding: 12px 24px; border-top: 1px solid var(--rule); background: #fbfaf7; color: var(--ink-3); font-size: 12.5px; }
.ws .ws-connect-foot i { margin-right: 4px; color: var(--ink-4); }
.ws .ws-connect-foot code { padding: 0; background: none; color: var(--ink-2); font-family: var(--font-mono); font-size: 12.5px; }
@media (max-width: 767px) {
    .ws .ws-connect-head { flex-wrap: wrap; padding: 16px; }
    .ws .ws-copy-all { width: 100%; }
    .ws .ws-rec-group { padding: 16px; }
    .ws .ws-rec-help, .ws .ws-rec-list { margin-left: 0; }
    .ws .ws-rec { grid-template-columns: auto minmax(0, 1fr) auto; gap: 4px 10px; }
    .ws .ws-rec-name { grid-column: 2; }
    .ws .ws-rec code { grid-column: 1 / 3; grid-row: 2; }
    .ws .ws-rec .ws-copy { grid-column: 3; grid-row: 1 / 3; }
    .ws .ws-connect-foot { padding: 12px 16px; }
}

.ws .ticket-reply {
    margin-bottom: 14px;
    border: 1px solid var(--rule);
    border-radius: var(--r-md);
    background: var(--card);
    overflow: hidden;
}
.ws .ticket-reply .date { padding: 10px 16px; border-bottom: 1px solid var(--rule); background: #fbfaf7; font-family: var(--font-mono); font-size: 12px; color: var(--ink-3); float: none; }
.ws .ticket-reply .user { padding: 14px 16px 0; background: transparent; float: none; width: auto; border: 0; }
.ws .ticket-reply .user i { color: var(--ink-4); }
.ws .ticket-reply .user .name { color: var(--ink); font-weight: 600; }
.ws .ticket-reply .user .type { color: var(--ink-3); font-size: 12.5px; }
.ws .ticket-reply .message { padding: 10px 16px 18px; margin: 0; border: 0; }
.ws .ticket-reply.staff { border-color: rgba(0, 82, 224, .3); }
.ws .ticket-reply.staff .date { background: var(--cobalt-wash); color: var(--cobalt); }
.ws .ticket-reply.staff .user { background: transparent; }
.ws .ticket-reply .attachments { padding: 10px 16px; border-top: 1px solid var(--rule); background: #fbfaf7; }

.ws .kb-search, .ws .kb-search .form-control { border-radius: var(--r-sm); }
.ws .kbcategories, .ws .kbarticles { margin: 0; padding: 0; }
.ws .kbcategories a, .ws .kbarticles a { font-weight: 600; }
.ws .announcement-single, .ws .announcement {
    padding: 20px;
    margin-bottom: 14px;
    border: 1px solid var(--rule);
    border-radius: var(--r-md);
    background: var(--card);
}
.ws .announcement-single h3, .ws .announcement-single h2 { margin-top: 0; font-size: 20px; }
.ws .announcement-single h3 a { color: var(--ink); }
.ws .announcement-single .label { margin-right: 8px; }

/* 13. Login, register, password ------------------------------------------------- */
.ws .logincontainer {
    max-width: 480px;
    margin: 24px auto 0;
    padding: 32px;
    background: var(--card);
    border: 1px solid var(--rule);
    border-radius: var(--r-lg);
    box-shadow: var(--shadow);
}
.ws .logincontainer.with-social { max-width: 820px; }
.ws .logincontainer .header-lined { text-align: left; margin-bottom: 20px; }
.ws .logincontainer .header-lined .breadcrumb { display: none; }
.ws .logincontainer .login-form .btn-primary { min-width: 140px; }
.ws .logincontainer div[align="center"] { display: flex; align-items: center; justify-content: space-between; gap: 10px; flex-wrap: wrap; }
.ws .logincontainer div[align="center"] .btn-default { border-color: transparent; background: none; color: var(--cobalt); padding-left: 0; padding-right: 0; }
.ws .login-register { margin-top: 26px; padding-top: 20px; border-top: 1px solid var(--rule); text-align: center; }
.ws .login-register p { margin-bottom: 12px; color: var(--ink-3); }
.ws .social-signin-btns, .ws .providerLinkingFeedback { font-size: 14px; }

.ws #registration, .ws .registration-form, .ws #frmCheckout { max-width: 980px; }
.ws #registration .panel, .ws .using-password-strength .panel { border-radius: var(--r-md); }
.ws .password-strength-meter .progress { margin-top: 8px; }

.tpl-pwreset .main-content, .tpl-password-reset-container .main-content { max-width: 560px; margin: 0 auto; }

/* 14. Order forms ------------------------------------------------------------------- */
/* Order-form stylesheets load after this file, so rules here are scoped with body.ws */

/* Shared: store sidebar (categories, actions) */
body.ws .card-sidebar .list-group-item-action { padding: 9px 16px; font-size: 14px; }

/* premium_comparison + pure_comparison (store category pages) */
body.ws #order-premium_comparison, body.ws #order-pure_comparison { background: transparent; font-family: var(--font); color: var(--ink-2); }
body.ws #order-premium_comparison .main-container, body.ws #order-pure_comparison .main-container { padding: 0; max-width: none; background: none; }
body.ws #order-premium_comparison #headline,
body.ws #order-pure_comparison #headline,
body.ws #order-premium_comparison .header h3,
body.ws #order-pure_comparison .header h3 {
    font-family: var(--font-display);
    font-size: 32px;
    font-weight: 700;
    letter-spacing: -.03em;
    color: var(--ink);
    text-align: left;
    margin: 0 0 6px;
}
body.ws #order-premium_comparison #tagline,
body.ws #order-pure_comparison #tagline { font-family: var(--font); font-size: 15px; font-weight: 400; color: var(--ink-3); text-align: left; margin: 0 0 24px; }
body.ws #order-premium_comparison .price-table-container,
body.ws #order-pure_comparison .price-table-container { margin: 0; padding: 0; }
body.ws #order-premium_comparison .price-table-container > ul,
body.ws #order-pure_comparison .price-table-container > ul {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(230px, 1fr));
    gap: 14px;
    margin: 0;
    padding: 0;
    list-style: none;
}
body.ws #order-premium_comparison .price-table-container > ul > li,
body.ws #order-pure_comparison .price-table-container > ul > li { width: auto !important; float: none; margin: 0; padding: 0; }
body.ws #order-premium_comparison .price-table,
body.ws #order-pure_comparison .price-table {
    display: flex;
    flex-direction: column;
    height: 100%;
    margin: 0;
    padding: 22px 20px;
    background: var(--card);
    border: 1px solid var(--rule);
    border-radius: var(--r-lg);
    box-shadow: none;
    transform: none !important;
}
body.ws #order-premium_comparison .price-table:hover,
body.ws #order-pure_comparison .price-table:hover { border-color: var(--rule-2); box-shadow: var(--shadow); }
body.ws #order-premium_comparison .top-head,
body.ws #order-pure_comparison .top-head { background: none; padding: 0; margin: 0; border: 0; }
body.ws #order-premium_comparison .top-area,
body.ws #order-pure_comparison .top-area { background: none; padding: 0; border: 0; text-align: left; }
body.ws #order-premium_comparison .top-area h4,
body.ws #order-pure_comparison .top-area h4 {
    margin: 0;
    font-family: var(--font-display);
    font-size: 22px;
    font-weight: 700;
    letter-spacing: -.02em;
    color: var(--ink);
    text-align: left;
    text-transform: none;
}
body.ws #order-premium_comparison .price-area,
body.ws #order-pure_comparison .price-area { background: none; padding: 16px 0 0; margin: 0; text-align: left; border: 0; }
body.ws #order-premium_comparison .price,
body.ws #order-pure_comparison .price {
    font-family: var(--font);
    font-size: 15px;
    color: var(--ink-3);
    text-align: left;
    background: none;
    padding: 0;
    margin: 0 0 16px;
}
body.ws #order-premium_comparison .price span,
body.ws #order-pure_comparison .price span {
    font-family: var(--font-display);
    font-size: 40px;
    font-weight: 700;
    letter-spacing: -.04em;
    color: var(--ink);
}
body.ws #order-premium_comparison .price br,
body.ws #order-pure_comparison .price br { display: none; }
body.ws #order-premium_comparison .order-button,
body.ws #order-pure_comparison .order-button {
    display: block;
    width: 100%;
    padding: 11px 16px;
    border: 0;
    border-radius: var(--r-sm);
    background: var(--ink);
    color: #fff !important;
    font-family: var(--font);
    font-size: 15px;
    font-weight: 600;
    text-align: center;
    text-decoration: none !important;
    box-shadow: none;
}
body.ws #order-premium_comparison .order-button:hover,
body.ws #order-pure_comparison .order-button:hover { background: var(--cobalt); }
body.ws #order-premium_comparison .price-table > ul,
body.ws #order-pure_comparison .price-table > ul { margin: 18px 0 0; padding: 16px 0 0; border-top: 1px solid var(--rule); list-style: none; background: none; }
body.ws #order-premium_comparison .price-table > ul > li,
body.ws #order-pure_comparison .price-table > ul > li {
    padding: 0;
    border: 0;
    background: none;
    font-size: 14px;
    line-height: 1.5;
    color: var(--ink-2);
    text-align: left;
}
/* WHMCS outputs descriptions as <strong>Feature</strong><br><br> — render them as a checklist */
body.ws #order-premium_comparison .price-table > ul > li strong,
body.ws #order-pure_comparison .price-table > ul > li strong {
    display: block;
    position: relative;
    padding: 4px 0 4px 24px;
    font-weight: 500;
    color: var(--ink-2);
}
body.ws #order-premium_comparison .price-table > ul > li strong::before,
body.ws #order-pure_comparison .price-table > ul > li strong::before {
    content: "";
    position: absolute;
    left: 2px; top: 9px;
    width: 12px; height: 7px;
    border-left: 2px solid var(--cobalt);
    border-bottom: 2px solid var(--cobalt);
    transform: rotate(-45deg);
}
body.ws #order-premium_comparison .price-table > ul > li br,
body.ws #order-pure_comparison .price-table > ul > li br { display: none; }
body.ws #order-pure_comparison .price-table .price-area { margin-top: auto; }
/* The comparison forms paint headers with gradient images and fixed colours; neutralise them */
body.ws #order-premium_comparison .price-table .top-head,
body.ws #order-pure_comparison .price-table .top-head,
body.ws #order-premium_comparison .price-table .top-area,
body.ws #order-pure_comparison .price-table .top-area,
body.ws #order-premium_comparison .price-table .price-area,
body.ws #order-pure_comparison .price-table .price-area,
body.ws #order-premium_comparison .price-table .price,
body.ws #order-pure_comparison .price-table .price {
    background: none !important;
    background-image: none !important;
    box-shadow: none !important;
    border: 0 !important;
    color: var(--ink-3) !important;
    width: auto !important;
    height: auto !important;
    filter: none !important;
}
body.ws #order-premium_comparison .price-table .top-area,
body.ws #order-pure_comparison .price-table .top-area { padding: 0 !important; }
body.ws #order-premium_comparison .price-table .top-area h4,
body.ws #order-pure_comparison .price-table .top-area h4,
body.ws #order-premium_comparison .price-table .price span,
body.ws #order-pure_comparison .price-table .price span { color: var(--ink) !important; }
body.ws #order-premium_comparison .price-table .top-head::before, body.ws #order-premium_comparison .price-table .top-head::after,
body.ws #order-pure_comparison .price-table .top-head::before, body.ws #order-pure_comparison .price-table .top-head::after,
body.ws #order-premium_comparison .price-table::before, body.ws #order-premium_comparison .price-table::after,
body.ws #order-pure_comparison .price-table::before, body.ws #order-pure_comparison .price-table::after { display: none !important; }
body.ws #order-premium_comparison .price-table .order-button,
body.ws #order-pure_comparison .price-table .order-button { width: 100% !important; margin: 0 !important; position: static !important; }
body.ws #order-premium_comparison .btn-sidebar-toggle, body.ws #order-pure_comparison .btn-sidebar-toggle,
body.ws .sidebar-collapsed .btn, body.ws #order-premium_comparison .txt-center .btn, body.ws #order-pure_comparison .txt-center .btn { border-radius: var(--r-sm); }
body.ws #order-premium_comparison .price-table .most-popular,
body.ws #order-premium_comparison .popular-plan .plan-container { background: var(--cobalt); color: #fff; }

/* standard_cart (configure, domains, cart, checkout) */
body.ws #order-standard_cart { font-family: var(--font); color: var(--ink-2); }
body.ws #order-standard_cart .header-lined h1 { font-family: var(--font-display); font-size: 30px; color: var(--ink); }
body.ws #order-standard_cart .cart-sidebar .panel,
body.ws #order-standard_cart .card-sidebar { border-radius: var(--r-md); border: 1px solid var(--rule); }
body.ws #order-standard_cart .panel-heading,
body.ws #order-standard_cart .card-header { background: var(--card); color: var(--ink); border-bottom: 1px solid var(--rule); }
body.ws #order-standard_cart .panel-title { color: var(--ink); }
body.ws #order-standard_cart .sub-heading { border-top: 1px solid var(--rule); height: auto; margin: 26px 0 14px; text-align: left; }
body.ws #order-standard_cart .sub-heading span {
    position: static;
    padding: 12px 0 0;
    background: none;
    font-family: var(--font-mono);
    font-size: 12px;
    font-weight: 500;
    letter-spacing: .06em;
    text-transform: uppercase;
    color: var(--ink-3);
}
body.ws #order-standard_cart .product-info,
body.ws #order-standard_cart .field-container,
body.ws #order-standard_cart .domain-checker-container,
body.ws #order-standard_cart .secondary-cart-body .order-summary,
body.ws #order-standard_cart .view-cart-items,
body.ws #order-standard_cart .order-summary {
    border: 1px solid var(--rule);
    border-radius: var(--r-md);
    background: var(--card);
}
body.ws #order-standard_cart .product-info { padding: 18px 20px; }
body.ws #order-standard_cart .product-info .product-title { font-family: var(--font-display); font-size: 22px; color: var(--ink); }
body.ws #order-standard_cart .field-container { padding: 18px 20px; margin-bottom: 18px; }
body.ws #order-standard_cart .domain-checker-container { padding: 24px; margin-bottom: 20px; background: var(--card); }
body.ws #order-standard_cart .domain-checker-bg { background: none; padding: 0; }
body.ws #order-standard_cart .domain-checker-container .input-group-box { background: none; padding: 0; border: 0; box-shadow: none; }
body.ws #order-standard_cart .domain-checker-container .form-control { height: 50px; font-family: var(--font-mono); }
body.ws #order-standard_cart .domain-checker-container .btn { height: 50px; }
body.ws #order-standard_cart .domain-checker-available { color: var(--green); }
body.ws #order-standard_cart .domain-checker-unavailable { color: var(--red); }
body.ws #order-standard_cart .domain-lookup-result { border-radius: var(--r-md); }
body.ws #order-standard_cart .tld-row, body.ws #order-standard_cart .spotlight-tld, body.ws #order-standard_cart .domain-suggestion {
    border-color: var(--rule);
    background: var(--card);
}
body.ws #order-standard_cart .spotlight-tld { border-radius: var(--r-md); }
body.ws #order-standard_cart .domain-price .price, body.ws #order-standard_cart .tld-pricing-header { font-family: var(--font-mono); }
body.ws #order-standard_cart .domain-promo-box { border: 1px solid var(--rule); border-radius: var(--r-md); background: #fbfaf7; }

body.ws #order-standard_cart .view-cart-items-header {
    background: #fbfaf7;
    color: var(--ink-3);
    border-bottom: 1px solid var(--rule);
    border-radius: var(--r-md) var(--r-md) 0 0;
    font-family: var(--font-mono);
    font-size: 11.5px;
    letter-spacing: .06em;
    text-transform: uppercase;
    padding: 12px 16px;
}
body.ws #order-standard_cart .view-cart-items .item { padding: 16px; border-bottom: 1px solid var(--rule); background: var(--card); }
body.ws #order-standard_cart .view-cart-items .item-title { font-weight: 600; color: var(--ink); }
body.ws #order-standard_cart .view-cart-items .item-price span:first-child { font-family: var(--font-mono); color: var(--ink); }
body.ws #order-standard_cart .view-cart-empty { padding: 36px 16px; color: var(--ink-3); }
body.ws #order-standard_cart .btn-remove-from-cart { color: var(--red); }
body.ws #order-standard_cart .btn-link { color: var(--cobalt); }

body.ws #order-standard_cart .order-summary { padding: 0; overflow: hidden; }
body.ws #order-standard_cart .order-summary h2 {
    margin: 0;
    padding: 14px 18px;
    background: var(--ink);
    color: #fff;
    font-family: var(--font-display);
    font-size: 18px;
    border-radius: 0;
}
body.ws #order-standard_cart .summary-container { padding: 16px 18px; background: var(--card); font-size: 14px; }
body.ws #order-standard_cart .order-summary .total-due-today .amt,
body.ws #order-standard_cart .order-summary .total-due-today .amt { font-family: var(--font-display); font-size: 30px; color: var(--ink); }
body.ws #order-standard_cart .order-summary .total-due-today span:last-child { font-size: 13px; color: var(--ink-3); }
body.ws #order-standard_cart .btn-checkout,
body.ws #order-standard_cart #btnCompleteOrder,
body.ws #order-standard_cart #checkout,
body.ws #order-standard_cart .btn-primary.btn-lg {
    background: var(--cobalt);
    border-color: var(--cobalt);
    color: #fff;
    font-weight: 600;
    border-radius: var(--r-sm);
}
body.ws #order-standard_cart .btn-checkout:hover,
body.ws #order-standard_cart #btnCompleteOrder:hover { background: var(--cobalt-deep); border-color: var(--cobalt-deep); }
body.ws #order-standard_cart .view-cart-tabs .nav-tabs > li > a { border-radius: 0; }
body.ws #order-standard_cart .prepend-icon .field-icon { color: var(--ink-4); }
body.ws #order-standard_cart .prepend-icon .field { border-radius: var(--r-sm); border-color: var(--rule-2); height: 42px; }
body.ws #order-standard_cart .account-select-container .account, body.ws #order-standard_cart .payment-methods label { border-radius: var(--r-sm); }
body.ws #order-standard_cart .already-registered { border-radius: var(--r-md); border-color: var(--rule); background: #fbfaf7; }
body.ws #order-standard_cart .products .product {
    border: 1px solid var(--rule);
    border-radius: var(--r-md);
    background: var(--card);
}
body.ws #order-standard_cart .products .product header { background: var(--card); border-bottom: 1px solid var(--rule); color: var(--ink); font-family: var(--font-display); }
body.ws #order-standard_cart .products .product .product-pricing .price { font-family: var(--font-display); color: var(--ink); }
body.ws #order-standard_cart .products .product .btn-order-now { background: var(--ink); border-color: var(--ink); color: #fff; }
body.ws #order-standard_cart .products .product .btn-order-now:hover { background: var(--cobalt); border-color: var(--cobalt); }
body.ws #order-standard_cart .panel-addon { border-radius: var(--r-md); border-color: var(--rule); }
body.ws #order-standard_cart .panel-addon-selected { border-color: var(--cobalt); }
body.ws #order-standard_cart .panel-addon-selected .panel-add { background: var(--cobalt); }
body.ws #order-standard_cart .panel-add { background: var(--paper-2); color: var(--ink); }

/* 14b. Domain search page (standard_cart "Register Domain") ------------------------ */
/* Intro line is repeated inside the hero, so hide the plain paragraph when the hero is present */
body.ws #order-standard_cart .cart-body:has(> .domain-checker-container) > p { display: none; }

body.ws #order-standard_cart .domain-checker-container,
body.ws .domain-checker-container {
    position: relative;
    margin: 0 0 28px;
    padding: 46px 40px 34px;
    border: 0;
    border-radius: var(--r-lg);
    color: #fff;
    background:
        radial-gradient(rgba(255, 255, 255, .16) 1px, transparent 1.5px) 0 0 / 22px 22px,
        linear-gradient(135deg, #0052e0 0%, #0046c4 55%, #003cae 100%);
    overflow: hidden;
}
body.ws .domain-checker-container::before {
    content: "Find a name for your next idea.";
    display: block;
    max-width: 640px;
    margin: 0 auto 22px;
    font-family: var(--font-display);
    font-size: 34px;
    font-weight: 700;
    line-height: 1.08;
    letter-spacing: -.03em;
    text-align: center;
}
body.ws .domain-checker-container::after {
    content: "Popular:   .com   ·   .in   ·   .net   ·   .org   ·   .xyz";
    display: block;
    margin-top: 18px;
    font-family: var(--font-mono);
    font-size: 12.5px;
    letter-spacing: .04em;
    white-space: pre;
    text-align: center;
    color: rgba(255, 255, 255, .85);
}
body.ws .domain-checker-container .domain-checker-bg { padding: 0; background: none; }
body.ws .domain-checker-container .row { margin: 0; }
body.ws .domain-checker-container .row > [class*="col-"] { float: none; width: 100%; max-width: 680px; margin: 0 auto; padding: 0; flex: none; }
body.ws .domain-checker-container .input-group-box {
    display: flex;
    gap: 6px;
    width: 100%;
    padding: 6px;
    background: #fff;
    border-radius: 14px;
    box-shadow: 0 24px 50px -24px rgba(0, 20, 70, .7);
}
body.ws .domain-checker-container .input-group-box .form-control {
    flex: 1;
    height: 54px;
    padding: 0 16px;
    border: 0 !important;
    border-radius: 10px !important;
    box-shadow: none !important;
    background: transparent;
    font-family: var(--font-mono);
    font-size: 19px;
    color: var(--ink);
}
body.ws .domain-checker-container .input-group-box .input-group-btn { width: auto; display: block; }
body.ws .domain-checker-container .input-group-box .btn {
    height: 54px;
    padding: 0 28px;
    border: 0;
    border-radius: 10px !important;
    background: var(--ink);
    color: #fff;
    font-size: 16px;
}
body.ws .domain-checker-container .input-group-box .btn:hover { background: #000; }
body.ws .domain-checker-container .captcha-container { margin-top: 10px; }

/* Search result */
body.ws #order-standard_cart .domain-checker-result-headline { margin: 0 0 22px; font-size: inherit; text-align: left; }
body.ws #order-standard_cart .domain-lookup-primary-loader { margin: 0 0 22px; padding: 22px; border: 1px dashed var(--rule-2); border-radius: var(--r-lg); color: var(--ink-3); text-align: center; }
body.ws #order-standard_cart #primaryLookupResult {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    gap: 6px 24px;
    padding: 22px 24px;
    background: var(--card);
    border: 1px solid var(--rule);
    border-radius: var(--r-lg);
    text-align: left;
}
body.ws #order-standard_cart #primaryLookupResult.w-hidden, body.ws #order-standard_cart #primaryLookupResult.hidden { display: none; }
body.ws #order-standard_cart #primaryLookupResult > p { grid-column: 1; margin: 0; font-size: 15px; }
body.ws #order-standard_cart #primaryLookupResult > p strong {
    display: block;
    margin-bottom: 2px;
    font-family: var(--font-display);
    font-size: clamp(22px, 2.6vw, 30px);
    font-weight: 700;
    letter-spacing: -.03em;
    color: var(--ink);
    word-break: break-all;
}
body.ws #order-standard_cart #primaryLookupResult .domain-checker-available { color: var(--green); font-weight: 600; }
body.ws #order-standard_cart #primaryLookupResult .domain-checker-unavailable { color: var(--red); font-weight: 600; }
body.ws #order-standard_cart #primaryLookupResult .domain-price { grid-column: 2; grid-row: 1 / span 3; display: flex; align-items: center; gap: 16px; margin: 0; }
body.ws #order-standard_cart #primaryLookupResult .domain-price .price { font-family: var(--font-mono); font-size: 18px; font-weight: 500; color: var(--ink); }
body.ws #order-standard_cart .btn-add-to-cart { min-width: 130px; border-radius: var(--r-sm); font-weight: 600; }
body.ws #order-standard_cart #primaryLookupResult .btn-add-to-cart { height: 46px; padding: 0 22px; background: var(--cobalt); border-color: var(--cobalt); color: #fff; }
body.ws #order-standard_cart #primaryLookupResult .btn-add-to-cart:hover { background: var(--cobalt-deep); border-color: var(--cobalt-deep); }
body.ws #order-standard_cart .btn-add-to-cart.checkout, body.ws #order-standard_cart .btn-add-to-cart .added { color: #fff; }

/* Suggested domains */
body.ws #order-standard_cart .suggested-domains {
    margin-bottom: 28px;
    background: var(--card);
    border: 1px solid var(--rule);
    border-radius: var(--r-lg);
    overflow: hidden;
}
body.ws #order-standard_cart .suggested-domains .panel-heading,
body.ws #order-standard_cart .suggested-domains .card-header {
    padding: 14px 20px;
    border-bottom: 1px solid var(--rule) !important;
    background: #fbfaf7;
    font-family: var(--font-mono);
    font-size: 12px;
    font-weight: 500;
    letter-spacing: .06em;
    text-transform: uppercase;
    color: var(--ink-3);
}
body.ws #order-standard_cart .suggested-domains .domain-lookup-suggestions-loader { background: transparent; opacity: 1; color: var(--ink-3); }
body.ws #order-standard_cart .suggested-domains .list-group-item { padding: 14px 20px; border-top: 1px solid var(--rule); font-family: var(--font-mono); font-size: 15px; color: var(--ink); }
body.ws #order-standard_cart .suggested-domains .list-group-item:first-child { border-top: 0; }
body.ws #order-standard_cart .suggested-domains .list-group-item:hover { background: #fbfaf7; }
body.ws #order-standard_cart .suggested-domains .extension { color: var(--cobalt); font-weight: 600; }
body.ws #order-standard_cart .suggested-domains .domain-suggestion { display: flex; align-items: center; flex-wrap: wrap; gap: 8px 0; }
body.ws #order-standard_cart .suggested-domains .domain-suggestion.w-hidden { display: none; }
body.ws #order-standard_cart .suggested-domains .domain-suggestion .actions { display: flex; align-items: center; margin-left: auto; float: none; }
body.ws #order-standard_cart .suggested-domains .price { font-family: var(--font-mono); font-size: 14px; color: var(--ink-2); margin-right: 12px; }
body.ws #order-standard_cart .suggested-domains .btn-add-to-cart { min-width: 110px; padding: 6px 14px; background: var(--ink); border-color: var(--ink); color: #fff; font-family: var(--font); font-size: 13px; }
body.ws #order-standard_cart .suggested-domains .btn-add-to-cart:hover { background: var(--cobalt); border-color: var(--cobalt); }
body.ws #order-standard_cart .suggested-domains .promo { display: inline-block; margin-left: 8px; padding: 2px 8px; border-radius: 999px; font-family: var(--font-mono); font-size: 10.5px; letter-spacing: .04em; }
body.ws #order-standard_cart .suggested-domains .promo.hot { background: var(--red-wash); color: var(--red); }
body.ws #order-standard_cart .suggested-domains .promo.sale { background: var(--marigold-wash); color: var(--amber); }
body.ws #order-standard_cart .domain-suggestions-warning p { font-size: 12.5px; color: var(--ink-4); }

/* Spotlight TLDs (if enabled in WHMCS) */
body.ws #order-standard_cart .spotlight-tlds { padding: 0; margin: 0 0 24px; background: none; }
body.ws #order-standard_cart .spotlight-tld { height: auto; min-height: 112px; padding: 16px 10px; border: 1px solid var(--rule); border-radius: var(--r-md); background: var(--card); color: var(--ink); font-family: var(--font-display); font-size: 20px; }
body.ws #order-standard_cart .spotlight-tld span { font-family: var(--font-mono); font-size: 13px; color: var(--ink-2); }
body.ws #order-standard_cart .spotlight-tld .btn:not(.domain-contact-support) { background: var(--ink); border-color: var(--ink); border-radius: 6px; }

/* Extension categories + price ledger */
body.ws #order-standard_cart .domain-pricing { margin: 8px 0 28px; }
body.ws #order-standard_cart .domain-pricing h4 {
    margin: 0 0 12px;
    font-family: var(--font-display);
    font-size: 22px;
    font-weight: 700;
    letter-spacing: -.02em;
    color: var(--ink);
}
body.ws #order-standard_cart .tld-filters { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 14px; }
body.ws #order-standard_cart .tld-filters .badge {
    padding: 7px 14px;
    border: 1px solid var(--rule-2);
    border-radius: 999px;
    background: var(--card);
    color: var(--ink-2);
    font-family: var(--font);
    font-size: 13px;
    font-weight: 600;
    text-decoration: none;
}
body.ws #order-standard_cart .tld-filters .badge:hover { border-color: var(--ink); color: var(--ink); }
body.ws #order-standard_cart .tld-filters .badge.badge-success,
body.ws #order-standard_cart .tld-filters .badge.active { background: var(--ink); border-color: var(--ink); color: #fff; }
body.ws #order-standard_cart .domain-pricing .bg-white {
    background: var(--card) !important;
    border: 1px solid var(--rule);
    border-radius: var(--r-lg);
    overflow: hidden;
}
body.ws #order-standard_cart .domain-pricing .tld-pricing-header { margin: 0; text-align: left; }
body.ws #order-standard_cart .domain-pricing .tld-pricing-header > div,
body.ws #order-standard_cart .domain-pricing .tld-pricing-header .row > div {
    height: auto !important;
    padding: 12px 20px !important;
    border: 0 !important;
    border-bottom: 1px solid var(--rule) !important;
    border-radius: 0 !important;
    background: #fbfaf7 !important;
    font-family: var(--font-mono);
    font-size: 11.5px;
    font-weight: 500;
    letter-spacing: .06em;
    text-transform: uppercase;
    color: var(--ink-3);
    text-align: left;
}
body.ws #order-standard_cart .domain-pricing .tld-pricing-header .row { margin: 0; }
body.ws #order-standard_cart .domain-pricing .tld-pricing-header > .col-md-8 { padding: 0 !important; border-bottom: 0 !important; background: transparent !important; }
body.ws #order-standard_cart .domain-pricing .tld-pricing-header { display: flex; flex-wrap: wrap; align-items: stretch; background: #fbfaf7; border-bottom: 1px solid var(--rule); }
body.ws #order-standard_cart .domain-pricing .tld-pricing-header > div, body.ws #order-standard_cart .domain-pricing .tld-pricing-header .row > div { border-bottom: 0 !important; }
body.ws #order-standard_cart .domain-pricing .tld-row { margin: 0; padding: 0; border-bottom: 1px solid var(--rule); align-items: center; }
body.ws #order-standard_cart .domain-pricing .tld-row:last-child { border-bottom: 0; }
body.ws #order-standard_cart .domain-pricing .tld-row:hover { background: #fbfaf7; }
body.ws #order-standard_cart .domain-pricing .tld-row.highlighted { background: #fbfaf7; }
body.ws #order-standard_cart .domain-pricing .two-row-center {
    margin: 0;
    padding: 14px 20px !important;
    border: 0;
    line-height: 1.2;
    text-align: left;
}
body.ws #order-standard_cart .domain-pricing .two-row-center strong { font-family: var(--font-display); font-size: 22px; font-weight: 700; letter-spacing: -.02em; color: var(--ink); }
body.ws #order-standard_cart .domain-pricing .two-row-center .label { margin-left: 8px; vertical-align: 3px; }
body.ws #order-standard_cart .domain-pricing .tld-row .row { margin: 0; }
body.ws #order-standard_cart .domain-pricing .tld-row .row > div {
    padding: 14px 20px;
    text-align: left !important;
    font-family: var(--font-mono);
    font-size: 14px;
    line-height: 1.35;
    color: var(--ink-2);
}
body.ws #order-standard_cart .domain-pricing .tld-row .row > div:first-child { color: var(--cobalt); font-weight: 500; }
body.ws #order-standard_cart .domain-pricing .tld-row .row > div small { font-family: var(--font); font-size: 12px; color: var(--ink-4); }
body.ws #order-standard_cart .domain-pricing .tld-row.no-tlds .col-12, body.ws #order-standard_cart .domain-pricing .tld-row.no-tlds .col-xs-12 { padding: 20px; color: var(--ink-3); }

/* Promo boxes */
body.ws #order-standard_cart .domain-promo-box {
    position: relative;
    height: calc(100% - 20px);
    margin-bottom: 20px;
    padding: 26px 26px 24px 100px;
    border: 1px solid var(--rule);
    border-radius: var(--r-lg);
    background: var(--card);
    color: var(--ink-2);
}
body.ws #order-standard_cart .domain-promo-box > .clearfix > i {
    position: absolute;
    top: 26px; left: 26px;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 52px; height: 52px;
    float: none;
    margin: 0;
    border-radius: 12px;
    background: var(--cobalt-wash);
    color: var(--cobalt);
    font-size: 22px;
}
body.ws #order-standard_cart .domain-promo-box h3 { margin: 0 0 4px; font-family: var(--font-display); font-size: 22px !important; font-weight: 700; letter-spacing: -.02em; color: var(--ink); white-space: normal; }
body.ws #order-standard_cart .domain-promo-box p { margin: 0 0 12px; font-size: 14px; color: var(--ink-3); }
body.ws #order-standard_cart .domain-promo-box p.font-bold { font-weight: 600; color: var(--ink-2) !important; }
body.ws #order-standard_cart .domain-promo-box .small { margin: 12px 0 0; font-size: 12px; color: var(--ink-4); }
body.ws #order-standard_cart .domain-promo-box .btn { border-radius: var(--r-sm); }
body.ws #order-standard_cart .domain-promo-box:has(.fa-server) { background: var(--ink); border-color: var(--ink); color: var(--night-muted); }
body.ws #order-standard_cart .domain-promo-box:has(.fa-server) h3 { color: #fff; }
body.ws #order-standard_cart .domain-promo-box:has(.fa-server) p, body.ws #order-standard_cart .domain-promo-box:has(.fa-server) p.font-bold { color: var(--night-muted) !important; }
body.ws #order-standard_cart .domain-promo-box:has(.fa-server) > .clearfix > i { background: rgba(255, 255, 255, .1); color: #7aa2ff; }

@media (max-width: 767px) {
    body.ws .domain-checker-container { padding: 30px 18px 24px; }
    body.ws .domain-checker-container::before { font-size: 26px; }
    body.ws .domain-checker-container::after { white-space: normal; }
    body.ws .domain-checker-container .input-group-box { flex-direction: column; }
    body.ws .domain-checker-container .input-group-box .btn { width: 100%; }
    body.ws .domain-checker-container .input-group-box .form-control { font-size: 15px; height: 50px; padding: 0 12px; }
    body.ws #order-standard_cart #primaryLookupResult .domain-price .price { font-size: 16px; white-space: nowrap; }
    body.ws #order-standard_cart .suggested-domains .price { font-size: 13px; white-space: nowrap; }
    body.ws #order-standard_cart .suggested-domains .list-group-item { padding: 12px 16px; font-size: 14px; }
    body.ws #order-standard_cart #primaryLookupResult { grid-template-columns: 1fr; }
    body.ws #order-standard_cart #primaryLookupResult .domain-price { grid-column: 1; grid-row: auto; justify-content: space-between; }
    body.ws #order-standard_cart .domain-pricing .tld-pricing-header .tld-column { display: none; }
    body.ws #order-standard_cart .domain-pricing .two-row-center { padding: 12px 16px 0 !important; }
    body.ws #order-standard_cart .domain-pricing .tld-row .row > div { padding: 8px 16px 14px; font-size: 12.5px; }
    body.ws #order-standard_cart .domain-promo-box { padding: 88px 20px 20px; }
}

/* 15. Responsive -------------------------------------------------------------------- */
@media (max-width: 1279px) {
    /* not enough room for three columns: WHMCS page menus move below the content */
    .ws-page-with-sidebar { display: block; }
    .ws-context { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 0 20px; margin-top: 24px; }
}

@media (max-width: 991px) {
    /* sidebar becomes an off-canvas drawer */
    .ws-sidebar { transform: translateX(-100%); box-shadow: none; }
    .ws-sidebar-open .ws-sidebar { transform: none; box-shadow: 0 0 60px rgba(12, 14, 19, .3); }
    .ws-sidebar-open .ws-scrim { display: block; position: fixed; inset: 0; z-index: 1025; background: rgba(12, 14, 19, .4); }
    .ws-sidebar-close { display: inline-flex; }
    .ws-main { margin-left: 0; }
    .ws-menu-btn, .ws-topbar-logo { display: inline-flex; }
    .ws-topbar { padding: 0 16px; }
    .ws-app #main-body > .container { padding: 0 16px; }
    .ws-app-footer { padding: 18px 16px 24px; }

    .ws-stats { grid-template-columns: repeat(2, minmax(0, 1fr)); }

    .ws-header-nav {
        display: none;
        position: absolute;
        top: 68px; left: 0; right: 0;
        flex-direction: column;
        padding: 10px 16px 16px;
        background: var(--paper);
        border-bottom: 1px solid var(--rule);
    }
    .ws-nav-open .ws-header-nav { display: flex; }
    .ws-header-nav a { padding: 12px; font-size: 17px; }
    .ws-public-menu-btn { display: inline-flex; }
    .ws-header-in { padding: 0 16px; gap: 12px; }
    .ws #main-body > .container { padding: 0 16px; }
    .ws-footer-in { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .ws-footer-brand { grid-column: 1 / -1; }
}

@media (max-width: 600px) {
    body.ws { font-size: 14.5px; }
    .ws .header-lined h1 { font-size: 25px; }
    .ws-stats, .ws-quick { grid-template-columns: 1fr 1fr; gap: 10px; }
    .ws-stat { padding: 14px; column-gap: 10px; }
    .ws-stat-ic { width: 36px; height: 36px; font-size: 15px; }
    .ws-stat-num { font-size: 24px; }
    .ws-quick-item { padding: 12px; }
    .ws-quick-item small { display: none; }
    .ws-kb-search .btn { display: none; }
    .ws-header-login { display: none; }
    .ws .logincontainer { padding: 22px 18px; margin-top: 8px; }
    .ws .dataTables_filter input { max-width: none; }
    .ws-footer-in { grid-template-columns: 1fr 1fr; gap: 28px; padding: 40px 16px 28px; }
    .ws-footer-bottom { padding: 18px 16px 24px; }
    body.ws #order-premium_comparison #headline, body.ws #order-pure_comparison #headline { font-size: 26px; }
}