/* *****************************************************

    chlink.ro theme — Standard Cart (order form)

    Matches the "Six" client area theme's brand colors,
    typography and rounded, friendly component style.
    Base WHMCS files (all.css / style.css) are untouched;
    everything here is additive, loaded last via common.tpl.

***************************************************** */

:root {
    --chlink-ink-950: #131b47;
    --chlink-brand-50: #eef2ff;
    --chlink-brand-100: #e0e7ff;
    --chlink-brand-200: #c7d2fe;
    --chlink-brand-300: #a5b4fc;
    --chlink-brand-400: #818cf8;
    --chlink-brand-500: #6366f1;
    --chlink-brand-600: #4f46e5;
    --chlink-brand-700: #4338ca;
    --chlink-brand-900: #1b2a6b;
}

/* ---------- Typography (forced — base stylesheet sets fonts on many
   individual elements, so a normal-specificity rule won't reach all of them) ---------- */

html body,
html body * {
    font-family: "Inter", "Open Sans", Verdana, Tahoma, sans-serif !important;
}
html body h1, html body h2, html body h3, html body h4, html body h5, html body h6 {
    font-family: "Manrope", "Raleway", "Helvetica Neue", Helvetica, Arial, sans-serif !important;
    font-weight: 800 !important;
    color: var(--chlink-ink-950) !important;
}
html body .fa, html body .fas, html body .far, html body .fab, html body .fal, html body .fad,
html body [class^="fa-"], html body [class*=" fa-"] {
    font-family: "Font Awesome 5 Free", "Font Awesome 5 Brands" !important;
}
html body .fab {
    font-family: "Font Awesome 5 Brands" !important;
}

html body a {
    color: var(--chlink-brand-600);
}
html body a:hover,
html body a:focus {
    color: var(--chlink-brand-700);
}

/* ---------- Buttons ---------- */

html body .btn {
    border-radius: 999px !important;
    font-weight: 600;
    transition: transform 0.15s ease, box-shadow 0.15s ease, background-color 0.15s ease;
}
html body .btn:active {
    transform: scale(0.97);
}
html body a.btn {
    color: #fff;
}
html body a.btn.btn-default,
html body a.btn.btn-link {
    color: var(--chlink-brand-700);
}

html body .btn-success,
html body .btn-order-now,
html body .btn-checkout {
    background-color: var(--chlink-brand-600) !important;
    border-color: var(--chlink-brand-600) !important;
    color: #fff !important;
}
html body .btn-success:hover,
html body .btn-order-now:hover,
html body .btn-checkout:hover {
    background-color: var(--chlink-brand-700) !important;
    border-color: var(--chlink-brand-700) !important;
}
html body .btn-primary {
    background-color: var(--chlink-brand-600) !important;
    border-color: var(--chlink-brand-600) !important;
}
html body .btn-primary:hover {
    background-color: var(--chlink-brand-700) !important;
    border-color: var(--chlink-brand-700) !important;
}
html body .btn-default {
    border-color: var(--chlink-brand-200);
    color: var(--chlink-brand-700);
    background-color: #fff;
}
html body .btn-default:hover {
    background-color: var(--chlink-brand-50);
}
html body .btn-checkout {
    padding: 14px 28px;
    font-size: 16px;
    box-shadow: 0 10px 24px rgba(79, 70, 229, 0.25);
}
html body .btn-continue-shopping {
    color: #64748b;
}

/* ---------- Form controls ---------- */

html body .form-control {
    border-radius: 12px;
    border-color: #e2e6f0;
}
html body .form-control:focus {
    border-color: var(--chlink-brand-400);
    box-shadow: 0 0 0 3px rgba(99, 102, 241, 0.15);
}

/* ---------- Layout wrapper ---------- */

#order-standard_cart {
    padding-top: 24px;
}
#order-standard_cart .header-lined h1 {
    font-size: 28px;
}

/* ---------- Sidebar category panels ---------- */

#order-standard_cart .panel,
#order-standard_cart .card {
    border: 1px solid #eef0f4;
    border-radius: 16px;
    box-shadow: 0 1px 2px rgba(19, 27, 71, 0.04);
    overflow: hidden;
}
#order-standard_cart .panel-heading,
#order-standard_cart .card-header {
    background-color: #fff;
    border-bottom: 1px solid #eef0f4;
    font-weight: 700;
}
#order-standard_cart .list-group-item {
    border-color: #eef0f4;
}
#order-standard_cart .list-group-item.active,
#order-standard_cart .list-group-item-action.active {
    background-color: var(--chlink-brand-50);
    border-color: var(--chlink-brand-100);
    color: var(--chlink-brand-700);
}
#order-standard_cart .badge {
    border-radius: 999px;
    background-color: var(--chlink-brand-100);
    color: var(--chlink-brand-700);
}

/* ---------- Product selection cards ---------- */

/* NOTE: the base stylesheet lays this out with floats, not flexbox —
   .product-desc floats left at 60% width, footer floats right at 40%
   (price stacked above the order button in that narrow column). We
   only add polish on top of that existing structure; replacing it
   with flex/height:100% breaks table-cell-based .row-eq-height sizing
   and produces a runaway-tall empty card. */

#order-standard_cart .product {
    border: 1px solid #eef0f4;
    border-radius: 18px;
    padding: 4px 0 16px;
    background-color: #fff;
    box-shadow: 0 1px 2px rgba(19, 27, 71, 0.04);
    transition: box-shadow 0.2s ease, transform 0.2s ease;
}
#order-standard_cart .product:hover {
    box-shadow: 0 12px 28px rgba(19, 27, 71, 0.1);
    transform: translateY(-2px);
}
#order-standard_cart .product header {
    background-color: #fff;
    border-radius: 18px 18px 0 0;
    border-bottom: 1px solid #eef0f4;
    padding: 16px 20px;
}
#order-standard_cart .product header span {
    font-weight: 700;
    font-size: 16px;
    color: var(--chlink-ink-950);
    font-family: "Manrope", sans-serif !important;
}
#order-standard_cart .product .qty {
    color: var(--chlink-brand-600);
    font-style: normal;
    font-weight: 600;
}
#order-standard_cart .product-desc {
    color: #475569;
    padding: 14px 20px;
}
#order-standard_cart .product-desc ul {
    list-style: none;
    padding: 0;
    margin: 10px 0 0;
}
#order-standard_cart .product-desc ul li {
    padding: 4px 0;
    border-top: 1px dashed #eef0f4;
}
#order-standard_cart .product-desc ul li:first-child {
    border-top: 0;
}
#order-standard_cart .product footer {
    padding: 14px 20px 0;
}
#order-standard_cart .product-pricing {
    color: #64748b;
}
#order-standard_cart .product-pricing .price {
    font-size: 22px;
    font-weight: 800;
    color: var(--chlink-ink-950);
    font-family: "Manrope", sans-serif !important;
}
#order-standard_cart .product footer .btn {
    margin-top: 8px;
}

/* ---------- Cart review (viewcart) ---------- */

#order-standard_cart .view-cart-items-header {
    background-color: var(--chlink-ink-950) !important;
    color: #fff !important;
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    border-radius: 14px 14px 0 0 !important;
    padding: 12px 16px;
}
#order-standard_cart .view-cart-items {
    border: 1px solid #eef0f4 !important;
    border-top: 0 !important;
    border-radius: 0 0 14px 14px;
    overflow: hidden;
}
#order-standard_cart .view-cart-items .item {
    padding: 16px !important;
    border-bottom: 1px solid #eef0f4 !important;
    background-color: #fff !important;
}
#order-standard_cart .view-cart-items .item:last-child {
    border-bottom: 0 !important;
}
#order-standard_cart .item-title {
    font-weight: 700;
    color: var(--chlink-ink-950);
}
#order-standard_cart .item-group,
#order-standard_cart .item-domain {
    display: block;
    font-size: 13px;
    color: #64748b;
}
#order-standard_cart .item-price {
    text-align: right;
    font-weight: 700;
}
#order-standard_cart .item-price .cycle {
    display: block;
    font-size: 12px;
    font-weight: 500;
    color: #94a3b8;
}
#order-standard_cart .view-cart-empty {
    text-align: center;
    padding: 40px 20px;
    color: #94a3b8;
}
#order-standard_cart .view-cart-tabs .nav-tabs {
    border-bottom-color: #eef0f4;
}
#order-standard_cart .view-cart-tabs .nav-link {
    border-radius: 12px 12px 0 0;
    font-weight: 600;
    color: #64748b;
}
#order-standard_cart .view-cart-tabs .nav-link.active {
    color: var(--chlink-brand-700);
    border-color: #eef0f4 #eef0f4 #fff;
}

/* ---------- Order summary sidebar ---------- */

#order-standard_cart .order-summary {
    background-color: #fff;
    border: 1px solid #eef0f4;
    border-radius: 18px;
    padding: 24px;
    box-shadow: 0 1px 2px rgba(19, 27, 71, 0.04);
    position: sticky;
    top: 24px;
}
#order-standard_cart .summary-container {
    background-color: transparent !important;
    padding: 0 !important;
    min-height: 0 !important;
}
#order-standard_cart .order-summary h2 {
    font-size: 20px !important;
    margin-top: 0;
}
#order-standard_cart .summary-container > div {
    padding: 10px 0;
    border-bottom: 1px solid #eef0f4;
}
#order-standard_cart .bordered-totals {
    border-top: 0;
}
#order-standard_cart .total-due-today {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    border-bottom: 0 !important;
    padding-top: 16px !important;
}
#order-standard_cart .total-due-today .amt {
    font-size: 26px;
    font-weight: 800;
    font-family: "Manrope", sans-serif !important;
    color: var(--chlink-ink-950);
}
#order-standard_cart .express-checkout-buttons {
    margin: 16px 0;
}
#order-standard_cart .express-checkout-buttons .separator {
    text-align: center;
    font-size: 11px;
    color: #94a3b8;
    margin: 10px 0;
}

/* ---------- Modals ---------- */

html body .modal-content {
    border-radius: 18px;
    overflow: hidden;
    border: 0;
}

/* ---------- Dark mode (mirrors the Six theme's toggle — the same
   html.dark-mode class is shared since the same header/footer wrap
   these order-form pages) ---------- */

html.dark-mode body {
    background-color: #0a0f1f;
    color: #e7eaf5;
}
html.dark-mode h1, html.dark-mode h2, html.dark-mode h3,
html.dark-mode h4, html.dark-mode h5, html.dark-mode h6 {
    color: #e7eaf5 !important;
}
html.dark-mode #order-standard_cart .panel,
html.dark-mode #order-standard_cart .card,
html.dark-mode #order-standard_cart .product,
html.dark-mode #order-standard_cart .order-summary {
    background-color: #111834;
    border-color: #232b45;
}
html.dark-mode #order-standard_cart .panel-heading,
html.dark-mode #order-standard_cart .card-header {
    background-color: #111834;
    border-bottom-color: #232b45;
    color: #e7eaf5;
}
html.dark-mode #order-standard_cart .product header {
    background-color: #0d1226 !important;
    border-bottom-color: #232b45 !important;
}
html.dark-mode #order-standard_cart .product header span,
html.dark-mode #order-standard_cart .product-pricing .price,
html.dark-mode #order-standard_cart .item-title,
html.dark-mode #order-standard_cart .total-due-today .amt {
    color: #e7eaf5 !important;
}
html.dark-mode #order-standard_cart .product-desc,
html.dark-mode #order-standard_cart .item-group,
html.dark-mode #order-standard_cart .item-domain,
html.dark-mode #order-standard_cart .product-pricing {
    color: #94a3b8 !important;
}
html.dark-mode #order-standard_cart .list-group-item,
html.dark-mode #order-standard_cart .product-desc ul li,
html.dark-mode #order-standard_cart .summary-container > div {
    border-color: #232b45;
}
html.dark-mode #order-standard_cart .view-cart-items {
    border-color: #232b45 !important;
}
html.dark-mode #order-standard_cart .view-cart-items .item {
    background-color: #111834 !important;
    border-bottom-color: #232b45 !important;
    color: #e7eaf5;
}
html.dark-mode #order-standard_cart .summary-container {
    background-color: transparent !important;
}
html.dark-mode #order-standard_cart .summary-container span {
    color: #e7eaf5;
}
html.dark-mode html body .form-control {
    background-color: #111834;
    border-color: #232b45;
    color: #e7eaf5;
}
html.dark-mode html body .btn-default {
    background-color: #111834;
    border-color: #232b45;
    color: #cbd5e1;
}