:root{
    --erp-primary:#e60012; /* red */
    --erp-primary-600:#cc0010;
    --erp-secondary:#111; /* near-black */
    --erp-accent:#00b3a6; /* teal accent for highlights */
    --erp-bg:#f5f6f7;
    --erp-surface:#ffffff;
    --erp-muted:#8a8f98;
    --erp-border:#e4e6ea;
    --erp-success:#1f9d55;
    --erp-warning:#ffb300;
    --erp-danger:#d62828;
}
.navbar-brand img{height:24px}
body{background:var(--erp-bg)}
.topbar{border-bottom:1px solid var(--erp-border); background:var(--erp-surface);}
.app-shell{min-height:100vh;}
.sidebar{width:280px; border-right:1px solid var(--erp-border); background:#fff;}
.sidebar .nav-link{color:#222; border-radius:.5rem}
.sidebar .nav-link.active, .sidebar .nav-link:hover{background:#f1f2f4}
.sidebar-section-title{font-size:.8rem; text-transform:uppercase; letter-spacing:.04em; color:var(--erp-muted); margin:1rem .75rem .25rem}

.badge-soft{background:#f1f3f5; color:#111}

.kpi-card{border:1px solid var(--erp-border); border-radius:1rem; background:var(--erp-surface)}
.kpi-value{font-weight:700; font-size:1.75rem}

.table thead th{position:sticky; top:0; background:#fff; z-index:2; box-shadow:0 1px 0 0 var(--erp-border)}

.kanban{display:grid; grid-template-columns:repeat(4, minmax(240px,1fr)); gap:1rem}
.kanban-column{background:var(--erp-surface); border:1px solid var(--erp-border); border-radius:1rem; overflow:hidden}
.kanban-column header{padding:.75rem 1rem; border-bottom:1px solid var(--erp-border); font-weight:600}
.kanban-column .card{border:0; border-bottom:1px dashed var(--erp-border); border-radius:0}

.timeline{position:relative;}
.timeline::before{content:""; position:absolute; left:12px; top:0; bottom:0; width:2px; background:var(--erp-border)}
.timeline-item{position:relative; padding-left:2.25rem; margin-bottom:1rem}
.timeline-bullet{position:absolute; left:6px; top:.5rem; width:14px; height:14px; border-radius:50%; background:var(--erp-primary)}

.brand-primary{color:var(--erp-primary)}
.btn-primary{--bs-btn-bg:var(--erp-primary); --bs-btn-border-color:var(--erp-primary); --bs-btn-hover-bg:var(--erp-primary-600); --bs-btn-hover-border-color:var(--erp-primary-600)}
.link-primary{color:var(--erp-primary)}
.form-check-input:checked{background-color:var(--erp-primary); border-color:var(--erp-primary)}

.search-input{max-width:560px}
.avatar{width:32px; height:32px; border-radius:50%; object-fit:cover}
.card-rounded{border-radius:1rem}

@media (max-width: 992px){
    .sidebar{position:fixed; top:56px; left:0; bottom:0; z-index:1040; transform:translateX(-100%); transition:transform .2s ease}
    .sidebar.open{transform:translateX(0)}
    .content{padding-top:1rem}
}

/* === Topbar theme (Bootstrap 5 compatible) === */
.topbar {
    --topbar-red: #E60012FF;             /* červené pozadí + tlačítka */
    --topbar-red-hover: #a80012;       /* hover */
    --topbar-white: #ffffff;
    --topbar-gray-50: #f5f5f5;         /* světle šedá pro menu */
    --topbar-gray-200: #e6e6e6;        /* hrany menu */
    background-color: var(--topbar-red) !important;
    border-bottom: 1px solid rgba(255,255,255,.25);
}

/* Bootstrap toggler icon na tmavém pozadí */
.navbar-toggler {
    color: var(--topbar-white);
}
.navbar-toggler-icon {
    background-image: none;
    width: 1.25rem; height: 1.25rem; position: relative;
}
.navbar-toggler-icon::before, .navbar-toggler-icon::after {
    content: ""; position: absolute; left: 0; right: 0; height: 2px; background: var(--topbar-white);
}
.navbar-toggler-icon::before { top: 4px; }
.navbar-toggler-icon::after { bottom: 4px; }

/* Logo značka */
.logo-mark {
    display: inline-grid; place-items: center;
    width: 42px; height: 34px;
    border: 2px solid var(--topbar-white);
    border-radius: .5rem;
    font-weight: 800; letter-spacing: .5px;
}

/* Vyhledávání */
.topbar .form-control.topbar-search {
    background-color: transparent;
    color: var(--topbar-white);
    border: 2px solid var(--topbar-white);
    border-radius: 999px;
}
.topbar .form-control.topbar-search::placeholder {
    color: rgba(255,255,255,.9);
}
.topbar .form-control.topbar-search:focus {
    box-shadow: 0 0 0 .25rem rgba(255,255,255,.25);
    border-color: var(--topbar-white);
}

/* Tlačítka */
.btn-topbar, .btn-topbar-icon {
    background-color: var(--topbar-red);
    color: var(--topbar-white);
    border: 2px solid var(--topbar-white);
    border-radius: 999px;
    font-weight: 600;
}
.btn-topbar:hover, .btn-topbar-icon:hover {
    background-color: var(--topbar-red-hover);
    color: var(--topbar-white);
}
.btn-topbar { padding: .4rem .75rem; }
.btn-topbar-icon { width: 40px; height: 40px; padding: 0; }

/* Dropdown menu světle šedé */
.dropdown-menu-light {
    background-color: var(--topbar-gray-50);
    border: 1px solid var(--topbar-gray-200);
    border-radius: .6rem;
}
.dropdown-menu-light .dropdown-item:hover {
    background-color: #eaeaea;
}

/* Ikony uvnitř bílá */
.btn-topbar svg, .btn-topbar-icon svg {
    display: inline-block;
    vertical-align: middle;
    color: var(--topbar-white);
}
/* Menší zaoblení hran pro topbar */
.topbar {
    --topbar-red: #E60012FF;
    --topbar-red-hover: #a80012;
    --topbar-white: #ffffff;
    --topbar-gray-50: #f5f5f5;
    --topbar-gray-200: #e6e6e6;

    /* Nová proměnná pro konzistentní rádius */
    --topbar-radius: 8px;   /* klidně změň na 6px/10px dle chuti */
}

/* Logo méně zakulacené */
.logo-mark {
    border-radius: calc(var(--topbar-radius) - 2px);
}

/* Vyhledávání: už ne „pilulka“ */
.topbar .form-control.topbar-search {
    border-radius: var(--topbar-radius);
}

/* Tlačítko hledat */
.btn-topbar {
    border-radius: var(--topbar-radius);
}

/* Ikona nastavení – čtvercovější tlačítko */
.btn-topbar-icon {
    width: 40px; height: 40px; padding: 0;
    border-radius: calc(var(--topbar-radius) - 2px);
}

/* Dropdown menu lehce zaoblené, ne kulaté */
.dropdown-menu-light {
    border-radius: 6px;
}

/* Toggler taky méně kulatý */
.navbar-toggler {
    border-radius: var(--topbar-radius);
}

/* Volitelně: méně „nafouklý“ focus ring na tmavém pozadí */
.topbar .form-control.topbar-search:focus {
    box-shadow: 0 0 0 .2rem rgba(255,255,255,.22);
}
.btn-topbar:hover, .btn-topbar-icon:hover {
    background-color: var(--topbar-red-hover);
}

/* === Sidebar layout & theme === */
:root{
    --topbar-h: 64px;            /* už máte z předchozí úpravy */
    --sidebar-w: 260px;          /* šířka levého menu (desktop) */
    --topbar-red: #cc0015;
    --topbar-red-hover: #a80012;
    --sidebar-bg: #ffffff;       /* světlé, čisté pozadí */
    --sidebar-border: #e9ecef;
    --sidebar-link: #222;
    --sidebar-link-hover: #111;
    --sidebar-active-bg: #cc0015;
    --sidebar-active-text: #fff;
    --sidebar-radius: 8px;       /* sladěno s horním menu */
}

/* Fixní levé menu na desktopu */
.erp-sidebar{
    position: fixed;
    top: var(--topbar-h);
    left: 0;
    width: var(--sidebar-w);
    height: calc(100vh - var(--topbar-h));
    background-color: var(--sidebar-bg);
    border-right: 1px solid var(--sidebar-border);
    overflow: auto;
    -webkit-overflow-scrolling: touch;
}

/* Obsah se posune vedle sidebaru (jen ≥ lg) */
@media (min-width: 992px){
    .main-content{ margin-left: var(--sidebar-w); }
}

/* Styl položek menu */
.erp-sidebar .nav-link,
.erp-offcanvas .nav-link{
    color: var(--sidebar-link);
    border: 1px solid transparent;
    border-radius: var(--sidebar-radius);
    padding: .5rem .75rem;
    display: flex; align-items: center;
}
.erp-sidebar .nav-link:hover,
.erp-offcanvas .nav-link:hover{
    background-color: #f8f9fa;
    color: var(--sidebar-link-hover);
}

/* Aktivní stav: červené pozadí + bílý text a rámeček */
.erp-sidebar .nav-link.active,
.erp-offcanvas .nav-link.active{
    background-color: var(--sidebar-active-bg);
    color: var(--sidebar-active-text);
    border-color: var(--sidebar-active-bg);
}
.erp-sidebar .nav-link.active i,
.erp-offcanvas .nav-link.active i{ color: var(--sidebar-active-text); }

/* Collapsible "tlačítko" vypadá jako položka */
.erp-sidebar .btn.nav-link,
.erp-offcanvas .btn.nav-link{
    text-align: left;
    color: var(--sidebar-link);
    background: transparent;
    border: 1px solid transparent;
    border-radius: var(--sidebar-radius);
    padding: .5rem .75rem;
}
.erp-sidebar .btn.nav-link:hover,
.erp-offcanvas .btn.nav-link:hover{
    background-color: #f8f9fa;
}

/* Offcanvas vzhled sjednocený */
.erp-offcanvas{
    width: min(86vw, 320px);
    background-color: var(--sidebar-bg);
    border-right: 1px solid var(--sidebar-border);
}

/* Jemný stín pod topbarem i kolem sidebaru při scrollu */
.erp-sidebar{
    box-shadow: inset 0 1px 0 rgba(0,0,0,.02);
}

/* Ujisti se, že dropdowny/topbar jsou nad offcanvas */
.topbar{ z-index: 1030; }
:root{
    /* ...ostatní proměnné... */
    --sidebar-selected-bg: #ffe0ef;   /* světle růžová */
    --sidebar-selected-text: #7a0032; /* kontrastní text (tmavě malinová) */
    --sidebar-selected-border: #ffb6d0;/* jemná hranice */
    --sidebar-selected-accent: #ff4da6;/* volitelný levý akcent */
}

/* Aktivní (vybraná) položka = růžové pozadí */
.erp-sidebar .nav-link.active,
.erp-offcanvas .nav-link.active,
.erp-sidebar .nav-link[aria-current="page"],
.erp-offcanvas .nav-link[aria-current="page"],
.erp-sidebar .nav-link.is-selected,
.erp-offcanvas .nav-link.is-selected{
    background-color: var(--sidebar-selected-bg);
    color: var(--sidebar-selected-text);
    border-color: var(--sidebar-selected-border);
}

/* Ikona v aktivní položce také tmavší */
.erp-sidebar .nav-link.active i,
.erp-offcanvas .nav-link.active i,
.erp-sidebar .nav-link[aria-current="page"] i,
.erp-offcanvas .nav-link[aria-current="page"] i,
.erp-sidebar .nav-link.is-selected i,
.erp-offcanvas .nav-link.is-selected i{
    color: var(--sidebar-selected-text);
}

/* Volitelně: tenká růžová lišta vlevo pro lepší orientaci */
.erp-sidebar .nav-link.active,
.erp-sidebar .nav-link[aria-current="page"],
.erp-sidebar .nav-link.is-selected{
    position: relative;
}
.erp-sidebar .nav-link.active::before,
.erp-sidebar .nav-link[aria-current="page"]::before,
.erp-sidebar .nav-link.is-selected::before{
    content:"";
    position:absolute; inset: 6px auto 6px 6px;
    width: 3px;
    background: var(--sidebar-selected-accent);
    border-radius: 2px;
}

