/* ════════════════════════════════════════════════════════════════
   NCO Theme — Composite Products  |  Premium Redesign
   Design language: clean cards · soft depth · #0070ba accent
   ════════════════════════════════════════════════════════════════ */

/* ── Design tokens ─────────────────────────────────────────── */
:root{
	--cp-accent:       #0070ba;
	--cp-accent-dark:  #005a96;
	--cp-accent-deep:  #004577;
	--cp-accent-light: rgba(0,112,186,.08);
	--cp-accent-glow:  rgba(0,112,186,.22);
	--cp-surface:      #fff;
	--cp-bg:           #f4f6f9;
	--cp-border:       rgba(0,0,0,.07);
	--cp-border-md:    rgba(0,0,0,.11);
	--cp-text:         #111;
	--cp-text-muted:   #666;
	--cp-text-light:   #999;
	--cp-radius-sm:    10px;
	--cp-radius:       16px;
	--cp-radius-lg:    20px;
	--cp-shadow-xs:    0 1px 4px rgba(0,0,0,.05);
	--cp-shadow-sm:    0 2px 12px rgba(0,0,0,.06);
	--cp-shadow:       0 4px 24px rgba(0,0,0,.08);
	--cp-shadow-lg:    0 8px 40px rgba(0,0,0,.1);
	--cp-transition:   all .22s cubic-bezier(.4,0,.2,1);
}

/* ════════════════════════════════════════════════════════════════
   1. TWO-COLUMN PAGE LAYOUT
   ════════════════════════════════════════════════════════════════ */
.nco-composite-form{
	/* kill any inherited float baggage */
	display:block;
}
.summary-add-to-cart-form.summary-add-to-cart-form-composite {
    width:100%;
}
.nco-cp-layout{
	display:grid;
	grid-template-columns:1fr 340px;
	gap:28px;
	align-items:start;
	width:100%;
}

/* ── LEFT column: step cards ── */
.nco-cp-steps{
	display:flex;
	flex-direction:column;
	gap:16px;
	min-width:0;
}

/* ── RIGHT column: sticky sidebar ── */
.nco-cp-sidebar{
	position:sticky;
	top:24px;
}

.nco-cp-sidebar-inner{
	display:flex;
	flex-direction:column;
	gap:16px;
}

/* ════════════════════════════════════════════════════════════════
   2. INTRO BANNER  (injected via hook)
   ════════════════════════════════════════════════════════════════ */
.nco-composite-intro{
	display:flex;
	align-items:center;
	gap:12px;
	padding:14px 20px;
	background:linear-gradient(135deg,#eef6ff,#e3eeff);
	border-left:4px solid var(--cp-accent);
	border-radius:0 var(--cp-radius-sm) var(--cp-radius-sm) 0;
	font-size:13.5px;
	font-weight:600;
	color:#1a3a5c;
	margin-bottom:4px;
}
.nco-composite-intro i{
	color:var(--cp-accent);
	font-size:17px;
	flex-shrink:0;
}

/* ════════════════════════════════════════════════════════════════
   3. COMPONENT STEP CARDS
   ════════════════════════════════════════════════════════════════ */
.nco-component-card{
	background:var(--cp-surface);
	border:1.5px solid var(--cp-border);
	border-radius:var(--cp-radius);
	box-shadow:var(--cp-shadow-sm);
	overflow:hidden;
	transition:var(--cp-transition);
}
.nco-component-card:hover{
	border-color:rgba(0,112,186,.18);
	box-shadow:var(--cp-shadow);
}
/* Active / open card gets accent left-border */
.nco-component-card.open,
.nco-component-card.current{
	border-left:3px solid var(--cp-accent);
	box-shadow:var(--cp-shadow);
}
/* Completed card gets a faint success tint */
.nco-component-card.complete{
	border-left:3px solid #22c55e;
}
.nco-component-card.complete .nco-step-complete-icon{
	display:inline-block !important;
	color:#22c55e;
}
.nco-component-card.complete .nco-step-toggle-icon{
	display:none !important;
}

/* ── Card: title bar ── */
.nco-component-title-wrapper{
	padding:18px 22px 0;
}

.nco-component-title{
	display:flex !important;
	align-items:center !important;
	gap:0 !important;
	margin:0 0 0 !important;
	font-size:0 !important; /* hide default text; children carry the text */
	cursor:default;
}
/* hide the accessibility span visually (keep for screen readers) */
.nco-component-title .aria_title{
	position:absolute;
	width:1px;height:1px;
	overflow:hidden;clip:rect(0,0,0,0);
	white-space:nowrap;
}

.nco-step-heading{
	display:flex;
	align-items:center;
	gap:12px;
	flex:1;
}

/* Numbered badge */
.nco-step-badge{
	display:inline-flex;
	align-items:center;
	justify-content:center;
	width:30px;
	height:30px;
	min-width:30px;
	border-radius:50%;
	background:var(--cp-accent);
	color:#fff;
	font-size:13px;
	font-weight:800;
	flex-shrink:0;
	line-height:1;
	box-shadow:0 2px 8px var(--cp-accent-glow);
}
.nco-component-card.complete .nco-step-badge{
	background:#22c55e;
	box-shadow:0 2px 8px rgba(34,197,94,.3);
}

/* Step label text */
.nco-step-label{
	font-size:15px;
	font-weight:800;
	color:var(--cp-text);
	letter-spacing:-.01em;
	line-height:1.25;
}

/* Right-side status icons */
.nco-step-status{
	margin-left:auto;
	display:flex;
	align-items:center;
	gap:6px;
	color:var(--cp-text-light);
	font-size:14px;
}
.nco-step-complete-icon{
	display:none; /* shown via .complete class above */
}
.nco-toggle-btn{
	background:none;
	border:none;
	padding:0;
	cursor:pointer;
	color:var(--cp-text-muted);
	line-height:1;
}

/* ── Card: inner body ── */
.nco-component-inner{
	padding:16px 22px 22px;
}

/* ── Component description ── */
.nco-component-description{
	display:flex;
	align-items:flex-start;
	gap:10px;
	padding:10px 14px;
	background:var(--cp-accent-light);
	border-radius:var(--cp-radius-sm);
	margin-bottom:16px;
	font-size:13px;
	color:#2a4a6a;
	line-height:1.6;
}
.nco-component-description i{
	color:var(--cp-accent);
	font-size:14px;
	flex-shrink:0;
	margin-top:2px;
}
.nco-component-description-text p{ margin:0; }

/* ════════════════════════════════════════════════════════════════
   4. OPTION STYLES — thumbnails, dropdowns, radios
   ════════════════════════════════════════════════════════════════ */

/* ── Thumbnails grid ── */
.component_options_thumbnails .product-thumbnails{
	display:grid;
	grid-template-columns:repeat(auto-fill,minmax(110px,1fr));
	gap:12px;
	list-style:none;
	margin:0;
	padding:0;
}
.component_options_thumbnails .product-thumbnails .product-thumbnail{
	position:relative;
	display:flex;
	flex-direction:column;
	align-items:center;
	text-align:center;
	padding:10px 8px 10px;
	background:var(--cp-bg);
	border:2px solid transparent;
	border-radius:var(--cp-radius-sm);
	cursor:pointer;
	transition:var(--cp-transition);
}
.component_options_thumbnails .product-thumbnails .product-thumbnail:hover{
	background:#fff;
	border-color:rgba(0,112,186,.3);
	box-shadow:var(--cp-shadow-sm);
	transform:translateY(-2px);
}
.component_options_thumbnails .product-thumbnails .product-thumbnail.selected{
	background:#fff;
	border-color:var(--cp-accent);
	box-shadow:0 0 0 3px var(--cp-accent-light), var(--cp-shadow-sm);
}
/* Selected tick */
.component_options_thumbnails .product-thumbnails .product-thumbnail.selected::after{
	content:'\f00c';
	font-family:'Font Awesome 6 Free';
	font-weight:900;
	font-size:9px;
	position:absolute;
	top:6px;right:6px;
	width:18px;height:18px;
	display:flex;align-items:center;justify-content:center;
	background:var(--cp-accent);
	color:#fff;
	border-radius:50%;
}
.component_options_thumbnails .product-thumbnails .product-thumbnail img{
	width:100%;
	height:86px;
	object-fit:contain;
	border-radius:8px;
	display:block;
	margin-bottom:8px;
}
.component_options_thumbnails .product-thumbnails .product-thumbnail .thumbnail-title{
	font-size:11.5px;
	font-weight:700;
	color:#333;
	line-height:1.35;
	word-break:break-word;
}
.component_options_thumbnails .product-thumbnails .product-thumbnail .thumbnail-price{
	font-size:11px;
	font-weight:600;
	color:var(--cp-accent);
	margin-top:4px;
}

/* ── Dropdown select ── */
.component_options_dropdowns select.cp_comp_options{
	width:100%;
	padding:11px 40px 11px 14px;
	font-size:14px;
	font-weight:600;
	color:var(--cp-text);
	border:1.5px solid var(--cp-border-md);
	border-radius:var(--cp-radius-sm);
	background:#fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='11' height='7' viewBox='0 0 11 7'%3E%3Cpath fill='%230070ba' d='M5.5 7L0 0h11z'/%3E%3C/svg%3E") no-repeat right 14px center;
	appearance:none;
	-webkit-appearance:none;
	cursor:pointer;
	transition:var(--cp-transition);
	box-shadow:var(--cp-shadow-xs);
}
.component_options_dropdowns select.cp_comp_options:hover{
	border-color:rgba(0,112,186,.35);
}
.component_options_dropdowns select.cp_comp_options:focus{
	outline:none;
	border-color:var(--cp-accent);
	box-shadow:0 0 0 3px var(--cp-accent-light);
}

/* ── Radio buttons ── */
.component_options_radios .cp_radios{
	display:flex;
	flex-direction:column;
	gap:8px;
	list-style:none;
	margin:0;
	padding:0;
}
.component_options_radios .cp_radios li{
	position:relative;
}
.component_options_radios .cp_radios li label{
	display:flex;
	align-items:center;
	gap:12px;
	padding:11px 16px;
	border:1.5px solid var(--cp-border-md);
	border-radius:var(--cp-radius-sm);
	cursor:pointer;
	font-size:13.5px;
	font-weight:600;
	color:#333;
	transition:var(--cp-transition);
	background:#fafbfc;
}
.component_options_radios .cp_radios li label:hover{
	border-color:rgba(0,112,186,.35);
	background:#fff;
}
.component_options_radios .cp_radios li.selected label,
.component_options_radios .cp_radios li input[type="radio"]:checked ~ label{
	border-color:var(--cp-accent);
	background:#f0f7ff;
	color:var(--cp-accent);
	box-shadow:0 0 0 3px var(--cp-accent-light);
}

/* ── Pagination / filters ── */
.component_options_filters,
.component_options_orderby{
	display:flex;
	flex-wrap:wrap;
	gap:8px;
	margin-bottom:14px;
}
.component_options_pagination{
	display:flex;
	justify-content:center;
	gap:6px;
	margin-top:14px;
}

/* ════════════════════════════════════════════════════════════════
   5. COMPOSITE NAVIGATION (multi-step)
   ════════════════════════════════════════════════════════════════ */
.composite_navigation{
	display:flex;
	align-items:center;
	justify-content:space-between;
	gap:10px;
	padding:18px 22px;
	background:var(--cp-surface);
	border:1.5px solid var(--cp-border);
	border-radius:var(--cp-radius);
	box-shadow:var(--cp-shadow-sm);
	margin-top:8px;
}
/* Plugin renders <a> tags; style them as buttons */
.composite_navigation a.composite_navigation_button{
	display:inline-flex;
	align-items:center;
	gap:8px;
	padding:11px 28px;
	font-size:13.5px;
	font-weight:700;
	border-radius:var(--cp-radius-sm);
	text-decoration:none;
	transition:var(--cp-transition);
	border:none;
	cursor:pointer;
}
.composite_navigation a.composite_navigation_button.btn-next,
.composite_navigation a.composite_navigation_button.next{
	background:linear-gradient(135deg,var(--cp-accent),var(--cp-accent-dark));
	color:#fff;
	box-shadow:0 4px 16px var(--cp-accent-glow);
}
.composite_navigation a.composite_navigation_button.btn-next:hover,
.composite_navigation a.composite_navigation_button.next:hover{
	background:linear-gradient(135deg,var(--cp-accent-dark),var(--cp-accent-deep));
	box-shadow:0 6px 22px var(--cp-accent-glow);
	transform:translateY(-1px);
}
.composite_navigation a.composite_navigation_button.btn-prev,
.composite_navigation a.composite_navigation_button.prev{
	background:#fff;
	color:#555;
	border:1.5px solid var(--cp-border-md);
}
.composite_navigation a.composite_navigation_button.btn-prev:hover,
.composite_navigation a.composite_navigation_button.prev:hover{
	border-color:var(--cp-accent);
	color:var(--cp-accent);
}
/* Progress bar inside navigation */
.composite_navigation .composite_progress{
	flex:1;
	height:4px;
	background:rgba(0,0,0,.07);
	border-radius:4px;
	overflow:hidden;
	margin:0 16px;
}
.composite_navigation .composite_progress_bar{
	height:100%;
	background:var(--cp-accent);
	border-radius:4px;
	transition:width .35s ease;
}

/* ════════════════════════════════════════════════════════════════
   6. SUMMARY CARD (selections review)
   ════════════════════════════════════════════════════════════════ */
.nco-composite-summary{
	background:var(--cp-surface);
	border:1.5px solid var(--cp-border);
	border-radius:var(--cp-radius);
	box-shadow:var(--cp-shadow-sm);
	overflow:hidden;
}

.nco-summary-header{
	display:flex;
	align-items:center;
	gap:10px;
	padding:16px 20px 14px;
	border-bottom:1px solid var(--cp-border);
	background:var(--cp-bg);
}
.nco-summary-header i{
	color:var(--cp-accent);
	font-size:16px;
}
.nco-summary-title{
	font-size:14px !important;
	font-weight:800 !important;
	color:var(--cp-text) !important;
	margin:0 !important;
	display:flex;
	align-items:center;
	gap:10px;
	line-height:1.2;
}
/* hide accessibility span */
.nco-summary-title .aria_title{
	position:absolute;width:1px;height:1px;overflow:hidden;
	clip:rect(0,0,0,0);white-space:nowrap;
}

/* summary element rows */
.nco-summary-elements{
	padding:8px 0 !important;
}
.nco-summary-row{
	padding:0 !important;
	border:none !important;
}
.nco-summary-row-outer{
	padding:8px 20px;
	transition:background .15s ease;
}
.nco-summary-row-outer:hover{
	background:#fafbfc;
}
/* Each row: label on top, value below */
.nco-summary-row-inner{
	display:flex;
	flex-direction:column;
	align-items:flex-start;
	gap:6px;
	min-height:36px;
}
.nco-summary-row-inner.disabled .nco-summary-row-value{
	opacity:.45;
}
.nco-summary-row-label{
	display:flex;
	align-items:center;
	gap:6px;
	font-size:11px;
	font-weight:700;
	text-transform:uppercase;
	letter-spacing:.05em;
	color:var(--cp-text-muted);
}
.nco-summary-dot{
	color:var(--cp-text-light);
	font-size:8px;
}
.nco-summary-row-inner:not(.disabled) .nco-summary-dot{
	color:#22c55e;
}
/* Value cell: image + name stacked, image is rounded */
.nco-summary-row-value{
	display:flex;
	flex-direction:column;
	align-items:flex-start;
	gap:6px;
	width:100%;
	font-size:13px;
	font-weight:700;
	color:var(--cp-text);
}
/* Plugin injects <img> + text nodes inside .summary_element_wrapper_inner */
.nco-summary-row-value img{
	width:52px !important;
	height:52px !important;
	object-fit:cover;
	border-radius:10px;
	border:1px solid var(--cp-border);
	display:block;
}
/* Separator between rows */
.nco-summary-row + .nco-summary-row .nco-summary-row-outer{
	border-top:1px solid var(--cp-border);
}

/* ════════════════════════════════════════════════════════════════
   7. ADD-TO-CART PANEL (sticky right sidebar)
   ════════════════════════════════════════════════════════════════ */
.nco-atc-panel{
	background:var(--cp-surface);
	border:1.5px solid var(--cp-border);
	border-radius:var(--cp-radius);
	box-shadow:var(--cp-shadow);
	padding:24px;
	display:flex;
	flex-direction:column;
	gap:18px;
}

/* ── Selections Summary block (inside ATC panel) ── */
.nco-selections-summary{
	border:1px solid var(--cp-border);
	border-radius:var(--cp-radius-sm);
	overflow:hidden;
	background:var(--cp-bg);
}
.nco-selections-summary-header{
	display:flex;
	align-items:center;
	gap:8px;
	padding:10px 14px;
	background:linear-gradient(135deg,#eef6ff,#e3eeff);
	border-bottom:1px solid var(--cp-border);
	font-size:12px;
	font-weight:800;
	text-transform:uppercase;
	letter-spacing:.06em;
	color:#1a3a5c;
}
.nco-selections-summary-header i{
	color:var(--cp-accent);
	font-size:13px;
}
.nco-selections-list{
	list-style:none;
	margin:0;
	padding:0;
}
.nco-sel-row{
	display:flex;
	flex-direction:column;
	gap:4px;
	padding:10px 14px;
	border-bottom:1px solid var(--cp-border);
}
.nco-sel-row:last-child{
	border-bottom:none;
}
/* Component name */
.nco-sel-header{
	display:flex;
	align-items:center;
	justify-content:space-between;
	gap:6px;
}
.nco-sel-label{
	font-size:10.5px;
	font-weight:800;
	text-transform:uppercase;
	letter-spacing:.05em;
	color:var(--cp-text-muted);
}
/* Clear button — shown only when a product is selected */
.nco-sel-clear{
	display:inline-flex;
	align-items:center;
	justify-content:center;
	width:18px;
	height:18px;
	flex-shrink:0;
	border:none;
	border-radius:50%;
	background:rgba(0,0,0,.07);
	color:var(--cp-text-muted);
	font-size:9px;
	cursor:pointer;
	padding:0;
	transition:var(--cp-transition);
	line-height:1;
}
.nco-sel-clear:hover{
	background:#fee2e2;
	color:#e11d48;
}
/* Selected product value — stacks image below name */
.nco-sel-value{
	display:flex;
	flex-direction:column;
	align-items:flex-start;
	gap:6px;
	font-size:13px;
	font-weight:700;
	color:var(--cp-text);
	min-height:22px;
}
.nco-sel-empty{
	font-size:12px;
	font-weight:500;
	color:var(--cp-text-light);
	font-style:italic;
}
/* Plugin JS injects an <img> + text — image gets rounded treatment */
.nco-sel-value img{
	width:48px !important;
	height:48px !important;
	object-fit:cover;
	border-radius:10px;
	border:1.5px solid var(--cp-border);
	display:block;
}
/* JS-injected thumbnail */
.nco-sel-img{
	width:48px !important;
	height:48px !important;
	object-fit:cover;
	border-radius:10px;
	border:1.5px solid var(--cp-border);
	display:block;
}
/* JS-injected product name */
.nco-sel-name{
	font-size:13px;
	font-weight:700;
	color:var(--cp-text);
}
/* When a product is selected, the row gets a subtle accent left-border */
.nco-sel-row:has(.nco-sel-value img),
.nco-sel-row--selected{
	border-left:3px solid var(--cp-accent);
	padding-left:11px;
}

/* ── Price row ── */
.nco-atc-price-row{
	display:flex;
	align-items:baseline;
	justify-content:space-between;
	gap:8px;
	padding-bottom:16px;
	border-bottom:1px solid var(--cp-border);
}
.nco-atc-price-label{
	font-size:13px;
	font-weight:700;
	color:var(--cp-text-muted);
	text-transform:uppercase;
	letter-spacing:.05em;
}
/* plugin fills .composite_price with WC price spans */
.nco-composite-atc .composite_price,
.nco-atc-price-value{
	font-size:28px;
	font-weight:900;
	color:var(--cp-accent) !important;
	letter-spacing:-.03em;
	line-height:1;
}
.nco-composite-atc .composite_price .woocommerce-Price-amount,
.nco-composite-atc .composite_price .amount{
	color:var(--cp-accent) !important;
}
.nco-composite-atc .composite_price del{
	font-size:16px;
	font-weight:500;
	color:#b0b0b0 !important;
}
.nco-composite-atc .composite_price ins{
	text-decoration:none;
	color:var(--cp-accent) !important;
}

/* ── Availability ── */
.nco-atc-availability{
	font-size:13px;
	font-weight:600;
	color:#16a34a;
}
.nco-atc-availability .out-of-stock{
	color:#dc2626;
}

/* ── Notices / validation ── */
.nco-atc-message .woocommerce-info{
	background:#fffbe6;
	border-left:4px solid #f59e0b;
	border-radius:8px;
	padding:10px 14px;
	font-size:13px;
}

/* ── Trust badges ── */
.nco-atc-trust{
	display:flex;
	flex-direction:column;
	gap:8px;
}
.nco-atc-trust span{
	display:flex;
	align-items:center;
	gap:9px;
	font-size:12.5px;
	font-weight:600;
	color:#444;
	padding:8px 12px;
	background:var(--cp-bg);
	border-radius:var(--cp-radius-sm);
	border:1px solid var(--cp-border);
}
.nco-atc-trust i{
	color:var(--cp-accent);
	width:14px;
	text-align:center;
	flex-shrink:0;
}

/* ── CTA button + quantity row ── */
.nco-atc-button-wrap{
	display:flex;
	flex-direction:column;
	gap:12px;
}

/* Qty + button sit side-by-side in a flex row */
.nco-atc-button-wrap{
	display:flex;
	flex-direction:row;
	flex-wrap:wrap;
	align-items:stretch;
	gap:10px;
}

/* ── Quantity stepper ── */
.nco-qty-wrapper{
	width:100%;
	justify-content:center;
	display:flex;
	align-items:stretch;
	border:1.5px solid var(--cp-border-md);
	border-radius:var(--cp-radius-sm);
	overflow:hidden;
	background:#fff;
	box-shadow:var(--cp-shadow-xs);
	flex-shrink:0;
	height:50px;
}
.nco-qty-btn{
	display:flex;
	align-items:center;
	justify-content:center;
	width:40px;
	border:none;
	background:#f4f6f9;
	color:#555;
	font-size:11px;
	cursor:pointer;
	transition:var(--cp-transition);
	flex-shrink:0;
	line-height:1;
}
.nco-qty-btn:hover{
	background:var(--cp-accent-light);
	color:var(--cp-accent)	;
}
.nco-qty-btn:active{
	background:var(--cp-accent-light);
	color:#fff;
}
.nco-qty-wrapper .qty{
	width:52px;
	height:100%;
	text-align:center;
	font-size:15px;
	font-weight:700;
	color:var(--cp-text);
	border:none;
	border-left:1px solid var(--cp-border);
	border-right:1px solid var(--cp-border);
	border-radius:0;
	padding:0;
	background:#fff;
	-moz-appearance:textfield;
	appearance:textfield;
	outline:none;
}
.nco-qty-wrapper .qty::-webkit-inner-spin-button,
.nco-qty-wrapper .qty::-webkit-outer-spin-button{
	-webkit-appearance:none;
	margin:0;
}
.nco-qty-wrapper .qty:focus{
	box-shadow:inset 0 0 0 2px rgba(0,112,186,.15);
}

/* ── Add-to-cart button ── */
.nco-atc-btn,
.nco-atc-button-wrap .single_add_to_cart_button,
.nco-composite-atc .single_add_to_cart_button{
	flex:1;
	min-width:0;
	height:50px;
	padding:0 24px;
	font-size:15px;
	font-weight:800;
	border-radius:var(--cp-radius-sm);
	background:linear-gradient(135deg,var(--cp-accent),var(--cp-accent-dark));
	color:#fff;
	border:none;
	cursor:pointer;
	transition:var(--cp-transition);
	display:inline-flex;
	align-items:center;
	justify-content:center;
	gap:9px;
	letter-spacing:.01em;
	box-shadow:0 4px 18px var(--cp-accent-glow);
	white-space:nowrap;
}
.nco-atc-btn:hover,
.nco-atc-button-wrap .single_add_to_cart_button:hover,
.nco-composite-atc .single_add_to_cart_button:hover{
	background:linear-gradient(135deg,var(--cp-accent-dark),var(--cp-accent-deep));
	box-shadow:0 8px 30px rgba(0,112,186,.38);
	transform:translateY(-1px);
}
.nco-atc-btn:active,
.nco-atc-button-wrap .single_add_to_cart_button:active,
.nco-composite-atc .single_add_to_cart_button:active{
	transform:translateY(0) scale(.98);
	box-shadow:0 2px 8px var(--cp-accent-glow);
}
.nco-composite-atc .single_add_to_cart_button.loading{
	opacity:.75;
	cursor:not-allowed;
	pointer-events:none;
}

/* ── Secure checkout note ── */
.nco-atc-secure{
	display:flex;
	align-items:center;
	justify-content:center;
	gap:6px;
	font-size:11.5px;
	font-weight:600;
	color:var(--cp-text-light);
	margin:0;
}
.nco-atc-secure i{
	color:#22c55e;
	font-size:11px;
}

/* ════════════════════════════════════════════════════════════════
   8. COMPOSITED PRODUCT SELECTION PANEL
      (the detail pane shown after picking an option inside a step card)
   ════════════════════════════════════════════════════════════════ */

/* ── Composited product image: small, rounded, contained ── */
.nco-composited-image-wrap{
	float:none !important;
	width:auto !important;
	margin:0 0 12px !important;
}
.nco-composited-figure{
	display:block;
	margin:0;
	line-height:0;
}
.nco-composited-img,
.nco-composited-figure img,
.composited_product_image img,
.component_data .woocommerce-product-gallery img,
.component_data img.wp-post-image{
	width:120px !important;
	height:120px !important;
	max-width:120px !important;
	object-fit:contain !important;
	border-radius:12px !important;
	border:1px solid var(--cp-border) !important;
	background:#f8f9fb;
	display:block;
}

/* ── Selected product detail card inside a step ── */
.component_summary,
.component_data .details{
	margin-top:16px;
	padding:14px 16px;
	background:var(--cp-bg);
	border:1px solid var(--cp-border);
	border-radius:var(--cp-radius-sm);
	display:flex;
	flex-direction:column;   /* image ABOVE title */
	align-items:flex-start;
	gap:10px;
}
.component_summary .component_summary_image,
.component_data .woocommerce-product-gallery{
	flex-shrink:0;
	width:120px;
	height:120px;
	border-radius:12px;
	overflow:hidden;
	background:#fff;
	border:1px solid var(--cp-border);
}
.component_summary .component_summary_image img{
	width:100%;
	height:100%;
	object-fit:cover;
	display:block;
	border-radius:12px;
}
.component_summary .component_summary_details{
	flex:1;
	min-width:0;
	width:100%;
}
.component_summary .component_summary_details .product_title,
.component_data .details h3,
.component_data .details .product_title{
	font-size:13.5px;
	font-weight:800;
	color:var(--cp-text);
	margin:0 0 4px;
	line-height:1.3;
}
.component_summary .component_summary_details .price,
.component_data .details .price{
	font-size:14px;
	font-weight:800;
	color:var(--cp-accent) !important;
}
.component_summary .component_summary_details .component_qty{
	font-size:12px;
	color:var(--cp-text-muted);
	margin-top:4px;
}

/* ════════════════════════════════════════════════════════════════
   9. PAGINATION
   ════════════════════════════════════════════════════════════════ */
.component_options_pagination_wrapper{
	display:flex;
	align-items:center;
	justify-content:space-between;
	gap:8px;
	margin-top:12px;
}
.component_options_pagination_wrapper .page-numbers,
.component_options_pagination_wrapper a{
	display:inline-flex;
	align-items:center;
	justify-content:center;
	width:32px;
	height:32px;
	border-radius:8px;
	font-size:12.5px;
	font-weight:700;
	color:var(--cp-text-muted);
	border:1.5px solid var(--cp-border);
	text-decoration:none;
	transition:var(--cp-transition);
}
.component_options_pagination_wrapper .page-numbers:hover,
.component_options_pagination_wrapper a:hover{
	border-color:var(--cp-accent);
	color:var(--cp-accent);
}
.component_options_pagination_wrapper .page-numbers.current{
	background:var(--cp-accent);
	border-color:var(--cp-accent);
	color:#fff;
}

/* ════════════════════════════════════════════════════════════════
   10. UTILITY — clearfix kill, WC overrides
   ════════════════════════════════════════════════════════════════ */

/* ── Clear selection button ── */
.clear_component_options{
	display:inline-flex;
	align-items:center;
	gap:6px;
	padding:6px 14px;
	margin-top:10px;
	font-size:12px;
	font-weight:700;
	color:var(--cp-text-muted);
	background:#fff;
	border:1.5px solid var(--cp-border-md);
	border-radius:var(--cp-radius-sm);
	cursor:pointer;
	text-decoration:none;
	transition:var(--cp-transition);
	box-shadow:var(--cp-shadow-xs);
	letter-spacing:.01em;
	line-height:1;
}
.clear_component_options::before{
	content:'\f00d';
	font-family:'Font Awesome 6 Free';
	font-weight:900;
	font-size:10px;
	color:#e11d48;
	transition:var(--cp-transition);
}
.clear_component_options:hover{
	color:#e11d48;
	border-color:#fca5a5;
	background:#fff5f5;
	box-shadow:0 0 0 3px rgba(225,29,72,.07), var(--cp-shadow-xs);
	text-decoration:none;
}
.clear_component_options:active{
	transform:scale(.97);
}
.nco-cp-steps .cp_clearfix::before,
.nco-cp-steps .cp_clearfix::after,
.nco-composite-summary .cp_clearfix::before,
.nco-composite-summary .cp_clearfix::after{
	content:none !important;
	display:none !important;
}

/* ════════════════════════════════════════════════════════════════
   11. RESPONSIVE
   ════════════════════════════════════════════════════════════════ */

/* Tablet: collapse to single column */
@media (max-width: 900px){
	.nco-cp-layout{
		grid-template-columns:1fr;
		gap:20px;
	}
	.nco-cp-sidebar{
		position:static;
		/* show sidebar ABOVE steps on mobile so user sees price first */
		order:-1;
	}
	.nco-atc-panel{
		padding:18px;
		gap:14px;
	}
	.nco-composite-atc .composite_price,
	.nco-atc-price-value{
		font-size:24px;
	}
	.nco-atc-trust{
		flex-direction:row;
		flex-wrap:wrap;
	}
	.nco-atc-trust span{
		flex:1 1 calc(50% - 4px);
		font-size:11.5px;
		padding:7px 10px;
	}
}

/* Phone */
@media (max-width: 600px){
	.nco-component-card{
		border-radius:12px;
	}
	.nco-component-title-wrapper{
		padding:14px 16px 0;
	}
	.nco-component-inner{
		padding:12px 16px 18px;
	}
	.nco-step-label{
		font-size:14px;
	}
	.component_options_thumbnails .product-thumbnails{
		grid-template-columns:repeat(auto-fill,minmax(90px,1fr));
		gap:8px;
	}
	.component_options_thumbnails .product-thumbnails .product-thumbnail img{
		height:70px;
	}
	.nco-atc-panel{
		border-radius:12px;
		padding:16px;
	}
	/* Stack qty above button on small phones */
	.nco-atc-button-wrap{
		flex-direction:column;
	}
	.nco-qty-wrapper{
		width:100%;
		justify-content:center;
	}
	.nco-qty-wrapper .qty{
		width:80px;
	}
	.nco-atc-btn,
	.nco-atc-button-wrap .single_add_to_cart_button,
	.nco-composite-atc .single_add_to_cart_button{
		width:100%;
		font-size:14px;
		padding:0 20px;
	}
	.nco-atc-trust{
		display:grid;
		grid-template-columns:1fr 1fr;
	}
	.nco-atc-trust span:last-child{
		grid-column:1/-1;
	}
	.nco-summary-header{
		padding:14px 16px 12px;
	}
	.nco-summary-row-outer{
		padding:7px 16px;
	}
}
.composite_add_to_cart_button{
	min-width: unset !important	;
}