/* Caps & Gowns Tradition: webshop (/shop, product pages, cart, checkout, success).
 * Loaded after tradition.css, so the tokens there apply. Burgundy only in the shop (no terracotta).
 * Restyles Mage/simple and module markup without changing it: every id, class and name the
 * parent's scripts rely on stays (see notes/webshop-map.md). Rules start with a body class so they
 * beat main.css without !important where possible.
 */

/* ---------- Shared shop type and buttons ---------- */
body.cms-shop, body.catalog-product-view, body.checkout-cart-index, body.checkout-index-index,
body.checkout-onepage-success, body.customer-account-login, body.customer-account-create {
    font-family: var(--cgt-sans);
    color: var(--cgt-ink);
}
body.catalog-product-view .page-title, body.checkout-cart-index .page-title, body.checkout-onepage-success .page-title,
body.checkout-index-index .step-title, body.checkout-cart-index .cart-summary .summary.title,
body.checkout-index-index .opc-block-summary .title {
    font-family: var(--cgt-serif) !important;
    font-weight: 400 !important;
    letter-spacing: -.005em;
    text-transform: none !important;
    color: var(--cgt-ink);
}
body.catalog-product-view .action.primary, body.checkout-cart-index .action.primary,
body.checkout-index-index .action.primary, body.checkout-onepage-success .action.primary,
body.catalog-product-view .product_add_cart_buttons button {
    background: var(--cgt-burgundy) !important;
    border: 1px solid var(--cgt-burgundy) !important;
    color: var(--cgt-white) !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    font: 700 11px/1 var(--cgt-sans) !important;
    letter-spacing: .2em !important;
    text-transform: uppercase !important;
    padding: 17px 26px !important;
    height: auto !important;
    transition: background .2s ease;
}
body.catalog-product-view .action.primary:hover, body.checkout-cart-index .action.primary:hover,
body.checkout-index-index .action.primary:hover, body.catalog-product-view .product_add_cart_buttons button:hover {
    background: var(--cgt-burgundy-deep) !important;
    border-color: var(--cgt-burgundy-deep) !important;
}

/* ---------- /shop ---------- */
body.cms-shop .breadcrumbs { display: none; }
/* The header is fixed; the parent's 148px offset was for the old, taller header. */
body#html-body.cms-shop .first-block, body.cms-shop .first-block { margin-top: var(--cgt-header-h); }
body .newhome-header .minicart-wrapper { float: none; }
body.cms-shop .side_logo { display: none; } /* parent's header, replaced by .cgt-shophead */
.cgt-shophead { max-width: 1240px; margin: 0 auto; padding: 40px var(--cgt-gutter) 8px; box-sizing: border-box; display: grid; gap: 28px; }
.cgt-shophead * { box-sizing: border-box; }
body .cgt-shophead__back { justify-self: start; color: var(--cgt-ink); font: 700 11px/1 var(--cgt-sans); letter-spacing: .18em; text-transform: uppercase; text-decoration: none; }
body .cgt-shophead__back::before { content: "← "; }
body .cgt-shophead__tabs { display: flex; gap: 28px; padding: 0; border-bottom: 1px solid var(--cgt-rule); }
body .cgt-shophead__tabs .shop_tab_my_open {
    background: none; border: 0; border-bottom: 2px solid transparent; border-radius: 0; box-shadow: none;
    margin: 0 0 -1px; padding: 0 0 12px; cursor: pointer; color: var(--cgt-muted);
    font: 700 11px/1 var(--cgt-sans); letter-spacing: .2em; text-transform: uppercase;
}
body .cgt-shophead__tabs .shop_tab_my_open.active { color: var(--cgt-ink); border-bottom-color: var(--cgt-burgundy); }
body .cgt-shophead__tabs .shop_tab_my_open:hover { color: var(--cgt-burgundy); }
.cgt-shophead__main { display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 24px; }
.cgt-shophead.is-open .cgt-shophead__main { grid-template-columns: 1fr; }
.cgt-shophead__logo { width: 76px; height: 76px; object-fit: contain; border-radius: 50%; border: 1px solid var(--cgt-rule); background: var(--cgt-white); padding: 8px; }
.cgt-shophead__txt { display: grid; gap: 10px; min-width: 0; }
.cgt-shophead .cgt-lbl { color: var(--cgt-burgundy); margin: 0; }
body .cgt-shophead__title { margin: 0; font: 400 clamp(30px, 3.6vw, 48px)/1.1 var(--cgt-serif); letter-spacing: -.01em; color: var(--cgt-ink); text-transform: none; }
body .cgt-shophead__sub { margin: 0; color: var(--cgt-muted); font-size: 16px; line-height: 1.6; }
.cgt-shophead__status { margin: 0; padding: 14px 0 14px 24px; border-left: 1px solid var(--cgt-rule); display: grid; gap: 6px; }
.cgt-shophead__status dt { font: 700 10px/1.3 var(--cgt-sans); letter-spacing: .18em; text-transform: uppercase; color: var(--cgt-muted); }
.cgt-shophead__status dd { margin: 0; display: grid; gap: 2px; }
.cgt-shophead__status b { font: 400 24px/1.1 var(--cgt-serif); color: var(--cgt-burgundy); }
.cgt-shophead__status span { font-size: 13px; color: var(--cgt-muted); }

/* Buy / Rent tabs (CMS page markup) */
body.cms-shop .side.bar.tabs { max-width: 1240px; margin: 8px auto 0; padding: 0 var(--cgt-gutter); box-sizing: border-box; justify-content: flex-start; column-gap: 8px; }
body.cms-shop .side.bar.tabs a { flex: none; width: auto !important; min-width: 0 !important; background: none; border: 1px solid var(--cgt-rule) !important; border-radius: 999px; padding: 9px 18px !important; min-width: 0; }
body.cms-shop .side.bar.tabs a span { font: 600 13px/1 var(--cgt-sans); color: var(--cgt-ink); }
body.cms-shop .side.bar.tabs a.tabActive1, body.cms-shop .side.bar.tabs a.tabActive2 { background: var(--cgt-ink); border-color: var(--cgt-ink) !important; }
body.cms-shop .side.bar.tabs a.tabActive1 span, body.cms-shop .side.bar.tabs a.tabActive2 span { color: var(--cgt-white); }

/* Product grid */
body .cgt-products { display: block; width: auto; max-width: 1240px; margin: 0 auto; padding: 28px var(--cgt-gutter) 96px; box-sizing: border-box; text-align: left; }
.cgt-products__grid { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 44px 24px; }
body .cgt-product.overlay_main_div { width: auto; display: block; margin: 0; }
body .cgt-product__link { display: grid; gap: 14px; color: var(--cgt-ink); text-decoration: none; }
body .cgt-product__link:hover { color: var(--cgt-ink); text-decoration: none; }
body .cgt-product__media.product_image { position: relative; display: block; aspect-ratio: 4 / 5; overflow: hidden; background: #F4F3F0; margin: 0; }
body .cgt-product__media img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; box-sizing: border-box; transition: opacity .45s ease, transform .6s ease; display: block !important; }
/* The hover image is usually a packshot on its own background, so it is shown whole. */
body .cgt-product__media .with_hover_effect { object-fit: contain; padding: 6%; background: #EFEDE7; }
body .cgt-product__media img.with_hover_effect { opacity: 0; }
body .cgt-product__link:hover .has-hover .with_hover_effect { opacity: 1; }
body .cgt-product__link:hover .has-hover .without_hover_effect { opacity: 0; }
body .cgt-product__link:hover .cgt-product__media:not(.has-hover) img { transform: scale(1.03); }
.cgt-product__flag { position: absolute; top: 14px; left: 14px; background: var(--cgt-white); color: var(--cgt-burgundy); font: 700 9px/1 var(--cgt-sans); letter-spacing: .18em; text-transform: uppercase; padding: 7px 9px; }
.cgt-product__txt { display: grid; gap: 6px; }
body .cgt-product__name.product_name { font: 400 21px/1.25 var(--cgt-serif); color: var(--cgt-ink); text-align: left; margin: 0; }
.cgt-product__price { font-size: 14px; color: var(--cgt-muted); }
.cgt-product__price b { font-weight: 600; color: var(--cgt-ink); }
body .cgt-product__cta.plink { justify-self: start; background: none; border: 0; padding: 0 0 4px; border-bottom: 1px solid currentColor; color: var(--cgt-burgundy); font: 700 11px/1 var(--cgt-sans); letter-spacing: .2em; text-transform: uppercase; }

.cgt-shop-empty { max-width: 1240px; margin: 0 auto; padding: 56px var(--cgt-gutter); box-sizing: border-box; display: grid; gap: 14px; justify-items: start; }
.cgt-shop-empty .cgt-lbl { color: var(--cgt-burgundy); margin: 0; }
body .cgt-shop-empty h2 { margin: 0; font: 400 clamp(26px, 3vw, 38px)/1.15 var(--cgt-serif); }
.cgt-shop-empty p { margin: 0; color: var(--cgt-muted); max-width: 52ch; line-height: 1.6; }
.cgt-shop-empty__actions { display: flex; flex-wrap: wrap; align-items: center; gap: 16px 28px; margin-top: 10px; }

/* ---------- Product page (cap and gown package: Step 1 cap, Step 2 gown) ----------
 * Two columns: the 3D model on the left stays in view, the options on the right are grouped
 * (product-steps.js adds the group headings) and end in a sticky bar with the total and the
 * next step. Mobile keeps the parent's sticky model on top. Markup is the parent's.
 */
body.catalog-product-view .page-main { max-width: none; padding: var(--cgt-header-h) 0 0 !important; margin: 0; }
body.catalog-product-view .page-main .columns .column.main {
    display: flex; flex-direction: row-reverse; flex-wrap: nowrap; align-items: flex-start;
    gap: clamp(40px, 5vw, 88px); max-width: 1440px; margin: 0 auto; box-sizing: border-box;
    padding: 32px var(--cgt-gutter) 96px !important; min-height: 0;
}
body.catalog-product-view .page-main .column.main .product.media {
    flex: 0 0 54%; max-width: 54%; width: auto; margin: 0; position: sticky; top: calc(var(--cgt-header-h) + 20px);
    display: grid; gap: 14px; background: none;
}
body.catalog-product-view .page-main .column.main .product-info-main {
    flex: 1 1 0; max-width: 580px; min-width: 0; width: auto; margin: 0 auto 0 0; padding: 0 !important; float: none;
}
body.catalog-product-view .page-main .column.main .product-info-main > * { padding-left: 0 !important; padding-right: 0 !important; }

/* the school strip, rendered at the top of the model column */
.cgt-prodbar { display: flex; align-items: center; justify-content: space-between; gap: 16px; box-sizing: border-box; border-bottom: 1px solid var(--cgt-rule); }
body .cgt-prodbar__back { color: var(--cgt-ink); font: 700 11px/1 var(--cgt-sans); letter-spacing: .18em; text-transform: uppercase; text-decoration: none; }
body .cgt-prodbar__back:hover { color: var(--cgt-burgundy); text-decoration: none; }
.cgt-prodbar__inst { margin: 0; display: flex; align-items: center; gap: 12px; font-size: 14px; }
.cgt-prodbar__inst img { width: 30px; height: 30px; object-fit: contain; border-radius: 50%; }
.cgt-prodbar__inst span { font-family: var(--cgt-serif); font-size: 16px; }
.cgt-prodbar__inst em { font-style: normal; color: var(--cgt-burgundy); font-weight: 600; font-size: 13px; padding-left: 12px; border-left: 1px solid var(--cgt-rule); }
body.catalog-product-view .side_logo { position: static; }
body.catalog-product-view .cgt-prodbar { max-width: none; padding: 0 0 14px; border-bottom: 1px solid var(--cgt-rule); gap: 12px; flex-wrap: wrap; }
body.catalog-product-view .cgt-prodbar__inst span { font-size: 15px; }

/* the model: the parent pins the canvas to the window; here it sits in the sticky column */
body.catalog-product-view .page-main .column.main .product.media canvas.renderCanvasProducts,
body.catalog-product-view .page-main .column.main .product.media .renderCanvasProducts {
    position: relative; left: auto; top: auto; margin: 0; display: block; box-sizing: border-box;
    width: 100%; height: min(calc(100vh - var(--cgt-header-h) - 110px), 780px); min-height: 420px;
    background: #F2F0EB;
}
body.catalog-product-view .product.media .loading-mask.canvas_loader { position: absolute; left: 0; right: 0; top: 48px; bottom: 0; width: auto; height: auto; background: rgba(242, 240, 235, .85); }

/* title, price, description */
body.catalog-product-view .product-info-main .page-title-wrapper { margin: 0; }
body.catalog-product-view .product-info-main .page-title,
body.catalog-product-view .page-title-wrapper.product h1.page-title span { font: 400 clamp(30px, 2.8vw, 42px)/1.1 var(--cgt-serif) !important; color: var(--cgt-ink); margin: 0 !important; letter-spacing: -.01em; }
body.catalog-product-view .product-info-main .product-info-price { margin: 12px 0 0; padding: 0; border: 0; display: block; width: auto; }
body.catalog-product-view .product-info-main .product-info-price .price { font: 500 20px/1 var(--cgt-sans) !important; color: var(--cgt-ink) !important; }
body.catalog-product-view .product-info-main .product.attribute.overview { margin: 16px 0 0; }
body.catalog-product-view .product-info-main .product.attribute.overview .value,
body.catalog-product-view .product-info-main .product.attribute.overview .value p { font: 400 15px/1.6 var(--cgt-sans) !important; color: var(--cgt-muted) !important; max-width: 52ch; margin: 0; }

/* step indicator and heading (option.phtml) */
body.catalog-product-view .cgt-optstep { display: grid; gap: 10px; margin: 32px 0 6px !important; padding-top: 28px !important; border-top: 1px solid var(--cgt-rule); }
.cgt-stepper { list-style: none; margin: 0 0 8px; padding: 0; display: flex; align-items: center; gap: 12px; }
.cgt-stepper li { display: flex; align-items: center; gap: 10px; margin: 0; font: 700 10px/1 var(--cgt-sans); letter-spacing: .2em; text-transform: uppercase; color: #8C8C8C; }
.cgt-stepper li + li::before { content: ""; width: 44px; height: 1px; background: #CFCFD2; margin-right: 2px; }
.cgt-stepper b { display: grid; place-items: center; width: 26px; height: 26px; border-radius: 50%; border: 1px solid #CFCFD2; font: 600 12px/1 var(--cgt-sans); letter-spacing: 0; color: #8C8C8C; }
.cgt-stepper li.is-current { color: var(--cgt-ink); }
.cgt-stepper li.is-current b { background: var(--cgt-burgundy); border-color: var(--cgt-burgundy); color: var(--cgt-white); }
.cgt-stepper li.is-done { color: var(--cgt-burgundy); }
.cgt-stepper li.is-done b { border-color: var(--cgt-burgundy); color: var(--cgt-burgundy); }
body.catalog-product-view .custom_option_heading { margin: 0 !important; padding: 0 !important; border: 0 !important; width: auto !important; font: 400 clamp(24px, 2vw, 30px)/1.15 var(--cgt-serif) !important; color: var(--cgt-ink); text-transform: none !important; letter-spacing: 0 !important; }
.cgt-optstep__intro { margin: 0; font-size: 14px; line-height: 1.55; color: var(--cgt-muted); }

/* the form: options, then the sticky bar; on Step 2 the Back link moves above the options */
body.catalog-product-view .product-add-form form { display: flex; flex-direction: column; }
body.catalog-product-view.cgt-step-gown .product-add-form .product_add_cart_buttons { order: -1; }
body.catalog-product-view .product-options-wrapper { margin: 0; padding: 0; background: none !important; }
body.catalog-product-view #product-options-wrapper > .fieldset { display: flex; flex-direction: column; margin: 0; padding: 0; border: 0; }
body.catalog-product-view #product-options-wrapper > .fieldset > .field {
    float: none !important; width: 100% !important; max-width: none !important; box-sizing: border-box;
    margin: 0 0 24px !important; padding: 0 !important; background: transparent !important; clear: both; position: relative;
}
.cgt-optgroup { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; margin: 14px 0 18px; padding-top: 26px; border-top: 1px solid var(--cgt-rule); }
.cgt-optgroup[hidden] { display: none; }
.cgt-optgroup__title { margin: 0; font: 400 21px/1.2 var(--cgt-serif); color: var(--cgt-ink); }
.cgt-optgroup__note { font-size: 12px; color: #8C8C8C; }
#product-options-wrapper > .fieldset > .cgt-optgroup:first-of-type { border-top: 0; padding-top: 18px; }

/* labels */
body.catalog-product-view .product-options-wrapper .field > .label { display: flex; align-items: baseline; flex-wrap: wrap; gap: 4px 8px; margin: 0 0 12px; padding: 0; float: none; width: auto; }
body.catalog-product-view .product-options-wrapper .field > .label > span:first-child { font: 700 10px/1.3 var(--cgt-sans) !important; letter-spacing: .16em; text-transform: uppercase; color: var(--cgt-ink) !important; }
body.catalog-product-view .product-options-wrapper .field.required > .label > span:first-child::after { content: none !important; }
body.catalog-product-view .product-options-wrapper .field > .label .price-notice,
body.catalog-product-view .product-options-wrapper .field > .label .price-notice .price { font: 500 12px/1.3 var(--cgt-sans) !important; letter-spacing: 0; text-transform: none; color: var(--cgt-muted) !important; }
.cgt-chosen { font: 400 13px/1.3 var(--cgt-sans); color: var(--cgt-muted); }
.cgt-chosen:not(:empty)::before { content: "· "; }
body.catalog-product-view .product-options-wrapper .field.cgt-nolabel > .label { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); margin: 0; }

/* a colour that belongs to the field above it (embroidery, year pin) sits close under it */
body.catalog-product-view #product-options-wrapper > .fieldset > .field.caps_embroidery_name_color,
body.catalog-product-view #product-options-wrapper > .fieldset > .field.caps_embroidery_institution_color,
body.catalog-product-view #product-options-wrapper > .fieldset > .field.year_pin_color,
body.catalog-product-view #product-options-wrapper > .fieldset > .field.gowns_embroidery_left_color,
body.catalog-product-view #product-options-wrapper > .fieldset > .field.gowns_embroidery_right_color { margin-top: -10px !important; padding-left: 16px !important; border-left: 1px solid var(--cgt-rule); }
body.catalog-product-view .product-options-wrapper .field.caps_embroidery_name_color > .label,
body.catalog-product-view .product-options-wrapper .field.caps_embroidery_institution_color > .label,
body.catalog-product-view .product-options-wrapper .field.gowns_embroidery_right_color label.label,
body.catalog-product-view .product-options-wrapper .field.gowns_embroidery_left_color label.label { display: flex !important; visibility: visible !important; opacity: 1 !important; height: auto !important; margin-bottom: 10px; }

/* selects (root.phtml draws .styledSelect over every select) */
body .product-options-wrapper .control .styledSelect {
    border: 1px solid #CFCFD2; border-radius: 0; background: var(--cgt-white); height: auto; box-sizing: border-box;
    font: 400 15px/24px var(--cgt-sans); color: var(--cgt-ink); padding: 12px 44px 12px 14px;
    -webkit-font-smoothing: antialiased; transition: border-color .2s ease;
}
body .product-options-wrapper .control .styledSelect:hover, body .product-options-wrapper .control .styledSelect.active { border-color: var(--cgt-ink); }
body .product-options-wrapper .styledSelect:after { content: ""; border: 0; width: 7px; height: 7px; border-right: 1.5px solid var(--cgt-ink); border-bottom: 1.5px solid var(--cgt-ink); transform: rotate(45deg); position: absolute; top: 18px; right: 18px; }
body .product-options-wrapper .styledSelect.active:after { transform: rotate(-135deg); top: 22px; }
body .product-options-wrapper .select { position: relative; }
body .product-options-wrapper .select .options { position: absolute; left: 0; right: 0; z-index: 30; margin: 0; list-style: none; background: var(--cgt-white); border: 1px solid var(--cgt-ink); border-radius: 0; box-shadow: 0 18px 36px -24px rgba(0, 0, 0, .45); padding: 4px 0; max-height: 280px; overflow-y: auto; top: calc(100% - 1px); }
body .product-options-wrapper .select .options li { margin: 0; padding: 10px 14px; font: 400 14px/1.3 var(--cgt-sans); color: var(--cgt-ink); cursor: pointer; }
body .product-options-wrapper .select .options li:hover { background: #F6EFF0; color: var(--cgt-burgundy); }
body .product-options-wrapper .select .options li.selected { font-weight: 600; color: var(--cgt-burgundy); }
body .product-options-wrapper .select .options li.list-item0 { color: #8C8C8C; }
/* colour options show as swatches; their dropdown stays hidden (the swatches set it) */
body.catalog-product-view .product-options-wrapper .control:has(.swatches-container) > .select { display: none; }
body .product-options-wrapper select.s-hidden { display: none; }

/* size guide link: the parent draws it with .control::after; clicking the control opens it */
body .product-options-wrapper .design_select.size_s label.label ~ .control { position: relative; }
body .product-options-wrapper .design_select.size_s label.label ~ .control::after,
body .jacket_size.custom_products_options_select::after {
    content: "Size guide" !important; position: absolute !important; left: auto !important; right: 0 !important; top: -26px !important; bottom: auto !important;
    font: 600 12px/1 var(--cgt-sans) !important; letter-spacing: .02em; color: var(--cgt-burgundy) !important; background: none !important;
    padding: 0 !important; text-decoration: underline; text-underline-offset: 4px; cursor: pointer;
}
body.catalog-product-view .product-options-wrapper .field.design_select.size_s { margin-bottom: 24px !important; }

/* text fields: an underline, like writing on a card */
body.catalog-product-view .product-info-main .control.text_field_custom input.input-text,
body.catalog-product-view .product-info-main .control.text_field_custom textarea {
    width: 100%; box-sizing: border-box; height: auto; padding: 10px 0 !important;
    border: 0 !important; border-bottom: 1px solid #9C9C9F !important; border-radius: 0 !important; box-shadow: none;
    font: 400 17px/1.3 var(--cgt-sans) !important; color: var(--cgt-ink) !important; background: transparent !important;
}
body.catalog-product-view .product-info-main .control.text_field_custom input.input-text::placeholder { color: #9A9A9A; }
body.catalog-product-view .product-info-main .control.text_field_custom input.input-text:focus { border-bottom: 1px solid var(--cgt-burgundy) !important; box-shadow: 0 1px 0 var(--cgt-burgundy); outline: none; }
/* school students tick a box instead of typing the school name (package.phtml adds it) */
body.catalog-product-view .institution_checkbox_contents { display: flex; align-items: center; gap: 12px; padding: 14px 16px; border: 1px solid #CFCFD2; font: 400 15px/1.4 var(--cgt-sans); color: var(--cgt-ink); cursor: pointer; box-sizing: border-box; }
body.catalog-product-view .institution_checkbox_contents input { width: 18px; height: 18px; margin: 0; accent-color: var(--cgt-burgundy); flex: none; }

/* radio choices (cap style Classic / Classic Plus / Royal; sleeves) as tiles */
body.catalog-product-view .product-options-wrapper .options-list { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; margin: 0; }
body.catalog-product-view .product-options-wrapper .gowns_sleeves .options-list { grid-template-columns: repeat(2, minmax(0, 1fr)); }
body.catalog-product-view .product-add-form .design_radio .field.choice label.label::before,
body.catalog-product-view .product-add-form .design_radio .field.choice label.label::after,
body.catalog-product-view .product-options-wrapper .options-list.nested .field.choice label::before { content: none !important; display: none !important; }
body.catalog-product-view .product-options-wrapper .options-list .field.choice { display: block !important; margin: 0 !important; padding: 0 !important; position: relative; width: auto !important; float: none !important; }
body.catalog-product-view .product-options-wrapper .options-list .field.choice input { position: absolute !important; opacity: 0 !important; width: 1px !important; height: 1px !important; margin: 0 !important; pointer-events: none; }
body.catalog-product-view .product-info-main .product-options-wrapper .options-list .field.choice label.label {
    display: flex; flex-direction: column; justify-content: center; gap: 4px; width: 100%; height: 100%; min-height: 64px; min-width: 0; box-sizing: border-box; margin: 0; padding: 12px 14px;
    border: 1px solid #CFCFD2; border-radius: 0; background: var(--cgt-white); cursor: pointer; transition: border-color .2s ease, background .2s ease;
}
body.catalog-product-view .product-info-main .product-options-wrapper .options-list .field.choice label.label > span:first-child { font: 500 15px/1.25 var(--cgt-sans) !important; letter-spacing: 0; text-transform: none; color: var(--cgt-ink); }
body.catalog-product-view .product-info-main .product-options-wrapper .options-list .field.choice label.label .price-notice,
body.catalog-product-view .product-info-main .product-options-wrapper .options-list .field.choice label.label .price-notice .price { font: 400 13px/1.2 var(--cgt-sans) !important; color: var(--cgt-muted) !important; }
body.catalog-product-view .product-info-main .product-options-wrapper .options-list .field.choice label.label:hover { border-color: var(--cgt-ink); }
body.catalog-product-view .product-info-main .product-options-wrapper .options-list .field.choice input:checked + label.label { border-color: var(--cgt-burgundy); box-shadow: inset 0 0 0 1px var(--cgt-burgundy); background: #FBF7F8; }
body.catalog-product-view .product-info-main .product-options-wrapper .options-list .field.choice input:focus-visible + label.label { outline: 2px solid var(--cgt-burgundy); outline-offset: 2px; }
/* the note the parent adds under a choice (cap style descriptions, embroidery notes) */
body.catalog-product-view .product-options-wrapper .desc-active { margin: 12px 0 0; padding: 0; background: none; border: 0; font: 400 13px/1.6 var(--cgt-sans); color: var(--cgt-muted); max-width: 60ch; }

/* swatches */
body .swatches-container { display: flex; flex-wrap: wrap; gap: 12px; }
body .swatches-container > div { margin: 0; line-height: 0; }
body.catalog-product-view .product-options-wrapper .swatches-container .swatch-img + span.swatches_color_title,
body.catalog-product-view .product-options-wrapper .swatches-container .swatch-img.current + span.swatches_color_title { display: none !important; } /* the chosen name shows next to the label instead */
body .swatches-container .swatch-img, body .swatches-container .swatch-span {
    width: 36px !important; height: 36px !important; border-radius: 50%; object-fit: cover; margin: 0 !important; padding: 0 !important;
    border: 1px solid rgba(0, 0, 0, .12); box-shadow: 0 0 0 3px var(--cgt-white); cursor: pointer; transition: box-shadow .2s ease;
}
body .swatches-container .swatch-span { width: auto !important; height: auto !important; border-radius: 0; padding: 9px 14px !important; line-height: 1.2; font-size: 14px; }
body .swatches-container .swatch-img:hover { box-shadow: 0 0 0 3px var(--cgt-white), 0 0 0 4px #BDBDBD; }
body .swatches-container .swatch-img.current { box-shadow: 0 0 0 3px var(--cgt-white), 0 0 0 4.5px var(--cgt-burgundy); }

/* the sticky bar (product-steps.js marks it .cgt-bar): total and the next step on Step 1, total and Add to cart on Step 2 */
body.catalog-product-view .product-add-form .product_add_cart_buttons { display: flex; gap: 12px; }
body.catalog-product-view .product-add-form .product_add_cart_buttons.cgt-bar,
body.catalog-product-view .product-info-main .product-add-form .product-options-bottom.cgt-bar {
    position: sticky; bottom: 0; z-index: 20; float: none !important; width: 100% !important; box-sizing: border-box;
    display: flex; align-items: center; gap: 20px; margin: 12px 0 0; padding: 16px 0 !important;
    background: var(--cgt-white) !important; border-top: 1px solid var(--cgt-rule);
    box-shadow: -12px 0 0 var(--cgt-white), 12px 0 0 var(--cgt-white); /* covers swatch rings scrolling under the bar */
}
body.catalog-product-view .product-info-main .product-add-form .product-options-bottom .box-tocart { flex: 1; margin: 0; padding: 0; width: auto; }
body.catalog-product-view .product-info-main .product-add-form .product-options-bottom .box-tocart .fieldset,
body.catalog-product-view .product-info-main .product-add-form .product-options-bottom .actions { display: block; margin: 0; padding: 0; width: 100%; }
.cgt-total { margin: 0; display: grid; gap: 4px; flex: none; min-width: 108px; }
.cgt-total span { font: 700 10px/1 var(--cgt-sans); letter-spacing: .18em; text-transform: uppercase; color: var(--cgt-muted); }
.cgt-total b { font: 600 18px/1 var(--cgt-sans); color: var(--cgt-ink); white-space: nowrap; }
body.catalog-product-view .product_add_cart_buttons .product_event_listner { background: none !important; border: 0 !important; border-radius: 0 !important; padding: 0 !important; margin: 0 !important; box-shadow: none !important; width: auto !important; }
body.catalog-product-view .product_add_cart_buttons .product_event_listner button,
body.catalog-product-view #product-addtocart-button { width: 100% !important; margin: 0 !important; transform: none !important; }
body.catalog-product-view #product-addtocart-button span { font: inherit !important; letter-spacing: inherit !important; text-transform: inherit !important; }
body.catalog-product-view .product_add_cart_buttons .next_gown_buton { flex: 1; }
body.catalog-product-view .product_add_cart_buttons .next_gown_buton button::after { content: " →"; }
/* Step 2: Back is a quiet link above the options, not a second bar */
body.catalog-product-view.cgt-step-gown .product-add-form .product_add_cart_buttons { position: static; border: 0; margin: 0 0 4px; padding: 0 !important; }
body.catalog-product-view.cgt-step-gown .product-add-form .product_add_cart_buttons .cgt-total { display: none; }
body.catalog-product-view .product_add_cart_buttons .back_to_cap_product button {
    width: auto !important; padding: 6px 0 !important; background: none !important; border: 0 !important; color: var(--cgt-ink) !important;
    font: 700 11px/1 var(--cgt-sans) !important; letter-spacing: .18em !important; text-transform: uppercase !important;
}
body.catalog-product-view .product_add_cart_buttons .back_to_cap_product button:hover { color: var(--cgt-burgundy) !important; background: none !important; }
body.catalog-product-view .custom-text { display: none; } /* stray "Test 1" from a Tbi_Student plugin */
body.catalog-product-view .mage-error, body.catalog-product-view div.mage-error { color: var(--cgt-burgundy) !important; font-size: 13px; margin-top: 8px; }

/* size guide (customPopup.phtml): main.css slides it in from the right; restyled, same behaviour */
body .size_guide_cover { background: rgba(11, 11, 11, .5) !important; text-align: left; z-index: 200000 !important; } /* above the fixed header */
body .size_guide_cover .size_guide_contents {
    width: min(460px, 100vw); height: 100%; margin-left: auto; box-sizing: border-box; overflow-y: auto;
    padding: 64px 32px 32px; background: var(--cgt-white); border-radius: 0 !important; font-family: var(--cgt-sans); color: var(--cgt-ink);
    box-shadow: -24px 0 48px -32px rgba(0, 0, 0, .5);
}
body .size_guide_contents img { max-width: 100%; height: auto; }
/* the guide sits inside the sticky model column, so lift that column above the header while it is open */
body.catalog-product-view .page-main .column.main .product.media:has(.size_guide_cover.active_guide) { z-index: 200000; }
body .size_guide_contents h3 { margin: 0 0 10px; font: 400 26px/1.2 var(--cgt-serif); color: var(--cgt-ink); }
body .size_guide_contents p { margin: 0 0 20px; font-size: 14px; line-height: 1.55; color: var(--cgt-muted); }
body .size_guide_contents table { border-collapse: collapse; width: 100%; font-size: 14px; }
body .size_guide_contents th { font: 700 10px/1.2 var(--cgt-sans); letter-spacing: .16em; text-transform: uppercase; }
body .size_guide_contents th, body .size_guide_contents td { border-bottom: 1px solid var(--cgt-rule); padding: 12px 8px 12px 0; text-align: left; }
body .size_guide_close { top: 20px; right: 20px; padding: 6px; line-height: 0; }

@media (max-width: 1100px) {
    body.catalog-product-view .page-main .column.main .product.media { flex-basis: 48%; max-width: 48%; }
    body.catalog-product-view .product-options-wrapper .options-list { grid-template-columns: repeat(auto-fit, minmax(128px, 1fr)); }
    body.catalog-product-view .cgt-prodbar__inst span { display: none; }
    .cgt-prodbar__inst em { white-space: nowrap; }
}
/* phones and small tablets: the parent keeps the model at the top while the options scroll */
@media (max-width: 768px) {
    body.catalog-product-view .page-main .columns .column.main { flex-direction: column-reverse; gap: 0; padding: 0 !important; }
    body.catalog-product-view .page-main .column.main .product.media { flex: none; max-width: none; width: 100%; position: sticky; top: var(--cgt-header-h); z-index: 15; gap: 0; background: #F2F0EB; }
    body.catalog-product-view .cgt-prodbar { padding: 10px 16px; background: var(--cgt-white); flex-wrap: nowrap; }
    body.catalog-product-view .cgt-prodbar__inst img { display: none; }
    .cgt-prodbar__inst em { padding-left: 0; border: 0; font-size: 12px; }
    body .cgt-prodbar__back { font-size: 10px; letter-spacing: .14em; white-space: nowrap; }
    body.catalog-product-view .page-main .column.main .product.media canvas.renderCanvasProducts,
    body.catalog-product-view .page-main .column.main .product.media .renderCanvasProducts { height: 30vh; min-height: 220px; }
    body.catalog-product-view .page-main .column.main .product-info-main { max-width: none; width: 100%; margin: 0; padding: 24px 16px 0 !important; box-sizing: border-box; }
    body.catalog-product-view .product-info-main .page-title, body.catalog-product-view .page-title-wrapper.product h1.page-title span { font-size: 28px !important; }
    body.catalog-product-view .cgt-optstep { margin-top: 24px !important; padding-top: 22px !important; }
    body.catalog-product-view .product-add-form .product_add_cart_buttons.cgt-bar,
    body.catalog-product-view .product-info-main .product-add-form .product-options-bottom.cgt-bar { margin-left: -16px; margin-right: -16px; width: auto !important; padding: 12px 16px calc(12px + env(safe-area-inset-bottom)) !important; box-shadow: 0 -10px 24px -18px rgba(0, 0, 0, .3); }
    body.catalog-product-view.cgt-step-gown .product-add-form .product_add_cart_buttons { margin: 0 0 4px; padding: 0 !important; box-shadow: none; }
    body.catalog-product-view .product-options-wrapper .options-list { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    body.catalog-product-view .product-info-main .product-options-wrapper .options-list .field.choice label.label { padding: 10px; min-height: 58px; }
    body.catalog-product-view .cgt-bar button { padding-left: 14px !important; padding-right: 14px !important; letter-spacing: .14em !important; white-space: nowrap; }
    .cgt-total { min-width: 0; }
    .cgt-total b { font-size: 17px; }
    body.catalog-product-view .product-info-main .product-options-wrapper .options-list .field.choice label.label > span:first-child { font-size: 14px !important; }
}

/* ---------- Cart (type, colour and buttons only; layout stays the parent's) ---------- */
body.checkout-cart-index .page-title-wrapper { margin: 40px 0 20px; }
body.checkout-cart-index .page-title { font-size: clamp(30px, 3vw, 44px) !important; }
body.checkout-cart-index #shopping-cart-table thead th { font: 700 10px/1.3 var(--cgt-sans); letter-spacing: .16em; text-transform: uppercase; color: var(--cgt-muted); border-bottom: 1px solid var(--cgt-rule); }
body.checkout-cart-index #shopping-cart-table .product-item-name a { font: 400 19px/1.3 var(--cgt-serif); color: var(--cgt-ink); }
body.checkout-cart-index #shopping-cart-table .item-options dt { font-weight: 600; color: var(--cgt-ink); }
body.checkout-cart-index #shopping-cart-table .item-options dd { color: var(--cgt-muted); }
body.checkout-cart-index .cart.item { border-bottom: 1px solid var(--cgt-rule); }
body.checkout-cart-index .qty_increase_decrease { border: 1px solid #CFCFD2; border-radius: 0; }
body.checkout-cart-index .cart-summary { background: var(--cgt-ivory); border-radius: 0; padding: 28px 26px; }
body.checkout-cart-index .cart-summary .summary.title { font-size: 26px !important; }
body.checkout-cart-index .cart-totals .grand .amount strong, body.checkout-cart-index .cart-totals .grand .mark strong { font: 600 18px/1.3 var(--cgt-sans); }
body.checkout-cart-index .action.primary.checkout { width: 100%; }
body.checkout-cart-index #shopping-cart-table .col.price .price, body.checkout-cart-index #shopping-cart-table .col.subtotal .price { font-size: 15px; font-weight: 600; color: var(--cgt-ink); }


/* ---------- Checkout (type, colour and buttons only; layout and knockout templates untouched) ---------- */
body.checkout-index-index .opc-wrapper .step-title { font-size: 28px !important; border-bottom: 1px solid var(--cgt-rule); padding-bottom: 14px; }
body.checkout-index-index .home-pickup-delivery { gap: 12px; }
body.checkout-index-index #tabs1, body.checkout-index-index #tabs2 { border: 1px solid #CFCFD2 !important; border-radius: 0 !important; background: var(--cgt-white) !important; font-family: var(--cgt-sans); }
body.checkout-index-index #tabs1.tab_active_checkout, body.checkout-index-index #tabs2.tab_active_checkout { border-color: var(--cgt-burgundy) !important; box-shadow: inset 0 0 0 1px var(--cgt-burgundy); background: #FBF7F8 !important; }
body.checkout-index-index .delivery-notes-container, body.checkout-index-index .pickup-notes-container { background: var(--cgt-ivory) !important; border: 0 !important; border-radius: 0 !important; }
body.checkout-index-index .field .label { font: 700 10px/1.3 var(--cgt-sans); letter-spacing: .14em; text-transform: uppercase; color: var(--cgt-ink); }
body.checkout-index-index .field input.input-text, body.checkout-index-index .field select { border: 1px solid #CFCFD2; border-radius: 0; height: 46px; font-size: 15px; }
body.checkout-index-index .field input.input-text:focus { border-color: var(--cgt-ink); box-shadow: none; }
body.checkout-index-index .opc-block-summary { background: var(--cgt-ivory); border-radius: 0; padding: 26px; }
body.checkout-index-index .opc-block-summary .title { font-size: 24px !important; }

/* ---------- Order confirmation ---------- */
body.checkout-onepage-success .page-title, body.checkout-onepage-success h1 { font-family: var(--cgt-serif) !important; font-weight: 400 !important; }

/* ---------- Responsive ---------- */
@media (max-width: 1000px) {
    .cgt-products__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 36px 16px; }
    .cgt-shophead__main { grid-template-columns: auto 1fr; }
    .cgt-shophead__status { grid-column: 1 / -1; border-left: 0; border-top: 1px solid var(--cgt-rule); padding: 14px 0 0; grid-template-columns: auto 1fr; align-items: baseline; column-gap: 16px; }
    .cgt-shophead__status dd { grid-auto-flow: column; justify-content: start; gap: 12px; align-items: baseline; }
}
@media (max-width: 560px) {
    .cgt-shophead { padding-top: 24px; gap: 20px; }
    .cgt-shophead__logo { width: 56px; height: 56px; }
    .cgt-shophead__main { gap: 14px; }
    .cgt-products__grid { gap: 28px 12px; }
    body .cgt-product__name.product_name { font-size: 17px; }
    .cgt-product__flag { top: 8px; left: 8px; }
    .cgt-prodbar__inst span { display: none; }
    .cgt-shophead__status { grid-template-columns: 1fr; row-gap: 6px; }
    .cgt-shophead__status b { font-size: 20px; }
    body.cms-shop .side.bar.tabs a { flex: none; }
}