@import '_content/Microsoft.AspNetCore.Components.QuickGrid/Microsoft.AspNetCore.Components.QuickGrid.boiwgh0w5b.bundle.scp.css';

/* /Components/Layout/MainLayout.razor.rz.scp.css */
.page[b-oqunbk0akc] {
    position: relative;
    display: flex;
    flex-direction: column;
    height: 100vh;
    overflow: hidden;
}

main[b-oqunbk0akc] {
    flex: 1;
    height: 100vh;
    display: flex; /* make content column */
    flex-direction: column;
    min-width: 0; /* critical for horizontal scrolling inside */
}

.sidebar[b-oqunbk0akc] {
    background: var(--pozadina);
}

.top-row[b-oqunbk0akc] {
    background-color: var(--pozadina-svetla);
    border-bottom: 1px solid #d6d5d5;
    justify-content: flex-end;
    height: 3.1rem;
    display: flex;
    align-items: center;
    flex: 0 0 auto;          /* keep fixed height */
    white-space: nowrap;     /* prevent multi-line wrap */
    overflow: hidden;        /* clip overflowing content */
    box-sizing: border-box;  /* include padding in height */
}

/* allow children to shrink so text can ellipsis instead of wrapping */
.top-row > *[b-oqunbk0akc] {
    min-width: 0;
}

    .top-row[b-oqunbk0akc]  a, .top-row[b-oqunbk0akc]  .btn-link {
        white-space: nowrap;
        margin-left: 1.5rem;
        text-decoration: none;
    }

    .top-row[b-oqunbk0akc]  a:hover, .top-row[b-oqunbk0akc]  .btn-link:hover {
        text-decoration: underline;
    }

    .top-row[b-oqunbk0akc]  a:first-child {
        overflow: hidden;
        text-overflow: ellipsis;
    }

@media (max-width: 640.98px) {
    .top-row[b-oqunbk0akc] {
        justify-content: space-between;
    }

    .top-row[b-oqunbk0akc]  a, .top-row[b-oqunbk0akc]  .btn-link {
        margin-left: 0;
    }
}

@media (min-width: 641px) {
    .page[b-oqunbk0akc] {
        flex-direction: row;
    }

    .sidebar[b-oqunbk0akc] {
        width: 200px;
        height: 100vh;
        position: sticky;
        top: 0;
    }

    .top-row[b-oqunbk0akc] {
        position: sticky;
        top: 0;
        z-index: 1;
        padding-left: 0 !important;       /* ensure button touches the left edge */
        padding-right: 1.5rem !important;  /* keep right padding */
    }

    article[b-oqunbk0akc] {
        padding-left: 2rem !important;     /* keep content padding */
        padding-right: 1.5rem !important;
    }
}

#blazor-error-ui[b-oqunbk0akc] {
    color-scheme: light only;
    background: lightyellow;
    bottom: 0;
    box-shadow: 0 -1px 2px rgba(0, 0, 0, 0.2);
    box-sizing: border-box;
    display: none;
    left: 0;
    padding: 0.6rem 1.25rem 0.7rem 1.25rem;
    position: fixed;
    width: 100%;
    z-index: 1000;
}

    #blazor-error-ui .dismiss[b-oqunbk0akc] {
        cursor: pointer;
        position: absolute;
        right: 0.75rem;
        top: 0.5rem;
    }

/* Shell */
.layout-shell[b-oqunbk0akc] {
    display: flex;
    flex-direction: column;
    min-height: 100vh;
}

/* Topbar */
.topbar[b-oqunbk0akc] {
    position: sticky;
    top: 0;
    z-index: 1030;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: .5rem;
    padding: .5rem .75rem;
    background: #fff;
    border-bottom: 1px solid #e9ecef;
}

.topbar-left[b-oqunbk0akc] {
    display: flex;
    align-items: center;
}

/* Body layout */
.layout-body[b-oqunbk0akc] {
    display: grid;
    grid-template-columns: 240px 1fr;
    gap: 12px;
    padding: 12px;
}

/* Sidebar */
.app-sidebar[b-oqunbk0akc] {
    background: #fff;
    border: 1px solid #e9ecef;
    border-radius: 8px;
    padding: 10px;
    box-shadow: 0 1px 2px rgba(16,24,40,.06);
    position: sticky;
    top: 58px;
    align-self: start;
    max-height: calc(100vh - 70px);
    overflow: auto;
    transition: width .2s ease, min-width .2s ease;
}

.layout-shell.collapsed .layout-body[b-oqunbk0akc] {
    grid-template-columns: 56px 1fr;
}

.layout-shell.collapsed .app-sidebar[b-oqunbk0akc] {
    width: 56px;
    min-width: 56px;
    padding: 10px 8px;
}

    .layout-shell.collapsed .app-sidebar .nav-text[b-oqunbk0akc] {
        display: none !important;
    }

.app-sidebar .nav-link[b-oqunbk0akc] {
    display: flex;
    align-items: center;
    gap: .35rem;
    color: #495057;
    border-radius: .375rem;
    padding: .4rem .5rem;
}

    .app-sidebar .nav-link.active[b-oqunbk0akc] {
        background: #eef4ff;
        color: #0d6efd;
    }

/* Main content */
.app-main[b-oqunbk0akc] {
    min-width: 0;
}

/* Small screens */
@media (max-width: 992px) {
    .layout-body[b-oqunbk0akc] {
        grid-template-columns: 1fr;
    }

    .app-sidebar[b-oqunbk0akc] {
        position: static;
        max-height: unset;
        width: auto !important;
        min-width: 0 !important;
    }

    .layout-shell.collapsed .app-sidebar .nav-text[b-oqunbk0akc] {
        display: inline;
    }
}

/* Make the content area the scroll container (x + y) */
article.content[b-oqunbk0akc] {
    flex: 1 1 auto;
    overflow: auto; /* enables vertical and horizontal scroll when needed */
    min-width: 0; /* allow child to overflow horizontally and show scrollbar */
}
/* /Components/Layout/NavMenu.razor.rz.scp.css */
.navbar-toggler[b-nykvpb40bx] {
    appearance: none;
    cursor: pointer;
    width: 3.5rem;
    height: 2.5rem;
    color: white;
    position: absolute;
    top: 0.5rem;
    right: 1rem;
    border: 1px solid rgba(255, 255, 255, 0.1);
    background: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='rgba%28255, 255, 255, 0.55%29' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e") no-repeat center/1.75rem rgba(255, 255, 255, 0.1);
}

.navbar-toggler:checked[b-nykvpb40bx] {
    background-color: rgba(255, 255, 255, 0.5);
}

.top-row[b-nykvpb40bx] {
    min-height: 3.5rem;
    background-color: rgba(0,0,0,0.4);
    background: #27548A;
}

.navbar-brand[b-nykvpb40bx] {
    font-size: 1.1rem;
}

.bi[b-nykvpb40bx] {
    display: inline-block;
    position: relative;
    width: 1.25rem;
    height: 1.25rem;
    margin-right: 0.75rem;
    top: -1px;
    background-size: cover;
}

.bi-house-door-fill-nav-menu[b-nykvpb40bx] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' class='bi bi-house-door-fill' viewBox='0 0 16 16'%3E%3Cpath d='M6.5 14.5v-3.505c0-.245.25-.495.5-.495h2c.25 0 .5.5.5.5v3.5a.5.5 0 0 0 .5.5h4a.5.5 0 0 0 .5-.5v-7a.5.5 0 0 0-.146-.354L13 5.793V2.5a.5.5 0 0 0-.5-.5h-1a.5.5 0 0 0-.5.5v1.293L8.354 1.146a.5.5 0 0 0-.708 0l-6 6A.5.5 0 0 0 1.5 7.5v7a.5.5 0 0 0 .5.5h4a.5.5 0 0 0 .5-.5Z'/%3E%3C/svg%3E");
}

.bi-plus-square-fill-nav-menu[b-nykvpb40bx] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' class='bi bi-plus-square-fill' viewBox='0 0 16 16'%3E%3Cpath d='M2 0a2 2 0 0 0-2 2v12a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V2a2 2 0 0 0-2-2H2zm6.5 4.5v3h3a.5.5 0 0 1 0 1h-3v3a.5.5 0 0 1-1 0v-3h-3a.5.5 0 0 1 0-1h3v-3a.5.5 0 0 1 1 0z'/%3E%3C/svg%3E");
}

.bi-list-nested-nav-menu[b-nykvpb40bx] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' class='bi bi-list-nested' viewBox='0 0 16 16'%3E%3Cpath fill-rule='evenodd' d='M4.5 11.5A.5.5 0 0 1 5 11h10a.5.5 0 0 1 0 1H5a.5.5 0 0 1-.5-.5zm-2-4A.5.5 0 0 1 3 7h10a.5.5 0 0 1 0 1H3a.5.5 0 0 1-.5-.5zm-2-4A.5.5 0 0 1 1 3h10a.5.5 0 0 1 0 1H1a.5.5 0 0 1-.5-.5z'/%3E%3C/svg%3E");
}

.nav-item[b-nykvpb40bx] {
    font-size: 0.9rem;
    padding-bottom: 0.5rem;
}

    .nav-item:first-of-type[b-nykvpb40bx] {
        padding-top: 1rem;
    }

    .nav-item:last-of-type[b-nykvpb40bx] {
        padding-bottom: 1rem;
    }

    .nav-item[b-nykvpb40bx]  .nav-link {
        color: #d7d7d7;
        background: none;
        border: none;
        border-radius: 4px;
        height: var(--menu-item-height, 3rem);
        display: flex;
        align-items: center;
        line-height: normal;                 /* avoid baseline shifts */
        width: 100%;
        padding-top: 0 !important;           /* ensure vertical centering */
        padding-bottom: 0 !important;
    }

.nav-item[b-nykvpb40bx]  a.active {
    background-color: rgba(255,255,255,0.37);
    color: white;
}

.nav-item[b-nykvpb40bx]  .nav-link:hover {
    background-color: rgba(255,255,255,0.1);
    color: white;
}

.nav-scrollable[b-nykvpb40bx] {
    display: none;
}

.navbar-toggler:checked ~ .nav-scrollable[b-nykvpb40bx] {
    display: block;
}

@media (min-width: 641px) {
    .navbar-toggler[b-nykvpb40bx] {
        display: none;
    }

    .nav-scrollable[b-nykvpb40bx] {
        display: block;
        height: calc(100vh - 3.5rem);
        overflow-y: auto;
    }
}

.logo-image[b-nykvpb40bx] {
    height: 60px;
    width: auto;
}

/* Collapsed centering overrides */
.sidebar.collapsed .nav-item[b-nykvpb40bx]  .nav-link {
    height: var(--menu-item-height, 3rem) !important;
    line-height: normal !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
}

.sidebar.collapsed .nav-item-link[b-nykvpb40bx] {
    width: var(--collapsed-button-size) !important;
    height: var(--menu-item-height, 3rem) !important;
    margin: 0.25rem auto !important;
    padding: 0 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 0 !important;
}

.sidebar.collapsed .nav-item-link .nav-icon[b-nykvpb40bx] {
    width: 100% !important;
    height: 100% !important;
    margin: 0 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
}

.sidebar.collapsed .nav-item-link .nav-icon i.bi[b-nykvpb40bx] {
    margin: 0 !important;
    position: relative !important;
    top: -1px !important;          /* match expanded state offset */
    line-height: 1 !important;
    font-size: 1.2rem;
}
/* /Components/Layout/ReconnectModal.razor.rz.scp.css */
.components-reconnect-first-attempt-visible[b-gzx4zv0xqs],
.components-reconnect-repeated-attempt-visible[b-gzx4zv0xqs],
.components-reconnect-failed-visible[b-gzx4zv0xqs],
.components-rejoining-animation[b-gzx4zv0xqs] {
    display: none;
}

#components-reconnect-modal.components-reconnect-show .components-reconnect-first-attempt-visible[b-gzx4zv0xqs],
#components-reconnect-modal.components-reconnect-show .components-rejoining-animation[b-gzx4zv0xqs],
#components-reconnect-modal.components-reconnect-retrying[b-gzx4zv0xqs],
#components-reconnect-modal.components-reconnect-retrying .components-reconnect-repeated-attempt-visible[b-gzx4zv0xqs],
#components-reconnect-modal.components-reconnect-retrying .components-rejoining-animation[b-gzx4zv0xqs],
#components-reconnect-modal.components-reconnect-failed[b-gzx4zv0xqs],
#components-reconnect-modal.components-reconnect-failed .components-reconnect-failed-visible[b-gzx4zv0xqs] {
    display: block;
}


#components-reconnect-modal[b-gzx4zv0xqs] {
    background-color: white;
    width: 20rem;
    margin: 20vh auto;
    padding: 2rem;
    border: 0;
    border-radius: 0.5rem;
    box-shadow: 0 3px 6px 2px rgba(0, 0, 0, 0.3);
    opacity: 0;
    transition: display 0.5s allow-discrete, overlay 0.5s allow-discrete;
    animation: components-reconnect-modal-fadeOutOpacity-b-gzx4zv0xqs 0.5s both;
    &[open]

{
    animation: components-reconnect-modal-slideUp-b-gzx4zv0xqs 1.5s cubic-bezier(.05, .89, .25, 1.02) 0.3s, components-reconnect-modal-fadeInOpacity-b-gzx4zv0xqs 0.5s ease-in-out 0.3s;
    animation-fill-mode: both;
}

}

#components-reconnect-modal[b-gzx4zv0xqs]::backdrop {
    background-color: rgba(0, 0, 0, 0.4);
    animation: components-reconnect-modal-fadeInOpacity-b-gzx4zv0xqs 0.5s ease-in-out;
    opacity: 1;
}

@keyframes components-reconnect-modal-slideUp-b-gzx4zv0xqs {
    0% {
        transform: translateY(30px) scale(0.95);
    }

    100% {
        transform: translateY(0);
    }
}

@keyframes components-reconnect-modal-fadeInOpacity-b-gzx4zv0xqs {
    0% {
        opacity: 0;
    }

    100% {
        opacity: 1;
    }
}

@keyframes components-reconnect-modal-fadeOutOpacity-b-gzx4zv0xqs {
    0% {
        opacity: 1;
    }

    100% {
        opacity: 0;
    }
}

.components-reconnect-container[b-gzx4zv0xqs] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 1rem;
}

#components-reconnect-modal p[b-gzx4zv0xqs] {
    margin: 0;
    text-align: center;
}

#components-reconnect-modal button[b-gzx4zv0xqs] {
    border: 0;
    background-color: #6b9ed2;
    color: white;
    padding: 4px 24px;
    border-radius: 4px;
}

    #components-reconnect-modal button:hover[b-gzx4zv0xqs] {
        background-color: #3b6ea2;
    }

    #components-reconnect-modal button:active[b-gzx4zv0xqs] {
        background-color: #6b9ed2;
    }

.components-rejoining-animation[b-gzx4zv0xqs] {
    display: block;
    position: relative;
    width: 80px;
    height: 80px;
}

    .components-rejoining-animation div[b-gzx4zv0xqs] {
        position: absolute;
        border: 3px solid #0087ff;
        opacity: 1;
        border-radius: 50%;
        animation: components-rejoining-animation-b-gzx4zv0xqs 1.5s cubic-bezier(0, 0.2, 0.8, 1) infinite;
    }

        .components-rejoining-animation div:nth-child(2)[b-gzx4zv0xqs] {
            animation-delay: -0.5s;
        }

@keyframes components-rejoining-animation-b-gzx4zv0xqs {
    0% {
        top: 40px;
        left: 40px;
        width: 0;
        height: 0;
        opacity: 0;
    }

    4.9% {
        top: 40px;
        left: 40px;
        width: 0;
        height: 0;
        opacity: 0;
    }

    5% {
        top: 40px;
        left: 40px;
        width: 0;
        height: 0;
        opacity: 1;
    }

    100% {
        top: 0px;
        left: 0px;
        width: 80px;
        height: 80px;
        opacity: 0;
    }
}
/* /Components/MyComponents/DebugComponent.razor.rz.scp.css */
.custom-switch-align[b-s7oxnqkmiw] {
    display: inline-flex;
    align-items: center;
    /* Defaults you can override from markup via style="--switch-width:..; --switch-height:..; --label-font-size:.." */
    --switch-width: 40px;
    --switch-height: 16px;
    --label-font-size: 0.80rem;
}

    .custom-switch-align .form-check-input[b-s7oxnqkmiw] {
        margin-top: 0; /* Bootstrap adds a top margin that misaligns the switch */
        /* Size controls */
        width: var(--switch-width);
        height: var(--switch-height);
        min-width: var(--switch-width);
        min-height: var(--switch-height);
        border-radius: calc(var(--switch-height) / 2); /* keep the pill shape */
        flex: 0 0 auto;
    }

    /* Pointer cursor on both the switch and its label */
    .custom-switch-align .form-check-input[b-s7oxnqkmiw],
    .custom-switch-align .form-check-label[b-s7oxnqkmiw] {
        cursor: pointer;
    }

    .custom-switch-align .form-check-label[b-s7oxnqkmiw] {
        line-height: 1; /* keep label vertically centered with the switch */
        font-size: var(--label-font-size);
    }

/* Remove focus ring/outline on the switch (checkbox) */
.colored-checkbox:focus[b-s7oxnqkmiw],
.colored-checkbox:focus-visible[b-s7oxnqkmiw] {
    outline: none !important;
    box-shadow: none !important; /* overrides Bootstrap's focus ring */
}

/* Firefox inner focus fix */
.colored-checkbox[b-s7oxnqkmiw]::-moz-focus-inner {
    border: 0;
}
/* /Components/MyComponents/SidebarToggle.razor.rz.scp.css */
.sidebar-toggle-btn[b-u7icigtia4] {
    height: 100%;                 /* fill top-row height */
    padding-top: 0;               /* remove extra vertical padding */
    padding-bottom: 0;
    display: inline-flex;         /* center icon nicely */
    align-items: center;
    justify-content: center;
    line-height: 1;

    background-color: var(--pozadina);
    border-color: var(--pozadina);
    color: #fff;

    border-radius: 0 !important;  /* remove rounded corners on all sides */
}

/* Keep the exact same color on hover/active/focus so it matches the sidebar */
.sidebar-toggle-btn:hover[b-u7icigtia4],
.sidebar-toggle-btn:focus[b-u7icigtia4],
.sidebar-toggle-btn:active[b-u7icigtia4],
.sidebar-toggle-btn:active:focus[b-u7icigtia4] {
    background-color: var(--pozadina);
    border-color: var(--pozadina);
    color: #fff;
    box-shadow: none;
    outline: none;
}

/* Optional: adjust icon size a bit for taller button */
.sidebar-toggle-btn i[b-u7icigtia4] {
    font-size: 1.25rem;
}
/* /Components/Pages/CompanyPage.razor.rz.scp.css */
/* ===================== LAYOUT WRAPPER ===================== */
.table-shell[b-j7d3ikkcri] {
    background: #fafafa;
    border: 1px solid #e5e7eb;
    border-radius: .5rem;          /* rounded corners */
    overflow: hidden;              /* clip inner rows/cell backgrounds */
    padding: .4rem .6rem .9rem;
}

/* Optional: ensure consistent spacing model for clean edges */
.companies-table[b-j7d3ikkcri] {
    border-collapse: separate;
    border-spacing: 0;
}

/* ===================== COMPANY TABLE (MAIN) ===================== */
/* Single authoritative block (removed duplicates later in file) */
.companies-table[b-j7d3ikkcri] {
    width: 100%;
    border-collapse: separate !important; /* force for rounded corners */
    border-spacing: 0 10px;               /* vertical gap between �cards� */
    font-size: .78rem;
    background: transparent;
}

/* Remove default inner borders */
.companies-table > :not(caption) > * > *[b-j7d3ikkcri] {
    border-bottom: 0 !important;
    background: transparent;
}

/* Header */
.companies-table thead tr th[b-j7d3ikkcri] {
    border: none;
    font-size: .65rem;
    font-weight: 600;
    letter-spacing: .5px;
    text-transform: uppercase;
    color: #475569;
    background: transparent;
    padding: .55rem .75rem;
    user-select: none;
    white-space: nowrap;
}
/* removed index-col width */
.companies-table thead tr th.actions-col[b-j7d3ikkcri] { width:160px; }
.companies-table thead tr th.w-count[b-j7d3ikkcri] { width:140px; }

/* Row �card� � BEZ pseudo-elementa na <tr> */
.companies-table tbody tr.company-row[b-j7d3ikkcri] {
    /* nema position/background ovde */
}

/* �elije �ine �karticu� (zaobljeni uglovi na prvoj i poslednjoj) */
.companies-table tbody tr.company-row > td[b-j7d3ikkcri] {
    background: #fff;              /* vrati belu pozadinu na �elije */
    position: static;              /* skini z-index traga */
    z-index: auto;
    vertical-align: middle;
    padding: .60rem .85rem;
}

/* Zaobljenja ostaju na prvoj/poslednjoj �eliji */
.companies-table tbody tr.company-row > td:first-child[b-j7d3ikkcri] {
    border-top-left-radius: 12px;
    border-bottom-left-radius: 12px;
}
.companies-table tbody tr.company-row > td:last-child[b-j7d3ikkcri] {
    border-top-right-radius: 12px;
    border-bottom-right-radius: 12px;
}

/* Ukloni prethodne pseudo-elemente i z-index pravila (ako postoje) */
.companies-table tbody tr.company-row[b-j7d3ikkcri]::before,
.companies-table tbody tr.company-row:hover[b-j7d3ikkcri]::before { 
    content: none !important; 
}

/* Company name link */
.company-name[b-j7d3ikkcri] {
    font-size: .78rem;
    font-weight: 600;
    color: #0d4ea2;
    text-transform: uppercase;
    letter-spacing: .15px;
    text-decoration: none;
}
.company-name:hover[b-j7d3ikkcri] { text-decoration: underline; }

/* Meta info row */
.row-meta[b-j7d3ikkcri] {
    margin-top: .10rem;
    display: flex;
    gap: .45rem;
    flex-wrap: wrap;
    font-size: .62rem;
    line-height: 1.1;
}
.meta-chip[b-j7d3ikkcri] {
    background: #f1f5f9;
    color: #475569;
    border-radius: .35rem;
    padding: .15rem .45rem;
    display: inline-flex;
    align-items: center;
    font-weight: 500;
}

/* Count badge */
.count-badge[b-j7d3ikkcri] {
    font-size: .65rem;
    font-weight: 600;
    padding: .35rem .55rem;
    background: #f1f5f9 !important;
    color: #334155;
    border: 1px solid #e2e8f0;
}
.badge-positive[b-j7d3ikkcri] {
    background:#198754 !important;
    color:#fff !important;
    border:1px solid #157347 !important;
    font-size:11px;
    font-weight:600;
}
.badge-zero[b-j7d3ikkcri] { /* inherits default */ }

/* Subtle buttons */
.subtle-btn[b-j7d3ikkcri] {
    background: #f1f5f9;
    border: 1px solid #e2e8f0;
    color: #475569;
    font-size: .7rem;
    padding: .35rem .55rem;
    border-radius: .45rem;
    transition: background .15s, border-color .15s;
}
.subtle-btn:hover[b-j7d3ikkcri] {
    background: #e2e8f0;
    border-color: #cbd5e1;
    color: #1e3a8a;
}
.subtle-btn:active[b-j7d3ikkcri] { background:#dbe3ea; }

/* Search box tweaks */
.search-box .form-control[b-j7d3ikkcri] { font-size: .75rem; }
.search-box .input-group-text[b-j7d3ikkcri] {
    padding: .25rem .5rem;
    font-size: .7rem;
}

/* Client action buttons (used inside company modal client table) */
.client-actions[b-j7d3ikkcri] {
    display: inline-flex;
    gap: .45rem;
}
.client-actions .btn[b-j7d3ikkcri] {
    padding: .30rem .55rem;
    line-height: 1;
}
.client-actions .btn-success[b-j7d3ikkcri] { transition: background .25s, color .25s; }
.client-actions .btn-success i[b-j7d3ikkcri] {
    animation: copyPulse-b-j7d3ikkcri .9s ease;
}
@keyframes copyPulse-b-j7d3ikkcri {
    0% { transform: scale(1); }
    40% { transform: scale(1.25); }
    100% { transform: scale(1); }
}

/* ===================== CLIENTS TABLE (inside modal) ===================== */
.clients-table[b-j7d3ikkcri] {
    border-collapse: separate !important;
    border-spacing: 0 6px;
    background: transparent;
}
.clients-table tbody tr[b-j7d3ikkcri] {
    background:#fff;
    box-shadow:0 0 0 1px #e2e8f0;
    transition:box-shadow .18s ease;
}
.clients-table tbody tr:hover[b-j7d3ikkcri] {
    box-shadow:0 0 0 1px #3b82f6, 0 2px 6px rgba(0,0,0,.06);
}
.clients-table tbody tr td[b-j7d3ikkcri] {
    border:0 !important;
    background:transparent;
    vertical-align:middle;
    padding:.55rem .7rem;
}
.clients-table tbody tr td:first-child[b-j7d3ikkcri] {
    border-top-left-radius:10px;
    border-bottom-left-radius:10px;
}
.clients-table tbody tr td:last-child[b-j7d3ikkcri] {
    border-top-right-radius:10px;
    border-bottom-right-radius:10px;
}

/* Scroll wrapper for clients */
.clients-scroll[b-j7d3ikkcri] {
    max-height: 230px;
    overflow: auto;
    padding: 2px 2px 6px;
}

/* ===================== RESPONSIVE ===================== */
@media (max-width: 900px) {
    .companies-table thead[b-j7d3ikkcri] { display: none; }
    .companies-table[b-j7d3ikkcri],
    .companies-table tbody[b-j7d3ikkcri],
    .companies-table tr[b-j7d3ikkcri],
    .companies-table td[b-j7d3ikkcri] {
        display: block;
        width: 100%;
    }
    .companies-table tbody tr.company-row[b-j7d3ikkcri] {
        box-shadow: 0 0 0 1px #e2e8f0;
        margin-bottom: .75rem;
    }
    /* removed: hide .index-cell */
    .companies-table tbody tr.company-row > td[b-j7d3ikkcri] { padding: .55rem .9rem !important; }
    .count-badge[b-j7d3ikkcri] { align-self: flex-start; }
    .clients-table[b-j7d3ikkcri] { border-spacing:0 10px; }
}

/* Desktop reset: obavezno vrati prave table layout vrednosti iznad 900px */
@media (min-width: 901px) {
    .companies-table[b-j7d3ikkcri] { display: table; table-layout: fixed; width: 100%; }
    .companies-table thead[b-j7d3ikkcri] { display: table-header-group; }
    .companies-table tbody[b-j7d3ikkcri] { display: table-row-group; }
    .companies-table tr[b-j7d3ikkcri] { display: table-row; }
    .companies-table th[b-j7d3ikkcri], .companies-table td[b-j7d3ikkcri] { display: table-cell; vertical-align: middle; }
}

/* �irine kolona (desktop) � dr�e poravnanje headera i �elija */
@media (min-width: 901px) {
    .companies-table th:nth-child(1)[b-j7d3ikkcri], .companies-table td.col-name[b-j7d3ikkcri] { width: 32%; }
    .companies-table th:nth-child(2)[b-j7d3ikkcri], .companies-table td.col-clients[b-j7d3ikkcri] { width: auto; }
    .companies-table th.w-count[b-j7d3ikkcri], .companies-table td.col-count[b-j7d3ikkcri] { width: 140px; }
    .companies-table th.actions-col[b-j7d3ikkcri], .companies-table td.col-actions[b-j7d3ikkcri] { width: 160px; }
}

/* Ul klijenata ostaje u jednom redu sa horizontalnim skrolom */
.companies-table td.col-clients .list-inline[b-j7d3ikkcri] {
    display: flex;
    align-items: center;
    gap: .5rem .95rem;
    flex-wrap: nowrap;
    overflow-x: auto;
    padding-bottom: 2px;
    margin: 0;
    list-style: none;
}
.companies-table td.col-clients .list-inline-item[b-j7d3ikkcri] {
    margin: 0 !important;
    white-space: nowrap;
}

/* tanak scrollbar (opciono) */
.companies-table td.col-clients .list-inline[b-j7d3ikkcri]::-webkit-scrollbar { height: 6px; }
.companies-table td.col-clients .list-inline[b-j7d3ikkcri]::-webkit-scrollbar-thumb {
    background: #cbd5e1; border-radius: 4px;
}

/* ========== Zebra (even/odd) striping for company rows ========== */
.companies-table tbody tr.company-row > td[b-j7d3ikkcri] {
    transition: background-color .15s ease;
}

/* odd row */
.companies-table tbody tr.company-row:nth-child(odd) > td[b-j7d3ikkcri] {
    background-color: #ffffff; /* white */
}

/* even row */
.companies-table tbody tr.company-row:nth-child(even) > td[b-j7d3ikkcri] {
    background-color: #f8fafc; /* subtle slate-50 */
}

/* hover (optional, subtle) */
.companies-table tbody tr.company-row:hover > td[b-j7d3ikkcri] {
    background-color: #eef6ff; /* light blue hover */
}
/* /Components/Pages/DashboardPage.razor.rz.scp.css */
/* === Definitive fix: rounded corners per row, clearly visible =============== */
/* 1) Create a side gutter so corners are not flush with edges */
.online-clients-scroll[b-itkcf5kte0] {
    --row-inset: 12px;
    padding-inline: var(--row-inset) !important;
    background: transparent; /* no masking */
}

/* 2) Remove any td background that was masking the corners */
.table-online-clients tbody tr td[b-itkcf5kte0] {
    background: transparent !important;   /* override earlier zebra-on-td rules */
}

/* 3) Draw the rounded “card” under each row */
.table-online-clients tbody tr[b-itkcf5kte0] {
    position: relative !important;
}
.table-online-clients tbody tr[b-itkcf5kte0]::after {
    content: "" !important;
    position: absolute !important;
    top: 0; bottom: 0;
    left: 0; right: 0;                     /* span full row box */
    border-radius: .55rem !important;
    border: 1px solid #e4e7ec !important;
    background: #fff !important;
    z-index: 0 !important;
    pointer-events: none !important;
}

/* 4) Keep cell content above the card */
.table-online-clients tbody td[b-itkcf5kte0] {
    position: relative !important;
    z-index: 1 !important;
}

/* 5) Put zebra on the card (not on td) so corners stay visible */
.table-online-clients tbody tr:nth-child(odd)[b-itkcf5kte0]::after  { background: #ffffff !important; }
.table-online-clients tbody tr:nth-child(even)[b-itkcf5kte0]::after { background: #f6f8fa !important; }
.table-online-clients tbody tr:hover[b-itkcf5kte0]::after {
    background: #f3f6f9 !important;
    box-shadow: 0 1px 3px rgba(0,0,0,.06) !important;
}

/* 6) Align header with the inset so left/right edges match the rows */
.table-online-clients thead th:first-child[b-itkcf5kte0] { padding-left: calc(.70rem + var(--row-inset)) !important; }
.table-online-clients thead th:last-child[b-itkcf5kte0]  { padding-right: calc(.70rem + var(--row-inset)) !important; }
/* === ROW GAP =============================================================== */
/* Adds vertical spacing between table rows while keeping the rounded cards.  */
/* Tweak --row-gap to control the distance.                                   */
.table-online-clients[b-itkcf5kte0] {
    --row-gap: .6rem;                         /* row spacing */
    border-collapse: separate !important;
    border-spacing: 0 var(--row-gap) !important;
}

/* === Remove inner row dividers (bottom borders on cells) =================== */
/* Bootstrap puts a bottom border on every cell. That line sits above your
   ::after “card” and looks like a divider inside the card. Kill it. */
.table-online-clients > :not(caption) > * > *[b-itkcf5kte0] {
    border-bottom: 0 !important;
    box-shadow: none !important; /* some themes use shadow as divider */
}

/* Keep header separator subtle (we already replaced it with a shadow earlier).
   If you still see a line only under the header, ensure this stays: */
.table-online-clients thead th[b-itkcf5kte0] { border-bottom: 0 !important; }

/* === Smaller font for column captions (headers) ============================ */
/* Append at the very end */
.table-online-clients thead th[b-itkcf5kte0] {
    font-size: .74rem !important;     /* smaller caption text */
    line-height: 1.1 !important;
    padding-top: .40rem !important;   /* slightly tighter header height */
    padding-bottom: .40rem !important;
    letter-spacing: .1px;
}

/* Optional: keep sort icon visually balanced with smaller text */
.table-online-clients thead th .bi[b-itkcf5kte0] {
    font-size: .90em !important;
    vertical-align: baseline;
    margin-left: .25rem;
}

/* Even smaller on narrow screens */
@media (max-width: 992px) {
    .table-online-clients thead th[b-itkcf5kte0] { font-size: .70rem !important; }
}

/* === Center the Client Info modal on screen =================================
   Works regardless of page scroll and container overflows. Place at file end. */
.details-modal[b-itkcf5kte0] {
    position: fixed !important;
    inset: 0 !important;                         /* full viewport overlay */
    display: flex !important;
    align-items: center !important;              /* vertical center */
    justify-content: center !important;          /* horizontal center */
    background: rgba(0,0,0,.50) !important;      /* dim backdrop */
    z-index: 1200 !important;                    /* above page chrome */
}

.details-modal .modal-dialog[b-itkcf5kte0] {
    margin: 0 !important;
    width: min(96vw, 820px) !important;
    max-width: 820px !important;
    transform: none !important;                  /* avoid Bootstrap transforms */
}

.details-modal .modal-content[b-itkcf5kte0] {
    max-height: calc(100dvh - 2rem) !important;  /* keep inside viewport */
    overflow: auto !important;
    border-radius: .75rem !important;
}

/* === Uniform row font size (match "Poslednji bekap") ======================= */
/* Apply to all body cells and neutralize Bootstrap's .small inside cells.    */
/* Place at the very end of the file. */
.table-online-clients tbody td[b-itkcf5kte0] {
    font-size: .875rem !important;    /* same as Bootstrap .small */
    line-height: 1.25 !important;
}

/* If content uses <small> tag or .small class, keep the same size */
.table-online-clients tbody td .small[b-itkcf5kte0],
.table-online-clients tbody td small[b-itkcf5kte0] {
    font-size: inherit !important;
}

/* === Online/Offline tačka ispred SignalR statusa ========================================= */
/* Works with existing markup:
   <span class="status-badge text-success"><span class="status-dot bg-success"></span>Online</span>
   <span class="status-badge text-danger"><span class="status-dot bg-danger"></span>Offline</span> */

.table-online-clients .status-badge[b-itkcf5kte0] {
    display: inline-flex !important;
    align-items: center !important;
    gap: .35rem !important;
    font-weight: 500;
}

.table-online-clients .status-dot[b-itkcf5kte0] {
    display: inline-block !important;
    width: .55rem !important; /* ~9px */
    height: .55rem !important;
    border-radius: 50% !important;
    flex: 0 0 .55rem !important;
    -moz-box-shadow: inherit;
    -webkit-box-shadow: inherit;
    box-shadow: inherit;
    : 0 0 0 2px #fff inset; /* crisp edge on light rows */
}

/* Optional: add a dot in the details modal badge as well */
.details-modal .badge.bg-success[b-itkcf5kte0]::before,
.details-modal .badge.bg-danger[b-itkcf5kte0]::before {
    content: "" !important;
    display: inline-block !important;
    width: .55rem; height: .55rem;
    border-radius: 50%;
    margin-right: .35rem;
    vertical-align: -1px;
    box-shadow: 0 0 0 2px #fff inset;
}
.details-modal .badge.bg-success[b-itkcf5kte0]::before { background-color: var(--bs-success) !important; }
.details-modal .badge.bg-danger[b-itkcf5kte0]::before  { background-color: var(--bs-danger) !important; }






/* === Backup log – compact single-line rows ================================= */
/* Uses existing markup: .event-row with children:
   .evt-time, .evt-icon, .evt-type (badge), .evt-db, .flex-grow-1 (message),
   [size cell], [success flag], [toggle button] */

.backup-log-modal .event-row[b-itkcf5kte0] {
    display: grid !important;
    grid-template-columns:
        92px   /* time */
        22px   /* icon */
        120px  /* type badge */
        minmax(160px, .9fr)  /* db */
        minmax(180px, 1fr)   /* message */
        95px   /* size */
        64px   /* OK/FAIL */
        40px;  /* payload toggle */
    align-items: center !important;
    gap: .35rem .65rem !important;
    padding: .45rem .65rem !important;
    border-bottom: 1px solid #eef2f6 !important;
    font-size: .64rem !important;
}

/* Zebra + hover */
.backup-log-modal .event-row:nth-child(odd)[b-itkcf5kte0] { background: #fff !important; }
.backup-log-modal .event-row:nth-child(even)[b-itkcf5kte0]{ background: #f8fafc !important; }
.backup-log-modal .event-row:hover[b-itkcf5kte0] { background: #f2f6ff !important; }

/* Make long columns truncate on one line */
.backup-log-modal .event-row > *[b-itkcf5kte0] { min-width: 0 !important; }
.backup-log-modal .evt-time[b-itkcf5kte0] { font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; color:#6b7280; }
.backup-log-modal .evt-db[b-itkcf5kte0],
.backup-log-modal .event-row > .flex-grow-1[b-itkcf5kte0] {
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
}

/* Center the small icon col */
.backup-log-modal .evt-icon[b-itkcf5kte0] { display:flex; justify-content:center; }

/* Type badges */
.backup-log-modal .evt-badge[b-itkcf5kte0] {
    display: inline-flex; align-items: center; justify-content: center;
    padding: .15rem .45rem; border-radius: 999px; font-weight: 600;
    font-size: .75rem; line-height: 1;
}
.backup-log-modal .evt-badge.evt-started[b-itkcf5kte0]   { background:#e0f2fe; color:#0369a1; }
.backup-log-modal .evt-badge.evt-phase[b-itkcf5kte0]     { background:#f1f5f9; color:#334155; }
.backup-log-modal .evt-badge.evt-upload[b-itkcf5kte0]    { background:#dcfce7; color:#166534; }
.backup-log-modal .evt-badge.evt-completed[b-itkcf5kte0] { background:#d1fae5; color:#065f46; }
.backup-log-modal .evt-badge.evt-error[b-itkcf5kte0]     { background:#fee2e2; color:#b91c1c; }

/* Size and OK/FAIL pills */
.backup-log-modal .evt-success-flag[b-itkcf5kte0],
.backup-log-modal .evt-fail-flag[b-itkcf5kte0] {
    display:inline-block; min-width: 42px; text-align:center;
    padding:.15rem .4rem; border-radius: .4rem; font-weight:700; font-size:.75rem;
}
.backup-log-modal .evt-success-flag[b-itkcf5kte0] { background:#e8faf0; color:#16794f; border:1px solid #bdebd0; }
.backup-log-modal .evt-fail-flag[b-itkcf5kte0]    { background:#fee8e8; color:#b42318; border:1px solid #f5b3b3; }

/* Backup log JSON payload: ivory background + colored JSON ============== */
.backup-log-modal .payload-json[b-itkcf5kte0] {
    /*background: ivory !important;*/ /* #FFFFF0 */
    color: #111 !important; /* base text for plain content */
    border-color: #e5e7eb !important; /* lighter border on light bg */
    font-size: .70rem !important; /* was ~.78rem */
    line-height: 1.3 !important; /* keep readability with smaller text */
}

/* === Backup log JSON payload: make token colors work with CSS isolation ==== */
/* The JSON is injected as MarkupString, so its inner spans don't get the
   component scope attribute. Use ::deep to target them. */
.backup-log-modal .payload-json[b-itkcf5kte0] {
    font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace !important;
}

.backup-log-modal .payload-json[b-itkcf5kte0]  .json-key {
    color: #8b4513 !important;  /* saddle brown */
    font-weight: 600;
}
.backup-log-modal .payload-json[b-itkcf5kte0]  .json-string {
    color: #1a7f37 !important;  /* green */
}
.backup-log-modal .payload-json[b-itkcf5kte0]  .json-number {
    color: #0a58ca !important;  /* blue */
}
.backup-log-modal .payload_json[b-itkcf5kte0]  .json-bool {
    color: #8b5cf6 !important;  /* violet */
}
.backup-log-modal .payload-json[b-itkcf5kte0]  .json-null,
.backup-log-modal .payload-json[b-itkcf5kte0]  .json-empty {
    color: #6b7280 !important;  /* gray */
    font-style: italic;
}

/* Small polish for the toggle button */
.backup-log-modal .event-row button.btn.btn-sm.btn-outline-secondary[b-itkcf5kte0] {
    padding: .15rem .35rem; line-height:1; border-radius:.35rem;
}

/* Responsive: stack message on two rows when very narrow */
@media (max-width: 700px) {
    .backup-log-modal .event-row[b-itkcf5kte0] {
        grid-template-columns:
            78px 20px 96px 1fr 70px 56px 36px;
        grid-template-areas:
            "time icon type db size ok btn"
            "time icon type msg size ok btn";
    }
    .backup-log-modal .evt-time[b-itkcf5kte0]        { grid-area: time; }
    .backup-log-modal .evt-icon[b-itkcf5kte0]        { grid-area: icon; }
    .backup-log-modal .evt-type[b-itkcf5kte0]        { grid-area: type; }
    .backup-log-modal .evt-db[b-itkcf5kte0]          { grid-area: db; }
    .backup-log-modal .event-row > .flex-grow-1[b-itkcf5kte0] { grid-area: msg; }

}

/* === Platform column: center header + narrower width ====================== */
/*.table-online-clients thead th.col-platform { 
    text-align: center !important; 
}
.table-online-clients td.col-platform { 
    text-align: center !important; 
}
.table-online-clients .col-platform {
    width: 56px !important;*/          /* was 70px */
    /*max-width: 56px !important;
    white-space: nowrap !important;
    padding-left: .20rem !important;
    padding-right: .20rem !important;
}*/

/* === Name column: make it wider ========================================== */
.table-online-clients thead th.col-name[b-itkcf5kte0],
.table-online-clients tbody td.col-name[b-itkcf5kte0] {
    width: 280px !important;          /* was inline 220px in the header */
    min-width: 260px !important;
}


/* === Page header sizing ==================================================== */
/* Attach sizing to .pageheader so you can control height from one place */
.pageheader[b-itkcf5kte0] {
    --ph-height: 46px;           /* change this to control component height */
    --ph-radius: .375rem;
    --ph-pad-x: .55rem;
    --ph-font: .875rem;
}

/* Search box (input-group) */
.pageheader .searchbox .input-group-text[b-itkcf5kte0],
.pageheader .searchbox .btn[b-itkcf5kte0],
.pageheader .searchbox .form-control[b-itkcf5kte0] {
    height: var(--ph-height) !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    border-radius: var(--ph-radius) !important;
    font-size: var(--ph-font) !important;
}

.pageheader .searchbox .input-group-text[b-itkcf5kte0] {
    padding-left: var(--ph-pad-x) !important;
    padding-right: var(--ph-pad-x) !important;
    border-top-right-radius: 0 !important;
    border-bottom-right-radius: 0 !important;
    width:35px;
}


    .pageheader .searchbox .form-control[b-itkcf5kte0] {
        padding-left: var(--ph-pad-x) !important;
        padding-right: var(--ph-pad-x) !important;
        border-top-left-radius: 0 !important;
        border-bottom-left-radius: 0 !important;
    }

/* “Clear” button inside search */
.pageheader .searchbox .btn.btn-clear[b-itkcf5kte0] {
    padding-left: var(--ph-pad-x) !important;
    padding-right: var(--ph-pad-x) !important;
    display: inline-flex !important;
    align-items: center !important;
}

/* “Izaberi kolone” button */
.pageheader .controls-button[b-itkcf5kte0] {
    height: var(--ph-height) !important;
    padding-left: var(--ph-pad-x) !important;
    padding-right: var(--ph-pad-x) !important;
    border-radius: var(--ph-radius) !important;
    display: inline-flex !important;
    align-items: center !important;
    font-size: var(--ph-font) !important;
}

/* Optional: compact icons inside controls */
.pageheader .controls-button i[b-itkcf5kte0],
.pageheader .searchbox i[b-itkcf5kte0] {
    font-size: .95em;
}

/* === Quick actions: tiny spacing between buttons ========================== */
.table-online-clients .col-actions .btn-group[b-itkcf5kte0] {
    gap: 1px; /* modern browsers */
}
.table-online-clients .col-actions .btn-group > .btn + .btn[b-itkcf5kte0] {
    margin-left: 2px !important; /* override Bootstrap's -1px collapse */
}

/* Also apply small gaps in the client details modal quick actions */
.details-modal .modal-actions[b-itkcf5kte0] {
    display: inline-flex !important;
    gap: 2px !important;
}

/* Quick actions: make “Restartuj servis” and “Restartuj Hotelier” icons blue */
.table-online-clients .col-actions .bi-arrow-clockwise[b-itkcf5kte0],
.table-online-clients .col-actions .icon-letter[b-itkcf5kte0] {
    color: var(--bs-primary) !important;
}

/* Modal quick actions as well */
.details-modal .modal-actions .bi-arrow-clockwise[b-itkcf5kte0],
.details-modal .modal-actions .icon-letter[b-itkcf5kte0] {
    color: var(--bs-primary) !important;
}

/* Info panel: Copy buttons (ClientId + Phones) — borderless, turn green briefly */
.details-modal .btn-icon-copy[b-itkcf5kte0],
.details-modal .phone-copy-btn[b-itkcf5kte0] {
    border: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    padding: .125rem .2rem !important;
    line-height: 1 !important;
    color: #6c757d !important;                 /* muted by default */
    cursor: pointer !important;
    transition: color .15s ease, background-color .15s ease, transform .15s ease;
}

.details-modal .btn-icon-copy i[b-itkcf5kte0],
.details-modal .phone-copy-btn i[b-itkcf5kte0] {
    transition: color .15s ease, transform .15s ease;
}

/* Hover hint (optional) */
.details-modal .btn-icon-copy:hover i[b-itkcf5kte0],
.details-modal .phone-copy-btn:hover i[b-itkcf5kte0] {
    color: var(--bs-primary) !important;
}

/* After click: the code adds .copied for ~3s → tint green */
.details-modal .btn-icon-copy.copied[b-itkcf5kte0],
.details-modal .phone-copy-btn.copied[b-itkcf5kte0] {
    background-color: rgba(25, 135, 84, .10) !important; /* subtle green tint */
    border-radius: .375rem !important;
}

.details-modal .btn-icon-copy.copied i[b-itkcf5kte0],
.details-modal .phone-copy-btn.copied i[b-itkcf5kte0] {
    color: var(--bs-success) !important; /* green icon */
    transform: scale(1.05);
}

/* === Row update highlight (yellow overlay that fades) ===================== */
/* Ensure cell content sits above overlays (bump z-index to 2) */
.table-online-clients tbody td[b-itkcf5kte0] {
    z-index: 2 !important;
}

/* Use ::before as a non-layout overlay above the zebra card (::after) */
.table-online-clients tbody tr.recent-update[b-itkcf5kte0]::before {
    content: none !important;
}

/* Highlight using the existing ::after “card” with an inset tint */
.table-online-clients tbody tr.recent-update[b-itkcf5kte0]::after {
    animation: rowUpdatedTint-b-itkcf5kte0 6s ease-out forwards !important;
}

/* Don’t override highlight on hover */
.table-online-clients tbody tr:not(.recent-update):hover[b-itkcf5kte0]::after {
    background: #f3f6f9 !important;
    box-shadow: 0 1px 3px rgba(0,0,0,.06) !important;
}

@keyframes rowUpdatedTint-b-itkcf5kte0 {
    0%, 85% {
        box-shadow:
            inset 0 0 0 9999px rgba(255, 243, 205, 1),
            0 1px 3px rgba(0,0,0,.06);
    }
    100% {
        box-shadow:
            inset 0 0 0 0 rgba(255, 243, 205, 0),
            0 1px 3px rgba(0,0,0,.06);
    }
}

.rooms-count[b-itkcf5kte0] {
    font-size: 0.78rem;
    line-height: 1;
}

.text-disk[b-itkcf5kte0]{
    font-size:0.68rem;
}

.text-verzija[b-itkcf5kte0]{
    font-size:0.75rem;
}

.text-company[b-itkcf5kte0]{
    font-size:0.75rem;
}

.text-baza[b-itkcf5kte0] {
    font-size: 0.75rem;
}

/* Bigger, blinking warning icon for tabs */
.tab-warn-icon[b-itkcf5kte0] {
    font-size: 0.90rem; /* keep current size; adjust if needed */
    line-height: 1;
    vertical-align: middle;
    color: var(--bs-danger, #dc3545) !important; /* force red */
    filter: drop-shadow(0 0 2px rgba(220, 53, 69, .45)); /* red glow */
    will-change: opacity, transform;
}

.blink[b-itkcf5kte0] {
    animation: warn-blink-b-itkcf5kte0 1.35s ease-in-out infinite;
}

@keyframes warn-blink-b-itkcf5kte0 {
    0%, 100% {
        opacity: 1;
        transform: scale(.9);
    }

    50% {
        opacity: .35;
        transform: scale(1.35);
    }
}