/* ==========================================================================
   PartlyCloud Cart: the partlycloud.com landing page design on the WHMCS
   order form. Child of standard_cart (see ../theme.yaml).

   WHMCS loads this file only on cart pages, and only when partlycloud_cart is
   the active order form (standard_cart/common.tpl: assetExists custom.css),
   so plain `body` / `#header` selectors here never reach the rest of the
   client area.

   Tokens mirror partlycloud-site/src/styles/global.css. Keep them in sync.
   ========================================================================== */

@font-face {
    font-family: 'Outfit Variable';
    font-style: normal;
    font-display: swap;
    font-weight: 100 900;
    src: url('fonts/outfit-latin-wght-normal.woff2') format('woff2-variations');
}
@font-face {
    font-family: 'Figtree Variable';
    font-style: normal;
    font-display: swap;
    font-weight: 300 900;
    src: url('fonts/figtree-latin-wght-normal.woff2') format('woff2-variations');
}

:root {
    --pc-ink: #0e1a2b;
    --pc-ink-soft: #46566b;
    --pc-ink-deep: #08111d;
    --pc-sky-50: #f4f8fc;
    --pc-sky-100: #e4eef8;
    --pc-sky-200: #c8dcf0;
    --pc-sky-300: #9fc2e6;
    --pc-blue: #2c69ad;
    --pc-sun: #f7b733;
    --pc-sun-hover: #f0a414;
    --pc-line: #d9e4ef;
    --pc-white: #ffffff;
    --pc-green: #1b7f45;
    --pc-font-display: 'Outfit Variable', 'Segoe UI', system-ui, sans-serif;
    --pc-font-body: 'Figtree Variable', 'Segoe UI', system-ui, sans-serif;
    --pc-radius: 14px;
    --pc-radius-lg: 22px;
    --pc-radius-field: 10px;
    --pc-shadow-card: 0 1px 2px rgb(14 26 43 / 6%), 0 18px 40px -18px rgb(14 26 43 / 28%);
    --pc-focus: 0 0 0 3px rgb(44 105 173 / 22%);
}

/* ---------- page: the landing page's sky behind the top of every step ---------- */
body,
body.primary-bg-color {
    background:
        radial-gradient(50rem 22rem at 88% 0%, rgb(255 227 163 / 40%), transparent 60%) no-repeat,
        linear-gradient(180deg, var(--pc-sky-200) 0, var(--pc-sky-100) 14rem, var(--pc-sky-50) 26rem, var(--pc-white) 40rem) no-repeat,
        var(--pc-white);
    color: var(--pc-ink);
    font-family: var(--pc-font-body);
    -webkit-font-smoothing: antialiased;
}
body section#main-body {
    background: transparent;
    padding-top: 1rem;
    padding-bottom: 4rem;
    min-height: calc(100vh - 20rem); /* header + footer height: footer sits at the bottom on short steps */
}
a { color: var(--pc-blue); }
a:hover { color: var(--pc-ink); }

/* The portal's full header, menu and breadcrumb give way to the slim checkout header. */
#header,
.master-breadcrumb {
    display: none !important;
}

/* ---------- slim checkout header (markup from includes/hooks/partlycloud_cart.php) ---------- */
#pc-checkout-header[hidden] {
    display: block !important;
}
.pc-checkout-header .container {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem 2rem;
    padding-top: 1.1rem;
    padding-bottom: 1.1rem;
}
.pc-brand {
    flex: none;
    display: block;
    width: 176px;
    height: 39px;
    background: url('../images/partlycloud-mark.png') left center / contain no-repeat;
}
.pc-steps {
    display: flex;
    align-items: center;
    gap: 0.5rem 1.5rem;
    margin: 0;
    padding: 0;
    list-style: none;
    font-family: var(--pc-font-display);
    font-weight: 600;
    color: var(--pc-ink-soft);
}
.pc-steps li {
    display: flex;
    align-items: center;
    gap: 0.55rem;
    white-space: nowrap;
}
.pc-step-num {
    display: grid;
    place-items: center;
    width: 2rem;
    height: 2rem;
    border-radius: 50%;
    border: 1.5px solid var(--pc-sky-300);
    background: rgb(255 255 255 / 60%);
    font-size: 0.95rem;
}
.pc-steps .is-current { color: var(--pc-ink); }
.pc-steps .is-current .pc-step-num {
    background: var(--pc-ink);
    border-color: var(--pc-ink);
    color: var(--pc-white);
}
.pc-steps .is-done .pc-step-num {
    background: var(--pc-sky-100);
    border-color: var(--pc-sky-100);
    color: var(--pc-blue);
}
.pc-header-links {
    display: flex;
    align-items: center;
    gap: 0.5rem 1.25rem;
    font-family: var(--pc-font-display);
    font-weight: 600;
}
.pc-secure { color: var(--pc-ink-soft); white-space: nowrap; }
.pc-secure i { color: var(--pc-blue); margin-right: 0.3rem; }
.pc-link {
    color: var(--pc-ink);
    text-decoration: none;
    white-space: nowrap;
    padding: 0.45rem 0.95rem;
    border: 1.5px solid var(--pc-sky-300);
    border-radius: 999px;
}
.pc-link:hover { color: var(--pc-ink); border-color: var(--pc-ink); text-decoration: none; }

/* ---------- headings ---------- */
#order-standard_cart h1,
#order-standard_cart h2,
#order-standard_cart h3,
#order-standard_cart .font-size-36 {
    font-family: var(--pc-font-display);
    color: var(--pc-ink);
    letter-spacing: -0.015em;
}
#order-standard_cart .header-lined {
    border: 0;
    margin-bottom: 1.5rem;
    padding-bottom: 0;
}
#order-standard_cart .header-lined h1,
#order-standard_cart .header-lined .font-size-36 {
    font-size: clamp(1.875rem, 3.4vw, 2.5rem);
    font-weight: 650;
    line-height: 1.15;
    margin: 0.5rem 0 0.4rem;
}
#order-standard_cart .header-lined p { color: var(--pc-ink-soft); font-size: 1.0625rem; }

/* Section dividers ("Personal Information", "Payment Details") become plain headings. */
#order-standard_cart .sub-heading,
#order-standard_cart .sub-heading-borderless {
    height: auto;
    border: 0;
    text-align: left;
    margin: 2.25rem 0 1rem;
}
#order-standard_cart .sub-heading span,
#order-standard_cart .sub-heading-borderless span {
    position: static;
    padding: 0;
    font-family: var(--pc-font-display);
    font-size: 1.25rem;
    font-weight: 650;
    color: var(--pc-ink);
    background: transparent !important;
}

/* ---------- buttons: sun pill for the main action, outline pill for the rest ---------- */
#order-standard_cart .btn {
    border-radius: 999px;
    font-family: var(--pc-font-display);
    font-weight: 600;
    transition: background-color 0.15s, border-color 0.15s, color 0.15s, transform 0.15s;
}
#order-standard_cart .btn:focus,
#order-standard_cart .btn:focus-visible {
    outline: 3px solid var(--pc-blue);
    outline-offset: 2px;
    box-shadow: none;
}
#order-standard_cart .btn-primary,
#order-standard_cart .btn-success,
#order-standard_cart .btn-checkout,
#order-standard_cart #btnCompleteOrder {
    background: var(--pc-sun);
    border: 1.5px solid var(--pc-sun);
    color: var(--pc-ink);
    box-shadow: 0 6px 18px -8px rgb(240 164 20 / 70%);
}
#order-standard_cart .btn-primary:hover,
#order-standard_cart .btn-success:hover,
#order-standard_cart .btn-checkout:hover,
#order-standard_cart #btnCompleteOrder:hover,
#order-standard_cart .btn-primary:not(:disabled):active,
#order-standard_cart .btn-success:not(:disabled):active {
    background: var(--pc-sun-hover);
    border-color: var(--pc-sun-hover);
    color: var(--pc-ink);
}
#order-standard_cart .btn-primary:not(:disabled):hover,
#order-standard_cart .btn-checkout:hover,
#order-standard_cart #btnCompleteOrder:not(:disabled):hover {
    transform: translateY(-1px);
}
#order-standard_cart .btn-default,
#order-standard_cart .btn-info,
#order-standard_cart .btn-warning,
#order-standard_cart .btn-add-to-cart {
    background: var(--pc-white);
    border: 1.5px solid var(--pc-sky-300);
    color: var(--pc-ink);
}
#order-standard_cart .btn-default:hover,
#order-standard_cart .btn-info:hover,
#order-standard_cart .btn-warning:hover,
#order-standard_cart .btn-add-to-cart:hover {
    background: var(--pc-white);
    border-color: var(--pc-ink);
    color: var(--pc-ink);
}
#order-standard_cart .btn-link { color: var(--pc-blue); font-family: var(--pc-font-body); }
#order-standard_cart .btn-link:hover { color: var(--pc-ink); }
#order-standard_cart .btn-lg {
    min-height: 3.25rem;
    padding: 0.8rem 1.9rem;
    font-size: 1.125rem;
}
#order-standard_cart .btn:disabled,
#order-standard_cart .btn.disabled {
    opacity: 0.5;
    transform: none;
    box-shadow: none;
}

/* ---------- form fields ---------- */
#order-standard_cart .field,
#order-standard_cart .form-control {
    min-height: 44px;
    border: 1.5px solid var(--pc-line);
    border-radius: var(--pc-radius-field);
    color: var(--pc-ink);
    font-family: var(--pc-font-body);
    font-size: 1rem;
}
#order-standard_cart textarea.field,
#order-standard_cart textarea.form-control { min-height: 0; }
#order-standard_cart .field:focus,
#order-standard_cart .form-control:focus {
    border-color: var(--pc-blue);
    box-shadow: var(--pc-focus);
}
#order-standard_cart .prepend-icon .field-icon { height: 44px; line-height: 44px; }
#order-standard_cart .field-icon i { color: #8aa6c4; }
#order-standard_cart .input-group > .form-control:not(:last-child),
#order-standard_cart .input-group > .field:not(:last-child) {
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
}
#order-standard_cart .input-group > .form-control:not(:first-child),
#order-standard_cart .input-group > .field:not(:first-child) {
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
}
#order-standard_cart .input-group-text {
    background: var(--pc-sky-50);
    border: 1.5px solid var(--pc-line);
    color: var(--pc-ink-soft);
}
#order-standard_cart .input-group-prepend .input-group-text {
    border-radius: var(--pc-radius-field) 0 0 var(--pc-radius-field);
}
#order-standard_cart label { color: var(--pc-ink); }

/* ---------- store page: the plan card, like the landing page's ---------- */
#order-standard_cart .products .row { justify-content: center; }
#order-standard_cart .products .product {
    padding: 0 0 1.25rem;
    border: 1px solid var(--pc-line);
    border-radius: var(--pc-radius-lg);
    background: var(--pc-white);
    box-shadow: var(--pc-shadow-card);
    overflow: hidden;
}
#order-standard_cart .products .product header {
    margin: 0;
    padding: 1.5rem 1.5rem 0.25rem;
    background: var(--pc-white);
    border-radius: 0;
}
#order-standard_cart .products .product header span {
    font-family: var(--pc-font-display);
    font-size: 1.375rem;
    font-weight: 650;
    color: var(--pc-ink);
}
#order-standard_cart .products .product div.product-desc {
    padding: 0.5rem 1.5rem;
    font-size: 0.98rem;
    color: var(--pc-ink-soft);
}
#order-standard_cart .products .product div.product-pricing span.price {
    font-family: var(--pc-font-display);
    font-size: 1.75rem;
    font-weight: 700;
    letter-spacing: -0.02em;
    color: var(--pc-ink);
}
.pc-plan-features {
    display: grid;
    gap: 0.55rem;
    margin: 0.9rem 0 0;
    padding: 0;
    list-style: none;
    color: var(--pc-ink);
}
.pc-plan-features li {
    position: relative;
    padding-left: 1.6rem;
    line-height: 1.4;
}
.pc-plan-features li::before {
    content: '';
    position: absolute;
    left: 0;
    top: 0.15em;
    width: 1.05rem;
    height: 1.05rem;
    background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%232c69ad' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6 9 17l-5-5'/%3E%3C/svg%3E") center / contain no-repeat;
}

/* ---------- step 1: choose a domain ---------- */
#order-standard_cart .domain-selection-options { margin: 0.5rem 0 1.5rem; }
#order-standard_cart .domain-selection-options .option {
    margin-bottom: 0.75rem;
    padding: 1rem 1.25rem;
    border: 1.5px solid var(--pc-line);
    border-radius: var(--pc-radius);
    background: var(--pc-white);
    transition: border-color 0.15s, background-color 0.15s;
}
#order-standard_cart .domain-selection-options .option:hover { border-color: var(--pc-sky-300); }
#order-standard_cart .domain-selection-options .option-selected {
    background: var(--pc-sky-50);
    border-color: var(--pc-blue);
}
#order-standard_cart .domain-selection-options .option > label {
    margin-bottom: 0;
    font-family: var(--pc-font-display);
    font-size: 1.0625rem;
    font-weight: 600;
    color: var(--pc-ink);
}
#order-standard_cart .domain-selection-options .option-selected > label { font-weight: 650; }
#order-standard_cart .domain-checker-available,
#order-standard_cart .domain-lookup-primary-results .domain-available { color: var(--pc-green); }
#order-standard_cart .panel,
#order-standard_cart .card {
    border: 1px solid var(--pc-line);
    border-radius: var(--pc-radius);
    overflow: hidden;
}
#order-standard_cart .panel-heading,
#order-standard_cart .card-header {
    background: var(--pc-sky-50);
    border-bottom: 1px solid var(--pc-line);
    color: var(--pc-ink);
    font-family: var(--pc-font-display);
    font-weight: 600;
}
#order-standard_cart .domain-checker-advanced textarea {
    padding: 0.75rem 1rem;
    border: 1.5px solid var(--pc-line);
    border-radius: var(--pc-radius-field);
    color: var(--pc-ink);
    font-family: var(--pc-font-body);
    font-size: 1rem;
}
#order-standard_cart .domain-checker-advanced textarea:focus {
    outline: 0;
    border-color: var(--pc-blue);
    box-shadow: var(--pc-focus);
}
#order-standard_cart #btnDomainContinue { margin-top: 0.5rem; }

/* ---------- step 2: review ---------- */
#order-standard_cart .view-cart-items-header {
    background: var(--pc-sky-100);
    color: var(--pc-ink);
    border-radius: var(--pc-radius) var(--pc-radius) 0 0;
    font-family: var(--pc-font-display);
    font-weight: 600;
}
#order-standard_cart .view-cart-items {
    border: 1px solid var(--pc-line);
    border-top: 0;
    border-radius: 0 0 var(--pc-radius) var(--pc-radius);
    overflow: hidden;
    background: var(--pc-white);
}
#order-standard_cart .view-cart-items .item {
    background: var(--pc-white);
    border-bottom: 1px solid var(--pc-line);
}
#order-standard_cart .view-cart-items .item:last-child { border-bottom: 0; }
#order-standard_cart .view-cart-items .item:nth-child(even) { background: var(--pc-sky-50); }
#order-standard_cart .view-cart-items .item-title {
    font-family: var(--pc-font-display);
    font-weight: 650;
    color: var(--pc-ink);
}
#order-standard_cart .view-cart-items .item-domain { color: var(--pc-blue); }
#order-standard_cart .empty-cart { margin: 0.5rem 0 0; }
#order-standard_cart .empty-cart .btn {
    padding: 0.25rem 0.6rem;
    background: transparent;
    color: var(--pc-ink-soft);
    font-family: var(--pc-font-body);
    font-weight: 600;
}
#order-standard_cart .empty-cart .btn:hover { color: #b42318; }
#order-standard_cart .view-cart-tabs .nav-tabs { border-bottom-color: var(--pc-line); }
#order-standard_cart .view-cart-tabs .nav-link { font-family: var(--pc-font-display); font-weight: 600; color: var(--pc-ink-soft); }
#order-standard_cart .view-cart-tabs .nav-link.active { color: var(--pc-ink); }

/* Order summary: white card like the landing page's plan card. */
#order-standard_cart .order-summary {
    background: var(--pc-white);
    border: 1px solid var(--pc-line);
    border-radius: var(--pc-radius-lg);
    box-shadow: var(--pc-shadow-card);
    overflow: hidden;
}
#order-standard_cart .order-summary h2 {
    padding: 1.1rem 1.35rem 0.25rem;
    color: var(--pc-ink);
    text-align: left;
    font-family: var(--pc-font-display);
    font-size: 1.25rem;
    font-weight: 650;
}
#order-standard_cart .summary-container {
    background: var(--pc-white);
    padding: 0.75rem 1.35rem 1.35rem;
    font-size: 0.95rem;
    color: var(--pc-ink);
}
#order-standard_cart .order-summary .product-name { font-family: var(--pc-font-display); font-weight: 650; }
#order-standard_cart .order-summary .product-group { color: var(--pc-ink-soft); font-style: normal; }
#order-standard_cart .order-summary .summary-totals { border-color: var(--pc-line); }
#order-standard_cart .order-summary .total-due-today .amt {
    font-family: var(--pc-font-display);
    font-weight: 700;
    letter-spacing: -0.03em;
    color: var(--pc-ink);
}
#order-standard_cart .btn-checkout { width: 100%; }

/* ---------- step 3: checkout ---------- */
#order-standard_cart .alert { border-radius: var(--pc-radius); }
#order-standard_cart .alert-info {
    background: var(--pc-sky-50);
    border-color: var(--pc-sky-200);
    color: var(--pc-ink);
}
#order-standard_cart .well,
#order-standard_cart .cc-input-container {
    border-radius: var(--pc-radius);
    border-color: var(--pc-line);
}
#order-standard_cart #totalDueToday {
    background: var(--pc-sky-50);
    border: 1px solid var(--pc-line);
    color: var(--pc-ink);
    font-family: var(--pc-font-display);
    font-weight: 600;
}
#order-standard_cart #totalDueToday strong { font-weight: 700; letter-spacing: -0.02em; }
#order-standard_cart #btnCompleteOrder { min-width: 16rem; }

/* ---------- footer: the landing page's night-sky footer ---------- */
#footer {
    background: var(--pc-ink-deep);
    color: var(--pc-sky-200);
    font-family: var(--pc-font-body);
}
#footer a,
#footer .nav-link { color: var(--pc-white); font-weight: 600; }
#footer a:hover,
#footer .nav-link:hover { color: var(--pc-white); text-decoration: underline; }
#footer .copyright { color: #8ea3bb; }
#footer .list-inline { display: none; } /* language / currency chooser: one of each */

/* ---------- phones ---------- */
@media (max-width: 991.98px) {
    .pc-checkout-header .container { flex-wrap: wrap; }
    .pc-steps { order: 3; width: 100%; justify-content: space-between; }
}
@media (max-width: 575.98px) {
    .pc-brand { width: 148px; height: 33px; }
    .pc-secure { display: none; }
    .pc-steps { gap: 0.5rem; font-size: 0.95rem; }
    .pc-steps li:not(.is-current) .pc-step-label { display: none; }
    #order-standard_cart .btn-lg,
    #order-standard_cart #btnCompleteOrder { width: 100%; min-width: 0; }
}