/* =============================================================================
   nimi-bs5.css  –  UI modernizace, Fáze 1
   -----------------------------------------------------------------------------
   Design systém „Direction A" nad Bootstrap 5.3. Načítá se v _LayoutBs5.cshtml
   PO bootstrap.min.css. Dvě části:
     1) přemapování BS5 CSS proměnných (--bs-*) na nimi tokeny
     2) vrstva vlastních komponent s prefixem .nimi-*

   Viz Documentations/ui-modernizace-bootstrap5/02-komponenty.md
   ========================================================================== */

:root {
    /* --- nimi tokeny (shodné s nimi-theme.css / Direction A) --- */
    --nimi-primary:        #2f74cf;
    --nimi-primary-hover:  #2861b4;
    --nimi-primary-tint:   #eef4fc;
    --nimi-bg:             #f5f7fa;
    --nimi-surface:        #ffffff;
    --nimi-border:         #e4e8ef;
    --nimi-border-strong:  #d5dbe4;
    --nimi-hairline:       #eef1f6;
    --nimi-thead-bg:       #fafbfc;
    --nimi-text:           #1b2733;
    --nimi-text-secondary: #5a6673;
    --nimi-text-muted:     #8b96a3;
    --nimi-success:        #1f7a4d;
    --nimi-success-bg:     #e6f4ec;
    --nimi-warning:        #8a5a00;
    --nimi-warning-bg:     #fbf0d9;
    --nimi-danger:         #c0392b;
    --nimi-radius-card:    10px;
    --nimi-radius-control: 7px;
    --nimi-shadow:         0 1px 2px rgba(16,24,40,.04), 0 1px 3px rgba(16,24,40,.08);
    --nimi-shadow-pop:     0 10px 30px rgba(16,24,40,.14), 0 2px 6px rgba(16,24,40,.08);
    --nimi-font-sans: "IBM Plex Sans", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
    --nimi-font-mono: "IBM Plex Mono", ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;

    /* --- přemapování Bootstrapu --- */
    --bs-primary: var(--nimi-primary);
    --bs-primary-rgb: 47, 116, 207;
    --bs-link-color: var(--nimi-primary);
    --bs-link-color-rgb: 47, 116, 207;
    --bs-link-hover-color: var(--nimi-primary-hover);
    --bs-body-bg: var(--nimi-bg);
    --bs-body-color: var(--nimi-text);
    --bs-body-color-rgb: 27, 39, 51;
    --bs-emphasis-color: var(--nimi-text);
    --bs-secondary-color: var(--nimi-text-secondary);
    --bs-tertiary-color: var(--nimi-text-muted);
    --bs-border-color: var(--nimi-border);
    --bs-border-color-translucent: var(--nimi-border);
    --bs-border-radius: var(--nimi-radius-control);
    --bs-border-radius-sm: 5px;
    --bs-border-radius-lg: var(--nimi-radius-card);
    --bs-font-sans-serif: var(--nimi-font-sans);
    --bs-body-font-family: var(--nimi-font-sans);
    --bs-body-font-size: 0.875rem;       /* 14px */
    --bs-body-line-height: 1.5;
    --bs-emphasis-color-rgb: 27, 39, 51;
}

body {
    -webkit-font-smoothing: antialiased;
    background: var(--nimi-bg);
}

code, kbd, pre, samp, .nimi-mono { font-family: var(--nimi-font-mono); }
::selection { background: rgba(47,116,207,.18); }

/* ---- tlačítka --------------------------------------------------------------- */

.btn { --bs-btn-font-weight: 500; --bs-btn-border-radius: var(--nimi-radius-control); }
.btn-primary {
    --bs-btn-bg: var(--nimi-primary);
    --bs-btn-border-color: var(--nimi-primary);
    --bs-btn-hover-bg: var(--nimi-primary-hover);
    --bs-btn-hover-border-color: var(--nimi-primary-hover);
    --bs-btn-active-bg: var(--nimi-primary-hover);
    --bs-btn-active-border-color: var(--nimi-primary-hover);
    --bs-btn-disabled-bg: var(--nimi-primary);
    --bs-btn-disabled-border-color: var(--nimi-primary);
}
.btn-outline-secondary {
    --bs-btn-color: var(--nimi-text-secondary);
    --bs-btn-border-color: var(--nimi-border-strong);
    --bs-btn-hover-bg: #f4f6fa;
    --bs-btn-hover-color: var(--nimi-text);
    --bs-btn-hover-border-color: var(--nimi-border-strong);
    --bs-btn-active-bg: #eef1f6;
    --bs-btn-active-color: var(--nimi-text);
    --bs-btn-active-border-color: var(--nimi-border-strong);
}
.btn-outline-primary {
    --bs-btn-color: var(--nimi-primary);
    --bs-btn-border-color: #d6e5fa;
    --bs-btn-bg: var(--nimi-primary-tint);
    --bs-btn-hover-bg: #e0ecfb;
    --bs-btn-hover-color: var(--nimi-primary-hover);
    --bs-btn-hover-border-color: #cadffb;
}
.btn-danger { --bs-btn-bg: var(--nimi-danger); --bs-btn-border-color: var(--nimi-danger); }
.btn-light { --bs-btn-bg: #fff; --bs-btn-border-color: var(--nimi-border-strong); }
.btn-sm { --bs-btn-border-radius: 6px; }

/* ---- formuláře ------------------------------------------------------------ */

.form-control, .form-select {
    border-color: var(--nimi-border-strong);
    border-radius: var(--nimi-radius-control);
    min-height: 38px;
    font-size: .84rem;
}
.form-control:focus, .form-select:focus {
    border-color: var(--nimi-primary);
    box-shadow: 0 0 0 3px rgba(47,116,207,.15);
}
.form-label { font-weight: 600; font-size: .78rem; color: #3a4753; margin-bottom: .35rem; }
.form-text { color: var(--nimi-text-muted); font-size: .74rem; }
.form-control.is-invalid, .was-validated .form-control:invalid { border-color: var(--nimi-danger); }
.input-group-text { background: var(--nimi-thead-bg); border-color: var(--nimi-border-strong); }
.form-check-input:checked { background-color: var(--nimi-primary); border-color: var(--nimi-primary); }
.form-check-input:focus { border-color: var(--nimi-primary); box-shadow: 0 0 0 3px rgba(47,116,207,.15); }

/* ---- karty / tabulky / modály ------------------------------------------- */

.card {
    --bs-card-border-color: var(--nimi-border);
    --bs-card-border-radius: var(--nimi-radius-card);
    --bs-card-cap-bg: var(--nimi-thead-bg);
    box-shadow: var(--nimi-shadow);
}
.card > .card-header { font-weight: 600; border-bottom-color: var(--nimi-hairline); }

.table {
    --bs-table-border-color: var(--nimi-hairline);
    font-size: .84rem;
    color: var(--nimi-text);
}
.table > thead {
    --bs-table-bg: var(--nimi-thead-bg);
}
.table > thead > tr > th {
    text-transform: uppercase;
    font-size: .69rem;
    font-weight: 600;
    letter-spacing: .05em;
    color: var(--nimi-text-muted);
    border-bottom: 1px solid var(--nimi-border);
    padding: .65rem .75rem;
    white-space: nowrap;
}
.table > tbody > tr > td { padding: .7rem .75rem; vertical-align: middle; }
.table-hover > tbody > tr:hover > td { --bs-table-bg-state: #f7f9fc; }

.modal-content { border: none; border-radius: 12px; box-shadow: 0 24px 60px rgba(16,24,40,.28); }
.modal-header, .modal-footer { border-color: var(--nimi-hairline); }
.modal-title { font-weight: 600; }

.dropdown-menu {
    --bs-dropdown-border-color: var(--nimi-border);
    --bs-dropdown-border-radius: var(--nimi-radius-card);
    --bs-dropdown-link-hover-bg: var(--nimi-primary-tint);
    --bs-dropdown-link-hover-color: var(--nimi-primary);
    --bs-dropdown-link-active-bg: var(--nimi-primary-tint);
    --bs-dropdown-link-active-color: var(--nimi-primary);
    --bs-dropdown-padding-y: .35rem;
    --bs-dropdown-border-width: 1px;
    box-shadow: var(--nimi-shadow-pop);
}
.dropdown-item { border-radius: 6px; padding: .5rem .6rem; font-size: .84rem; }
.dropdown-menu { padding-left: .35rem; padding-right: .35rem; }

.badge { font-weight: 500; }
.nav-tabs { --bs-nav-tabs-border-color: var(--nimi-border); }
.nav-link { color: var(--nimi-text-secondary); }
.nav-link.active { color: var(--nimi-text); }
.breadcrumb { --bs-breadcrumb-font-size: .78rem; --bs-breadcrumb-divider-color: #c2cad4; }
.pagination { --bs-pagination-color: var(--nimi-primary); --bs-pagination-active-bg: var(--nimi-primary); --bs-pagination-active-border-color: var(--nimi-primary); }
.alert { --bs-alert-border-radius: 8px; }

/* X.PagedList (@Html.PagedListPager) renderuje <div.pagination-container><ul.pagination>
   s holými <li><a> BEZ .page-item/.page-link – BS5 je pak nestyluje a čísla splývají.
   Selektor cílí jen na <li> BEZ .page-item, takže hand-rolled BS5 pagery
   (Release/_List apod. s .page-item/.page-link) zůstávají nedotčené. */
.pagination-container { margin-top: 1rem; }
.pagination > li:not(.page-item) { display: flex; }
.pagination > li:not(.page-item) > a,
.pagination > li:not(.page-item) > span {
    display: inline-flex; align-items: center; justify-content: center;
    min-width: 36px; height: 36px; padding: 0 .65rem;
    margin-left: -1px;
    border: 1px solid var(--nimi-border);
    background: var(--nimi-surface);
    color: var(--nimi-primary);
    font-size: .82rem;
    text-decoration: none;
}
.pagination > li:not(.page-item):first-child > a,
.pagination > li:not(.page-item):first-child > span {
    margin-left: 0;
    border-top-left-radius: var(--nimi-radius-control);
    border-bottom-left-radius: var(--nimi-radius-control);
}
.pagination > li:not(.page-item):last-child > a,
.pagination > li:not(.page-item):last-child > span {
    border-top-right-radius: var(--nimi-radius-control);
    border-bottom-right-radius: var(--nimi-radius-control);
}
.pagination > li:not(.page-item) > a:hover { background: var(--nimi-primary-tint); }
.pagination > li:not(.page-item).active > span,
.pagination > li:not(.page-item).active > a {
    background: var(--nimi-primary); border-color: var(--nimi-primary); color: #fff;
}
.pagination > li:not(.page-item).disabled > span,
.pagination > li:not(.page-item).disabled > a {
    color: var(--nimi-text-muted); pointer-events: none; background: var(--nimi-surface);
}

/* =============================================================================
   Vrstva vlastních komponent .nimi-*
   ========================================================================== */

/* ikona ze sprite */
.nimi-ic {
    display: inline-block;
    vertical-align: -.15em;
    fill: none;
    stroke: currentColor;
    stroke-width: 2;
    stroke-linecap: round;
    stroke-linejoin: round;
    flex-shrink: 0;
}

/* --- horní lišta ------------------------------------------------------------ */
.nimi-topbar {
    background: var(--nimi-primary);
    min-height: 56px;
    box-shadow: 0 1px 3px rgba(16,24,40,.10);
    padding: 0 1.25rem;
    --bs-navbar-color: rgba(255,255,255,.82);
    --bs-navbar-hover-color: #fff;
    --bs-navbar-active-color: #fff;
    --bs-navbar-toggler-border-color: rgba(255,255,255,.35);
    --bs-navbar-toggler-icon-bg: 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.92%29' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e");
}
.nimi-topbar .nimi-brand { color: #fff; font-weight: 700; font-size: 1.125rem; letter-spacing: 1.5px; }
.nimi-topbar .nimi-brand-sub { color: rgba(255,255,255,.82); font-size: .8rem; font-weight: 500; }
.nimi-topbar .navbar-nav .nav-link {
    color: rgba(255,255,255,.82);
    font-size: .84rem;
    font-weight: 500;
    padding: .5rem .85rem;
    border-radius: var(--nimi-radius-control);
}
.nimi-topbar .navbar-nav .nav-link:hover,
.nimi-topbar .navbar-nav .nav-link:focus { color: #fff; background: rgba(255,255,255,.14); }
.nimi-topbar .navbar-nav .nav-link.active,
.nimi-topbar .navbar-nav .show > .nav-link { color: #fff; background: rgba(255,255,255,.16); font-weight: 600; }
.nimi-topbar .nimi-avatar {
    width: 30px; height: 30px; border-radius: 50%;
    background: #dbe8f8; color: var(--nimi-primary);
    font-size: .72rem; font-weight: 700;
    display: inline-flex; align-items: center; justify-content: center;
}
.nimi-topbar .dropdown-menu { margin-top: .4rem; }

/* --- obsahová stránka ---------------------------------------------------- */
.nimi-page { padding: 1.375rem 1.75rem 2.5rem; }
.nimi-page-header { margin-bottom: 1.25rem; }
.nimi-page-header .nimi-crumbs { font-size: .78rem; color: var(--nimi-text-muted); margin-bottom: .5rem; display: flex; align-items: center; gap: .4rem; }
.nimi-page-header h1 { font-size: 1.3rem; font-weight: 600; letter-spacing: -.01em; margin: 0; }
.nimi-page-header .nimi-page-sub { font-size: .82rem; color: var(--nimi-text-muted); }

/* --- sekční navigace na editačních obrazovkách ------------------------- */
.nimi-section-nav { position: sticky; top: 1.25rem; }
.nimi-section-nav .list-group-item {
    border: none; border-radius: var(--nimi-radius-control);
    font-size: .82rem; color: var(--nimi-text-secondary);
    padding: .55rem .7rem; display: flex; align-items: center; justify-content: space-between;
}
.nimi-section-nav .list-group-item.active { background: var(--nimi-primary-tint); color: var(--nimi-text); font-weight: 600; }
.nimi-section-nav .list-group-item .badge { background: var(--nimi-hairline); color: var(--nimi-text-muted); }

/* --- stavový odznak ---------------------------------------------------------- */
.nimi-status { display: inline-flex; align-items: center; gap: .4rem; font-size: .75rem; font-weight: 500; border-radius: 20px; padding: .2rem .6rem; }
.nimi-status::before { content: ""; width: 6px; height: 6px; border-radius: 50%; background: currentColor; }
.nimi-status--active   { color: var(--nimi-success); background: var(--nimi-success-bg); }
.nimi-status--draft    { color: var(--nimi-warning); background: var(--nimi-warning-bg); }
.nimi-status--inactive { color: var(--nimi-text-secondary); background: var(--nimi-hairline); }

/* --- řádkové akce (kebab) ------------------------------------------------- */
.nimi-kebab {
    width: 28px; height: 28px; padding: 0;
    display: inline-flex; align-items: center; justify-content: center;
    border: none; background: transparent; color: var(--nimi-text-muted);
    border-radius: 6px;
}
.nimi-kebab:hover, .nimi-kebab[aria-expanded="true"] { background: var(--nimi-primary-tint); color: var(--nimi-primary); }
.nimi-row-actions .dropdown-item.text-danger { --bs-dropdown-link-hover-bg: #fdecea; --bs-dropdown-link-hover-color: var(--nimi-danger); }

/* --- verze / mono chip ------------------------------------------------------- */
.nimi-chip { font-family: var(--nimi-font-mono); font-size: .72rem; color: #3a4753; background: var(--nimi-hairline); border-radius: 5px; padding: .18rem .42rem; }

/* --- kódový blok (Config) --------------------------------------------------- */
.nimi-code { border: 1px solid var(--nimi-border-strong); border-radius: 8px; overflow: hidden; display: flex; font-family: var(--nimi-font-mono); font-size: .78rem; line-height: 1.7; background: #fbfcfe; }
.nimi-code .nimi-code-gutter { padding: .75rem .6rem; text-align: right; color: #c2cad4; background: #f4f6fa; border-right: 1px solid var(--nimi-border); user-select: none; white-space: pre; }
.nimi-code pre { margin: 0; padding: .75rem .9rem; overflow-x: auto; color: #3a4753; white-space: pre; flex: 1; }

/* --- treetable / strom (dokud běží jquery.treetable) --------------------- */
.nimi-tree .indenter { color: var(--nimi-text-muted); }
.nimi-tree-child > td:first-child { padding-left: 2.5rem; }

/* --- prázdný stav --------------------------------------------------------- */
.nimi-empty { text-align: center; padding: 2.5rem 1rem; color: var(--nimi-text-muted); }
.nimi-empty .nimi-ic { width: 28px; height: 28px; margin-bottom: .5rem; opacity: .6; }

/* --- entity picker (Tom Select) ---------------------------------------------- */
.nimi-entity-picker .ts-wrapper { margin: 0; }
.ts-wrapper.single .ts-control,
.ts-wrapper.multi .ts-control {
    border-color: var(--nimi-border-strong);
    border-radius: var(--nimi-radius-control);
    min-height: 38px;
    font-size: .84rem;
    box-shadow: none;
}
.ts-wrapper.focus .ts-control {
    border-color: var(--nimi-primary);
    box-shadow: 0 0 0 3px rgba(47, 116, 207, .15);
}
.ts-dropdown {
    border-color: var(--nimi-border);
    border-radius: var(--nimi-radius-card);
    box-shadow: var(--nimi-shadow-pop);
    font-size: .84rem;
}
.ts-dropdown .active { background: var(--nimi-primary-tint); color: var(--nimi-primary); }
.ts-wrapper.multi .ts-control > .item {
    background: var(--nimi-primary-tint);
    color: var(--nimi-primary);
    border-color: #d6e5fa;
    border-radius: 5px;
}

/* --- toolbar nad tabulkou ---------------------------------------------------- */
.nimi-toolbar { display: flex; align-items: center; justify-content: space-between; gap: .75rem; margin-bottom: .9rem; }
.nimi-search { display: flex; align-items: center; gap: .5rem; background: #fff; border: 1px solid var(--nimi-border-strong); border-radius: 8px; height: 38px; padding: 0 .75rem; min-width: 260px; }
.nimi-search input { border: none; outline: none; font-size: .84rem; width: 100%; background: transparent; }

/* --- loading overlay (port ze styles.css – v BS5 layoutu se styles.css nenačítá) --- */
#loader-pg.loading-screen {
    position: fixed; inset: 0; z-index: 2000;
    width: 100%; height: 100%;
    background: rgba(16, 24, 40, .45);
}
#loader-pg .loader {
    position: absolute; left: 50%; top: 50%;
    width: 64px; height: 64px; margin: -32px 0 0 -32px;
    border: 5px solid rgba(255, 255, 255, .35);
    border-top-color: #fff;
    border-radius: 50%;
    animation: nimi-spin 1s linear infinite;
}
@keyframes nimi-spin { to { transform: rotate(360deg); } }
