/*
    DataScope - jednotný vzhled aplikace nad Bootstrapem 5.

    Načítá se jako poslední styl (fragment web/fragments/brand_theme.html), takže přebíjí Bootswatch
    i starší styles.css. Barva firmy přichází z context processoru jako --brand a --brand-text.
*/

@font-face {
    font-family: "Inter";
    font-style: normal;
    font-display: swap;
    font-weight: 100 900;
    src: url("../fonts/inter-latin-ext-wght-normal.ad4eb06671be.woff2") format("woff2-variations");
    unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329,
    U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

@font-face {
    font-family: "Inter";
    font-style: normal;
    font-display: swap;
    font-weight: 100 900;
    src: url("../fonts/inter-latin-wght-normal.8e433c0592f7.woff2") format("woff2-variations");
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329,
    U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

:root {
    /* Barva firmy - výchozí hodnoty, přepisuje je brand_theme.html */
    --brand: #d9a145;
    --brand-text: #111827;
    --brand-ink: color-mix(in srgb, var(--brand) 62%, #000);
    --brand-soft: color-mix(in srgb, var(--brand) 12%, #fff);
    --brand-hover: color-mix(in srgb, var(--brand) 88%, #000);

    /* Neutrální barvy */
    --ds-bg: #f5f6f8;
    --ds-surface: #ffffff;
    --ds-surface-muted: #f9fafb;
    --ds-border: #e5e7eb;
    --ds-text: #111827;
    --ds-muted: #6b7280;
    --ds-nav-bg: #0f172a;
    --ds-border-strong: #d1d5db;
    --ds-track: #eef0f3;

    /* Stavové barvy (štítky, upozornění) */
    --ds-success-bg: #dcfce7;
    --ds-success-fg: #166534;
    --ds-info-bg: #e0e7ff;
    --ds-info-fg: #3730a3;
    --ds-warning-bg: #fef3c7;
    --ds-warning-fg: #92400e;
    --ds-warning-soft: #fffbeb;
    --ds-warning-border: #fde68a;
    --ds-warning-text: #b45309;
    --ds-danger-bg: #fee2e2;
    --ds-danger-fg: #991b1b;
    --ds-danger-soft: #fef2f2;
    --ds-danger-border: #fecaca;
    --ds-danger-text: #b91c1c;
    --ds-neutral-bg: #f1f5f9;
    --ds-neutral-fg: #334155;

    --ds-radius: 14px;
    --ds-radius-sm: 10px;
    --ds-shadow-sm: 0 1px 2px rgba(16, 24, 40, .04), 0 1px 3px rgba(16, 24, 40, .06);
    --ds-shadow-md: 0 6px 14px -4px rgba(16, 24, 40, .08), 0 2px 4px -2px rgba(16, 24, 40, .04);
    --ds-shadow-lg: 0 18px 36px -12px rgba(16, 24, 40, .18), 0 6px 12px -6px rgba(16, 24, 40, .06);
    --ds-focus-ring: 0 0 0 3px color-mix(in srgb, var(--brand) 30%, transparent);

    /* Proměnné ze starších stylů, ať navazující šablony vypadají stejně */
    --label: var(--ds-text);
    --secondaryLabel: var(--ds-muted);
    --faintBorder: var(--ds-border);
    --background: var(--ds-surface);
    --martes-brand: var(--ds-nav-bg);
    --martes-complementary: var(--brand-ink);
    --primary: var(--brand);

    /* Bootstrap 5 proměnné napojené na barvu firmy a neutrální barvy */
    --brand-rgb: 217, 161, 69;
    --bs-primary: var(--brand);
    --bs-primary-rgb: var(--brand-rgb);
    --bs-link-color: var(--brand-ink);
    --bs-link-hover-color: var(--brand);
    --bs-body-bg: var(--ds-bg);
    --bs-body-color: var(--ds-text);
    --bs-secondary-color: var(--ds-muted);
    --bs-border-color: var(--ds-border);
    --bs-body-font-family: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
    --bs-border-radius: var(--ds-radius-sm);
    --bs-focus-ring-color: color-mix(in srgb, var(--brand) 30%, transparent);
}

/* Tmavý motiv - data-bs-theme na <html> nastavuje skript v brand_theme.html podle volby uživatele */
[data-bs-theme="dark"] {
    color-scheme: dark;

    --brand-ink: color-mix(in srgb, var(--brand) 55%, #fff);
    --brand-soft: color-mix(in srgb, var(--brand) 18%, var(--ds-surface));
    --brand-hover: color-mix(in srgb, var(--brand) 85%, #fff);

    --ds-bg: #0b1120;
    --ds-surface: #141c2b;
    --ds-surface-muted: #1b2536;
    --ds-border: #263247;
    --ds-border-strong: #34425a;
    --ds-track: #263247;
    --ds-text: #e5e7eb;
    --ds-muted: #9ca3af;
    --ds-nav-bg: #050a16;

    --ds-shadow-sm: 0 1px 2px rgba(0, 0, 0, .4);
    --ds-shadow-md: 0 4px 10px -2px rgba(0, 0, 0, .5);
    --ds-shadow-lg: 0 12px 28px -6px rgba(0, 0, 0, .6);

    --ds-success-bg: rgba(34, 197, 94, .16);
    --ds-success-fg: #86efac;
    --ds-info-bg: rgba(99, 102, 241, .2);
    --ds-info-fg: #c7d2fe;
    --ds-warning-bg: rgba(245, 158, 11, .18);
    --ds-warning-fg: #fcd34d;
    --ds-warning-soft: rgba(245, 158, 11, .08);
    --ds-warning-border: rgba(245, 158, 11, .3);
    --ds-warning-text: #fbbf24;
    --ds-danger-bg: rgba(239, 68, 68, .18);
    --ds-danger-fg: #fca5a5;
    --ds-danger-soft: rgba(239, 68, 68, .1);
    --ds-danger-border: rgba(239, 68, 68, .35);
    --ds-danger-text: #f87171;
    --ds-neutral-bg: #1f2937;
    --ds-neutral-fg: #cbd5e1;

    /* Bootstrap 5 tmavé proměnné napojené na naše */
    --bs-body-bg: var(--ds-bg);
    --bs-body-color: var(--ds-text);
    --bs-emphasis-color: #fff;
    --bs-secondary-color: var(--ds-muted);
    --bs-secondary-bg: var(--ds-surface-muted);
    --bs-tertiary-bg: var(--ds-surface-muted);
    --bs-border-color: var(--ds-border);
    --bs-border-color-translucent: rgba(255, 255, 255, .1);
    --bs-link-color: var(--brand-ink);
    --bs-link-hover-color: var(--brand);
    --bs-heading-color: var(--ds-text);
}

/* ---------- Základ ---------- */

body {
    font-family: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
    font-size: .9375rem;
    color: var(--ds-text);
    background-color: var(--ds-bg) !important;
    -webkit-font-smoothing: antialiased;
}

h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6 {
    font-family: inherit;
    color: var(--ds-text);
    font-weight: 600;
    letter-spacing: -.01em;
}

a, .btn-link {
    color: var(--brand-ink);
}

a:hover, .btn-link:hover {
    color: var(--brand-ink);
    text-decoration: underline;
}

/* Bootstrap 5 podtrhává odkazy vždy - držíme dřívější chování (podtržení jen při najetí) */
a, .btn-link {
    text-decoration: none;
}

.btn:hover, .dropdown-item:hover, .nav-link:hover, .page-link:hover {
    text-decoration: none;
}

/* Velikosti písma ovládacích prvků jako v předchozí verzi (Bootstrap 5 je má o stupeň větší) */
.btn {
    --bs-btn-font-size: .875rem;
}

.btn-lg {
    --bs-btn-font-size: 1.0625rem;
}

.btn-sm {
    --bs-btn-font-size: .8125rem;
}

.form-control, .form-select, .input-group-text {
    font-size: .875rem;
}

.dropdown-menu {
    --bs-dropdown-font-size: .875rem;
}

.table {
    font-size: .875rem;
}

.text-muted, .secondary-text {
    color: var(--ds-muted) !important;
}

hr {
    background-color: var(--ds-border);
}

@media (min-width: 1200px) {
    .container {
        max-width: 1160px;
    }
}

.ds-avatar {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2rem;
    height: 2rem;
    border-radius: 50%;
    background: var(--brand);
    color: var(--brand-text);
    font-weight: 600;
    font-size: .85rem;
    flex-shrink: 0;
}

.ds-avatar-lg {
    width: 2.75rem;
    height: 2.75rem;
    font-size: 1rem;
}

/* ---------- Rozbalovací menu ---------- */

.dropdown-menu {
    border: 1px solid var(--ds-border);
    border-radius: var(--ds-radius);
    box-shadow: var(--ds-shadow-lg);
    padding: .4rem;
    min-width: 14rem;
}

.dropdown-item,
#settingsDropdownMenu .dropdown-item {
    border-radius: 6px;
    padding: .5rem .65rem;
    display: flex;
    align-items: center;
    gap: .6rem;
    color: var(--ds-text);
}

.dropdown-item:hover,
.dropdown-item:focus {
    background: var(--ds-surface-muted);
    color: var(--ds-text);
    text-decoration: none;
}

.dropdown-item:active {
    background: var(--brand-soft);
    color: var(--ds-text);
}

.dropdown-item svg,
.dropdown-item:hover svg {
    width: 18px;
    height: 18px;
    color: var(--ds-muted);
    flex-shrink: 0;
}

.dropdown-divider {
    margin: .35rem 0;
    border-color: var(--ds-border);
}

.ds-dropdown-header {
    padding: .5rem .65rem .6rem;
    display: flex;
    align-items: center;
    gap: .65rem;
}

.ds-dropdown-header .name {
    font-weight: 600;
    line-height: 1.2;
}

.ds-dropdown-header .meta {
    color: var(--ds-muted);
    font-size: .8rem;
}

/* ---------- Tlačítka ---------- */

.btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: .45rem;
    min-height: 40px;
    padding: .45rem 1rem;
    border-radius: var(--ds-radius-sm);
    font-weight: 500;
    transition: background-color .15s, border-color .15s, color .15s, box-shadow .15s, transform .1s;
}

.btn:active {
    transform: scale(.98);
}

.btn-sm {
    min-height: 34px;
    padding: .3rem .75rem;
}

.btn-link {
    min-height: 0;
    padding: 0;
}

.btn:focus, .btn.focus {
    box-shadow: var(--ds-focus-ring);
}

.btn-primary,
.btn-primary:not(:disabled):not(.disabled):active {
    background: var(--brand) !important;
    border-color: var(--brand) !important;
    color: var(--brand-text) !important;
    box-shadow: 0 1px 2px rgba(16, 24, 40, .1), inset 0 1px 0 rgba(255, 255, 255, .22);
}

.btn-primary:hover {
    background: var(--brand-hover) !important;
    border-color: var(--brand-hover) !important;
}

.btn-outline-primary {
    color: var(--ds-text);
    border-color: var(--ds-border-strong);
    background: var(--ds-surface);
    box-shadow: 0 1px 2px rgba(16, 24, 40, .04);
}

.btn-outline-primary:hover,
.btn-outline-primary:not(:disabled):not(.disabled):active {
    color: var(--ds-text);
    background: var(--ds-surface-muted);
    border-color: var(--ds-border-strong);
}

.btn-standard {
    color: var(--ds-text);
    border-color: var(--ds-border);
    background: var(--ds-surface);
}

.btn-standard:hover {
    color: var(--ds-text);
    background: var(--ds-surface-muted);
}

.btn-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2.1rem;
    height: 2.1rem;
    padding: 0;
    color: var(--ds-muted);
    border: 1px solid transparent;
    background: transparent;
}

.btn-icon:hover {
    color: var(--ds-text);
    background: var(--ds-surface-muted);
    border-color: var(--ds-border);
}

.btn-icon svg {
    width: 18px;
    height: 18px;
}

/* ---------- Karty ---------- */

.card {
    border: 1px solid var(--ds-border);
    border-radius: var(--ds-radius);
}

.subtle-elevation-shadow {
    box-shadow: var(--ds-shadow-sm);
    border-radius: var(--ds-radius);
}

.ds-card {
    background: var(--ds-surface);
    border: 1px solid var(--ds-border);
    border-radius: var(--ds-radius);
    box-shadow: var(--ds-shadow-sm);
}

.ds-card-interactive {
    transition: box-shadow .15s, transform .15s, border-color .15s;
}

.ds-card-interactive:hover {
    box-shadow: var(--ds-shadow-md);
    transform: translateY(-2px);
    border-color: var(--ds-border-strong);
}

/* ---------- Dlaždice dashboardu (fragment redesigned_service_card.html) ---------- */
.ds-tile {
    position: relative;
    display: flex;
    flex-direction: column;
    border-radius: 14px;
    overflow: hidden;
    border: 1px solid var(--ds-border);
    background: var(--ds-surface);
    color: var(--ds-text);
    box-shadow: var(--ds-shadow-sm);
    transition: box-shadow .2s ease, transform .2s var(--ds-ease, ease), border-color .2s ease;
}

.ds-tile:hover,
.ds-tile:focus-visible {
    text-decoration: none;
    color: var(--ds-text);
    border-color: color-mix(in srgb, var(--brand) 45%, var(--ds-border));
    box-shadow: var(--ds-shadow-lg);
    transform: translateY(-3px);
}

.ds-tile:active {
    transform: translateY(-1px) scale(.995);
}

.ds-tile-preview {
    position: relative;
    aspect-ratio: 16 / 10;
    overflow: hidden;
    background: var(--ds-surface-muted);
    border-bottom: 1px solid var(--ds-border);
}

.ds-tile-preview #placeholder-image,
.ds-tile-preview #preview-image {
    height: 100%;
    border: none;
    transition: transform .4s var(--ds-ease, ease);
}

.ds-tile:hover .ds-tile-preview #preview-image {
    transform: scale(1.03);
}

.ds-tile-preview img {
    display: none;
}

.ds-tile-body {
    display: flex;
    flex-direction: column;
    gap: .1rem;
    padding: .7rem .85rem .8rem;
    min-width: 0;
}

.ds-tile .ds-tile-name {
    font-size: .875rem;
    font-weight: 600;
    line-height: 1.3;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.ds-tile-meta {
    font-size: .75rem;
    color: var(--ds-muted);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.ds-tile-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(210px, 1fr));
    gap: 1rem;
}

/* ---------- Záhlaví stránky ---------- */

.ds-page {
    padding-top: 2.5rem;
    padding-bottom: 4.5rem;
    animation: ds-page-in .35s cubic-bezier(.2, .8, .2, 1) both;
}

@keyframes ds-page-in {
    from {
        opacity: 0;
        transform: translateY(6px);
    }
}

.ds-page-header {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-end;
    justify-content: space-between;
    gap: 1rem;
    margin-bottom: 1.75rem;
}

.ds-page-header h1 {
    font-size: clamp(1.5rem, 2.2vw, 1.9rem);
    font-weight: 650;
    letter-spacing: -.022em;
    margin: 0;
}

.ds-page-header p {
    color: var(--ds-muted);
    margin: .3rem 0 0;
}

.accent-divider {
    display: none;
}

/* ---------- Formuláře ---------- */

.form-control,
.form-select {
    border: 1px solid var(--ds-border-strong);
    border-radius: var(--ds-radius-sm);
    min-height: 2.75rem;
    transition: border-color .15s ease, box-shadow .15s ease;
    color: var(--ds-text);
    background-color: var(--ds-surface);
}

.form-control:focus,
.form-select:focus,
.form-check-input:focus {
    border-color: var(--brand);
    box-shadow: var(--ds-focus-ring);
}

label, .col-form-label {
    font-weight: 500;
    color: var(--ds-text);
    margin-bottom: .35rem;
}

.form-text {
    color: var(--ds-muted);
}

.form-check-input:checked {
    background-color: var(--brand);
    border-color: var(--brand);
}

/* Přepínače: ručně psané (.form-switch) i z crispy formulářů (checkbox s role="switch") */
.form-check:has(> .form-check-input[role="switch"]) {
    padding-left: 2.5em;
}

.form-check-input[role="switch"] {
    --bs-form-switch-bg: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='rgba%280, 0, 0, 0.25%29'/%3e%3c/svg%3e");
    width: 2em;
    margin-left: -2.5em;
    background-image: var(--bs-form-switch-bg);
    background-position: left center;
    border-radius: 2em;
    transition: background-position .15s ease-in-out;
}

.form-switch .form-check-input:focus,
.form-check-input[role="switch"]:focus {
    --bs-form-switch-bg: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='rgba%280, 0, 0, 0.25%29'/%3e%3c/svg%3e");
}

.form-check-input[role="switch"]:checked {
    background-position: right center;
    --bs-form-switch-bg: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='%23fff'/%3e%3c/svg%3e");
}

.form-check-label {
    font-weight: 400;
}

/* ---------- Štítky, ukazatele, tabulky ---------- */

.badge {
    font-weight: 600;
    border-radius: 999px;
    padding: .3em .65em;
    font-size: .7rem;
    letter-spacing: .01em;
}

.badge.text-bg-success {
    background: var(--ds-success-bg) !important;
    color: var(--ds-success-fg) !important;
}

.badge.text-bg-primary {
    background: var(--ds-info-bg) !important;
    color: var(--ds-info-fg) !important;
}

.badge.text-bg-warning {
    background: var(--ds-warning-bg) !important;
    color: var(--ds-warning-fg) !important;
}

.badge.text-bg-danger {
    background: var(--ds-danger-bg) !important;
    color: var(--ds-danger-fg) !important;
}

.badge.text-bg-info, .badge.text-bg-secondary {
    background: var(--ds-neutral-bg) !important;
    color: var(--ds-neutral-fg) !important;
}

.progress {
    height: .5rem;
    border-radius: 999px;
    background: var(--ds-track);
}

.progress-bar {
    border-radius: 999px;
    background-color: var(--brand);
}

.progress-bar.bg-success {
    background-color: #22c55e !important;
}

.progress-bar.bg-warning {
    background-color: #f59e0b !important;
}

.table {
    color: var(--ds-text);
}

table.pretty-table-header {
    border: 1px solid var(--ds-border);
    border-radius: var(--ds-radius);
    border-collapse: separate;
    border-spacing: 0;
    overflow: hidden;
    background: var(--ds-surface);
}

table.pretty-table-header thead tr {
    background-color: var(--ds-surface-muted);
    color: var(--ds-muted);
    border: none;
}

table.pretty-table-header th {
    font-size: .75rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: .04em;
}

.page-item.active .page-link {
    background-color: var(--brand);
    border-color: var(--brand);
    color: var(--brand-text);
}

.page-link {
    color: var(--ds-text);
}

/* ---------- Hlášky ---------- */

.alert {
    border-radius: var(--ds-radius-sm);
}

.notification {
    border-radius: var(--ds-radius);
    box-shadow: var(--ds-shadow-lg);
    border-left-color: var(--brand) !important;
}

/* ---------- Prázdný stav ---------- */

.ds-empty-state {
    text-align: center;
    padding: 4rem 1.5rem;
    max-width: 34rem;
    margin: 2rem auto;
}

.ds-empty-state .icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 3.5rem;
    height: 3.5rem;
    border-radius: 50%;
    background: var(--brand-soft);
    color: var(--brand-ink);
    margin-bottom: 1.25rem;
}

.ds-empty-state .icon svg {
    width: 1.6rem;
    height: 1.6rem;
}

.ds-empty-state h2 {
    font-size: 1.2rem;
}

.ds-empty-state p {
    color: var(--ds-muted);
}

/* ---------- Karty uživatelů ---------- */

.ds-user-card {
    display: flex;
    flex-direction: column;
}

.ds-user-card-header {
    display: flex;
    align-items: flex-start;
    gap: .75rem;
    padding: 1.1rem 1.1rem .5rem;
}

.ds-user-card-header .badge {
    margin-left: auto;
    flex-shrink: 0;
}

.ds-user-card-title {
    min-width: 0;
    display: flex;
    flex-direction: column;
}

.ds-user-card-title .name {
    font-weight: 600;
    color: var(--ds-text);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.ds-user-card-title .email {
    color: var(--ds-muted);
    font-size: .825rem;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.ds-user-card-meta {
    color: var(--ds-muted);
    font-size: .85rem;
    padding: 0 1.1rem;
    margin: .25rem 0 1rem;
}

.ds-user-card-actions {
    margin-top: auto;
    display: flex;
    align-items: center;
    gap: .25rem;
    padding: .5rem .6rem .5rem 1.1rem;
    border-top: 1px solid var(--ds-border);
    font-size: .875rem;
    font-weight: 500;
}

/* ---------- Mřížka karet ---------- */

.services-grid {
    grid-template-columns: repeat(auto-fill, minmax(250px, 1fr));
    gap: 1rem;
}

/* ---------- Využití licencí ---------- */

.ds-usage {
    padding: 1.5rem;
}

.ds-usage h2 {
    font-size: 1.05rem;
    margin-bottom: 1.25rem;
}

.ds-usage-row + .ds-usage-row {
    margin-top: 1.1rem;
}

.ds-usage-row .label {
    display: flex;
    justify-content: space-between;
    font-size: .875rem;
    margin-bottom: .4rem;
}

.ds-usage-row .label span:last-child {
    color: var(--ds-muted);
    font-variant-numeric: tabular-nums;
}

/* ---------- Karty položek (služby, složky, reporty) ---------- */

.ds-item-card {
    display: flex;
    flex-direction: column;
    height: 100%;
}

.ds-item-header {
    display: flex;
    align-items: flex-start;
    gap: .75rem;
    padding: 1rem 1.1rem;
}

.ds-item-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2.25rem;
    height: 2.25rem;
    border-radius: 10px;
    background: var(--brand-soft);
    color: var(--brand-ink);
    flex-shrink: 0;
}

.ds-item-icon svg {
    width: 1.15rem;
    height: 1.15rem;
    margin: 0 !important;
    stroke: currentColor;
}

.ds-item-title {
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: .1rem;
}

.ds-item-title .name {
    font-weight: 600;
    color: var(--ds-text);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    height: auto;
    display: block;
}

.ds-item-title .sub {
    color: var(--ds-muted);
    font-size: .825rem;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.ds-item-meta {
    color: var(--ds-muted);
    font-size: .85rem;
    padding: 0 1.1rem;
    margin: -.25rem 0 1rem;
}

.ds-item-actions {
    margin-top: auto;
    display: flex;
    align-items: center;
    gap: .25rem;
    min-height: 3rem;
    padding: .45rem .6rem .45rem 1.1rem;
    border-top: 1px solid var(--ds-border);
    font-size: .875rem;
    font-weight: 500;
}

.ds-item-actions form {
    margin: 0;
}

.ds-item-actions .btn-link {
    font-size: .875rem;
    font-weight: 500;
}

.btn-icon-danger:hover {
    color: var(--ds-danger-text);
    background: var(--ds-danger-soft);
    border-color: var(--ds-danger-border);
}

.text-warning {
    color: var(--ds-warning-text) !important;
}

/* ---------- Sekce na stránce ---------- */

.ds-section {
    margin-top: 2.5rem;
}

.ds-section-header {
    margin-bottom: 1rem;
}

.ds-section-header h2 {
    font-size: 1.1rem;
    margin: 0;
}

.ds-section-header p {
    color: var(--ds-muted);
    margin: .2rem 0 0;
    font-size: .875rem;
}

.ds-chips {
    display: flex;
    flex-wrap: wrap;
    gap: .4rem;
}

.ds-chip {
    display: inline-flex;
    align-items: center;
    padding: .3rem .75rem;
    border-radius: 999px;
    border: 1px solid var(--ds-border);
    background: var(--ds-surface);
    color: var(--ds-text);
    font-size: .8rem;
    font-weight: 500;
}

.ds-chip:hover {
    text-decoration: none;
    color: var(--ds-text);
    border-color: var(--brand);
    background: var(--brand-soft);
}

.ds-toolbar {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 1rem;
    margin-bottom: .5rem;
}

.ds-toolbar .form-control {
    max-width: 22rem;
}

.ds-page-actions {
    display: flex;
    flex-wrap: wrap;
    gap: .5rem;
}

/* ---------- Detail (služba, uživatel, složka) ---------- */

.ds-breadcrumb {
    display: inline-flex;
    align-items: center;
    gap: .35rem;
    font-size: .85rem;
    color: var(--ds-muted);
    margin-bottom: .35rem;
}

.ds-breadcrumb svg {
    width: 1rem;
    height: 1rem;
}

.ds-detail-grid {
    display: grid;
    grid-template-columns: minmax(0, 2fr) minmax(0, 1fr);
    gap: 1.25rem;
    align-items: start;
}

@media (max-width: 860px) {
    .ds-detail-grid {
        grid-template-columns: minmax(0, 1fr);
    }
}

.ds-panel {
    padding: 1.25rem 1.4rem;
}

.ds-panel + .ds-panel {
    margin-top: 1.25rem;
}

.ds-panel > h2 {
    font-size: 1rem;
    margin-bottom: 1rem;
}

.ds-panel-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    margin-bottom: 1rem;
}

.ds-panel-header h2 {
    font-size: 1rem;
    margin: 0;
}

.ds-panel-header p {
    color: var(--ds-muted);
    font-size: .85rem;
    margin: .15rem 0 0;
}

.ds-field + .ds-field {
    margin-top: 1.1rem;
}

.ds-field-label {
    display: block;
    font-size: .75rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: .04em;
    color: var(--ds-muted);
    margin-bottom: .3rem;
}

.ds-field-value {
    word-wrap: break-word;
    white-space: pre-line;
}

.ds-dl {
    margin: 0;
}

.ds-dl > div {
    display: flex;
    justify-content: space-between;
    gap: 1rem;
    padding: .55rem 0;
    border-bottom: 1px solid var(--ds-border);
    font-size: .875rem;
}

.ds-dl > div:last-child {
    border-bottom: none;
    padding-bottom: 0;
}

.ds-dl > div:first-child {
    padding-top: 0;
}

.ds-dl dt {
    font-weight: 500;
    color: var(--ds-muted);
}

.ds-dl dd {
    margin: 0;
    text-align: right;
    min-width: 0;
    overflow-wrap: anywhere;
}

.ds-preview-frame {
    border: 1px solid var(--ds-border);
    border-radius: var(--ds-radius-sm);
    overflow: hidden;
    background: var(--ds-surface-muted);
}

.ds-preview-frame iframe {
    display: block;
    width: 100% !important;
    min-height: 420px;
    border: 0;
}

.ds-activity-item {
    padding: .65rem .85rem;
    border-radius: var(--ds-radius-sm);
    background: var(--ds-warning-soft);
    border: 1px solid var(--ds-warning-border);
    font-size: .875rem;
}

.ds-activity-item + .ds-activity-item {
    margin-top: .5rem;
}

.ds-activity-item time {
    display: block;
    color: var(--ds-warning-fg);
    font-size: .75rem;
}

.ds-danger-link,
.ds-danger-link:hover {
    color: var(--ds-danger-text) !important;
}

.dropdown-item.ds-danger-link:hover {
    background: var(--ds-danger-soft);
}

/* ---------- Formuláře a mazání jako karta ---------- */

.sheet-container,
.form-container,
.delete-form-container {
    background: var(--ds-surface);
    border: 1px solid var(--ds-border);
    border-radius: 16px;
    box-shadow: var(--ds-shadow-sm);
    padding: 2rem 2rem 1.75rem !important;
    margin-top: 2.5rem !important;
    margin-bottom: 4rem !important;
    width: calc(100% - 2rem);
    margin-inline: auto !important;
}

.sheet-container {
    max-width: 560px;
}

.delete-form-container {
    max-width: 540px;
}

.form-container {
    max-width: 760px !important;
    flex: none;
}

@media (max-width: 576px) {
    .sheet-container,
    .form-container,
    .delete-form-container {
        padding: 1.5rem 1.25rem 1.25rem !important;
    }
}

.sheet-container.content-card {
    margin-inline: auto;
}

.sheet-container > h4:first-child,
.form-container > h4:first-child,
.delete-form-container > h3:first-child,
.sheet-container > h3:first-child {
    font-size: 1.4rem;
    font-weight: 600;
    margin-bottom: .5rem;
}

.sheet-container > h4:first-child + form,
.form-container > h4:first-child + form {
    margin-top: 1.5rem;
}

.form-container > h6,
.sheet-container > h6 {
    color: var(--ds-muted);
    font-weight: 400;
    font-size: .9rem;
}

.form-confirm-btn {
    max-width: none;
    width: auto;
    display: inline-block;
    padding-inline: 1.5rem;
}

.btn-danger {
    background: #dc2626;
    border-color: #dc2626;
    color: #fff;
}

.btn-danger:hover {
    background: #b91c1c;
    border-color: #b91c1c;
}

.list-group-item {
    border-color: var(--ds-border);
}

.list-group-item:first-child {
    border-top-left-radius: var(--ds-radius-sm);
    border-top-right-radius: var(--ds-radius-sm);
}

.list-group-item:last-child {
    border-bottom-left-radius: var(--ds-radius-sm);
    border-bottom-right-radius: var(--ds-radius-sm);
}

/* Editor Summernote */
.note-editor.note-frame {
    border-color: var(--ds-border-strong);
    border-radius: var(--ds-radius-sm);
}

/* ---------- Starší záhlaví stránek (clearfix + h4 + h5) ---------- */

.container > .clearfix:first-child {
    margin-bottom: 1.75rem;
}

.container > .clearfix:first-child h4.fw-bolder {
    font-size: 1.6rem;
    font-weight: 600;
    margin-bottom: .3rem;
}

.container > .clearfix:first-child h5 {
    font-size: .9375rem;
    font-weight: 400;
    color: var(--ds-muted) !important;
}

.card.p-4 h3 {
    font-size: 1.15rem;
}

.card.p-4 {
    box-shadow: var(--ds-shadow-sm);
}

/* ---------- Přihlášení, obnova hesla, registrace (karta uprostřed) ---------- */

.login-page {
    background: radial-gradient(ellipse at top, var(--brand-soft), var(--ds-bg) 60%);
    min-height: 100vh;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 2rem 1rem;
}

.login-card {
    width: 100%;
    max-width: 420px;
    padding: 2.5rem 2.25rem 2rem;
    border-radius: 16px;
    box-shadow: var(--ds-shadow-lg);
}

.login-card .logo {
    text-align: center;
    margin-bottom: 2rem;
}

.login-card .logo img {
    max-height: 72px;
    max-width: 100%;
    width: auto;
}

.login-card h1 {
    font-size: 1.25rem;
    text-align: center;
    margin-bottom: .35rem;
}

.login-card .subtitle {
    text-align: center;
    color: var(--ds-muted);
    margin-bottom: 1.75rem;
}

.login-card .asteriskField {
    display: none;
}

.login-card .form-control {
    min-height: 2.85rem;
}

.login-divider {
    display: flex;
    align-items: center;
    gap: .75rem;
    color: var(--ds-muted);
    font-size: .8rem;
    margin: 1.5rem 0 1.25rem;
}

.login-divider::before,
.login-divider::after {
    content: "";
    flex: 1;
    height: 1px;
    background: var(--ds-border);
}

#google-sign-in-button {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: .6rem;
    background: var(--ds-surface) !important;
    color: var(--ds-text) !important;
    border: 1px solid var(--ds-border-strong) !important;
    font-size: .95rem;
}

#google-sign-in-button:hover {
    background: var(--ds-surface-muted) !important;
}

#google-sign-in-button.disabled {
    opacity: .55;
}

.login-footer {
    margin-top: 1.5rem;
    color: var(--ds-muted);
    font-size: .8rem;
}

.login-card p {
    color: var(--ds-text);
}

.login-card form .btn-primary {
    margin-top: 1rem;
}

/* Zvýraznění sudých řádků v tabulkách jen jemně */
.table-active,
.table-active > td,
.table-active > th {
    background-color: var(--ds-surface-muted);
}

.ds-error-code {
    font-size: 3.5rem;
    font-weight: 700;
    letter-spacing: -.03em;
    line-height: 1;
    color: var(--brand-ink);
    margin-bottom: .75rem;
}

.btn-secondary,
.btn-secondary:not(:disabled):not(.disabled):active {
    background: var(--ds-surface);
    border-color: var(--ds-border);
    color: var(--ds-text);
}

.btn-secondary:hover {
    background: var(--ds-surface-muted);
    border-color: var(--ds-border-strong);
    color: var(--ds-text);
}

/* ---------- Nastavení uživatele: výběr motivu ---------- */

.ds-theme-options {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
    gap: .75rem;
}

.ds-theme-option {
    display: flex;
    flex-direction: column;
    gap: .5rem;
    padding: .6rem;
    border: 1px solid var(--ds-border);
    border-radius: var(--ds-radius);
    background: var(--ds-surface);
    cursor: pointer;
    margin: 0;
    transition: border-color .15s, box-shadow .15s;
}

.ds-theme-option:hover {
    border-color: var(--ds-border-strong);
}

.ds-theme-option:has(input:checked) {
    border-color: var(--brand);
    box-shadow: var(--ds-focus-ring);
}

.ds-theme-option:has(input:focus-visible) {
    outline: 2px solid var(--brand);
    outline-offset: 2px;
}

.ds-theme-option input {
    position: absolute;
    opacity: 0;
    pointer-events: none;
}

.ds-theme-label {
    font-weight: 500;
    text-align: center;
    font-size: .875rem;
}

/* Malý náhled stránky: lišta + dvě karty */
.ds-theme-preview {
    --p-bg: #f4f5f7;
    --p-card: #ffffff;
    --p-line: #e5e7eb;
    position: relative;
    display: block;
    height: 76px;
    border-radius: var(--ds-radius-sm);
    background: var(--p-bg);
    border: 1px solid var(--p-line);
    overflow: hidden;
}

.ds-theme-preview-dark {
    --p-bg: #0b1120;
    --p-card: #141c2b;
    --p-line: #263247;
}

.ds-theme-preview-system {
    background: linear-gradient(90deg, #f4f5f7 50%, #0b1120 50%);
}

.ds-theme-preview-system .card-b {
    background: #141c2b;
    border-color: #263247;
}

.ds-theme-preview .bar {
    position: absolute;
    inset: 0 auto 0 0;
    width: 18px;
    background: #0f172a;
}

.ds-theme-preview .bar::after {
    content: "";
    position: absolute;
    left: 5px;
    top: 7px;
    width: 8px;
    height: 8px;
    border-radius: 3px;
    background: var(--brand);
}

.ds-theme-preview .card-a,
.ds-theme-preview .card-b {
    position: absolute;
    top: 14px;
    width: 34%;
    height: 46px;
    border-radius: 6px;
    background: var(--p-card);
    border: 1px solid var(--p-line);
}

.ds-theme-preview .card-a {
    left: 26%;
}

.ds-theme-preview .card-b {
    right: 5%;
}

/* Editor Summernote v tmavém motivu */
[data-bs-theme="dark"] .note-editor .note-toolbar,
[data-bs-theme="dark"] .note-editor .note-statusbar {
    background: var(--ds-surface-muted);
    border-color: var(--ds-border);
}

[data-bs-theme="dark"] .note-editor .note-btn {
    background: var(--ds-surface);
    color: var(--ds-text);
    border-color: var(--ds-border);
}

[data-bs-theme="dark"] .note-editor .note-editing-area .note-editable {
    background: var(--ds-surface);
    color: var(--ds-text);
}

.embed-container:fullscreen {
    background: var(--ds-surface);
}

.embed-container:fullscreen tableau-viz,
.embed-container:fullscreen iframe {
    height: 100% !important;
}

/* Úvodní stránka: pozdrav, hledání, oblíbené, naposledy otevřené, složky */
.ds-hero {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-end;
    justify-content: space-between;
    gap: 1.25rem 2rem;
    margin-bottom: 2.25rem;
}

.ds-hero h1 {
    margin: 0;
    font-size: clamp(1.6rem, 2.4vw, 2.1rem);
    font-weight: 650;
    letter-spacing: -.025em;
}

.ds-hero p {
    margin: .35rem 0 0;
    color: var(--ds-muted);
}

.ds-home-section {
    margin-bottom: 2.5rem;
}

.ds-section-head {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: .75rem;
    margin-bottom: 1rem;
}

.ds-section-head h2 {
    display: flex;
    align-items: center;
    gap: .65rem;
    min-width: 0;
    margin: 0;
    font-size: 1.05rem;
    font-weight: 600;
}

.ds-section-head h2 a {
    color: var(--ds-text);
    white-space: nowrap;
}

.ds-section-desc {
    color: var(--ds-muted);
    font-size: .85rem;
    font-weight: 400;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.ds-section-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    flex-shrink: 0;
    border-radius: 9px;
    background: var(--brand-soft);
    color: var(--brand-ink);
}

.ds-section-icon .ds-icon {
    width: 17px;
    height: 17px;
}

.ds-section-icon.is-star {
    background: color-mix(in srgb, #f5b301 16%, var(--ds-surface));
    color: #f5b301;
}

.ds-section-icon.is-star .ds-icon {
    fill: #f5b301;
}

.ds-section-link {
    display: inline-flex;
    align-items: center;
    gap: .2rem;
    flex-shrink: 0;
    min-height: 30px;
    padding: 0 .55rem 0 .75rem;
    border-radius: 999px;
    font-size: .8rem;
    font-weight: 600;
    white-space: nowrap;
    background: var(--brand-soft);
    color: var(--brand-ink);
    transition: background .15s ease, color .15s ease;
}

.ds-section-link:hover {
    background: var(--brand);
    color: var(--brand-text);
    text-decoration: none;
}

.ds-section-link .ds-icon {
    width: 16px;
    height: 16px;
}

/* Přehled využívání */
.ds-usage-stats {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 1rem;
    margin-bottom: 1.25rem;
}

.ds-stat {
    padding: 1.1rem 1.4rem;
    display: flex;
    flex-direction: column;
    gap: .2rem;
}

.ds-stat-value {
    font-size: 1.75rem;
    font-weight: 600;
    line-height: 1.2;
    font-variant-numeric: tabular-nums;
}

.ds-stat-value small {
    font-size: .95rem;
    color: var(--ds-muted);
    font-weight: 500;
}

.ds-stat-label {
    color: var(--ds-muted);
    font-size: .85rem;
}

.ds-daily-chart {
    display: flex;
    align-items: flex-end;
    gap: 2px;
    height: 120px;
}

.ds-daily-bar {
    flex: 1;
    height: 100%;
    display: flex;
    align-items: flex-end;
    background: var(--ds-track);
    border-radius: 3px;
}

.ds-daily-bar span {
    display: block;
    width: 100%;
    min-height: 0;
    background: var(--brand);
    border-radius: 3px;
}

.ds-daily-axis {
    display: flex;
    justify-content: space-between;
    color: var(--ds-muted);
    font-size: .75rem;
    margin-top: .35rem;
}

.ds-usage-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(420px, 1fr));
    gap: 1.25rem;
    margin-top: 1.25rem;
}

.ds-usage-grid .ds-panel + .ds-panel {
    margin-top: 0;
}

@media (max-width: 575.98px) {
    .ds-usage-grid {
        grid-template-columns: 1fr;
    }
}

.ds-usage-list {
    list-style: none;
    padding: 0;
    margin: 0;
    font-size: .875rem;
}

.ds-usage-list li {
    display: flex;
    justify-content: space-between;
    gap: 1rem;
    padding: .45rem 0;
    border-bottom: 1px solid var(--ds-border);
}

.ds-usage-list li:last-child {
    border-bottom: 0;
}

.ds-usage-list li span {
    color: var(--ds-muted);
    white-space: nowrap;
}

/* Formulář skupiny: dlouhé seznamy zaškrtávátek se posouvají */
.ds-group-form #div_id_members fieldset > div:has(> .form-check),
.ds-group-form #div_id_folders fieldset > div:has(> .form-check),
.ds-group-form #div_id_services fieldset > div:has(> .form-check) {
    max-height: 260px;
    overflow-y: auto;
    border: 1px solid var(--ds-border);
    border-radius: 8px;
    padding: .5rem .75rem;
    background: var(--ds-surface);
}

/* Skupiny: přístup ze skupiny, skupiny na detailu uživatele */
.ds-group-source {
    font-size: .8rem;
    color: var(--bs-secondary-color);
}

.ds-group-chip {
    display: inline-block;
    margin: 0 .35rem .35rem 0;
    padding: .2rem .6rem;
    border: 1px solid var(--bs-border-color);
    border-radius: 999px;
    font-size: .85rem;
    text-decoration: none;
}

/* ---------- Dotykové ovládání (iPad, tablet): cíle aspoň 44 px ---------- */
@media (pointer: coarse) {
    .btn {
        min-height: 44px;
    }

    .btn-sm {
        min-height: 38px;
    }

    .btn-icon {
        width: 44px;
        height: 44px;
    }

    .form-control,
    .form-select {
        min-height: 48px;
        font-size: 1rem;   /* iPad nezvětšuje stránku při psaní */
    }

    .dropdown-item {
        min-height: 44px;
    }

    .form-check-input {
        width: 1.25em;
        height: 1.25em;
    }
}

/* Klávesnice: viditelné zaměření jen při ovládání klávesnicí */
:focus-visible {
    outline: 2px solid color-mix(in srgb, var(--brand) 70%, transparent);
    outline-offset: 2px;
}

.form-control:focus-visible,
.form-select:focus-visible {
    outline: none;
}

::selection {
    background: color-mix(in srgb, var(--brand) 28%, transparent);
}

@media (prefers-reduced-motion: reduce) {
    .ds-page {
        animation: none;
    }

    .ds-tile,
    .ds-card-interactive,
    .btn {
        transition: none;
    }
}

/* ---------- Nápověda ve formuláři dashboardu (univerzální vložení) ---------- */
.ds-help-box {
    border: 1px solid var(--ds-border);
    border-radius: var(--ds-radius);
    background: var(--ds-surface-muted);
}

.ds-help-toggle {
    display: flex;
    align-items: center;
    gap: .6rem;
    width: 100%;
    min-height: 48px;
    padding: .7rem 1rem;
    border: 0;
    background: transparent;
    color: var(--ds-text);
    font-weight: 600;
    text-align: left;
}

.ds-help-toggle > .ds-icon:first-child {
    color: var(--brand-ink);
}

.ds-help-toggle span {
    flex: 1 1 auto;
}

.ds-help-chevron {
    width: 16px;
    height: 16px;
    color: var(--ds-muted);
    transform: rotate(90deg);
    transition: transform .2s ease;
}

.ds-help-toggle.collapsed .ds-help-chevron {
    transform: none;
}

.ds-help-body {
    padding: 0 1rem 1rem;
}

.ds-help-lead {
    margin-bottom: .75rem;
    color: var(--ds-muted);
    font-size: .875rem;
}

.ds-help-foot {
    font-size: .875rem;
    color: var(--ds-muted);
}

.ds-chip-row {
    display: flex;
    flex-wrap: wrap;
    gap: .5rem;
}

.ds-chip {
    border: 1px solid var(--ds-border-strong);
    border-radius: 999px;
    background: var(--ds-surface);
    color: var(--ds-text);
    padding-left: .7rem;
    padding-right: .85rem;
}

.ds-chip:hover {
    background: var(--ds-surface);
    border-color: var(--brand);
    color: var(--ds-text);
}

.ds-dot {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    flex-shrink: 0;
}

/* Zamčená pole (např. identifikátor u univerzálního vložení) */
.form-control:disabled,
.form-select:disabled,
.form-control[readonly] {
    background-color: var(--ds-surface-muted);
    border-style: dashed;
    color: var(--ds-muted);
    opacity: 1;
}

/* ---------- Přihlášení: na širokém displeji dvě poloviny (značka + formulář) ---------- */
.login-showcase {
    display: none;
}

.login-form-side {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 100%;
}

@media (min-width: 992px) {
    .login-split {
        display: grid;
        grid-template-columns: minmax(380px, 46%) 1fr;
        padding: 0;
        align-items: stretch;
        background: var(--ds-bg);
    }

    .login-split .login-form-side {
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        padding: 2rem;
        background: radial-gradient(70% 50% at 50% 0%, var(--brand-soft), transparent), var(--ds-bg);
    }

    .login-split .login-card {
        box-shadow: var(--ds-shadow-md);
    }

    .login-split .login-card .logo {
        display: none;
    }

    .login-showcase {
        position: relative;
        display: flex;
        flex-direction: column;
        justify-content: space-between;
        gap: 2rem;
        min-height: 100vh;
        padding: 2.75rem 3.25rem;
        overflow: hidden;
        color: #fff;
        background:
            radial-gradient(circle at 85% 12%, color-mix(in srgb, var(--brand) 32%, transparent), transparent 42%),
            radial-gradient(circle at 10% 95%, rgba(99, 102, 241, .18), transparent 45%),
            #0b1224;
    }

    .login-showcase-logo img {
        max-height: 36px;
        width: auto;
    }

    .login-showcase-logo-chip {
        display: inline-flex;
        padding: .6rem .9rem;
        border-radius: 12px;
        background: #fff;
    }

    .login-showcase-logo-chip img {
        max-height: 32px;
    }

    .login-showcase-art svg {
        width: 100%;
        max-width: 460px;
        height: auto;
        filter: drop-shadow(0 30px 60px rgba(0, 0, 0, .35));
        animation: ds-float 7s ease-in-out infinite;
    }

    .login-showcase-art .bars rect {
        fill: color-mix(in srgb, var(--brand) 62%, #fff);
        opacity: .55;
    }

    .login-showcase-art .line,
    .login-showcase-art .ring {
        stroke: color-mix(in srgb, var(--brand) 70%, #fff);
    }

    .login-showcase-art .dot {
        fill: #fff;
        stroke: var(--brand);
        stroke-width: 3;
    }

    .login-showcase-copy h2 {
        color: #fff;
        font-size: clamp(1.6rem, 2.4vw, 2.25rem);
        font-weight: 650;
        letter-spacing: -.025em;
        line-height: 1.15;
        max-width: 18ch;
        margin-bottom: .75rem;
    }

    .login-showcase-copy p {
        color: rgba(255, 255, 255, .66);
        font-size: 1.02rem;
        max-width: 36ch;
        margin: 0;
    }
}

@keyframes ds-float {
    50% {
        transform: translateY(-8px);
    }
}

@media (prefers-reduced-motion: reduce) {
    .login-showcase-art svg {
        animation: none;
    }
}

/* ---------- Auditní log ---------- */
.audit-log-export {
    margin-bottom: 1.5rem;
}

.audit-log-custom {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-end;
    gap: .75rem;
    margin-top: 1rem;
}

.audit-log-custom .mb-3 {
    margin: 0 !important;
}

[x-cloak] {
    display: none !important;
}

table.pretty-table-header {
    --bs-table-bg: var(--ds-surface);
    --bs-table-hover-bg: var(--ds-surface-muted);
    --bs-table-hover-color: var(--ds-text);
}

table.pretty-table-header td {
    border-color: var(--ds-border);
    vertical-align: middle;
}

.ds-activity-name {
    font-weight: 500;
}

.ds-activity-message {
    width: 55%;
    color: var(--ds-text);
}

.ds-activity-when {
    white-space: nowrap;
    text-align: right;
}

.ds-activity-when span {
    color: var(--ds-muted);
    margin-left: .35rem;
}

/* ---------- Přepínač (řazení ve složce) ---------- */
.ds-sort {
    display: flex;
    align-items: center;
    gap: .75rem;
}

.ds-sort-label {
    color: var(--ds-muted);
    font-size: .85rem;
}

.ds-segmented {
    display: inline-flex;
    gap: 2px;
    padding: 3px;
    border: 1px solid var(--ds-border);
    border-radius: 999px;
    background: var(--ds-surface);
    box-shadow: var(--ds-shadow-sm);
}

.ds-segmented form {
    margin: 0;
}

.ds-segmented .btn,
.ds-segmented .btn-secondary {
    min-height: 32px;
    padding: .25rem .9rem;
    border: 0 !important;
    border-radius: 999px !important;
    background: transparent !important;
    color: var(--ds-muted) !important;
    box-shadow: none !important;
    font-weight: 500;
}

.ds-segmented .btn:hover {
    color: var(--ds-text) !important;
    background: var(--ds-surface-muted) !important;
}

.ds-segmented .btn-primary,
.ds-segmented .btn-primary:hover {
    background: var(--brand) !important;
    color: var(--brand-text) !important;
}

@media (pointer: coarse) {
    .ds-segmented .btn {
        min-height: 40px;
    }
}

/* ---------- Nová firma (superadmin) ---------- */
.ds-main .container.ds-narrow-page {
    max-width: 760px;
}

.ds-form-actions {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: .75rem;
    margin-top: 1.5rem;
}

.ds-address-input {
    display: flex;
    align-items: stretch;
    border: 1px solid var(--ds-border-strong);
    border-radius: var(--ds-radius-sm);
    background: var(--ds-surface);
    overflow: hidden;
    transition: border-color .15s ease, box-shadow .15s ease;
}

.ds-address-input:focus-within {
    border-color: var(--brand);
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--brand) 22%, transparent);
}

.ds-address-input.is-invalid {
    border-color: #dc3545;
}

.ds-address-input input {
    flex: 1;
    min-width: 0;
    min-height: 2.75rem;
    padding: 0 .25rem;
    border: 0;
    outline: none;
    background: transparent;
    color: var(--ds-text);
    font-weight: 600;
}

.ds-address-prefix,
.ds-address-suffix {
    display: flex;
    align-items: center;
    padding: 0 .75rem;
    color: var(--ds-muted);
    background: var(--ds-surface-muted);
    white-space: nowrap;
}

.ds-address-prefix {
    padding-right: .5rem;
}

.ds-choice-cards {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: .75rem;
    margin-bottom: 1.25rem;
}

.ds-choice-card {
    position: relative;
    display: flex;
    flex-direction: column;
    gap: .2rem;
    padding: 1rem 1rem 1rem 2.75rem;
    border: 1px solid var(--ds-border);
    border-radius: var(--ds-radius-sm);
    background: var(--ds-surface);
    cursor: pointer;
    transition: border-color .15s ease, box-shadow .15s ease, background .15s ease;
}

.ds-choice-card:hover {
    border-color: var(--ds-border-strong);
}

.ds-choice-card input {
    position: absolute;
    top: 1.1rem;
    left: 1rem;
    accent-color: var(--brand);
    width: 1.1rem;
    height: 1.1rem;
}

.ds-choice-card:has(input:checked) {
    border-color: var(--brand);
    background: var(--brand-soft);
    box-shadow: 0 0 0 1px var(--brand);
}

.ds-choice-card .title {
    font-weight: 600;
}

.ds-choice-card .desc {
    color: var(--ds-muted);
    font-size: .85rem;
}

.ds-limit-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0 1rem;
}

.ds-success-card {
    padding: 2.5rem 2.25rem;
    text-align: center;
}

.ds-success-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 56px;
    height: 56px;
    margin-bottom: 1rem;
    border-radius: 50%;
    background: color-mix(in srgb, #16a34a 14%, var(--ds-surface));
    color: #16a34a;
}

.ds-success-icon svg {
    width: 28px;
    height: 28px;
}

.ds-success-card h1 {
    font-size: 1.6rem;
    font-weight: 650;
    letter-spacing: -.02em;
}

.ds-success-card .lead-text {
    color: var(--ds-muted);
    margin-bottom: 1.75rem;
}

.ds-success-card .ds-form-actions {
    justify-content: center;
}

.ds-credentials {
    margin: 0 0 1.5rem;
    text-align: left;
    border: 1px solid var(--ds-border);
    border-radius: var(--ds-radius-sm);
    overflow: hidden;
}

.ds-credentials > div {
    display: grid;
    grid-template-columns: 9rem 1fr;
    align-items: center;
    gap: 1rem;
    padding: .7rem 1rem;
    border-bottom: 1px solid var(--ds-border);
}

.ds-credentials > div:last-child {
    border-bottom: 0;
}

.ds-credentials dt {
    color: var(--ds-muted);
    font-weight: 500;
}

.ds-credentials dd {
    display: flex;
    align-items: center;
    gap: .5rem;
    margin: 0;
    min-width: 0;
    word-break: break-all;
}

.ds-credentials code {
    padding: .2rem .5rem;
    border-radius: 6px;
    background: var(--ds-surface-muted);
    color: var(--ds-text);
    font-size: .95rem;
}

.ds-copy-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    border: 1px solid var(--ds-border);
    border-radius: 8px;
    background: var(--ds-surface);
    color: var(--ds-muted);
}

.ds-copy-btn:hover {
    color: var(--ds-text);
}

.ds-copy-btn.is-copied {
    border-color: #16a34a;
    color: #16a34a;
}

.ds-copy-btn .ds-icon {
    width: 16px;
    height: 16px;
}

@media (max-width: 575px) {
    .ds-credentials > div {
        grid-template-columns: 1fr;
        gap: .25rem;
    }

    .ds-success-card {
        padding: 2rem 1.25rem;
    }
}

/* ---------- Všechny firmy (superadmin) ---------- */
.ds-company-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
    gap: 1rem;
    align-items: start;
}

.ds-company-card {
    display: flex;
    flex-direction: column;
    gap: 1rem;
    padding: 1.25rem;
}

.ds-company-head {
    display: flex;
    align-items: center;
    gap: .85rem;
}

.ds-company-avatar {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    width: 44px;
    height: 44px;
    border-radius: 12px;
    background: var(--brand-soft);
    color: var(--brand-ink);
    font-weight: 700;
    font-size: 1.1rem;
}

.ds-company-title {
    flex: 1;
    min-width: 0;
}

.ds-company-title h2 {
    margin: 0;
    font-size: 1.05rem;
    font-weight: 600;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.ds-company-title a {
    color: var(--ds-muted);
    font-size: .85rem;
}

.ds-company-stats {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: .5rem;
    margin: 0;
    padding: .85rem 0;
    border-top: 1px solid var(--ds-border);
    border-bottom: 1px solid var(--ds-border);
}

.ds-company-stats dt {
    color: var(--ds-muted);
    font-size: .75rem;
    font-weight: 500;
}

.ds-company-stats dd {
    margin: 0;
    font-size: 1.15rem;
    font-weight: 650;
}

.ds-company-stats dd small {
    color: var(--ds-muted);
    font-size: .8rem;
    font-weight: 500;
}

.ds-company-stats dd.small-text {
    font-size: .85rem;
    font-weight: 500;
    padding-top: .3rem;
}

.ds-company-users summary {
    cursor: pointer;
    color: var(--ds-muted);
    font-size: .85rem;
    font-weight: 500;
}

.ds-company-users ul {
    margin: .5rem 0 0;
    padding: 0;
    list-style: none;
}

.ds-company-users li {
    display: flex;
    align-items: center;
    gap: .5rem;
    padding: .35rem 0;
    font-size: .875rem;
    border-bottom: 1px dashed var(--ds-border);
}

.ds-company-users li:last-child {
    border-bottom: 0;
}

.ds-company-users li .text-muted {
    flex: 1;
    font-size: .8rem;
}

.ds-company-actions {
    display: flex;
    flex-wrap: wrap;
    gap: .35rem 1rem;
    font-size: .85rem;
    font-weight: 500;
}
