/*
 * Creative Oasis Frontend Consolidated
 * Consolidates:
 * - Footer Polish
 * - Icon Polish
 * - 3D Print Button Cleanup
 * - Letter Builder Icon Background Fix
 */

/* =========================================================
   GLOBAL BRAND VARIABLES
   ========================================================= */
:root {
  --co-ui-bg: #fffaf2;
  --co-ui-card: #ffffff;
  --co-ui-border: #d8d0c4;
  --co-ui-text: #2f241f;
  --co-ui-muted: #6f6159;
  --co-ui-accent: #0f7c82;
  --co-ui-green: #0a3b2b;
  --co-ui-walnut: #5a341f;

  --co-footer-bg: #211915;
  --co-footer-bg-2: #2a201b;
  --co-footer-text: #fff8ee;
  --co-footer-muted: #d7c5b3;
  --co-footer-soft: #bca692;
  --co-footer-heading: #f4d3a3;
  --co-footer-accent: #19b8b2;
  --co-footer-accent-2: #8de4df;
  --co-footer-line: rgba(255, 248, 238, .16);
}

/* =========================================================
   ICON POLISH
   ========================================================= */

/* Common small icon circles used in value/process cards */
.coip-badge-icon,
.coip-step-icon,
[class*="co-icon"],
[class*="badge-icon"],
[class*="step-icon"] {
  color: var(--co-ui-accent);
}

/* Improve weak utility icons without altering admin bar icons */
body:not(.wp-admin) header a[href*="cart"],
body:not(.wp-admin) header a[href*="wishlist"],
body:not(.wp-admin) header a[href*="favorite"],
body:not(.wp-admin) header button[class*="search"],
body:not(.wp-admin) header a[class*="search"] {
  color: var(--co-ui-green) !important;
}

/* Social glyph cleanup */
footer .coip-footer-social,
footer [class*="social"],
footer .social-icons {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

footer .coip-footer-social a,
footer [class*="social"] a,
footer .social-icons a {
  width: 36px;
  height: 36px;
  border-radius: 999px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: rgba(255,255,255,.10);
  color: #fff !important;
  text-decoration: none !important;
}

/* =========================================================
   FOOTER POLISH
   ========================================================= */

footer.co-footer-polished,
.co-rebuild-clean-footer,
.co-rebuild-footer,
.co-reset-footer,
.co-clean-footer,
footer:has(.co-footer-bottom-line) {
  width: min(1180px, calc(100% - 32px)) !important;
  margin: 42px auto 30px !important;
  padding: 38px 42px !important;
  border-radius: 22px !important;
  background:
    radial-gradient(circle at 8% 10%, rgba(25,184,178,.18), transparent 210px),
    linear-gradient(135deg, var(--co-footer-bg), var(--co-footer-bg-2)) !important;
  color: var(--co-footer-text) !important;
  box-shadow: 0 18px 44px rgba(47,36,31,.18) !important;
  border: 1px solid rgba(255,255,255,.08) !important;
  box-sizing: border-box !important;
}

footer.co-footer-polished {
  display: grid !important;
  grid-template-columns: minmax(260px, 1.25fr) repeat(3, minmax(130px, .62fr)) minmax(280px, 1.1fr) !important;
  gap: 34px !important;
  align-items: start !important;
}

footer.co-footer-polished > *,
.co-rebuild-clean-footer > *,
.co-rebuild-footer > * {
  color: var(--co-footer-text) !important;
}

footer.co-footer-polished img,
footer.co-footer-polished .custom-logo,
footer.co-footer-polished [class*="logo"] img {
  max-width: 210px !important;
  height: auto !important;
  display: block !important;
  margin-bottom: 16px !important;
}

footer.co-footer-polished strong:first-child,
footer.co-footer-polished .co-footer-brand-title,
.co-rebuild-clean-footer strong,
.co-rebuild-footer strong {
  color: var(--co-footer-text) !important;
  font-size: 18px !important;
  letter-spacing: .02em !important;
}

footer.co-footer-polished p,
footer.co-footer-polished span,
footer.co-footer-polished li,
footer.co-footer-polished div,
.co-rebuild-clean-footer span,
.co-rebuild-footer span {
  color: var(--co-footer-muted) !important;
  line-height: 1.55 !important;
}

footer.co-footer-polished h2,
footer.co-footer-polished h3,
footer.co-footer-polished h4,
footer.co-footer-polished .widget-title,
footer.co-footer-polished [class*="title"],
footer.co-footer-polished .co-footer-heading {
  color: var(--co-footer-heading) !important;
  font-size: 13px !important;
  font-weight: 900 !important;
  letter-spacing: .13em !important;
  text-transform: uppercase !important;
  margin: 0 0 14px !important;
}

footer.co-footer-polished a,
.co-rebuild-clean-footer a,
.co-rebuild-footer a {
  color: var(--co-footer-muted) !important;
  text-decoration: none !important;
  font-weight: 700 !important;
  transition: color .18s ease, transform .18s ease, opacity .18s ease !important;
}

footer.co-footer-polished a:hover,
.co-rebuild-clean-footer a:hover,
.co-rebuild-footer a:hover {
  color: var(--co-footer-accent-2) !important;
}

footer.co-footer-polished ul,
footer.co-footer-polished ol {
  list-style: none !important;
  padding: 0 !important;
  margin: 0 !important;
  display: grid !important;
  gap: 10px !important;
}

footer.co-footer-polished li {
  margin: 0 !important;
}

footer.co-footer-polished .co-footer-tagline,
footer.co-footer-polished .site-description,
footer.co-footer-polished p:first-of-type {
  color: var(--co-footer-text) !important;
  font-size: 16px !important;
  max-width: 310px !important;
  margin-top: 12px !important;
}

footer.co-footer-polished input[type="email"],
footer.co-footer-polished input[type="text"],
footer.co-footer-polished input[type="search"] {
  min-height: 48px !important;
  border-radius: 999px 0 0 999px !important;
  border: 1px solid rgba(255,255,255,.28) !important;
  border-right: 0 !important;
  background: rgba(255,255,255,.10) !important;
  color: var(--co-footer-text) !important;
  padding: 0 16px !important;
  outline: none !important;
  box-shadow: none !important;
}

footer.co-footer-polished input::placeholder {
  color: rgba(255,248,238,.70) !important;
  opacity: 1 !important;
}

footer.co-footer-polished button,
footer.co-footer-polished input[type="submit"],
footer.co-footer-polished .wp-block-button__link {
  min-height: 48px !important;
  border-radius: 0 999px 999px 0 !important;
  border: 1px solid rgba(25,184,178,.9) !important;
  background: linear-gradient(180deg, #137e79, #0d5f5b) !important;
  color: #fff !important;
  padding: 0 18px !important;
  font-weight: 900 !important;
  letter-spacing: .04em !important;
  box-shadow: none !important;
}

footer.co-footer-polished .co-footer-bottom-line {
  grid-column: 1 / -1 !important;
  margin-top: 6px !important;
  padding-top: 22px !important;
  border-top: 1px solid var(--co-footer-line) !important;
  display: flex !important;
  justify-content: space-between !important;
  gap: 16px !important;
  flex-wrap: wrap !important;
  color: var(--co-footer-soft) !important;
  font-size: 12px !important;
}

footer.co-footer-polished .co-footer-bottom-line a {
  color: var(--co-footer-soft) !important;
}

/* =========================================================
   3D PRINT PAGE BUTTON CLEANUP
   ========================================================= */

body.co-3d-print-cleanup main button,
body.co-3d-print-cleanup main .button,
body.co-3d-print-cleanup main [role="button"],
body.co-3d-print-cleanup main label,
body.co-3d-print-cleanup main .co-option,
body.co-3d-print-cleanup main .co-card,
body.co-3d-print-cleanup main .option-card,
body.co-3d-print-cleanup main .choice-card,
body.co-3d-print-cleanup main .select-card,
body.co-3d-print-cleanup main [class*="option-card"],
body.co-3d-print-cleanup main [class*="choice"],
body.co-3d-print-cleanup main [class*="select-card"],
body.co-3d-print-cleanup main [class*="item-type"],
body.co-3d-print-cleanup main [class*="type-card"],
body.co-3d-print-cleanup .entry-content button,
body.co-3d-print-cleanup .entry-content [role="button"],
body.co-3d-print-cleanup .entry-content label {
  background: var(--co-ui-card) !important;
  background-image: none !important;
  color: var(--co-ui-text) !important;
  border: 1px solid var(--co-ui-border) !important;
  box-shadow: 0 1px 2px rgba(47,36,31,.04) !important;
}

body.co-3d-print-cleanup main a[href*="cart"],
body.co-3d-print-cleanup main a[href*="quote"],
body.co-3d-print-cleanup main a[href*="custom"],
body.co-3d-print-cleanup main .single_add_to_cart_button,
body.co-3d-print-cleanup main .checkout-button,
body.co-3d-print-cleanup main button[type="submit"],
body.co-3d-print-cleanup main input[type="submit"] {
  background: var(--co-ui-accent) !important;
  border-color: var(--co-ui-accent) !important;
  color: #ffffff !important;
}

body.co-3d-print-cleanup main button *,
body.co-3d-print-cleanup main [role="button"] *,
body.co-3d-print-cleanup main label *,
body.co-3d-print-cleanup main .co-option *,
body.co-3d-print-cleanup main .option-card *,
body.co-3d-print-cleanup main .choice-card *,
body.co-3d-print-cleanup main [class*="item-type"] * {
  color: inherit !important;
}

body.co-3d-print-cleanup main button small,
body.co-3d-print-cleanup main [role="button"] small,
body.co-3d-print-cleanup main label small,
body.co-3d-print-cleanup main .co-option small,
body.co-3d-print-cleanup main .option-card small,
body.co-3d-print-cleanup main .choice-card small,
body.co-3d-print-cleanup main [class*="item-type"] small,
body.co-3d-print-cleanup main button p,
body.co-3d-print-cleanup main [role="button"] p,
body.co-3d-print-cleanup main label p {
  color: var(--co-ui-muted) !important;
}

body.co-3d-print-cleanup main button:hover,
body.co-3d-print-cleanup main [role="button"]:hover,
body.co-3d-print-cleanup main label:hover,
body.co-3d-print-cleanup main .co-option:hover,
body.co-3d-print-cleanup main .option-card:hover,
body.co-3d-print-cleanup main .choice-card:hover,
body.co-3d-print-cleanup main [class*="item-type"]:hover {
  border-color: #bda88e !important;
  box-shadow: 0 6px 18px rgba(47,36,31,.08) !important;
}

body.co-3d-print-cleanup main .selected,
body.co-3d-print-cleanup main .is-selected,
body.co-3d-print-cleanup main .active,
body.co-3d-print-cleanup main .is-active,
body.co-3d-print-cleanup main [aria-pressed="true"],
body.co-3d-print-cleanup main [aria-selected="true"],
body.co-3d-print-cleanup main input:checked + label,
body.co-3d-print-cleanup main input[type="radio"]:checked + label,
body.co-3d-print-cleanup main input[type="checkbox"]:checked + label {
  background: #eefafa !important;
  border-color: var(--co-ui-accent) !important;
  color: var(--co-ui-text) !important;
  box-shadow: 0 0 0 2px rgba(15,124,130,.14) !important;
}

/* =========================================================
   LETTER BUILDER ICON BACKGROUND FIX
   ========================================================= */

body.co-letter-builder-cleanup [class*="icon-picker"],
body.co-letter-builder-cleanup [class*="visual-icon-picker"],
body.co-letter-builder-cleanup [class*="icon-grid"] {
  --coip-card-bg: #ffffff;
  --coip-card-border: #d8d1c6;
  --coip-card-border-active: #0f7c82;
  --coip-card-text: #2f241f;
  --coip-card-muted: #6f6159;
}

body.co-letter-builder-cleanup [class*="icon-picker"] button,
body.co-letter-builder-cleanup [class*="icon-picker"] label,
body.co-letter-builder-cleanup [class*="icon-picker"] .icon-option,
body.co-letter-builder-cleanup [class*="icon-picker"] .icon-card,
body.co-letter-builder-cleanup [class*="icon-picker"] .visual-icon,
body.co-letter-builder-cleanup [class*="icon-picker"] .visual-icon-card,
body.co-letter-builder-cleanup [class*="icon-picker"] [class*="icon-item"],
body.co-letter-builder-cleanup [class*="visual-icon-picker"] button,
body.co-letter-builder-cleanup [class*="visual-icon-picker"] label,
body.co-letter-builder-cleanup [class*="visual-icon-picker"] .icon-option,
body.co-letter-builder-cleanup [class*="visual-icon-picker"] .icon-card,
body.co-letter-builder-cleanup [class*="visual-icon-picker"] [class*="icon-item"],
body.co-letter-builder-cleanup [class*="icon-grid"] button,
body.co-letter-builder-cleanup [class*="icon-grid"] label,
body.co-letter-builder-cleanup [class*="icon-grid"] .icon-option,
body.co-letter-builder-cleanup [class*="icon-grid"] .icon-card,
body.co-letter-builder-cleanup [class*="icon-grid"] [class*="icon-item"] {
  background: #fff !important;
  background-image: none !important;
  color: var(--coip-card-text) !important;
  border: 1px solid var(--coip-card-border) !important;
  box-shadow: 0 1px 2px rgba(47,36,31,.05) !important;
}

body.co-letter-builder-cleanup [class*="icon-picker"] .icon-thumb,
body.co-letter-builder-cleanup [class*="icon-picker"] .icon-preview,
body.co-letter-builder-cleanup [class*="icon-picker"] [class*="thumb"],
body.co-letter-builder-cleanup [class*="icon-picker"] [class*="preview"],
body.co-letter-builder-cleanup [class*="visual-icon-picker"] .icon-thumb,
body.co-letter-builder-cleanup [class*="visual-icon-picker"] .icon-preview,
body.co-letter-builder-cleanup [class*="visual-icon-picker"] [class*="thumb"],
body.co-letter-builder-cleanup [class*="visual-icon-picker"] [class*="preview"],
body.co-letter-builder-cleanup [class*="icon-grid"] .icon-thumb,
body.co-letter-builder-cleanup [class*="icon-grid"] .icon-preview,
body.co-letter-builder-cleanup [class*="icon-grid"] [class*="thumb"],
body.co-letter-builder-cleanup [class*="icon-grid"] [class*="preview"] {
  background: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
}

body.co-letter-builder-cleanup [class*="icon-picker"] img,
body.co-letter-builder-cleanup [class*="icon-picker"] svg,
body.co-letter-builder-cleanup [class*="visual-icon-picker"] img,
body.co-letter-builder-cleanup [class*="visual-icon-picker"] svg,
body.co-letter-builder-cleanup [class*="icon-grid"] img,
body.co-letter-builder-cleanup [class*="icon-grid"] svg {
  background: transparent !important;
  mix-blend-mode: multiply;
  max-width: 100%;
}

body.co-letter-builder-cleanup [class*="icon-picker"] .selected,
body.co-letter-builder-cleanup [class*="icon-picker"] .is-selected,
body.co-letter-builder-cleanup [class*="icon-picker"] [aria-pressed="true"],
body.co-letter-builder-cleanup [class*="icon-picker"] [aria-selected="true"],
body.co-letter-builder-cleanup [class*="icon-picker"] input:checked + label,
body.co-letter-builder-cleanup [class*="visual-icon-picker"] .selected,
body.co-letter-builder-cleanup [class*="visual-icon-picker"] .is-selected,
body.co-letter-builder-cleanup [class*="visual-icon-picker"] [aria-pressed="true"],
body.co-letter-builder-cleanup [class*="visual-icon-picker"] [aria-selected="true"],
body.co-letter-builder-cleanup [class*="visual-icon-picker"] input:checked + label,
body.co-letter-builder-cleanup [class*="icon-grid"] .selected,
body.co-letter-builder-cleanup [class*="icon-grid"] .is-selected,
body.co-letter-builder-cleanup [class*="icon-grid"] [aria-pressed="true"],
body.co-letter-builder-cleanup [class*="icon-grid"] [aria-selected="true"],
body.co-letter-builder-cleanup [class*="icon-grid"] input:checked + label {
  border-color: var(--coip-card-border-active) !important;
  box-shadow: 0 0 0 2px rgba(15,124,130,.15) !important;
  background: #fbfdfd !important;
}

/* =========================================================
   RESPONSIVE
   ========================================================= */
@media (max-width: 1050px) {
  footer.co-footer-polished {
    grid-template-columns: minmax(240px, 1.2fr) repeat(2, minmax(150px, .8fr)) !important;
  }
}

@media (max-width: 760px) {
  footer.co-footer-polished,
  .co-rebuild-clean-footer,
  .co-rebuild-footer {
    width: min(100% - 18px, 1180px) !important;
    padding: 28px 22px !important;
    grid-template-columns: 1fr !important;
    gap: 24px !important;
  }

  footer.co-footer-polished input[type="email"],
  footer.co-footer-polished input[type="text"],
  footer.co-footer-polished input[type="search"],
  footer.co-footer-polished button,
  footer.co-footer-polished input[type="submit"],
  footer.co-footer-polished .wp-block-button__link {
    width: 100% !important;
    border-radius: 999px !important;
    border: 1px solid rgba(255,255,255,.22) !important;
    margin-top: 8px !important;
  }

  footer.co-footer-polished .co-footer-bottom-line {
    display: grid !important;
  }

  body.co-3d-print-cleanup main button,
  body.co-3d-print-cleanup main [role="button"],
  body.co-3d-print-cleanup main label,
  body.co-3d-print-cleanup main .co-option,
  body.co-3d-print-cleanup main .option-card,
  body.co-3d-print-cleanup main .choice-card {
    min-height: 52px;
  }
}