/* CHITRASAAZ display fixes — for the current chitrasaaz 1.0.5 theme.
   Paste into Appearance > Customize > Additional CSS, or install the companion plugin.
   Fixes the theme's .wp-custom-logo img selector affecting every image on the page. */
body.wp-custom-logo main img,
body main img:not(.custom-logo):not(.emoji):not(.wp-smiley) {
  display: block !important;
  width: 100% !important;
  height: auto !important;
  max-width: 100% !important;
  max-height: none !important;
  object-fit: contain !important;
  object-position: center !important;
  margin: 0 auto !important;
}
/* Fill artwork frames while preserving the complete painting. */
body main [class*="aspect-"] > img {
  width: 100% !important;
  height: 100% !important;
  max-height: none !important;
  object-fit: contain !important;
}
/* Give the hero and artist photographs a real image area. */
#hero .gold-filigree-border,
#artist-provenance .atelier-matting > .relative {
  aspect-ratio: 4 / 3;
}
body #hero .gold-filigree-border > img,
body #artist-provenance .atelier-matting > .relative > img {
  width: 100% !important;
  height: 100% !important;
  object-fit: contain !important;
}
#hero .gold-filigree-border > .absolute { z-index: 2; }
#artist-provenance .atelier-matting > .relative > .absolute {
  background: linear-gradient(transparent, rgba(0,0,0,.78)) !important;
  color: #fff !important;
  padding: 24px 16px 14px;
}
/* Centre the brand independently of the widths of the menu and enquiry button. */
body > header > div {
  display: grid !important;
  grid-template-columns: minmax(0,1fr) auto minmax(0,1fr);
  min-height: 96px;
  height: auto !important;
  position: relative;
}
body > header > div > button { grid-column: 1; grid-row: 1; justify-self: start; }
body header a[title="CHITRASAAZ"]:not(:has(img)) { display: none !important; }
body > header > div > a[title="CHITRASAAZ"]:not(:empty),
body > header > div > .chitrasaaz-custom-logo-container {
  grid-column: 2;
  grid-row: 1;
  justify-self: center;
}
body > header > div > a[href*="wa.me"] {
  grid-column: 3;
  grid-row: 1;
  justify-self: end;
}
body header .chitrasaaz-custom-logo-container,
body header .custom-logo-link {
  max-height: none !important;
  overflow: visible !important;
  margin: 0 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
}
body header img.custom-logo {
  width: 76px !important;
  height: 76px !important;
  max-width: 76px !important;
  max-height: 76px !important;
  object-fit: contain !important;
}
body > main { padding-top: 96px !important; }
/* Readable text on the filled teal buttons, including their nested labels. */
body main a.bg-primary,
body main button.bg-primary,
body main a.bg-primary *,
body main button.bg-primary *,
body main a.bg-primary-container,
body main button.bg-primary-container,
body main a.bg-primary-container *,
body main button.bg-primary-container * {
  color: #fff !important;
}
body main a.bg-primary:hover,
body main button.bg-primary:hover { background-color: #003d3b !important; }
body main .bg-primary-container h3,
body main .bg-primary-container p,
body main .bg-primary-container a { color: #fff !important; }
/* Use the actual uploaded brand logo in place of the footer's generic CZ icon.
   The plugin dynamically supplies this URL from WordPress's selected logo. */
#concierge-footer .md\:col-span-5 > a:first-child > svg { display: none !important; }
#concierge-footer .md\:col-span-5 > a:first-child::before {
  content: "";
  display: block;
  flex: 0 0 76px;
  width: 76px;
  height: 76px;
  background: var(--cs-footer-logo, url("/wp-content/uploads/2026/09/cropped-FINAL-CHITRASAAZ-LOGO.png")) center / contain no-repeat;
}
#concierge-footer .md\:col-span-5 > a:first-child { align-items: center; }
@media (max-width: 640px) {
  body > header > div { min-height: 80px; padding-inline: 16px !important; }
  body header img.custom-logo {
    width: 62px !important; height: 62px !important;
    max-width: 62px !important; max-height: 62px !important;
  }
  body > main { padding-top: 80px !important; }
  #hero .gold-filigree-border > .absolute { font-size: 9px; max-width: calc(100% - 16px); }
  #concierge-footer .md\:col-span-5 > a:first-child::before { flex-basis: 64px; width: 64px; height: 64px; }
}