/* Aila Beauty store: white, mobile-first, burgundy accents. */
:root {
	--aila-ink: #3D0F14;
	--aila-ink-hover: #5A1E26;
	--aila-cream: #F2EAE1;
	--aila-soft: #FBF7F4;
	--aila-line: #EEE6E1;
	--aila-border: #D9CCC5;
	--aila-muted: #5E4A4D;
	--aila-collar: #C9AE95;
}
html { -webkit-text-size-adjust: 100%; }
body.aila {
	margin: 0;
	background: #FFFFFF;
	color: var(--aila-ink);
	font-family: Jost, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
	font-size: 16px;
	line-height: 1.45;
}
body.aila *, body.aila *::before, body.aila *::after { box-sizing: border-box; }
body.aila a { color: var(--aila-ink); }
body.aila a:hover { color: #7A2A33; }
body.aila button { font-family: inherit; }
.aila .col { max-width: 560px; margin: 0 auto; padding-left: 18px; padding-right: 18px; }
.aila .muted { color: var(--aila-muted); }
.aila [hidden] { display: none !important; }

/* Top bar + header */
.aila-topbar { background: var(--aila-ink); color: #FFFFFF; text-align: center; font-size: 13px; padding: 8px 12px; letter-spacing: .02em; }
.aila-header { display: flex; align-items: center; justify-content: space-between; height: 60px; }
.aila-header-line { border-bottom: 1px solid var(--aila-line); }
.aila-header-center { justify-content: center; }
.aila-header-side { width: 44px; height: 44px; display: flex; align-items: center; color: var(--aila-ink); }
.aila-header-right, .aila-header-insta { justify-content: flex-end; }
.aila-logo { display: inline-flex; align-items: center; gap: 8px; text-decoration: none; color: var(--aila-ink) !important; }
.aila-logo-a { font-family: "Cormorant Garamond", Georgia, serif; font-style: italic; font-weight: 500; font-size: 30px; line-height: 1; }
.aila-logo-word { font-size: 13px; font-weight: 500; letter-spacing: .32em; }

/* Notices */
.aila .woocommerce-error, .aila .woocommerce-message, .aila .woocommerce-info, .aila .woocommerce-NoticeGroup ul {
	list-style: none; margin: 12px 0; padding: 12px 14px; border-radius: 12px; font-size: 14px;
	background: var(--aila-soft); border: 1px solid var(--aila-border); color: var(--aila-ink);
}
.aila .woocommerce-error { background: #FDF1F1; border-color: #E7B9B9; color: #7A1A1A; }
.aila .woocommerce-error li { margin: 2px 0; }
.aila-notices:empty { display: none; }

/* Lip balm drawing */
.aila-balm { display: flex; flex-direction: column; align-items: center; }
.aila-balm .tip { width: 56px; height: 74px; border-radius: 38px 38px 5px 5px / 60px 30px 5px 5px; transition: background .25s; }
.aila-balm .collar { width: 68px; height: 17px; background: var(--aila-collar); }
.aila-balm .body { width: 76px; height: 184px; background: var(--aila-ink); border-radius: 4px 4px 10px 10px; display: flex; align-items: flex-end; justify-content: center; padding-bottom: 18px; }
.aila-balm .body span { color: var(--aila-cream); font-family: "Cormorant Garamond", Georgia, serif; font-style: italic; font-size: 34px; line-height: 1; }
.aila-balm-sm .tip { width: 16px; height: 22px; border-radius: 11px 11px 2px 2px / 17px 9px 2px 2px; }
.aila-balm-sm .collar { width: 20px; height: 5px; }
.aila-balm-sm .body { width: 22px; height: 46px; padding-bottom: 4px; border-radius: 1px 1px 3px 3px; }
.aila-balm-sm .body span { font-size: 11px; }

/* Hero */
.aila-hero { padding-top: 8px; display: flex; flex-direction: column; gap: 14px; }
.aila-hero-visual { position: relative; background: var(--aila-cream); border-radius: 20px; height: 380px; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 22px; }
.aila-badge { position: absolute; top: 14px; left: 14px; background: #FFFFFF; color: var(--aila-ink); font-size: 12px; font-weight: 600; padding: 4px 10px; border-radius: 999px; letter-spacing: .04em; }
.aila-hero-shades { display: flex; gap: 6px; }
.aila-hero-shades span { width: 14px; height: 14px; border-radius: 50%; }
.aila-title { margin: 6px 0 0; font-size: 28px; font-weight: 600; line-height: 1.15; }
.aila-tagline { margin: 0; font-family: "Cormorant Garamond", Georgia, serif; font-style: italic; font-size: 20px; line-height: 1.3; }
.aila-price-line { display: flex; align-items: baseline; gap: 10px; flex-wrap: wrap; }
.aila-price-line strong { font-size: 24px; font-weight: 600; }
.aila-price-line span { font-size: 14px; }
.aila-label { margin: 0 0 10px; font-size: 15px; }
.aila-label strong { font-weight: 600; }
.aila-swatches { display: flex; gap: 12px; flex-wrap: wrap; }
.aila-sw { width: 48px; height: 48px; border-radius: 50%; border: 3px solid #FFFFFF; box-shadow: 0 0 0 1px var(--aila-border); cursor: pointer; padding: 0; }
.aila-sw.is-on { box-shadow: 0 0 0 2px var(--aila-ink); }

/* Offers */
.aila-offers { padding-top: 28px; display: flex; flex-direction: column; gap: 14px; }
.aila-h2 { margin: 0; font-size: 22px; font-weight: 600; line-height: 1.2; }
.aila-offer-list { display: flex; flex-direction: column; gap: 10px; }
.aila-opt { position: relative; display: flex; align-items: center; gap: 12px; width: 100%; min-height: 68px; padding: 12px 14px; border-radius: 14px; background: #FFFFFF; border: 1px solid #E3D8D2; cursor: pointer; color: var(--aila-ink); text-align: left; font-size: 16px; }
.aila-opt.is-on { border: 2px solid var(--aila-ink); background: var(--aila-soft); padding: 11px 13px; }
.aila-dot { width: 20px; height: 20px; border-radius: 50%; border: 2px solid var(--aila-ink); flex: none; display: flex; align-items: center; justify-content: center; }
.aila-opt.is-on .aila-dot::after { content: ""; width: 10px; height: 10px; border-radius: 50%; background: var(--aila-ink); }
.aila-opt-text { display: flex; flex-direction: column; gap: 2px; flex: 1; min-width: 0; }
.aila-opt-title { font-weight: 600; }
.aila-opt-sub { font-size: 13px; }
.aila-opt-price { font-weight: 600; white-space: nowrap; }
.aila-opt-badge { position: absolute; top: -10px; right: 12px; background: var(--aila-ink); color: #FFFFFF; font-size: 11px; font-weight: 600; padding: 3px 9px; border-radius: 999px; letter-spacing: .03em; }
.aila-more { display: flex; align-items: center; justify-content: space-between; gap: 12px; font-size: 14px; }
.aila-stepper { display: flex; align-items: center; border: 1px solid var(--aila-border); border-radius: 12px; flex: none; }
.aila-stepper button { width: 44px; height: 44px; border: 0; background: none; font-size: 20px; color: var(--aila-ink); cursor: pointer; }
.aila-stepper button:disabled { color: #BFB0AC; cursor: default; }
.aila-stepper span { min-width: 28px; text-align: center; font-weight: 600; }
.aila-nudge { display: flex; align-items: center; gap: 12px; background: var(--aila-cream); border-radius: 12px; padding: 10px 12px; font-size: 14px; }
.aila-nudge span { flex: 1; }
.aila-nudge button { min-height: 40px; padding: 0 16px; border-radius: 10px; border: 0; background: var(--aila-ink); color: #FFFFFF; font-weight: 600; cursor: pointer; }
.aila-mix { background: var(--aila-soft); border-radius: 14px; padding: 14px; display: flex; flex-direction: column; gap: 10px; }
.aila-mix-head { margin: 0; display: flex; flex-direction: column; gap: 2px; font-size: 14px; }
.aila-mix-head strong { font-size: 16px; font-weight: 600; }
.aila-mix-row { display: flex; flex-direction: column; gap: 6px; padding: 6px 0; border-top: 1px solid var(--aila-line); }
.aila-mix-row:first-child { border-top: 0; }
.aila-mix-label { font-size: 14px; }
.aila-mix-label strong { font-weight: 600; }
.aila-mix-sws { display: flex; gap: 10px; }
.aila-swm { width: 40px; height: 40px; border-radius: 50%; border: 3px solid var(--aila-soft); box-shadow: 0 0 0 1px var(--aila-border); cursor: pointer; padding: 0; }
.aila-swm.is-on { box-shadow: 0 0 0 2px var(--aila-ink); }

/* Buttons */
.aila-buy { display: flex; align-items: center; justify-content: center; gap: 8px; width: 100%; min-height: 56px; padding: 0 16px; background: var(--aila-ink); color: #FFFFFF !important; border: 0; border-radius: 14px; font-size: 17px; font-weight: 600; text-decoration: none; cursor: pointer; text-align: center; }
.aila-buy:hover { background: var(--aila-ink-hover); }
.aila-buy:disabled { opacity: .7; }
.aila-buy-sm { width: auto; min-height: 48px; padding: 0 22px; font-size: 16px; flex: none; }

.aila-trust { list-style: none; margin: 4px 0 0; padding: 0; display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; text-align: center; font-size: 12px; color: var(--aila-muted); }
.aila-trust li { display: flex; flex-direction: column; align-items: center; gap: 6px; color: var(--aila-muted); }
.aila-trust svg { color: var(--aila-ink); }

/* Sections */
.aila-section { padding-top: 36px; display: flex; flex-direction: column; gap: 14px; }
.aila-benefits { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 12px; }
.aila-benefits li { display: flex; gap: 12px; align-items: flex-start; font-size: 15px; }
.aila-benefits strong { font-weight: 600; }
.aila-tick { width: 24px; height: 24px; border-radius: 50%; background: var(--aila-ink); display: flex; align-items: center; justify-content: center; flex: none; margin-top: 1px; }
.aila-shade-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.aila-shade-card { display: flex; align-items: center; gap: 10px; min-height: 56px; padding: 8px 12px; border: 1px solid var(--aila-line); background: #FFFFFF; border-radius: 12px; font-size: 14px; color: var(--aila-ink); cursor: pointer; text-align: left; }
.aila-shade-chip { width: 30px; height: 30px; border-radius: 50%; flex: none; }
.aila-how { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; }
.aila-how li { background: var(--aila-soft); border-radius: 14px; padding: 14px 10px; display: flex; flex-direction: column; gap: 4px; align-items: center; text-align: center; }
.aila-how li span { width: 28px; height: 28px; border-radius: 50%; background: var(--aila-ink); color: #FFFFFF; font-size: 13px; font-weight: 600; display: flex; align-items: center; justify-content: center; }
.aila-how li em { font-style: normal; font-size: 12px; }
.aila-faq details { border-bottom: 1px solid var(--aila-line); }
.aila-faq summary { list-style: none; min-height: 56px; display: flex; justify-content: space-between; align-items: center; gap: 12px; font-weight: 500; cursor: pointer; }
.aila-faq summary::-webkit-details-marker { display: none; }
.aila-sign::before { content: "+"; font-size: 22px; font-weight: 400; }
.aila-faq details[open] .aila-sign::before { content: "−"; }
.aila-faq p { margin: 0 0 16px; font-size: 15px; }
.aila-final { padding-top: 40px; padding-bottom: 8px; text-align: center; display: flex; flex-direction: column; gap: 10px; align-items: center; }
.aila-final-title { margin: 0; font-family: "Cormorant Garamond", Georgia, serif; font-style: italic; font-weight: 500; font-size: 34px; }
.aila-final p { margin: 0 0 6px; }
.aila-footer { padding-top: 28px; padding-bottom: 110px; display: flex; flex-direction: column; gap: 6px; align-items: center; font-size: 13px; text-align: center; }

/* Sticky buy bar */
.aila-sticky { position: fixed; left: 0; right: 0; bottom: 0; background: #FFFFFF; border-top: 1px solid var(--aila-line); box-shadow: 0 -6px 20px rgba(61, 15, 20, .08); transform: translateY(110%); transition: transform .25s; z-index: 50; padding-bottom: env(safe-area-inset-bottom); }
.aila-sticky.is-shown { transform: none; }
.aila-sticky-inner { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding-top: 10px; padding-bottom: 10px; }
.aila-sticky-text { display: flex; flex-direction: column; font-size: 13px; }
.aila-sticky-text strong { font-size: 18px; font-weight: 600; }

/* ---------- Checkout ---------- */
.aila-checkout { padding-top: 20px; padding-bottom: 40px; }
.aila-co-title { margin: 0 0 16px; font-size: 26px; font-weight: 600; }
.aila-summary { display: flex; gap: 14px; align-items: center; background: var(--aila-cream); border-radius: 16px; padding: 12px; }
.aila-summary-img { width: 64px; height: 64px; background: #FFFFFF; border-radius: 12px; display: flex; align-items: center; justify-content: center; flex: none; }
.aila-summary-text { display: flex; flex-direction: column; gap: 1px; flex: 1; min-width: 0; font-size: 14px; }
.aila-summary-text strong { font-size: 16px; font-weight: 600; }
.aila-summary-shades { font-size: 13px; }
.aila-summary-text a { font-size: 13px; }
.aila-summary-price { font-weight: 600; white-space: nowrap; }
.aila-co-nudge { margin: 10px 0 0; font-size: 14px; background: var(--aila-soft); border-radius: 12px; padding: 10px 12px; }

.aila-checkout form.checkout { margin-top: 18px; display: flex; flex-direction: column; gap: 18px; }
.aila-checkout .col2-set, .aila-checkout .col2-set .col-1 { width: 100%; float: none; padding: 0; max-width: none; }
.aila-checkout .col2-set .col-2 { display: none; }
.aila-checkout h3 { margin: 0 0 12px; font-size: 18px; font-weight: 600; }
.aila-checkout .woocommerce-billing-fields__field-wrapper { display: flex; flex-direction: column; gap: 14px; }
.aila-checkout .form-row { margin: 0; padding: 0; width: 100% !important; float: none !important; display: flex; flex-direction: column; gap: 6px; }
.aila-checkout .form-row label { font-size: 14px; font-weight: 500; line-height: 1.3; }
.aila-checkout .form-row label .required { color: #9A2B36; text-decoration: none; border: 0; }
.aila-checkout .form-row label .optional { display: none; }
.aila-checkout .woocommerce-input-wrapper { display: block; position: relative; }
.aila-checkout input.input-text, .aila-checkout select {
	width: 100%; height: 52px; border: 1px solid var(--aila-border); border-radius: 12px; padding: 0 14px;
	font-family: inherit; font-size: 16px; color: var(--aila-ink); background: #FFFFFF; -webkit-appearance: none; appearance: none; margin: 0;
}
.aila-checkout select { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%233D0F14' stroke-width='2'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E"); background-repeat: no-repeat; background-position: right 14px center; padding-right: 38px; }
.aila-checkout input.input-text:focus, .aila-checkout select:focus { outline: 2px solid var(--aila-ink); outline-offset: 1px; border-color: var(--aila-ink); }
.aila-checkout .woocommerce-invalid input.input-text, .aila-checkout .woocommerce-invalid select { border-color: #B33A3A; }
.aila-checkout .aila-phone .woocommerce-input-wrapper::before { content: "+968"; position: absolute; left: 0; top: 0; height: 52px; width: 70px; display: flex; align-items: center; justify-content: center; background: #F7F1EC; border: 1px solid var(--aila-border); border-radius: 12px 0 0 12px; font-size: 16px; }
.aila-checkout .aila-phone input.input-text { padding-left: 84px; }
.aila-checkout .aila-hidden { display: none !important; }

.aila-checkout #order_review_heading { margin: 4px 0 0; }
.aila-checkout table.shop_table { width: 100%; border-collapse: collapse; font-size: 15px; border: 0; margin: 0; }
.aila-checkout table.shop_table th, .aila-checkout table.shop_table td { padding: 8px 0; border: 0; border-top: 1px solid var(--aila-line); text-align: left; vertical-align: top; font-weight: 400; background: none; }
.aila-checkout table.shop_table thead { display: none; }
.aila-checkout table.shop_table td:last-child, .aila-checkout table.shop_table tfoot td { text-align: right; }
.aila-checkout table.shop_table .product-name { color: var(--aila-muted); }
.aila-checkout table.shop_table .order-total th, .aila-checkout table.shop_table .order-total td { font-size: 19px; font-weight: 600; }
.aila-checkout #shipping_method { list-style: none; margin: 0; padding: 0; }
.aila-checkout #shipping_method input { display: none; }
.aila-checkout .woocommerce-shipping-totals th { color: var(--aila-muted); }

.aila-checkout #payment { margin-top: 18px; background: none; border-radius: 0; }
.aila-checkout #payment ul.payment_methods { list-style: none; margin: 0 0 16px; padding: 0; border: 0; display: flex; flex-direction: column; gap: 10px; }
.aila-checkout #payment li.wc_payment_method { border: 2px solid var(--aila-ink); background: var(--aila-soft); border-radius: 14px; padding: 14px; }
.aila-checkout #payment li.wc_payment_method > input { accent-color: var(--aila-ink); margin-right: 8px; }
.aila-checkout #payment li.wc_payment_method > label { font-weight: 600; font-size: 16px; }
.aila-checkout #payment .payment_box { background: none; padding: 10px 0 0; margin: 0; font-size: 14px; }
.aila-checkout #payment .payment_box::before { display: none; }
.aila-steps { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 10px; line-height: 1.4; }
.aila-steps li { display: flex; gap: 10px; align-items: flex-start; }
.aila-steps li span { width: 22px; height: 22px; border-radius: 50%; background: var(--aila-ink); color: #FFFFFF; font-size: 12px; font-weight: 600; display: flex; align-items: center; justify-content: center; flex: none; }
.aila-checkout .place-order { padding: 0; margin: 0; display: flex; flex-direction: column; gap: 8px; }
.aila-checkout #place_order { display: flex; align-items: center; justify-content: center; width: 100%; min-height: 56px; background: var(--aila-ink); color: #FFFFFF; border: 0; border-radius: 14px; font-family: inherit; font-size: 17px; font-weight: 600; cursor: pointer; float: none; }
.aila-checkout #place_order:hover { background: var(--aila-ink-hover); }
.aila-after-submit { margin: 0; font-size: 12px; text-align: center; color: var(--aila-muted); }
.aila-checkout .woocommerce-privacy-policy-text { font-size: 12px; color: var(--aila-muted); }
.aila-checkout .woocommerce-privacy-policy-text p { margin: 0; }
.aila-checkout .blockUI.blockOverlay { background: rgba(255, 255, 255, .6) !important; }
.aila-checkout .woocommerce-form-coupon-toggle, .aila-checkout .woocommerce-form-login-toggle { display: none; }

/* ---------- Thank you ---------- */
.aila-thanks { padding-top: 40px; padding-bottom: 48px; display: flex; flex-direction: column; gap: 20px; align-items: center; text-align: center; }
.aila-thanks-check { width: 72px; height: 72px; border-radius: 50%; background: var(--aila-ink); display: flex; align-items: center; justify-content: center; }
.aila-thanks h1 { margin: 0 0 6px; font-size: 28px; font-weight: 600; }
.aila-script { margin: 0; font-family: "Cormorant Garamond", Georgia, serif; font-style: italic; font-size: 21px; }
.aila-thanks-text { margin: 0; font-size: 15px; line-height: 1.55; }
.aila-thanks-box { width: 100%; background: var(--aila-cream); border-radius: 16px; padding: 16px; display: flex; flex-direction: column; gap: 10px; text-align: left; }
.aila-row { display: flex; justify-content: space-between; gap: 12px; font-size: 15px; }
.aila-row-total { font-weight: 600; font-size: 17px; border-top: 1px solid #E0D2C6; padding-top: 10px; }
.aila-share { width: 100%; border: 1px solid var(--aila-line); border-radius: 16px; padding: 18px; display: flex; flex-direction: column; gap: 10px; }
.aila-share strong { font-size: 17px; font-weight: 600; }
.aila-share p { margin: 0; font-size: 14px; }
.aila-back { min-height: 44px; display: flex; align-items: center; font-size: 15px; }

@media (min-width: 768px) {
	.aila-hero-visual { height: 440px; }
}