/* =====================================================================
   All Oriental Rugs — Brand layer for Blocksy
   Heritage-gallery identity: warm antique palette, Didone display type,
   Persian border motifs. Loaded on top of the Blocksy parent theme.
   ===================================================================== */

:root {
  --aor-paper:   #1c1611;
  --aor-raise:   #241d15;
  --aor-card:    #2a2119;
  --aor-ink:     #efe3cc;
  --aor-ink-soft:#b3a488;
  --aor-line:    #3c3124;
  --aor-madder:  #d06a4f;
  --aor-madder-deep:#b8563d;
  --aor-indigo:  #8496cf;
  --aor-gold:    #c8a566;
  --aor-gold-bright:#dcba79;
  --aor-band:    #241813;

  --aor-serif: "Didot","Bodoni MT","Bodoni 72","Hoefler Text","Playfair Display","Palatino Linotype",Palatino,"Book Antiqua",Georgia,serif;
  --aor-sans:  "Optima","Gill Sans",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
  --aor-mono:  ui-monospace,"SF Mono","Cascadia Code",Consolas,monospace;
}

/* ---- Typography ------------------------------------------------------ */
body {
  font-family: var(--aor-sans);
  color: var(--aor-ink);
  background-color: var(--aor-paper);
}

h1, h2, h3, h4,
.entry-title, .page-title, .ct-hero-title,
.woocommerce-loop-product__title,
.product_title {
  font-family: var(--aor-serif);
  font-weight: 400;
  letter-spacing: .005em;
}

.aor-eyebrow {
  font-family: var(--aor-mono);
  font-size: 11.5px;
  letter-spacing: .26em;
  text-transform: uppercase;
  color: var(--aor-gold);
}

/* ---- Links & accents ------------------------------------------------ */
a { color: var(--aor-madder); }
/* Exclude buttons: a global link-hover colour must not repaint button text
   (it was turning solid-button labels madder-on-madder = invisible on hover). */
a:not(.btn):not(.button):not(.ct-button):not(.wp-block-button__link):not(.aor-btn-ghost):hover { color: var(--aor-madder-deep); }

/* ---- Kill navy/blue headings on Blocksy-rendered pages -------------- */
/* WooCommerce My Account "Login"/"Register", page titles, etc. inherited a
   dark navy from the parent theme — invisible on our warm-dark background.
   Force every heading on non-homepage templates to light ink. */
body:not(.aor-home) h1,  body:not(.aor-home) h2,  body:not(.aor-home) h3,
body:not(.aor-home) h4,  body:not(.aor-home) h5,  body:not(.aor-home) h6,
body:not(.aor-home) .entry-title,
body:not(.aor-home) .woocommerce-account h2,
body:not(.aor-home) .woocommerce h2,
body:not(.aor-home) .u-columns h2 {
  color: var(--aor-ink) !important;
}

/* ---- Buttons (Blocksy + WooCommerce) -------------------------------- */
.ct-button,
.wp-block-button__link,
.woocommerce a.button,
.woocommerce button.button,
.woocommerce .button,
.woocommerce #respond input#submit,
button.single_add_to_cart_button {
  background-color: var(--aor-madder) !important;
  color: #fbf3ea !important;
  border-color: var(--aor-madder) !important;
  border-radius: 2px !important;
  font-family: var(--aor-sans);
  letter-spacing: .12em;
  text-transform: uppercase;
  font-size: .82rem;
  transition: background-color .18s ease, transform .18s ease;
}
.ct-button:hover,
.wp-block-button__link:hover,
.woocommerce a.button:hover,
.woocommerce button.button:hover,
.woocommerce .button:hover,
button.single_add_to_cart_button:hover {
  background-color: var(--aor-madder-deep) !important;
  transform: translateY(-2px);
}

/* Ghost / secondary button variant */
.aor-btn-ghost {
  background: transparent !important;
  color: var(--aor-ink) !important;
  border: 1px solid var(--aor-ink) !important;
}

/* ---- Persian border motif (reusable divider) ------------------------ */
.aor-pborder {
  height: 26px;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='48' height='26' viewBox='0 0 48 26'%3E%3Cg fill='none' stroke='%239b3223' stroke-width='1.3'%3E%3Cpath d='M24 5 L31 13 L24 21 L17 13 Z'/%3E%3Cpath d='M0 13 L6 8 M0 13 L6 18 M48 13 L42 8 M48 13 L42 18'/%3E%3C/g%3E%3Cg stroke='%238f6a29' stroke-width='1.1'%3E%3Cline x1='0' y1='2.2' x2='48' y2='2.2'/%3E%3Cline x1='0' y1='23.8' x2='48' y2='23.8'/%3E%3C/g%3E%3Ccircle cx='24' cy='13' r='2' fill='%238f6a29'/%3E%3Ccircle cx='7' cy='13' r='1.4' fill='%239b3223'/%3E%3Ccircle cx='41' cy='13' r='1.4' fill='%239b3223'/%3E%3C/svg%3E");
  background-repeat: repeat-x;
  background-position: center;
}

/* ---- WooCommerce catalog polish ------------------------------------- */
.woocommerce ul.products li.product .price,
.woocommerce div.product p.price,
.woocommerce div.product span.price {
  font-family: var(--aor-serif);
  color: var(--aor-ink);
  font-variant-numeric: tabular-nums;
}

.woocommerce span.onsale,
.wc-block-grid__product-onsale {
  background: var(--aor-madder);
  color: #fbf3ea;
  border-radius: 2px;
}

/* Prices in gold-ish accent on hover cards */
.woocommerce ul.products li.product:hover .woocommerce-loop-product__title {
  color: var(--aor-madder);
}

/* ---- Brand top bar injected on Blocksy pages (shop/product/cart) ----- */
.aor-pborder{
  height:22px;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='48' height='26' viewBox='0 0 48 26'%3E%3Cg fill='none' stroke='%239b3223' stroke-width='1.3'%3E%3Cpath d='M24 5 L31 13 L24 21 L17 13 Z'/%3E%3Cpath d='M0 13 L6 8 M0 13 L6 18 M48 13 L42 8 M48 13 L42 18'/%3E%3C/g%3E%3Cg stroke='%238f6a29' stroke-width='1.1'%3E%3Cline x1='0' y1='2.2' x2='48' y2='2.2'/%3E%3Cline x1='0' y1='23.8' x2='48' y2='23.8'/%3E%3C/g%3E%3Ccircle cx='24' cy='13' r='2' fill='%238f6a29'/%3E%3Ccircle cx='7' cy='13' r='1.4' fill='%239b3223'/%3E%3Ccircle cx='41' cy='13' r='1.4' fill='%239b3223'/%3E%3C/svg%3E");
  background-repeat:repeat-x;background-position:center;background-size:auto 22px;
}
.aor-topbar{
  background:#42271a;color:#efe0c8;font-size:.74rem;letter-spacing:.12em;
  text-transform:uppercase;text-align:center;padding:8px 16px;font-family:var(--sans);
}
.aor-topbar a{color:#e7c98b;border-bottom:1px solid rgba(231,201,139,.45);padding-bottom:1px;}

/* ---- WooCommerce price + card polish (high specificity to beat Blocksy) */
html body .woocommerce ul.products li.product .price,
html body .woocommerce ul.products li.product .price .woocommerce-Price-amount,
html body .woocommerce ul.products li.product .price bdi,
html body .woocommerce div.product p.price,
html body .woocommerce div.product p.price .woocommerce-Price-amount,
html body .woocommerce div.product p.price bdi,
html body .woocommerce .price .woocommerce-Price-amount.amount,
html body .woocommerce .price .woocommerce-Price-amount.amount bdi{
  color:var(--aor-ink) !important;
  opacity:1 !important;
  font-family:var(--aor-serif);
  font-weight:400;
}
/* readable product short description */
html body .woocommerce div.product .woocommerce-product-details__short-description,
html body .woocommerce div.product .woocommerce-product-details__short-description p{
  color:var(--aor-ink) !important;
  opacity:1 !important;
  font-size:1.02rem;
}
/* bulletproof: force price + short-description text on Blocksy's entry-summary layout */
html body .entry-summary-items .price,
html body .entry-summary-items .price *,
html body .entry-summary-items .woocommerce-product-details__short-description,
html body .entry-summary-items .woocommerce-product-details__short-description *,
html body .products li.product .price,
html body .products li.product .price *{
  color:var(--aor-ink) !important;
  opacity:1 !important;
}
.woocommerce ul.products li.product .price{ font-size:1.18rem; }
.woocommerce div.product p.price{ font-size:1.7rem; }
.woocommerce ul.products li.product .woocommerce-loop-product__title{
  font-family:var(--aor-serif); font-weight:400; font-size:1.15rem;
}
.woocommerce ul.products li.product{ text-align:left; }
/* archive/shop + product titles */
.woocommerce div.product .product_title{ font-family:var(--aor-serif); font-weight:400; }
.woocommerce .woocommerce-breadcrumb{ font-family:var(--aor-mono); font-size:.74rem; letter-spacing:.06em; }

/* NOTE: no prefers-color-scheme override here on purpose. brand.css styles the
   Blocksy-rendered shop/product/cart pages, which always use a LIGHT background
   (Blocksy has no auto dark mode). Flipping these tokens on a dark-scheme browser
   would put light text on Blocksy's light background. The custom front-page.php
   and template-aor.php manage their own dark mode via their own token sets. */

/* ---- Faceted filter bar (shop / attribute archives) ------------------ */
.aor-filter{
  display:flex; flex-wrap:wrap; gap:14px 16px; align-items:flex-end;
  background:var(--aor-raise); border:1px solid var(--aor-line); border-radius:4px;
  padding:18px 20px; margin:0 0 30px; position:relative;
  box-shadow:0 1px 2px rgba(44,36,27,.05),0 12px 30px rgba(44,36,27,.07);
}
.aor-filter::before{content:"";position:absolute;top:0;left:0;right:0;height:3px;
  background:linear-gradient(90deg,var(--aor-madder),var(--aor-gold),var(--aor-indigo),var(--aor-gold),var(--aor-madder));}
.aor-filter .ff{display:flex;flex-direction:column;gap:5px;}
.aor-filter label{font-family:var(--aor-mono);font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:var(--aor-gold);}
.aor-filter select,.aor-filter input[type="number"]{
  padding:9px 12px;border:1px solid var(--aor-line);background:var(--aor-card);
  color:var(--aor-ink);border-radius:2px;font-family:var(--aor-serif);font-size:.98rem;min-width:148px;}
.aor-filter select:focus,.aor-filter input:focus{outline:2px solid var(--aor-gold);outline-offset:1px;}
.aor-filter .pr{display:flex;align-items:center;gap:6px;color:var(--aor-ink-soft);}
.aor-filter .pr input{min-width:78px;width:88px;}
.aor-filter .ff-actions{display:flex;gap:12px;align-items:center;}
.aor-fbtn{background:var(--aor-madder);color:#fbf3ea;border:none;padding:12px 24px;
  letter-spacing:.12em;text-transform:uppercase;font-size:.8rem;cursor:pointer;border-radius:2px;
  transition:background .18s,transform .18s;}
.aor-fbtn:hover{background:var(--aor-madder-deep);transform:translateY(-2px);}
.aor-freset{color:var(--aor-ink-soft);font-size:.82rem;letter-spacing:.04em;}
.aor-freset:hover{color:var(--aor-madder);}
@media(max-width:640px){.aor-filter select,.aor-filter input[type="number"]{min-width:120px;}}

/* ---- Shop loop: show the WHOLE rug (Blocksy forces a 4/3 crop inline) ---- */
/* Rugs are portrait and were being sliced in half. Contain-fit inside a tall
   portrait cell over a neutral mat so the full weaving is always visible. */
.woocommerce ul.products li.product a img,
.woocommerce ul.products li.product img.wp-post-image,
ul.products li.product img {
  aspect-ratio: 3 / 4 !important;
  width: 100% !important;
  height: auto !important;
  object-fit: contain !important;
  background-color: #f3ede1 !important;
  border-radius: 2px;
}

/* ---- Form fields: kill navy typed text + navy focus ring everywhere ---- */
/* Blocksy inputs rendered typed text and the "Default sorting" dropdown in a
   dark navy that vanished on our warm-dark background. Force light ink via
   colour AND -webkit-text-fill-color (Safari/Chrome need the latter). */
body:not(.aor-home) input:not([type="submit"]):not([type="button"]):not([type="checkbox"]):not([type="radio"]):not([type="range"]),
body:not(.aor-home) textarea,
body:not(.aor-home) select,
html body .woocommerce .woocommerce-ordering select {
  color: var(--aor-ink) !important;
  -webkit-text-fill-color: var(--aor-ink) !important;
  background-color: var(--aor-card, #241d15) !important;
  border: 1px solid var(--aor-line, #3c3124) !important;
  border-radius: 2px !important;
}
body:not(.aor-home) select option,
html body .woocommerce .woocommerce-ordering select option {
  color: var(--aor-ink) !important;
  -webkit-text-fill-color: var(--aor-ink) !important;
  background-color: #241d15 !important;
}
body:not(.aor-home) input::placeholder,
body:not(.aor-home) textarea::placeholder {
  color: var(--aor-ink-faint, #847763) !important;
  -webkit-text-fill-color: var(--aor-ink-faint, #847763) !important;
  opacity: 1;
}
body:not(.aor-home) input:not([type="submit"]):not([type="button"]):focus,
body:not(.aor-home) textarea:focus,
body:not(.aor-home) select:focus {
  border-color: var(--aor-gold) !important;
  box-shadow: 0 0 0 1px var(--aor-gold) !important;
  outline: none !important;
}
