/* ============================================================
   Svolder 2026 rebrand override
   Loads AFTER theme-style + theme-style-globals (see functions.php).
   Overrides the compiled Tailwind bundle's brand colors + fonts.
   Bump the version in functions.php and purge Kinsta cache after edits.
   ============================================================ */

:root{
  --brand-dark:   #174954; /* headings, brand surfaces, footer, links, icons */
  --brand-bg:     #D3DADD; /* light backgrounds, "blue bubble", table rows   */
  --brand-accent: #5B7E86; /* bullets, "red bubble", accents                 */
}

/* ---------- FONTS ----------
   Aptos is NOT free — supply licensed .woff2 files in /fonts/ before this
   takes effect (see notes). Until then, body falls back to a system sans. */
@font-face{
  font-family:"Aptos";
  src:url("fonts/Aptos-Regular.woff2") format("woff2");
  font-weight:400; font-style:normal; font-display:swap;
}
@font-face{
  font-family:"Aptos";
  src:url("fonts/Aptos-Bold.woff2") format("woff2");
  font-weight:700; font-style:normal; font-display:swap;
}

/* Body -> Aptos (cascades to nav, buttons, forms via inheritance) */
body{
  font-family:"Aptos", system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
}
/* All headings -> Georgia (brief: "All headings: Georgia") */
h1,h2,h3,h4,h5,h6,.font-serif{
  font-family:Georgia, "Times New Roman", Times, serif;
}

/* ---------- BRAND DARK  (#008195 -> #174954) ---------- */
*{outline-color:var(--brand-dark)}
h1,h2{color:var(--brand-dark)}

.text-cyan-700{color:var(--brand-dark)}
.bg-cyan-700{background-color:var(--brand-dark)}
.border-cyan-700{border-color:var(--brand-dark)}
.hover\:bg-cyan-700:hover{background-color:var(--brand-dark)}
.placeholder\:text-cyan-700::-moz-placeholder{color:var(--brand-dark)}
.placeholder\:text-cyan-700::placeholder{color:var(--brand-dark)}

.wp-block-separator{color:var(--brand-dark);border-color:var(--brand-dark)}
.nf-form-cont input[type=submit],
.nf-form-cont input[type=submit]:hover{background-color:var(--brand-dark)}
#c-p-bn,#s-all-bn{background-color:var(--brand-dark)}

/* Nav (compound selectors replicated so specificity matches the bundle) */
header .menu>li.is-active{color:var(--brand-dark)}
header .desktop-menu .menu .menu-item a{color:var(--brand-dark)}
header .mobile-menu .menu>li,
header .mobile-menu .menu>li a{color:var(--brand-dark)}

/* ---------- BACKGROUND  (#E5F2F4 -> #D3DADD) ---------- */
.bg-sky-100{background-color:var(--brand-bg)}
header .mobile-first-row-is-open{background-color:var(--brand-bg)}

/* All data tables: odd rows -> #D3DADD */
.mf-table tbody tr:nth-child(odd),
.wp-block-table tbody tr:nth-child(odd),
.quicktable tbody tr:nth-child(odd),
.datablock-widget tbody tr:nth-child(odd),
.page-template-stock-portfolio .mf-table tbody tr:nth-child(odd),
.page-template-stock-portfolio .wp-block-table tbody tr:nth-child(odd){
  background-color:var(--brand-bg);
}

/* ---------- ACCENT / BULLETS  (#5B7E86) ---------- */
li::marker{color:var(--brand-accent)}

/* ============================================================
   REVIEW BLOCK — sensible defaults, but eyeball these against the
   client's sketches (bubbles, report bars, governance circles).
   The old design had multiple teal/peach shades; collapsing them
   can drop contrast (e.g. a bar the same color as its background).
   ============================================================ */

/* "Red bubble" (NAV circle) peach family -> accent */
.bg-red-200,.bg-red-300{background-color:var(--brand-accent)}
.bg-red-50{
  background-color:var(--brand-bg);
}
.bg-red-50.relative .text-red-500{
  color:var(--brand-dark);
}

.bg-lime-50{
  background-color:var(--brand-bg);
}
.text-red-500{color:#ffffff}
.border-red-500{border-color:var(--brand-accent)}
header .desktop-menu .menu .menu-item a:hover{color:var(--brand-accent)}

/* Decorative teal family (charts / governance circles).
   Darker shade -> accent (stays visible on #D3DADD); lighter -> bg. */
.bg-slate-400{background-color:var(--brand-accent)}
.bg-slate-300,.bg-emerald-200{background-color:var(--brand-bg)}

.aspect-video .bg-emerald-200,
.aspect-video .bg-slate-300{
  background-color:var(--brand-accent);
}

/* --- Header logo sizing ---  */
header .desktop-first-row a.logo-link,
header .desktop-first-row-menu-backdrop a.logo-link{
  display: flex;
  align-items: center;
  height: 7.5rem;
}

header .desktop-first-row a.logo-link img,
header .desktop-first-row-menu-backdrop a.logo-link img{
  width: 17.5rem;
  height: auto;
  padding-top: 1.25rem;
}

.rounded-full.bg-red-200{ color:#ffffff; }
.rounded-full.bg-red-200 a,
.rounded-full.bg-red-200 button{ color:var(--brand-dark); }

.rounded-full.bg-red-200 a:hover,
.rounded-full.bg-red-200 button:hover{
  color:#ffffff;
}

section.bg-red-50,
.full-width.bg-red-50{ background-color:#ffffff; }

.full-width.bg-red-50 a.bg-white.rounded-3xl,
.full-width.bg-red-50 button.bg-white.rounded-3xl,
.full-width.bg-red-50 .release-list-more-button{
  background-color:var(--brand-accent);
  color:#ffffff;
}
.full-width.bg-red-50 a.bg-white.rounded-3xl:hover,
.full-width.bg-red-50 button.bg-white.rounded-3xl:hover,
.full-width.bg-red-50 .release-list-more-button:hover{
  background-color:var(--brand-dark);
  color:#ffffff;
}

.aspect-\[3\/2\].max-h-96.overflow-hidden{
  aspect-ratio:unset;
  max-height:unset;
}
.aspect-\[3\/2\].max-h-96.overflow-hidden > img{
  position:static;
  width:100%;
  height:auto;
  object-fit:contain;
}

@media (min-width:1024px){
  .grid.lg\:grid-cols-2.max-w-7xl.gap-x-7{
    grid-template-columns:1fr 3fr;
  }
}

.mf-table td.mf-tbl-col-3{ text-align:right !important; }

#datablock-stock-calculator .mf_input-wrapper input{
  background-color:var(--brand-accent);
  color: white;
}

@media (min-width:1024px){
  .grid.lg\:grid-cols-2.max-w-7xl.gap-x-7 > .px-8.py-12{
    display:flex;
    flex-direction:column;
    height:100%;
  }
  .grid.lg\:grid-cols-2.max-w-7xl.gap-x-7 > .px-8.py-12 > .text-right.mt-14{
    margin-top:auto;   /* pushes the button row to the bottom */
  }
}