/*
 * Brand u panelima (/app, /admin, /partner) i na stranicama prijave
 * (nalog vlasnika 10.10.2026.). Boje dolaze isključivo iz brand.css
 * (var(--cj-...)); ovdje nema vlastitih brand vrijednosti. Učitava se
 * zadnja, nakon panel-buttons.css, app-panel.css i app-cards.css.
 */

/* --- Puni primarni gumbi: prijelaz za gumbe, bijeli tekst ---------------- */
.fi-btn.fi-color.fi-color-primary:not(.fi-outlined) {
    background: var(--cj-grad-btn) !important;
    color: #fff !important;
    border-color: transparent;
}
.fi-btn.fi-color.fi-color-primary:not(.fi-outlined):not([disabled]):hover {
    background: var(--cj-grad-btn-hover) !important;
}
/* Nalog 71 C-24: onemogućen gumb ne smije izgledati klikabilno (npr. „Odaberi MIDI“ u probi). */
.fi-btn.fi-color.fi-color-primary:not(.fi-outlined):is([disabled], .fi-disabled) {
    background: var(--cj-line, #e5e7eb) !important;
    color: var(--cj-muted, #6b7280) !important;
    box-shadow: none !important;
    cursor: not-allowed;
}
.fi-btn.fi-color.fi-color-primary:not(.fi-outlined):is([disabled], .fi-disabled) .fi-icon {
    color: inherit !important;
}
.fi-btn.fi-color.fi-color-primary:not(.fi-outlined):focus-visible {
    outline: none;
    box-shadow: var(--cj-focus-ring) !important;
}

/* Gumbi za odabir (ToggleButtons): neodabrani ostaju obrubljeni, bez prijelaza. */
.fi-fo-toggle-buttons-input:not(:checked) + .fi-btn.fi-color.fi-color-primary {
    background: transparent !important;
}
.fi-fo-toggle-buttons-input:not(:checked) + .fi-btn.fi-color.fi-color-primary:hover {
    background: var(--gray-50) !important;
}
.dark .fi-fo-toggle-buttons-input:not(:checked) + .fi-btn.fi-color.fi-color-primary:hover {
    background: rgb(255 255 255 / 0.05) !important;
}
.fi-fo-toggle-buttons-input:checked + .fi-btn.fi-color.fi-color-primary {
    box-shadow: 0 0 0 2px var(--cj-brand-ink-2) !important;
}

/* Obrubljeni primarni gumbi: brand tinta. */
.fi-btn.fi-color-primary.fi-outlined,
.fi-btn.fi-color-primary.fi-outlined .fi-btn-label,
.fi-btn.fi-color-primary.fi-outlined .fi-icon {
    color: var(--cj-brand-ink-2) !important;
}

/* Nalog 73 (WCAG 2.4.7): fokus tipkovnice u bočnom izborniku i karticama mora se vidjeti. */
.fi-sidebar-item-btn:focus-visible,
.fi-tabs-item:focus-visible {
    outline: 2px solid var(--primary-400);
    outline-offset: 2px;
}

/* --- Aktivna stavka izbornika: meka pozadina, tinta, crta u prijelazu ----- */
.fi-sidebar-item.fi-active > .fi-sidebar-item-btn {
    background-color: var(--cj-brand-soft);
}
.fi-sidebar-item.fi-active > .fi-sidebar-item-btn > .fi-sidebar-item-label,
.fi-sidebar-item.fi-active > .fi-sidebar-item-btn > .fi-icon {
    color: var(--cj-brand-ink);
}
.fi-sidebar-item.fi-active > .fi-sidebar-item-btn::before {
    content: "";
    position: absolute;
    inset-block: 0.375rem;
    inset-inline-start: 0;
    width: 3px;
    border-radius: 999px;
    background: var(--cj-grad);
}
.fi-sidebar-item.fi-active > .fi-sidebar-item-btn > .fi-sidebar-item-grouped-border > .fi-sidebar-item-grouped-border-part {
    background: var(--cj-grad);
}

/* --- Tabovi (Filament): meka pozadina, tinta, crta u prijelazu ------------ */
.fi-tabs-item { position: relative; }
.fi-tabs-item.fi-active {
    background-color: var(--cj-brand-soft);
}
.fi-tabs-item.fi-active .fi-tabs-item-label,
.fi-tabs-item.fi-active > .fi-icon {
    color: var(--cj-brand-ink);
}
.fi-tabs-item.fi-active::after {
    content: "";
    position: absolute;
    inset-inline: 0.5rem;
    bottom: 0;
    height: 2px;
    border-radius: 999px;
    background: var(--cj-grad);
}

/* --- Koraci Filamentova čarobnjaka ---------------------------------------- */
.fi-sc-wizard .fi-sc-wizard-header .fi-sc-wizard-header-step.fi-completed .fi-sc-wizard-header-step-btn .fi-sc-wizard-header-step-icon-ctn {
    background: var(--cj-grad-btn);
}
.fi-sc-wizard .fi-sc-wizard-header .fi-sc-wizard-header-step.fi-active .fi-sc-wizard-header-step-btn .fi-sc-wizard-header-step-icon-ctn {
    border-color: var(--cj-brand-ink-2);
}
.fi-sc-wizard .fi-sc-wizard-header .fi-sc-wizard-header-step:not(.fi-completed).fi-active .fi-sc-wizard-header-step-btn .fi-sc-wizard-header-step-icon-ctn .fi-icon,
.fi-sc-wizard .fi-sc-wizard-header .fi-sc-wizard-header-step.fi-active .fi-sc-wizard-header-step-btn .fi-sc-wizard-header-step-icon-ctn .fi-sc-wizard-header-step-number,
.fi-sc-wizard .fi-sc-wizard-header .fi-sc-wizard-header-step.fi-active .fi-sc-wizard-header-step-btn .fi-sc-wizard-header-step-text .fi-sc-wizard-header-step-label {
    color: var(--cj-brand-ink-2);
}

/* --- Straničenje tablica ---------------------------------------------------- */
.fi-pagination .fi-pagination-item.fi-active .fi-pagination-item-btn { background-color: var(--cj-brand-soft); }
.fi-pagination .fi-pagination-item.fi-active .fi-pagination-item-label { color: var(--cj-brand-ink); }

/* --- Prijava, registracija, lozinka, potvrda e-maila ---------------------- */
.fi-simple-layout {
    background:
        radial-gradient(60rem 32rem at 0% 0%, var(--cj-brand-soft), transparent 70%),
        radial-gradient(52rem 32rem at 100% 100%, var(--cj-brand-soft-2), transparent 70%);
}
.fi-simple-main {
    position: relative;
    overflow: hidden;
}
.fi-simple-main::before {
    content: "";
    position: absolute;
    inset-inline: 0;
    top: 0;
    height: 4px;
    background: var(--cj-grad);
}