﻿/* =====================================================
   Focus doo – DARK THEME (final 1:1)
   ===================================================== */

:root {
    --bg-main: #0B1220;
    --bg-section: #0F172A;
    --bg-card: #16233A;
    --border-soft: #2A3B55;
    --text-primary: #FFFFFF;
    --text-secondary: #D1D5DB;
    --text-muted: #9CA3AF;
    --accent: #3B82F6;
    --accent-hover: #2563EB;
}

/* ---------- BASE ---------- */

html, body {
    background-color: var(--bg-main) !important;
    color: var(--text-secondary) !important;
    font-family: Inter, system-ui, -apple-system, "Segoe UI", sans-serif;
    line-height: 1.7;
}

/* ---------- TEXT ---------- */

p, li, span, div {
    color: var(--text-secondary) !important;
}

h1, h2, h3, h4, h5, h6 {
    color: var(--text-primary) !important;
    font-weight: 600;
}

.lead {
    color: var(--text-secondary) !important;
}

.text-dark {
    color: var(--text-primary) !important;
}

.text-body {
    color: var(--text-secondary) !important;
}

.text-muted {
    color: var(--text-muted) !important;
}

/* ---------- LINKS ---------- */

a, a:visited {
    color: var(--accent) !important;
    text-decoration: none;
}

    a:hover {
        color: var(--accent-hover) !important;
    }

/* ---------- CARD / CONTENT ---------- */

.card, .box, .panel {
    background: linear-gradient(180deg, #18263F, #132033);
    border: 1px solid var(--border-soft);
    border-radius: 16px;
    padding: 2rem;
    color: var(--text-secondary) !important;
}

/* ---------- NAVBAR ---------- */

.navbar,
.navbar-light,
.bg-light {
    background-color: #020617 !important;
    border-bottom: 1px solid var(--border-soft) !important;
}

    .navbar .nav-link {
        color: var(--text-secondary) !important;
    }

        .navbar .nav-link:hover {
            color: var(--text-primary) !important;
        }

.navbar-brand {
    color: var(--text-primary) !important;
}

/* ---------- FORMS ---------- */

input, textarea {
    background-color: #020617 !important;
    border: 1px solid var(--border-soft) !important;
    color: #ffffff !important;
    border-radius: 8px;
}

    input::placeholder, textarea::placeholder {
        color: var(--text-muted);
    }

    /* ---------- BUTTONS ---------- */

    button, .btn, input[type="submit"] {
        background-color: var(--accent) !important;
        color: #ffffff !important;
        border: none !important;
        border-radius: 12px;
        font-weight: 500;
    }

        button:hover, .btn:hover {
            background-color: var(--accent-hover) !important;
        }

/* ---------- FOOTER ---------- */

footer {
    background-color: #020617 !important;
    border-top: 1px solid var(--border-soft);
    color: var(--text-muted) !important;
}

/* ---------- SOCIAL ICONS ---------- */

.social-icons img {
    background: transparent !important;
    border-radius: 14px;
    margin: 0 6px;
    opacity: 0.95;
}
/* =====================================================
   SAFE DORADA – veći font i veći logo
   (NE dira boje, NE dira background)
   ===================================================== */

/* VEĆI TEKST U GLAVNOJ KARTICI */
.card p,
.card li {
    font-size: 1.15rem; /* bilo ~1rem */
    line-height: 1.85;
}

.card p {
    margin-bottom: 1.1rem;
}

/* NASLOV */
h2 {
    font-size: 2.1rem;
    margin-bottom: 1.5rem;
}

/* VEĆI LOGO U HEADERU */
.navbar-brand img {
    height: 42px; /* ranije ~28px */
    width: auto;
    margin-right: 12px;
}

/* MALO VIŠE "ZRAKA" U NAVBARU */
.navbar {
    padding-top: 0.9rem;
    padding-bottom: 0.9rem;
}

    /* LINKOVI U MENIJU */
    .navbar .nav-link {
        font-size: 1.05rem;
        padding-left: 0.8rem;
        padding-right: 0.8rem;
    }


    .social-icons img:hover {
        opacity: 1;
    }
/* =====================================================
   GLOBAL FIX – da sve stranice budu dark
   ===================================================== */

/* cijela pozadina za sve page-ove */
main,
main > .container,
section.container {
    background: transparent !important;
}

/* ako neki page nema .card */
body {
    background-color: var(--bg-main) !important;
    color: var(--text-secondary) !important;
}

/* Bootstrap light sekcije */
.bg-white,
.bg-light {
    background-color: transparent !important;
}

/* Navbar – uvijek dark */
header,
.navbar {
    background-color: #020617 !important;
    border-bottom: 1px solid var(--border-soft) !important;
}

/* tekst po defaultu */
p, li, span, div {
    color: var(--text-secondary) !important;
}
/* =====================================================
   NAVBAR – uvijek isti dark look na svim page-ovima
   ===================================================== */

header {
    background: #020617 !important;
}

    header .navbar {
        background: #020617 !important;
        border-bottom: 1px solid var(--border-soft) !important;
    }

        /* linkovi u meniju */
        header .navbar .nav-link {
            color: var(--text-secondary) !important;
            opacity: 0.95;
        }

            header .navbar .nav-link:hover,
            header .navbar .nav-link.active {
                color: var(--text-primary) !important;
                opacity: 1;
            }

        /* brand tekst */
        header .navbar .navbar-brand {
            color: var(--text-primary) !important;
        }

        /* hamburger (ako ikad bude) */
        header .navbar .navbar-toggler {
            border-color: var(--border-soft) !important;
        }

        header .navbar .navbar-toggler-icon {
            filter: invert(1);
        }

/* spriječi bootstrap bg-light da “pobijeli” */
.navbar-light,
.bg-light,
.bg-white {
    background: #020617 !important;
}
/* =====================================================
   Services/Proizvodi – ukloni bijele kartice unutar dark layouta
   ===================================================== */

/* sve "unutrašnje" kartice koje Bootstrap pravi bijele */
.card .card,
.card .bg-white,
.card .bg-light,
.card .bg-body,
.card .bg-body-tertiary {
    background: linear-gradient(180deg, #18263F, #132033) !important;
    border: 1px solid var(--border-soft) !important;
    border-radius: 14px !important;
    color: var(--text-secondary) !important;
}

    /* tekst unutar tih bijelih kartica */
    .card .card p,
    .card .card li,
    .card .card span,
    .card .card div,
    .card .bg-white p,
    .card .bg-white li,
    .card .bg-white span,
    .card .bg-white div {
        color: var(--text-secondary) !important;
    }

    /* naslovi u tim karticama */
    .card .card h1,
    .card .card h2,
    .card .card h3,
    .card .card h4,
    .card .bg-white h1,
    .card .bg-white h2,
    .card .bg-white h3,
    .card .bg-white h4 {
        color: var(--text-primary) !important;
    }

/* Bootstrap “text-dark” da ne ostane crn na tamnom */
.card .text-dark {
    color: var(--text-primary) !important;
}
/* =====================================================
   PROIZVODI: preboji sve bijele blokove unutar glavne kartice
   (radi i kad nije Bootstrap .card)
   ===================================================== */

/* hvata sve elemente koji imaju bijelu pozadinu preko bootstrap klasa */
.card .bg-white,
.card .bg-light,
.card .bg-body,
.card .bg-body-tertiary,
.card .text-bg-light {
    background: linear-gradient(180deg, #18263F, #132033) !important;
    border: 1px solid var(--border-soft) !important;
    border-radius: 14px !important;
    color: var(--text-secondary) !important;
}

/* hvata tipične "bijele kutije" koje nisu .card nego koriste border/rounded/padding */
.card .border,
.card .border.rounded,
.card .rounded,
.card .shadow,
.card .shadow-sm,
.card .shadow-lg {
    background: linear-gradient(180deg, #18263F, #132033) !important;
    border-color: var(--border-soft) !important;
    color: var(--text-secondary) !important;
}

/* hvata slučaj da je background namješten inline: style="background:#fff" ili rgb(255,255,255)" 
   (ne može 100% preko CSS selektora), pa zato bar popravimo tekst da bude vidljiv */
.card * {
    color: inherit;
}

/* ubij "text-dark" i slične koji prave crna slova */
.card .text-dark,
.card .text-body,
.card .text-secondary {
    color: var(--text-secondary) !important;
}

/* naslovi u tim blokovima */
.card .bg-white h1, .card .bg-white h2, .card .bg-white h3, .card .bg-white h4,
.card .bg-light h1, .card .bg-light h2, .card .bg-light h3, .card .bg-light h4,
.card .border h1, .card .border h2, .card .border h3, .card .border h4,
.card .rounded h1, .card .rounded h2, .card .rounded h3, .card .rounded h4 {
    color: var(--text-primary) !important;
}

/* paragrafi/listе u tim blokovima */
.card .bg-white p, .card .bg-white li,
.card .bg-light p, .card .bg-light li,
.card .border p, .card .border li,
.card .rounded p, .card .rounded li {
    color: var(--text-secondary) !important;
}
/* =====================================================
   Services – project-box kao dark kartica (umjesto bijele)
   ===================================================== */

.project-box {
    background: linear-gradient(180deg, #18263F, #132033) !important;
    border: 1px solid var(--border-soft) !important;
    border-radius: 14px !important;
    box-shadow: 0 2px 10px rgba(0,0,0,0.25) !important;
}

    .project-box:hover {
        box-shadow: 0 6px 18px rgba(0,0,0,0.35) !important;
    }

.project-title {
    color: var(--text-primary) !important;
    font-weight: 600;
}

.project-box p,
.project-box li,
.project-box span,
.project-box div {
    color: var(--text-secondary) !important;
}

.link-focus {
    color: var(--accent) !important;
    text-decoration: none;
}

    .link-focus:hover {
        color: var(--accent-hover) !important;
        text-decoration: underline;
    }
/* =====================================================
   PRISM / XML – DARK MODE (ujednačeno sa ostatkom stranice)
   ===================================================== */

/* wrapper oko koda */
pre,
pre[class*="language-"],
code[class*="language-"] {
    background: linear-gradient(180deg, #18263F, #132033) !important;
    color: var(--text-secondary) !important;
    border: 1px solid var(--border-soft) !important;
    border-radius: 14px !important;
    box-shadow: 0 2px 12px rgba(0,0,0,0.35);
    font-size: 0.95rem;
    line-height: 1.6;
}

/* padding i scrollbar */
pre {
    padding: 1.25rem !important;
    overflow: auto;
}

    /* ukloni svijetlu pozadinu koju Prism nameće */
    pre[class*="language-"] *,
    code[class*="language-"] * {
        background: transparent !important;
    }

/* BOJE TOKENA (XML) */
.token.tag {
    color: #7DD3FC !important;
}
/* tagovi */
.token.attr-name {
    color: #93C5FD !important;
}
/* atributi */
.token.attr-value {
    color: #A7F3D0 !important;
}
/* vrijednosti */
.token.string {
    color: #A7F3D0 !important;
}

.token.number {
    color: #FDE68A !important;
}

.token.boolean {
    color: #FCA5A5 !important;
}

.token.comment {
    color: #94A3B8 !important
}