/* Dizajn prema hej-ideaputovanja-inquiry-passenger-details (Idea putovanja): iste boje, font, zaglavlje i podnožje.
   Titillium Web je lokalan (OFL), jer CSP ne dopušta vanjske izvore. */

@font-face { font-family: 'Titillium Web'; font-style: normal; font-weight: 400; font-display: swap; src: url(/fonts/titillium-web-400-latin-ext.woff2) format('woff2'); unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: 'Titillium Web'; font-style: normal; font-weight: 400; font-display: swap; src: url(/fonts/titillium-web-400-latin.woff2) format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: 'Titillium Web'; font-style: normal; font-weight: 600; font-display: swap; src: url(/fonts/titillium-web-600-latin-ext.woff2) format('woff2'); unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: 'Titillium Web'; font-style: normal; font-weight: 600; font-display: swap; src: url(/fonts/titillium-web-600-latin.woff2) format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: 'Titillium Web'; font-style: normal; font-weight: 700; font-display: swap; src: url(/fonts/titillium-web-700-latin-ext.woff2) format('woff2'); unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: 'Titillium Web'; font-style: normal; font-weight: 700; font-display: swap; src: url(/fonts/titillium-web-700-latin.woff2) format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }

:root {
    --color-primary: #17537c;
    --color-primary-dark: #0f3a56;
    --color-bg: #f5f5f5;
    --color-bg-card: #ffffff;
    --color-text: #333333;
    --color-text-muted: #666666;
    --color-text-light: #999999;
    --color-border-light: #eeeeee;
    --color-success: #2a9d8f;
    --color-error: #dc3545;
    --font-body: 'Titillium Web', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
    --space-xs: 4px;
    --space-sm: 8px;
    --space-md: 12px;
    --space-lg: 16px;
    --space-xl: 24px;
    --radius-sm: 4px;
    --radius-lg: 8px;
}

*, *::before, *::after { box-sizing: border-box; }
html { font-size: 16px; }
body { margin: 0; padding: 0; font-family: var(--font-body); font-size: 1rem; line-height: 1.5; color: var(--color-text); background: var(--color-bg); }
h1 { font-size: 1.5rem; font-weight: 600; line-height: 1.25; margin: 0 0 var(--space-md); color: var(--color-primary); }
p { margin: 0 0 var(--space-md); }
a { color: var(--color-primary); text-decoration: none; }
a:hover { text-decoration: underline; }

/* Okvir */
.page-wrapper { min-height: 100vh; display: flex; flex-direction: column; }
.main-content { flex: 1; padding: var(--space-lg); max-width: 640px; width: 100%; margin: 0 auto; }
.banner { background: #fde68a; color: #4a3500; text-align: center; padding: 6px 12px; font-weight: 600; font-size: .9rem; }

/* Zaglavlje */
.site-header { background: var(--color-primary); padding: var(--space-md) var(--space-lg); }
.header-content { max-width: 1200px; margin: 0 auto; display: flex; justify-content: space-between; align-items: center; }
.logo-link { display: block; }
.logo { display: block; height: 32px; width: auto; filter: brightness(0) invert(1); }
.header-contact { display: flex; gap: var(--space-xl); }
.contact-item { display: flex; align-items: center; gap: var(--space-xs); color: rgba(255, 255, 255, 0.9); font-size: 0.875rem; }
.contact-item:hover { color: white; text-decoration: none; }
.contact-full { display: none; }
@media (min-width: 600px) {
    .header-contact { gap: var(--space-lg); }
    .contact-item { gap: var(--space-sm); }
    .contact-full { display: inline; }
    .contact-short { display: none; }
}
.contact-icon { width: 16px; height: 16px; }

/* Podnožje */
.site-footer { background: var(--color-primary); color: white; padding: var(--space-md) var(--space-lg); margin-top: auto; }
.footer-content { max-width: 1200px; margin: 0 auto; display: flex; justify-content: space-between; align-items: center; font-size: 0.875rem; }
.copyright { margin: 0; opacity: 0.8; }
.footer-link { color: white; opacity: 0.9; }
.footer-link:hover { opacity: 1; }

/* Kartica */
.card { background: var(--color-bg-card); border-radius: var(--radius-lg); box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1); padding: var(--space-xl); }
.card-centered { text-align: center; }
.card-centered .summary { justify-content: center; text-align: left; }

/* Ikona stanja (stranica „Hvala” u referenci) */
.status-icon { width: 64px; height: 64px; border-radius: 50%; display: flex; align-items: center; justify-content: center; margin: 0 auto var(--space-lg); }
.status-icon svg { width: 32px; height: 32px; }
.status-icon-success { background: var(--color-success); color: white; }
.status-icon-error { background: var(--color-error); color: white; }
.status-icon-info { background: var(--color-primary); color: white; }
.status-icon-neutral { background: var(--color-bg); color: var(--color-text-muted); }

/* Gumbi */
button, .button { display: inline-flex; align-items: center; justify-content: center; gap: var(--space-sm); padding: var(--space-md) var(--space-xl); font-family: var(--font-body); font-size: 1rem; font-weight: 600; background: var(--color-primary); color: white; border: none; border-radius: var(--radius-sm); cursor: pointer; transition: all 0.15s; }
button:hover:not([disabled]), .button:hover { background: var(--color-primary-dark); text-decoration: none; }
button[disabled] { opacity: 0.6; cursor: progress; }
a.button { text-decoration: none; }

/* Sadržaj */
.lead { font-size: 1.05rem; }
.summary { display: grid; grid-template-columns: max-content 1fr; gap: 6px 16px; margin: 0 0 var(--space-xl); }
.summary dt { color: var(--color-text-muted); }
.summary dd { margin: 0; font-weight: 600; }
.summary .amount { font-size: 1.25rem; color: var(--color-primary); }
.note { color: var(--color-text-muted); font-size: .9rem; margin-top: var(--space-xl); }
.cards { color: var(--color-text-muted); font-size: .85rem; }
.errorref-label { margin-bottom: var(--space-xs); color: var(--color-text-muted); }
.errorref { font: 700 1.8rem/1.2 ui-monospace, Consolas, monospace; letter-spacing: .08em; margin: 0 0 var(--space-md); color: var(--color-text); }

/* Kontakt na dnu kartice */
.contact { margin-top: var(--space-xl); padding-top: var(--space-lg); border-top: 1px solid var(--color-border-light); text-align: center; }
.contact > p { font-size: 0.85rem; color: var(--color-text-muted); margin-bottom: var(--space-sm); }
.contact-links { display: flex; justify-content: center; gap: var(--space-lg); flex-wrap: wrap; }
.contact-link { display: flex; align-items: center; gap: var(--space-xs); color: var(--color-primary); font-size: 0.9rem; }

@media print { .site-header, .site-footer, button, .button { display: none !important; } }