/*
Theme Name: Divine Publications
Theme URI: https://divinepublication.com
Description: Kadence child theme for Divine Publications.
Author: Divine Publications
Template: kadence
Version: 1.0.0
Text Domain: dp-child
*/

@font-face { font-family: 'Yatra One'; font-style: normal; font-weight: 400; src: url('fonts/yatra400.woff2') format('woff2'); font-display: swap; }
@font-face { font-family: 'Baloo 2'; font-style: normal; font-weight: 600; src: url('fonts/baloo600.woff2') format('woff2'); font-display: swap; }
@font-face { font-family: 'Baloo 2'; font-style: normal; font-weight: 700; src: url('fonts/baloo700.woff2') format('woff2'); font-display: swap; }
@font-face { font-family: 'Karla'; font-style: normal; font-weight: 400; src: url('fonts/karla400.woff2') format('woff2'); font-display: swap; }
@font-face { font-family: 'Karla'; font-style: normal; font-weight: 600; src: url('fonts/karla600.woff2') format('woff2'); font-display: swap; }

:root {
  --dp-cream-50: #FBF2E3;
  --dp-cream-100: #F3E3C9;
  --dp-ink-900: #2B1712;
  --dp-ink-600: #6E5647;
  --dp-maroon-700: #6B1620;
  --dp-maroon-600: #A7292A;
  --dp-gold-500: #FFED00;
  --dp-gold-700: #A87A0A;
  --dp-peacock-600: #0E6E64;
  --dp-peacock-700: #0A4F48;
  --dp-border: rgba(43,23,18,0.14);
  --dp-radius-card: 14px;
}

/* sitewide brand touches, applied on top of Kadence's own layout */
body {
  font-family: 'Karla', sans-serif;
  color: var(--dp-ink-900);
  background: var(--dp-cream-50);
}
/* Kadence's #wrapper hardcodes a white background that sits on top of body,
   covering our cream everywhere a specific element doesn't already fill the space */
#wrapper { background: transparent !important; }
h1, h2, h3, h4, h5, h6,
.entry-title, .page-title, .woocommerce-loop-product__title, .product_title {
  font-family: 'Baloo 2', sans-serif;
  font-weight: 700;
  color: var(--dp-ink-900);
}
a { color: var(--dp-maroon-600); }
a:hover { color: var(--dp-maroon-700); }

.button, button, input[type="submit"],
.woocommerce a.button, .woocommerce button.button, .woocommerce input.button,
.woocommerce #respond input#submit, .woocommerce-page a.button,
.single_add_to_cart_button {
  font-family: 'Baloo 2', sans-serif !important;
  font-weight: 600 !important;
  background: var(--dp-maroon-600) !important;
  color: var(--dp-gold-500) !important;
  border-radius: 999px !important;
  border: 1px solid var(--dp-maroon-600) !important;
}
.button:hover, button:hover, input[type="submit"]:hover,
.woocommerce a.button:hover, .woocommerce button.button:hover,
.single_add_to_cart_button:hover {
  background: var(--dp-maroon-700) !important;
  border-color: var(--dp-maroon-700) !important;
}
.woocommerce ul.products li.product .price ins,
.woocommerce span.price ins { color: var(--dp-gold-700); text-decoration: none; }
.woocommerce ul.products li.product .price del { color: var(--dp-ink-600); opacity: 1; }

* { box-sizing: border-box; }
@media (prefers-reduced-motion: reduce) { *, *::before, *::after { animation-duration: 0.001ms !important; transition-duration: 0.001ms !important; } }

.dp-wrap { max-width: 1180px; margin: 0 auto; padding: 0 clamp(16px, 4vw, 40px); }

.dp-eyebrow {
  font-family: 'Karla', sans-serif; font-weight: 600; font-size: 0.72rem; letter-spacing: 0.14em;
  text-transform: uppercase; color: var(--dp-peacock-600);
  display: inline-flex; align-items: center; gap: 10px;
}
.dp-eyebrow::after { content: ""; width: 28px; height: 2px; background: var(--dp-peacock-600); display: inline-block; }

/* custom header (replaces Kadence default header markup) */
.dp-header { position: sticky; top: 0; z-index: 20; background: var(--dp-cream-50); border-bottom: 1px solid var(--dp-border); }
.dp-header-inner { display: flex; align-items: center; justify-content: space-between; gap: 20px; padding: 14px clamp(16px, 4vw, 40px); max-width: 1180px; margin: 0 auto; }
.dp-brand { display: flex; align-items: center; gap: 12px; text-decoration: none; }
.dp-brand-mark { width: 44px; height: 44px; border-radius: 50%; background: var(--dp-maroon-600); display: flex; align-items: center; justify-content: center; flex: none; }
.dp-brand-mark span { font-family: 'Baloo 2', sans-serif; font-weight: 700; color: var(--dp-gold-500); font-size: 1.1rem; }
.dp-brand-text { display: flex; flex-direction: column; gap: 2px; }
.dp-brand-name { font-family: 'Baloo 2', sans-serif; font-weight: 700; font-size: 1.05rem; color: var(--dp-maroon-700); letter-spacing: 0.01em; }
.dp-brand-tag { font-size: 0.66rem; letter-spacing: 0.08em; text-transform: uppercase; color: var(--dp-ink-600); font-weight: 600; }

.dp-nav { display: flex; align-items: center; gap: clamp(14px, 3vw, 28px); }
.dp-nav a { font-family: 'Baloo 2', sans-serif; font-weight: 600; font-size: 0.95rem; text-decoration: none; color: var(--dp-ink-900); }
.dp-nav a:hover { color: var(--dp-maroon-600); }

.dp-header-actions { display: flex; align-items: center; gap: 14px; }
.dp-cart-link { position: relative; display: inline-flex; align-items: center; justify-content: center; width: 38px; height: 38px; border-radius: 50%; border: 1.5px solid var(--dp-border); text-decoration: none; color: var(--dp-ink-900); flex: none; }
.dp-cart-link:hover { border-color: var(--dp-maroon-600); color: var(--dp-maroon-600); }
.dp-cart-count { position: absolute; top: -4px; right: -4px; min-width: 17px; height: 17px; padding: 0 3px; border-radius: 999px; background: var(--dp-maroon-600); color: var(--dp-gold-500); font-family: 'Karla', sans-serif; font-weight: 600; font-size: 0.62rem; display: flex; align-items: center; justify-content: center; }

.dp-cta {
  font-family: 'Baloo 2', sans-serif; font-weight: 600; font-size: 0.9rem;
  background: var(--dp-maroon-600); color: var(--dp-gold-500);
  padding: 10px 20px; border-radius: 999px; text-decoration: none;
  border: 1px solid var(--dp-maroon-600); white-space: nowrap;
}
.dp-cta:hover { background: var(--dp-maroon-700); color: var(--dp-gold-500); }

/* hero */
.dp-hero { padding: clamp(48px, 8vw, 88px) 0 clamp(56px, 8vw, 96px); }
.dp-hero-grid { display: grid; grid-template-columns: 1.05fr 0.85fr; gap: clamp(32px, 6vw, 72px); align-items: center; }
.dp-hero-title {
  font-family: 'Yatra One', cursive; font-weight: 400; font-size: clamp(2.2rem, 4.6vw, 3.4rem);
  line-height: 1.18; color: var(--dp-maroon-700); margin: 18px 0 20px; text-wrap: balance;
}
.dp-hero-sub { font-size: 1.05rem; color: var(--dp-ink-600); max-width: 46ch; margin: 0 0 28px; }
.dp-hero-actions { display: flex; align-items: center; gap: 20px; flex-wrap: wrap; }
.dp-btn-primary {
  font-family: 'Baloo 2', sans-serif; font-weight: 600; font-size: 1rem;
  background: var(--dp-maroon-600); color: var(--dp-gold-500);
  padding: 14px 30px; border-radius: 999px; text-decoration: none; display: inline-block;
  border: 1px solid var(--dp-maroon-600);
}
.dp-btn-primary:hover { background: var(--dp-maroon-700); color: var(--dp-gold-500); }
.dp-hero-facts { display: grid; grid-template-columns: repeat(3, minmax(0, auto)); gap: clamp(14px, 3vw, 32px); margin-top: 36px; max-width: 100%; }
.dp-hero-fact { font-family: 'Karla', sans-serif; }
.dp-hero-fact b { display: block; font-family: 'Baloo 2', sans-serif; font-weight: 700; font-size: 1.3rem; color: var(--dp-maroon-600); }
.dp-hero-fact span { display: block; font-size: 0.78rem; color: var(--dp-ink-600); text-transform: uppercase; letter-spacing: 0.06em; }

.dp-hero-art { display: flex; justify-content: center; padding: 20px; }
.dp-hero-art-stack { position: relative; width: min(320px, 100%); aspect-ratio: 3 / 4; }
.dp-hero-art-ring { position: absolute; inset: 0; background: var(--dp-peacock-600); border-radius: 50% 50% 10px 10px; transform: translate(16px, 16px); }
.dp-hero-art-frame { position: absolute; inset: 0; border-radius: 50% 50% 10px 10px; overflow: hidden; border: 6px solid var(--dp-gold-500); }
.dp-hero-art-frame img { width: 100%; height: 100%; object-fit: cover; }

/* shop / shelves */
.dp-shelf { padding: clamp(40px, 6vw, 64px) 0; border-top: 1px solid var(--dp-border); }
.dp-shelf-head { display: flex; justify-content: space-between; align-items: flex-end; gap: 24px; margin-bottom: 26px; flex-wrap: wrap; }
.dp-shelf-title { font-family: 'Baloo 2', sans-serif; font-weight: 700; font-size: 1.7rem; color: var(--dp-ink-900); margin: 10px 0 8px; }
.dp-shelf-desc { color: var(--dp-ink-600); max-width: 56ch; margin: 0; font-size: 0.96rem; }

.dp-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(210px, 1fr)); gap: 20px; }
.dp-card { background: var(--dp-cream-100); border: 1px solid var(--dp-border); border-radius: var(--dp-radius-card); padding: 14px 14px 18px; display: flex; flex-direction: column; gap: 10px; }
.dp-card-img { position: relative; width: 100%; aspect-ratio: 3 / 4; border-radius: 10px; overflow: hidden; background: var(--dp-cream-50); }
.dp-card-img img { width: 100%; height: 100%; object-fit: cover; }
.dp-card-tag { position: absolute; top: 10px; left: 10px; font-family: 'Karla', sans-serif; font-weight: 600; font-size: 0.66rem; letter-spacing: 0.06em; text-transform: uppercase; background: rgba(251,242,227,0.92); color: var(--dp-peacock-700); padding: 4px 9px; border-radius: 999px; }
.dp-card-title { font-family: 'Baloo 2', sans-serif; font-weight: 600; font-size: 1rem; margin: 2px 0 0; line-height: 1.35; }
.dp-card-title a { color: inherit; text-decoration: none; }
.dp-card-price { display: flex; align-items: baseline; gap: 8px; font-family: 'Karla', sans-serif; }
.dp-card-price .now { font-weight: 600; font-size: 1.08rem; color: var(--dp-gold-700); }
.dp-card-price .was { font-size: 0.85rem; color: var(--dp-ink-600); text-decoration: line-through; }
.dp-card-btn {
  margin-top: auto; font-family: 'Baloo 2', sans-serif !important; font-weight: 600 !important; font-size: 0.88rem !important;
  background: transparent !important; color: var(--dp-maroon-600) !important; border: 1.5px solid var(--dp-maroon-600) !important;
  padding: 9px 14px !important; border-radius: 999px !important; cursor: pointer; text-align: center; text-decoration: none;
}
.dp-card-btn:hover { background: var(--dp-maroon-600) !important; color: var(--dp-gold-500) !important; }
.dp-card-btn.loading { opacity: 0.6; }
.dp-card-ghost { border: 1.5px dashed var(--dp-border); border-radius: var(--dp-radius-card); display: flex; align-items: center; justify-content: center; text-align: center; padding: 20px; color: var(--dp-ink-600); font-size: 0.9rem; min-height: 200px; }

/* trust strip */
.dp-trust { background: var(--dp-maroon-600); color: var(--dp-cream-50); padding: 22px 0; }
.dp-trust-inner { display: flex; justify-content: center; gap: clamp(20px, 5vw, 56px); flex-wrap: wrap; text-align: center; }
.dp-trust-item { font-family: 'Karla', sans-serif; font-weight: 600; font-size: 0.88rem; letter-spacing: 0.02em; color: var(--dp-cream-50); }

/* custom footer (replaces Kadence default footer markup) */
.dp-footer { background: var(--dp-ink-900); color: var(--dp-cream-100); border-top: 3px solid var(--dp-gold-500); padding: clamp(40px, 6vw, 64px) 0 28px; }
.dp-footer-grid { display: grid; grid-template-columns: 1.3fr 1fr 1.3fr 1.2fr; gap: 32px; }
.dp-footer h4 { font-family: 'Baloo 2', sans-serif; font-weight: 600; font-size: 0.95rem; color: var(--dp-gold-500); margin: 0 0 14px; }
.dp-footer p { color: var(--dp-cream-100); opacity: 0.85; font-size: 0.9rem; margin: 0 0 14px; max-width: 32ch; }
.dp-footer ul { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 10px; }
.dp-footer a { text-decoration: none; font-size: 0.9rem; color: var(--dp-cream-100); opacity: 0.85; }
.dp-footer a:hover { opacity: 1; text-decoration: underline; color: var(--dp-cream-100); }
.dp-footer-sub { display: flex; gap: 8px; }
.dp-footer-sub input { flex: 1; min-width: 0; padding: 10px 12px; border-radius: 8px; border: 1px solid rgba(251,242,227,0.25); background: rgba(251,242,227,0.06); color: var(--dp-cream-50); font-family: 'Karla', sans-serif; font-size: 0.88rem; }
.dp-footer-sub input::placeholder { color: rgba(251,242,227,0.5); }
.dp-footer-sub button { font-family: 'Baloo 2', sans-serif !important; font-weight: 600 !important; font-size: 0.85rem !important; background: var(--dp-gold-500) !important; color: var(--dp-maroon-700) !important; border: none !important; border-radius: 8px !important; padding: 0 16px !important; }
.dp-footer-bottom { max-width: 1180px; margin: 36px auto 0; padding: 20px clamp(16px, 4vw, 40px) 0; border-top: 1px solid rgba(251,242,227,0.14); font-size: 0.8rem; color: rgba(251,242,227,0.6); }

@media (max-width: 860px) {
  .dp-hero-grid { grid-template-columns: 1fr; }
  .dp-hero-art { order: -1; }
  .dp-nav { display: none; }
  .dp-footer-grid { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 520px) {
  .dp-footer-grid { grid-template-columns: 1fr; }
}

/* ==========================================================================
   Shop archive + single product pages
   Kadence's .content-bg hardcodes background:#fff on every product card and
   the product detail box; swap it for our cream card tone so it matches the
   homepage instead of sitting on the page like a foreign white panel.
   ========================================================================== */
.content-bg { background: var(--dp-cream-100) !important; }
.content-bg .content-bg:not(.loop-entry) { background: transparent !important; }
/* On the single product page, the big outer wrapper (image+summary together)
   doesn't need its own card shade on top of the page background — the gallery
   frame and description tabs below already have their own deliberate card treatment */
.single-product .content-bg.entry-content-wrap { background: transparent !important; }

.woocommerce ul.products li.product { border-radius: var(--dp-radius-card); overflow: hidden; }
.woocommerce ul.products li.product .woocommerce-loop-product__title,
.woocommerce ul.products li.product .price { padding-left: 1rem; padding-right: 1rem; }

.single-product .entry-summary .product_title { margin-top: 0; }
.single-product .woocommerce-product-gallery,
.single-product .woocommerce-product-gallery__wrapper,
.single-product .woocommerce-product-gallery__image,
.single-product .woocommerce-product-gallery__image img,
.single-product div.images {
  background: var(--dp-cream-100) !important;
}
.single-product .woocommerce-product-gallery {
  border-radius: var(--dp-radius-card);
  overflow: hidden;
  border: 1px solid var(--dp-border);
}
/* Kadence's sale badge reads --global-palette-highlight (blue by default) — override to brand maroon/gold */
.onsale {
  background-color: var(--dp-maroon-600) !important;
  color: var(--dp-gold-500) !important;
  font-family: 'Baloo 2', sans-serif !important;
}
.single-product .price { font-family: 'Karla', sans-serif; font-size: 1.3rem; }
.single-product .quantity .qty {
  border: 1.5px solid var(--dp-border) !important;
  border-radius: 8px !important;
  font-family: 'Karla', sans-serif;
  padding: 8px 10px !important;
}
.single-product .tabs.wc-tabs { border-bottom: 1px solid var(--dp-border); }
.single-product .tabs.wc-tabs li { background: transparent !important; border: none !important; }
.single-product .tabs.wc-tabs li a {
  font-family: 'Baloo 2', sans-serif;
  font-weight: 600;
  color: var(--dp-ink-600);
}
.single-product .tabs.wc-tabs li.active a { color: var(--dp-maroon-600) !important; }
.single-product .woocommerce-Tabs-panel { background: transparent; padding: 1.5rem 0; }
.related.products { border-top: 1px solid var(--dp-border); padding-top: 2rem; margin-top: 2rem; }

/* Archive/page title banner (Shop, category pages, and any default Kadence
   page like About Us) — Kadence hardcodes a cold blue-gray here by default */
.entry-hero-container-inner { background: var(--dp-cream-100) !important; }
.page-title.archive-title,
.page-title.entry-title {
  font-family: 'Yatra One', cursive !important;
  font-weight: 400 !important;
  color: var(--dp-maroon-700) !important;
}

/* ==========================================================================
   My Account page (rendered by page-account.php, bypassing the page's old
   Elementor layout entirely)
   ========================================================================== */
#dp-account { padding: clamp(40px, 6vw, 64px) 0; }
.dp-account-wrap .woocommerce-notices-wrapper:empty { display: none; }
.dp-account-wrap .woocommerce-form-login,
.dp-account-wrap .woocommerce-form-register {
  background: var(--dp-cream-100);
  border: 1px solid var(--dp-border);
  border-radius: var(--dp-radius-card);
  padding: 1.75rem;
}
.dp-account-wrap .u-columns.col2-set { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; }
.dp-account-wrap .u-columns.col2-set .u-column1,
.dp-account-wrap .u-columns.col2-set .u-column2 { float: none; width: auto; }
/* Pin explicitly — something in this stack (likely a GTranslate/Kadence
   interaction) was placing these in reverse visual order despite normal
   DOM order, no RTL, and no order/transform on any ancestor */
.dp-account-wrap .u-columns.col2-set .u-column1 { grid-column: 1; grid-row: 1; }
.dp-account-wrap .u-columns.col2-set .u-column2 { grid-column: 2; grid-row: 1; }
@media (max-width: 700px) {
  .dp-account-wrap .u-columns.col2-set .u-column1,
  .dp-account-wrap .u-columns.col2-set .u-column2 { grid-column: 1; }
}
@media (max-width: 700px) {
  .dp-account-wrap .u-columns.col2-set { grid-template-columns: 1fr; }
}
.dp-account-wrap .woocommerce-Input.input-text {
  border: 1.5px solid var(--dp-border) !important;
  border-radius: 8px !important;
  font-family: 'Karla', sans-serif;
  padding: 10px 12px !important;
  width: 100%;
}
.dp-account-wrap .nsl-container { margin-top: 1rem; }

/* logged-in account dashboard: two-column layout (nav rail + content).
   Scoped with :has() to the nav actually being present — otherwise this
   same rule also matched the logged-out login/register screen, squeezing
   the login form into the 220px track meant for the sidebar. */
.woocommerce-account .woocommerce:has(.woocommerce-MyAccount-navigation) {
  display: grid;
  grid-template-columns: 220px 1fr;
  gap: 28px;
  align-items: start;
}
.woocommerce-account .woocommerce-MyAccount-navigation ul {
  list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 2px;
  background: var(--dp-cream-100); border: 1px solid var(--dp-border); border-radius: var(--dp-radius-card); padding: 8px;
}
.woocommerce-account .woocommerce-MyAccount-navigation li a {
  display: flex; align-items: center; gap: 10px;
  font-family: 'Baloo 2', sans-serif; font-weight: 600; font-size: 0.9rem;
  padding: 10px 12px; border-radius: 8px; text-decoration: none; color: var(--dp-ink-900);
  border-left: 3px solid transparent;
}
.woocommerce-account .woocommerce-MyAccount-navigation li a svg { flex: none; opacity: 0.75; }
.woocommerce-account .woocommerce-MyAccount-navigation li a:hover { background: var(--dp-cream-50); }
.woocommerce-account .woocommerce-MyAccount-navigation li.is-active a {
  background: var(--dp-cream-50); color: var(--dp-maroon-600); border-left-color: var(--dp-maroon-600);
}
.woocommerce-account .woocommerce-MyAccount-navigation li.is-active a svg { opacity: 1; }
.woocommerce-account .woocommerce-MyAccount-content { min-width: 0; }
.woocommerce-orders-table th { font-family: 'Baloo 2', sans-serif; }
.woocommerce-orders-table .button { font-size: 0.82rem !important; padding: 6px 12px !important; }

@media (max-width: 780px) {
  .woocommerce-account .woocommerce { grid-template-columns: 1fr; }
  .woocommerce-account .woocommerce-MyAccount-navigation ul { flex-direction: row; flex-wrap: wrap; }
}

/* account dashboard: greeting, last-order strip, card grid */
.dp-account-greeting { margin-bottom: 1.25rem; }
.dp-account-greeting h2 { font-size: 1.35rem; margin: 0 0 4px; }
.dp-account-greeting p { color: var(--dp-ink-600); margin: 0; }

.dp-account-lastorder {
  display: flex; align-items: center; justify-content: space-between; gap: 16px; flex-wrap: wrap;
  background: var(--dp-maroon-600); color: var(--dp-cream-50); text-decoration: none;
  border-radius: var(--dp-radius-card); padding: 1rem 1.25rem; margin-bottom: 1.25rem;
}
.dp-account-lastorder-label { display: block; font-family: 'Baloo 2', sans-serif; font-weight: 600; }
.dp-account-lastorder-meta { display: block; font-size: 0.85rem; opacity: 0.85; margin-top: 2px; }
.dp-account-lastorder-cta { font-family: 'Baloo 2', sans-serif; font-weight: 600; color: var(--dp-gold-500); white-space: nowrap; }

.dp-account-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 16px; }
.dp-account-card {
  display: flex; flex-direction: column; gap: 8px; text-decoration: none; color: var(--dp-ink-900);
  background: var(--dp-cream-100); border: 1px solid var(--dp-border); border-radius: var(--dp-radius-card);
  padding: 1.25rem;
}
.dp-account-card:hover { border-color: var(--dp-maroon-600); }
.dp-account-card-icon {
  width: 40px; height: 40px; border-radius: 50%; background: var(--dp-cream-50);
  display: flex; align-items: center; justify-content: center; color: var(--dp-maroon-600);
}
.dp-account-card-title { font-family: 'Baloo 2', sans-serif; font-weight: 600; font-size: 1rem; }
.dp-account-card-desc { font-size: 0.85rem; color: var(--dp-ink-600); }
