/*
Theme Name: Hello Elementor Child
Description: Hello Elementor is a lightweight and minimalist WordPress theme that was built specifically to work seamlessly with the Elementor site builder plugin. The theme is free, open-source, and designed for users who want a flexible, easy-to-use, and customizabl
Author: Elementor Team
Author URI: https://elementor.com/?utm_source=wp-themes&utm_campaign=author-uri&utm_medium=wp-dash
Author Email: test
Version: 1.0.0
Text Domain: hello-elementor-child
Template: hello-elementor
*/
/*
Add your custom styles here
*/







.roundicon span.elementor-icon {
    width: 52px;
    height: 52px;
    border-radius: 50%;
    border: 1px solid #E4CBBC;
    color: #c36543;
    display: grid;
    place-items: center;
    margin: 0 auto 0px;
}

.iconalign .elementor-icon-box-icon {
    margin-top: 5px;
}

.author-photo::after {
    content: "";
    position: absolute;
    left: 18px;
    top: 18px;
    right: -18px;
    bottom: -18px;
    border: 1px solid #c4634273;
    border-radius: 210px 210px 14px 14px;
}

.bgiconcontact .elementor-icon-box-icon {
    width: 42px;
    height: 42px;
    border-radius: 50%;
    background: #f8f1ed;
    display: flex !important;
    align-items: center;
    justify-content: center;
    flex-shrink: 0 !important;
    color: #c45c3e;
    margin-top: 7px;
}

p.cq-qty-label {
    margin-bottom: -16px !important;
}
p.stock.in-stock {
    display: none;
}

div#mobmenu ul li {
    padding: 5px 10px;
}
div#mobmenu ul li a {
    border-style: solid;
    border-width: 0px 0px 1px 0px;
    border-color: #0000000D;
}
li.Buy-the-Journal-Menu a.elementor-item {
    background-color: #D57151;
    text-transform: uppercase;
    line-height: 23px;
    color: #FFFFFF !important;
    border-radius: 0px 0px 0px 0px;
    text-align: center !important;
    display: flex;
    align-items: center;
    justify-content: center;
}
li.Buy-the-Journal-Menu {
    padding: 10px;
}

:root{
	--cq-terra-btn: #D57151;   /* solid button fill */
	--cq-terra-dk:  #C36543;   /* ghost button text/border */
	--cq-terra-deep:#B25736;   /* solid button hover */
	--cq-line:      #E7DCD3;   /* quantity border */
	--cq-ink:       #26201D;
	--cq-white:     #FFFFFF;
}

/* Elementor wraps Quantity + the native Add to Cart button inside
.e-atc-qty-button-holder, while Buy Now / Share sit outside it as
direct children of form.cart. display:contents "unwraps" that
holder in the layout so every control becomes a direct grid item
we can position with `order` Ã¢â‚¬â€ regardless of Elementor's DOM order. */
.e-atc-qty-button-holder{
	display: contents !important;
}

form.cart{
	display: grid !important;
	grid-template-columns: 1fr 1fr !important;
	gap: 14px !important;
	max-width: 520px;
	align-items: start;
}

/* ---------- Quantity label (its own row, above the selector) ---------- */
.cq-qty-label{
	grid-column: 1 / -1 !important;
	order: 0 !important;
	margin: 0 !important;
	font-size: 11px !important;
	font-weight: 700 !important;
	letter-spacing: .18em !important;
	text-transform: uppercase !important;
	color: var(--cq-terra-dk) !important;
}

/* ---------- Quantity (row 1, full width) ---------- */
form.cart .quantity{
	grid-column: 1 / -1 !important;
	order: 1 !important;
	display: inline-flex;
	align-items: center;
	width: fit-content;
	margin-top: 10px;
	border: 1px solid var(--cq-line);
	background: var(--cq-white);
	border-radius: 4px;
}
.cq-qty-btn{
	width: 38px;
	height: 42px;
	background: none !important;
	border: 0 !important;
	box-shadow: none !important;
	color: var(--cq-ink);
	font-size: 17px;
	line-height: 1;
	cursor: pointer;
}
/* Only the text color should change on hover Ã¢â‚¬â€ Elementor's own button
hover style was also painting a background, so we lock it to none. */
.cq-qty-btn:hover,
.cq-qty-btn:focus{
	background: none !important;
	border: 0 !important;
	box-shadow: none !important;
	color: var(--cq-terra-dk) !important;
}
.cq-qty-btn:disabled{ opacity: .35; cursor: not-allowed; }

input.qty {
	width: 52px !important;
	height: 42px !important;
	border: 0 !important;
	text-align: center !important;
	font-size: 14px !important;
	font-weight: 600 !important;
	color: var(--cq-ink) !important;
	background: none !important;
	-moz-appearance: textfield !important;
	appearance: textfield !important;
	outline: none !important;
	box-shadow: none !important;
}
/* Hide the native up/down spinner arrows completely (Chrome/Safari/Edge) */
input.qty::-webkit-outer-spin-button,
input.qty::-webkit-inner-spin-button{
	-webkit-appearance: none !important;
	appearance: none !important;
	margin: 0 !important;
}

/* ---------- Shared button shape (row 2: Buy Now | Add to Cart) ---------- */
button.single_add_to_cart_button.button.alt, 
button.cq-share-button {
	margin: 0 !important;
	font-size: 12.5px !important;
	font-weight: 600 !important;
	letter-spacing: .14em !important;
	text-transform: uppercase !important;
	padding: 17px 30px !important;
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
	gap: 12px !important;
	white-space: nowrap !important;
	line-height: normal !important;
	border-radius: 0px;
	cursor: pointer;
	width: 100%;
	transition: background-color .25s ease, color .25s ease, border-color .25s ease;
	height: 52px;
}

/* Buy Now Ã¢â‚¬â€ solid fill, appears FIRST regardless of DOM position */
button.single_add_to_cart_button.cq-buy-now-button{
	order: 1 !important;
	background: var(--cq-terra-btn) !important;
	color: #fff !important;
	border: 0 !important;
}
button.single_add_to_cart_button.cq-buy-now-button:hover{
	background: var(--cq-terra-deep) !important;
}

/* Add to Cart Ã¢â‚¬â€ ghost/outline, appears SECOND */
button.single_add_to_cart_button.button.alt:not(.cq-buy-now-button){
	order: 2 !important;
	background: none !important;
	color: var(--cq-terra-dk) !important;
	border: 1px solid var(--cq-terra-dk) !important;
}
button.single_add_to_cart_button.button.alt:not(.cq-buy-now-button):hover{
	background: var(--cq-terra-btn) !important;
	color: #fff !important;
	border-color: var(--cq-terra-btn) !important;
}

/* Share Ã¢â‚¬â€ ghost/outline, full width row below */
button.cq-share-button{
	order: 3 !important;
	grid-column: 1 / -1 !important;
	background: none !important;
	color: var(--cq-terra-dk) !important;
	border: 1px solid var(--cq-terra-dk) !important;
}
button.cq-share-button:hover{
	background: var(--cq-terra-btn) !important;
	color: #fff !important;
	border-color: var(--cq-terra-btn) !important;
}
.cq-share-icon{ margin-left: 2px; }

/* out-of-stock / disabled state Ã¢â‚¬â€ WooCommerce toggles these itself
for variable products until a valid variation is selected */
.single_add_to_cart_button.disabled,
.single_add_to_cart_button[disabled],
.cq-buy-now-button:disabled{
	opacity: .5 !important;
	cursor: not-allowed !important;
	pointer-events: none !important;
}














/* cq-product-reviews.css
   Styles for the [cq_product_reviews] shortcode.
   No title/heading styles here Ã¢â‚¬â€ that's built separately in Elementor. */

:root{
	--cqpr-terra-dk:  #C36543;
	--cqpr-ink:       #26201D;
	--cqpr-muted:     #6E655E;
	--cqpr-line:      #E7DCD3;
	--cqpr-card-bg:   #FFFFFF;
}

.cqpr-wrap{/* max-width: 1200px; */margin: 0 auto;}

/* ---------- Card ---------- */
.cqpr-card{
	background: var(--cqpr-card-bg);
	border: 1px solid var(--cqpr-line);
	border-radius: 8px;
	padding: 26px;
	display: flex;
	flex-direction: column;
}
.cqpr-stars{ color: var(--cqpr-terra-dk); font-size: 15px; letter-spacing: 2px; margin-bottom: 14px; }
.cqpr-star{ opacity: .25; }
.cqpr-star.is-filled{ opacity: 1; }
.cqpr-text{
	color: var(--cqpr-ink);
	font-size: 14.5px;
	line-height: 1.7;
	margin: 0 0 20px;
	flex-grow: 1;
}
.cqpr-author{ display: flex; align-items: center; gap: 10px; margin-top: auto; }
.cqpr-avatar{ border-radius: 50%; width: 44px !important; height: 44px !important; }
.cqpr-name{ margin: 0; font-size: 14px; color: var(--cqpr-ink); }
.cqpr-role{ margin: 2px 0 0; font-size: 12.5px; color: var(--cqpr-muted); }

/* =========================================================
   GRID layout
   mobile: 1 col | tablet: 2 col | desktop: 3 col
   ========================================================= */
.cqpr-grid .cqpr-track{
	display: grid;
	grid-template-columns: 1fr;
	gap: 22px;
}
@media (min-width: 641px){
	.cqpr-grid .cqpr-track{ grid-template-columns: repeat(2, 1fr); }
}
@media (min-width: 1025px){
	.cqpr-grid .cqpr-track{ grid-template-columns: repeat(3, 1fr); }
}

/* =========================================================
   SLIDER layout
   mobile: 1 per view | tablet: 2 per view | desktop: 3 per view
   ========================================================= */
.cqpr-slider .cqpr-viewport{ position: relative; display: flex; align-items: center; gap: 10px; }
.cqpr-slider .cqpr-track{
	display: flex;
	gap: 22px;
	overflow-x: auto;
	scroll-snap-type: x mandatory;
	scroll-behavior: smooth;
	-webkit-overflow-scrolling: touch;
	flex: 1 1 auto;
	scrollbar-width: none; /* hide scrollbar visually, keep it swipeable */
}
.cqpr-slider .cqpr-track::-webkit-scrollbar{ display: none; }
.cqpr-slider .cqpr-card{
	scroll-snap-align: start;
	flex: 0 0 100%;
}
@media (min-width: 641px){
	.cqpr-slider .cqpr-card{ flex: 0 0 calc(50% - 11px); }
}
@media (min-width: 1025px){
	.cqpr-slider .cqpr-card{ flex: 0 0 calc(33.333% - 15px); }
}

.cqpr-nav{
	flex: 0 0 auto;
	width: 36px;
	height: 36px;
	border-radius: 50%;
	border: 1px solid var(--cqpr-line);
	background: #fff;
	color: var(--cqpr-terra-dk);
	font-size: 20px;
	line-height: 1;
	cursor: pointer;
}
.cqpr-nav:hover{ background: var(--cqpr-terra-dk); color: #fff; border-color: var(--cqpr-terra-dk); }
.cqpr-nav:disabled{ opacity: .3; cursor: not-allowed; }



















/* checkout-custom.css
   Pairs with the template overrides (form-checkout.php, form-billing.php,
   payment.php) and checkout-custom.php hooks. */

:root{
	--cq-primary:       #C45C3E;
	--cq-primary-dark:  #A84A30;
	--cq-primary-light: #F8F1ED;
	--cq-text:          #2C2C2C;
	--cq-text-muted:    #6B6B6B;
	--cq-border:        #E8E0D8;
	--cq-white:         #FFFFFF;
}

/* ---------- Two-column layout ---------- */
.cq-checkout-grid{
	display: grid;
	grid-template-columns: 1fr 380px;
	gap: 48px;
	align-items: start;
}

/* Small desktop / laptop */
@media (min-width: 1024px) and (max-width: 1280px){
	.cq-checkout-grid{
		grid-template-columns: 1fr 340px;
		gap: 32px;
	}
}

/* Tablet */
@media (max-width: 1023px) and (min-width: 768px){
	.cq-checkout-grid{
		grid-template-columns: 1fr 300px;
		gap: 24px;
	}
}

/* Mobile â€” single column, sidebar goes above the form (order:-1) and is
   NOT sticky (position:static overrides the sticky set further below). */
@media (max-width: 767px){
	.cq-checkout-grid{
		grid-template-columns: 1fr;
		gap: 24px;
	}
	.cq-checkout-right{
		order: -1;
		position: static !important;
	}
}

/* Small phones */
@media (max-width: 580px){
	.cq-checkout-grid{ gap: 18px; }
	.cq-checkout-right{ padding: 18px !important; }
}

/* Extra-small phones */
@media (max-width: 420px){
	.cq-checkout-grid{ gap: 14px; }
	.cq-checkout-right{ padding: 14px !important; }
	#place_order{ font-size: 0.95rem !important; padding: 14px !important; }
}


/* ---------- Numbered section titles ---------- */
.cq-section{ margin-bottom: 36px; }
.cq-section-title{
	font-size: 1.05rem !important;
	font-weight: 600 !important;
	color: var(--cq-primary);
	margin-bottom: 18px;
}
.cq-ship-different-label{
	display: block;
	margin-top: 14px;
	font-size: 0.95rem;
	cursor: pointer;
}
.cq-ship-different-label input{
	accent-color: var(--cq-primary);
	margin-right: 8px;
}

/* ---------- Form fields ---------- */
.woocommerce-checkout label{
	display: block;
	font-size: 0.9rem;
	font-weight: 500;
	margin-bottom: 6px;
	color: var(--cq-text);
}
.woocommerce-checkout input[type="text"],
.woocommerce-checkout input[type="email"],
.woocommerce-checkout input[type="tel"],
.woocommerce-checkout select{
	width: 100% !important;
	padding: 12px 14px !important;
	border: 1px solid var(--cq-border) !important;
	border-radius: 6px !important;
	font-size: 0.95rem !important;
	background: var(--cq-white) !important;
}
.woocommerce-checkout input:focus,
.woocommerce-checkout select:focus{
	outline: none;
	border-color: var(--cq-primary) !important;
}

/* Fields wrapper as flexbox â€” this is the key fix. Different countries show
   different combinations of city/state/postcode (some skip postcode, some
   skip state, some rename state to "County" etc â€” WooCommerce just hides
   the ones a country doesn't need via display:none). A flexbox with gap
   automatically adapts to however many of those 2-3 fields are actually
   visible for the selected country, sharing the row space between them â€”
   no fixed 30.5%/4%-margin math that assumes exactly 3 fields every time. */
.woocommerce-checkout .woocommerce-billing-fields__field-wrapper,
.woocommerce-checkout .woocommerce-shipping-fields__field-wrapper{
	display: flex;
	flex-wrap: wrap;
	gap: 16px;
}
.woocommerce-checkout .form-row{ margin-bottom: 0 !important; } /* gap handles spacing now */

.woocommerce-checkout .form-row-first,
.woocommerce-checkout .form-row-last{
	flex: 1 1 200px;
	width: auto !important;
	float: none !important;
}
.woocommerce-checkout .form-row-wide{
	flex: 1 1 100%;
	width: 100% !important;
	float: none !important;
	clear: none !important;
}

/* City / State / Postcode (or County, or whatever a given country calls
   these 2-3 fields) â€” each grows/shrinks to share the row evenly with
   however many of its siblings are actually visible. */
.woocommerce-checkout .cq-row-3{
	flex: 1 1 140px;
	width: auto !important;
	float: none !important;
	margin-right: 0 !important;
}

/* ---------- Disable select2 on checkout â€” use plain native dropdowns ---------- */
.select2-container{ display: none !important; }
.woocommerce-checkout select.country_select,
.woocommerce-checkout select.state_select,
.woocommerce-checkout select.country_to_state{
	display: block !important;
	-webkit-appearance: menulist !important;
	appearance: menulist !important;
}

/* ---------- Mobile responsive: 1 field per row (till 767px) ---------- */
@media (max-width: 767px){
	.woocommerce-checkout .form-row-first,
	.woocommerce-checkout .form-row-last,
	.woocommerce-checkout .cq-row-3{
		flex-basis: 100% !important;
	}
}

/* Place Order button total */
.cq-order-total{ margin-left: 6px; }

/* ---------- Payment box ---------- */
#payment,
.woocommerce-checkout-payment{
	background: none !important;
}
#payment ul.payment_methods{
	list-style: none;
	margin: 0 0 20px;
	padding: 0;
	border: 1px solid var(--cq-border);
	border-radius: 10px;
	overflow: hidden;
	background: var(--cq-white);
}
#payment li.wc_payment_method{ padding: 16px 18px; border-bottom: 1px solid var(--cq-border); background: none; }
#payment li.wc_payment_method:last-child{ border-bottom: none; }
#payment label{ display: flex; align-items: center; gap: 12px; margin: 0; cursor: pointer; }
#payment input[type="radio"]{ accent-color: var(--cq-primary); width: 18px; height: 18px; }
#payment .payment_box{
	background: var(--cq-primary-light) !important;
	margin: 12px 18px 0;
	padding: 14px 16px;
	border-radius: 6px;
	font-size: 0.9rem;
	color: var(--cq-text-muted);
}
#payment .form-row.place-order{
	background: none !important;
	border: none !important;
	padding: 0 !important;
	margin: 0 !important;
	margin-top: 40px !important;
}

/* ---------- Place order button ---------- */
#place_order{
	width: 100%;
	background: var(--cq-primary) !important;
	color: #fff !important;
	border: none !important;
	padding: 16px !important;
	border-radius: 8px !important;
	font-size: 1.05rem !important;
	font-weight: 600 !important;
	cursor: pointer;
	margin-bottom: 15px;
}
#place_order:hover{ background: var(--cq-primary-dark) !important; }
.woocommerce-terms-and-conditions-wrapper{
	margin-top: 14px;
	font-size: 0.85rem;
	color: var(--cq-text-muted);
	text-align: center;
}

/* ---------- Order review sidebar ---------- */
.cq-checkout-right{
	background: var(--cq-white);
	border: 1px solid var(--cq-border);
	border-radius: 12px;
	padding: 28px;
	position: sticky;
	top: 100px;
}
#order_review_heading{
	font-size: 1.15rem;
	font-weight: 700;
	color: var(--cq-primary);
	margin: 0 0 20px;
}

/* ---------- Order list (ul/li instead of table) ---------- */
.cq-order-list{
	list-style: none;
	margin: 0 0 18px;
	padding: 0 0 18px;
	border-bottom: 1px solid var(--cq-border);
}
.cq-order-list > li{ margin: 0; }

/* ---------- Totals list ---------- */
.cq-order-totals{
	list-style: none;
	margin: 0 0 20px;
	padding: 0 0 18px;
	border-bottom: 1px solid var(--cq-border);
}
.cq-order-totals-row{
	display: flex;
	justify-content: space-between;
	align-items: baseline;
	padding: 5px 0;
	font-size: 0.95rem;
	color: var(--cq-text);
}
.cq-order-total-row{
	font-size: 1.2rem !important;
	font-weight: 700;
	color: var(--cq-primary);
	margin-top: 4px;
	padding-top: 8px !important;
}

/* Divider + spacing before the trust-badges block (Elementor template),
   which sits right after #order_review inside .cq-checkout-right. */
.cq-checkout-right > [data-elementor-type]{
	margin-top: 4px;
}
.cq-checkout-right > [data-elementor-type] .elementor-icon-box-wrapper{
	align-items: flex-start;
}

/* ---------- Order item card ---------- */
.cq-order-item{ display: flex; gap: 16px; }
.cq-order-item-img{ flex-shrink: 0; }
.cq-order-thumb{
	width: 80px;
	height: 100px;
	object-fit: cover;
	border-radius: 6px;
	display: block;
}
.cq-order-thumb-placeholder{
	width: 80px;
	height: 100px;
	background: linear-gradient(135deg, var(--cq-primary), var(--cq-primary-dark));
	color: #fff;
	display: flex;
	align-items: center;
	justify-content: center;
	text-align: center;
	font-size: 0.7rem;
	font-weight: 600;
	line-height: 1.3;
	padding: 8px;
	border-radius: 6px;
}
.cq-order-item-details{ flex: 1; min-width: 0; }
.cq-order-item-title{
	font-size: 1.02rem;
	font-weight: 700;
	color: var(--cq-text);
	line-height: 1.3;
	margin: 0 0 4px;
}
.cq-order-item-subtitle{
	font-size: 0.88rem;
	color: var(--cq-text-muted);
	margin: 0 0 8px;
}
.cq-order-item-price{
	font-size: 1.05rem;
	font-weight: 700;
	color: var(--cq-primary);
	margin: 0 0 8px;
}

/* Minimal "Qty: 1 â–¾" look â€” plain text with a small arrow, not a boxed
   select, matching the reference design. */
.cq-order-qty{
	display: flex;
	align-items: baseline;
	gap: 4px;
	font-size: 0.88rem;
	color: var(--cq-text-muted);
	justify-content: flex-start;
}
.cq-order-qty select.cq-qty-select{
	border: none !important;
	background: none !important;
	padding: 0px 7px !important;
	margin: 0;
	font-size: 0.88rem !important;
	color: var(--cq-text-muted);
	/* -webkit-appearance: none !important; */
	/* appearance: none !important; */
	cursor: pointer;
	font-family: inherit;
	line-height: 31px;
	animation: auto !important;
	width: auto !important;
}
.cq-order-qty::after{
	content: '';
	display: none; /* the native select's own arrow is used instead */
}