/* ============================================================
   theme.css — Höganäsveterinären
   Kompakt Bootstrap 5.3-override. Endast variabler och
   komponentöverskrivningar — sektionsstilar hör hemma i custom.css.

   Format enligt Designmagic-export. Vill du regenerera i Designmagic:
   Base #005497 · Accent #1F5B45 · Warm #EFF2F5
   Headings Libre Franklin · Body Source Sans 3 · Radie 0.375rem
   ============================================================ */

:root {
  /* --- Färg ------------------------------------------------ */
  --bs-primary:        #005497;   /* logotypens blå, ur SVG-original */
  --bs-primary-rgb:    0, 84, 151;
  --bs-secondary:      #4E6883;
  --bs-success:        #1F5B45;
  --bs-body-color:     #16232E;
  --bs-body-bg:        #FFFFFF;
  --bs-emphasis-color: #0E1A23;
  --bs-border-color:   #D5DDE4;
  --bs-link-color:     #005497;
  --bs-link-hover-color: #003C6D;
  /* Bootstrap 5.3 renderar <a> via -rgb-varianterna, inte via --bs-link-color.
     Utan de här två raderna blir varje länk kvar i Bootstrap-blått. */
  --bs-link-color-rgb:       0, 84, 151;
  --bs-link-hover-color-rgb: 0, 60, 109;

  /* Gör Bootstraps subtila varianter till projektets ljusytor,
     så .bg-primary-subtle och .border-primary-subtle räcker i markupen */
  --bs-primary-bg-subtle:     #EFF2F5;
  --bs-primary-border-subtle: #D5DDE4;
  --bs-secondary-color:       #46586A;   /* .text-body-secondary */
  --bs-heading-color:         #0E1A23;

  /* --- Typografi ------------------------------------------- */
  --bs-font-sans-serif: "Source Sans 3", -apple-system, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  --bs-body-font-size:   1.125rem;   /* 18px — målgruppen läser hellre stort */
  --bs-body-line-height: 1.65;
  --bs-body-font-weight: 400;

  /* --- Form ------------------------------------------------ */
  --bs-border-radius:    .375rem;
  --bs-border-radius-lg: .5rem;
}

/* --- Rubriker ---------------------------------------------- */
h1, h2, h3, h4, h5, h6,
.h1, .h2, .h3, .h4, .h5, .h6 {
  font-family: "Libre Franklin", var(--bs-font-sans-serif);
  font-weight: 700;
  line-height: 1.15;
  letter-spacing: -.015em;
  text-wrap: balance;
}

h1, .h1 { font-size: clamp(2rem, 1.4rem + 2.4vw, 3rem); }
h2, .h2 { font-size: clamp(1.5rem, 1.2rem + 1.2vw, 2.125rem); }
h3, .h3 { font-size: 1.3125rem; }

/* --- Knappar ----------------------------------------------- */
.btn {
  font-family: "Libre Franklin", var(--bs-font-sans-serif);
  font-weight: 600;
  letter-spacing: .01em;
  padding-inline: 1.25rem;
}

.btn-primary {
  --bs-btn-bg: #005497;
  --bs-btn-border-color: #005497;
  --bs-btn-hover-bg: #003C6D;
  --bs-btn-hover-border-color: #003C6D;
  --bs-btn-active-bg: #002E54;
  --bs-btn-active-border-color: #002E54;
}

.btn-outline-primary {
  --bs-btn-color: #005497;
  --bs-btn-border-color: #005497;
  --bs-btn-hover-bg: #005497;
  --bs-btn-hover-border-color: #005497;
}

.btn-light {
  --bs-btn-bg: #FFFFFF;
  --bs-btn-color: #005497;
  --bs-btn-border-color: #FFFFFF;
  --bs-btn-hover-bg: #EFF2F5;
  --bs-btn-hover-color: #003C6D;
  --bs-btn-hover-border-color: #EFF2F5;
}

/* --- Navbar ------------------------------------------------ */
.navbar {
  --bs-navbar-font-family: "Libre Franklin", sans-serif;
  --bs-navbar-active-color: #005497;
  padding-block: .5rem;
}

.navbar-nav .nav-link {
  font-family: "Libre Franklin", var(--bs-font-sans-serif);
  font-weight: 600;
  font-size: 1rem;
  padding-inline: .85rem;
}

/* --- Fokus (tillgänglighet) -------------------------------- */
:focus-visible {
  outline: 3px solid #005497;
  outline-offset: 2px;
  border-radius: 2px;
}

.bg-primary  { background-color: #005497 !important; }
.text-primary { color: #005497 !important; }