/* ==========================================================================
   BookingsMed — Design tokens
   Prima cărămidă din noul design system. Valorile de culoare sunt extrase
   direct din mockup, nu aproximate.
   Se include o singură dată, înaintea oricărui CSS de pagină (bm-*.css).
   ========================================================================== */

:root {
  /* --- Brand ------------------------------------------------------------ */
  --bm-teal-50:  #E6F6F8;
  --bm-teal-100: #CCEDF1;
  --bm-teal-300: #66CBD4;
  --bm-teal-500: #00A8B5;   /* accent principal: butoane, linkuri, iconuri */
  --bm-teal-600: #008E99;   /* hover */
  --bm-teal-700: #00757E;   /* active */

  --bm-navy-500: #0B4A82;
  --bm-navy-700: #06386B;   /* footer, titluri de secțiune */
  --bm-navy-900: #052A52;

  /* --- Neutre ----------------------------------------------------------- */
  --bm-ink-900:  #0C2340;   /* titluri */
  --bm-ink-700:  #33465F;   /* text principal */
  --bm-ink-500:  #5A6B82;   /* text secundar */
  --bm-ink-400:  #8A99AC;   /* placeholder */
  --bm-line:     #DCE5EE;   /* borduri */
  --bm-line-soft:#EDF2F7;
  --bm-surface:  #FFFFFF;
  --bm-sky-50:   #E7F4FD;   /* banda deschisă din hero */
  --bm-sky-100:  #D6EBFA;

  /* --- Semantice -------------------------------------------------------- */
  --bm-danger:      #D93A4B;
  --bm-danger-bg:   #FDECEE;
  --bm-success:     #12916A;
  --bm-success-bg:  #E7F6F1;

  /* --- Tipografie ------------------------------------------------------- */
  --bm-font-sans: "Poppins", -apple-system, BlinkMacSystemFont, "Segoe UI",
                  Roboto, "Helvetica Neue", Arial, sans-serif;

  --bm-text-xs:   0.75rem;   /* 12px */
  --bm-text-sm:   0.8125rem; /* 13px */
  --bm-text-base: 0.875rem;  /* 14px */
  --bm-text-md:   1rem;      /* 16px */
  --bm-text-lg:   1.25rem;   /* 20px */
  --bm-text-xl:   1.625rem;  /* 26px */

  /* --- Spațiere (scală de 4px) ------------------------------------------ */
  --bm-sp-1: 0.25rem;
  --bm-sp-2: 0.5rem;
  --bm-sp-3: 0.75rem;
  --bm-sp-4: 1rem;
  --bm-sp-5: 1.25rem;
  --bm-sp-6: 1.5rem;
  --bm-sp-8: 2rem;
  --bm-sp-10: 2.5rem;
  --bm-sp-12: 3rem;

  /* --- Rotunjiri -------------------------------------------------------- */
  --bm-r-sm:   8px;
  --bm-r-md:   12px;
  --bm-r-lg:   18px;
  --bm-r-pill: 999px;

  /* --- Umbre ------------------------------------------------------------ */
  --bm-shadow-sm: 0 1px 2px rgba(12, 35, 64, .06);
  --bm-shadow-md: 0 4px 14px rgba(12, 35, 64, .08);
  --bm-shadow-lg: 0 18px 48px rgba(6, 56, 107, .14);

  /* --- Mișcare ---------------------------------------------------------- */
  --bm-ease: cubic-bezier(.4, 0, .2, 1);
  --bm-dur:  180ms;

  /* --- Focus (accesibilitate) ------------------------------------------- */
  --bm-focus-ring: 0 0 0 3px rgba(0, 168, 181, .35);
}

@media (prefers-reduced-motion: reduce) {
  :root { --bm-dur: 1ms; }
}

/* Reset minim, limitat la componentele noi.
   Nu ne bazăm pe resetul din Bootstrap — CSS-ul trebuie să fie corect și
   dacă într-o zi Bootstrap dispare din layout. */
[class^="bm-"],
[class*=" bm-"],
[class^="bm-"] *,
[class*=" bm-"] * {
  box-sizing: border-box;
}
