/* STOPA – vzhled nad Bootstrap 5.3. Svetly i tmavy rezim, mobile-first. */

:root {
    --stopa-primary: #4f46e5;
    --stopa-primary-rgb: 79, 70, 229;
    --stopa-primary-hover: #4338ca;
    --stopa-accent: #06b6d4;
    --stopa-radius: 1rem;
    --stopa-shadow: 0 1px 2px rgba(16, 24, 40, .05), 0 4px 12px rgba(16, 24, 40, .06);
    --bs-primary: var(--stopa-primary);
    --bs-primary-rgb: var(--stopa-primary-rgb);
    --bs-link-color-rgb: var(--stopa-primary-rgb);
    --bs-link-hover-color-rgb: 67, 56, 202;
    --bs-font-sans-serif: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
    --bs-border-radius: .625rem;
    --bs-border-radius-lg: .875rem;
}

[data-bs-theme="light"] {
    --bs-body-bg: #f4f6fb;
    --bs-body-bg-rgb: 244, 246, 251;
    --stopa-surface: #ffffff;
    --stopa-surface-border: rgba(15, 23, 42, .06);
}

[data-bs-theme="dark"] {
    --bs-body-bg: #0b1020;
    --bs-body-bg-rgb: 11, 16, 32;
    --bs-body-color: #e2e8f0;
    --stopa-surface: #121a2e;
    --stopa-surface-border: rgba(255, 255, 255, .07);
    --stopa-shadow: none;
    --bs-primary: #818cf8;
    --bs-primary-rgb: 129, 140, 248;
    --bs-link-color-rgb: 129, 140, 248;
}

body {
    font-feature-settings: "cv11", "ss01";
    -webkit-font-smoothing: antialiased;
}

.min-w-0 { min-width: 0; }

/* --- tlacitka --- */
.btn-primary {
    --bs-btn-bg: var(--stopa-primary);
    --bs-btn-border-color: var(--stopa-primary);
    --bs-btn-hover-bg: var(--stopa-primary-hover);
    --bs-btn-hover-border-color: var(--stopa-primary-hover);
    --bs-btn-active-bg: var(--stopa-primary-hover);
    --bs-btn-active-border-color: var(--stopa-primary-hover);
    --bs-btn-disabled-bg: var(--stopa-primary);
    --bs-btn-disabled-border-color: var(--stopa-primary);
    box-shadow: 0 1px 2px rgba(var(--stopa-primary-rgb), .3);
}

.btn-icon {
    width: 2.5rem;
    height: 2.5rem;
    border-radius: 50%;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: var(--bs-secondary-color);
}
.btn-icon:hover { background: rgba(var(--bs-emphasis-color-rgb), .06); color: var(--bs-body-color); }

.form-control:focus, .form-check-input:focus, .btn-check:focus-visible + .role-option {
    border-color: rgba(var(--stopa-primary-rgb), .6);
    box-shadow: 0 0 0 .25rem rgba(var(--stopa-primary-rgb), .15);
}
.form-check-input:checked { background-color: var(--stopa-primary); border-color: var(--stopa-primary); }

/* --- horni lista --- */
.app-navbar {
    background: rgba(var(--bs-body-bg-rgb), .82);
    backdrop-filter: saturate(180%) blur(12px);
    -webkit-backdrop-filter: saturate(180%) blur(12px);
    border-bottom: 1px solid var(--stopa-surface-border);
}

.brand {
    display: inline-flex;
    align-items: center;
    gap: .6rem;
    text-decoration: none;
    color: var(--bs-emphasis-color);
    font-weight: 800;
    letter-spacing: .04em;
}

.brand-mark {
    width: 2.1rem;
    height: 2.1rem;
    border-radius: .65rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: #fff;
    font-weight: 800;
    background: linear-gradient(135deg, var(--stopa-primary), var(--stopa-accent));
    box-shadow: 0 4px 14px rgba(var(--stopa-primary-rgb), .35);
}
.brand-mark-lg { width: 3.5rem; height: 3.5rem; border-radius: 1rem; font-size: 1.6rem; }

.app-nav .nav-link {
    color: var(--bs-secondary-color);
    border-radius: .6rem;
    padding: .45rem .8rem;
    font-weight: 500;
}
.app-nav .nav-link:hover { color: var(--bs-emphasis-color); background: rgba(var(--bs-emphasis-color-rgb), .05); }
.app-nav .nav-link.active { color: var(--bs-primary); background: rgba(var(--bs-primary-rgb), .1); }

.btn-user {
    display: inline-flex;
    align-items: center;
    gap: .5rem;
    border-radius: 2rem;
    padding: .2rem .7rem .2rem .2rem;
    border: 1px solid var(--stopa-surface-border);
    background: var(--stopa-surface);
}

/* --- avatar --- */
.avatar {
    width: 2rem;
    height: 2rem;
    flex: 0 0 auto;
    border-radius: 50%;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: .8rem;
    font-weight: 700;
    color: #fff;
    background: linear-gradient(135deg, var(--stopa-primary), var(--stopa-accent));
}
.avatar-lg { width: 2.75rem; height: 2.75rem; font-size: .95rem; }
.avatar-xl { width: 3.75rem; height: 3.75rem; font-size: 1.25rem; }
.avatar-muted { background: var(--bs-secondary-bg); color: var(--bs-secondary-color); }

/* --- karty --- */
.card {
    --bs-card-bg: var(--stopa-surface);
    --bs-card-border-color: var(--stopa-surface-border);
    --bs-card-border-radius: var(--stopa-radius);
    --bs-card-inner-border-radius: calc(var(--stopa-radius) - 1px);
    --bs-card-cap-bg: transparent;
    box-shadow: var(--stopa-shadow);
}
.card-header { padding: .9rem 1.25rem; }
.card-footer { background: transparent; }
.list-group { --bs-list-group-bg: transparent; --bs-list-group-border-color: var(--stopa-surface-border); }

.page-header {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 1rem;
    margin-bottom: 1.5rem;
}
.page-title { font-size: clamp(1.4rem, 1.1rem + 1.2vw, 1.9rem); font-weight: 750; letter-spacing: -.02em; margin-bottom: .2rem; }
.back-link { font-size: .85rem; color: var(--bs-secondary-color); text-decoration: none; display: inline-block; margin-bottom: .25rem; }
.back-link:hover { color: var(--bs-primary); }

/* --- statistiky --- */
.stat-card .card-body { padding: 1.1rem 1.25rem; }
.stat-icon {
    width: 2.4rem;
    height: 2.4rem;
    border-radius: .75rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 1.15rem;
    margin-bottom: .75rem;
}
.stat-value { font-size: clamp(1.5rem, 1.2rem + 1.4vw, 2.1rem); font-weight: 750; line-height: 1.1; letter-spacing: -.02em; }
.stat-label { font-size: .82rem; color: var(--bs-secondary-color); margin-top: .2rem; }

.tone-primary { background: rgba(var(--bs-primary-rgb), .12); color: var(--bs-primary); }
.tone-success { background: rgba(var(--bs-success-rgb), .12); color: var(--bs-success); }
.tone-danger { background: rgba(var(--bs-danger-rgb), .12); color: var(--bs-danger); }
.tone-warning { background: rgba(var(--bs-warning-rgb), .16); color: #b45309; }
.tone-info { background: rgba(var(--bs-info-rgb), .14); color: #0e7490; }
.tone-secondary { background: rgba(var(--bs-secondary-rgb), .12); color: var(--bs-secondary-color); }
[data-bs-theme="dark"] .tone-warning { color: #fbbf24; }
[data-bs-theme="dark"] .tone-info { color: #22d3ee; }

/* --- udalosti --- */
.event-icon {
    width: 2.1rem;
    height: 2.1rem;
    flex: 0 0 auto;
    border-radius: .6rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}
.event-list .list-group-item { padding: .8rem 1.25rem; }

.roadmap { list-style: none; padding: 0; margin: 0; display: grid; gap: .55rem; }
.roadmap li { display: flex; gap: .6rem; align-items: center; color: var(--bs-secondary-color); }
.roadmap i { color: rgba(var(--bs-primary-rgb), .5); font-size: .7rem; }

/* --- role --- */
.role-badge { font-weight: 600; }
.role-admin { background: rgba(var(--bs-danger-rgb), .12); color: var(--bs-danger); }
.role-developer { background: rgba(var(--bs-primary-rgb), .12); color: var(--bs-primary); }
.role-qa { background: rgba(var(--bs-success-rgb), .12); color: var(--bs-success); }
.role-tester { background: rgba(var(--bs-info-rgb), .14); color: #0e7490; }
[data-bs-theme="dark"] .role-tester { color: #22d3ee; }

.role-picker { display: grid; grid-template-columns: repeat(auto-fit, minmax(13rem, 1fr)); gap: .6rem; }
.role-option {
    display: flex;
    flex-direction: column;
    gap: .1rem;
    padding: .75rem .9rem;
    border: 1px solid var(--bs-border-color);
    border-radius: .75rem;
    cursor: pointer;
    transition: border-color .15s, background-color .15s;
    position: relative;
}
.role-option::after {
    content: "\F26E";
    font-family: "bootstrap-icons";
    position: absolute;
    top: .6rem;
    right: .75rem;
    color: var(--bs-primary);
    opacity: 0;
}
.btn-check:checked + .role-option { border-color: var(--bs-primary); background: rgba(var(--bs-primary-rgb), .07); }
.btn-check:checked + .role-option::after { opacity: 1; }
.role-picker.is-invalid .role-option { border-color: var(--bs-danger); }

/* --- prihlaseni --- */
.auth-page {
    background:
        radial-gradient(60rem 40rem at 10% -10%, rgba(var(--stopa-primary-rgb), .18), transparent 60%),
        radial-gradient(50rem 35rem at 110% 110%, rgba(6, 182, 212, .16), transparent 60%),
        var(--bs-body-bg);
    min-height: 100vh;
}
.auth-wrapper {
    min-height: 100vh;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 1.5rem 1rem;
    position: relative;
}
.auth-card {
    width: 100%;
    max-width: 26rem;
    background: var(--stopa-surface);
    border: 1px solid var(--stopa-surface-border);
    border-radius: 1.25rem;
    padding: 2rem 1.5rem;
    box-shadow: 0 20px 50px rgba(15, 23, 42, .12);
}
@media (min-width: 576px) { .auth-card { padding: 2.5rem 2.25rem; } }
.auth-theme-toggle { position: absolute; top: 1rem; right: 1rem; }

/* --- spodni navigace na mobilu --- */
.bottom-nav {
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 1030;
    display: flex;
    justify-content: space-around;
    background: rgba(var(--bs-body-bg-rgb), .9);
    backdrop-filter: saturate(180%) blur(12px);
    -webkit-backdrop-filter: saturate(180%) blur(12px);
    border-top: 1px solid var(--stopa-surface-border);
    padding: .35rem .5rem calc(.35rem + env(safe-area-inset-bottom));
}
.bottom-nav a {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: .1rem;
    padding: .35rem 0;
    font-size: .72rem;
    font-weight: 500;
    color: var(--bs-secondary-color);
    text-decoration: none;
    border-radius: .75rem;
}
.bottom-nav a i { font-size: 1.25rem; }
.bottom-nav a.active { color: var(--bs-primary); }
.bottom-nav a.active i { transform: translateY(-1px); }

@media (max-width: 991.98px) {
    body.has-bottom-nav { padding-bottom: calc(4.5rem + env(safe-area-inset-bottom)); }
}

@media (max-width: 575.98px) {
    .page-header { align-items: center; }
    main.container-xl { padding-left: 1rem; padding-right: 1rem; }
}

/* --- projekty a pozadavky --- */
.section-title { font-size: 1.05rem; font-weight: 700; letter-spacing: -.01em; }
.empty-icon { font-size: 2.5rem; color: rgba(var(--bs-primary-rgb), .45); margin-bottom: .5rem; }
.line-clamp-2 { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }

a.card { transition: transform .12s ease, box-shadow .12s ease; }
a.card:hover { transform: translateY(-2px); box-shadow: 0 6px 20px rgba(15, 23, 42, .10); }
[data-bs-theme="dark"] a.card:hover { box-shadow: 0 0 0 1px rgba(var(--bs-primary-rgb), .35); }

.project-code {
    display: inline-block;
    font-family: var(--bs-font-monospace);
    font-weight: 700;
    font-size: .78rem;
    letter-spacing: .04em;
    padding: .15rem .5rem;
    border-radius: .4rem;
    color: var(--bs-primary);
    background: rgba(var(--bs-primary-rgb), .1);
}
.project-code-lg { font-size: 1rem; padding: .3rem .65rem; }

.status-bar { display: flex; gap: 2px; height: .5rem; border-radius: 1rem; overflow: hidden; background: var(--bs-secondary-bg); }
.status-bar-empty { opacity: .6; }
.status-bar .seg { flex-basis: 0; min-width: 4px; }
.status-legend { display: flex; flex-wrap: wrap; gap: .25rem .9rem; margin-top: .5rem; font-size: .75rem; color: var(--bs-secondary-color); }
.status-legend .dot { display: inline-block; width: .55rem; height: .55rem; border-radius: 50%; margin-right: .3rem; }

.group-backlog { --g: 100, 116, 139; }
.group-in_progress { --g: var(--stopa-primary-rgb); }
.group-review { --g: 217, 119, 6; }
.group-retest { --g: 8, 145, 178; }
.group-done { --g: 22, 163, 74; }
.group-rejected { --g: 71, 85, 105; }
.status-bar .seg[class*="group-"], .status-legend .dot[class*="group-"] { background: rgb(var(--g)); }
.status-badge[class*="group-"] { background: rgba(var(--g), .13); color: rgb(var(--g)); font-weight: 600; }
[data-bs-theme="dark"] .status-badge[class*="group-"] { background: rgba(var(--g), .25); color: #fff; }

.issue-item { display: flex; gap: .9rem; align-items: flex-start; padding: .85rem 1.25rem; }
.issue-type {
    width: 2.3rem; height: 2.3rem; flex: 0 0 auto; border-radius: .7rem;
    display: inline-flex; align-items: center; justify-content: center; font-size: 1.05rem;
}
.issue-main { display: flex; flex-direction: column; gap: .15rem; flex-grow: 1; min-width: 0; }
.issue-key { font-family: var(--bs-font-monospace); font-weight: 700; font-size: .8rem; color: var(--bs-secondary-color); }
.issue-key-lg { font-size: 1rem; color: var(--bs-primary); }
.issue-title { font-weight: 600; color: var(--bs-emphasis-color); overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; }
.issue-meta { font-size: .8rem; color: var(--bs-secondary-color); }
.issue-heading { word-break: break-word; }

.filter-card .search-box { min-width: 14rem; }
@media (max-width: 575.98px) { .filter-card .form-select.w-auto { width: 100% !important; } }

.type-picker { display: grid; grid-template-columns: repeat(auto-fill, minmax(8.5rem, 1fr)); gap: .5rem; }
.type-option {
    display: flex; align-items: center; gap: .5rem; padding: .55rem .75rem; cursor: pointer;
    border: 1px solid var(--bs-border-color); border-radius: .7rem; font-weight: 500; font-size: .9rem;
}
.type-option i { color: var(--bs-secondary-color); }
.btn-check:checked + .type-option { border-color: var(--bs-primary); background: rgba(var(--bs-primary-rgb), .08); color: var(--bs-primary); }
.btn-check:checked + .type-option i { color: var(--bs-primary); }
.btn-check:focus-visible + .type-option { box-shadow: 0 0 0 .25rem rgba(var(--stopa-primary-rgb), .15); }


.form-actions { display: flex; justify-content: flex-end; gap: .5rem; margin-top: 1rem; }
@media (max-width: 991.98px) {
    .form-actions {
        position: sticky; bottom: calc(4.6rem + env(safe-area-inset-bottom)); z-index: 5;
        padding: .75rem; border-radius: 1rem; background: rgba(var(--bs-body-bg-rgb), .92);
        backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px); border: 1px solid var(--stopa-surface-border);
    }
    .form-actions .btn { flex: 1; }
}

.user-text { white-space: normal; overflow-wrap: anywhere; }
.detail-label { font-size: .75rem; text-transform: uppercase; letter-spacing: .06em; font-weight: 700; color: var(--bs-secondary-color); margin-bottom: .35rem; }
.detail-card .detail-row { display: flex; justify-content: space-between; gap: 1rem; padding: .7rem 1.25rem; border-bottom: 1px solid var(--stopa-surface-border); }
.detail-card .detail-row:last-child { border-bottom: 0; }
.detail-card dt { font-weight: 500; color: var(--bs-secondary-color); font-size: .875rem; }
.detail-card dd { margin: 0; text-align: right; font-size: .9rem; overflow-wrap: anywhere; }

.timeline { padding: .5rem 1.25rem 1rem; }
.timeline-item { position: relative; padding: .7rem 0 .7rem 1.4rem; border-left: 2px solid var(--stopa-surface-border); margin-left: .35rem; }
.timeline-item::before {
    content: ""; position: absolute; left: -.42rem; top: 1rem; width: .75rem; height: .75rem; border-radius: 50%;
    background: var(--stopa-surface); border: 2px solid rgba(var(--bs-primary-rgb), .6);
}
.history-old { text-decoration: line-through; color: var(--bs-secondary-color); overflow-wrap: anywhere; }
.history-new { font-weight: 600; overflow-wrap: anywhere; }
.code-input .input-group-text { color: var(--bs-secondary-color); }
.seg-1 { flex-grow: 1; }
.seg-2 { flex-grow: 2; }
.seg-3 { flex-grow: 3; }
.seg-4 { flex-grow: 4; }
.seg-5 { flex-grow: 5; }
.seg-6 { flex-grow: 6; }
.seg-7 { flex-grow: 7; }
.seg-8 { flex-grow: 8; }
.seg-9 { flex-grow: 9; }
.seg-10 { flex-grow: 10; }
.seg-11 { flex-grow: 11; }
.seg-12 { flex-grow: 12; }
.seg-13 { flex-grow: 13; }
.seg-14 { flex-grow: 14; }
.seg-15 { flex-grow: 15; }
.seg-16 { flex-grow: 16; }
.seg-17 { flex-grow: 17; }
.seg-18 { flex-grow: 18; }
.seg-19 { flex-grow: 19; }
.seg-20 { flex-grow: 20; }
.seg-21 { flex-grow: 21; }
.seg-22 { flex-grow: 22; }
.seg-23 { flex-grow: 23; }
.seg-24 { flex-grow: 24; }
.seg-25 { flex-grow: 25; }
.seg-26 { flex-grow: 26; }
.seg-27 { flex-grow: 27; }
.seg-28 { flex-grow: 28; }
.seg-29 { flex-grow: 29; }
.seg-30 { flex-grow: 30; }
.seg-31 { flex-grow: 31; }
.seg-32 { flex-grow: 32; }
.seg-33 { flex-grow: 33; }
.seg-34 { flex-grow: 34; }
.seg-35 { flex-grow: 35; }
.seg-36 { flex-grow: 36; }
.seg-37 { flex-grow: 37; }
.seg-38 { flex-grow: 38; }
.seg-39 { flex-grow: 39; }
.seg-40 { flex-grow: 40; }
.seg-41 { flex-grow: 41; }
.seg-42 { flex-grow: 42; }
.seg-43 { flex-grow: 43; }
.seg-44 { flex-grow: 44; }
.seg-45 { flex-grow: 45; }
.seg-46 { flex-grow: 46; }
.seg-47 { flex-grow: 47; }
.seg-48 { flex-grow: 48; }
.seg-49 { flex-grow: 49; }
.seg-50 { flex-grow: 50; }
.seg-51 { flex-grow: 51; }
.seg-52 { flex-grow: 52; }
.seg-53 { flex-grow: 53; }
.seg-54 { flex-grow: 54; }
.seg-55 { flex-grow: 55; }
.seg-56 { flex-grow: 56; }
.seg-57 { flex-grow: 57; }
.seg-58 { flex-grow: 58; }
.seg-59 { flex-grow: 59; }
.seg-60 { flex-grow: 60; }
.seg-61 { flex-grow: 61; }
.seg-62 { flex-grow: 62; }
.seg-63 { flex-grow: 63; }
.seg-64 { flex-grow: 64; }
.seg-65 { flex-grow: 65; }
.seg-66 { flex-grow: 66; }
.seg-67 { flex-grow: 67; }
.seg-68 { flex-grow: 68; }
.seg-69 { flex-grow: 69; }
.seg-70 { flex-grow: 70; }
.seg-71 { flex-grow: 71; }
.seg-72 { flex-grow: 72; }
.seg-73 { flex-grow: 73; }
.seg-74 { flex-grow: 74; }
.seg-75 { flex-grow: 75; }
.seg-76 { flex-grow: 76; }
.seg-77 { flex-grow: 77; }
.seg-78 { flex-grow: 78; }
.seg-79 { flex-grow: 79; }
.seg-80 { flex-grow: 80; }
.seg-81 { flex-grow: 81; }
.seg-82 { flex-grow: 82; }
.seg-83 { flex-grow: 83; }
.seg-84 { flex-grow: 84; }
.seg-85 { flex-grow: 85; }
.seg-86 { flex-grow: 86; }
.seg-87 { flex-grow: 87; }
.seg-88 { flex-grow: 88; }
.seg-89 { flex-grow: 89; }
.seg-90 { flex-grow: 90; }
.seg-91 { flex-grow: 91; }
.seg-92 { flex-grow: 92; }
.seg-93 { flex-grow: 93; }
.seg-94 { flex-grow: 94; }
.seg-95 { flex-grow: 95; }
.seg-96 { flex-grow: 96; }
.seg-97 { flex-grow: 97; }
.seg-98 { flex-grow: 98; }
.seg-99 { flex-grow: 99; }
.seg-100 { flex-grow: 100; }

/* --- workflow, aktivita, prilohy --- */
.workflow-card { border-left: 4px solid rgba(var(--bs-primary-rgb), .6); }
.action-form { padding: 1rem; border-radius: .75rem; background: var(--bs-tertiary-bg); }
.timeline-item.kind-status::before { border-color: rgba(var(--bs-success-rgb), .8); background: rgba(var(--bs-success-rgb), .8); }
.timeline-item.kind-comment::before { border-color: rgba(var(--stopa-primary-rgb), .9); background: rgba(var(--stopa-primary-rgb), .9); }
.comment-body { padding: .75rem 1rem; border-radius: .25rem 1rem 1rem 1rem; background: var(--bs-tertiary-bg); }
.reason-box { padding: .5rem .85rem; border-left: 3px solid rgba(var(--bs-warning-rgb), .7); background: rgba(var(--bs-warning-rgb), .07); border-radius: .25rem; font-size: .9rem; }
.file-chip {
    display: inline-flex; align-items: center; gap: .5rem; max-width: 100%; margin-right: .5rem;
    padding: .35rem .7rem; border: 1px solid var(--bs-border-color); border-radius: 2rem;
    text-decoration: none; color: var(--bs-body-color); font-size: .875rem;
}
.file-chip:hover { border-color: var(--bs-primary); color: var(--bs-primary); }
.comment-form { padding: 1rem 1.25rem; }
.attachment-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(6.5rem, 1fr)); gap: .6rem; }
.attachment-tile {
    position: relative; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: .35rem;
    aspect-ratio: 1; padding: .5rem; border-radius: .75rem; overflow: hidden; text-decoration: none;
    border: 1px solid var(--bs-border-color); color: var(--bs-secondary-color); background: var(--bs-tertiary-bg);
}
.attachment-tile:hover { border-color: var(--bs-primary); }
.attachment-tile i { font-size: 1.9rem; }
.attachment-tile img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.attachment-name {
    position: relative; z-index: 1; width: 100%; font-size: .7rem; text-align: center;
    white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.attachment-tile img + .attachment-name { margin-top: auto; padding: .15rem .3rem; border-radius: .4rem; background: rgba(0, 0, 0, .55); color: #fff; }
.attachment-lock { position: absolute; top: .3rem; right: .4rem; z-index: 1; color: var(--bs-danger); }

/* --- AI agenti --- */
.avatar-ai { background: linear-gradient(135deg, #0f766e, #06b6d4); font-size: 1rem; }
.avatar-lg.avatar-ai { font-size: 1.2rem; }
.avatar-xl.avatar-ai { font-size: 1.6rem; }
.agent-kind-developer { background: rgba(var(--stopa-primary-rgb), .12); color: var(--bs-primary); font-weight: 600; }
.agent-kind-reviewer { background: rgba(var(--bs-success-rgb), .12); color: var(--bs-success); font-weight: 600; }
.code-block { padding: .75rem 1rem; border-radius: .6rem; background: var(--bs-tertiary-bg); font-size: .85rem; white-space: pre-wrap; word-break: break-all; }
.timeline-item.actor-ai::before { border-color: #0f766e; background: #0f766e; }

/* --- prace AI v detailu pozadavku --- */
.ai-card { border-left: 4px solid #0f766e; }
.proposal { border: 1px solid var(--bs-border-color); border-radius: .75rem; padding: .6rem .9rem; }
.proposal > summary { cursor: pointer; list-style: none; }
.proposal > summary::-webkit-details-marker { display: none; }
.proposal-body { margin-top: .75rem; }
.file-list { max-height: 14rem; overflow: auto; padding-left: 1.1rem; margin-top: .35rem; }
.review-box { margin-top: .5rem; padding: .75rem .9rem; border-radius: .6rem; background: var(--bs-tertiary-bg); }
.finding { padding: .5rem 0; border-top: 1px solid var(--stopa-surface-border); }
.test-run { padding: .5rem 0; border-top: 1px solid var(--stopa-surface-border); }
.test-run:first-of-type { border-top: 0; }
.analysis { padding: .4rem 0; }
.analysis > summary { cursor: pointer; }

.upload-zone {
    display: flex; flex-direction: column; align-items: center; gap: .25rem; padding: 1.25rem; cursor: pointer; text-align: center;
    border: 2px dashed var(--bs-border-color); border-radius: .9rem; color: var(--bs-secondary-color); transition: border-color .15s, background .15s;
}
.upload-zone i { font-size: 1.8rem; color: var(--bs-primary); }
.upload-zone:hover { border-color: var(--bs-primary); background: rgba(var(--bs-primary-rgb), .04); }
.upload-zone.is-invalid { border-color: var(--bs-danger); }