/*
 * TempoAdria paleta boja
 *
 * Za promjenu vizualnog identiteta mijenjajte samo vrijednosti u ovom bloku.
 * U ostalim CSS i SCSS datotekama nema konkretnih vrijednosti boja.
 */
:root {
  /* Osnovne neutralne i sistemske boje */
  --color-transparent: transparent;
  --color-white: #ffffff;
  --color-black: #000000;
  --color-text-neutral: #3f4850;
  --color-background-soft: #f5f8fa;
  --color-background-dark: #052a47;
  --color-surface-dark: #083f69;
  --color-ui-dark: #212529;
  --color-header-border-base: #0b3554;
  --color-header-shadow-base: #062b47;

  /* Statusne poruke */
  --status-error-background: #df1529;
  --status-success-background: #059652;
  --status-message-text: var(--color-white);

  /* Prozirne neutralne boje */
  --color-white-97: color-mix(in srgb, var(--color-white) 97%, var(--color-transparent));
  --color-white-95: color-mix(in srgb, var(--color-white) 95%, var(--color-transparent));
  --color-white-94: color-mix(in srgb, var(--color-white) 94%, var(--color-transparent));
  --color-white-92: color-mix(in srgb, var(--color-white) 92%, var(--color-transparent));
  --color-white-90: color-mix(in srgb, var(--color-white) 90%, var(--color-transparent));
  --color-white-88: color-mix(in srgb, var(--color-white) 88%, var(--color-transparent));
  --color-white-84: color-mix(in srgb, var(--color-white) 84%, var(--color-transparent));
  --color-white-80: color-mix(in srgb, var(--color-white) 80%, var(--color-transparent));
  --color-white-72: color-mix(in srgb, var(--color-white) 72%, var(--color-transparent));
  --color-white-58: color-mix(in srgb, var(--color-white) 58%, var(--color-transparent));
  --color-white-48: color-mix(in srgb, var(--color-white) 48%, var(--color-transparent));
  --color-white-38: color-mix(in srgb, var(--color-white) 38%, var(--color-transparent));
  --color-white-14: color-mix(in srgb, var(--color-white) 14%, var(--color-transparent));
  --color-white-10: color-mix(in srgb, var(--color-white) 10%, var(--color-transparent));
  --color-white-08: color-mix(in srgb, var(--color-white) 8%, var(--color-transparent));
  --color-black-60: color-mix(in srgb, var(--color-black) 60%, var(--color-transparent));
  --color-black-12: color-mix(in srgb, var(--color-black) 12%, var(--color-transparent));
  --color-black-10: color-mix(in srgb, var(--color-black) 10%, var(--color-transparent));
  --color-black-08: color-mix(in srgb, var(--color-black) 8%, var(--color-transparent));
  --color-black-06: color-mix(in srgb, var(--color-black) 6%, var(--color-transparent));
  --color-black-05: color-mix(in srgb, var(--color-black) 5%, var(--color-transparent));
  --color-black-04: color-mix(in srgb, var(--color-black) 4%, var(--color-transparent));
  --color-ui-dark-80: color-mix(in srgb, var(--color-ui-dark) 80%, var(--color-transparent));
  --color-ui-dark-10: color-mix(in srgb, var(--color-ui-dark) 10%, var(--color-transparent));
  --color-ui-dark-03: color-mix(in srgb, var(--color-ui-dark) 3%, var(--color-transparent));
  --color-header-border: color-mix(in srgb, var(--color-header-border-base) 12%, var(--color-transparent));
  --color-header-shadow: color-mix(in srgb, var(--color-header-shadow-base) 12%, var(--color-transparent));

  /* Glavna paleta */
  --brand-primary: #0e94ff;
  --brand-primary-dark: #083f69;
  --brand-primary-deep: #052a47;
  --brand-primary-mid: #0b6fb8;
  --brand-primary-soft: #edf7ff;
  --brand-primary-pale: #d6ecff;
  --brand-primary-soft-strong: #b9ddff;
  --brand-primary-tint: #f7fbff;
  --brand-primary-tint-soft: #fbfdff;

  /* Tekst, linije i nježne pozadine */
  --brand-ink: #2f3942;
  --brand-text: #3f4850;
  --brand-muted: #5f6b76;
  --brand-muted-strong: #4b5a66;
  --brand-line: #d8e5ef;
  --brand-neutral-tint: #f7fafc;
  --brand-divider: #e9f0f5;
  --brand-section-start: #eef7fd;
  --brand-section-end: #f8fbfd;

  /* Sekundarni naglasak */
  --brand-secondary: #f6c85f;
  --brand-secondary-hover: #ffd978;
  --brand-secondary-soft: #fff8e8;

  /* Dodatne nijanse koje se koriste u dekorativnim gradijentima */
  --brand-gradient-deep: #052a47;
  --brand-gradient-mid: #0b6fb8;
  --brand-gradient-soft: #46b4ff;

  /* Dodatne bazne boje za sjene i prozirne slojeve */
  --brand-shadow-color: #031d31;
  --brand-overlay-color: #06273d;
  --brand-primary-wash: #e3f3ff;

  /*
   * Paleta gumba
   * Ove vrijednosti nisu povezane s bojama sekcija. Mijenjaju se zasebno.
   */
  --button-primary-background: #f6c85f;
  --button-primary-background-hover: #ffd978;
  --button-primary-text: var(--brand-primary-dark);
  --button-primary-border: var(--button-primary-background);
  --button-primary-border-hover: var(--button-primary-background-hover);
  --button-primary-shadow: #9d6812;
  --button-primary-disabled-background: #ead59b;
  --button-primary-disabled-text: #53616d;
  --button-primary-disabled-border: var(--button-primary-disabled-background);

  --button-outline-background: var(--color-white);
  --button-outline-background-hover: var(--brand-primary-soft);
  --button-outline-text: #083f69;
  --button-outline-text-hover: #052a47;
  --button-outline-border: #083f69;
  --button-outline-border-hover: #052a47;
  --button-transparent-border: var(--color-transparent);

  --button-highlight-background: var(--brand-secondary);
  --button-highlight-background-hover: var(--brand-secondary-hover);
  --button-highlight-text: var(--brand-primary-dark);
  --button-highlight-border: var(--button-highlight-background);
  --button-highlight-border-hover: var(--button-highlight-background-hover);
  --button-highlight-shadow: #9d6812;
  --button-highlight-icon: var(--button-highlight-background);

  --button-inverse-background: var(--color-white);
  --button-inverse-background-hover: var(--brand-secondary-soft);
  --button-inverse-text: var(--brand-primary-dark);
  --button-inverse-border: var(--button-inverse-background);
  --button-inverse-border-hover: var(--button-inverse-background-hover);
  --button-inverse-background-soft: var(--color-white-10);
  --button-inverse-background-faint: var(--color-white-08);
  --button-inverse-border-soft: var(--color-white-72);

  --button-ghost-background: var(--color-transparent);
  --button-ghost-background-hover: #edf7ff;
  --button-ghost-text: var(--color-text-neutral);
  --button-ghost-text-hover: var(--brand-primary-dark);
  --button-focus-ring: var(--brand-secondary-hover);

  /* Globalne semantičke varijable */
  --background-color: var(--color-white);
  --default-color: var(--brand-text);
  --heading-color: var(--brand-primary-dark);
  --accent-color: var(--brand-primary);
  --surface-color: var(--color-white);
  --contrast-color: var(--color-white);

  /* Navigacija */
  --nav-color: var(--brand-primary-dark);
  --nav-hover-color: var(--brand-primary);
  --nav-mobile-background-color: var(--color-white);
  --nav-dropdown-background-color: var(--color-white);
  --nav-dropdown-color: var(--brand-primary-dark);
  --nav-dropdown-hover-color: var(--brand-primary);

  /* Bootstrap poveznice i pomoćne klase */
  --bs-primary: var(--brand-primary);
  --bs-link-color: var(--brand-primary);
  --bs-link-hover-color: var(--brand-primary-dark);

  /* Zajednička sjena */
  --brand-shadow: 0 18px 50px color-mix(in srgb, var(--brand-primary-dark) 10%, var(--color-transparent));
}