/*
Theme Name:   Coffeebrands Store
Template:     storefront
Description:  Child theme for the Coffeebrands franchise ordering stores (B2B). Coffeebrands look (navy, light blue, Proxima Nova, Portrait Script) on top of Storefront. No WooCommerce template copies: everything is done with hooks, settings and the CSS below.
Version:      1.2.4
Author:       Scoot
Text Domain:  cbs
*/

/* ==================================================================
   0. Brand fonts (same files as coffeebrands.gr)
   Proxima Nova covers Greek; Portrait Script is Latin only, so it is
   used only for Latin accent words ("Supplies", "Thank you").
   ================================================================== */
@font-face { font-family: "Proxima Nova"; src: url("assets/fonts/proxima-nova-400.woff2") format("woff2"); font-weight: 400; font-style: normal; font-display: swap; }
@font-face { font-family: "Proxima Nova"; src: url("assets/fonts/proxima-nova-600.woff2") format("woff2"); font-weight: 600; font-style: normal; font-display: swap; }
@font-face { font-family: "Proxima Nova"; src: url("assets/fonts/proxima-nova-800.woff2") format("woff2"); font-weight: 800; font-style: normal; font-display: swap; }
@font-face { font-family: "Portrait Script"; src: url("assets/fonts/portrait-script-400.woff2") format("woff2"); font-weight: 400; font-style: normal; font-display: swap; }

/* ==================================================================
   1. Tokens
   ================================================================== */
:root {
	--cbs-navy: #212949;
	--cbs-navy-2: #2b355e;
	--cbs-sky: #73a6e4;
	--cbs-sky-deep: #2f6fbf;   /* light blue dark enough for text on white */
	--cbs-warm: #72706d;
	--cbs-muted: #5d6478;
	--cbs-line: #e3e6ee;
	--cbs-paper: #f6f7fa;
	--cbs-white: #ffffff;
	--cbs-radius: 8px;
	--cbs-radius-sm: 4px;
	--cbs-shadow: 0 1px 2px rgba(33, 41, 73, .04);
	--cbs-shadow-lg: 0 20px 50px rgba(33, 41, 73, .10);
	--cbs-font: "Proxima Nova", "Helvetica Neue", Helvetica, Arial, sans-serif;
	--cbs-script: "Portrait Script", "Brush Script MT", cursive;
	--cbs-nav-h: 60px;
	--cbs-gutter: 56px;
}

/* ==================================================================
   2. Base
   ================================================================== */
body,
button, input, select, textarea, .button {
	font-family: var(--cbs-font);
}
body {
	background: var(--cbs-paper);
	color: var(--cbs-navy);
	-webkit-font-smoothing: antialiased;
}
h1, h2, h3, h4, .entry-title, .page-title {
	color: var(--cbs-navy);
	font-weight: 800;
	letter-spacing: -.005em;
}
a { color: var(--cbs-sky-deep); }
a:hover, a:focus { color: var(--cbs-navy); }
:focus-visible { outline: 2px solid var(--cbs-sky); outline-offset: 2px; }

.cbs-script {
	font-family: var(--cbs-script);
	font-weight: 400;
	color: var(--cbs-sky-deep);
	line-height: 1;
}

.site-content { padding-top: 32px; }
.hentry, .site-main { margin-bottom: 0; }
.entry-header .entry-title { font-size: 2em; }

/* Carried over from the 2019 setup */
.site-header .widget-product-search,
.site-search { display: none; }

/* ==================================================================
   3. Header: navy bar, white logo, menu, cart pill
   ================================================================== */
.site-header {
	background-color: var(--cbs-navy) !important;
	border-bottom: 0;
	padding: 0;
	margin-bottom: 0;
	color: var(--cbs-white);
}
.cbs-branding img { display: block; height: 40px; width: auto; }

@media (min-width: 768px) {
	.site-header {
		display: flex;
		align-items: center;
		gap: 24px;
		padding: 18px var(--cbs-gutter);
	}
	.site-header > .col-full {
		flex: 0 0 auto;
		max-width: none;
		margin: 0;
		padding: 0;
	}
	.site-header .site-branding {
		float: none;
		width: auto;
		margin: 0;
	}
	.storefront-primary-navigation {
		flex: 1 1 auto;
		background: transparent;
	}
	.storefront-primary-navigation .col-full {
		display: flex;
		align-items: center;
		justify-content: flex-end;
		gap: 22px;
		max-width: none;
		margin: 0;
		padding: 0;
	}
	.storefront-primary-navigation .col-full::before,
	.storefront-primary-navigation .col-full::after { display: none; }
	.site-header .main-navigation {
		float: none;
		width: auto;
		margin: 0;
		clear: none;
	}
	.site-header .main-navigation ul.menu > li > a,
	.site-header .main-navigation ul.nav-menu > li > a {
		color: var(--cbs-white);
		opacity: .82;
		padding: 6px 0;
		margin: 0 11px;
		border-bottom: 2px solid transparent;
		font-size: 15px;
		letter-spacing: .01em;
	}
	.site-header .main-navigation ul.menu > li.current-menu-item > a,
	.site-header .main-navigation ul.menu > li > a:hover,
	.site-header .main-navigation ul.nav-menu > li.current-menu-item > a {
		opacity: 1;
		border-bottom-color: var(--cbs-sky);
	}
	.site-header .site-header-cart {
		float: none;
		width: auto;
		margin: 0;
	}
	.site-header .site-header-cart .cart-contents {
		display: flex;
		align-items: center;
		gap: 10px;
		padding: 9px 16px;
		border: 1px solid rgba(255, 255, 255, .85);
		border-radius: 999px;
		color: var(--cbs-white);
		font-weight: 600;
	}
	.site-header .site-header-cart .cart-contents::after { color: var(--cbs-white); position: static; float: none; }
	.site-header .site-header-cart .cart-contents .count {
		display: inline-flex;
		align-items: center;
		justify-content: center;
		min-width: 22px;
		height: 22px;
		padding: 0 7px;
		border-radius: 999px;
		background: var(--cbs-sky);
		color: var(--cbs-navy);
		font-size: 12px;
		font-weight: 800;
		opacity: 1;
	}
	/* hover mini-cart dropdown: the cart page is one click away */
	.site-header .site-header-cart .widget_shopping_cart { display: none !important; }
}

/* Phones: logo + menu toggle on navy */
@media (max-width: 767px) {
	.site-header { padding: 14px 0; }
	.cbs-branding img { height: 30px; }
	.site-header .menu-toggle {
		color: var(--cbs-white);
		border-color: rgba(255, 255, 255, .6);
		background: transparent;
	}
	.site-header .menu-toggle::before,
	.site-header .menu-toggle::after,
	.site-header .menu-toggle span::before { background-color: var(--cbs-white); }
	.site-header .handheld-navigation {
		background: var(--cbs-white);
		border-radius: var(--cbs-radius);
		margin-top: 10px;
	}
	.site-header .handheld-navigation a { color: var(--cbs-navy); }
	.storefront-primary-navigation { background: transparent; }
}

/* ==================================================================
   4. Footer
   ================================================================== */
.site-footer {
	background-color: var(--cbs-navy) !important;
	color: var(--cbs-white) !important;
	padding: 22px 0 !important;
	margin-top: 48px;
}
.cbs-footer {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 16px;
	flex-wrap: wrap;
	font-size: 14px;
}
.cbs-footer__left { display: flex; align-items: center; gap: 18px; }
.cbs-footer__left img { height: 26px; width: auto; display: block; }
.cbs-footer__left span { opacity: .7; }
.cbs-footer__script { font-size: 26px; color: var(--cbs-sky); }

/* ==================================================================
   5. Buttons and forms
   ================================================================== */
button, input[type="button"], input[type="reset"], input[type="submit"],
.button, .added_to_cart {
	background-color: var(--cbs-navy);
	border: 1px solid var(--cbs-navy);
	color: var(--cbs-white);
	border-radius: var(--cbs-radius-sm);
	font-weight: 600;
	letter-spacing: .02em;
	min-height: 46px;
	padding: .8em 1.6em;
	box-shadow: none;
	text-shadow: none;
}
button:hover, input[type="submit"]:hover, .button:hover {
	background-color: var(--cbs-navy-2);
	border-color: var(--cbs-navy-2);
	color: var(--cbs-white);
}

/* Main call to action: light blue */
.button.alt, button.alt, .checkout-button, #place_order,
.wc-proceed-to-checkout .button {
	background-color: var(--cbs-sky) !important;
	border-color: var(--cbs-sky) !important;
	color: var(--cbs-navy) !important;
	font-weight: 800;
}
.button.alt:hover, button.alt:hover, .checkout-button:hover, #place_order:hover {
	background-color: #8fb8ea !important;
	border-color: #8fb8ea !important;
}

/* Secondary: outlined */
.cbs-cart-buttons .button,
.woocommerce-cart table.cart button[name="update_cart"],
.woocommerce-MyAccount-content .button,
.woocommerce-orders-table .button {
	background: transparent;
	color: var(--cbs-navy);
	border: 1px solid var(--cbs-navy);
}
.cbs-cart-buttons .button:hover,
.woocommerce-cart table.cart button[name="update_cart"]:hover {
	background: var(--cbs-navy);
	color: var(--cbs-white);
}

input[type="text"], input[type="email"], input[type="tel"], input[type="password"],
input[type="number"], input[type="search"], select, textarea, .input-text {
	background: var(--cbs-white);
	border: 1px solid var(--cbs-line);
	border-radius: var(--cbs-radius-sm);
	box-shadow: none;
	color: var(--cbs-navy);
	min-height: 48px;
	padding: .6em .9em;
}
input:focus, select:focus, textarea:focus, .input-text:focus {
	border-color: var(--cbs-sky);
	background: var(--cbs-white);
}
.woocommerce form .form-row label,
.woocommerce-form label:not(.woocommerce-form__label-for-checkbox) {
	font-size: 13px;
	font-weight: 600;
	letter-spacing: .04em;
	text-transform: uppercase;
	color: var(--cbs-muted);
}

/* Read-only billing fields (filled from the store account) */
.woocommerce-checkout input[readonly] {
	background: var(--cbs-paper);
	color: var(--cbs-muted);
	cursor: not-allowed;
}

table.shop_table {
	background: var(--cbs-white);
	border: 1px solid var(--cbs-line);
	border-radius: var(--cbs-radius);
	overflow: hidden;
	box-shadow: var(--cbs-shadow);
}
table.shop_table th {
	background: var(--cbs-white);
	color: var(--cbs-muted);
	font-size: 12px;
	font-weight: 600;
	letter-spacing: .06em;
	text-transform: uppercase;
}
table.shop_table td, table.shop_table th { border-color: var(--cbs-line); }

.woocommerce-message, .woocommerce-info, .woocommerce-error, .woocommerce-noreviews {
	border-radius: var(--cbs-radius);
	background-color: var(--cbs-navy);
	color: var(--cbs-white);
}
.woocommerce-error { background-color: #9b1c1c; }

/* ==================================================================
   6. Order page (template: archive-product-grafeio.php)
   ================================================================== */
.cbs-page-band {
	display: flex;
	align-items: flex-end;
	justify-content: space-between;
	gap: 16px;
	margin: 0 0 18px;
}
.cbs-page-band .cbs-script { display: block; font-size: 34px; }
.cbs-page-title { margin: 0; font-size: 34px; line-height: 1.1; }
.cbs-page-band__meta { font-size: 15px; color: var(--cbs-muted); white-space: nowrap; }

.cbs-order-page .cbs-catnav {
	position: sticky;
	top: 0;
	z-index: 50;
	background: var(--cbs-white);
	border: 1px solid var(--cbs-line);
	border-radius: var(--cbs-radius);
	margin: 0 0 32px;
	box-shadow: 0 6px 16px rgba(33, 41, 73, .06);
}
.admin-bar .cbs-order-page .cbs-catnav { top: 32px; }
@media (max-width: 782px) { .admin-bar .cbs-order-page .cbs-catnav { top: 0; } }

.cbs-catnav__list {
	display: flex;
	gap: 8px;
	overflow-x: auto;
	white-space: nowrap;
	padding: 10px 12px;
	margin: 0;
	list-style: none;
	scrollbar-width: thin;
	-webkit-overflow-scrolling: touch;
}
.cbs-catnav__list li { margin: 0; }
.cbs-catnav__list a {
	display: inline-block;
	padding: 9px 16px;
	border-radius: 999px;
	border: 1px solid var(--cbs-line);
	background: var(--cbs-white);
	color: var(--cbs-navy);
	text-decoration: none;
	font-size: 14px;
	font-weight: 600;
	line-height: 1.2;
}
.cbs-catnav__list a:hover,
.cbs-catnav__list a:focus,
.cbs-catnav__list a.is-active {
	background: var(--cbs-navy);
	border-color: var(--cbs-navy);
	color: var(--cbs-white);
}

.cbs-cat {
	scroll-margin-top: calc(var(--cbs-nav-h) + 24px);
	margin-bottom: 36px;
}
.admin-bar .cbs-cat { scroll-margin-top: calc(var(--cbs-nav-h) + 56px); }
.cbs-cat__head {
	display: flex;
	align-items: baseline;
	justify-content: space-between;
	gap: 12px;
	margin-bottom: 14px;
}
.cbs-cat__title {
	margin: 0;
	font-size: 22px;
	font-weight: 800;
	letter-spacing: .06em;
	text-transform: uppercase;
	color: var(--cbs-navy);
}
.cbs-cat__count { font-size: 14px; color: var(--cbs-muted); white-space: nowrap; }

.cbs-card {
	background: var(--cbs-white);
	border: 1px solid var(--cbs-line);
	border-radius: var(--cbs-radius);
	box-shadow: var(--cbs-shadow);
	overflow: hidden;
}

/* Product Table plugin inside the card (columns come from its own settings) */
.cbs-card table { margin: 0; border: 0; background: transparent; }
.cbs-card table th { background: var(--cbs-white); }
.cbs-card table td, .cbs-card table th {
	border-top: 1px solid var(--cbs-line);
	border-left: 0;
	border-right: 0;
	padding: 14px 20px;
	vertical-align: middle;
}
.cbs-card table tr:first-child td { border-top: 0; }
.cbs-card table img { border-radius: 6px; }
.cbs-card [class*="wcpt-quantity"] input,
.cbs-card input.qty {
	border-radius: 999px;
	text-align: center;
	min-height: 42px;
}
.cbs-card .wcpt-button,
.cbs-card [class*="wcpt-button"] {
	border-radius: 999px;
	background: var(--cbs-navy);
	border-color: var(--cbs-navy);
	color: var(--cbs-white);
	min-width: 46px;
	min-height: 46px;
	font-size: 22px;
}

/* ==================================================================
   7. Cart: simplified as in 2019, total in a navy card
   ================================================================== */
.woocommerce-cart table.cart .product-price { display: none; }
.woocommerce-cart table.cart .product-name { font-size: 17px; font-weight: 600; }

.cbs-unit-price {
	display: block;
	color: var(--cbs-muted);
	font-size: 14px;
	font-weight: 400;
	margin-top: 3px;
}
.woocommerce-cart table.cart td.actions .cbs-cart-buttons {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	margin-top: 10px;
}
.woocommerce-cart table.cart .qty { border-radius: 999px; }

.cart_totals,
#order_review {
	background: var(--cbs-navy);
	color: var(--cbs-white);
	border-radius: var(--cbs-radius);
	padding: 30px;
}
.cart_totals h2 { color: var(--cbs-white); font-size: 22px; }
.cart_totals table.shop_table,
#order_review table.shop_table {
	background: transparent;
	border: 0;
	box-shadow: none;
	color: var(--cbs-white);
}
.cart_totals table th, .cart_totals table td,
#order_review table th, #order_review table td {
	background: transparent !important;
	color: var(--cbs-white);
	border-color: rgba(255, 255, 255, .2);
}
.cart_totals .order-total td, #order_review .order-total td {
	font-size: 26px;
	font-weight: 800;
}
.cart_totals .cart-subtotal,
.cart_totals .woocommerce-shipping-totals,
.cart_totals .shipping,
.woocommerce-checkout-review-order-table .cart-subtotal,
.woocommerce-checkout-review-order-table .woocommerce-shipping-totals { display: none; }

/* ==================================================================
   8. Checkout
   ================================================================== */
.woocommerce-checkout .col2-set {
	background: var(--cbs-white);
	border: 1px solid var(--cbs-line);
	border-radius: var(--cbs-radius);
	padding: 30px;
}
#order_review_heading {
	background: var(--cbs-navy);
	color: var(--cbs-white);
	margin: 0;
	padding: 30px 30px 0;
	border-radius: var(--cbs-radius) var(--cbs-radius) 0 0;
}
#order_review { border-radius: 0 0 var(--cbs-radius) var(--cbs-radius); padding-top: 16px; }
#payment, #payment .payment_methods > li, #payment .payment_methods li {
	background: transparent !important;
	color: var(--cbs-white);
}
#payment .payment_methods > li {
	border: 1px solid rgba(255, 255, 255, .25);
	border-radius: var(--cbs-radius-sm);
	padding: 12px 14px;
}
#payment .payment_box {
	background: rgba(255, 255, 255, .08) !important;
	color: var(--cbs-white);
}
#payment .payment_box::before { display: none; }
#payment .place-order { padding: 16px 0 0; }

/* ==================================================================
   9. Thank-you page: one centred confirmation card
   ================================================================== */
.woocommerce-order-received .woocommerce-order-overview { display: none; }
.woocommerce-order-received .woocommerce-order {
	max-width: 640px;
	margin: 24px auto;
	padding: 52px;
	background: var(--cbs-white);
	border-radius: var(--cbs-radius);
	box-shadow: var(--cbs-shadow-lg);
	text-align: center;
}
.woocommerce-order-received .woocommerce-order::before {
	content: "";
	display: block;
	width: 72px;
	height: 72px;
	margin: 0 auto 18px;
	border-radius: 999px;
	background: var(--cbs-navy) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12.5l4.5 4.5L19 7.5'/%3E%3C/svg%3E") center / 32px no-repeat;
}
.woocommerce-order-received .woocommerce-thankyou-order-received {
	background: transparent;
	border: 0;
	padding: 0;
	font-size: 18px;
	line-height: 1.55;
	color: var(--cbs-muted);
}
.woocommerce-order-received .woocommerce-thankyou-order-received::before {
	content: "Thank you";
	display: block;
	margin-bottom: 10px;
	font-family: var(--cbs-script);
	font-size: 40px;
	line-height: 1;
	color: var(--cbs-sky-deep);
}

/* ==================================================================
   10. My account
   ================================================================== */
.woocommerce-MyAccount-navigation ul {
	background: var(--cbs-white);
	border: 1px solid var(--cbs-line);
	border-radius: var(--cbs-radius);
	overflow: hidden;
	margin: 0;
}
.woocommerce-MyAccount-navigation ul li { border-color: var(--cbs-line); }
.woocommerce-MyAccount-navigation ul li a { padding: 14px 18px; color: var(--cbs-navy); }
.woocommerce-MyAccount-navigation ul li.is-active a {
	background: var(--cbs-navy);
	color: var(--cbs-white);
	font-weight: 600;
}
.woocommerce-MyAccount-navigation ul li.is-active a::before { color: var(--cbs-white); }
.woocommerce-orders-table__row--status-processing .woocommerce-orders-table__cell-order-status { color: var(--cbs-sky-deep); font-weight: 600; }
.woocommerce-orders-table__row--status-completed .woocommerce-orders-table__cell-order-status { color: #1d5b35; font-weight: 600; }

/* ==================================================================
   11. Login screen (front page when logged out)
   ================================================================== */
.cbs-login-screen .site-header,
.cbs-login-screen .site-footer,
.cbs-login-screen .entry-header { display: none; }

.cbs-login {
	position: fixed;
	inset: 0;
	z-index: 9999;
	display: grid;
	grid-template-columns: 1fr 1fr;
	background: var(--cbs-paper);
	overflow: auto;
}
.cbs-login__brand {
	position: relative;
	overflow: hidden;
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	padding: var(--cbs-gutter);
	background: var(--cbs-navy);
	color: var(--cbs-white);
}
.cbs-login__contour { position: absolute; inset: 0; width: 100%; height: 100%; }
.cbs-login__brand > *:not(.cbs-login__contour) { position: relative; }
.cbs-login__logo { height: 54px; width: auto; align-self: flex-start; }
.cbs-login__claim { display: flex; flex-direction: column; gap: 10px; }
.cbs-login__claim .cbs-script { font-size: 64px; color: var(--cbs-sky); }
.cbs-login__title { font-size: 26px; font-weight: 600; line-height: 1.3; max-width: 420px; }
.cbs-login__copy { font-size: 14px; opacity: .65; }

.cbs-login__form {
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 32px 16px;
}
.cbs-login__card {
	width: 420px;
	max-width: 100%;
	box-sizing: border-box;
	padding: 44px;
	background: var(--cbs-white);
	border-radius: var(--cbs-radius);
	box-shadow: var(--cbs-shadow-lg);
}
.cbs-login .woocommerce-form-login,
.cbs-login form.login {
	margin: 0;
	padding: 0;
	border: 0;
	background: transparent;
	box-shadow: none;
}
.cbs-login h2 { font-size: 30px; margin: 0 0 22px; }
.cbs-login .woocommerce-error,
.cbs-login .woocommerce-message,
.cbs-login .woocommerce-info {
	margin: 0 0 20px;
	padding: 14px 16px 14px 46px;
	font-size: 15px;
	border-radius: var(--cbs-radius-sm);
}
.cbs-login .woocommerce-form-login__submit {
	float: none;
	width: 100%;
	margin: 14px 0 0;
}
.cbs-login .woocommerce-form-login__rememberme { display: flex; align-items: center; gap: 10px; }
.cbs-login .lost_password { text-align: center; margin: 16px 0 0; }

@media (max-width: 860px) {
	.cbs-login { grid-template-columns: 1fr; }
	.cbs-login__brand { padding: 28px 20px; gap: 18px; min-height: 0; }
	.cbs-login__claim .cbs-script { font-size: 44px; }
	.cbs-login__title { font-size: 20px; }
	.cbs-login__copy { display: none; }
	.cbs-login__card { padding: 28px 22px; }
}

/* ==================================================================
   12. Phones
   ================================================================== */
@media (max-width: 767px) {
	:root { --cbs-gutter: 20px; }
	.cbs-page-band .cbs-script { font-size: 26px; }
	.cbs-page-title { font-size: 24px; }
	.cbs-cat__title { font-size: 18px; }
	.cbs-card table td, .cbs-card table th { padding: 12px 14px; }
	.cart_totals, #order_review, .woocommerce-checkout .col2-set { padding: 20px; }
	.woocommerce-order-received .woocommerce-order { padding: 32px 22px; }
}

@media (prefers-reduced-motion: reduce) {
	html { scroll-behavior: auto; }
}


/* ==================================================================
   13. Fixes after the first staging test (1.2.1)
   ================================================================== */

/* Footer stays at the bottom on short pages */
#page {
	min-height: 100vh;
	display: flex;
	flex-direction: column;
}
.admin-bar #page { min-height: calc(100vh - 32px); }
#page > .site-content { flex: 1 0 auto; width: 100%; }
.site-footer { margin-top: 0; flex-shrink: 0; }

/* Pages without a title (front page / My account): no empty gap */
.entry-title:empty, .entry-header:empty { display: none; }
.woocommerce-account .entry-header { margin-bottom: 0; }

/* Header menu: also covers the fallback page list, and the cart pill hugs its content */
@media (min-width: 768px) {
	.site-header .main-navigation div.menu > ul > li > a {
		color: var(--cbs-white);
		opacity: .82;
		padding: 6px 0;
		margin: 0 11px;
		font-size: 15px;
	}
	.site-header .site-header-cart { display: flex; }
	.site-header .site-header-cart > li { width: auto; }
	.site-header .site-header-cart .cart-contents {
		display: inline-flex;
		width: auto;
		white-space: nowrap;
	}
}
/* Phone menu: white text on navy */
@media (max-width: 767px) {
	.site-header .main-navigation.toggled .handheld-navigation,
	.site-header .main-navigation.toggled div.menu {
		background: transparent;
		margin-top: 12px;
	}
	.site-header .main-navigation.toggled a,
	.site-header .handheld-navigation a {
		color: var(--cbs-white) !important;
		opacity: 1;
		font-size: 17px;
		padding: 12px 0;
	}
	.site-header .main-navigation.toggled ul li { border-color: rgba(255, 255, 255, .15); }
}

/* Product table: the plugin's own light-blue styling is replaced by white rows */
.cbs-card .wcpt-table,
.cbs-card .wcpt-table thead,
.cbs-card .wcpt-table tbody,
.cbs-card .wcpt-table tr,
.cbs-card .wcpt-table th,
.cbs-card .wcpt-table td,
.cbs-card .wcpt-row,
.cbs-card .wcpt-cell {
	background: var(--cbs-white) !important;
	border-color: var(--cbs-line) !important;
	color: var(--cbs-navy);
}
.cbs-card .wcpt-table { border: 0 !important; }
.cbs-card .wcpt-table tr:hover td,
.cbs-card .wcpt-row:hover .wcpt-cell { background: var(--cbs-paper) !important; }
.cbs-card .wcpt-table tr:first-child td,
.cbs-card .wcpt-table thead th { border-top: 0 !important; }
.cbs-card .wcpt-title,
.cbs-card .wcpt-title a,
.cbs-card a.wcpt-title {
	color: var(--cbs-navy) !important;
	font-weight: 600 !important;
	font-size: 16px !important;
	text-decoration: none;
	line-height: 1.3;
}
.cbs-card .wcpt-price,
.cbs-card .wcpt-price * { color: var(--cbs-navy) !important; font-weight: 600; }
.cbs-card .wcpt-quantity input,
.cbs-card input.qty {
	width: 70px !important;
	height: 42px !important;
	min-height: 42px;
	border: 1px solid var(--cbs-line) !important;
	border-radius: 999px !important;
	text-align: center;
	box-shadow: none !important;
}
.cbs-card .wcpt-button,
.cbs-card a[class*="wcpt-button"] {
	display: inline-flex !important;
	align-items: center;
	justify-content: center;
	width: 46px !important;
	height: 46px !important;
	min-width: 46px;
	padding: 0 !important;
	border-radius: 999px !important;
	background: var(--cbs-navy) !important;
	border: 0 !important;
	color: var(--cbs-white) !important;
	font-size: 22px !important;
	line-height: 1 !important;
}
.cbs-card .wcpt-button:hover,
.cbs-card a[class*="wcpt-button"]:hover { background: var(--cbs-sky) !important; color: var(--cbs-navy) !important; }
@media (max-width: 767px) {
	.cbs-card .wcpt-title,
	.cbs-card .wcpt-title a { font-size: 14px !important; }
	.cbs-card .wcpt-table td { padding: 10px 8px !important; }
}

/* Cart: tidy total card */
.woocommerce-cart .entry-header { margin-bottom: 24px; }
.woocommerce-cart table.cart thead th { font-size: 12px; }
.cart_totals table.shop_table tr.order-total {
	display: flex;
	justify-content: space-between;
	align-items: baseline;
}
.cart_totals table.shop_table tr.order-total th,
.cart_totals table.shop_table tr.order-total td {
	padding: 14px 0;
	border: 0;
	text-align: right;
}
.cart_totals table.shop_table tr.order-total th { text-align: left; font-size: 13px; letter-spacing: .06em; text-transform: uppercase; opacity: .8; }

/* Checkout: summary table and payment box */
#order_review table.shop_table th,
#order_review table.shop_table td { padding: 12px 0; }
#order_review table.shop_table thead th { font-size: 12px; opacity: .8; }
#order_review table.shop_table .product-total,
#order_review table.shop_table tfoot td { text-align: right; }
#payment .place-order,
#payment div.form-row { background: transparent !important; padding: 16px 0 0 !important; margin: 0; }
#payment ul.payment_methods { border: 0; padding: 0; margin: 16px 0 0; }
#payment .payment_methods > li label { color: var(--cbs-white); }
.woocommerce-checkout select,
.woocommerce-checkout .select2-container .select2-selection--single {
	min-height: 48px;
	border: 1px solid var(--cbs-line);
	border-radius: var(--cbs-radius-sm);
	background: var(--cbs-white);
	padding: 0 .9em;
}
.woocommerce-checkout .select2-container .select2-selection--single .select2-selection__rendered { line-height: 46px; padding: 0; }
.woocommerce-checkout .select2-container .select2-selection--single .select2-selection__arrow { height: 46px; }

/* My account: menu items padded, page starts higher */
.woocommerce-account .woocommerce-MyAccount-navigation ul li a {
	padding: 14px 18px !important;
	display: flex;
	justify-content: space-between;
	align-items: center;
}
.woocommerce-account .woocommerce-MyAccount-navigation ul li a::before { position: static; order: 2; }


/* ==================================================================
   14. Second staging round (1.2.2)
   ================================================================== */

/* Header: menu sits right, next to the cart; cart text always white */
@media (min-width: 768px) {
	.site-header .main-navigation { flex: 1 1 auto; }
	.site-header .main-navigation .primary-navigation > ul,
	.site-header .main-navigation div.menu > ul {
		display: flex;
		justify-content: flex-end;
		align-items: center;
		flex-wrap: nowrap;
	}
	.site-header .main-navigation ul.menu > li,
	.site-header .main-navigation div.menu > ul > li { float: none; }
}
.site-header .site-header-cart .cart-contents,
.site-header .site-header-cart .cart-contents .amount,
.site-header .site-header-cart .cart-contents .woocommerce-Price-amount,
.site-header .site-header-cart .cart-contents .woocommerce-Price-currencySymbol,
.site-header .site-header-cart:hover .cart-contents,
.site-header .site-header-cart .current-menu-item .cart-contents {
	color: var(--cbs-white) !important;
}
.site-header .site-header-cart .cart-contents .count { color: var(--cbs-navy) !important; }

/* Order page: "+" is one clean round button; the plugin's inner navy boxes are cleared */
.cbs-card .wcpt-button { position: relative; overflow: visible; }
.cbs-card .wcpt-button *:not([class*="badge"]) {
	background: transparent !important;
	border-radius: 0 !important;
	box-shadow: none !important;
}
.cbs-card .wcpt-button .wcpt-button-label,
.cbs-card .wcpt-button .wcpt-item-row {
	display: flex !important;
	align-items: center !important;
	justify-content: center !important;
	width: 100% !important;
	height: 100% !important;
	margin: 0 !important;
	padding: 0 !important;
}
.cbs-card .wcpt-button .wcpt-text {
	width: auto !important;
	height: auto !important;
	color: var(--cbs-white) !important;
	font-size: 24px;
	font-weight: 400;
	line-height: 1;
}
.cbs-card .wcpt-button:hover .wcpt-text { color: var(--cbs-navy) !important; }
/* "already in cart" counter on the button */
.cbs-card .wcpt-button [class*="badge"] {
	position: absolute !important;
	top: -8px !important;
	right: -8px !important;
	min-width: 22px;
	height: 22px;
	padding: 0 6px;
	border-radius: 999px !important;
	border: 2px solid var(--cbs-white) !important;
	background: var(--cbs-sky) !important;
	color: var(--cbs-navy) !important;
	font-size: 12px !important;
	font-weight: 800;
	line-height: 18px !important;
	display: inline-flex !important;
	align-items: center;
	justify-content: center;
	box-shadow: none !important;
}

/* Cart: image, name + unit price, a clear quantity stepper, a clear remove */
.cbs-cart-hint {
	display: flex;
	align-items: center;
	gap: 10px;
	margin: 0 0 16px;
	padding: 12px 16px;
	background: var(--cbs-white);
	border: 1px solid var(--cbs-line);
	border-radius: var(--cbs-radius);
	color: var(--cbs-muted);
	font-size: 15px;
}
.cbs-cart-hint strong { color: var(--cbs-navy); }
.woocommerce-cart table.cart td { vertical-align: middle; }
.woocommerce-cart table.cart .product-thumbnail { width: 88px; }
.woocommerce-cart table.cart .product-thumbnail img {
	width: 64px;
	height: 64px;
	object-fit: contain;
	border-radius: 6px;
	background: var(--cbs-paper);
}
.woocommerce-cart table.cart .product-remove { width: 56px; }
.woocommerce-cart table.cart a.remove {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 36px;
	height: 36px;
	border-radius: 999px;
	border: 1px solid var(--cbs-line);
	color: var(--cbs-muted) !important;
	background: var(--cbs-white);
	font-size: 20px;
	text-decoration: none;
}
.woocommerce-cart table.cart a.remove:hover {
	background: #9b1c1c;
	border-color: #9b1c1c;
	color: var(--cbs-white) !important;
}
.woocommerce-cart table.cart a.remove::before { display: none; }
.woocommerce-cart .quantity {
	display: inline-flex;
	align-items: center;
	gap: 6px;
}
.woocommerce-cart .quantity .qty {
	width: 56px;
	height: 40px;
	min-height: 40px;
	padding: 0;
	text-align: center;
	border-radius: 6px;
	font-weight: 600;
	-moz-appearance: textfield;
}
.woocommerce-cart .quantity .qty::-webkit-outer-spin-button,
.woocommerce-cart .quantity .qty::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }
.cbs-qty-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 40px;
	height: 40px;
	min-height: 40px;
	padding: 0;
	border-radius: 999px;
	border: 1px solid var(--cbs-line);
	background: var(--cbs-white);
	color: var(--cbs-navy);
	font-size: 20px;
	font-weight: 600;
	line-height: 1;
}
.cbs-qty-btn:hover { background: var(--cbs-navy); border-color: var(--cbs-navy); color: var(--cbs-white); }
/* With the stepper active the cart updates by itself, so the manual button is hidden */
.cbs-auto-cart .woocommerce-cart-form button[name="update_cart"] { display: none !important; }
.woocommerce-cart table.cart td.actions { padding: 16px 20px; background: var(--cbs-white) !important; }
.woocommerce-cart table.cart td.actions .cbs-cart-buttons { margin: 0; }
.woocommerce-cart .woocommerce-cart-form.processing { opacity: .6; }
@media (max-width: 767px) {
	.woocommerce-cart table.cart .product-thumbnail { display: none; }
}


/* 1.2.3: the remove button draws its own × (Storefront hides the text and uses an icon font) */
.woocommerce-cart table.cart a.remove {
	font-size: 0 !important;
	text-indent: -9999px;
	overflow: hidden;
	background: var(--cbs-white) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%235d6478' stroke-width='2.4' stroke-linecap='round'%3E%3Cpath d='M6 6l12 12M18 6L6 18'/%3E%3C/svg%3E") center / 14px no-repeat !important;
}
.woocommerce-cart table.cart a.remove:hover,
.woocommerce-cart table.cart a.remove:focus {
	background: #9b1c1c url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='2.4' stroke-linecap='round'%3E%3Cpath d='M6 6l12 12M18 6L6 18'/%3E%3C/svg%3E") center / 14px no-repeat !important;
	border-color: #9b1c1c;
}
.woocommerce-cart table.cart a.remove::before,
.woocommerce-cart table.cart a.remove::after { display: none !important; content: none !important; }
