/* ==========================================================================
   Ogani WooCommerce - skin for WooCommerce's own cart/checkout/account/
   notice markup, plus a few small additions the static HTML demo never
   needed (sale ribbon on the shop grid, quantity input, star ratings).
   Palette matches sass/_variable.scss from the original template.
   ========================================================================== */

:root {
	--ogani-primary: #7fad39;
	--ogani-heading: #111111;
	--ogani-text: #6f6f6f;
	--ogani-border: #ebebeb;
	--ogani-bg: #f5f5f5;
}

/* ---- WooCommerce notices (added to cart, errors, success) ---- */
.woocommerce-message,
.woocommerce-error,
.woocommerce-info,
.woocommerce-noreviews,
p.no-comments {
	list-style: none;
	background: var(--ogani-bg);
	border-left: 3px solid var(--ogani-primary);
	padding: 15px 20px;
	margin: 0 0 20px;
	font-family: "Cairo", sans-serif;
	color: var(--ogani-heading);
}
.woocommerce-error { border-left-color: #dc3545; }
.woocommerce-message .button,
.woocommerce-error .button {
	background: var(--ogani-primary);
	color: #fff;
	padding: 6px 18px;
	border-radius: 0;
	margin-left: 10px;
	display: inline-block;
	text-transform: uppercase;
	font-size: 12px;
}

/* ---- Sale ribbon added on the shop grid / archive ---- */
.product__item__pic .product__label,
.onsale {
	position: absolute;
	top: 20px;
	left: 20px;
	background: var(--ogani-primary);
	color: #fff;
	font-size: 12px;
	text-transform: uppercase;
	padding: 3px 10px;
	z-index: 2;
}

/* ---- Star ratings on single product / archive ---- */
.product__details__rating i,
.star-rating { color: #f5b223; }
.star-rating { overflow: hidden; position: relative; height: 1em; line-height: 1em; width: 5.4em; font-family: FontAwesome; }
.star-rating::before { content: "\f005\f005\f005\f005\f005"; float: left; top: 0; left: 0; position: absolute; color: var(--ogani-border); }
.star-rating span { overflow: hidden; float: left; top: 0; left: 0; position: absolute; padding-top: 1.5em; }
.star-rating span::before { content: "\f005\f005\f005\f005\f005"; top: 0; position: absolute; left: 0; color: #f5b223; }

/* ---- Quantity input (single product + cart table) ---- */
.pro-qty { border: 1px solid var(--ogani-border); display: inline-block; padding: 0 10px; }
.pro-qty input,
input.ogani-qty-input,
.quantity input.qty {
	width: 50px;
	border: none;
	text-align: center;
	font-family: "Cairo", sans-serif;
	color: var(--ogani-heading);
	font-weight: 700;
	height: 46px;
}

/* ==========================================================================
   Cart page (shoping-cart section wrapping WooCommerce's own cart table)
   ========================================================================== */
.shoping-cart table.shop_table,
.shoping-cart .cart_totals,
.shoping-cart .cart-collaterals {
	width: 100%;
	border-collapse: collapse;
	font-family: "Cairo", sans-serif;
}
.shoping-cart table.shop_table { margin-bottom: 40px; }
.shoping-cart table.shop_table th {
	background: var(--ogani-bg);
	text-transform: uppercase;
	font-size: 14px;
	font-weight: 700;
	color: var(--ogani-heading);
	padding: 15px 20px;
	text-align: left;
	border: none;
}
.shoping-cart table.shop_table td {
	border-bottom: 1px solid var(--ogani-border);
	padding: 20px;
	vertical-align: middle;
}
.shoping-cart table.shop_table td.product-name a { color: var(--ogani-heading); font-weight: 700; }
.shoping-cart table.shop_table img { width: 90px; height: auto; margin-right: 15px; }
.shoping-cart .product-remove a {
	color: #dc3545;
	font-size: 20px;
	display: inline-block;
	width: 30px;
	height: 30px;
	text-align: center;
	line-height: 28px;
	border: 1px solid var(--ogani-border);
}
.shoping-cart .coupon { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; margin: 20px 0; }
.shoping-cart .coupon input#coupon_code {
	height: 46px;
	border: 1px solid var(--ogani-border);
	padding: 0 20px;
	min-width: 220px;
}
.shoping-cart button[name="update_cart"],
.shoping-cart button[name="apply_coupon"],
.shoping-cart .checkout-button,
.checkout #place_order {
	background: var(--ogani-primary);
	border: none;
	color: #fff;
	text-transform: uppercase;
	font-weight: 700;
	font-size: 14px;
	height: 50px;
	padding: 0 35px;
	cursor: pointer;
	display: inline-block;
}
.cart_totals { max-width: 420px; margin-left: auto; background: var(--ogani-bg); padding: 30px; }
.cart_totals h2 { font-size: 22px; margin-bottom: 20px; }
.cart_totals table { width: 100%; }
.cart_totals table th,
.cart_totals table td { padding: 10px 0; border-bottom: 1px solid var(--ogani-border); text-align: left; }
.cart_totals .order-total .amount { color: var(--ogani-primary); font-weight: 700; font-size: 18px; }
.wc-proceed-to-checkout { margin-top: 20px; }
.wc-proceed-to-checkout a.checkout-button { width: 100%; text-align: center; }

/* ==========================================================================
   Checkout page
   ========================================================================== */
.checkout form.checkout_coupon,
.checkout .woocommerce-billing-fields,
.checkout .woocommerce-shipping-fields,
.checkout .woocommerce-additional-fields {
	margin-bottom: 30px;
}
.checkout h3 {
	font-size: 20px;
	margin-bottom: 20px;
	color: var(--ogani-heading);
	font-family: "Cairo", sans-serif;
}
.checkout .form-row { margin-bottom: 15px; }
.checkout .form-row label {
	display: block;
	margin-bottom: 6px;
	color: var(--ogani-heading);
	font-size: 14px;
}
.checkout .form-row .required { color: #dc3545; }
.checkout input.input-text,
.checkout select,
.checkout textarea {
	width: 100%;
	height: 46px;
	border: 1px solid var(--ogani-border);
	padding: 0 15px;
	font-family: "Cairo", sans-serif;
	color: var(--ogani-heading);
}
.checkout textarea { height: 100px; padding: 10px 15px; }
.checkout table.shop_table { width: 100%; margin-bottom: 20px; }
.checkout table.shop_table th,
.checkout table.shop_table td { padding: 12px 0; border-bottom: 1px solid var(--ogani-border); text-align: left; }
#order_review { background: var(--ogani-bg); padding: 30px; }
.woocommerce-checkout-payment { background: #fff; border: 1px solid var(--ogani-border); margin-top: 20px; }
.woocommerce-checkout-payment ul.wc_payment_methods { list-style: none; padding: 20px; }
.woocommerce-checkout-payment .wc_payment_method { margin-bottom: 12px; }
.woocommerce-checkout-payment .payment_box { background: var(--ogani-bg); padding: 15px; margin-top: 10px; font-size: 14px; }
#place_order { width: 100%; margin-top: 15px; }

/* ==========================================================================
   My account page
   ========================================================================== */
.woocommerce-MyAccount-navigation ul { list-style: none; padding: 0; margin: 0 0 30px; border: 1px solid var(--ogani-border); }
.woocommerce-MyAccount-navigation li { border-bottom: 1px solid var(--ogani-border); }
.woocommerce-MyAccount-navigation li:last-child { border-bottom: none; }
.woocommerce-MyAccount-navigation li a { display: block; padding: 12px 20px; color: var(--ogani-heading); }
.woocommerce-MyAccount-navigation li.is-active a { color: var(--ogani-primary); font-weight: 700; }
.woocommerce-MyAccount-content { max-width: 700px; }
.woocommerce-form-login input, .woocommerce-form-register input,
.woocommerce-EditAccountForm input, .woocommerce-address-fields input {
	width: 100%;
	height: 46px;
	border: 1px solid var(--ogani-border);
	padding: 0 15px;
	margin-bottom: 15px;
}
.woocommerce-form-login .button, .woocommerce-form-register .button,
.woocommerce-EditAccountForm .button, .woocommerce-address-fields .button {
	background: var(--ogani-primary);
	color: #fff;
	border: none;
	padding: 12px 30px;
	text-transform: uppercase;
	font-weight: 700;
	cursor: pointer;
}

/* ==========================================================================
   Contact form success / error state (page-contact.php)
   ========================================================================== */
.ogani-form-success {
	background: var(--ogani-bg);
	border-left: 3px solid var(--ogani-primary);
	padding: 15px 20px;
	margin-bottom: 20px;
}
ul.ogani-form-errors {
	background: #fdf1f1;
	border-left: 3px solid #dc3545;
	padding: 15px 20px 15px 35px;
	margin-bottom: 20px;
	color: #dc3545;
}

/* ==========================================================================
   Comments (single.php / product reviews tab)
   ========================================================================== */
.ogani-comments,
#tabs-3 .woocommerce-Reviews { margin-top: 20px; }
.ogani-comments .comment-list,
.woocommerce-Reviews .commentlist { list-style: none; padding: 0; margin: 20px 0; }
.ogani-comments .comment-list li,
.woocommerce-Reviews .commentlist li { border-bottom: 1px solid var(--ogani-border); padding: 15px 0; }
.ogani-comments .comment-respond input,
.ogani-comments .comment-respond textarea,
#review_form input,
#review_form textarea {
	width: 100%;
	border: 1px solid var(--ogani-border);
	padding: 12px 15px;
	margin-bottom: 15px;
	font-family: "Cairo", sans-serif;
}
.ogani-comments .comment-respond textarea,
#review_form textarea { height: 120px; }

/* ==========================================================================
   Category / subcategory nesting (hero "All departments" dropdown +
   shop sidebar "Department" list) - built by ogani_product_cat_tree()
   ========================================================================== */
.ogani-cat-tree li.ogani-cat-has-children > a::after {
	content: "\f105"; /* fa-angle-right */
	font-family: FontAwesome;
	float: right;
	color: var(--ogani-text);
}
ul.ogani-subcat-list {
	list-style: none;
	margin: 0 0 0 15px;
	padding: 0;
}
ul.ogani-subcat-list li a {
	font-size: 13px;
	opacity: 0.85;
}
.sidebar__item ul.ogani-subcat-list { margin-left: 15px; }

@media (max-width: 767px) {
	.cart_totals { max-width: 100%; margin-left: 0; }
	.shoping-cart table.shop_table img { display: block; margin-bottom: 10px; }
}
