@import '_content/Blazor.Bootstrap/Blazor.Bootstrap.olwso25aue.bundle.scp.css';

/* /Components/Layout/ClientLayout.razor.rz.scp.css */
/* ============================================================
   CLIENTLAYOUT.RAZOR.CSS — OPTIMALIZOVANÝ SVĚTLÝ LAYOUT
   Sjednoceno s „DashboardLayout.razor.css — světlá varianta":
   - stejné akcenty, stíny, přechody, focus ring
   - žádné nové wrappery; používá pouze EXISTUJÍCÍ class-names
   - připraveno pro Blazor CSS isolation (::deep tam, kde je potřeba)
   ============================================================ */

/* === PALETA / PROMĚNNÉ (sjednocené) =============================== */
:root[b-vz2vfum218] {
    --bg-body: #f8fafc; /* plátno */
    --bg-sidebar: #ffffff; /* sidebar */
    --bg-main: #f8fafc; /* hlavní obsah */
    --text-main: #0f172a; /* slate-900 */
    --text-muted: #6b7280; /* gray-600 */
    --border: #e5e7eb; /* gray-200 */
    --shadow-sm: 0 2px 10px rgba(15,23,42,.06);
    --shadow-md: 0 10px 24px rgba(15,23,42,.08);
    --accent: #2563eb; /* blue-600 */
    --accent-2: #3b82f6; /* blue-500 */
    --hover: #eef2ff; /* blue-50 */
    --ring: 0 0 0 .25rem rgba(59,130,246,.25);
    --transition: all .2s cubic-bezier(.4,0,.2,1);
}

/* === GLOBÁLNÍ POZADÍ =============================================== */
html[b-vz2vfum218], body[b-vz2vfum218] {
    background: var(--bg-body);
    color: var(--text-main);
    height: 100%;
    margin: 0;
    padding: 0;
}

/* === GRID LAYOUT: Sidebar + Main =================================== */
.client-grid-container[b-vz2vfum218] {
    display: grid;
    grid-template-columns: 130px minmax(0, 1fr);
    grid-template-areas: "sidebar main";
    height: 100vh;
    background-color: var(--bg-body);
}

/* === SIDEBAR (vlevo, sticky) ====================================== */
.sidebar-container[b-vz2vfum218] {
    grid-area: sidebar;
    background: var(--bg-sidebar);
    border-right: 1px solid var(--border);
    height: 100vh;
    position: sticky;
    top: 0;
    overflow-y: auto;
    display: flex;
    flex-direction: column;
    /* SNÍŽENÝ z-index aby modal mohl být nad sidebarem */
    z-index: 10;
    box-shadow: 2px 0 15px rgba(15,23,42,.08);
    animation: slideInFromLeft-b-vz2vfum218 .18s ease-out;
}

/* Logo / brand v sidebaru */
.sidebar-logo[b-vz2vfum218] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: .5rem;
    font-size: 1.15rem;
    font-weight: 800;
    color: var(--text-main);
    padding: 1rem 1.25rem;
    border-bottom: 1px solid var(--border);
    background: #fff;
}

/* === HLAVNÍ OBSAH ================================================== */
.client-main-content[b-vz2vfum218] {
    grid-area: main;
    min-width: 0;
    overflow-y: auto;
    position: relative;
    /* SNÍŽENÝ z-index aby modal mohl být nad obsahem */
    z-index: 5;
    padding: 2.0rem 2.5rem;
    background: var(--bg-main);
    color: var(--text-main);
}

/* === NAVIGACE V SIDEBARU ========================================== */
.sidebar-nav[b-vz2vfum218] {
    padding: 1rem;
    flex-grow: 1;
}

.nav-section-title[b-vz2vfum218] {
    font-size: .72rem;
    font-weight: 800;
    color: var(--text-muted);
    text-transform: uppercase;
    letter-spacing: .08em;
    padding: 0 .5rem .6rem;
    margin-top: 1.1rem;
}

/* === NAV ODKAZY (ikonka nad textem) ================================ */
/* Pozn.: ::deep pro obsah v komponentách uvnitř layoutu (Blazor scoped) */
[b-vz2vfum218] .nav-link {
    position: relative;
    z-index: 15;
    width: 100%;
    min-height: 72px;
    padding: .75rem .5rem;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-decoration: none;
    color: #374151;
    background: transparent;
    border: 1px solid transparent;
    cursor: pointer;
    border-radius: 12px;
    transition: var(--transition);
    font-size: .625rem;
    font-weight: 600;
    text-align: center;
    line-height: 1.2;
    box-shadow: none;
    margin-bottom: .25rem;
}

    /* Ikony (Bootstrap Icons) – větší a čitelnější */
    [b-vz2vfum218] .nav-link i {
        margin: 0 0 .5rem 0;
        font-size: 1.8rem;
        line-height: 1;
        opacity: .92;
        transition: var(--transition);
    }

    /* Hover stav – jemný „lift" a světle modré pozadí */
    [b-vz2vfum218] .nav-link:hover {
        background-color: var(--hover);
        color: var(--accent);
        transform: translateY(-1px);
        border-color: rgba(37,99,235,.18);
        box-shadow: var(--shadow-sm);
    }

        [b-vz2vfum218] .nav-link:hover i {
            opacity: 1;
            transform: scale(1.05);
            color: var(--accent);
        }

    /* Active stav – kontrastní text a decentní stín */
    [b-vz2vfum218] .nav-link.active,
    [b-vz2vfum218] .nav-link[aria-current="page"],
    [b-vz2vfum218] .nav-link[data-active="true"] {
        background: #fff;
        color: var(--accent);
        border-color: transparent;
        transform: translateY(-1px);
        box-shadow: var(--shadow-sm);
    }

        [b-vz2vfum218] .nav-link.active i {
            color: var(--accent);
            opacity: 1;
        }

    /* Focus ring pro přístupnost */
    [b-vz2vfum218] .nav-link:focus-visible {
        outline: none;
        box-shadow: var(--ring);
    }

/* Wrapper pro ikony (pokud používáš) */
.icon-wrapper[b-vz2vfum218] {
    position: relative !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    font-size: 1.3rem !important;
    margin-bottom: .5rem !important;
    transition: var(--transition) !important;
}

/* Text pod ikonami – přesná typografie */
.nav-link-text[b-vz2vfum218] {
    font-size: .625rem !important;
    font-weight: 600 !important;
    color: #374151 !important;
    max-width: 100% !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
    padding: 0 .25rem;
    line-height: 1.3 !important;
}

/* === MODAL / TOAST VRSTVY (Bootstrap kompatibilně) ================= */
:root[b-vz2vfum218] {
    /* VYSOKÉ z-index pro modaly - musí být nad sidebarem */
    --zindex-modal-backdrop: 99998;
    --zindex-modal: 99999;
}

[b-vz2vfum218] .modal-backdrop {
    z-index: var(--zindex-modal-backdrop) !important;
}

[b-vz2vfum218] .modal, [b-vz2vfum218] .modal-dialog, [b-vz2vfum218] .modal-content {
    z-index: var(--zindex-modal) !important;
}

.toast-container[b-vz2vfum218] {
    z-index: 100000 !important;
}

/* === RESPONSIVITA =================================================== */
@media (max-width: 768px) {
    .client-grid-container[b-vz2vfum218] {
        grid-template-columns: 100px minmax(0,1fr);
    }

    .client-main-content[b-vz2vfum218] {
        padding: 1.25rem;
    }

    [b-vz2vfum218] .nav-link i {
        font-size: 1.2rem !important;
    }

    [b-vz2vfum218] .nav-link {
        min-height: 68px;
    }
}

/* === ANIMACE ======================================================== */
@keyframes slideInFromLeft-b-vz2vfum218 {
    from {
        transform: translateX(-100%);
        opacity: 0;
    }

    to {
        transform: translateX(0);
        opacity: 1;
    }
}

/* =========================================================
   Typografická hierarchie card headerů (globálně pro Client)
   - titulek = 800
   - „tučné" texty uvnitř headeru = 600 + tlumenější barva
   - funguje přes ::deep (Blazor CSS isolation)
   ========================================================= */

.client-main-content[b-vz2vfum218]  .card-header h1,
.client-main-content[b-vz2vfum218]  .card-header h2,
.client-main-content[b-vz2vfum218]  .card-header h3,
.client-main-content[b-vz2vfum218]  .card-header h4,
.client-main-content[b-vz2vfum218]  .card-header h5,
.client-main-content[b-vz2vfum218]  .card-header h6 {
    font-weight: 800;
    letter-spacing: 0.2px;
    margin: 0;
}

.client-main-content[b-vz2vfum218]  .card-header strong,
.client-main-content[b-vz2vfum218]  .card-header b {
    font-weight: 600;
    color: #475569; /* tlumenější než titulek */
}

/* Pokud někde používáš .fw-bold (má !important) */
.client-main-content[b-vz2vfum218]  .card-header .fw-bold {
    font-weight: 600 !important;
    color: #475569 !important;
}

/* Metadata v headeru – nenápadnější */
.client-main-content[b-vz2vfum218]  .card-header small {
    color: #64748b;
    font-weight: 600;
    letter-spacing: .2px;
}

/* Tlačítka v headeru – ať nepřebijí titulek */
.client-main-content[b-vz2vfum218]  .card-header .btn {
    font-weight: 600;
}
/* /Components/Layout/DashboardLayout.razor.rz.scp.css */
/* ============================================================
   DASHBOARDLAYOUT.RAZOR.CSS — OPTIMALIZOVANÝ SVĚTLÝ LAYOUT
   Sjednoceno s „Dashboard.razor.css — světlá varianta“ (akcenty, stíny,
   přechody, focus). Pouze existující class-names, žádné nové obaly.
   Bootstrap Icons zachovány.
   ============================================================ */

/* === PALETA / PROMĚNNÉ (sjednocené) =============================== */
:root[b-5jqutmc3pz] {
    --bg-body: #f8fafc; /* plátno */
    --bg-sidebar: #ffffff; /* sidebar */
    --bg-main: #f8fafc; /* hlavní obsah */
    --text-main: #0f172a; /* slate-900 */
    --text-muted: #6b7280; /* gray-600 */
    --border: #e5e7eb; /* gray-200 */
    --shadow-sm: 0 2px 10px rgba(15,23,42,.06);
    --shadow-md: 0 10px 24px rgba(15,23,42,.08);
    --accent: #2563eb; /* blue-600 */
    --accent-2: #3b82f6; /* blue-500 */
    --hover: #eef2ff; /* blue-50 */
    --ring: 0 0 0 .25rem rgba(59,130,246,.25);
    --transition: all .2s cubic-bezier(.4,0,.2,1);
}

/* === ZÁKLADNÍ POZADÍ (světlé) ===================================== */
html[b-5jqutmc3pz], body[b-5jqutmc3pz] {
    background-color: var(--bg-body);
    color: var(--text-main);
    height: 100%;
    margin: 0;
    padding: 0;
}

/* === GRID LAYOUT: Sidebar + Main =================================== */
.dashboard-grid-container[b-5jqutmc3pz] {
    display: grid;
    grid-template-columns: 130px minmax(0, 1fr);
    grid-template-areas: "sidebar main";
    height: 100vh;
    background-color: var(--bg-body);
}

/* === SIDEBAR (vlevo, sticky) ====================================== */
.sidebar-container[b-5jqutmc3pz] {
    grid-area: sidebar;
    background: var(--bg-sidebar);
    border-right: 1px solid var(--border);
    height: 100vh;
    position: sticky;
    top: 0;
    overflow-y: auto;
    display: flex;
    flex-direction: column;
    z-index: 30;
    box-shadow: 2px 0 15px rgba(15,23,42,.08);
    animation: slideInFromLeft-b-5jqutmc3pz .18s ease-out;
}

/* Logo / brand v sidebaru */
.sidebar-logo[b-5jqutmc3pz] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: .5rem;
    font-size: 1.1rem;
    font-weight: 800;
    color: var(--text-main);
    padding: 1rem 1.25rem;
    border-bottom: 1px solid var(--border);
    background: #fff;
}

/* === HLAVNÍ OBSAH ================================================== */
.dashboard-main-content[b-5jqutmc3pz] {
    grid-area: main;
    min-width: 0;
    overflow-y: auto;
    position: relative;
    z-index: 20;
    padding: 2.0rem 2.5rem;
    background: var(--bg-main);
    color: var(--text-main);
}

/* === NAVIGACE V SIDEBARU ========================================== */
.sidebar-nav[b-5jqutmc3pz] {
    padding: 1rem;
    flex-grow: 1;
}

.nav-section-title[b-5jqutmc3pz] {
    font-size: .72rem;
    font-weight: 800;
    color: var(--text-muted);
    text-transform: uppercase;
    letter-spacing: .08em;
    padding: 0 .5rem .6rem;
    margin-top: 1.1rem;
}

/* === NAV ODKAZY (ikonka nad textem) ================================ */
/* Pozn.: ::deep pro obsah v komponentách uvnitř layoutu (Blazor scoped) */
[b-5jqutmc3pz] .nav-link {
    position: relative;
    z-index: 20;
    width: 100%;
    min-height: 72px;
    padding: .75rem .5rem;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-decoration: none;
    color: #374151;
    background: transparent;
    border: 1px solid transparent;
    cursor: pointer;
    border-radius: 12px;
    transition: var(--transition);
    font-size: .625rem;
    font-weight: 600;
    text-align: center;
    line-height: 1.2;
    box-shadow: none;
}

    /* Ikony (Bootstrap Icons) – větší a čitelnější */
    [b-5jqutmc3pz] .nav-link i {
        margin: 0 0 .5rem 0;
        font-size: 1.8rem;
        line-height: 1;
        opacity: .92;
        transition: var(--transition);
    }

    /* Hover stav – jemný „lift“ a světle modré pozadí */
    [b-5jqutmc3pz] .nav-link:hover {
        background-color: var(--hover);
        color: var(--accent);
        transform: translateY(-1px);
        border-color: rgba(37,99,235,.18);
        box-shadow: var(--shadow-sm);
    }

        [b-5jqutmc3pz] .nav-link:hover i {
            opacity: 1;
            transform: scale(1.05);
            color: var(--accent);
        }

    /* Active stav – kontrastní text a decentní stín */
    [b-5jqutmc3pz] .nav-link.active,
    [b-5jqutmc3pz] .nav-link[aria-current="page"],
    [b-5jqutmc3pz] .nav-link[data-active="true"] {
        background: #fff;
        color: var(--accent);
        border-color: transparent;
        transform: translateY(-1px);
        box-shadow: var(--shadow-sm);
    }

        [b-5jqutmc3pz] .nav-link.active i {
            color: var(--accent);
            opacity: 1;
        }

    /* Focus ring pro přístupnost */
    [b-5jqutmc3pz] .nav-link:focus-visible {
        outline: none;
        box-shadow: var(--ring);
    }

/* Wrapper pro ikony (pokud používáš) */
.icon-wrapper[b-5jqutmc3pz] {
    position: relative !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    font-size: 1.3rem !important;
    margin-bottom: .5rem !important;
    transition: var(--transition) !important;
}

/* Text pod ikonami – přesná typografie */
.nav-link-text[b-5jqutmc3pz] {
    font-size: .625rem !important;
    font-weight: 600 !important;
    color: #374151 !important;
    max-width: 100% !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
    padding: 0 .25rem;
    line-height: 1.3 !important;
}

/* === MODAL / TOAST VRSTVY (Bootstrap kompatibilně) ================= */
:root[b-5jqutmc3pz] {
    --zindex-modal-backdrop: 1050;
    --zindex-modal: 1065;
}

[b-5jqutmc3pz] .modal-backdrop {
    z-index: var(--zindex-modal-backdrop) !important;
}

[b-5jqutmc3pz] .modal, [b-5jqutmc3pz] .modal-dialog, [b-5jqutmc3pz] .modal-content {
    z-index: var(--zindex-modal) !important;
}

.toast-container[b-5jqutmc3pz] {
    z-index: 12000 !important;
}

/* === RESPONSIVITA =================================================== */
@media (max-width: 768px) {
    .dashboard-grid-container[b-5jqutmc3pz] {
        grid-template-columns: 100px minmax(0,1fr);
    }

    .dashboard-main-content[b-5jqutmc3pz] {
        padding: 1.25rem;
    }

    [b-5jqutmc3pz] .nav-link i {
        font-size: 1.2rem !important;
    }

    [b-5jqutmc3pz] .nav-link {
        min-height: 68px;
    }
}

/* === ANIMACE ======================================================== */
@keyframes slideInFromLeft-b-5jqutmc3pz {
    from {
        transform: translateX(-100%);
        opacity: 0;
    }

    to {
        transform: translateX(0);
        opacity: 1;
    }
}

/* =========================================================
   Typografická hierarchie card headerů (globálně pro Dashboard)
   - titulek = 800
   - „tučné“ texty uvnitř headeru = 600 + tlumenější barva
   - funguje přes ::deep (Blazor CSS isolation)
   ========================================================= */

.dashboard-main-content[b-5jqutmc3pz]  .card-header h1,
.dashboard-main-content[b-5jqutmc3pz]  .card-header h2,
.dashboard-main-content[b-5jqutmc3pz]  .card-header h3,
.dashboard-main-content[b-5jqutmc3pz]  .card-header h4,
.dashboard-main-content[b-5jqutmc3pz]  .card-header h5,
.dashboard-main-content[b-5jqutmc3pz]  .card-header h6 {
    font-weight: 600;
    letter-spacing: 0.2px;
    margin: 0;
}

.dashboard-main-content[b-5jqutmc3pz]  .card-header strong,
.dashboard-main-content[b-5jqutmc3pz]  .card-header b {
    font-weight: 400;
    color: #475569; /* tlumenější než titulek, lepší hierarchie */
}

/* Pokud někde používáš .fw-bold (má !important) */
.dashboard-main-content[b-5jqutmc3pz]  .card-header .fw-bold {
    font-weight: 400 !important;
    color: #475569 !important;
}

/* Metadata v headeru (nenápadnější) */
.dashboard-main-content[b-5jqutmc3pz]  .card-header small {
    color: #64748b;
    font-weight: 400;
    letter-spacing: .2px;
}

/* Tlačítka v headeru – aby nebyla výraznější než titulek */
.dashboard-main-content[b-5jqutmc3pz]  .card-header .btn {
    font-weight: 400;
}

/* /Components/Layout/MainLayout.razor.rz.scp.css */
/* Hlavn� kontejner layoutu, kter� se rozt�hne p�es celou v��ku */
.page[b-5bbxqxqs4r] {
    display: flex;
    flex-direction: column;
    min-height: 100vh;
}

/* Fixn� naviga�n� li�ta naho�e */
.top-nav[b-5bbxqxqs4r] {
    position: fixed;
    top: 0;
    width: 100%;
    height: 70px;
    z-index: 1050;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.08);
}

/*
 * Pou�it� ::deep je Z�SADN�.
 * ��k�, �e se n�sleduj�c� styly maj� aplikovat i na "d�tsk�" komponenty
 * uvnit� tohoto layoutu (tedy na Bootstrap navbar a jeho prvky).
 * Bez ::deep by se styly pro navbar neaplikovaly.
*/

[b-5bbxqxqs4r] .navbar-brand img {
    height: 40px;
}

[b-5bbxqxqs4r] .nav-link {
    font-weight: 400;
    transition: color 0.2s ease-in-out;
}

    [b-5bbxqxqs4r] .nav-link.active {
        color: #a27b40 !important;
        font-weight: 600;
    }

    [b-5bbxqxqs4r] .nav-link:hover {
        color: #a27b40 !important;
    }


/* Hlavn� obsahov� ��st str�nky */
main[b-5bbxqxqs4r] {
    flex: 1; /* Zajist�, �e zabere ve�ker� voln� m�sto */
    padding-top: 70px; /* Vytvo�� odsazen� kv�li fixn�mu navbaru */
}


/* Pati�ka, kter� se v�dy dr�� dole */
.site-footer[b-5bbxqxqs4r] {
    background-color: #f8f9fa;
    padding: 1.5rem 1rem;
    text-align: center;
    margin-top: auto; /* Toto "vytla��" pati�ku na spodek flex kontejneru */
    border-top: 1px solid #e9ecef;
    font-size: 0.9rem;
    color: #6c757d;
}

[b-5bbxqxqs4r] .site-footer a {
    color: #495057;
    text-decoration: none;
    margin: 0 10px;
}

    [b-5bbxqxqs4r] .site-footer a:hover {
        text-decoration: underline;
        color: #a27b40;
    }

/* Blazor chybov� li�ta */
#blazor-error-ui[b-5bbxqxqs4r] {
    color-scheme: light only;
    background: lightyellow;
    bottom: 0;
    box-shadow: 0 -1px 2px rgba(0, 0, 0, 0.2);
    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-5bbxqxqs4r] {
        cursor: pointer;
        position: absolute;
        right: 0.75rem;
        top: 0.5rem;
    }
/* /Components/Layout/NavMenu.razor.rz.scp.css */
/*.navbar-toggler {
    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 {
    background-color: rgba(255, 255, 255, 0.5);
}

.top-row {
    min-height: 3.5rem;
    background-color: rgba(0,0,0,0.4);
}

.navbar-brand {
    font-size: 1.1rem;
}

.bi {
    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 {
    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.25.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 {
    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 {
    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 {
    font-size: 0.9rem;
    padding-bottom: 0.5rem;
}

    .nav-item:first-of-type {
        padding-top: 1rem;
    }

    .nav-item:last-of-type {
        padding-bottom: 1rem;
    }

    .nav-item ::deep .nav-link {
        color: #d7d7d7;
        background: none;
        border: none;
        border-radius: 4px;
        height: 3rem;
        display: flex;
        align-items: center;
        line-height: 3rem;
        width: 100%;
    }

.nav-item ::deep a.active {
    background-color: rgba(255,255,255,0.37);
    color: white;
}

.nav-item ::deep .nav-link:hover {
    background-color: rgba(255,255,255,0.1);
    color: white;
}

.nav-scrollable {
    display: none;
}

.navbar-toggler:checked ~ .nav-scrollable {
    display: block;
}

@media (min-width: 641px) {
    .navbar-toggler {
        display: none;
    }

    .nav-scrollable {*/
        /* Never collapse the sidebar for wide screens */
        /*display: block;*/

        /* Allow sidebar to scroll for tall menus */
        /*height: calc(100vh - 3.5rem);
        overflow-y: auto;
    }
}*/
/* /Components/Pages/Account/AccessDenied.razor.rz.scp.css */
.card[b-0lweewgcje] {
    transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.btn[b-0lweewgcje] {
    transition: all 0.2s ease;
}

    .btn:hover[b-0lweewgcje] {
        transform: translateY(-1px);
    }

.spinner-border[b-0lweewgcje] {
    animation: spin-b-0lweewgcje 1s linear infinite;
}

@keyframes spin-b-0lweewgcje {
    from {
        transform: rotate(0deg);
    }

    to {
        transform: rotate(360deg);
    }
}
/* /Components/Pages/Account/Login.razor.rz.scp.css */
.spin[b-q9836xl26o] {
    animation: spin 1s linear infinite;
}

@@keyframes spin {
    from[b-q9836xl26o] {
        transform: rotate(0deg);
    }

    to[b-q9836xl26o] {
        transform: rotate(360deg);
    }
}

.card[b-q9836xl26o] {
    transition: transform 0.2s ease, box-shadow 0.2s ease;
}

    .card:hover[b-q9836xl26o] {
        transform: translateY(-2px);
        box-shadow: 0 8px 25px rgba(0,0,0,0.15) !important;
    }

.form-control:focus[b-q9836xl26o] {
    border-color: #0d6efd;
    box-shadow: 0 0 0 0.2rem rgba(13, 110, 253, 0.25);
}

.btn-primary[b-q9836xl26o] {
    background: linear-gradient(135deg, #0d6efd, #0b5ed7);
    border: none;
}

    .btn-primary:hover[b-q9836xl26o] {
        background: linear-gradient(135deg, #0b5ed7, #0a58ca);
        transform: translateY(-1px);
    }
/* /Components/Pages/Admin/AdminDashboard.razor.rz.scp.css */
/* =================================================================
   DASHBOARD.RAZOR.CSS — OPTIMALIZOVANÝ SVĚTLÝ DESIGN
   - 1:1 nad Bootstrapem, pouze existující class-names z Dashboardu
   - Žádné nové obaly, jemné efekty, přístupnost a výkon
   ================================================================= */

/* === KARTY (obecné) ================================================= */
.card[b-iw5k4epcke] {
    background: linear-gradient(135deg, #ffffff, #f8fafc);
    border: 1px solid #e5e7eb; /* gray-200 */
    color: #0f172a; /* slate-900 */
    border-radius: 12px;
    box-shadow: 0 4px 14px rgba(15,23,42,0.06);
    transition: background-color .25s ease, border-color .25s ease, box-shadow .25s ease, transform .15s ease;
}

    .card:hover[b-iw5k4epcke] {
        transform: translateY(-2px);
        box-shadow: 0 8px 22px rgba(15,23,42,0.10);
        border-color: #cbd5e1; /* gray-300 */
    }

.card-header[b-iw5k4epcke] {
    background: linear-gradient(135deg, #f3f4f6, #e5e7eb) !important;
    border-bottom: 1px solid #e5e7eb;
    color: #0f172a !important;
    font-weight: 700;
    border-radius: 12px 12px 0 0 !important;
    padding: 1rem 1.25rem;
}

.card-body[b-iw5k4epcke] {
    background: linear-gradient(135deg, #ffffff, #f8fafc);
    color: #111827;
}

/* Akcentní varianty headerů zachovány */
.card-header.bg-primary[b-iw5k4epcke] {
    background: linear-gradient(135deg, #60a5fa, #3b82f6) !important;
    color: #fff !important;
    box-shadow: 0 2px 8px rgba(59,130,246,.25);
}

.card-header.bg-info[b-iw5k4epcke] {
    background: linear-gradient(135deg, #22d3ee, #06b6d4) !important;
    color: #fff !important;
    box-shadow: 0 2px 8px rgba(6,182,212,.22);
}

.card-header.bg-light[b-iw5k4epcke] {
    background: linear-gradient(135deg, #f3f4f6, #e5e7eb) !important;
    color: #0f172a !important;
}

/* === KPI KARTY ====================================================== */
.stat-card[b-iw5k4epcke] {
    background: linear-gradient(135deg, #ffffff, #f8fafc);
    border: 1px solid #e5e7eb;
    border-radius: 12px;
    cursor: default;
    display: flex;
    align-items: center;
    gap: 1rem;
    padding: 1.25rem 1.5rem;
    box-shadow: 0 4px 14px rgba(15,23,42,0.06);
    transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease;
}

    .stat-card:hover[b-iw5k4epcke] {
        transform: translateY(-4px);
        box-shadow: 0 10px 26px rgba(15,23,42,.10);
        border-color: #bfdbfe;
    }

.stat-icon[b-iw5k4epcke] {
    width: 56px;
    height: 56px;
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #fff;
    font-size: 1.4rem;
    box-shadow: 0 4px 12px rgba(15,23,42,.12);
    transition: transform .15s ease;
}

.stat-card:hover .stat-icon[b-iw5k4epcke] {
    transform: scale(1.06);
}

.stat-icon.bg-primary[b-iw5k4epcke] {
    background: linear-gradient(135deg,#60a5fa,#3b82f6);
}

.stat-icon.bg-success[b-iw5k4epcke] {
    background: linear-gradient(135deg,#34d399,#10b981);
}

.stat-icon.bg-warning[b-iw5k4epcke] {
    background: linear-gradient(135deg,#fbbf24,#f59e0b);
}

.stat-icon.bg-info[b-iw5k4epcke] {
    background: linear-gradient(135deg,#22d3ee,#06b6d4);
}

.stat-content h3[b-iw5k4epcke] {
    margin: 0;
    font-weight: 800;
    color: #0f172a;
    font-size: 1.75rem;
}

.stat-content p[b-iw5k4epcke] {
    margin: 0;
    color: #6b7280;
    font-weight: 600;
    font-size: .9rem;
}

/* === FILTRAČNÍ TLAČÍTKA ============================================ */
.filter-btn[b-iw5k4epcke] {
    border: 1px solid #e5e7eb;
    background: linear-gradient(135deg,#ffffff,#f5f7fb);
    color: #0f172a;
    border-radius: 10px;
    padding: .6rem 1rem;
    font-weight: 700;
    box-shadow: 0 2px 8px rgba(15,23,42,.06);
    transition: box-shadow .2s ease, transform .15s ease, background .25s ease, border-color .25s ease;
}

    .filter-btn:hover[b-iw5k4epcke],
    .filter-btn:focus[b-iw5k4epcke] {
        background: linear-gradient(135deg,#f8fafc,#edf2ff);
        border-color: #cbd5e1;
        box-shadow: 0 6px 18px rgba(15,23,42,.08);
    }

    .filter-btn.active[b-iw5k4epcke],
    .filter-btn[aria-pressed="true"][b-iw5k4epcke] {
        border-color: #3b82f6;
        box-shadow: 0 0 0 .2rem rgba(59,130,246,.18);
    }

/* === BADGE urgent =================================================== */
@keyframes pulse-urgent-b-iw5k4epcke {
    0% {
        filter: drop-shadow(0 0 0 rgba(239,68,68,0));
    }

    50% {
        filter: drop-shadow(0 0 8px rgba(239,68,68,.35));
    }

    100% {
        filter: drop-shadow(0 0 0 rgba(239,68,68,0));
    }
}

.badge-urgent[b-iw5k4epcke] {
    animation: pulse-urgent-b-iw5k4epcke 1.8s ease-in-out infinite;
}

/* === TABULKY ======================================================== */
.table[b-iw5k4epcke] {
    color: #0f172a;
    background: transparent;
}

    .table thead th[b-iw5k4epcke] {
        background: linear-gradient(135deg,#f3f4f6,#e5e7eb);
        color: #0f172a;
        border-color: #e5e7eb;
        font-weight: 800;
        letter-spacing: .3px;
    }

.table-hover tbody tr:hover[b-iw5k4epcke] {
    background: linear-gradient(135deg, rgba(59,130,246,.10), rgba(29,78,216,.10)) !important;
    color: #0f172a;
}

/* Stavové řádky (respektuje tvé dynamické class) */
.table-warning > *[b-iw5k4epcke] {
    background: linear-gradient(135deg, rgba(251,191,36,.14), rgba(245,158,11,.14)) !important;
    border-color: rgba(245,158,11,.35);
}

.table-info > *[b-iw5k4epcke] {
    background: linear-gradient(135deg, rgba(34,211,238,.12), rgba(6,182,212,.12)) !important;
    border-color: rgba(6,182,212,.32);
}

.table-primary > *[b-iw5k4epcke] {
    background: linear-gradient(135deg, rgba(59,130,246,.12), rgba(29,78,216,.12)) !important;
    border-left: 4px solid #3b82f6 !important;
}

/* === PROGRESS bary ================================================== */
.progress[b-iw5k4epcke] {
    background: #eef2f7;
    border-radius: 999px;
    overflow: hidden;
}

    .progress .progress-bar[b-iw5k4epcke] {
        background-image: linear-gradient(90deg, rgba(0,0,0,.10) 0 25%, transparent 25% 50%, rgba(0,0,0,.10) 50% 75%, transparent 75% 100%);
        background-size: 2rem 100%;
    }

/* === MODAL ========================================================== */
.modal-content[b-iw5k4epcke] {
    background: linear-gradient(135deg,#ffffff,#f8fafc);
    border: 1px solid #e5e7eb;
    color: #0f172a;
    border-radius: 12px;
    box-shadow: 0 20px 60px rgba(15,23,42,.18);
}

.modal-header[b-iw5k4epcke] {
    background: linear-gradient(135deg,#f3f4f6,#e5e7eb);
    border-bottom: 1px solid #e5e7eb;
}

.modal-footer[b-iw5k4epcke] {
    border-top: 1px solid #e5e7eb;
    background: linear-gradient(135deg,#f9fafb,#f3f4f6);
}

/* === SPINNER ======================================================== */
.spinner-border[b-iw5k4epcke] {
    width: 1.25rem !important;
    height: 1.25rem !important;
    border-width: .18rem;
    color: #3b82f6;
    opacity: .85;
}

/* === BTN – fokus a outline varianty ================================= */
.btn:focus-visible[b-iw5k4epcke] {
    outline: none;
    box-shadow: 0 0 0 .25rem rgba(59,130,246,.25);
}

.btn-outline-light[b-iw5k4epcke] {
    color: #0f172a;
    border-color: #e5e7eb;
}

    .btn-outline-light:hover[b-iw5k4epcke] {
        background: #f3f4f6;
    }

/* === Karty se stavovými bordery (už je generuješ dynamicky) ========= */
.card.border-warning[b-iw5k4epcke] {
    box-shadow: 0 0 0 1px rgba(245,158,11,.28) inset;
}

.card.border-danger[b-iw5k4epcke] {
    box-shadow: 0 0 0 1px rgba(239,68,68,.30) inset;
}

/* === ALERTY (nepřehnané, světlé) =================================== */
.alert[b-iw5k4epcke] {
    border-radius: 12px;
    border: none;
    box-shadow: 0 4px 12px rgba(15,23,42,.08);
    color: #0f172a;
}

.alert-danger[b-iw5k4epcke] {
    background: linear-gradient(135deg,#fee2e2,#fecaca);
    border-left: 5px solid #ef4444;
}

.alert-warning[b-iw5k4epcke] {
    background: linear-gradient(135deg,#fef3c7,#fde68a);
    border-left: 5px solid #f59e0b;
}

.alert-info[b-iw5k4epcke] {
    background: linear-gradient(135deg,#e0f2fe,#bae6fd);
    border-left: 5px solid #0ea5e9;
}

/* === PŘÍSTUPNOST ==================================================== */
@media (prefers-reduced-motion: reduce) {
    *[b-iw5k4epcke] {
        transition: none !important;
        animation: none !important;
    }
}

/* === RESPONSIVE drobnosti ========================================== */
@media (max-width: 768px) {
    .stat-card[b-iw5k4epcke] {
        flex-direction: column;
        text-align: center;
    }
}

/* ============================================================
   TABLE QUIET – decentní tabulky (Nejnovější / Nejbližší)
   - jemné svislé dělítko přes inset shadow (bez tvrdých borderů)
   - lehké zebra řádky, decentní hover, čitelná hierarchie
   - opt-in: .table.table-quiet
   ============================================================ */

.table.table-quiet[b-iw5k4epcke] {
    border-collapse: separate; /* lepší radiusy a dělítka */
    border-spacing: 0;
    background: transparent;
}

    /* Hlavička – světle šedá bez silných hran */
    .table.table-quiet thead th[b-iw5k4epcke] {
        background: linear-gradient(135deg, #f6f7fb, #eef2f6);
        color: #0f172a;
        border: 0; /* bez default borderu */
        font-weight: 700; /* méně “křičí” než 800 */
        text-transform: none; /* jemnější než uppercase */
        letter-spacing: .1px;
        padding: .85rem 1rem;
        box-shadow: inset -1px 0 0 #eef2f7; /* svislé dělítko mezi sloupci */
    }

        .table.table-quiet thead th:first-child[b-iw5k4epcke] {
            border-top-left-radius: 10px;
            box-shadow: none;
        }

        .table.table-quiet thead th:last-child[b-iw5k4epcke] {
            border-top-right-radius: 10px;
        }

    /* Buňky – žádné tvrdé hrany, jemné dělítko mezi sloupci */
    .table.table-quiet tbody td[b-iw5k4epcke] {
        border: 0;
        padding: .9rem 1rem;
        vertical-align: middle;
        box-shadow: inset -1px 0 0 #eef2f7; /* dělítko */
    }

        .table.table-quiet tbody td:last-child[b-iw5k4epcke] {
            box-shadow: none;
        }

    /* Zebra + hover – úplně decentní, bez výrazných barev */
    .table.table-quiet tbody tr[b-iw5k4epcke] {
        background: #fff;
        transition: background .18s ease, box-shadow .18s ease;
    }

        .table.table-quiet tbody tr:nth-child(even)[b-iw5k4epcke] {
            background: #fbfdff;
        }
        /* velmi jemné */
        .table.table-quiet tbody tr:hover[b-iw5k4epcke] {
            background: #f4f7ff; /* jen náznak modré */
            box-shadow: inset 0 0 0 1px rgba(59,130,246,.08);
        }

        /* Spodní radius tabulky, ať odlehčí kartu */
        .table.table-quiet tbody tr:last-child td:first-child[b-iw5k4epcke] {
            border-bottom-left-radius: 10px;
        }

        .table.table-quiet tbody tr:last-child td:last-child[b-iw5k4epcke] {
            border-bottom-right-radius: 10px;
        }

    /* Jemná hierarchie v prvním sloupci (Klient) a metadatech */
    .table.table-quiet tbody td:first-child[b-iw5k4epcke] {
        font-weight: 700;
    }
    /* jméno klienta */
    .table.table-quiet tbody td small[b-iw5k4epcke] {
        color: #64748b;
        font-weight: 600;
    }

    /* Status/badge v těle řádku a akční tlačítka – zarovnání a “lehčí” vzhled */
    .table.table-quiet .badge[b-iw5k4epcke] {
        transform: translateY(-1px);
    }

    .table.table-quiet .btn[b-iw5k4epcke] {
        padding: .4rem .6rem;
        border-radius: 8px;
    }

    /* Headery sloupců s čísly/daty mohou být centrované (volitelné) */
    .table.table-quiet thead th.text-center[b-iw5k4epcke],
    .table.table-quiet tbody td.text-center[b-iw5k4epcke] {
        text-align: center;
    }

/* Responzivní drobnosti */
@media (max-width: 768px) {
    .table.table-quiet thead th[b-iw5k4epcke],
    .table.table-quiet tbody td[b-iw5k4epcke] {
        padding: .7rem .75rem;
    }
}
/* === TABLE-QUIET — výraznější odlišení T(H) od section headeru ===== */
/* flat bílé pozadí, jemná spodní akcent čára a decentní dělítka      */

.table.table-quiet thead th[b-iw5k4epcke] {
    /* odlišení od šedého headeru sekce: čistě bílé, ne gradient */
    background: #ffffff;
    color: #0f172a;
    font-weight: 700; /* lehčí než card header (800) */
    text-transform: none;
    letter-spacing: .1px;
    /* layout */
    border: 0;
    padding: .85rem 1rem;
    position: relative;
    /* velmi jemná svislá dělítka mezi sloupci */
    box-shadow: inset -1px 0 0 #eef2f7;
}

    /* první/poslední buňka: radius, bez svislého dělítka na okraji */
    .table.table-quiet thead th:first-child[b-iw5k4epcke] {
        border-top-left-radius: 10px;
        box-shadow: none;
    }

    .table.table-quiet thead th:last-child[b-iw5k4epcke] {
        border-top-right-radius: 10px;
        box-shadow: inset 0 0 0 #0000;
    }

    /* spodní akcentní linka pod celým theadem (jemný nádech barvy) */
    .table.table-quiet thead th[b-iw5k4epcke]::after {
        content: "";
        position: absolute;
        left: 0;
        right: 0;
        bottom: -1px;
        height: 2px;
        background: linear-gradient(90deg, #dbeafe, #e9d5ff 55%, #dcfce7); /* modrá → fialová → zelená */
        opacity: .6;
        border-bottom-left-radius: 10px;
        border-bottom-right-radius: 10px;
    }

/* zebra/hover zůstanou, jen malý tón do modra pro konzistenci */
.table.table-quiet tbody tr[b-iw5k4epcke] {
    background: #fff;
    transition: background .18s, box-shadow .18s;
}

    .table.table-quiet tbody tr:nth-child(even)[b-iw5k4epcke] {
        background: #fbfdff;
    }

    .table.table-quiet tbody tr:hover[b-iw5k4epcke] {
        background: #f4f7ff;
        box-shadow: inset 0 0 0 1px rgba(59,130,246,.08);
    }

/* /Components/Pages/Admin/Kalendar/Kalendar.razor.rz.scp.css */
/* /Components/Pages/Admin/Klienti/KlientiSeznam.razor.rz.scp.css */
/* /Components/Pages/Admin/Poptavky/DetailPoptavky.razor.rz.scp.css */
/* =================================================================
   DASHBOARDPOPTAVKADETAIL.RAZOR.CSS - OPTIMALIZOVANÝ SVĚTLÝ DESIGN
   1:1 náhrada za tmavou verzi – stejné class-names, žádné nové obaly
   ================================================================= */

/* === GLOBÁLNÍ SVĚTLÉ POZADÍ === */
html[b-pxtyf0phu4], body[b-pxtyf0phu4] {
    background: linear-gradient(135deg, #f8fafc 0%, #eef2f7 100%) !important;
    color: #111827 !important; /* slate-900 */
    min-height: 100vh;
}

/* === KONTEJNER === */
.container-fluid[b-pxtyf0phu4] {
    background: linear-gradient(135deg, #f8fafc 0%, #eef2f7 100%);
    color: #1f2937; /* gray-800 */
    min-height: 100vh;
}

/* === KARTY - SJEDNOCENÉ S DASHBOARD === */
.card[b-pxtyf0phu4] {
    background: linear-gradient(135deg, #ffffff, #f8fafc);
    border: 1px solid #e5e7eb; /* gray-200 */
    color: #111827;
    transition: all 0.3s ease;
    border-radius: 12px;
    box-shadow: 0 4px 14px rgba(15, 23, 42, 0.06);
    animation: fadeInUp-b-pxtyf0phu4 0.5s ease-out;
}

    .card:hover[b-pxtyf0phu4] {
        box-shadow: 0 8px 24px rgba(15, 23, 42, 0.10);
        transform: translateY(-3px);
        border-color: #93c5fd; /* blue-300 */
    }

.card-header[b-pxtyf0phu4] {
    background: linear-gradient(135deg, #f3f4f6, #e5e7eb) !important;
    border-bottom: 1px solid #e5e7eb;
    color: #0f172a !important; /* slate-900 */
    font-weight: 600;
    border-radius: 12px 12px 0 0 !important;
    padding: 1rem 1.5rem;
}

    .card-header.bg-primary[b-pxtyf0phu4] {
        background: linear-gradient(135deg, #60a5fa, #3b82f6) !important;
        color: white !important;
        box-shadow: 0 2px 8px rgba(59, 130, 246, 0.25);
    }

    .card-header.bg-info[b-pxtyf0phu4] {
        background: linear-gradient(135deg, #22d3ee, #06b6d4) !important;
        color: white !important;
        box-shadow: 0 2px 8px rgba(6, 182, 212, 0.25);
    }

    .card-header.bg-light[b-pxtyf0phu4] {
        background: linear-gradient(135deg, #f3f4f6, #e5e7eb) !important;
        color: #0f172a !important;
    }

.card-body[b-pxtyf0phu4] {
    background: linear-gradient(135deg, #ffffff, #f8fafc);
    color: #111827;
    padding: 1.5rem;
}

/* === NAVBAR AKCE - VYLEPŠENÉ === */
.navbar-actions[b-pxtyf0phu4] {
    display: flex;
    gap: 0.75rem;
    flex-wrap: wrap;
    align-items: center;
}

.navbar-btn[b-pxtyf0phu4] {
    padding: 0.75rem 1.25rem;
    font-size: 0.95rem;
    font-weight: 600;
    border-radius: 8px;
    transition: all 0.3s ease;
    display: flex;
    align-items: center;
    gap: 0.5rem;
    justify-content: center;
    text-decoration: none;
    border: 1px solid #e5e7eb;
    min-width: 120px;
    cursor: pointer;
    background: linear-gradient(135deg, #ffffff, #f5f7fb);
    color: #111827;
    position: relative;
    overflow: hidden;
    box-shadow: 0 2px 8px rgba(15,23,42,0.06);
}

    .navbar-btn[b-pxtyf0phu4]::before {
        content: '';
        position: absolute;
        top: 0;
        left: -100%;
        width: 100%;
        height: 100%;
        background: linear-gradient(90deg, transparent, rgba(0,0,0,0.06), transparent);
        transition: left 0.6s ease;
    }

    .navbar-btn:hover[b-pxtyf0phu4] {
        transform: translateY(-2px);
        box-shadow: 0 6px 18px rgba(15,23,42,0.08);
        text-decoration: none;
    }

        .navbar-btn:hover[b-pxtyf0phu4]::before {
            left: 100%;
        }

.btn-back[b-pxtyf0phu4] {
    background: linear-gradient(135deg, #f3f4f6, #e5e7eb);
    color: #111827;
    border-color: #e5e7eb;
}

    .btn-back:hover[b-pxtyf0phu4] {
        background: linear-gradient(135deg, #e5e7eb, #d1d5db);
        color: #0f172a;
        border-color: #d1d5db;
    }

.btn-email[b-pxtyf0phu4] {
    background: linear-gradient(135deg, #22d3ee, #06b6d4);
    color: white;
}

    .btn-email:hover[b-pxtyf0phu4] {
        background: linear-gradient(135deg, #06b6d4, #0891b2);
        color: white;
    }

.btn-refresh[b-pxtyf0phu4] {
    background: linear-gradient(135deg, #60a5fa, #3b82f6);
    color: white;
}

    .btn-refresh:hover[b-pxtyf0phu4] {
        background: linear-gradient(135deg, #3b82f6, #1d4ed8);
        color: white;
    }

/* === PRIORITY ALERTS - VYLEPŠENÉ === */
.alert[b-pxtyf0phu4] {
    border-radius: 12px;
    border: none;
    color: #0f172a;
    animation: slideInFromTop-b-pxtyf0phu4 0.5s ease-out;
    box-shadow: 0 4px 12px rgba(15,23,42,0.08);
    padding: 1.25rem 1.5rem;
    margin-bottom: 1.5rem;
}

.alert-danger[b-pxtyf0phu4] {
    background: linear-gradient(135deg, #fee2e2, #fecaca);
    border-left: 5px solid #ef4444;
    box-shadow: 0 4px 16px rgba(239,68,68,0.18);
}

.alert-warning[b-pxtyf0phu4] {
    background: linear-gradient(135deg, #fef3c7, #fde68a);
    border-left: 5px solid #f59e0b;
    box-shadow: 0 4px 16px rgba(245,158,11,0.18);
}

.alert-info[b-pxtyf0phu4] {
    background: linear-gradient(135deg, #e0f2fe, #bae6fd);
    border-left: 5px solid #0ea5e9;
    box-shadow: 0 4px 16px rgba(14,165,233,0.16);
}

/* === KOLIZNÍ UPOZORNĚNÍ === */
.alert-conflict-critical[b-pxtyf0phu4] {
    background: linear-gradient(135deg, #fee2e2, #fecaca) !important;
    border-left: 5px solid #ef4444 !important;
    color: #7f1d1d !important;
    box-shadow: 0 6px 18px rgba(239,68,68,0.22);
    position: relative;
}

.alert-conflict-serious[b-pxtyf0phu4] {
    background: linear-gradient(135deg, #fef3c7, #fde68a) !important;
    border-left: 5px solid #f59e0b !important;
    color: #7c2d12 !important;
    box-shadow: 0 6px 18px rgba(245,158,11,0.2);
}

.alert-conflict-light[b-pxtyf0phu4] {
    background: linear-gradient(135deg, #e0f2fe, #bae6fd) !important;
    border-left: 5px solid #0ea5e9 !important;
    color: #0c4a6e !important;
    box-shadow: 0 4px 14px rgba(14,165,233,0.16);
}

/* === MODAL STYLY === */
.modal.fade.show.d-block[b-pxtyf0phu4] {
    display: block !important;
    background: rgba(0, 0, 0, 0.45);
    backdrop-filter: blur(4px);
    z-index: 1050;
}

.modal-content[b-pxtyf0phu4] {
    background: linear-gradient(135deg, #ffffff, #f8fafc);
    border: 1px solid #e5e7eb;
    border-radius: 12px;
    color: #111827;
    box-shadow: 0 20px 60px rgba(15,23,42,0.18);
    animation: modalSlideIn-b-pxtyf0phu4 0.28s ease-out;
}

.modal-header[b-pxtyf0phu4] {
    background: linear-gradient(135deg, #f3f4f6, #e5e7eb);
    border-bottom: 1px solid #e5e7eb;
    border-radius: 12px 12px 0 0;
    padding: 1.25rem 1.5rem;
}

.modal-title[b-pxtyf0phu4] {
    color: #0f172a;
    font-weight: 600;
    font-size: 1.25rem;
}

.btn-close[b-pxtyf0phu4] {
    opacity: 0.65;
    transition: opacity 0.2s ease, transform 0.1s ease;
}

    .btn-close:hover[b-pxtyf0phu4] {
        opacity: 1;
        transform: scale(1.05);
    }

.modal-footer[b-pxtyf0phu4] {
    border-top: 1px solid #e5e7eb;
    background: linear-gradient(135deg, #f9fafb, #f3f4f6);
    border-radius: 0 0 12px 12px;
    padding: 1rem 1.5rem;
}

/* === INFO ITEMS === */
.info-item[b-pxtyf0phu4] {
    display: flex;
    align-items: flex-start;
    gap: 1rem;
    padding: 1rem 0;
    border-bottom: 1px solid #e5e7eb;
    transition: all 0.25s ease;
    border-radius: 8px;
}

    .info-item:hover[b-pxtyf0phu4] {
        background: linear-gradient(135deg, rgba(59,130,246,0.08), rgba(29,78,216,0.08));
        padding-left: 1rem;
        padding-right: 1rem;
        margin-left: -1rem;
        margin-right: -1rem;
    }

    .info-item:last-child[b-pxtyf0phu4] {
        border-bottom: none;
    }

.info-icon[b-pxtyf0phu4] {
    color: #3b82f6;
    width: 24px;
    text-align: center;
    margin-top: 0.25rem;
    flex-shrink: 0;
    font-size: 1.1rem;
    transition: all 0.2s ease;
}

.info-item:hover .info-icon[b-pxtyf0phu4] {
    color: #2563eb;
    transform: scale(1.07);
}

.info-item a[b-pxtyf0phu4] {
    color: #2563eb;
    transition: all 0.2s ease;
    text-decoration: none;
    border-bottom: 1px solid transparent;
}

    .info-item a:hover[b-pxtyf0phu4] {
        color: #1d4ed8;
        border-bottom-color: #93c5fd;
        text-decoration: none;
    }

.info-item small[b-pxtyf0phu4] {
    color: #6b7280;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    font-size: 0.75rem;
}

.info-item strong[b-pxtyf0phu4] {
    color: #0f172a;
    font-weight: 700;
    font-size: 1rem;
}

/* === STAT CARDS === */
.stat-card[b-pxtyf0phu4] {
    background: linear-gradient(135deg, #ffffff, #f8fafc);
    border-radius: 12px;
    padding: 1.5rem;
    box-shadow: 0 4px 14px rgba(15,23,42,0.06);
    display: flex;
    align-items: center;
    gap: 1rem;
    transition: all 0.25s ease;
    border: 1px solid #e5e7eb;
    cursor: pointer;
    animation: fadeInUp-b-pxtyf0phu4 0.5s ease-out;
}

    .stat-card:hover[b-pxtyf0phu4] {
        transform: translateY(-5px);
        box-shadow: 0 10px 26px rgba(15,23,42,0.10);
        border-color: #bfdbfe;
        background: linear-gradient(135deg, #ffffff, #f3f6ff);
    }

.stat-icon[b-pxtyf0phu4] {
    width: 60px;
    height: 60px;
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: white;
    font-size: 1.5rem;
    flex-shrink: 0;
    transition: transform 0.2s ease;
    box-shadow: 0 4px 12px rgba(15,23,42,0.12);
}

    .stat-icon.bg-primary[b-pxtyf0phu4] {
        background: linear-gradient(135deg, #60a5fa, #3b82f6);
    }

    .stat-icon.bg-success[b-pxtyf0phu4] {
        background: linear-gradient(135deg, #34d399, #10b981);
    }

    .stat-icon.bg-warning[b-pxtyf0phu4] {
        background: linear-gradient(135deg, #fbbf24, #f59e0b);
    }

    .stat-icon.bg-info[b-pxtyf0phu4] {
        background: linear-gradient(135deg, #22d3ee, #06b6d4);
    }

.stat-content h3[b-pxtyf0phu4] {
    margin: 0;
    font-size: 1.8rem;
    font-weight: 800;
    color: #0f172a;
}

.stat-content p[b-pxtyf0phu4] {
    margin: 0;
    color: #6b7280;
    font-size: 0.9rem;
    font-weight: 600;
}

/* === NABIDKA CARDS === */
.nabidka-card[b-pxtyf0phu4] {
    background: linear-gradient(135deg, #ffffff, #f8fafc);
    border: 1px solid #e5e7eb;
    border-radius: 12px;
    overflow: hidden;
    transition: all 0.3s ease;
    animation: fadeInUp-b-pxtyf0phu4 0.6s ease-out;
    margin-bottom: 1.5rem;
    box-shadow: 0 4px 14px rgba(15,23,42,0.06);
}

    .nabidka-card:hover[b-pxtyf0phu4] {
        box-shadow: 0 8px 22px rgba(15,23,42,0.10);
        transform: translateY(-3px);
        border-color: #93c5fd;
    }

.nabidka-header[b-pxtyf0phu4] {
    background: linear-gradient(135deg, #f3f4f6, #e5e7eb);
    padding: 1.25rem 1.5rem;
    display: flex;
    justify-content: space-between;
    align-items: center;
    border-bottom: 1px solid #e5e7eb;
    position: relative;
}

    .nabidka-header[b-pxtyf0phu4]::before {
        content: '';
        position: absolute;
        top: 0;
        left: 0;
        right: 0;
        height: 3px;
        background: linear-gradient(90deg, #3b82f6, #06b6d4, #10b981);
    }

.nabidka-info h6[b-pxtyf0phu4] {
    color: #0f172a;
    font-weight: 700;
    margin: 0;
    font-size: 1.1rem;
}

.nabidka-info small[b-pxtyf0phu4] {
    color: #6b7280;
    font-weight: 600;
}

.nabidka-actions[b-pxtyf0phu4] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    flex-wrap: wrap;
}

.nabidka-items[b-pxtyf0phu4] {
    padding: 0;
}

.nabidka-item[b-pxtyf0phu4] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 1.25rem 1.5rem;
    border-bottom: 1px solid #e5e7eb;
    transition: all 0.25s ease;
    position: relative;
}

    .nabidka-item:hover[b-pxtyf0phu4] {
        background: linear-gradient(135deg, rgba(59,130,246,0.08), rgba(29,78,216,0.08));
    }

        .nabidka-item:hover[b-pxtyf0phu4]::before {
            content: '';
            position: absolute;
            left: 0;
            top: 0;
            bottom: 0;
            width: 4px;
            background: linear-gradient(135deg, #3b82f6, #06b6d4);
        }

    .nabidka-item:last-child[b-pxtyf0phu4] {
        border-bottom: none;
    }

.item-content[b-pxtyf0phu4] {
    flex: 1;
    padding-right: 1rem;
}

.item-name[b-pxtyf0phu4] {
    font-weight: 700;
    color: #0f172a;
    margin-bottom: 0.5rem;
    font-size: 1.05rem;
}

.item-description[b-pxtyf0phu4] {
    color: #475569;
    font-size: 0.95rem;
    line-height: 1.55;
}

    .item-description p[b-pxtyf0phu4] {
        margin: 0;
    }

.item-actions[b-pxtyf0phu4] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    flex-wrap: wrap;
}

/* === HLAVNÍ AKČNÍ TLAČÍTKA === */
.action-btn[b-pxtyf0phu4] {
    padding: 0.75rem 1.25rem;
    font-size: 0.95rem;
    font-weight: 700;
    border-radius: 8px;
    transition: all 0.25s ease;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    box-shadow: 0 2px 8px rgba(15,23,42,0.06);
    border: 1px solid #e5e7eb;
    text-decoration: none;
    min-width: 120px;
    cursor: pointer;
    position: relative;
    overflow: hidden;
    background: linear-gradient(135deg, #ffffff, #f5f7fb);
    color: #111827;
}

    .action-btn[b-pxtyf0phu4]::before {
        content: '';
        position: absolute;
        top: 0;
        left: -100%;
        width: 100%;
        height: 100%;
        background: linear-gradient(90deg, transparent, rgba(0,0,0,0.06), transparent);
        transition: left 0.6s ease;
    }

    .action-btn:hover[b-pxtyf0phu4] {
        transform: translateY(-2px);
        box-shadow: 0 6px 18px rgba(15,23,42,0.08);
        text-decoration: none;
    }

        .action-btn:hover[b-pxtyf0phu4]::before {
            left: 100%;
        }

    .action-btn:active[b-pxtyf0phu4] {
        transform: translateY(0);
        box-shadow: 0 2px 8px rgba(15,23,42,0.06);
    }

    .action-btn:disabled[b-pxtyf0phu4] {
        opacity: 0.6;
        cursor: not-allowed;
        transform: none !important;
        box-shadow: 0 1px 3px rgba(15,23,42,0.04) !important;
    }

/* === SPECIFICKÉ STYLY TLAČÍTEK === */
.btn-link-copy[b-pxtyf0phu4] {
    background: linear-gradient(135deg, #22d3ee, #06b6d4);
    color: white;
}

    .btn-link-copy:hover[b-pxtyf0phu4] {
        background: linear-gradient(135deg, #06b6d4, #0e7490);
        color: white;
    }

.btn-delete-offer[b-pxtyf0phu4] {
    background: linear-gradient(135deg, #f87171, #ef4444);
    color: white;
}

    .btn-delete-offer:hover[b-pxtyf0phu4] {
        background: linear-gradient(135deg, #ef4444, #dc2626);
        color: white;
    }

.btn-email-send[b-pxtyf0phu4] {
    background: linear-gradient(135deg, #34d399, #10b981);
    color: white;
}

    .btn-email-send:hover[b-pxtyf0phu4] {
        background: linear-gradient(135deg, #10b981, #059669);
        color: white;
    }

.btn-export-pdf[b-pxtyf0phu4] {
    background: linear-gradient(135deg, #f87171, #ef4444);
    color: white;
}

    .btn-export-pdf:hover[b-pxtyf0phu4] {
        background: linear-gradient(135deg, #ef4444, #dc2626);
        color: white;
    }

.btn-print[b-pxtyf0phu4] {
    background: linear-gradient(135deg, #f3f4f6, #e5e7eb);
    color: #111827;
}

    .btn-print:hover[b-pxtyf0phu4] {
        background: linear-gradient(135deg, #e5e7eb, #d1d5db);
        color: #0f172a;
    }

/* === TLAČÍTKA PRO POLOŽKY === */
.item-btn[b-pxtyf0phu4] {
    padding: 0.5rem 0.75rem;
    font-size: 0.85rem;
    font-weight: 600;
    border-radius: 6px;
    transition: all 0.2s ease;
    display: flex;
    align-items: center;
    gap: 0.375rem;
    box-shadow: 0 1px 3px rgba(15,23,42,0.06);
    border: 1px solid #e5e7eb;
    cursor: pointer;
    min-width: 80px;
    background: #fff;
    color: #0f172a;
}

    .item-btn:hover[b-pxtyf0phu4] {
        transform: translateY(-1px);
        box-shadow: 0 3px 10px rgba(15,23,42,0.08);
    }

.btn-edit-item[b-pxtyf0phu4] {
    background: linear-gradient(135deg, #60a5fa, #3b82f6);
    color: white;
}

    .btn-edit-item:hover[b-pxtyf0phu4] {
        background: linear-gradient(135deg, #3b82f6, #1d4ed8);
        color: white;
    }

.btn-remove-item[b-pxtyf0phu4] {
    background: linear-gradient(135deg, #fbbf24, #f59e0b);
    color: white;
}

    .btn-remove-item:hover[b-pxtyf0phu4] {
        background: linear-gradient(135deg, #f59e0b, #d97706);
        color: white;
    }

/* === HLAVNÍ VYTVOŘENÍ NABÍDKY TLAČÍTKO === */
.btn-create-offer[b-pxtyf0phu4] {
    background: linear-gradient(135deg, #34d399, #10b981);
    color: white;
    padding: 1rem 2rem;
    font-size: 1.1rem;
    font-weight: 700;
    border-radius: 10px;
    box-shadow: 0 4px 16px rgba(16,185,129,0.25);
    border: none;
    cursor: pointer;
    transition: all 0.25s ease;
    display: flex;
    align-items: center;
    gap: 0.75rem;
    position: relative;
    overflow: hidden;
}

    .btn-create-offer[b-pxtyf0phu4]::before {
        content: '';
        position: absolute;
        top: 0;
        left: -100%;
        width: 100%;
        height: 100%;
        background: linear-gradient(90deg, transparent, rgba(255,255,255,0.4), transparent);
        transition: left 0.6s ease;
    }

    .btn-create-offer:hover[b-pxtyf0phu4] {
        background: linear-gradient(135deg, #10b981, #059669);
        transform: translateY(-3px);
        box-shadow: 0 8px 24px rgba(16,185,129,0.35);
        color: white;
    }

        .btn-create-offer:hover[b-pxtyf0phu4]::before {
            left: 100%;
        }

/* === CENY === */
.total-price[b-pxtyf0phu4] {
    font-size: 1.2rem;
    font-weight: 800;
    color: #047857;
    background: linear-gradient(135deg, #ecfdf5, #d1fae5);
    padding: 0.75rem 1.25rem;
    border-radius: 8px;
    border: 1px solid #a7f3d0;
    box-shadow: 0 2px 8px rgba(16,185,129,0.16);
    text-shadow: none;
    transition: all 0.25s ease;
}

    .total-price:hover[b-pxtyf0phu4] {
        transform: scale(1.03);
        box-shadow: 0 4px 14px rgba(16,185,129,0.22);
    }

.item-price[b-pxtyf0phu4] {
    font-weight: 700;
    color: #0f172a;
    background: linear-gradient(135deg, #ffffff, #f8fafc);
    padding: 0.5rem 0.75rem;
    border-radius: 6px;
    min-width: 100px;
    text-align: center;
    border: 1px solid #e5e7eb;
    box-shadow: 0 1px 3px rgba(15,23,42,0.06);
    transition: all 0.2s ease;
}

    .item-price:hover[b-pxtyf0phu4] {
        background: linear-gradient(135deg, #f8fafc, #edf2ff);
        transform: scale(1.03);
    }

/* === LOADING SPINNER PRO TLAČÍTKA === */
.btn-loading[b-pxtyf0phu4] {
    position: relative;
    color: transparent !important;
    pointer-events: none;
}

    .btn-loading[b-pxtyf0phu4]::after {
        content: "";
        position: absolute;
        width: 16px;
        height: 16px;
        top: 50%;
        left: 50%;
        margin-left: -8px;
        margin-top: -8px;
        border: 2px solid transparent;
        border-top-color: currentColor;
        border-radius: 50%;
        animation: spin-b-pxtyf0phu4 1s linear infinite;
        color: white;
    }

/* === PRÁZDNÝ STAV === */
.empty-state[b-pxtyf0phu4] {
    text-align: center;
    padding: 3rem 1rem;
    background: linear-gradient(135deg, #ffffff, #f8fafc);
    border-radius: 12px;
    border: 2px dashed #e5e7eb;
    transition: all 0.25s ease;
}

    .empty-state:hover[b-pxtyf0phu4] {
        border-color: #cbd5e1;
        background: linear-gradient(135deg, #ffffff, #f3f6ff);
    }

    .empty-state i[b-pxtyf0phu4] {
        opacity: 0.6;
        color: #94a3b8;
        transition: all 0.2s ease;
    }

    .empty-state:hover i[b-pxtyf0phu4] {
        opacity: 0.85;
        transform: scale(1.06);
    }

    .empty-state h5[b-pxtyf0phu4] {
        color: #475569;
        font-weight: 700;
    }

    .empty-state p[b-pxtyf0phu4] {
        color: #64748b;
    }

/* === DOTAZNÍK SEKCE === */
.dotaznik-summary[b-pxtyf0phu4] {
    background: linear-gradient(135deg, #ffffff, #f8fafc);
    padding: 1.25rem;
    border-radius: 8px;
    border: 1px solid #e5e7eb;
    transition: all 0.25s ease;
    cursor: pointer;
    position: relative;
    overflow: hidden;
}

    .dotaznik-summary[b-pxtyf0phu4]::before {
        content: '';
        position: absolute;
        top: 0;
        left: -100%;
        width: 100%;
        height: 100%;
        background: linear-gradient(90deg, transparent, rgba(0,0,0,0.06), transparent);
        transition: left 0.6s ease;
    }

    .dotaznik-summary:hover[b-pxtyf0phu4] {
        background: linear-gradient(135deg, #f8fafc, #edf2ff);
        border-color: #cbd5e1;
        transform: translateY(-1px);
        box-shadow: 0 4px 12px rgba(15,23,42,0.08);
    }

        .dotaznik-summary:hover[b-pxtyf0phu4]::before {
            left: 100%;
        }

.dotaznik-detail[b-pxtyf0phu4] {
    animation: fadeInDown-b-pxtyf0phu4 0.25s ease-out;
    padding-top: 1rem;
}

.info-group[b-pxtyf0phu4] {
    background: linear-gradient(135deg, #ffffff, #f8fafc);
    padding: 1.5rem;
    border-radius: 8px;
    border: 1px solid #e5e7eb;
    box-shadow: 0 2px 8px rgba(15,23,42,0.06);
    height: 100%;
    transition: all 0.25s ease;
}

    .info-group:hover[b-pxtyf0phu4] {
        border-color: #cbd5e1;
        box-shadow: 0 4px 14px rgba(15,23,42,0.08);
        transform: translateY(-2px);
    }

.dotaznik-info-item[b-pxtyf0phu4] {
    display: flex;
    flex-direction: column;
    margin-bottom: 1rem;
    padding: 0.75rem 0;
    border-bottom: 1px solid #e5e7eb;
    transition: all 0.2s ease;
}

    .dotaznik-info-item:hover[b-pxtyf0phu4] {
        padding-left: 0.5rem;
        border-left: 3px solid #3b82f6;
    }

    .dotaznik-info-item:last-child[b-pxtyf0phu4] {
        border-bottom: none;
        margin-bottom: 0;
    }

    .dotaznik-info-item strong[b-pxtyf0phu4] {
        color: #6b7280;
        font-size: 0.85rem;
        font-weight: 700;
        margin-bottom: 0.25rem;
        text-transform: uppercase;
        letter-spacing: 0.5px;
    }

    .dotaznik-info-item span[b-pxtyf0phu4], .dotaznik-info-item a[b-pxtyf0phu4] {
        color: #0f172a;
        font-size: 1rem;
        font-weight: 600;
        transition: all 0.2s ease;
    }

    .dotaznik-info-item a[b-pxtyf0phu4] {
        color: #2563eb;
        text-decoration: none;
        border-bottom: 1px solid transparent;
    }

        .dotaznik-info-item a:hover[b-pxtyf0phu4] {
            color: #1d4ed8;
            border-bottom-color: #93c5fd;
            text-decoration: none;
        }

.dotaznik-additional-info[b-pxtyf0phu4] {
    background: linear-gradient(135deg, #ffffff, #f8fafc);
    padding: 1.25rem;
    border-radius: 8px;
    border-left: 4px solid #8b5cf6;
    color: #111827;
    line-height: 1.6;
    font-size: 0.95rem;
    box-shadow: 0 2px 8px rgba(15,23,42,0.06);
    transition: all 0.25s ease;
}

    .dotaznik-additional-info:hover[b-pxtyf0phu4] {
        box-shadow: 0 4px 14px rgba(15,23,42,0.08);
        transform: translateX(2px);
    }

.empty-state-dotaznik[b-pxtyf0phu4] {
    padding: 2.5rem 1rem;
    text-align: center;
}

    .empty-state-dotaznik i[b-pxtyf0phu4] {
        opacity: 0.7;
        color: #94a3b8;
        transition: all 0.2s ease;
    }

    .empty-state-dotaznik:hover i[b-pxtyf0phu4] {
        opacity: 1;
        transform: scale(1.06);
    }

    .empty-state-dotaznik h6[b-pxtyf0phu4] {
        font-weight: 700;
        color: #64748b;
        margin-bottom: 0.75rem;
    }

    .empty-state-dotaznik p[b-pxtyf0phu4] {
        color: #94a3b8;
        line-height: 1.5;
    }

.dotaznik-actions[b-pxtyf0phu4] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.75rem;
    border-top: 1px solid #e5e7eb;
    padding-top: 1.25rem;
    margin-top: 1.25rem;
}

/* === BADGES === */
.badge[b-pxtyf0phu4] {
    font-size: 0.8rem;
    padding: 0.5rem 0.75rem;
    font-weight: 700;
    border-radius: 8px;
    transition: all 0.2s ease;
    box-shadow: 0 1px 3px rgba(15,23,42,0.06);
}

    .badge:hover[b-pxtyf0phu4] {
        transform: scale(1.05);
        box-shadow: 0 2px 8px rgba(15,23,42,0.08);
    }

    .badge.bg-warning[b-pxtyf0phu4] {
        background: linear-gradient(135deg, #fbbf24, #f59e0b) !important;
        color: #1f2937 !important;
    }

    .badge.bg-info[b-pxtyf0phu4] {
        background: linear-gradient(135deg, #22d3ee, #06b6d4) !important;
        color: white !important;
    }

    .badge.bg-success[b-pxtyf0phu4] {
        background: linear-gradient(135deg, #34d399, #10b981) !important;
        color: white !important;
    }

    .badge.bg-danger[b-pxtyf0phu4] {
        background: linear-gradient(135deg, #f87171, #ef4444) !important;
        color: white !important;
    }

    .badge.bg-primary[b-pxtyf0phu4] {
        background: linear-gradient(135deg, #60a5fa, #3b82f6) !important;
        color: white !important;
    }

    .badge.bg-secondary[b-pxtyf0phu4] {
        background: linear-gradient(135deg, #e5e7eb, #cbd5e1) !important;
        color: #0f172a !important;
    }

/* === TABULKY === */
.table[b-pxtyf0phu4] {
    color: #111827;
    background-color: transparent;
}

    .table thead th[b-pxtyf0phu4] {
        background: linear-gradient(135deg, #f3f4f6, #e5e7eb);
        color: #0f172a;
        border-color: #e5e7eb;
        font-weight: 800;
        text-transform: uppercase;
        font-size: 0.85rem;
        letter-spacing: 0.5px;
        padding: 1rem 0.75rem;
        position: relative;
    }

        .table thead th[b-pxtyf0phu4]::after {
            content: '';
            position: absolute;
            bottom: 0;
            left: 0;
            right: 0;
            height: 2px;
            background: linear-gradient(90deg, #3b82f6, #06b6d4, #10b981);
        }

.table-bordered[b-pxtyf0phu4] {
    border-color: #e5e7eb;
    border-radius: 8px;
    overflow: hidden;
}

    .table-bordered th[b-pxtyf0phu4], .table-bordered td[b-pxtyf0phu4] {
        border-color: #e5e7eb;
        background-color: transparent;
        transition: all 0.2s ease;
    }

.table-hover tbody tr:hover[b-pxtyf0phu4] {
    background: linear-gradient(135deg, rgba(59,130,246,0.12), rgba(29,78,216,0.12)) !important;
    color: #0f172a;
    transform: scale(1.005);
}

.table-warning[b-pxtyf0phu4] {
    background: linear-gradient(135deg, rgba(251,191,36,0.15), rgba(245,158,11,0.15)) !important;
    color: #7c2d12;
}

.table-success[b-pxtyf0phu4] {
    background: linear-gradient(135deg, rgba(52,211,153,0.15), rgba(16,185,129,0.15)) !important;
    color: #065f46;
}

.table-danger[b-pxtyf0phu4] {
    background: linear-gradient(135deg, rgba(248,113,113,0.15), rgba(239,68,68,0.15)) !important;
    color: #7f1d1d;
}

.table-primary[b-pxtyf0phu4] {
    background: linear-gradient(135deg, rgba(59,130,246,0.15), rgba(29,78,216,0.15)) !important;
    color: #0f172a;
    border-left: 4px solid #3b82f6 !important;
}

/* === KOLIZNÍ TABULKA === */
.table-conflict[b-pxtyf0phu4] {
    border: 2px solid #ef4444;
    border-radius: 12px;
    overflow: hidden;
    box-shadow: 0 4px 16px rgba(239,68,68,0.18);
}

    .table-conflict thead th[b-pxtyf0phu4] {
        background: linear-gradient(135deg, #f87171, #ef4444) !important;
        color: white !important;
        font-weight: 800;
    }

    .table-conflict .current-poptavka[b-pxtyf0phu4] {
        background: linear-gradient(135deg, rgba(59,130,246,0.12), rgba(29,78,216,0.12)) !important;
        border-left: 4px solid #3b82f6 !important;
        animation: currentHighlight-b-pxtyf0phu4 2s infinite;
    }

    .table-conflict .conflict-row[b-pxtyf0phu4] {
        background: linear-gradient(135deg, rgba(248,113,113,0.1), rgba(239,68,68,0.1)) !important;
        border-left: 4px solid #ef4444 !important;
    }

        .table-conflict .conflict-row.confirmed[b-pxtyf0phu4] {
            background: linear-gradient(135deg, rgba(248,113,113,0.18), rgba(239,68,68,0.18)) !important;
            border-left: 4px solid #dc2626 !important;
            animation: confirmedConflict-b-pxtyf0phu4 2s infinite;
        }

/* === TEXT BARVY PRO SVĚTLÝ MÓD === */
.text-muted[b-pxtyf0phu4] {
    color: #6b7280 !important;
}

h1[b-pxtyf0phu4], h2[b-pxtyf0phu4], h3[b-pxtyf0phu4], h4[b-pxtyf0phu4], h5[b-pxtyf0phu4], h6[b-pxtyf0phu4] {
    color: #0f172a;
    font-weight: 800;
}

.text-primary[b-pxtyf0phu4] {
    color: #2563eb !important;
}

.text-success[b-pxtyf0phu4] {
    color: #059669 !important;
}

.text-info[b-pxtyf0phu4] {
    color: #0891b2 !important;
}

.text-warning[b-pxtyf0phu4] {
    color: #b45309 !important;
}

.text-danger[b-pxtyf0phu4] {
    color: #b91c1c !important;
}

.text-secondary[b-pxtyf0phu4] {
    color: #64748b !important;
}

/* === ANIMACE (beze změn barev) === */
@keyframes fadeInUp-b-pxtyf0phu4 {
    from {
        opacity: 0;
        transform: translateY(20px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@keyframes fadeInDown-b-pxtyf0phu4 {
    from {
        opacity: 0;
        transform: translateY(-10px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@keyframes slideInFromTop-b-pxtyf0phu4 {
    from {
        transform: translateY(-100%);
        opacity: 0;
    }

    to {
        transform: translateY(0);
        opacity: 1;
    }
}

@keyframes modalSlideIn-b-pxtyf0phu4 {
    from {
        opacity: 0;
        transform: scale(0.98) translateY(-24px);
    }

    to {
        opacity: 1;
        transform: scale(1) translateY(0);
    }
}

@keyframes spin-b-pxtyf0phu4 {
    0% {
        transform: rotate(0deg);
    }

    100% {
        transform: rotate(360deg);
    }
}

@keyframes currentHighlight-b-pxtyf0phu4 {
    0%, 100% {
        border-left-color: #3b82f6;
    }

    50% {
        border-left-color: #93c5fd;
    }
}

@keyframes confirmedConflict-b-pxtyf0phu4 {
    0%, 100% {
        background: linear-gradient(135deg, rgba(248,113,113,0.18), rgba(239,68,68,0.18)) !important;
    }

    50% {
        background: linear-gradient(135deg, rgba(248,113,113,0.26), rgba(239,68,68,0.26)) !important;
    }
}

/* === RESPONSIVNÍ DESIGN (zachováno, jen barvy) === */
@media (max-width: 768px) {
    .action-btn[b-pxtyf0phu4] {
        min-width: 100px;
        padding: 0.6rem 1rem;
        font-size: 0.9rem;
    }

    .btn-create-offer[b-pxtyf0phu4] {
        padding: 0.85rem 1.5rem;
        font-size: 1rem;
        width: 100%;
        justify-content: center;
    }

    .navbar-actions[b-pxtyf0phu4] {
        width: 100%;
        justify-content: center;
    }

    .navbar-btn[b-pxtyf0phu4] {
        flex: 1;
        min-width: auto;
        font-size: 0.85rem;
        padding: 0.6rem 0.8rem;
    }

    .nabidka-actions[b-pxtyf0phu4] {
        justify-content: center;
        flex-direction: column;
        gap: 0.5rem;
    }

    .item-actions[b-pxtyf0phu4] {
        justify-content: flex-end;
        width: 100%;
        margin-top: 0.5rem;
    }

    .total-price[b-pxtyf0phu4] {
        font-size: 1.1rem;
        text-align: center;
        margin-bottom: 0.75rem;
    }

    .nabidka-header[b-pxtyf0phu4] {
        flex-direction: column;
        gap: 1rem;
        text-align: center;
    }

    .nabidka-item[b-pxtyf0phu4] {
        flex-direction: column;
        align-items: flex-start;
        gap: 1rem;
    }

    .item-actions[b-pxtyf0phu4] {
        align-self: flex-end;
    }

    .stat-card[b-pxtyf0phu4] {
        flex-direction: column;
        text-align: center;
        padding: 1.25rem;
    }

    .info-item[b-pxtyf0phu4] {
        flex-direction: column;
        align-items: flex-start;
        gap: 0.5rem;
    }

    .info-icon[b-pxtyf0phu4] {
        margin-top: 0;
    }

    .dotaznik-actions .action-btn[b-pxtyf0phu4] {
        flex: 1;
        min-width: 120px;
    }

    .info-group[b-pxtyf0phu4] {
        padding: 1rem;
    }

    .dotaznik-summary[b-pxtyf0phu4] {
        padding: 1rem;
    }

    .modal-dialog[b-pxtyf0phu4] {
        margin: 0.5rem;
    }

    .card-header[b-pxtyf0phu4] {
        padding: 1rem;
    }

    .card-body[b-pxtyf0phu4] {
        padding: 1rem;
    }
}

@media (max-width: 480px) {
    .action-btn[b-pxtyf0phu4], .item-btn[b-pxtyf0phu4] {
        padding: 0.5rem 0.75rem;
        font-size: 0.85rem;
        min-width: 80px;
    }

    .btn-create-offer[b-pxtyf0phu4] {
        padding: 0.75rem 1.25rem;
        font-size: 0.95rem;
    }

    .navbar-btn[b-pxtyf0phu4] {
        padding: 0.5rem 0.75rem;
        font-size: 0.8rem;
    }

    .dotaznik-actions[b-pxtyf0phu4] {
        flex-direction: column;
    }

        .dotaznik-actions .action-btn[b-pxtyf0phu4] {
            width: 100%;
        }

    .stat-card[b-pxtyf0phu4] {
        padding: 1rem;
    }

    .info-group[b-pxtyf0phu4] {
        padding: 0.75rem;
    }

    .nabidka-item[b-pxtyf0phu4] {
        padding: 1rem;
    }

    .nabidka-header[b-pxtyf0phu4] {
        padding: 1rem;
    }
}

/* === FOCUS STATES PRO PŘÍSTUPNOST === */
.action-btn:focus[b-pxtyf0phu4], .item-btn:focus[b-pxtyf0phu4], .navbar-btn:focus[b-pxtyf0phu4], .btn-create-offer:focus[b-pxtyf0phu4], .dotaznik-summary:focus[b-pxtyf0phu4], .stat-card:focus[b-pxtyf0phu4] {
    outline: 2px solid #3b82f6;
    outline-offset: 2px;
    box-shadow: 0 0 0 4px rgba(59,130,246,0.25);
}

/* === SCROLLBAR === */
[b-pxtyf0phu4]::-webkit-scrollbar {
    width: 8px;
}

[b-pxtyf0phu4]::-webkit-scrollbar-track {
    background: #f1f5f9;
    border-radius: 4px;
}

[b-pxtyf0phu4]::-webkit-scrollbar-thumb {
    background: linear-gradient(135deg, #cbd5e1, #94a3b8);
    border-radius: 4px;
    transition: background 0.2s ease;
}

    [b-pxtyf0phu4]::-webkit-scrollbar-thumb:hover {
        background: linear-gradient(135deg, #94a3b8, #64748b);
    }

/* ===  TIMELINE / 3-SLOUPCOVÝ LAYOUT – stejné class-names, světlé barvy === */
.progress-badge[b-pxtyf0phu4] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.timeline-summary[b-pxtyf0phu4] {
    background: linear-gradient(135deg, rgba(59,130,246,0.10), rgba(29,78,216,0.10));
    padding: 1rem;
    border-radius: 8px;
    border-left: 4px solid #3b82f6;
    transition: all 0.25s ease;
}

    .timeline-summary:hover[b-pxtyf0phu4] {
        background: linear-gradient(135deg, rgba(59,130,246,0.14), rgba(29,78,216,0.14));
        transform: translateX(2px);
    }

.current-step-info h6[b-pxtyf0phu4] {
    color: #2563eb;
    font-weight: 700;
    margin-bottom: 0.5rem;
}

.current-step-info p[b-pxtyf0phu4] {
    color: #0f172a;
    font-weight: 600;
    margin-bottom: 0.25rem;
    font-size: 1rem;
}

.client-info-section[b-pxtyf0phu4] {
    margin-bottom: 1.5rem;
    padding-bottom: 1rem;
    border-bottom: 1px solid #e5e7eb;
}

    .client-info-section:last-child[b-pxtyf0phu4] {
        border-bottom: none;
        margin-bottom: 0;
    }

.client-actions[b-pxtyf0phu4] {
    margin-top: 1rem;
}

.progress-container-mini[b-pxtyf0phu4] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

    .progress-container-mini .progress[b-pxtyf0phu4] {
        border-radius: 4px;
        overflow: hidden;
        background: #f1f5f9;
    }

.services-tags[b-pxtyf0phu4] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
    margin-top: 0.5rem;
}

.service-tag[b-pxtyf0phu4] {
    display: inline-flex;
    align-items: center;
    gap: 0.375rem;
    padding: 0.375rem 0.75rem;
    border-radius: 6px;
    font-size: 0.85rem;
    font-weight: 600;
    transition: all 0.2s ease;
    cursor: default;
}

    .service-tag.service-active[b-pxtyf0phu4] {
        background: linear-gradient(135deg, #34d399, #10b981);
        color: white;
        box-shadow: 0 2px 8px rgba(16,185,129,0.22);
    }

        .service-tag.service-active:hover[b-pxtyf0phu4] {
            transform: translateY(-1px);
            box-shadow: 0 4px 12px rgba(16,185,129,0.28);
        }

    .service-tag.service-none[b-pxtyf0phu4] {
        background: linear-gradient(135deg, #e5e7eb, #cbd5e1);
        color: #0f172a;
        box-shadow: 0 2px 8px rgba(15,23,42,0.06);
    }

.workflow-status[b-pxtyf0phu4] {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

    .workflow-status .badge[b-pxtyf0phu4] {
        align-self: flex-start;
        font-size: 0.9rem;
        padding: 0.5rem 0.75rem;
    }

.action-buttons-grid[b-pxtyf0phu4], .action-buttons-grid-client[b-pxtyf0phu4], .action-buttons-grid-poptavka[b-pxtyf0phu4] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(120px, 1fr));
    gap: 0.75rem;
    margin-top: 1rem;
}

.action-btn-mini[b-pxtyf0phu4] {
    padding: 0.5rem 0.75rem;
    font-size: 0.85rem;
    font-weight: 600;
    border-radius: 6px;
    transition: all 0.2s ease;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.375rem;
    box-shadow: 0 1px 3px rgba(15,23,42,0.06);
    border: 1px solid #e5e7eb;
    cursor: pointer;
    min-height: 36px;
    text-decoration: none;
    background: linear-gradient(135deg, #ffffff, #f8fafc);
    color: #0f172a;
}

    .action-btn-mini:hover[b-pxtyf0phu4] {
        transform: translateY(-1px);
        box-shadow: 0 3px 10px rgba(15,23,42,0.08);
        background: linear-gradient(135deg, #f8fafc, #edf2ff);
        color: #0f172a;
        text-decoration: none;
    }

    .action-btn-mini.btn-priority[b-pxtyf0phu4] {
        background: linear-gradient(135deg, #fbbf24, #f59e0b);
        color: white;
    }

        .action-btn-mini.btn-priority:hover[b-pxtyf0phu4] {
            background: linear-gradient(135deg, #f59e0b, #d97706);
            color: white;
        }

    .action-btn-mini.btn-calendar[b-pxtyf0phu4] {
        background: linear-gradient(135deg, #a78bfa, #8b5cf6);
        color: white;
    }

        .action-btn-mini.btn-calendar:hover[b-pxtyf0phu4] {
            background: linear-gradient(135deg, #8b5cf6, #7c3aed);
            color: white;
        }

    .action-btn-mini.btn-notes[b-pxtyf0phu4] {
        background: linear-gradient(135deg, #22d3ee, #06b6d4);
        color: white;
    }

        .action-btn-mini.btn-notes:hover[b-pxtyf0phu4] {
            background: linear-gradient(135deg, #06b6d4, #0e7490);
            color: white;
        }

    .action-btn-mini.btn-email-client[b-pxtyf0phu4] {
        background: linear-gradient(135deg, #22d3ee, #06b6d4);
        color: white;
    }

        .action-btn-mini.btn-email-client:hover[b-pxtyf0phu4] {
            background: linear-gradient(135deg, #06b6d4, #0e7490);
            color: white;
        }

    .action-btn-mini.btn-view-history[b-pxtyf0phu4] {
        background: linear-gradient(135deg, #a78bfa, #8b5cf6);
        color: white;
    }

        .action-btn-mini.btn-view-history:hover[b-pxtyf0phu4] {
            background: linear-gradient(135deg, #8b5cf6, #7c3aed);
            color: white;
        }

    .action-btn-mini.btn-create-account[b-pxtyf0phu4] {
        background: linear-gradient(135deg, #34d399, #10b981);
        color: white;
    }

        .action-btn-mini.btn-create-account:hover[b-pxtyf0phu4] {
            background: linear-gradient(135deg, #10b981, #059669);
            color: white;
        }

    .action-btn-mini.btn-client-portal[b-pxtyf0phu4] {
        background: linear-gradient(135deg, #f59e0b, #d97706);
        color: white;
    }

        .action-btn-mini.btn-client-portal:hover[b-pxtyf0phu4] {
            background: linear-gradient(135deg, #d97706, #b45309);
            color: white;
        }

.client-message[b-pxtyf0phu4] {
    background: linear-gradient(135deg, #ffffff, #f8fafc);
    padding: 1.25rem;
    border-radius: 8px;
    border-left: 4px solid #8b5cf6;
    box-shadow: 0 2px 8px rgba(15,23,42,0.06);
    transition: all 0.25s ease;
}

    .client-message:hover[b-pxtyf0phu4] {
        box-shadow: 0 4px 14px rgba(15,23,42,0.08);
        transform: translateX(2px);
    }

.message-content[b-pxtyf0phu4] {
    color: #0f172a;
    line-height: 1.6;
    font-size: 0.95rem;
    margin-bottom: 0.75rem;
}

.message-meta[b-pxtyf0phu4] {
    color: #6b7280;
    font-size: 0.8rem;
    display: flex;
    align-items: center;
    gap: 0.375rem;
}

/* === RESPONSIVNÍ DESIGN PRO LAYOUT (zachován) === */
@media (min-width: 1200px) {
    .col-xl-4[b-pxtyf0phu4] {
        flex: 0 0 33.333333%;
        max-width: 33.333333%;
    }
}

@media (min-width: 992px) and (max-width: 1199px) {
    .order-1[b-pxtyf0phu4] {
        order: 1;
    }

    .order-2[b-pxtyf0phu4] {
        order: 2;
    }

    .order-3[b-pxtyf0phu4] {
        order: 3;
    }

    .action-buttons-grid-client[b-pxtyf0phu4] {
        grid-template-columns: repeat(2, 1fr);
        gap: 0.4rem;
    }

    .action-buttons-grid-poptavka[b-pxtyf0phu4] {
        grid-template-columns: repeat(2, 1fr);
        gap: 0.4rem;
    }

    .action-btn-mini[b-pxtyf0phu4] {
        padding: 0.45rem 0.6rem;
        font-size: 0.8rem;
        min-height: 32px;
    }
}

@media (max-width: 991px) {
    .timeline-summary[b-pxtyf0phu4] {
        padding: 0.75rem;
    }

    .action-buttons-grid-client[b-pxtyf0phu4], .action-buttons-grid-poptavka[b-pxtyf0phu4] {
        grid-template-columns: repeat(2, 1fr);
        gap: 0.5rem;
    }

    .action-btn-mini[b-pxtyf0phu4] {
        padding: 0.45rem 0.6rem;
        font-size: 0.8rem;
        min-height: 32px;
    }

    .services-tags[b-pxtyf0phu4] {
        flex-direction: column;
        align-items: flex-start;
    }

    .service-tag[b-pxtyf0phu4] {
        align-self: flex-start;
    }
}

@media (max-width: 767px) {
    .action-buttons-grid-client[b-pxtyf0phu4], .action-buttons-grid-poptavka[b-pxtyf0phu4] {
        grid-template-columns: 1fr;
        gap: 0.5rem;
    }

    .action-btn-mini[b-pxtyf0phu4] {
        width: 100%;
        justify-content: center;
    }

    .progress-badge[b-pxtyf0phu4] {
        flex-direction: column;
        align-items: flex-start;
        gap: 0.25rem;
    }

    .current-step-info p[b-pxtyf0phu4] {
        font-size: 0.9rem;
    }

    .client-info-section[b-pxtyf0phu4], .poptavka-info-section[b-pxtyf0phu4] {
        margin-bottom: 1rem;
        padding-bottom: 0.75rem;
    }

    .section-title[b-pxtyf0phu4] {
        font-size: 0.95rem;
        margin-bottom: 0.75rem;
    }
}

@media (max-width: 575px) {
    .card-body[b-pxtyf0phu4] {
        padding: 1rem;
    }

    .card-header[b-pxtyf0phu4] {
        padding: 0.75rem 1rem;
    }

        .card-header h5[b-pxtyf0phu4] {
            font-size: 1rem;
        }

    .info-item[b-pxtyf0phu4] {
        padding: 0.75rem 0;
        gap: 0.75rem;
    }

    .timeline-summary[b-pxtyf0phu4] {
        padding: 0.75rem;
        margin-top: 0.75rem;
    }

    .current-step-info h6[b-pxtyf0phu4] {
        font-size: 0.9rem;
    }

    .current-step-info p[b-pxtyf0phu4] {
        font-size: 0.85rem;
    }

    .action-btn-mini[b-pxtyf0phu4] {
        padding: 0.5rem;
        font-size: 0.8rem;
        min-height: 36px;
    }

    .service-tag[b-pxtyf0phu4] {
        font-size: 0.8rem;
        padding: 0.3rem 0.6rem;
    }

    .client-message[b-pxtyf0phu4] {
        padding: 1rem;
    }

    .message-content[b-pxtyf0phu4] {
        font-size: 0.9rem;
    }
}

/* === OUTLINE BUTTONS – neutrální světlo se zvýrazněným hoverem === */
.btn-outline-primary[b-pxtyf0phu4], .btn-outline-info[b-pxtyf0phu4], .btn-outline-warning[b-pxtyf0phu4], .btn-outline-danger[b-pxtyf0phu4], .btn-outline-success[b-pxtyf0phu4], .btn-outline-secondary[b-pxtyf0phu4] {
    background: linear-gradient(135deg, #ffffff, #f8fafc) !important;
    border-color: #e5e7eb !important;
    color: #0f172a !important;
    transition: all 0.2s ease;
    box-shadow: 0 1px 3px rgba(15,23,42,0.06);
}

    .btn-outline-primary:hover[b-pxtyf0phu4] {
        background: linear-gradient(135deg, #60a5fa, #3b82f6) !important;
        border-color: #3b82f6 !important;
        color: white !important;
        transform: translateY(-1px);
        box-shadow: 0 4px 10px rgba(59,130,246,0.25);
    }

    .btn-outline-info:hover[b-pxtyf0phu4] {
        background: linear-gradient(135deg, #22d3ee, #06b6d4) !important;
        border-color: #06b6d4 !important;
        color: white !important;
        transform: translateY(-1px);
        box-shadow: 0 4px 10px rgba(6,182,212,0.22);
    }

    .btn-outline-warning:hover[b-pxtyf0phu4] {
        background: linear-gradient(135deg, #fbbf24, #f59e0b) !important;
        border-color: #f59e0b !important;
        color: white !important;
        transform: translateY(-1px);
        box-shadow: 0 4px 10px rgba(245,158,11,0.25);
    }

    .btn-outline-danger:hover[b-pxtyf0phu4] {
        background: linear-gradient(135deg, #f87171, #ef4444) !important;
        border-color: #ef4444 !important;
        color: white !important;
        transform: translateY(-1px);
        box-shadow: 0 4px 12px rgba(239,68,68,0.30);
        animation: dangerGlow-b-pxtyf0phu4 0.5s ease-out;
    }

@keyframes dangerGlow-b-pxtyf0phu4 {
    from {
        box-shadow: 0 4px 8px rgba(239,68,68,0.22);
    }

    to {
        box-shadow: 0 4px 14px rgba(239,68,68,0.35), 0 0 18px rgba(239,68,68,0.25);
    }
}

.btn-outline-success:hover[b-pxtyf0phu4] {
    background: linear-gradient(135deg, #34d399, #10b981) !important;
    border-color: #10b981 !important;
    color: white !important;
    transform: translateY(-1px);
    box-shadow: 0 4px 10px rgba(16,185,129,0.25);
}

.btn-outline-secondary:hover[b-pxtyf0phu4] {
    background: linear-gradient(135deg, #f3f4f6, #e5e7eb) !important;
    border-color: #e5e7eb !important;
    color: #0f172a !important;
    transform: translateY(-1px);
    box-shadow: 0 4px 10px rgba(100,116,139,0.18);
}

.btn-outline-primary:disabled[b-pxtyf0phu4], .btn-outline-info:disabled[b-pxtyf0phu4], .btn-outline-warning:disabled[b-pxtyf0phu4], .btn-outline-danger:disabled[b-pxtyf0phu4], .btn-outline-success:disabled[b-pxtyf0phu4], .btn-outline-secondary:disabled[b-pxtyf0phu4] {
    background: linear-gradient(135deg, #f8fafc, #f1f5f9) !important;
    border-color: #e5e7eb !important;
    color: #94a3b8 !important;
    cursor: not-allowed;
    transform: none !important;
    box-shadow: 0 1px 2px rgba(15,23,42,0.04) !important;
    opacity: 0.7;
}

.btn-outline-primary:focus[b-pxtyf0phu4], .btn-outline-info:focus[b-pxtyf0phu4], .btn-outline-warning:focus[b-pxtyf0phu4], .btn-outline-danger:focus[b-pxtyf0phu4], .btn-outline-success:focus[b-pxtyf0phu4], .btn-outline-secondary:focus[b-pxtyf0phu4] {
    outline: 2px solid #3b82f6;
    outline-offset: 2px;
    box-shadow: 0 0 0 0.2rem rgba(59,130,246,0.25);
}

.btn-outline-primary:active[b-pxtyf0phu4], .btn-outline-info:active[b-pxtyf0phu4], .btn-outline-warning:active[b-pxtyf0phu4], .btn-outline-danger:active[b-pxtyf0phu4], .btn-outline-success:active[b-pxtyf0phu4], .btn-outline-secondary:active[b-pxtyf0phu4] {
    transform: translateY(0) !important;
}

/* === BTN-GROUP === */
.btn-group[b-pxtyf0phu4] {
    box-shadow: 0 2px 4px rgba(15,23,42,0.06);
    border-radius: 6px;
    overflow: hidden;
}

    .btn-group:hover[b-pxtyf0phu4] {
        transform: translateY(-1px);
        box-shadow: 0 4px 12px rgba(15,23,42,0.10);
    }

/* === TOOLTIP VYLEPŠENÍ === */
.btn[title]:hover[b-pxtyf0phu4]::after {
    content: attr(title);
    position: absolute;
    bottom: 120%;
    left: 50%;
    transform: translateX(-50%);
    background: rgba(17, 24, 39, 0.92);
    color: white;
    padding: 0.5rem 0.75rem;
    border-radius: 6px;
    font-size: 0.75rem;
    white-space: nowrap;
    z-index: 1000;
    box-shadow: 0 4px 12px rgba(15,23,42,0.25);
    animation: tooltipFadeIn-b-pxtyf0phu4 0.18s ease-out;
}

.btn[title]:hover[b-pxtyf0phu4]::before {
    content: "";
    position: absolute;
    bottom: 110%;
    left: 50%;
    transform: translateX(-50%);
    border: 4px solid transparent;
    border-top-color: rgba(17,24,39,0.92);
    z-index: 1000;
}

@keyframes tooltipFadeIn-b-pxtyf0phu4 {
    from {
        opacity: 0;
        transform: translateX(-50%) translateY(5px);
    }

    to {
        opacity: 1;
        transform: translateX(-50%) translateY(0);
    }
}

.terminy-panel[b-pxtyf0phu4] {
    border-left: 4px solid #0d6efd;
    background: linear-gradient(to right, #f8f9fa, #ffffff);
}

.termin-card[b-pxtyf0phu4] {
    border-left: 3px solid transparent;
    transition: all 0.3s ease;
}

    .termin-card:hover[b-pxtyf0phu4] {
        transform: translateY(-2px);
        box-shadow: 0 4px 12px rgba(0,0,0,0.1) !important;
    }

.termin-details[b-pxtyf0phu4] {
    font-size: 0.95rem;
}

    .termin-details i[b-pxtyf0phu4] {
        width: 20px;
        text-align: center;
    }

/* === PRINT STYLY (světlé) === */
@media print {
    .btn[b-pxtyf0phu4], .modal[b-pxtyf0phu4], .alert[b-pxtyf0phu4], .action-btn[b-pxtyf0phu4], .navbar-btn[b-pxtyf0phu4] {
        display: none !important;
    }

    .card[b-pxtyf0phu4] {
        break-inside: avoid;
        box-shadow: none !important;
        border: 1px solid #ccc !important;
        background: white !important;
        color: black !important;
    }

        .stat-card:hover[b-pxtyf0phu4], .card:hover[b-pxtyf0phu4], .nabidka-card:hover[b-pxtyf0phu4] {
            transform: none !important;
        }

    body[b-pxtyf0phu4] {
        background: white !important;
        color: black !important;
    }

    .row.g-4 > [class*="col-"][b-pxtyf0phu4] {
        page-break-inside: avoid;
        break-inside: avoid;
    }

    .action-btn-mini[b-pxtyf0phu4], .dropdown[b-pxtyf0phu4] {
        display: none !important;
    }

    .card[b-pxtyf0phu4] {
        break-inside: avoid;
        margin-bottom: 1rem;
    }
}
/* /Components/Pages/Admin/Poptavky/EmailHistory.razor.rz.scp.css */
/* =================================================================
   EMAILHISTORY.RAZOR.CSS — OPTIMALIZOVANÝ SVĚTLÝ DESIGN
   Sjednoceno s Dashboard/DashboardLayout/ClientDashboard světlou paletou.
   Pouze existující class-names (např. .email-item, .unread, .incoming, .outgoing,
   .badge .bg-*, .card, .table, .modal*, .btn...). Žádné nové wrappery.
   ================================================================= */

/* === PALETA / PROMĚNNÉ (konzistentní) ============================== */
:root[b-ll5m5lhf95] {
    --eh-surface: #ffffff; /* karty */
    --eh-surface-2: #f8fafc; /* sekundární povrch */
    --eh-text: #0f172a; /* slate-900 */
    --eh-muted: #6b7280; /* gray-600 */
    --eh-border: #e5e7eb; /* gray-200 */
    --eh-accent: #3b82f6; /* blue-500 */
    --eh-accent-2: #2563eb; /* blue-600 */
    --eh-info: #06b6d4; /* cyan-500 */
    --eh-success: #10b981; /* emerald-500 */
    --eh-warning: #f59e0b; /* amber-500 */
    --eh-danger: #ef4444; /* red-500 */
    --eh-shadow-sm: 0 2px 10px rgba(15,23,42,.06);
    --eh-shadow-md: 0 8px 22px rgba(15,23,42,.10);
    --eh-ring: 0 0 0 .25rem rgba(59,130,246,.22);
}

/* === KARTY / OBECNÉ (světlé, jemné) =============================== */
.card[b-ll5m5lhf95] {
    background: linear-gradient(135deg, var(--eh-surface), var(--eh-surface-2));
    border: 1px solid var(--eh-border);
    color: var(--eh-text);
    border-radius: 12px;
    box-shadow: 0 4px 14px rgba(15,23,42,.06);
    transition: background-color .25s ease, border-color .25s ease, box-shadow .25s ease, transform .15s ease;
}

    .card:hover[b-ll5m5lhf95] {
        transform: translateY(-2px);
        box-shadow: var(--eh-shadow-md);
        border-color: #cbd5e1;
    }

.card-header[b-ll5m5lhf95] {
    background: linear-gradient(135deg,#f3f4f6,#e5e7eb) !important;
    border-bottom: 1px solid var(--eh-border);
    color: var(--eh-text) !important;
    font-weight: 700;
    border-radius: 12px 12px 0 0 !important;
}

.card-body[b-ll5m5lhf95] {
    background: linear-gradient(135deg, var(--eh-surface), var(--eh-surface-2));
    color: var(--eh-text);
}

/* === HLAVNÍ SEZNAM EMAILŮ ========================================= */
/* Vychází z toho, že položky označuješ třídou .email-item + stavové .unread/.incoming/.outgoing */
.email-item[b-ll5m5lhf95] {
    background: linear-gradient(135deg, var(--eh-surface), var(--eh-surface-2));
    border: 1px solid var(--eh-border);
    border-radius: 10px;
    padding: 0.9rem 1rem;
    box-shadow: var(--eh-shadow-sm);
    transition: background-color .2s ease, border-color .2s ease, box-shadow .2s ease, transform .12s ease;
    cursor: pointer;
}

    .email-item + .email-item[b-ll5m5lhf95] {
        margin-top: .6rem;
    }

    .email-item:hover[b-ll5m5lhf95] {
        background: linear-gradient(135deg,#ffffff,#f3f6ff);
        border-color: #cbd5e1;
        box-shadow: var(--eh-shadow-md);
        transform: translateY(-1px);
    }

    /* Stav: nepřečtené příchozí – výraznější akcent a tučnější předmět (viz .email-item strong) */
    .email-item.unread[b-ll5m5lhf95] {
        border-left: 4px solid var(--eh-accent);
        background: linear-gradient(135deg,#ffffff,#eef2ff);
    }

    /* Stav: příchozí / odchozí – jemný barevný proužek na levé hraně */
    .email-item.incoming[b-ll5m5lhf95] {
        border-left: 4px solid var(--eh-info);
    }

    .email-item.outgoing[b-ll5m5lhf95] {
        border-left: 4px solid var(--eh-success);
    }

    /* Typografie uvnitř položky – nepřidávám nové třídy, používám elementy */
    .email-item strong[b-ll5m5lhf95] {
        color: var(--eh-text);
        font-weight: 800;
    }

    .email-item small[b-ll5m5lhf95] {
        color: var(--eh-muted);
        font-weight: 600;
        letter-spacing: .2px;
    }

    .email-item .badge[b-ll5m5lhf95] {
        transform: translateZ(0);
    }

    /* Pokud tělo emailu renderuješ pod hlavičkou položky, mírně jej odliš (bez nutnosti nové třídy) */
    .email-item .card[b-ll5m5lhf95], .email-item blockquote[b-ll5m5lhf95], .email-item pre[b-ll5m5lhf95], .email-item .card-body[b-ll5m5lhf95] {
        background: #ffffff;
        border: 1px solid var(--eh-border);
        border-radius: 8px;
        box-shadow: var(--eh-shadow-sm);
    }

/* === BADGES – respektuješ bootstrapové .bg-* z code-behind ========= */
.badge[b-ll5m5lhf95] {
    font-weight: 700;
    border-radius: 8px;
    box-shadow: 0 1px 3px rgba(15,23,42,.06);
}

    .badge.bg-info[b-ll5m5lhf95] {
        background: linear-gradient(135deg,#22d3ee,#06b6d4) !important;
        color: #fff !important;
    }

    .badge.bg-success[b-ll5m5lhf95] {
        background: linear-gradient(135deg,#34d399,#10b981) !important;
        color: #fff !important;
    }

    .badge.bg-warning[b-ll5m5lhf95] {
        background: linear-gradient(135deg,#fbbf24,#f59e0b) !important;
        color: #1f2937 !important;
    }

    .badge.bg-primary[b-ll5m5lhf95] {
        background: linear-gradient(135deg,#60a5fa,#3b82f6) !important;
        color: #fff !important;
    }

    .badge.bg-secondary[b-ll5m5lhf95] {
        background: linear-gradient(135deg,#e5e7eb,#cbd5e1) !important;
        color: #0f172a !important;
    }

    .badge.bg-light[b-ll5m5lhf95] {
        background: #f8fafc !important;
        color: #0f172a !important;
        border: 1px solid var(--eh-border);
    }

/* === TABULKY (pokud historii renderuješ v table) =================== */
.table[b-ll5m5lhf95] {
    color: var(--eh-text);
    background: transparent;
}

    .table thead th[b-ll5m5lhf95] {
        background: linear-gradient(135deg,#f3f4f6,#e5e7eb);
        color: var(--eh-text);
        border-color: var(--eh-border);
        font-weight: 800;
        text-transform: uppercase;
        letter-spacing: .4px;
    }

.table-hover tbody tr:hover[b-ll5m5lhf95] {
    background-color: rgba(59,130,246,.10) !important;
    color: var(--eh-text);
}

/* === MODAL „Přidat email“ ========================================= */
.modal-content[b-ll5m5lhf95] {
    background: linear-gradient(135deg, var(--eh-surface), var(--eh-surface-2));
    border: 1px solid var(--eh-border);
    color: var(--eh-text);
    border-radius: 12px;
    box-shadow: 0 20px 60px rgba(15,23,42,.18);
}

.modal-header[b-ll5m5lhf95] {
    background: linear-gradient(135deg,#f3f4f6,#e5e7eb);
    border-bottom: 1px solid var(--eh-border);
}

.modal-footer[b-ll5m5lhf95] {
    border-top: 1px solid var(--eh-border);
    background: linear-gradient(135deg,#f9fafb,#f3f4f6);
}

/* === TLAČÍTKA / FOCUS ============================================== */
.btn[b-ll5m5lhf95] {
    transition: all .2s ease;
}

    .btn:hover[b-ll5m5lhf95] {
        transform: translateY(-1px);
    }

    .btn:focus-visible[b-ll5m5lhf95] {
        outline: none;
        box-shadow: var(--eh-ring);
    }

/* Outline hover akcenty sjednocené */
.btn-outline-primary:hover[b-ll5m5lhf95] {
    background: linear-gradient(135deg,#60a5fa,#3b82f6);
    border-color: var(--eh-accent);
    color: #fff;
    box-shadow: 0 4px 10px rgba(59,130,246,.25);
}

.btn-outline-info:hover[b-ll5m5lhf95] {
    background: linear-gradient(135deg,#22d3ee,#06b6d4);
    border-color: var(--eh-info);
    color: #fff;
}

.btn-outline-success:hover[b-ll5m5lhf95] {
    background: linear-gradient(135deg,#34d399,#10b981);
    border-color: var(--eh-success);
    color: #fff;
}

.btn-outline-warning:hover[b-ll5m5lhf95] {
    background: linear-gradient(135deg,#fbbf24,#f59e0b);
    border-color: var(--eh-warning);
    color: #fff;
}

.btn-outline-danger:hover[b-ll5m5lhf95] {
    background: linear-gradient(135deg,#f87171,#ef4444);
    border-color: var(--eh-danger);
    color: #fff;
}

/* === PROGRESS / LOADER ============================================= */
.spinner-border[b-ll5m5lhf95] {
    width: 1.25rem !important;
    height: 1.25rem !important;
    border-width: .18rem;
    color: var(--eh-accent);
    opacity: .9;
}

/* === TEXTOVÉ DROBnosti ============================================ */
.text-muted[b-ll5m5lhf95] {
    color: var(--eh-muted) !important;
}

/* === REDUCED MOTION ================================================= */
@media (prefers-reduced-motion: reduce) {
    *[b-ll5m5lhf95] {
        transition: none !important;
        animation: none !important;
    }
}

/* === RESPONSIVE DROBnosti ========================================== */
@media (max-width: 768px) {
    .email-item[b-ll5m5lhf95] {
        padding: .8rem .9rem;
    }
}


/* =============================================================
   VYLEPŠENÍ EMAILOVÉ HISTORIE – timeline, hierarchie, akce
   - Pouze existující selektory (.email-item, .badge, .dropdown ...)
   - Bez nových wrapperů; timeline je řešená přes ::before/::after
   ============================================================= */

/* 1) Timeline vzhled (bod + spojnice mezi položkami) */
.email-item[b-ll5m5lhf95] {
    position: relative;
    padding-left: 2.25rem;
}

    .email-item[b-ll5m5lhf95]::before { /* bod */
        content: "";
        position: absolute;
        left: .75rem;
        top: .95rem;
        width: .625rem;
        height: .625rem;
        border-radius: 9999px;
        background: var(--eh-accent);
        box-shadow: 0 0 0 3px #fff;
    }

    .email-item[b-ll5m5lhf95]::after { /* vertikální spojnice k další položce */
        content: "";
        position: absolute;
        left: 1rem;
        top: calc(.95rem + .625rem);
        bottom: -0.6rem;
        width: 2px;
        background: linear-gradient(180deg, rgba(2,6,23,.12), rgba(2,6,23,.06));
    }

    .email-item:last-child[b-ll5m5lhf95]::after {
        display: none;
    }

    /* Barvy bodu dle stavu (využívá existující class-names) */
    .email-item.incoming[b-ll5m5lhf95]::before {
        background: var(--eh-info);
    }

    .email-item.outgoing[b-ll5m5lhf95]::before {
        background: var(--eh-success);
    }

    .email-item.unread[b-ll5m5lhf95]::before {
        background: var(--eh-accent-2);
        box-shadow: 0 0 0 4px rgba(59,130,246,.15);
    }

/* 2) Typografie a hierarchie uvnitř položky */
.email-item[b-ll5m5lhf95] {
    line-height: 1.45;
    font-size: .96rem;
    color: var(--eh-text);
}

    .email-item strong[b-ll5m5lhf95] {
        display: inline-block;
        margin-top: .25rem;
        color: #0b1220;
        font-weight: 800;
    }

    .email-item small[b-ll5m5lhf95] {
        display: inline-block;
        margin-top: .1rem;
        color: var(--eh-muted);
        font-weight: 600;
        letter-spacing: .2px;
    }

/* 3) Hover/focus – větší klikací komfort */
.email-item[b-ll5m5lhf95] {
    border-radius: 10px;
}

    .email-item:hover[b-ll5m5lhf95] {
        transform: translateY(-1px);
        box-shadow: var(--eh-shadow-md);
    }

    .email-item:focus-within[b-ll5m5lhf95] {
        box-shadow: 0 0 0 .2rem rgba(59,130,246,.18);
    }

    /* 4) Akční dropdown a jeho kompaktní styl v řádku */
    .email-item .dropdown .btn[b-ll5m5lhf95],
    .email-item .btn.btn-outline-secondary[b-ll5m5lhf95],
    .email-item .btn.btn-secondary[b-ll5m5lhf95] {
        padding: .35rem .55rem;
        line-height: 1;
        border-radius: 8px;
        border-color: var(--eh-border);
        background: #fff;
        color: #0f172a;
        box-shadow: 0 1px 3px rgba(15,23,42,.06);
        transition: all .18s ease;
    }

        .email-item .dropdown .btn:hover[b-ll5m5lhf95] {
            transform: translateY(-1px);
            box-shadow: 0 4px 10px rgba(15,23,42,.08);
            border-color: #cbd5e1;
        }

    .email-item .dropdown-menu[b-ll5m5lhf95] {
        border: 1px solid var(--eh-border);
        box-shadow: 0 8px 24px rgba(15,23,42,.10);
    }

    /* 5) Badge – lepší svislé zarovnání a mezery v řádku */
    .email-item .badge[b-ll5m5lhf95] {
        vertical-align: middle;
        margin-right: .35rem;
        padding: .35rem .55rem;
        border-radius: 999px;
        font-weight: 700;
    }

/* 6) Hlavičkové akce v card headeru – vizuální sjednocení */
.card-header .btn[b-ll5m5lhf95] {
    padding: .45rem .75rem;
    border-radius: 8px;
    border-color: #e5e7eb;
    background: linear-gradient(135deg,#fff,#f8fafc);
    color: #0f172a;
    box-shadow: 0 1px 3px rgba(15,23,42,.06);
}

    .card-header .btn:hover[b-ll5m5lhf95] {
        background: linear-gradient(135deg,#f8fafc,#edf2ff);
        border-color: #cbd5e1;
        transform: translateY(-1px);
    }

/* 7) Jemné oddělení položek bez tvrdých linek */
.email-item + .email-item[b-ll5m5lhf95] {
    margin-top: .75rem;
}

/* 8) Přístupnost – focus ring na interaktivních prvcích uvnitř */
.email-item a:focus-visible[b-ll5m5lhf95],
.email-item button:focus-visible[b-ll5m5lhf95] {
    outline: none;
    box-shadow: var(--eh-ring);
}


/* =============================================================
   SJEDNOCENÍ TLAČÍTEK JAKO V DETAILU POPTÁVKY (světlá varianta)
   - Bez nových wrapperů; sjednocuje .btn, .btn-*, .btn-outline-*
   - Kompaktní velikost v .card-header a v položkách historie
   ============================================================= */

/* ZÁKLAD .btn (stejný feeling jako .action-btn z detailu) */
.btn[b-ll5m5lhf95] {
    padding: .55rem .9rem; /* kompaktnější pro listy */
    font-size: .95rem;
    font-weight: 700;
    border-radius: 8px;
    border: 1px solid #e5e7eb;
    background: linear-gradient(135deg, #ffffff, #f5f7fb);
    color: #0f172a;
    display: inline-flex;
    align-items: center;
    gap: .5rem;
    box-shadow: 0 2px 8px rgba(15,23,42,.06);
    transition: background .25s ease, border-color .25s ease, box-shadow .25s ease, transform .15s ease;
}

    .btn:hover[b-ll5m5lhf95] {
        transform: translateY(-2px);
        box-shadow: 0 6px 18px rgba(15,23,42,.08);
    }

    .btn:active[b-ll5m5lhf95] {
        transform: translateY(0);
        box-shadow: 0 2px 8px rgba(15,23,42,.06);
    }

    .btn:disabled[b-ll5m5lhf95] {
        opacity: .6;
        cursor: not-allowed;
        transform: none !important;
        box-shadow: 0 1px 3px rgba(15,23,42,.04) !important;
    }

    .btn:focus-visible[b-ll5m5lhf95] {
        outline: none;
        box-shadow: 0 0 0 .25rem rgba(59,130,246,.25);
    }

/* PEVNÉ VARIANTY (gradienty jako v detailu) */
.btn-primary[b-ll5m5lhf95] {
    background: linear-gradient(135deg, #60a5fa, #3b82f6);
    border-color: #3b82f6;
    color: #fff;
}

    .btn-primary:hover[b-ll5m5lhf95] {
        background: linear-gradient(135deg, #3b82f6, #1d4ed8);
        color: #fff;
    }

.btn-info[b-ll5m5lhf95] {
    background: linear-gradient(135deg, #22d3ee, #06b6d4);
    border-color: #06b6d4;
    color: #fff;
}

    .btn-info:hover[b-ll5m5lhf95] {
        background: linear-gradient(135deg, #06b6d4, #0891b2);
        color: #fff;
    }

.btn-success[b-ll5m5lhf95] {
    background: linear-gradient(135deg, #34d399, #10b981);
    border-color: #10b981;
    color: #fff;
}

    .btn-success:hover[b-ll5m5lhf95] {
        background: linear-gradient(135deg, #10b981, #059669);
        color: #fff;
    }

.btn-warning[b-ll5m5lhf95] {
    background: linear-gradient(135deg, #fbbf24, #f59e0b);
    border-color: #f59e0b;
    color: #1f2937;
}

    .btn-warning:hover[b-ll5m5lhf95] {
        background: linear-gradient(135deg, #f59e0b, #d97706);
        color: #1f2937;
    }

.btn-danger[b-ll5m5lhf95] {
    background: linear-gradient(135deg, #f87171, #ef4444);
    border-color: #ef4444;
    color: #fff;
}

    .btn-danger:hover[b-ll5m5lhf95] {
        background: linear-gradient(135deg, #ef4444, #dc2626);
        color: #fff;
    }

.btn-secondary[b-ll5m5lhf95] {
    background: linear-gradient(135deg, #f3f4f6, #e5e7eb);
    border-color: #e5e7eb;
    color: #0f172a;
}

    .btn-secondary:hover[b-ll5m5lhf95] {
        background: linear-gradient(135deg, #e5e7eb, #d1d5db);
    }

/* OUTLINE VARIANTY (zachované a doplněné o base vzhled) */
.btn-outline-primary[b-ll5m5lhf95], .btn-outline-info[b-ll5m5lhf95], .btn-outline-success[b-ll5m5lhf95],
.btn-outline-warning[b-ll5m5lhf95], .btn-outline-danger[b-ll5m5lhf95], .btn-outline-secondary[b-ll5m5lhf95] {
    background: linear-gradient(135deg, #ffffff, #f8fafc) !important;
    border-color: #e5e7eb !important;
    color: #0f172a !important;
    box-shadow: 0 1px 3px rgba(15,23,42,.06);
}

    .btn-outline-primary:hover[b-ll5m5lhf95] {
        background: linear-gradient(135deg, #60a5fa, #3b82f6) !important;
        border-color: #3b82f6 !important;
        color: #fff !important;
        box-shadow: 0 4px 10px rgba(59,130,246,.25);
    }

    .btn-outline-info:hover[b-ll5m5lhf95] {
        background: linear-gradient(135deg, #22d3ee, #06b6d4) !important;
        border-color: #06b6d4 !important;
        color: #fff !important;
    }

    .btn-outline-success:hover[b-ll5m5lhf95] {
        background: linear-gradient(135deg, #34d399, #10b981) !important;
        border-color: #10b981 !important;
        color: #fff !important;
    }

    .btn-outline-warning:hover[b-ll5m5lhf95] {
        background: linear-gradient(135deg, #fbbf24, #f59e0b) !important;
        border-color: #f59e0b !important;
        color: #fff !important;
    }

    .btn-outline-danger:hover[b-ll5m5lhf95] {
        background: linear-gradient(135deg, #f87171, #ef4444) !important;
        border-color: #ef4444 !important;
        color: #fff !important;
    }

    .btn-outline-secondary:hover[b-ll5m5lhf95] {
        background: linear-gradient(135deg, #f3f4f6, #e5e7eb) !important;
        border-color: #e5e7eb !important;
        color: #0f172a !important;
    }

/* Kompaktnější velikost v hlavičce karty a v položkách historie */
.card-header .btn[b-ll5m5lhf95],
.email-item .dropdown .btn[b-ll5m5lhf95] {
    padding: .5rem .75rem;
    font-size: .9rem;
}

/* Skupiny tlačítek – stejné chování jako v detailu */
.btn-group[b-ll5m5lhf95] {
    box-shadow: 0 2px 4px rgba(15,23,42,.06);
    border-radius: 6px;
    overflow: hidden;
}

    .btn-group:hover[b-ll5m5lhf95] {
        transform: translateY(-1px);
        box-shadow: 0 4px 12px rgba(15,23,42,.10);
    }

/* === ACTION BTN MINI — sjednoceno s detailem poptávky (světlá varianta) === */
/* Kompaktní, přístupné, bez nových wrapperů; funguje přes .action-btn-mini */
.action-btn-mini[b-ll5m5lhf95] {
    /* rozměry / typografie */
    padding: 0.5rem 0.75rem;
    font-size: 0.9rem;
    font-weight: 600;
    min-height: 36px;
    border-radius: 8px;
    /* vzhled */
    background: linear-gradient(135deg, #ffffff, #f8fafc);
    border: 1px solid #e5e7eb;
    color: #0f172a;
    box-shadow: 0 1px 3px rgba(15,23,42,0.06);
    /* layout */
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.375rem;
    text-decoration: none;
    cursor: pointer;
    /* interakce */
    transition: background .25s ease, border-color .25s ease, box-shadow .25s ease, transform .15s ease;
}

    .action-btn-mini:hover[b-ll5m5lhf95] {
        background: linear-gradient(135deg, #f8fafc, #edf2ff);
        border-color: #cbd5e1;
        transform: translateY(-1px);
        box-shadow: 0 3px 10px rgba(15,23,42,0.08);
        color: #0f172a;
        text-decoration: none;
    }

    .action-btn-mini:active[b-ll5m5lhf95] {
        transform: translateY(0);
        box-shadow: 0 1px 3px rgba(15,23,42,0.06);
    }

    .action-btn-mini:disabled[b-ll5m5lhf95] {
        opacity: .6;
        cursor: not-allowed;
        transform: none !important;
        background: linear-gradient(135deg, #f8fafc, #f1f5f9);
        box-shadow: 0 1px 2px rgba(15,23,42,0.04) !important;
    }

    .action-btn-mini:focus-visible[b-ll5m5lhf95] {
        outline: 2px solid #3b82f6;
        outline-offset: 2px;
        box-shadow: 0 0 0 4px rgba(59,130,246,.25);
    }

    /* Ikona uvnitř (Bootstrap Icons) – konzistentní velikost a svislé zarovnání */
    .action-btn-mini i[b-ll5m5lhf95] {
        font-size: 1rem;
        line-height: 1;
        display: inline-block;
    }

/* Volitelně: na XS můžeš zvětšit klikací plochu, když jsou tlačítka vedle sebe */
@media (max-width: 480px) {
    .action-btn-mini[b-ll5m5lhf95] {
        padding: 0.5rem 0.7rem;
        font-size: 0.875rem;
        min-height: 34px;
    }
}

/* Loader pro ikonu .bi-arrow-clockwise (když máš inline style, ponechávám i keyframes) */
@keyframes spin-b-ll5m5lhf95 {
    0% {
        transform: rotate(0deg);
    }

    100% {
        transform: rotate(360deg);
    }
}

/* /Components/Pages/Admin/Poptavky/PrehledPoptavek.razor.rz.scp.css */
/* ===========================================================
   PREHLEDPOPTAVEK — převod „dashboard“ stylů (světlá varianta)
   - karty, tlačítka, badge, alerty, modal, spinner, progress,
     empty-state, typografie headeru
   =========================================================== */

/* ——— KARTY (stejně jako Dashboard) ——— */
.card[b-yg1vaam2z6] {
    background: linear-gradient(135deg,#fff,#f8fafc);
    border: 1px solid #e5e7eb;
    color: #0f172a;
    border-radius: 12px;
    box-shadow: 0 4px 14px rgba(15,23,42,.06);
    transition: background .25s,border-color .25s,box-shadow .25s,transform .15s;
}

    .card:hover[b-yg1vaam2z6] {
        transform: translateY(-2px);
        box-shadow: 0 8px 22px rgba(15,23,42,.10);
        border-color: #cbd5e1;
    }

.card-header[b-yg1vaam2z6] {
    background: linear-gradient(135deg,#f3f4f6,#e5e7eb) !important;
    border-bottom: 1px solid #e5e7eb;
    color: #0f172a !important;
    border-radius: 12px 12px 0 0 !important;
    padding: 1rem 1.25rem;
}

    /* Typografická hierarchie headeru (titulek 800, ostatní 600) */
    .card-header h1[b-yg1vaam2z6], .card-header h2[b-yg1vaam2z6], .card-header h3[b-yg1vaam2z6], .card-header h4[b-yg1vaam2z6], .card-header h5[b-yg1vaam2z6], .card-header h6[b-yg1vaam2z6] {
        font-weight: 800;
        letter-spacing: .2px;
        margin: 0;
    }

    .card-header strong[b-yg1vaam2z6], .card-header b[b-yg1vaam2z6] {
        font-weight: 600;
        color: #475569;
    }

    .card-header .fw-bold[b-yg1vaam2z6] {
        font-weight: 600 !important;
        color: #475569 !important;
    }

    .card-header small[b-yg1vaam2z6] {
        color: #64748b;
        font-weight: 600;
        letter-spacing: .2px;
    }

    .card-header .btn[b-yg1vaam2z6] {
        font-weight: 600;
    }

/* ——— TLAČÍTKA (hover/focus stejné jako Dashboard) ——— */
.btn[b-yg1vaam2z6] {
    font-weight: 700;
    border-radius: 8px;
    transition: all .2s ease;
}

    .btn:hover[b-yg1vaam2z6] {
        transform: translateY(-1px);
    }

    .btn:focus-visible[b-yg1vaam2z6] {
        outline: none;
        box-shadow: 0 0 0 .25rem rgba(59,130,246,.25);
    }

.btn-outline-light[b-yg1vaam2z6] {
    color: #0f172a;
    border-color: #e5e7eb;
}

    .btn-outline-light:hover[b-yg1vaam2z6] {
        background: #f3f4f6;
    }
/* mini akce (pokud používáš) */
.action-btn-mini[b-yg1vaam2z6] {
    padding: .5rem .75rem;
    font-size: .9rem;
    font-weight: 600;
    min-height: 36px;
    border-radius: 8px;
    background: linear-gradient(135deg,#fff,#f8fafc);
    border: 1px solid #e5e7eb;
    color: #0f172a;
    box-shadow: 0 1px 3px rgba(15,23,42,.06);
    display: inline-flex;
    align-items: center;
    gap: .375rem;
    transition: background .25s,border-color .25s,box-shadow .25s,transform .15s;
}

    .action-btn-mini:hover[b-yg1vaam2z6] {
        background: linear-gradient(135deg,#f8fafc,#edf2ff);
        border-color: #cbd5e1;
        transform: translateY(-1px);
        box-shadow: 0 3px 10px rgba(15,23,42,.08);
    }

/* ——— BADGE (jemné gradienty) ——— */
.badge[b-yg1vaam2z6] {
    border-radius: 999px;
    font-weight: 700;
    box-shadow: 0 1px 3px rgba(15,23,42,.06);
}

    .badge.bg-info[b-yg1vaam2z6] {
        background: linear-gradient(135deg,#22d3ee,#06b6d4) !important;
        color: #fff !important;
    }

    .badge.bg-success[b-yg1vaam2z6] {
        background: linear-gradient(135deg,#34d399,#10b981) !important;
        color: #fff !important;
    }

    .badge.bg-warning[b-yg1vaam2z6] {
        background: linear-gradient(135deg,#fbbf24,#f59e0b) !important;
        color: #1f2937 !important;
    }

    .badge.bg-primary[b-yg1vaam2z6] {
        background: linear-gradient(135deg,#60a5fa,#3b82f6) !important;
        color: #fff !important;
    }

    .badge.bg-secondary[b-yg1vaam2z6] {
        background: linear-gradient(135deg,#e5e7eb,#cbd5e1) !important;
        color: #0f172a !important;
    }

/* ——— ALERTY (světlé) ——— */
.alert[b-yg1vaam2z6] {
    border-radius: 12px;
    border: none;
    box-shadow: 0 4px 12px rgba(15,23,42,.08);
    color: #0f172a;
}

.alert-danger[b-yg1vaam2z6] {
    background: linear-gradient(135deg,#fee2e2,#fecaca);
    border-left: 5px solid #ef4444;
}

.alert-warning[b-yg1vaam2z6] {
    background: linear-gradient(135deg,#fef3c7,#fde68a);
    border-left: 5px solid #f59e0b;
}

.alert-info[b-yg1vaam2z6] {
    background: linear-gradient(135deg,#e0f2fe,#bae6fd);
    border-left: 5px solid #0ea5e9;
}

/* ——— MODAL ——— */
.modal-content[b-yg1vaam2z6] {
    background: linear-gradient(135deg,#fff,#f8fafc);
    border: 1px solid #e5e7eb;
    color: #0f172a;
    border-radius: 12px;
    box-shadow: 0 20px 60px rgba(15,23,42,.18);
}

.modal-header[b-yg1vaam2z6] {
    background: linear-gradient(135deg,#f3f4f6,#e5e7eb);
    border-bottom: 1px solid #e5e7eb;
}

.modal-footer[b-yg1vaam2z6] {
    border-top: 1px solid #e5e7eb;
    background: linear-gradient(135deg,#f9fafb,#f3f4f6);
}

/* ——— SPINNER / PROGRESS ——— */
.spinner-border[b-yg1vaam2z6] {
    width: 1.25rem !important;
    height: 1.25rem !important;
    border-width: .18rem;
    color: #3b82f6;
    opacity: .85;
}

.progress[b-yg1vaam2z6] {
    background: #eef2f7;
    border-radius: 999px;
    overflow: hidden;
}

    .progress .progress-bar[b-yg1vaam2z6] {
        background-image: linear-gradient(90deg,rgba(0,0,0,.10) 0 25%,transparent 25% 50%,rgba(0,0,0,.10) 50% 75%,transparent 75% 100%);
        background-size: 2rem 100%;
    }

/* ——— EMPTY STATE ——— */
.empty-state[b-yg1vaam2z6] {
    text-align: center;
    padding: 3rem 1rem;
    background: linear-gradient(135deg,#fff,#f8fafc);
    border: 2px dashed #e5e7eb;
    border-radius: 12px;
    color: #64748b;
}

/* ——— TABULKY: „dashboard“ + oddělené řádky (už máš výše) ——— */
/* nechávám tvůj poslední blok, jen drobná kompatibilita: */
.table tbody td small[b-yg1vaam2z6] {
    color: #64748b;
    font-weight: 600;
}
/* ============================================================
   PREHLEDPOPTAVEK — karty jako na Dashboardu (světlá varianta)
   - hover: lift + hlubší stín + modrý akcent hranice
   - focus-within: přístupnost (ring), bez wrapperů
   ============================================================ */

/* Základ karty + přechody (parita s Dashboardem) */
.card[b-yg1vaam2z6] {
    background: linear-gradient(135deg, #ffffff, #f8fafc);
    border: 1px solid #e5e7eb;
    color: #0f172a;
    border-radius: 12px;
    box-shadow: 0 4px 14px rgba(15,23,42,0.06);
    transition: transform .2s ease, box-shadow .25s ease, border-color .25s ease, background .25s ease;
    will-change: transform, box-shadow;
}

    /* Hover efekt (lift + halo + jemné zmodrání hran) */
    .card:hover[b-yg1vaam2z6] {
        transform: translateY(-4px);
        box-shadow: 0 12px 30px rgba(15,23,42,.12);
        border-color: #bfdbfe; /* blue-200 */
        background: linear-gradient(135deg, #ffffff, #f5f8ff);
    }

    /* Klávesnicový fokus – přístupnost (ring) */
    .card:focus-within[b-yg1vaam2z6] {
        outline: none;
        box-shadow: 0 0 0 .25rem rgba(59,130,246,.20), /* ring */
        0 10px 28px rgba(15,23,42,.12); /* halo */
        border-color: #93c5fd; /* blue-300 */
    }

/* Hlavička karty – světle šedá jako na Dashboardu */
.card-header[b-yg1vaam2z6] {
    position: relative; /* kvůli pseudo-elementu níže */
    background: linear-gradient(135deg, #f3f4f6, #e5e7eb) !important;
    border-bottom: 1px solid #e5e7eb;
    color: #0f172a !important;
    font-weight: 800;
    border-radius: 12px 12px 0 0 !important;
    padding: 1rem 1.25rem;
}

/* Jemná akcentní linka pod headerem při hoveru karty (stejný akcent jako u tabulek) */
.card:hover .card-header[b-yg1vaam2z6]::after {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    bottom: -1px;
    height: 2px;
    background: linear-gradient(90deg, #dbeafe, #e9d5ff 55%, #dcfce7);
    opacity: .7;
}

/* Tělo karty – světlý přechod, ladí se zbytkem UI */
.card-body[b-yg1vaam2z6] {
    background: linear-gradient(135deg, #ffffff, #f8fafc);
}

/* Volitelné: zvýraznění hran u stavových karet, pokud je používáš */
.card.border-warning[b-yg1vaam2z6] {
    box-shadow: 0 0 0 1px rgba(245,158,11,.28) inset;
}

.card.border-danger[b-yg1vaam2z6] {
    box-shadow: 0 0 0 1px rgba(239,68,68,.30) inset;
}
/* Přes ::deep zasáhneme tabulky i v potomcích této stránky */
[b-yg1vaam2z6] table.table {
    border-collapse: separate;
    border-spacing: 0 10px;
    background: transparent;
    color: #0f172a;
}

[b-yg1vaam2z6] thead th {
    background: #fff;
    color: #0f172a;
    font-weight: 700;
    letter-spacing: .1px;
    border: 0;
    padding: .85rem 1rem;
    position: relative;
    box-shadow: inset -1px 0 0 #eef2f7;
}

    [b-yg1vaam2z6] thead th:first-child {
        border-top-left-radius: 12px;
        box-shadow: none;
    }

    [b-yg1vaam2z6] thead th:last-child {
        border-top-right-radius: 12px;
        box-shadow: inset 0 0 0 #0000;
    }

    [b-yg1vaam2z6] thead th::after {
        content: "";
        position: absolute;
        left: 0;
        right: 0;
        bottom: -1px;
        height: 2px;
        background: linear-gradient(90deg, #dbeafe, #e9d5ff 55%, #dcfce7);
        opacity: .55;
    }

/* „pill“ řádky + hover */
[b-yg1vaam2z6] tbody td {
    background: #fff;
    border: 0;
    padding: .9rem 1rem;
    vertical-align: middle;
    border-top: 1px solid #e5e7eb;
    border-bottom: 1px solid #e5e7eb;
}

    [b-yg1vaam2z6] tbody td:first-child {
        border-left: 1px solid #e5e7eb;
        border-top-left-radius: 12px;
        border-bottom-left-radius: 12px;
    }

    [b-yg1vaam2z6] tbody td:last-child {
        border-right: 1px solid #e5e7eb;
        border-top-right-radius: 12px;
        border-bottom-right-radius: 12px;
    }

[b-yg1vaam2z6] tbody tr:nth-child(even) td {
    background: #fbfdff;
}

[b-yg1vaam2z6] tbody tr:hover td {
    background: #f4f7ff;
    border-color: #dbeafe;
    box-shadow: 0 4px 14px rgba(15,23,42,.06);
}


/* /Components/Pages/Admin/Poptavky/TimelineVertical.razor.rz.scp.css */
/* TimelineVertical.razor.css - SVĚTLÉ TÉMA s Huemint paletou */
/* Optimalizováno pro světlé téma s barevnou paletou #efeef0, #3e221f, #f04f25 */

:root[b-a9b0lm3k2t] {
    /* Huemint paleta */
    --timeline-bg: #efeef0;
    --timeline-dark: #3e221f;
    --timeline-accent: #f04f25;
    /* Odvozené barvy */
    --timeline-surface: #ffffff;
    --timeline-border: rgba(62, 34, 31, 0.12);
    --timeline-text: #3e221f;
    --timeline-text-secondary: rgba(62, 34, 31, 0.7);
    --timeline-text-muted: rgba(62, 34, 31, 0.5);
    /* Stavy */
    --timeline-success: #2d7a4e;
    --timeline-warning: #d97706;
    --timeline-info: #0891b2;
}

.timeline-vertical[b-a9b0lm3k2t] {
    padding: 1.5rem 0;
    position: relative;
    max-width: 100%;
    background-color: transparent;
}

/* === TIMELINE HEADER === */
.timeline-header[b-a9b0lm3k2t] {
    background: linear-gradient(135deg, rgba(240, 79, 37, 0.05), rgba(240, 79, 37, 0.08));
    padding: 0.75rem 1rem;
    border-radius: 8px;
    border-left: 4px solid var(--timeline-accent);
    margin-bottom: 1.5rem;
    color: var(--timeline-text);
}

/* === JEDNOTLIVÉ KROKY === */
.timeline-step[b-a9b0lm3k2t] {
    display: flex;
    align-items: flex-start;
    gap: 1.25rem;
    padding-bottom: 2rem;
    position: relative;
    transition: all 0.3s ease;
    animation: fadeInUp-b-a9b0lm3k2t 0.5s ease-out;
    border-radius: 8px;
    margin-left: -0.5rem;
    margin-right: -0.5rem;
    padding-left: 0.5rem;
    padding-right: 0.5rem;
}

    .timeline-step:hover[b-a9b0lm3k2t] {
        background: linear-gradient(135deg, rgba(240, 79, 37, 0.02), rgba(62, 34, 31, 0.02));
        transform: translateX(2px);
    }

    .timeline-step.last-step[b-a9b0lm3k2t] {
        padding-bottom: 0;
    }

    /* === SPECIFICKÉ STYLY PODLE TYPU KROKU === */

    /* Administrativní kroky */
    .timeline-step.step-administrative[b-a9b0lm3k2t] {
        border-left: 2px solid rgba(62, 34, 31, 0.2);
    }

        .timeline-step.step-administrative:hover[b-a9b0lm3k2t] {
            border-left-color: var(--timeline-text-secondary);
            background: rgba(62, 34, 31, 0.03);
        }

    /* Business kroky */
    .timeline-step.step-business[b-a9b0lm3k2t] {
        border-left: 2px solid rgba(45, 122, 78, 0.3);
    }

        .timeline-step.step-business:hover[b-a9b0lm3k2t] {
            border-left-color: var(--timeline-success);
            background: linear-gradient(135deg, rgba(45, 122, 78, 0.05), rgba(45, 122, 78, 0.03));
        }

    /* Přípravné kroky */
    .timeline-step.step-preparation[b-a9b0lm3k2t] {
        border-left: 2px solid rgba(139, 92, 246, 0.3);
    }

        .timeline-step.step-preparation:hover[b-a9b0lm3k2t] {
            border-left-color: #8b5cf6;
            background: linear-gradient(135deg, rgba(139, 92, 246, 0.05), rgba(124, 58, 237, 0.03));
        }

    /* Schůzky */
    .timeline-step.step-meeting[b-a9b0lm3k2t] {
        border-left: 2px solid rgba(8, 145, 178, 0.3);
    }

        .timeline-step.step-meeting:hover[b-a9b0lm3k2t] {
            border-left-color: var(--timeline-info);
            background: linear-gradient(135deg, rgba(8, 145, 178, 0.05), rgba(8, 145, 178, 0.03));
        }

    /* Fotografické kroky */
    .timeline-step.step-photography[b-a9b0lm3k2t] {
        border-left: 2px solid rgba(217, 119, 6, 0.3);
    }

        .timeline-step.step-photography:hover[b-a9b0lm3k2t] {
            border-left-color: var(--timeline-warning);
            background: linear-gradient(135deg, rgba(217, 119, 6, 0.05), rgba(217, 119, 6, 0.03));
        }

    /* Speciální zvýraznění pro svatební den */
    .timeline-step.wedding-highlight[b-a9b0lm3k2t] {
        border-left: 3px solid var(--timeline-accent) !important;
        background: linear-gradient(135deg, rgba(240, 79, 37, 0.05), rgba(240, 79, 37, 0.02)) !important;
    }

        .timeline-step.wedding-highlight:hover[b-a9b0lm3k2t] {
            border-left-color: var(--timeline-accent) !important;
            background: linear-gradient(135deg, rgba(240, 79, 37, 0.08), rgba(240, 79, 37, 0.04)) !important;
            box-shadow: 0 4px 20px rgba(240, 79, 37, 0.15);
        }

/* === LEVÁ ČÁST - CONNECTOR === */
.timeline-connector[b-a9b0lm3k2t] {
    display: flex;
    flex-direction: column;
    align-items: center;
    position: relative;
    flex-shrink: 0;
}

/* === KRUHY/IKONY === */
.timeline-circle[b-a9b0lm3k2t] {
    width: 48px;
    height: 48px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.1rem;
    font-weight: 600;
    transition: all 0.4s ease;
    box-shadow: 0 2px 8px rgba(62, 34, 31, 0.1);
    z-index: 2;
    position: relative;
    background: white;
    border: 2px solid var(--timeline-border);
}

    /* Speciální styling pro kritické kroky */
    .timeline-circle.critical-step[b-a9b0lm3k2t] {
        border: 3px solid var(--timeline-warning);
        box-shadow: 0 4px 12px rgba(217, 119, 6, 0.2);
    }

    /* Extra zvýraznění pro svatební den */
    .timeline-circle.wedding-day[b-a9b0lm3k2t] {
        border: 4px solid var(--timeline-accent) !important;
        box-shadow: 0 6px 20px rgba(240, 79, 37, 0.25) !important;
        animation: weddingPulse-b-a9b0lm3k2t 3s infinite;
    }

.timeline-dot[b-a9b0lm3k2t] {
    width: 12px;
    height: 12px;
    border-radius: 50%;
    background: var(--timeline-text-muted);
    transition: all 0.3s ease;
}

/* === SPOJOVACÍ ČÁRY === */
.timeline-line[b-a9b0lm3k2t] {
    width: 3px;
    flex: 1;
    min-height: 60px;
    background: linear-gradient(180deg, rgba(62, 34, 31, 0.15), rgba(62, 34, 31, 0.1));
    margin-top: 8px;
    border-radius: 2px;
    transition: all 0.4s ease;
    position: relative;
}

    .timeline-line.completed-line[b-a9b0lm3k2t] {
        background: linear-gradient(180deg, var(--timeline-success), rgba(45, 122, 78, 0.7));
        box-shadow: 0 0 8px rgba(45, 122, 78, 0.2);
    }

/* === PRAVÁ ČÁST - OBSAH === */
.timeline-content[b-a9b0lm3k2t] {
    flex: 1;
    padding-top: 0.5rem;
    min-height: 60px;
}

.timeline-title[b-a9b0lm3k2t] {
    font-size: 1.1rem;
    font-weight: 600;
    color: var(--timeline-text);
    margin-bottom: 0.5rem;
    line-height: 1.3;
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 0.5rem;
}

/* Speciální styling pro svatební den */
.wedding-highlight .timeline-title[b-a9b0lm3k2t] {
    color: var(--timeline-accent);
    font-weight: 700;
}

.timeline-date[b-a9b0lm3k2t] {
    font-size: 0.9rem;
    color: var(--timeline-success);
    font-weight: 500;
    background: linear-gradient(135deg, rgba(45, 122, 78, 0.08), rgba(45, 122, 78, 0.05));
    padding: 0.5rem 0.75rem;
    border-radius: 8px;
    border-left: 3px solid var(--timeline-success);
    margin-bottom: 0.75rem;
    display: inline-flex;
    align-items: center;
    box-shadow: 0 1px 4px rgba(45, 122, 78, 0.15);
}

.timeline-status[b-a9b0lm3k2t] {
    font-size: 0.85rem;
    font-weight: 500;
    padding: 0.4rem 0.75rem;
    border-radius: 6px;
    margin-bottom: 0.75rem;
    display: inline-flex;
    align-items: center;
    border-left: 3px solid;
}

    .timeline-status.active-status[b-a9b0lm3k2t] {
        color: var(--timeline-warning);
        background: linear-gradient(135deg, rgba(217, 119, 6, 0.08), rgba(217, 119, 6, 0.05));
        border-left-color: var(--timeline-warning);
        box-shadow: 0 1px 4px rgba(217, 119, 6, 0.15);
    }

    .timeline-status.pending-status[b-a9b0lm3k2t] {
        color: var(--timeline-text-muted);
        background: linear-gradient(135deg, rgba(62, 34, 31, 0.05), rgba(62, 34, 31, 0.03));
        border-left-color: var(--timeline-text-muted);
    }

.timeline-description[b-a9b0lm3k2t] {
    font-size: 0.9rem;
    color: var(--timeline-text-secondary);
    line-height: 1.5;
    font-weight: 400;
    margin-bottom: 0.75rem;
}

/* === AKČNÍ TLAČÍTKA === */
.timeline-actions[b-a9b0lm3k2t] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
    padding: 0.75rem;
    background: linear-gradient(135deg, rgba(240, 79, 37, 0.03), rgba(62, 34, 31, 0.03));
    border-radius: 8px;
    border-left: 3px solid var(--timeline-accent);
    animation: slideInFromLeft-b-a9b0lm3k2t 0.3s ease-out;
}

    .timeline-actions .btn[b-a9b0lm3k2t] {
        font-size: 0.8rem;
        padding: 0.4rem 0.8rem;
        border-radius: 6px;
        transition: all 0.3s ease;
        box-shadow: 0 1px 3px rgba(62, 34, 31, 0.1);
    }

        .timeline-actions .btn:hover[b-a9b0lm3k2t] {
            transform: translateY(-1px);
            box-shadow: 0 3px 6px rgba(62, 34, 31, 0.15);
        }

/* === TIMELINE FOOTER === */
.timeline-footer[b-a9b0lm3k2t] {
    background: linear-gradient(135deg, rgba(45, 122, 78, 0.05), rgba(45, 122, 78, 0.03));
    padding: 1rem;
    border-radius: 8px;
    text-align: center;
    color: var(--timeline-text);
}

.timeline-estimate[b-a9b0lm3k2t] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    color: var(--timeline-text);
}

/* === STYLY PODLE STAVU === */

/* COMPLETED - Dokončené kroky */
.timeline-step.completed .timeline-circle[b-a9b0lm3k2t] {
    background: linear-gradient(135deg, var(--timeline-success), rgba(45, 122, 78, 0.9));
    color: white;
    border: 3px solid var(--timeline-success);
    animation: completedPulse-b-a9b0lm3k2t 0.6s ease-out;
}

.timeline-step.completed .timeline-title[b-a9b0lm3k2t] {
    color: var(--timeline-success);
    font-weight: 600;
}

.timeline-step.completed .timeline-description[b-a9b0lm3k2t] {
    color: var(--timeline-text-secondary);
}

/* ACTIVE - Aktivní krok */
.timeline-step.active .timeline-circle[b-a9b0lm3k2t] {
    background: linear-gradient(135deg, var(--timeline-warning), rgba(217, 119, 6, 0.9));
    color: white;
    border: 3px solid var(--timeline-warning);
    animation: activePulse-b-a9b0lm3k2t 2s infinite;
    box-shadow: 0 4px 12px rgba(217, 119, 6, 0.3);
}

.timeline-step.active .timeline-title[b-a9b0lm3k2t] {
    color: var(--timeline-warning);
    font-weight: 700;
}

.timeline-step.active .timeline-description[b-a9b0lm3k2t] {
    color: var(--timeline-text-secondary);
}

.timeline-step.active .timeline-dot[b-a9b0lm3k2t] {
    background: var(--timeline-warning);
    animation: dotPulse-b-a9b0lm3k2t 1.5s infinite;
}

/* PENDING - Budoucí kroky */
.timeline-step.pending .timeline-circle[b-a9b0lm3k2t] {
    background: linear-gradient(135deg, #ffffff, #f8f9fa);
    border: 3px solid var(--timeline-border);
    color: var(--timeline-text-muted);
}

.timeline-step.pending .timeline-title[b-a9b0lm3k2t] {
    color: var(--timeline-text-muted);
}

.timeline-step.pending .timeline-description[b-a9b0lm3k2t] {
    color: var(--timeline-text-muted);
}

.timeline-step.pending .timeline-dot[b-a9b0lm3k2t] {
    background: var(--timeline-text-muted);
}

/* === BADGE STYLY === */
.timeline-title .badge[b-a9b0lm3k2t] {
    font-size: 0.7rem;
    padding: 0.25rem 0.5rem;
    border-radius: 4px;
    font-weight: 500;
}

    .timeline-title .badge.bg-secondary[b-a9b0lm3k2t] {
        background: linear-gradient(135deg, var(--timeline-dark), rgba(62, 34, 31, 0.9)) !important;
        color: white !important;
    }

    .timeline-title .badge.bg-warning[b-a9b0lm3k2t] {
        background: linear-gradient(135deg, var(--timeline-warning), rgba(217, 119, 6, 0.9)) !important;
        color: white !important;
    }

/* === ANIMACE === */
@keyframes fadeInUp-b-a9b0lm3k2t {
    from {
        opacity: 0;
        transform: translateY(20px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@keyframes slideInFromLeft-b-a9b0lm3k2t {
    from {
        opacity: 0;
        transform: translateX(-10px);
    }

    to {
        opacity: 1;
        transform: translateX(0);
    }
}

@keyframes completedPulse-b-a9b0lm3k2t {
    0% {
        transform: scale(1);
        box-shadow: 0 2px 8px rgba(45, 122, 78, 0.2);
    }

    50% {
        transform: scale(1.1);
        box-shadow: 0 4px 12px rgba(45, 122, 78, 0.3);
    }

    100% {
        transform: scale(1);
        box-shadow: 0 2px 8px rgba(45, 122, 78, 0.2);
    }
}

@keyframes activePulse-b-a9b0lm3k2t {
    0%, 100% {
        box-shadow: 0 4px 12px rgba(217, 119, 6, 0.3);
        transform: scale(1);
    }

    50% {
        box-shadow: 0 6px 16px rgba(217, 119, 6, 0.4);
        transform: scale(1.05);
    }
}

@keyframes weddingPulse-b-a9b0lm3k2t {
    0%, 100% {
        box-shadow: 0 6px 20px rgba(240, 79, 37, 0.25);
        transform: scale(1);
    }

    50% {
        box-shadow: 0 8px 24px rgba(240, 79, 37, 0.35);
        transform: scale(1.05);
    }
}

@keyframes dotPulse-b-a9b0lm3k2t {
    0%, 100% {
        transform: scale(1);
        opacity: 1;
    }

    50% {
        transform: scale(1.3);
        opacity: 0.7;
    }
}

/* === HOVER EFEKTY === */
.timeline-step:hover .timeline-circle[b-a9b0lm3k2t] {
    transform: scale(1.05);
    box-shadow: 0 4px 12px rgba(62, 34, 31, 0.2);
}

.timeline-step.completed:hover .timeline-circle[b-a9b0lm3k2t] {
    box-shadow: 0 6px 16px rgba(45, 122, 78, 0.3);
}

.timeline-step.active:hover .timeline-circle[b-a9b0lm3k2t] {
    box-shadow: 0 8px 20px rgba(217, 119, 6, 0.4);
}

.timeline-step.pending:hover .timeline-circle[b-a9b0lm3k2t] {
    background: linear-gradient(135deg, #f8f9fa, #e9ecef);
    box-shadow: 0 4px 12px rgba(62, 34, 31, 0.15);
}

.timeline-step:hover .timeline-title[b-a9b0lm3k2t] {
    transform: translateX(2px);
}

/* === VŠECHNY TEXTY - SVĚTLÉ TÉMA === */
.timeline-vertical[b-a9b0lm3k2t],
.timeline-vertical *[b-a9b0lm3k2t] {
    color: var(--timeline-text) !important;
}

.timeline-header[b-a9b0lm3k2t] {
    color: var(--timeline-text) !important;
}

.timeline-title[b-a9b0lm3k2t] {
    color: var(--timeline-text) !important;
}

.timeline-description[b-a9b0lm3k2t] {
    color: var(--timeline-text-secondary) !important;
}

.text-muted[b-a9b0lm3k2t] {
    color: var(--timeline-text-muted) !important;
}

/* === RESPONSIVNÍ DESIGN === */
@media (max-width: 768px) {
    .timeline-vertical[b-a9b0lm3k2t] {
        padding: 1rem 0;
    }

    .timeline-step[b-a9b0lm3k2t] {
        gap: 1rem;
        padding-bottom: 1.5rem;
    }

    .timeline-circle[b-a9b0lm3k2t] {
        width: 40px;
        height: 40px;
        font-size: 1rem;
    }

    .timeline-line[b-a9b0lm3k2t] {
        min-height: 50px;
    }

    .timeline-title[b-a9b0lm3k2t] {
        font-size: 1rem;
    }

    .timeline-date[b-a9b0lm3k2t],
    .timeline-status[b-a9b0lm3k2t] {
        font-size: 0.8rem;
        padding: 0.4rem 0.6rem;
    }

    .timeline-description[b-a9b0lm3k2t] {
        font-size: 0.85rem;
    }

    .timeline-actions[b-a9b0lm3k2t] {
        padding: 0.5rem;
        flex-direction: column;
    }

        .timeline-actions .btn[b-a9b0lm3k2t] {
            width: 100%;
            justify-content: center;
        }
}

@media (max-width: 480px) {
    .timeline-step[b-a9b0lm3k2t] {
        gap: 0.75rem;
    }

    .timeline-circle[b-a9b0lm3k2t] {
        width: 36px;
        height: 36px;
        font-size: 0.9rem;
    }

    .timeline-title[b-a9b0lm3k2t] {
        font-size: 0.95rem;
    }

    .timeline-date[b-a9b0lm3k2t],
    .timeline-status[b-a9b0lm3k2t] {
        font-size: 0.75rem;
        padding: 0.3rem 0.5rem;
    }

    .timeline-description[b-a9b0lm3k2t] {
        font-size: 0.8rem;
    }
}

/* === PŘÍSTUPNOST === */
@media (prefers-reduced-motion: reduce) {
    .timeline-circle[b-a9b0lm3k2t],
    .timeline-title[b-a9b0lm3k2t],
    .timeline-step[b-a9b0lm3k2t],
    .timeline-line[b-a9b0lm3k2t],
    .timeline-actions[b-a9b0lm3k2t] {
        transition: none;
        animation: none;
    }
}

/* === FOCUS STATES === */
.timeline-step:focus-within .timeline-circle[b-a9b0lm3k2t] {
    outline: 2px solid var(--timeline-accent);
    outline-offset: 2px;
    box-shadow: 0 0 0 4px rgba(240, 79, 37, 0.2);
}

.timeline-actions .btn:focus[b-a9b0lm3k2t] {
    outline: 2px solid var(--timeline-accent);
    outline-offset: 2px;
}

/* === TLAČÍTKA S HUEMINT PALETOU === */
.timeline-actions .btn-primary[b-a9b0lm3k2t] {
    background: var(--timeline-accent);
    border-color: var(--timeline-accent);
    color: white;
}

    .timeline-actions .btn-primary:hover[b-a9b0lm3k2t] {
        background: #d93f1f;
        border-color: #d93f1f;
    }

.timeline-actions .btn-secondary[b-a9b0lm3k2t] {
    background: var(--timeline-dark);
    border-color: var(--timeline-dark);
    color: white;
}

    .timeline-actions .btn-secondary:hover[b-a9b0lm3k2t] {
        background: #2a1614;
        border-color: #2a1614;
    }

.timeline-actions .btn-success[b-a9b0lm3k2t] {
    background: var(--timeline-success);
    border-color: var(--timeline-success);
    color: white;
}

.timeline-actions .btn-outline-success[b-a9b0lm3k2t] {
    background: transparent;
    border-color: var(--timeline-success);
    color: var(--timeline-success);
}

    .timeline-actions .btn-outline-success:hover[b-a9b0lm3k2t] {
        background: var(--timeline-success);
        color: white;
    }

/* === KOMPAKTNÍ REŽIM === */
.timeline-vertical[data-compact="true"] .timeline-step.pending:not(.next-step)[b-a9b0lm3k2t] {
    display: none;
}

.timeline-vertical[data-compact="true"] .timeline-step[b-a9b0lm3k2t] {
    padding-bottom: 1.5rem;
}
/* /Components/Pages/Admin/Poptavky/VytvoritNabidku.razor.rz.scp.css */
/* /Components/Pages/Admin/Produkty/PrehledProduktu.razor.rz.scp.css */
/* Modální okno musí být nad backdropem */
.modal[b-u5of1o4oiw] {
    z-index: 1080 !important;
}

.modal-dialog[b-u5of1o4oiw], .modal-content[b-u5of1o4oiw] {
    z-index: 1081 !important;
}

/* Backdrop musí být pod obsahem modálu */
.modal-backdrop[b-u5of1o4oiw] {
    z-index: 1070 !important;
}

/* Pro jistotu, ať nic jiného nepřekrývá kliky do modálu */
.toast-container[b-u5of1o4oiw] {
    z-index: 12000;
}
/* to máš už vysoko, nevadí */
/* /Components/Pages/Admin/StatisticsCards.razor.rz.scp.css */
/* ============================================================
   STATISTICSCARDS.RAZOR.CSS — horní pás karet (světlý dashboard)
   - jemný lift/halo na hover, akcent hranice, přístupnost focus
   - ikona vlevo (Bootstrap Icons) s barevným „chipem“
   - bez nových wrapperů: .stat-card, .stat-icon, .stat-content
   ============================================================ */

/* ZÁKLAD KARTY (funguje pro <div class="stat-card"> i <div class="card stat-card">) */
/* === KPI KARTY ====================================================== */
.stat-card[b-rn68lvq7en] {
    background: linear-gradient(135deg, #ffffff, #f8fafc);
    border: 1px solid #e5e7eb;
    border-radius: 12px;
    min-height: 180px;
    cursor: default;
    display: flex;
    align-items: center;
    gap: 1rem;
    padding: 1.25rem 1.5rem;
    box-shadow: 0 4px 14px rgba(15,23,42,0.06);
    transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease;
}

    .stat-card:hover[b-rn68lvq7en] {
        transform: translateY(-4px);
        box-shadow: 0 10px 26px rgba(15,23,42,.10);
        border-color: #bfdbfe;
    }

.stat-icon[b-rn68lvq7en] {
    width: 56px;
    height: 56px;
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #fff;
    font-size: 1.4rem;
    box-shadow: 0 4px 12px rgba(15,23,42,.12);
    transition: transform .15s ease;
}

.stat-card:hover .stat-icon[b-rn68lvq7en] {
    transform: scale(1.06);
}

.stat-icon.bg-primary[b-rn68lvq7en] {
    background: linear-gradient(135deg,#60a5fa,#3b82f6);
}

.stat-icon.bg-success[b-rn68lvq7en] {
    background: linear-gradient(135deg,#34d399,#10b981);
}

.stat-icon.bg-warning[b-rn68lvq7en] {
    background: linear-gradient(135deg,#fbbf24,#f59e0b);
}

.stat-icon.bg-info[b-rn68lvq7en] {
    background: linear-gradient(135deg,#22d3ee,#06b6d4);
}

.stat-content h3[b-rn68lvq7en] {
    margin: 0;
    font-weight: 800;
    color: #0f172a;
    font-size: 1.75rem;
}

.stat-content p[b-rn68lvq7en] {
    margin: 0;
    color: #6b7280;
    font-weight: 600;
    font-size: .9rem;
}
/* /Components/Pages/Client/ClientDashboard.razor.rz.scp.css */
/* =================================================================
   CLIENTDASHBOARD.RAZOR.CSS — OPTIMALIZOVANÝ SVĚTLÝ DESIGN
   Sjednoceno s Dashboard/DashboardLayout světlou paletou.
   Pouze existující class-names (.bg-gradient, .stat-card, .card, .btn,
   .table-hover, .user-info, ...). Žádné nové wrappery.
   ================================================================= */

/* === PALETA / PROMĚNNÉ (konzistentní s Layouty) ==================== */
:root[b-2db3fso1fx] {
    --cd-bg: #f8fafc; /* plátno */
    --cd-surface: #ffffff; /* karty */
    --cd-surface-2: #f8fafc; /* sekundární povrch */
    --cd-text: #0f172a; /* slate-900 */
    --cd-text-2: #475569; /* slate-600 */
    --cd-muted: #6b7280; /* gray-600 */
    --cd-border: #e5e7eb; /* gray-200 */
    --cd-accent: #3b82f6; /* blue-500 */
    --cd-accent-2: #2563eb; /* blue-600 */
    --cd-info: #06b6d4; /* cyan-500 */
    --cd-success: #10b981; /* emerald-500 */
    --cd-warning: #f59e0b; /* amber-500 */
    --cd-danger: #ef4444; /* red-500 */
    --cd-shadow-sm: 0 2px 10px rgba(15,23,42,.06);
    --cd-shadow-md: 0 8px 22px rgba(15,23,42,.10);
    --cd-ring: 0 0 0 .25rem rgba(59,130,246,.25);
}

/* === BG GRADIENT (nahrazuje původní tmavou/ostrou verzi) ========== */
/* Použij na hero/pás nad statistikami – jemný světlý přechod */
.bg-gradient[b-2db3fso1fx] {
    background: linear-gradient(135deg, #ffffff, #eef2ff); /* white → blue-50 */
}

/* === KARTY (obecně) ================================================ */
.card[b-2db3fso1fx] {
    background: linear-gradient(135deg, var(--cd-surface), var(--cd-surface-2));
    border: 1px solid var(--cd-border);
    color: var(--cd-text);
    border-radius: 12px;
    box-shadow: 0 4px 14px rgba(15,23,42,0.06);
    transition: background-color .25s ease, border-color .25s ease, box-shadow .25s ease, transform .15s ease;
}

    .card:hover[b-2db3fso1fx] {
        transform: translateY(-2px);
        box-shadow: var(--cd-shadow-md);
        border-color: #cbd5e1; /* gray-300 */
    }

.card-header[b-2db3fso1fx] {
    background: linear-gradient(135deg, #f3f4f6, #e5e7eb) !important;
    border-bottom: 1px solid var(--cd-border);
    color: var(--cd-text) !important;
    font-weight: 700;
    border-radius: 12px 12px 0 0 !important;
}

.card-body[b-2db3fso1fx] {
    background: linear-gradient(135deg, var(--cd-surface), var(--cd-surface-2));
    color: var(--cd-text);
}

/* === KPI / STAT karty ============================================== */
.stat-card[b-2db3fso1fx] {
    background: linear-gradient(135deg, var(--cd-surface), var(--cd-surface-2));
    border: 1px solid var(--cd-border);
    border-radius: 12px;
    display: flex;
    align-items: center;
    gap: 1rem;
    padding: 1.25rem 1.5rem;
    box-shadow: 0 4px 14px rgba(15,23,42,0.06);
    transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease;
}

    .stat-card:hover[b-2db3fso1fx] {
        transform: translateY(-5px);
        box-shadow: 0 10px 26px rgba(15,23,42,.10);
        border-color: #bfdbfe;
    }
    /* Pokud uvnitř používáš ikonu (např. <i class="bi ...">) */
    .stat-card i[b-2db3fso1fx] {
        font-size: 1.25rem;
        color: var(--cd-accent-2);
        opacity: .95;
    }

/* === TABULKY ======================================================= */
.table[b-2db3fso1fx] {
    color: var(--cd-text);
    background: transparent;
}

    .table thead th[b-2db3fso1fx] {
        background: linear-gradient(135deg, #f3f4f6, #e5e7eb);
        color: var(--cd-text);
        border-color: var(--cd-border);
        font-weight: 800;
        text-transform: uppercase;
        letter-spacing: .4px;
    }

.table-hover tbody tr:hover[b-2db3fso1fx] {
    background-color: rgba(59, 130, 246, 0.10) !important; /* blue hover */
    color: var(--cd-text);
}
/* Stavové řádky (necháváme kompatibilitu s existujícím značením) */
.table-primary > *[b-2db3fso1fx] {
    background: linear-gradient(135deg, rgba(59,130,246,.12), rgba(29,78,216,.12)) !important;
    border-left: 4px solid var(--cd-accent) !important;
}

.table-warning > *[b-2db3fso1fx] {
    background: linear-gradient(135deg, rgba(251,191,36,.14), rgba(245,158,11,.14)) !important;
}

.table-danger > *[b-2db3fso1fx] {
    background: linear-gradient(135deg, rgba(248,113,113,.14), rgba(239,68,68,.14)) !important;
}

.table-success > *[b-2db3fso1fx] {
    background: linear-gradient(135deg, rgba(52,211,153,.14), rgba(16,185,129,.14)) !important;
}

/* === TLAČÍTKA ====================================================== */
.btn[b-2db3fso1fx] {
    transition: all .2s ease;
}

    .btn:hover[b-2db3fso1fx] {
        transform: translateY(-1px);
    }

    .btn:focus-visible[b-2db3fso1fx] {
        outline: none;
        box-shadow: var(--cd-ring);
    }

/* Doporučené barevné akcenty při hoveru na outline variantách */
.btn-outline-primary:hover[b-2db3fso1fx] {
    background: linear-gradient(135deg, #60a5fa, #3b82f6);
    border-color: var(--cd-accent);
    color: #fff;
    box-shadow: 0 4px 10px rgba(59,130,246,.25);
}

.btn-outline-info:hover[b-2db3fso1fx] {
    background: linear-gradient(135deg, #22d3ee, #06b6d4);
    border-color: var(--cd-info);
    color: #fff;
}

.btn-outline-success:hover[b-2db3fso1fx] {
    background: linear-gradient(135deg, #34d399, #10b981);
    border-color: var(--cd-success);
    color: #fff;
}

.btn-outline-warning:hover[b-2db3fso1fx] {
    background: linear-gradient(135deg, #fbbf24, #f59e0b);
    border-color: var(--cd-warning);
    color: #fff;
}

.btn-outline-danger:hover[b-2db3fso1fx] {
    background: linear-gradient(135deg, #f87171, #ef4444);
    border-color: var(--cd-danger);
    color: #fff;
}

/* === USER INFO panel (nahrazuje původní sklo-efekt v light UI) ==== */
.user-info[b-2db3fso1fx] {
    background: linear-gradient(135deg, #ffffff, #f8fafc);
    padding: 1rem;
    border-radius: 10px;
    border: 1px solid var(--cd-border);
    box-shadow: var(--cd-shadow-sm);
    color: var(--cd-text);
}

/* === PROGRESS / LOADER ============================================= */
.progress[b-2db3fso1fx] {
    background-color: #eef2f7;
    border-radius: 999px;
    overflow: hidden;
}

    .progress .progress-bar[b-2db3fso1fx] {
        background-image: linear-gradient(90deg, rgba(0,0,0,.10) 0 25%, transparent 25% 50%, rgba(0,0,0,.10) 50% 75%, transparent 75% 100%);
        background-size: 2rem 100%;
    }

.spinner-border[b-2db3fso1fx] {
    width: 1.25rem !important;
    height: 1.25rem !important;
    border-width: .18rem;
    color: var(--cd-accent);
    opacity: .9;
}

/* === ALERTY (světlé) =============================================== */
.alert[b-2db3fso1fx] {
    border-radius: 12px;
    border: none;
    box-shadow: 0 4px 12px rgba(15,23,42,.08);
    color: var(--cd-text);
}

.alert-danger[b-2db3fso1fx] {
    background: linear-gradient(135deg,#fee2e2,#fecaca);
    border-left: 5px solid var(--cd-danger);
}

.alert-warning[b-2db3fso1fx] {
    background: linear-gradient(135deg,#fef3c7,#fde68a);
    border-left: 5px solid var(--cd-warning);
}

.alert-info[b-2db3fso1fx] {
    background: linear-gradient(135deg,#e0f2fe,#bae6fd);
    border-left: 5px solid #0ea5e9;
}

/* === MODAL (pro případné dialogy na stránce) ======================= */
.modal-content[b-2db3fso1fx] {
    background: linear-gradient(135deg, #ffffff, #f8fafc);
    border: 1px solid var(--cd-border);
    color: var(--cd-text);
    border-radius: 12px;
    box-shadow: 0 20px 60px rgba(15,23,42,.18);
}

.modal-header[b-2db3fso1fx] {
    background: linear-gradient(135deg, #f3f4f6, #e5e7eb);
    border-bottom: 1px solid var(--cd-border);
}

.modal-footer[b-2db3fso1fx] {
    border-top: 1px solid var(--cd-border);
    background: linear-gradient(135deg, #f9fafb, #f3f4f6);
}

/* === TYPografie / drobnosti ======================================== */
.text-muted[b-2db3fso1fx] {
    color: var(--cd-muted) !important;
}

/* === Přístupnost: respektuj reduced-motion ========================= */
@media (prefers-reduced-motion: reduce) {
    *[b-2db3fso1fx] {
        transition: none !important;
        animation: none !important;
    }
}

/* === RESPONSIVE drobnosti ========================================== */
@media (max-width: 768px) {
    .stat-card[b-2db3fso1fx] {
        flex-direction: column;
        text-align: center;
    }
}
/* /Components/Pages/Client/Faktury.razor.rz.scp.css */
/* === MODAL STYLES PRO FAKTURY === */
/* Vlastní backdrop - zatmavení pouze nad main content, ne nad sidebarem */
.modal-backdrop-custom[b-zgqsqd8iqx] {
    position: fixed;
    top: 0;
    /* Začíná od konce sidebaru (130px) */
    left: 130px;
    right: 0;
    bottom: 0;
    background-color: rgba(0, 0, 0, 0.5);
    /* Z-index vyšší než main content ale nižší než modal */
    z-index: 1040;
    animation: fadeIn-b-zgqsqd8iqx 0.15s ease-in;
}

/* Modal container - hlavní okno */
.modal-container[b-zgqsqd8iqx] {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    /* Průhledné pozadí - backdrop máme samostatně */
    background-color: transparent;
    /* Z-index vyšší než backdrop */
    z-index: 1050;
    display: flex;
    align-items: flex-start;
    justify-content: center;
    padding-top: 3rem;
    /* Umožní scrollování pokud je obsah dlouhý */
    overflow-y: auto;
}

/* Modal dialog - samotné okno s obsahem */
.modal-dialog[b-zgqsqd8iqx] {
    position: relative;
    width: 90%;
    max-width: 1200px;
    margin: 1.75rem auto;
    /* Zajistí že je viditelný nad backdropem */
    z-index: 1055;
}

    /* Pro modal-lg specificky */
    .modal-dialog.modal-lg[b-zgqsqd8iqx] {
        max-width: 1100px;
    }

/* Modal content - vizuální styl okna */
.modal-content[b-zgqsqd8iqx] {
    position: relative;
    background-color: #fff;
    border: 1px solid rgba(0,0,0,.125);
    border-radius: .5rem;
    box-shadow: 0 0.5rem 1rem rgba(0,0,0,.15);
    /* Animace při zobrazení */
    animation: slideIn-b-zgqsqd8iqx 0.2s ease-out;
    /* Zajistí správné formátování obsahu */
    overflow: hidden;
}

/* Modal header styling */
.modal-header[b-zgqsqd8iqx] {
    padding: 1rem 1.5rem;
    background-color: #f8f9fa;
    border-bottom: 1px solid #dee2e6;
}

    .modal-header .modal-title[b-zgqsqd8iqx] {
        font-weight: 600;
        color: #212529;
    }

/* Modal body styling */
.modal-body[b-zgqsqd8iqx] {
    padding: 1.5rem;
    max-height: calc(100vh - 200px);
    overflow-y: auto;
}

/* Modal footer styling */
.modal-footer[b-zgqsqd8iqx] {
    padding: 1rem 1.5rem;
    background-color: #f8f9fa;
    border-top: 1px solid #dee2e6;
    display: flex;
    justify-content: flex-end;
    gap: 0.5rem;
}

    /* Tlačítka v modalu */
    .modal-footer .btn[b-zgqsqd8iqx] {
        min-width: 100px;
    }

/* Tabulka ve faktruře */
.modal-body table[b-zgqsqd8iqx] {
    margin-bottom: 1.5rem;
}

    .modal-body table th[b-zgqsqd8iqx] {
        background-color: #f8f9fa;
        font-weight: 600;
    }

/* === RESPONSIVE ÚPRAVY === */
@media (max-width: 1400px) {
    .modal-dialog[b-zgqsqd8iqx] {
        max-width: 1000px;
    }

        .modal-dialog.modal-lg[b-zgqsqd8iqx] {
            max-width: 950px;
        }
}

@media (max-width: 1200px) {
    .modal-dialog[b-zgqsqd8iqx] {
        max-width: 900px;
    }

        .modal-dialog.modal-lg[b-zgqsqd8iqx] {
            max-width: 850px;
        }
}

@media (max-width: 992px) {
    .modal-dialog[b-zgqsqd8iqx] {
        max-width: 750px;
    }

        .modal-dialog.modal-lg[b-zgqsqd8iqx] {
            max-width: 700px;
        }
}

@media (max-width: 768px) {
    /* Na mobilech backdrop začíná od 100px (menší sidebar) */
    .modal-backdrop-custom[b-zgqsqd8iqx] {
        left: 100px;
    }

    .modal-dialog[b-zgqsqd8iqx] {
        width: calc(100% - 120px);
        max-width: none;
        margin: 1rem;
        margin-left: 110px;
    }
}

@media (max-width: 576px) {
    .modal-dialog[b-zgqsqd8iqx] {
        width: calc(100% - 110px);
        margin: 0.5rem;
        margin-left: 105px;
    }
}

/* === ANIMACE === */
@keyframes fadeIn-b-zgqsqd8iqx {
    from {
        opacity: 0;
    }

    to {
        opacity: 1;
    }
}

@keyframes slideIn-b-zgqsqd8iqx {
    from {
        transform: translateY(-50px);
        opacity: 0;
    }

    to {
        transform: translateY(0);
        opacity: 1;
    }
}

/* === INVOICE SPECIFIC STYLES === */
.invoice-header h3[b-zgqsqd8iqx] {
    font-weight: 700;
    color: #0f172a;
}

/* === PRINT STYLES === */
@media print {
    .modal-backdrop-custom[b-zgqsqd8iqx] {
        display: none !important;
    }

    .modal-container[b-zgqsqd8iqx] {
        position: static !important;
        background-color: transparent !important;
        z-index: auto !important;
        padding: 0 !important;
    }

    .modal-header[b-zgqsqd8iqx],
    .modal-footer[b-zgqsqd8iqx] {
        display: none !important;
    }

    .modal-dialog[b-zgqsqd8iqx] {
        max-width: none !important;
        margin: 0 !important;
        z-index: auto !important;
    }

    .modal-content[b-zgqsqd8iqx] {
        border: none !important;
        box-shadow: none !important;
        animation: none !important;
    }

    .modal-body[b-zgqsqd8iqx] {
        padding: 0 !important;
    }
}
/* /Components/Pages/Client/PhotoGallery.razor.rz.scp.css */
/* =================================================================
   PhotoGallery.razor.css - Styly pro PhotoGallery komponentu
   Umístění: /Components/Shared/PhotoGallery.razor.css
   ================================================================= */

/* === ZÁKLADNÍ WRAPPER === */
.photo-gallery-wrapper[b-vex03megkx] {
    position: relative;
    min-height: 200px;
}

/* === TOOLBAR === */
.gallery-toolbar[b-vex03megkx] {
    padding: 1rem;
    background: #f8f9fa;
    border-radius: 8px;
    margin-bottom: 1.5rem;
}

/* === GALLERY ITEM === */
.gallery-item-wrapper[b-vex03megkx] {
    position: relative;
    overflow: hidden;
    border-radius: 8px;
    background: #fff;
    cursor: pointer;
    transition: all 0.3s ease;
    box-shadow: 0 2px 8px rgba(0,0,0,0.1);
}

    .gallery-item-wrapper:hover[b-vex03megkx] {
        transform: translateY(-4px);
        box-shadow: 0 8px 20px rgba(0,0,0,0.15);
    }

/* === GALLERY IMAGE === */
.gallery-img[b-vex03megkx] {
    width: 100%;
    height: auto;
    display: block;
    transition: transform 0.3s ease;
}

.gallery-item-wrapper:hover .gallery-img[b-vex03megkx] {
    transform: scale(1.05);
}

/* === OVERLAY === */
.gallery-overlay[b-vex03megkx] {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: linear-gradient(135deg, rgba(0,0,0,0.7), rgba(0,0,0,0.4));
    display: flex;
    justify-content: center;
    align-items: center;
    opacity: 0;
    transition: opacity 0.3s ease;
    pointer-events: none;
}

.gallery-item-wrapper:hover .gallery-overlay[b-vex03megkx] {
    opacity: 1;
}

.gallery-overlay i[b-vex03megkx] {
    color: white;
    font-size: 2rem;
    transform: scale(0.8);
    transition: transform 0.3s ease;
}

.gallery-item-wrapper:hover .gallery-overlay i[b-vex03megkx] {
    transform: scale(1);
}

/* === TLAČÍTKO OBLÍBENÉ === */
.btn-favorite[b-vex03megkx] {
    position: absolute;
    top: 10px;
    right: 10px;
    background: rgba(255,255,255,0.9);
    border: none;
    border-radius: 50%;
    width: 40px;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: all 0.3s ease;
    z-index: 10;
    box-shadow: 0 2px 8px rgba(0,0,0,0.2);
}

    .btn-favorite i[b-vex03megkx] {
        font-size: 1.2rem;
        color: #dc3545;
        transition: transform 0.3s ease;
    }

    .btn-favorite:hover[b-vex03megkx] {
        background: white;
        transform: scale(1.1);
    }

        .btn-favorite:hover i[b-vex03megkx] {
            transform: scale(1.2);
        }

    .btn-favorite.active[b-vex03megkx] {
        background: #dc3545;
    }

        .btn-favorite.active i[b-vex03megkx] {
            color: white;
        }

/* === LIGHTBOX === */
.custom-lightbox[b-vex03megkx] {
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    width: 100vw !important;
    height: 100vh !important;
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    z-index: 9999 !important;
    cursor: pointer;
    animation: fadeIn-b-vex03megkx 0.3s ease;
}

@keyframes fadeIn-b-vex03megkx {
    from {
        opacity: 0;
    }

    to {
        opacity: 1;
    }
}

/* === LIGHTBOX BACKDROP === */
.lightbox-backdrop[b-vex03megkx] {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0,0,0,0.95);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
}

/* === LIGHTBOX CONTENT === */
.lightbox-content[b-vex03megkx] {
    position: relative;
    z-index: 2;
    display: flex;
    justify-content: center;
    align-items: center;
    animation: slideIn-b-vex03megkx 0.4s ease;
}

@keyframes slideIn-b-vex03megkx {
    from {
        transform: scale(0.9);
        opacity: 0;
    }

    to {
        transform: scale(1);
        opacity: 1;
    }
}

/* === LIGHTBOX IMAGE === */
.lightbox-image[b-vex03megkx] {
    max-width: 90vw;
    max-height: 90vh;
    width: auto;
    height: auto;
    object-fit: contain;
    border-radius: 8px;
    box-shadow: 0 20px 60px rgba(0,0,0,0.5);
    transition: opacity 0.2s ease;
}

    .lightbox-image.fade-out[b-vex03megkx] {
        opacity: 0;
    }

/* === NAVIGAČNÍ TLAČÍTKA === */
.lightbox-nav-btn[b-vex03megkx] {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    background: rgba(255,255,255,0.9);
    border: none;
    border-radius: 50%;
    width: 50px;
    height: 50px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: all 0.3s ease;
    z-index: 10;
    box-shadow: 0 4px 12px rgba(0,0,0,0.3);
}

    .lightbox-nav-btn:hover[b-vex03megkx] {
        background: white;
        transform: translateY(-50%) scale(1.1);
    }

    .lightbox-nav-btn.left[b-vex03megkx] {
        left: 20px;
    }

    .lightbox-nav-btn.right[b-vex03megkx] {
        right: 20px;
    }

    .lightbox-nav-btn i[b-vex03megkx] {
        font-size: 1.5rem;
        color: #333;
    }

/* === CLOSE BUTTON === */
.lightbox-close-btn[b-vex03megkx] {
    position: absolute;
    top: 20px;
    right: 20px;
    background: rgba(255,255,255,0.9);
    border: none;
    border-radius: 50%;
    width: 45px;
    height: 45px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: all 0.3s ease;
    z-index: 10;
    box-shadow: 0 4px 12px rgba(0,0,0,0.3);
}

    .lightbox-close-btn:hover[b-vex03megkx] {
        background: #dc3545;
        transform: rotate(90deg) scale(1.1);
    }

        .lightbox-close-btn:hover i[b-vex03megkx] {
            color: white;
        }

    .lightbox-close-btn i[b-vex03megkx] {
        font-size: 1.2rem;
        color: #333;
    }

/* === INFO PANEL === */
.lightbox-info[b-vex03megkx] {
    position: absolute;
    bottom: 20px;
    left: 50%;
    transform: translateX(-50%);
    background: rgba(0,0,0,0.8);
    backdrop-filter: blur(10px);
    padding: 1rem 1.5rem;
    border-radius: 8px;
    color: white;
    min-width: 300px;
    z-index: 10;
}

    .lightbox-info p[b-vex03megkx] {
        color: rgba(255,255,255,0.9);
        font-size: 0.9rem;
    }

/* === RESPONSIVE === */
@media (max-width: 768px) {
    .gallery-toolbar[b-vex03megkx] {
        padding: 0.75rem;
    }

    .lightbox-image[b-vex03megkx] {
        max-width: 95vw;
        max-height: 85vh;
    }

    .lightbox-nav-btn[b-vex03megkx] {
        width: 40px;
        height: 40px;
    }

        .lightbox-nav-btn.left[b-vex03megkx] {
            left: 10px;
        }

        .lightbox-nav-btn.right[b-vex03megkx] {
            right: 10px;
        }

    .lightbox-close-btn[b-vex03megkx] {
        top: 10px;
        right: 10px;
        width: 40px;
        height: 40px;
    }

    .lightbox-info[b-vex03megkx] {
        bottom: 10px;
        left: 10px;
        right: 10px;
        transform: none;
        min-width: auto;
    }
}
/* /Components/Pages/Public/ClientProgressBar.razor.rz.scp.css */
/* =================================================================
   OPRAVENÝ KLIENTSKÝ PROGRESS BAR - Čitelný horizontální layout
   Vyřešeno překrývání textů a problémy s pozicováním
   ================================================================= */

/* === CSS CUSTOM PROPERTIES === */
:root[b-rjnravnqzb] {
    --client-primary: #a27b40;
    --client-primary-light: #d4a574;
    --client-success: #28a745;
    --client-success-light: #20c997;
    --client-warning: #f59e0b;
    --client-warning-light: #fbbf24;
    --client-pending: #6b7280;
    --client-pending-light: #9ca3af;
    --client-bg: #ffffff;
    --client-bg-light: #f8f9fa;
    --client-border: #dee2e6;
    --client-border-radius: 12px;
    --client-shadow: 0 4px 20px rgba(0,0,0,0.1);
    --client-transition: all 0.3s ease;
}

/* === HLAVNÍ KONTEJNER === */
.client-progress-container[b-rjnravnqzb] {
    background: var(--client-bg);
    border: 2px solid var(--client-border);
    border-radius: var(--client-border-radius);
    padding: 2rem;
    margin: 1.5rem 0;
    box-shadow: var(--client-shadow);
    font-family: 'Montserrat', -apple-system, BlinkMacSystemFont, sans-serif;
    position: relative;
    overflow: hidden;
}

    .client-progress-container[b-rjnravnqzb]::before {
        content: '';
        position: absolute;
        top: 0;
        left: 0;
        right: 0;
        height: 4px;
        background: linear-gradient(90deg, var(--client-primary), var(--client-primary-light));
        border-radius: var(--client-border-radius) var(--client-border-radius) 0 0;
    }

/* === HEADER SEKCE === */
.progress-header[b-rjnravnqzb] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 3rem;
    gap: 2rem;
}

.progress-title h4[b-rjnravnqzb] {
    margin: 0 0 0.5rem 0;
    color: #2c3e50;
    font-weight: 600;
    font-size: 1.5rem;
    line-height: 1.3;
}

.progress-subtitle[b-rjnravnqzb] {
    margin: 0;
    color: var(--client-pending);
    font-size: 1rem;
    line-height: 1.5;
    font-weight: 400;
}

.progress-summary[b-rjnravnqzb] {
    text-align: right;
    flex-shrink: 0;
}

.completion-stats[b-rjnravnqzb] {
    display: flex;
    align-items: baseline;
    gap: 0.25rem;
    margin-bottom: 0.5rem;
    justify-content: flex-end;
}

.completed-count[b-rjnravnqzb] {
    font-size: 2rem;
    font-weight: 700;
    color: var(--client-success);
    line-height: 1;
}

.total-count[b-rjnravnqzb] {
    font-size: 1.2rem;
    color: var(--client-pending);
    font-weight: 500;
}

.steps-label[b-rjnravnqzb] {
    font-size: 0.9rem;
    color: var(--client-pending);
    font-weight: 400;
}

.progress-percentage[b-rjnravnqzb] {
    font-size: 1.1rem;
    font-weight: 600;
    color: var(--client-primary);
    background: rgba(162, 123, 64, 0.1);
    padding: 0.25rem 0.75rem;
    border-radius: 20px;
    display: inline-block;
}

/* === KROKY KONTEJNER - NOVÝ FLEXBOX LAYOUT === */
.progress-steps-container[b-rjnravnqzb] {
    position: relative;
    margin: 3rem 0;
    padding: 0;
}

/* === POZADÍ ČÁRY === */
.progress-background-line[b-rjnravnqzb] {
    position: absolute;
    top: 37px; /* Zarovnáno na střed větších kruhů (70px/2 + 2px border) */
    left: 5%;
    right: 5%;
    height: 4px;
    background: linear-gradient(90deg, var(--client-border), #e9ecef);
    border-radius: 2px;
    z-index: 1;
}

.progress-fill-line[b-rjnravnqzb] {
    position: absolute;
    top: 37px; /* Zarovnáno na střed větších kruhů */
    left: 5%;
    height: 4px;
    background: linear-gradient(90deg, var(--client-success), var(--client-success-light));
    border-radius: 2px;
    z-index: 2;
    transition: width 0.8s ease-in-out;
    box-shadow: 0 0 10px rgba(40, 167, 69, 0.3);
}

/* === NOVÝ FLEXBOX LAYOUT PRO KROKY === */
.progress-steps-container[b-rjnravnqzb] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    position: relative;
    margin: 3rem 0;
    padding: 0 2rem; /* Padding místo margin pro kroky */
    min-height: 180px; /* Fixní výška */
}

/* === JEDNOTLIVÉ KROKY - FLEXBOX === */
.progress-step[b-rjnravnqzb] {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    z-index: 3;
    flex: 1; /* Rovnoměrné rozdělení místa */
    max-width: 180px; /* Zvětšeno pro lepší prostor */
    transition: var(--client-transition);
    cursor: pointer;
    padding: 0 0.5rem; /* Vnitřní padding místo margin */
    opacity: 1 !important; /* Zajisti plnou viditelnost všech kroků */
}

    .progress-step *[b-rjnravnqzb] {
        opacity: 1 !important; /* Základní fix pro všechny child elementy */
    }

    .progress-step:hover[b-rjnravnqzb] {
        transform: translateY(-3px);
    }

    /* === KROKY PODLE STAVU === */

    /* === STARÉ SELEKTORY - DEAKTIVOVANÉ === */
    /* COMPLETED - Dokončené kroky */
    .progress-step.completed .step-circle[b-rjnravnqzb] {
        /* Přepsáno specifickými třídami výše */
    }

    .progress-step.completed .check-overlay[b-rjnravnqzb] {
        animation: checkmarkAppear-b-rjnravnqzb 0.4s ease-out 0.2s both;
    }

    .progress-step.completed .step-title[b-rjnravnqzb] {
        color: #28a745 !important;
        font-weight: 600;
    }

    .progress-step.completed .step-date[b-rjnravnqzb] {
        background: linear-gradient(135deg, #d4edda, #c3e6cb) !important;
        color: #155724 !important;
        border: 1px solid #28a745 !important;
    }

    /* ACTIVE - Aktivní krok */
    .progress-step.active .step-circle[b-rjnravnqzb] {
        /* Přepsáno specifickými třídami výše */
    }

    .progress-step.active .step-title[b-rjnravnqzb] {
        color: #f59e0b !important;
        font-weight: 700;
        animation: activeGlow-b-rjnravnqzb 2s infinite;
    }

    .progress-step.active .step-status.active[b-rjnravnqzb] {
        background: linear-gradient(135deg, rgba(245, 158, 11, 0.15), rgba(251, 191, 36, 0.15)) !important;
        color: #b45309 !important;
        border: 1px solid #f59e0b !important;
    }

    /* PENDING - Čekající kroky */
    .progress-step.pending .step-circle[b-rjnravnqzb] {
        /* Přepsáno specifickými třídami výše */
    }

    .progress-step.pending .step-title[b-rjnravnqzb] {
        color: #6b7280 !important;
        font-weight: 500;
    }

    .progress-step.pending .step-status.pending[b-rjnravnqzb] {
        background: rgba(108, 117, 125, 0.1) !important;
        color: #6b7280 !important;
        border: 1px solid #9ca3af !important;
    }

/* === KRUH S IKONOU - ZÁKLADNÍ STYLY === */
.step-circle[b-rjnravnqzb] {
    width: 70px;
    height: 70px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.8rem;
    font-weight: 600;
    margin-bottom: 1rem;
    transition: var(--client-transition);
    position: relative;
    z-index: 4;
    flex-shrink: 0;
}

/* === SPECIFICKÉ STYLY PODLE STAVU === */

/* COMPLETED KRUHY */
.step-circle-completed[b-rjnravnqzb] {
    background: #28a745 !important;
    border: 3px solid #28a745 !important;
    color: white !important;
    box-shadow: 0 6px 20px rgba(40, 167, 69, 0.4) !important;
}

.step-icon-completed[b-rjnravnqzb] {
    color: white !important;
    font-size: 1.8rem !important;
    opacity: 1 !important;
}

/* ACTIVE KRUHY */
.step-circle-active[b-rjnravnqzb] {
    background: #f59e0b !important;
    border: 3px solid #f59e0b !important;
    color: white !important;
    box-shadow: 0 8px 25px rgba(245, 158, 11, 0.5) !important;
    transform: scale(1.05) !important;
}

.step-icon-active[b-rjnravnqzb] {
    color: white !important;
    font-size: 1.8rem !important;
    opacity: 1 !important;
}

/* PENDING KRUHY */
.step-circle-pending[b-rjnravnqzb] {
    background: #f8f9fa !important;
    border: 3px solid #9ca3af !important;
    color: #6b7280 !important;
}

.step-icon-pending[b-rjnravnqzb] {
    color: #6b7280 !important;
    font-size: 1.8rem !important;
    opacity: 0.6 !important;
}

/* === CHECKMARK OVERLAY === */
.check-overlay[b-rjnravnqzb] {
    position: absolute;
    bottom: -5px;
    right: -5px;
    background: white !important;
    border-radius: 50%;
    width: 24px;
    height: 24px;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 2px solid #28a745 !important;
    z-index: 6;
    box-shadow: 0 2px 8px rgba(0,0,0,0.2);
}

    .check-overlay i[b-rjnravnqzb] {
        font-size: 1rem !important;
        color: #28a745 !important;
    }

/* === OBSAH KROKU === */
.step-content[b-rjnravnqzb] {
    width: 100%;
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    min-height: 120px; /* Zvětšeno pro lepší prostor */
}

.step-title[b-rjnravnqzb] {
    font-weight: 600;
    font-size: 1rem; /* Zvětšeno */
    line-height: 1.2;
    margin-bottom: 0.5rem;
    min-height: 2.8rem; /* Zvětšeno pro 2-3 řádky */
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    word-break: break-word; /* Místo hyphens */
    overflow-wrap: break-word;
    opacity: 1 !important; /* Zajisti viditelnost textu */
    color: #2c3e50 !important; /* Základní tmavá barva pro čitelnost */
}

.step-date[b-rjnravnqzb],
.step-status[b-rjnravnqzb] {
    font-size: 0.75rem;
    padding: 0.3rem 0.6rem;
    border-radius: 15px;
    font-weight: 500;
    margin-bottom: 0.5rem;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.25rem;
    transition: var(--client-transition);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    opacity: 1 !important; /* Zajisti viditelnost */
}

.step-description[b-rjnravnqzb] {
    font-size: 0.85rem; /* Zvětšeno */
    color: var(--client-pending) !important;
    line-height: 1.4;
    text-align: center;
    flex-grow: 1;
    display: flex;
    align-items: flex-start; /* Zarovnat nahoru */
    justify-content: center;
    padding: 0 0.25rem;
    word-break: break-word; /* Místo hyphens */
    overflow-wrap: break-word;
    min-height: 2.5rem; /* Fixní místo pro text */
    opacity: 1 !important; /* Zajisti viditelnost */
}

/* === FOOTER SEKCE === */
.progress-footer[b-rjnravnqzb] {
    background: var(--client-bg-light);
    border: 1px solid var(--client-border);
    border-radius: var(--client-border-radius);
    padding: 1.5rem;
    margin-top: 3rem;
    text-align: center;
    font-size: 1rem;
    line-height: 1.5;
}

.completion-message[b-rjnravnqzb] {
    color: var(--client-primary);
    font-weight: 600;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
}

.next-step-estimate[b-rjnravnqzb] {
    color: #2c3e50;
    font-weight: 500;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
}

.general-info[b-rjnravnqzb] {
    color: var(--client-pending);
    font-weight: 400;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
}

/* === ANIMACE === */
@keyframes completedPulse-b-rjnravnqzb {
    0% {
        transform: scale(1);
        box-shadow: 0 6px 20px rgba(40, 167, 69, 0.4);
    }

    50% {
        transform: scale(1.05);
        box-shadow: 0 8px 30px rgba(40, 167, 69, 0.6);
    }

    100% {
        transform: scale(1);
        box-shadow: 0 6px 20px rgba(40, 167, 69, 0.4);
    }
}

@keyframes activePulse-b-rjnravnqzb {
    0%, 100% {
        box-shadow: 0 8px 25px rgba(245, 158, 11, 0.5);
        transform: scale(1.05);
    }

    50% {
        box-shadow: 0 12px 35px rgba(245, 158, 11, 0.7);
        transform: scale(1.1);
    }
}

@keyframes activeGlow-b-rjnravnqzb {
    0%, 100% {
        text-shadow: 0 0 10px rgba(245, 158, 11, 0.3);
    }

    50% {
        text-shadow: 0 0 20px rgba(245, 158, 11, 0.6);
    }
}

@keyframes checkmarkAppear-b-rjnravnqzb {
    0% {
        transform: scale(0);
        opacity: 0;
    }

    50% {
        transform: scale(1.2);
        opacity: 0.8;
    }

    100% {
        transform: scale(1);
        opacity: 1;
    }
}

/* === HOVER EFEKTY === */
.progress-step:hover .step-circle[b-rjnravnqzb] {
    transform: scale(1.05);
    box-shadow: 0 8px 30px rgba(0,0,0,0.2);
}

.progress-step.completed:hover .step-circle[b-rjnravnqzb] {
    box-shadow: 0 10px 35px rgba(40, 167, 69, 0.6);
}

.progress-step.completed:hover .check-overlay[b-rjnravnqzb] {
    transform: scale(1.1);
}

.progress-step.active:hover .step-circle[b-rjnravnqzb] {
    box-shadow: 0 15px 40px rgba(245, 158, 11, 0.8);
}

.progress-step.pending:hover .step-circle[b-rjnravnqzb] {
    background: linear-gradient(135deg, #e9ecef, #dee2e6);
    box-shadow: 0 6px 20px rgba(108, 117, 125, 0.3);
}

/* === RESPONZIVNÍ DESIGN === */
@media (max-width: 1400px) {
    .progress-step[b-rjnravnqzb] {
        max-width: 160px; /* Přizpůsobeno */
    }

    .step-title[b-rjnravnqzb] {
        font-size: 0.95rem;
        min-height: 3rem;
        word-break: break-word;
        overflow-wrap: break-word;
    }

    .step-description[b-rjnravnqzb] {
        font-size: 0.8rem;
        word-break: break-word;
        overflow-wrap: break-word;
    }
}

@media (max-width: 1200px) {
    .progress-step[b-rjnravnqzb] {
        max-width: 140px; /* Přizpůsobeno */
        padding: 0 0.25rem;
    }

    .progress-background-line[b-rjnravnqzb] {
        top: 32px; /* Přizpůsobeno kruhům 60px */
    }

    .progress-fill-line[b-rjnravnqzb] {
        top: 32px;
    }

    .step-circle[b-rjnravnqzb] {
        width: 60px;
        height: 60px;
        font-size: 1.5rem;
    }

        .step-circle i[b-rjnravnqzb] {
            font-size: 1.5rem;
        }

    .check-overlay[b-rjnravnqzb] {
        width: 20px;
        height: 20px;
        bottom: -3px;
        right: -3px;
    }

        .check-overlay i[b-rjnravnqzb] {
            font-size: 0.8rem;
        }

    .step-title[b-rjnravnqzb] {
        font-size: 0.9rem;
        min-height: 3.2rem; /* Zvětšeno */
        word-break: break-word;
        overflow-wrap: break-word;
    }

    .step-description[b-rjnravnqzb] {
        font-size: 0.75rem;
        min-height: 2.8rem;
        word-break: break-word;
        overflow-wrap: break-word;
    }

    .step-date[b-rjnravnqzb],
    .step-status[b-rjnravnqzb] {
        font-size: 0.7rem;
        padding: 0.25rem 0.5rem;
    }
}

@media (max-width: 992px) {
    .progress-header[b-rjnravnqzb] {
        flex-direction: column;
        gap: 1rem;
        text-align: center;
        margin-bottom: 2rem;
    }

    .progress-summary[b-rjnravnqzb] {
        text-align: center;
    }

    .progress-background-line[b-rjnravnqzb] {
        top: 27px; /* Přizpůsobeno kruhům 50px */
    }

    .progress-fill-line[b-rjnravnqzb] {
        top: 27px;
    }

    .progress-step[b-rjnravnqzb] {
        max-width: 120px; /* Přizpůsobeno */
        padding: 0 0.1rem;
    }

    .step-circle[b-rjnravnqzb] {
        width: 50px;
        height: 50px;
        font-size: 1.2rem;
        margin-bottom: 0.75rem;
    }

        .step-circle i[b-rjnravnqzb] {
            font-size: 1.2rem;
        }

    .check-overlay[b-rjnravnqzb] {
        width: 18px;
        height: 18px;
        bottom: -2px;
        right: -2px;
    }

        .check-overlay i[b-rjnravnqzb] {
            font-size: 0.7rem;
        }

    .step-title[b-rjnravnqzb] {
        font-size: 0.85rem;
        min-height: 3.6rem; /* Zvětšeno */
        word-break: break-word;
        overflow-wrap: break-word;
    }

    .step-description[b-rjnravnqzb] {
        font-size: 0.7rem;
        min-height: 3rem;
        word-break: break-word;
        overflow-wrap: break-word;
    }

    .step-date[b-rjnravnqzb],
    .step-status[b-rjnravnqzb] {
        font-size: 0.65rem;
        padding: 0.2rem 0.4rem;
    }
}

@media (max-width: 768px) {
    .client-progress-container[b-rjnravnqzb] {
        padding: 1.5rem 1rem;
        margin: 1rem 0;
    }

    .progress-title h4[b-rjnravnqzb] {
        font-size: 1.3rem;
    }

    .completed-count[b-rjnravnqzb] {
        font-size: 1.5rem;
    }

    .progress-steps-container[b-rjnravnqzb] {
        padding: 0 1rem;
        min-height: 180px; /* Zvětšeno */
    }

    .progress-background-line[b-rjnravnqzb] {
        top: 24px; /* Přizpůsobeno menším kruhům (45px/2 + 2px) */
    }

    .progress-fill-line[b-rjnravnqzb] {
        top: 24px;
    }

    .progress-step[b-rjnravnqzb] {
        max-width: 100px; /* Přizpůsobeno */
        padding: 0;
    }

    .step-circle[b-rjnravnqzb] {
        width: 45px;
        height: 45px;
        font-size: 1.1rem;
        margin-bottom: 0.5rem;
    }

        .step-circle i[b-rjnravnqzb] {
            font-size: 1.1rem;
        }

    .check-overlay[b-rjnravnqzb] {
        width: 16px;
        height: 16px;
        bottom: -2px;
        right: -2px;
    }

        .check-overlay i[b-rjnravnqzb] {
            font-size: 0.6rem;
        }

    .step-title[b-rjnravnqzb] {
        font-size: 0.8rem;
        min-height: 4rem; /* Zvětšeno */
        line-height: 1.1;
        word-break: break-word;
        overflow-wrap: break-word;
    }

    .step-description[b-rjnravnqzb] {
        font-size: 0.65rem;
        line-height: 1.2;
        min-height: 3.2rem;
        word-break: break-word;
        overflow-wrap: break-word;
    }

    .step-date[b-rjnravnqzb],
    .step-status[b-rjnravnqzb] {
        font-size: 0.6rem;
        padding: 0.15rem 0.3rem;
    }

    .progress-footer[b-rjnravnqzb] {
        padding: 1rem;
        font-size: 0.9rem;
        margin-top: 2rem;
    }
}

@media (max-width: 576px) {
    .client-progress-container[b-rjnravnqzb] {
        padding: 1rem 0.75rem;
    }

    /* Pro velmi malé mobilní obrazovky přepneme na vertikální layout */
    .progress-steps-container[b-rjnravnqzb] {
        flex-direction: column;
        gap: 1.5rem;
        padding: 1rem 0;
        min-height: auto;
    }

    .progress-background-line[b-rjnravnqzb],
    .progress-fill-line[b-rjnravnqzb] {
        display: none; /* Skryj horizontální čáry */
    }

    .progress-step[b-rjnravnqzb] {
        max-width: none;
        width: 100%;
        flex-direction: row;
        text-align: left;
        gap: 1rem;
        padding: 1rem;
        background: var(--client-bg-light);
        border-radius: var(--client-border-radius);
        border: 1px solid var(--client-border);
    }

        .progress-step:hover[b-rjnravnqzb] {
            transform: none;
            background: #f1f3f4;
        }

    .step-circle[b-rjnravnqzb] {
        width: 50px;
        height: 50px;
        margin: 0;
        flex-shrink: 0;
    }

    .check-overlay[b-rjnravnqzb] {
        width: 18px;
        height: 18px;
        bottom: -2px;
        right: -2px;
    }

        .check-overlay i[b-rjnravnqzb] {
            font-size: 0.7rem;
        }

    .step-content[b-rjnravnqzb] {
        min-height: auto;
        flex: 1;
        text-align: left;
        align-items: flex-start;
    }

    .step-title[b-rjnravnqzb] {
        min-height: auto;
        justify-content: flex-start;
        margin-bottom: 0.25rem;
        text-align: left;
    }

    .step-date[b-rjnravnqzb],
    .step-status[b-rjnravnqzb] {
        justify-content: flex-start;
        margin-bottom: 0.25rem;
    }

    .step-description[b-rjnravnqzb] {
        text-align: left;
        justify-content: flex-start;
        align-items: flex-start;
        padding: 0;
    }
}

/* === ACCESSIBILITY === */
@media (prefers-reduced-motion: reduce) {
    .progress-step[b-rjnravnqzb],
    .step-circle[b-rjnravnqzb],
    .progress-fill-line[b-rjnravnqzb],
    .check-overlay[b-rjnravnqzb] {
        transition: none;
        animation: none;
    }

        .progress-step.active .step-circle[b-rjnravnqzb],
        .progress-step.active .step-title[b-rjnravnqzb],
        .progress-step.completed .check-overlay[b-rjnravnqzb] {
            animation: none;
        }
}

/* === FOCUS STATES === */
.progress-step:focus-within .step-circle[b-rjnravnqzb] {
    outline: 3px solid var(--client-primary);
    outline-offset: 3px;
    box-shadow: 0 0 0 6px rgba(162, 123, 64, 0.3);
}

/* === PRINT STYLY === */
@media print {
    .client-progress-container[b-rjnravnqzb] {
        break-inside: avoid;
        box-shadow: none;
        border: 2px solid #000;
    }

    .progress-step[b-rjnravnqzb] {
        break-inside: avoid;
    }

    .step-circle[b-rjnravnqzb] {
        background: #000 !important;
        color: #fff !important;
        border-color: #000 !important;
        box-shadow: none !important;
        animation: none !important;
    }

    .check-overlay[b-rjnravnqzb] {
        background: #fff !important;
        border-color: #000 !important;
    }

        .check-overlay i[b-rjnravnqzb] {
            color: #000 !important;
        }

    .step-title[b-rjnravnqzb],
    .step-description[b-rjnravnqzb],
    .step-date[b-rjnravnqzb],
    .step-status[b-rjnravnqzb] {
        color: #000 !important;
        background: transparent !important;
        border: none !important;
        box-shadow: none !important;
    }

    .progress-footer[b-rjnravnqzb] {
        background: transparent !important;
        border: 1px solid #000 !important;
    }

    .progress-background-line[b-rjnravnqzb],
    .progress-fill-line[b-rjnravnqzb] {
        background: #000 !important;
    }
}
/* /Components/Pages/Public/Portfolio.razor.rz.scp.css */
/* ==========================================================================
   PORTFOLIO GALERIE STYLY - SOENNEKER.BLAZOR.MASONRY
   ========================================================================== */

/* Kontejner pro Masonry s Bootstrap row */
.row[b-tonote2880] {
    margin-left: -8px;
    margin-right: -8px;
}

/* Automaticky přidaná třída knihovnou - .masonry-item */
.masonry-item[b-tonote2880] {
    padding-left: 8px;
    padding-right: 8px;
    margin-bottom: 16px;
}

/* Bootstrap responsive třídy pro sloupce */
.col-lg-3[b-tonote2880] {
    width: 25%; /* 4 sloupce na velkých obrazovkách */
}

.col-md-4[b-tonote2880] {
    width: 33.333%; /* 3 sloupce na středních obrazovkách */
}

.col-sm-6[b-tonote2880] {
    width: 50%; /* 2 sloupce na malých obrazovkách */
}

.mb-3[b-tonote2880] {
    margin-bottom: 1rem;
}

/* Responzivní breakpointy */
@media (max-width: 575px) {
    .col-sm-6[b-tonote2880], .col-md-4[b-tonote2880], .col-lg-3[b-tonote2880] {
        width: 100% !important; /* 1 sloupec na mobilech */
    }

    .masonry-item[b-tonote2880] {
        margin-bottom: 12px;
    }
}

@media (min-width: 576px) and (max-width: 767px) {
    .col-md-4[b-tonote2880], .col-lg-3[b-tonote2880] {
        width: 50% !important; /* 2 sloupce na tabletech */
    }
}

@media (min-width: 768px) and (max-width: 991px) {
    .col-lg-3[b-tonote2880] {
        width: 33.333% !important; /* 3 sloupce na malých desktopech */
    }
}

/* ==========================================================================
   GALERIE OBRÁZKY A HOVER EFEKTY
   ========================================================================== */

/* Základní styl pro wrapper obrázku */
.gallery-item-wrapper[b-tonote2880] {
    position: relative;
    overflow: hidden;
    border-radius: 10px;
    box-shadow: 0 3px 10px rgba(0, 0, 0, 0.08);
    transition: all 0.3s ease;
    background: #fff;
    cursor: pointer;
}

    /* Hover efekt pro celý wrapper */
    .gallery-item-wrapper:hover[b-tonote2880] {
        transform: translateY(-2px);
        box-shadow: 0 8px 20px rgba(0, 0, 0, 0.15);
    }

/* Základní styl pro obrázky */
.gallery-img[b-tonote2880] {
    width: 100%;
    height: auto;
    display: block;
    border-radius: 10px;
    transition: transform 0.3s ease;
    object-fit: cover;
}

    /* Hover efekt pro obrázek */
    .gallery-img:hover[b-tonote2880] {
        transform: scale(1.02);
    }

/* ==========================================================================
   OVERLAY EFEKT PRO GALERII
   ========================================================================== */

/* Overlay s lupou - skrytý ve výchozím stavu */
.gallery-overlay[b-tonote2880] {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(135deg, rgba(0, 0, 0, 0.7), rgba(0, 0, 0, 0.4));
    border-radius: 10px;
    display: flex;
    justify-content: center;
    align-items: center;
    opacity: 0;
    transition: all 0.3s ease;
    z-index: 2;
    backdrop-filter: blur(2px);
}

/* Zobrazení overlay při hoveru */
.gallery-item-wrapper:hover .gallery-overlay[b-tonote2880] {
    opacity: 1;
}

/* Ikona lupy v overlay */
.gallery-overlay i[b-tonote2880] {
    color: white;
    font-size: 2.2rem;
    text-shadow: 0 2px 8px rgba(0, 0, 0, 0.8);
    transform: scale(0.8);
    transition: transform 0.3s ease;
}

/* Animace ikony při hoveru */
.gallery-item-wrapper:hover .gallery-overlay i[b-tonote2880] {
    transform: scale(1);
}

/* ==========================================================================
   LIGHTBOX VŽDY UPROSTŘED OBRAZOVKY - SKUTEČNÝ FIXED
   ========================================================================== */

/* Hlavní overlay lightboxu - VŽDY celý viewport */
.custom-lightbox[b-tonote2880] {
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    width: 100vw !important;
    height: 100vh !important;
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    z-index: 999999 !important; /* Nejvyšší možné z-index */
    cursor: pointer;
    animation: lightboxFadeIn-b-tonote2880 0.3s ease-out;
    /* Absolutní zákaz scrollování */
    overflow: hidden !important;
    overscroll-behavior: none !important;
}

@keyframes lightboxFadeIn-b-tonote2880 {
    from {
        opacity: 0;
    }

    to {
        opacity: 1;
    }
}

/* Rozmazané pozadí - VŽDY celý viewport */
.lightbox-backdrop[b-tonote2880] {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.85);
    backdrop-filter: blur(15px);
    -webkit-backdrop-filter: blur(15px);
    z-index: 1;
}

/* Kontejner obtažený kolem fotky - UPROSTŘED viewportu */
.lightbox-content[b-tonote2880] {
    position: relative;
    cursor: default;
    animation: lightboxSlideIn-b-tonote2880 0.4s ease-out;
    z-index: 2;
    /* Explicitní centrování */
    display: flex;
    justify-content: center;
    align-items: center;
    /* Zajistíme ostrý obsah */
    filter: none !important;
    backdrop-filter: none !important;
}

@keyframes lightboxSlideIn-b-tonote2880 {
    from {
        transform: scale(0.9) translateY(20px);
        opacity: 0;
    }

    to {
        transform: scale(1) translateY(0);
        opacity: 1;
    }
}

/* Hlavní obrázek - určuje velikost kontejneru */
.lightbox-image[b-tonote2880] {
    max-width: 85vw;
    max-height: 85vh;
    width: auto;
    height: auto;
    object-fit: contain;
    border-radius: 12px;
    box-shadow: 0 30px 80px rgba(0, 0, 0, 0.9), 0 15px 40px rgba(0, 0, 0, 0.7), 0 0 0 1px rgba(255, 255, 255, 0.1);
    user-select: none;
    -webkit-user-drag: none;
    transition: all 0.3s ease;
    display: block;
    filter: none !important;
}

/* Navigační tlačítka s jasně viditelnými ikonkami */
.lightbox-nav-btn[b-tonote2880] {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    background: rgba(255, 255, 255, 0.95);
    color: #333;
    border: none;
    border-radius: 50%;
    width: 60px;
    height: 60px;
    cursor: pointer;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    z-index: 10;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.6), 0 0 0 1px rgba(255, 255, 255, 0.2);
    user-select: none;
    backdrop-filter: blur(10px);
    filter: none !important;
}

    .lightbox-nav-btn i[b-tonote2880] {
        font-size: 1.4rem;
        font-weight: 900;
        color: #2c3e50;
    }

    .lightbox-nav-btn:hover[b-tonote2880] {
        background: white;
        transform: translateY(-50%) scale(1.15);
        box-shadow: 0 15px 40px rgba(0, 0, 0, 0.7), 0 0 0 1px rgba(255, 255, 255, 0.3);
    }

        .lightbox-nav-btn:hover i[b-tonote2880] {
            color: #007bff;
        }

    .lightbox-nav-btn:active[b-tonote2880] {
        transform: translateY(-50%) scale(0.95);
    }

    .lightbox-nav-btn.left[b-tonote2880] {
        left: -80px;
    }

    .lightbox-nav-btn.right[b-tonote2880] {
        right: -80px;
    }

/* Stylové tlačítko pro zavření */
.lightbox-close-btn[b-tonote2880] {
    position: absolute;
    top: -80px;
    right: -20px;
    background: rgba(255, 255, 255, 0.95);
    color: #333;
    border: none;
    border-radius: 50%;
    width: 55px;
    height: 55px;
    cursor: pointer;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    z-index: 10;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.6), 0 0 0 1px rgba(255, 255, 255, 0.2);
    user-select: none;
    backdrop-filter: blur(10px);
    filter: none !important;
}

    .lightbox-close-btn i[b-tonote2880] {
        font-size: 1.2rem;
        font-weight: 900;
        color: #2c3e50;
    }

    .lightbox-close-btn:hover[b-tonote2880] {
        background: linear-gradient(135deg, #ff6b6b, #ee5a5a);
        transform: scale(1.15) rotate(90deg);
        box-shadow: 0 15px 40px rgba(255, 107, 107, 0.5), 0 0 0 1px rgba(255, 255, 255, 0.3);
    }

        .lightbox-close-btn:hover i[b-tonote2880] {
            color: white;
        }

/* Responzivní úpravy pro mobilní zařízení */
@media (max-width: 768px) {
    .lightbox-image[b-tonote2880] {
        max-width: 95vw;
        max-height: 80vh;
        border-radius: 8px;
    }

    .lightbox-nav-btn[b-tonote2880] {
        width: 50px;
        height: 50px;
    }

        .lightbox-nav-btn i[b-tonote2880] {
            font-size: 1.2rem;
        }

        .lightbox-nav-btn.left[b-tonote2880] {
            left: 15px;
            top: 50%;
        }

        .lightbox-nav-btn.right[b-tonote2880] {
            right: 15px;
            top: 50%;
        }

    .lightbox-close-btn[b-tonote2880] {
        top: 15px;
        right: 15px;
        width: 45px;
        height: 45px;
    }

        .lightbox-close-btn i[b-tonote2880] {
            font-size: 1rem;
        }
}

/* ==========================================================================
   LOADING A SUCCESS STYLY
   ========================================================================== */

/* Kontejner pro loading spinner */
.loading-container[b-tonote2880] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 4rem 2rem;
    text-align: center;
    @page
    "/portfolio" @rendermode InteractiveServer @using Syncfusion.Blazor.Popups @using Soenneker.Blazor.Masonry @inject NavigationManager NavigationManager @inject IWebHostEnvironment env @* Úvodní fotka *@ <div class="banner-portfolio">
    <!-- Pozadí -->
    <img src="images/uvodni-fotka-portfolio.webp" class="w-100 uvodni-fotka-portfolio" alt="Ondra Budka - Svatební fotograf ze severu Čech" />
    <!-- Překryv -->
    <div class="overlay-portfolio"></div>
    <!-- Text nahoře -->
    <div class="text-overlay-portfolio"> <h1 class="montserrat-nadpis">Portfolio</h1> </div> </div> <div class="container-nacteni mt-5 fade-on-scroll hidden"> <h2 class="montserrat-nadpis text-center mt-5">Ukázka mé práce</h2> @if (!isClient)

{
    <p>Načítám galerii...</p>
}

else[b-tonote2880] {
    <Masonry AutoRender="true" class="row g-0 masonry-container"> @foreach (var photo in Photos)

{
    <MasonryItem class="col-12 col-sm-6 col-md-4"> <img src="@photo" loading="lazy" class="gallery-img" @onclick="() => ShowImage(photo)" /> </MasonryItem>
}

</Masonry >

@if (IsDialogVisible && SelectedPhoto != null)[b-tonote2880] {
    <SfDialog IsModal="true" ShowCloseIcon="true" Width="auto" Height="auto" CssClass="responsive-lightbox" @bind-Visible="@IsDialogVisible" @onwheel="HandleWheel"> <DialogAnimationSettings Effect="DialogEffect.FadeZoom" Duration="300" /> <div class="lightbox-container"> <DialogEvents OnOverlayModalClick="() => IsDialogVisible = false" /> <button class="nav-arrow left" @onclick="ShowPrevious">&#10094;
    </button> <img src="@SelectedPhoto" class="lightbox-image @(isFading ? "fade-out" : "")" /> <button class="nav-arrow right" @onclick="ShowNext">&#10095;
    </button> </div> </SfDialog>
}

}

@code {
    private List<string> Photos = new();
    private string? SelectedPhoto;
    private bool IsDialogVisible;
    private bool isClient = false;
    private int currentIndex = 0;
    private bool isFading = false;

    // import všech fotek ze složky "wwwroot/images/portfolio" do galerie
    protected override void OnInitialized()[b-tonote2880] {
        var path = Path.Combine(env.WebRootPath, "images", "portfolio");
        if (Directory.Exists(path))

{
    var files = Directory.GetFiles(path, "*.webp") .OrderByDescending(f => Path.GetFileName(f), StringComparer.OrdinalIgnoreCase);
    Photos = files.Select(f => $"images/portfolio/{Path.GetFileName(f)}").ToList();
}

}

protected override async Task OnAfterRenderAsync(bool firstRender)[b-tonote2880] {
    if (firstRender)

{
    isClient = true;
    StateHasChanged();
    // nutné pro znovuvykreslení galerie
}

}

private void ShowImage(string photo)[b-tonote2880] {
    SelectedPhoto = photo;
    currentIndex = Photos.IndexOf(photo);
    IsDialogVisible = true;
}

private async void ShowNext()[b-tonote2880] {
    isFading = true;
    StateHasChanged();
    await Task.Delay(200);
    // čekáme na fade-out currentIndex = (currentIndex + 1) % Photos.Count;
    SelectedPhoto = Photos[currentIndex];
    isFading = false;
    StateHasChanged();
}

private async void ShowPrevious()[b-tonote2880] {
    isFading = true;
    StateHasChanged();
    await Task.Delay(200);
    currentIndex = (currentIndex - 1 + Photos.Count) % Photos.Count;
    SelectedPhoto = Photos[currentIndex];
    isFading = false;
    StateHasChanged();
}

// dalsi fotka pomocí kolecka myši
private void HandleWheel(WheelEventArgs e)[b-tonote2880] {
    if (e.DeltaY < 0)

{
    ShowPrevious();
    // scroll up
}

else if (e.DeltaY > 0)[b-tonote2880] {
    ShowNext();
    // scroll down
}

}
}
</div[b-tonote2880] >
}

/* Vlastní spinner animace */
.custom-spinner[b-tonote2880] {
    width: 50px;
    height: 50px;
    border: 5px solid #e9ecef;
    border-top: 5px solid #007bff;
    border-radius: 50%;
    animation: spin-b-tonote2880 1s linear infinite;
}

/* Animace pro spinner */
@keyframes spin-b-tonote2880 {
    0% {
        transform: rotate(0deg);
    }

    100% {
        transform: rotate(360deg);
    }
}

/* Success kontejner */
.success-container[b-tonote2880] {
    text-align: center;
    padding: 1.5rem 2rem;
    background: linear-gradient(135deg, #d4edda, #c3e6cb);
    border: 1px solid #c3e6cb;
    border-radius: 15px;
    color: #155724;
    margin-bottom: 2rem;
    font-weight: 600;
    box-shadow: 0 3px 10px rgba(0, 0, 0, 0.05);
}
/* /Components/Pages/Public/TerminyWidget.razor.rz.scp.css */
/* =================================================================
   TerminyWidget.razor.css - Styly pro widget s termíny
   ================================================================= */

/* === HLAVNÍ KONTEJNER === */
.terminy-widget[b-vwznlp6ywi] {
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
    padding: 1.5rem;
    background: linear-gradient(135deg, #ffffff, #fdfbf8);
    border: 1px solid #e9ecef;
    border-radius: 16px;
    box-shadow: 0 4px 20px rgba(0,0,0,0.08);
}

/* === KARTA TERMÍNU === */
.termin-card[b-vwznlp6ywi] {
    display: flex;
    align-items: center;
    gap: 1.5rem;
    padding: 1.25rem;
    background: white;
    border-radius: 12px;
    border: 1px solid #f0f0f0;
    transition: all 0.3s ease;
}

    .termin-card:hover[b-vwznlp6ywi] {
        transform: translateY(-2px);
        box-shadow: 0 6px 20px rgba(0,0,0,0.1);
    }

/* === SPECIFICKÉ KARTY === */
.termin-svatba[b-vwznlp6ywi] {
    background: linear-gradient(135deg, #fff5f5, #fff);
    border-left: 4px solid #e74c3c;
}

.termin-schuzka[b-vwznlp6ywi] {
    background: linear-gradient(135deg, #fffbf0, #fff);
    border-left: 4px solid #f39c12;
}

.termin-foceni[b-vwznlp6ywi] {
    background: linear-gradient(135deg, #f0f8ff, #fff);
    border-left: 4px solid #3498db;
}

/* === IKONA === */
.termin-icon[b-vwznlp6ywi] {
    width: 60px;
    height: 60px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    flex-shrink: 0;
}

.termin-svatba .termin-icon[b-vwznlp6ywi] {
    background: rgba(231, 76, 60, 0.1);
    color: #e74c3c;
}

.termin-schuzka .termin-icon[b-vwznlp6ywi] {
    background: rgba(243, 156, 18, 0.1);
    color: #f39c12;
}

.termin-foceni .termin-icon[b-vwznlp6ywi] {
    background: rgba(52, 152, 219, 0.1);
    color: #3498db;
}

.termin-icon i[b-vwznlp6ywi] {
    font-size: 1.8rem;
}

/* === OBSAH === */
.termin-content[b-vwznlp6ywi] {
    flex: 1;
    min-width: 0;
}

.termin-title[b-vwznlp6ywi] {
    margin: 0 0 0.5rem 0;
    font-size: 1.25rem;
    font-weight: 600;
    color: #2c3e50;
}

.termin-subtitle[b-vwznlp6ywi] {
    margin: 0 0 0.5rem 0;
    font-size: 1rem;
    font-weight: 600;
    color: #34495e;
}

.termin-date[b-vwznlp6ywi] {
    margin: 0 0 0.75rem 0;
    font-size: 1.1rem;
    color: #7f8c8d;
    font-weight: 500;
}

.termin-date-small[b-vwznlp6ywi] {
    margin: 0 0 0.5rem 0;
    font-size: 0.95rem;
    color: #7f8c8d;
}

/* === COUNTDOWN === */
.termin-countdown[b-vwznlp6ywi] {
    display: inline-flex;
    align-items: baseline;
    gap: 0.5rem;
    padding: 0.5rem 1rem;
    background: linear-gradient(135deg, #f8f9fa, #e9ecef);
    border-radius: 20px;
    font-weight: 600;
}

.countdown-number[b-vwznlp6ywi] {
    font-size: 1.5rem;
    font-weight: 700;
}

.countdown-text[b-vwznlp6ywi] {
    font-size: 0.9rem;
    color: #6c757d;
}

.countdown-secondary[b-vwznlp6ywi] {
    font-size: 0.85rem;
    color: #868e96;
    margin-left: 0.5rem;
}

/* === COUNTDOWN VARIANTY === */
.termin-countdown.urgent[b-vwznlp6ywi] {
    background: linear-gradient(135deg, #ffe5e5, #ffcccc);
    color: #e74c3c;
}

    .termin-countdown.urgent .countdown-text[b-vwznlp6ywi] {
        color: #c0392b;
    }

.termin-countdown.soon[b-vwznlp6ywi] {
    background: linear-gradient(135deg, #fff3cd, #ffe69c);
    color: #f39c12;
}

    .termin-countdown.soon .countdown-text[b-vwznlp6ywi] {
        color: #d68910;
    }

.termin-countdown.normal[b-vwznlp6ywi] {
    background: linear-gradient(135deg, #d4edda, #c3e6cb);
    color: #27ae60;
}

    .termin-countdown.normal .countdown-text[b-vwznlp6ywi] {
        color: #229954;
    }

.termin-countdown.distant[b-vwznlp6ywi] {
    background: linear-gradient(135deg, #e3f2fd, #bbdefb);
    color: #3498db;
}

    .termin-countdown.distant .countdown-text[b-vwznlp6ywi] {
        color: #2874a6;
    }

.termin-countdown.today[b-vwznlp6ywi] {
    background: linear-gradient(135deg, #ffd700, #ffed4e);
    color: #fff;
    font-size: 1.2rem;
    animation: pulse-b-vwznlp6ywi 2s infinite;
}

.termin-countdown.past[b-vwznlp6ywi] {
    background: linear-gradient(135deg, #f5f5f5, #e0e0e0);
    color: #999;
}

/* === ANIMACE === */
@keyframes pulse-b-vwznlp6ywi {
    0%, 100% {
        transform: scale(1);
        box-shadow: 0 0 0 0 rgba(255, 215, 0, 0.7);
    }

    50% {
        transform: scale(1.05);
        box-shadow: 0 0 0 10px rgba(255, 215, 0, 0);
    }
}

/* === BADGE STYLY === */
.badge[b-vwznlp6ywi] {
    font-size: 0.75rem;
    font-weight: 600;
    padding: 0.25rem 0.75rem;
    border-radius: 12px;
}

/* === RESPONZIVITA === */
@media (max-width: 768px) {
    .terminy-widget[b-vwznlp6ywi] {
        padding: 1rem;
        gap: 1rem;
    }

    .termin-card[b-vwznlp6ywi] {
        padding: 1rem;
        gap: 1rem;
    }

    .termin-icon[b-vwznlp6ywi] {
        width: 50px;
        height: 50px;
    }

        .termin-icon i[b-vwznlp6ywi] {
            font-size: 1.5rem;
        }

    .termin-title[b-vwznlp6ywi] {
        font-size: 1.1rem;
    }

    .termin-subtitle[b-vwznlp6ywi] {
        font-size: 0.9rem;
    }

    .termin-date[b-vwznlp6ywi] {
        font-size: 1rem;
    }

    .termin-date-small[b-vwznlp6ywi] {
        font-size: 0.85rem;
    }

    .countdown-number[b-vwznlp6ywi] {
        font-size: 1.25rem;
    }

    .countdown-text[b-vwznlp6ywi] {
        font-size: 0.8rem;
    }
}

@media (max-width: 576px) {
    .terminy-widget[b-vwznlp6ywi] {
        padding: 0.75rem;
    }

    .termin-card[b-vwznlp6ywi] {
        flex-direction: column;
        text-align: center;
        padding: 0.75rem;
    }

    .termin-countdown[b-vwznlp6ywi] {
        margin-top: 0.5rem;
    }
}
/* /Components/Pages/Public/VerejnaNabidka.razor.rz.scp.css */
/* =================================================================
   VEŘEJNÁ NABÍDKA - CSS STYLY V SOULADU S APP.CSS
   Stylově sladěno s hlavním designem aplikace
   ================================================================= */

/* ===== 1. CSS CUSTOM PROPERTIES ===== */
:root[b-o5g1m5ixb2] {
    /* Převzaté z app.css pro konzistenci */
    --primary-color: #a27b40;
    --primary-dark: #b89560;
    --secondary-color: #6c757d;
    --success-color: #28a745;
    --danger-color: #dc3545;
    --warning-color: #ffc107;
    --info-color: #17a2b8;
    --border-radius: 8px;
    --border-radius-lg: 12px;
    --box-shadow: 0 2px 8px rgba(0,0,0,0.1);
    --box-shadow-lg: 0 4px 20px rgba(0,0,0,0.15);
    --transition: all 0.3s ease;
    --font-family: 'Montserrat', sans-serif;
    --font-weight-light: 200;
    --font-weight-normal: 300;
    --font-weight-bold: 600;
}

/* ===== 2. ZÁKLADNÍ LAYOUT A KONTEJNERY ===== */
.loading-container[b-o5g1m5ixb2],
.error-container[b-o5g1m5ixb2] {
    min-height: 100vh;
    display: flex;
    align-items: center;
    justify-content: center;
    background: linear-gradient(135deg, var(--primary-color) 0%, var(--primary-dark) 100%);
}

.loading-content[b-o5g1m5ixb2],
.error-content[b-o5g1m5ixb2] {
    text-align: center;
    background: white;
    padding: 3rem;
    border-radius: var(--border-radius-lg);
    box-shadow: var(--box-shadow-lg);
    max-width: 500px;
    font-family: var(--font-family);
}

.error-icon[b-o5g1m5ixb2] {
    font-size: 4rem;
    color: var(--danger-color);
    margin-bottom: 2rem;
}

/* ===== 3. HERO SEKCE ===== */
.hero-section[b-o5g1m5ixb2] {
    background: linear-gradient(135deg, var(--primary-color) 0%, var(--primary-dark) 100%);
    color: white;
    padding: 4rem 0;
    font-family: var(--font-family);
}

.hero-content[b-o5g1m5ixb2] {
    text-align: center;
    max-width: 800px;
    margin: 0 auto;
    padding: 0 1rem;
}

.hero-badge[b-o5g1m5ixb2] {
    display: inline-block;
    background: rgba(255,255,255,0.2);
    padding: 0.5rem 1rem;
    border-radius: var(--border-radius-lg);
    font-size: 0.9rem;
    font-weight: var(--font-weight-bold);
    margin-bottom: 1rem;
    backdrop-filter: blur(10px);
    text-transform: uppercase;
    letter-spacing: 1px;
}

.hero-content h1[b-o5g1m5ixb2] {
    font-size: 3rem;
    font-weight: var(--font-weight-light);
    margin-bottom: 1rem;
    text-shadow: 0 2px 4px rgba(0,0,0,0.3);
    font-family: var(--font-family);
}

.hero-subtitle[b-o5g1m5ixb2] {
    font-size: 1.2rem;
    font-weight: var(--font-weight-normal);
    margin-bottom: 2rem;
    opacity: 0.9;
    line-height: 1.6;
}

.countdown-badge[b-o5g1m5ixb2] {
    display: inline-block;
    background: var(--warning-color);
    color: #333;
    padding: 0.75rem 1.5rem;
    border-radius: var(--border-radius-lg);
    font-weight: var(--font-weight-bold);
    box-shadow: 0 4px 15px rgba(255,193,7,0.4);
    animation: pulse-soft-b-o5g1m5ixb2 2s infinite;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

@keyframes pulse-soft-b-o5g1m5ixb2 {
    0%, 100% {
        transform: scale(1);
    }

    50% {
        transform: scale(1.05);
    }
}

/* ===== 4. HLAVNÍ KARTA A TABY ===== */
.main-card[b-o5g1m5ixb2] {
    background: white;
    border-radius: var(--border-radius-lg);
    box-shadow: var(--box-shadow-lg);
    overflow: hidden;
    margin-bottom: 2rem;
    font-family: var(--font-family);
}

.card-header-tabs[b-o5g1m5ixb2] {
    background: #f8f9fa;
    border-bottom: 1px solid #dee2e6;
    padding: 0;
}

.tabs-container[b-o5g1m5ixb2] {
    display: flex;
    width: 100%;
}

.tab-button[b-o5g1m5ixb2] {
    flex: 1;
    background: transparent;
    border: none;
    padding: 1.5rem 2rem;
    font-size: 1rem;
    font-weight: var(--font-weight-normal);
    color: var(--secondary-color);
    transition: var(--transition);
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    cursor: pointer;
    font-family: var(--font-family);
}

    .tab-button:hover:not(.disabled)[b-o5g1m5ixb2] {
        background: rgba(162, 123, 64, 0.1);
        color: var(--primary-color);
    }

    .tab-button.active[b-o5g1m5ixb2] {
        background: white;
        color: var(--primary-color);
        border-bottom: 3px solid var(--primary-color);
        font-weight: var(--font-weight-bold);
    }

    .tab-button.disabled[b-o5g1m5ixb2] {
        opacity: 0.6;
        cursor: not-allowed;
        color: var(--secondary-color) !important;
        background: #f8f9fa !important;
    }

        .tab-button.disabled[b-o5g1m5ixb2]::before {
            content: "🔒";
            position: absolute;
            top: -5px;
            right: -5px;
            font-size: 0.8rem;
            opacity: 0.7;
        }

.tab-badge[b-o5g1m5ixb2] {
    background: #e9ecef;
    padding: 0.25rem 0.5rem;
    border-radius: var(--border-radius);
    font-size: 0.75rem;
    font-weight: var(--font-weight-bold);
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.tab-button.active .tab-badge[b-o5g1m5ixb2] {
    background: var(--primary-color);
    color: white;
}

.tab-badge.success[b-o5g1m5ixb2] {
    background: var(--success-color);
    color: white;
}

.tab-badge.warning[b-o5g1m5ixb2] {
    background: var(--warning-color);
    color: #333;
}

.tab-badge.danger[b-o5g1m5ixb2] {
    background: var(--danger-color);
    color: white;
    animation: pulse-urgent-b-o5g1m5ixb2 2s infinite;
}

.tab-badge.disabled[b-o5g1m5ixb2] {
    background: #dee2e6 !important;
    color: #adb5bd !important;
    font-style: italic;
}

@keyframes pulse-urgent-b-o5g1m5ixb2 {
    0%, 100% {
        opacity: 1;
    }

    50% {
        opacity: 0.7;
    }
}

/* ===== 5. SJEDNOCENÉ HLAVIČKY PRO VŠECHNY TABY ===== */
.offer-header[b-o5g1m5ixb2],
.contract-header[b-o5g1m5ixb2],
.questionnaire-header[b-o5g1m5ixb2],
.faktura-header[b-o5g1m5ixb2] {
    padding: 2rem;
    border-bottom: 1px solid #f8f9fa;
    display: flex;
    justify-content: space-between;
    align-items: center;
    background: #fafafa;
}

    .offer-header h3[b-o5g1m5ixb2],
    .contract-header h3[b-o5g1m5ixb2],
    .questionnaire-header h3[b-o5g1m5ixb2],
    .faktura-header h3[b-o5g1m5ixb2] {
        margin: 0;
        color: #333;
        font-size: 1.5rem;
        font-weight: var(--font-weight-normal);
        font-family: var(--font-family);
        text-align: left;
    }

.contract-subtitle[b-o5g1m5ixb2],
.questionnaire-subtitle[b-o5g1m5ixb2],
.faktura-subtitle[b-o5g1m5ixb2] {
    color: var(--secondary-color);
    margin: 0;
    line-height: 1.5;
    font-size: 1rem;
    font-weight: var(--font-weight-normal);
}

/* ===== 6. TAB OBSAH ===== */
.tab-content[b-o5g1m5ixb2] {
    padding: 0;
}

.tab-disabled-content[b-o5g1m5ixb2] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 4rem 2rem;
    text-align: center;
    background: #f8f9fa;
    border-radius: var(--border-radius);
    margin: 2rem;
    min-height: 400px;
    font-family: var(--font-family);
}

.disabled-icon[b-o5g1m5ixb2] {
    margin-bottom: 2rem;
    color: #adb5bd;
    opacity: 0.7;
}

.tab-disabled-content h4[b-o5g1m5ixb2] {
    color: var(--secondary-color);
    margin-bottom: 1rem;
    font-weight: var(--font-weight-normal);
}

.tab-disabled-content p[b-o5g1m5ixb2] {
    color: var(--secondary-color);
    margin-bottom: 2rem;
    font-size: 1.1rem;
    line-height: 1.6;
    max-width: 400px;
}

.next-step-hint[b-o5g1m5ixb2] {
    background: rgba(255, 193, 7, 0.1);
    color: #856404;
    padding: 1rem 2rem;
    border-radius: var(--border-radius-lg);
    border: 2px dashed var(--warning-color);
    font-weight: var(--font-weight-normal);
    transition: var(--transition);
}

    .next-step-hint:hover[b-o5g1m5ixb2] {
        background: rgba(255, 193, 7, 0.2);
        transform: translateY(-2px);
    }

/* ===== 7. NABÍDKA TAB ===== */
.offer-summary[b-o5g1m5ixb2] {
    text-align: right;
}

.item-count[b-o5g1m5ixb2] {
    color: var(--secondary-color);
    font-size: 0.9rem;
    display: block;
    font-weight: var(--font-weight-normal);
}

.total-price[b-o5g1m5ixb2] {
    font-size: 1.5rem;
    font-weight: var(--font-weight-bold);
    color: var(--success-color);
}

.offer-items[b-o5g1m5ixb2] {
    padding: 0;
    background: white;
}

.offer-item[b-o5g1m5ixb2] {
    padding: 1.5rem 2rem;
    border-bottom: 1px solid #f8f9fa;
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    transition: var(--transition);
}

    .offer-item:hover[b-o5g1m5ixb2] {
        background-color: #fafafa;
    }

    .offer-item:last-of-type[b-o5g1m5ixb2] {
        border-bottom: none;
    }

.item-info[b-o5g1m5ixb2] {
    flex: 1;
}

.item-name[b-o5g1m5ixb2] {
    margin: 0 0 0.5rem 0;
    color: #333;
    font-weight: var(--font-weight-bold);
    font-size: 1.1rem;
    font-family: var(--font-family);
}

.item-description[b-o5g1m5ixb2] {
    color: var(--secondary-color);
    line-height: 1.5;
    margin-bottom: 0.5rem;
    font-weight: var(--font-weight-normal);
}

.item-category[b-o5g1m5ixb2] {
    display: inline-block;
    background: #e9ecef;
    color: #495057;
    padding: 0.25rem 0.75rem;
    border-radius: var(--border-radius);
    font-size: 0.8rem;
    font-weight: var(--font-weight-bold);
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.item-price[b-o5g1m5ixb2] {
    font-size: 1.2rem;
    font-weight: var(--font-weight-bold);
    color: var(--success-color);
    background: #d4edda;
    padding: 0.5rem 1rem;
    border-radius: var(--border-radius);
    border: 1px solid #c3e6cb;
    min-width: 120px;
    text-align: center;
}

.offer-total[b-o5g1m5ixb2] {
    background: linear-gradient(135deg, #2c3e50, #34495e);
    color: white;
    padding: 2rem;
}

.total-row[b-o5g1m5ixb2] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 1rem;
}

.total-label[b-o5g1m5ixb2] {
    font-size: 1.3rem;
    font-weight: var(--font-weight-bold);
    font-family: var(--font-family);
}

.total-amount[b-o5g1m5ixb2] {
    font-size: 2rem;
    font-weight: var(--font-weight-bold);
    color: #2ecc71;
}

.payment-info[b-o5g1m5ixb2] {
    padding-top: 1rem;
    border-top: 1px solid rgba(255,255,255,0.2);
    color: white;
    font-weight: var(--font-weight-normal);
}

    .payment-info small[b-o5g1m5ixb2] {
        color: white !important;
        font-weight: var(--font-weight-normal);
    }

.status-badge.accepted[b-o5g1m5ixb2] {
    background: #d4edda;
    color: #155724;
    border: 1px solid #c3e6cb;
    display: inline-block;
    padding: 0.25rem 0.75rem;
    border-radius: var(--border-radius);
    font-size: 0.8rem;
    font-weight: var(--font-weight-bold);
    margin-top: 0.5rem;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

/* ===== 8. SMLOUVA TAB ===== */
.contract-preview[b-o5g1m5ixb2] {
    padding: 2rem;
    max-height: 800px;
    overflow-y: auto;
    background: #f8f9fa;
    border: 1px solid #dee2e6;
    border-radius: var(--border-radius);
}

.contract-text[b-o5g1m5ixb2] {
    background: white;
    padding: 2rem;
    border-radius: var(--border-radius);
    border: 1px solid #dee2e6;
    white-space: pre-wrap;
    font-family: 'Courier New', monospace;
    font-size: 0.9rem;
    line-height: 1.6;
    color: #333;
    margin: 0;
    position: relative;
}

.contract-preview.ready-to-sign[b-o5g1m5ixb2] {
    background: rgba(255, 243, 205, 0.3);
    border: 2px solid var(--warning-color);
}

.contract-preview.signed[b-o5g1m5ixb2] {
    background: rgba(212, 237, 218, 0.3);
    border: 2px solid var(--success-color);
}

.contract-status[b-o5g1m5ixb2] {
    background: linear-gradient(135deg, var(--success-color), #20c997);
    color: white;
    padding: 1.5rem 2rem;
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-family: var(--font-family);
}

    .contract-status.ready[b-o5g1m5ixb2] {
        background: linear-gradient(135deg, var(--warning-color), #f39c12);
        color: #333;
    }

.status-indicator[b-o5g1m5ixb2] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    font-size: 1.1rem;
    font-weight: var(--font-weight-bold);
}

    .status-indicator i[b-o5g1m5ixb2] {
        font-size: 1.5rem;
    }

.signature-date[b-o5g1m5ixb2],
.offer-accepted-date[b-o5g1m5ixb2] {
    font-size: 0.9rem;
    opacity: 0.9;
    font-weight: var(--font-weight-normal);
}

.contract-text.signed[b-o5g1m5ixb2]::before {
    content: "✓ PODEPSÁNO";
    position: absolute;
    top: 1rem;
    right: 1rem;
    background: var(--success-color);
    color: white;
    padding: 0.25rem 0.75rem;
    border-radius: var(--border-radius-lg);
    font-size: 0.7rem;
    font-weight: var(--font-weight-bold);
    letter-spacing: 0.5px;
    text-transform: uppercase;
}

.contract-text[b-o5g1m5ixb2]::before {
    content: "📝 PŘIPRAVENO K PODPISU";
    position: absolute;
    top: 1rem;
    right: 1rem;
    background: var(--warning-color);
    color: #333;
    padding: 0.25rem 0.75rem;
    border-radius: var(--border-radius-lg);
    font-size: 0.7rem;
    font-weight: var(--font-weight-bold);
    letter-spacing: 0.5px;
    text-transform: uppercase;
}

.contract-agreement[b-o5g1m5ixb2] {
    padding: 2rem;
    background: #f8f9fa;
    border-top: 1px solid #dee2e6;
}

.form-check[b-o5g1m5ixb2] {
    padding: 1rem;
    background: white;
    border-radius: var(--border-radius);
    border: 2px solid #dee2e6;
    transition: var(--transition);
    font-family: var(--font-family);
}

    .form-check:hover[b-o5g1m5ixb2] {
        background-color: #e9ecef;
    }

    .form-check:has(input:checked)[b-o5g1m5ixb2] {
        border-color: var(--success-color);
        background: #d4edda;
    }

.form-check-input[b-o5g1m5ixb2] {
    width: 1.2rem;
    height: 1.2rem;
    margin-right: 0.75rem;
}

    .form-check-input:checked[b-o5g1m5ixb2] {
        background-color: var(--primary-color);
        border-color: var(--primary-color);
    }

    .form-check-input:focus[b-o5g1m5ixb2] {
        box-shadow: 0 0 0 0.25rem rgba(162, 123, 64, 0.25);
    }

.form-check-label[b-o5g1m5ixb2] {
    font-size: 1rem;
    line-height: 1.5;
    cursor: pointer;
    font-weight: var(--font-weight-normal);
}

.contract-actions[b-o5g1m5ixb2] {
    display: flex;
    gap: 1rem;
    margin-top: 1.5rem;
    flex-wrap: wrap;
}

    .contract-actions .btn[b-o5g1m5ixb2] {
        padding: 0.75rem 1.5rem;
        font-weight: var(--font-weight-bold);
        border-radius: var(--border-radius);
        transition: var(--transition);
        text-transform: uppercase;
        letter-spacing: 1px;
    }

/* Signature Section */
.signature-section[b-o5g1m5ixb2] {
    background: white;
    padding: 2rem;
    border-top: 1px solid #dee2e6;
}

.signature-row[b-o5g1m5ixb2] {
    display: flex;
    justify-content: space-between;
    gap: 3rem;
}

.signature-block[b-o5g1m5ixb2] {
    flex: 1;
    text-align: center;
}

.signature-line[b-o5g1m5ixb2] {
    padding: 1rem;
    border-top: 2px solid #2c3e50;
    margin-bottom: 0.5rem;
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}

.signature-name[b-o5g1m5ixb2] {
    font-weight: var(--font-weight-bold);
    font-size: 1.1rem;
    color: #2c3e50;
    font-family: var(--font-family);
}

.signature-title[b-o5g1m5ixb2] {
    font-size: 0.9rem;
    color: var(--secondary-color);
    font-style: italic;
    font-weight: var(--font-weight-normal);
}

.signature-date-block[b-o5g1m5ixb2] {
    font-size: 0.8rem;
    color: var(--secondary-color);
    margin-top: 0.5rem;
    font-weight: var(--font-weight-normal);
}

/* ===== 9. DOTAZNÍK TAB ===== */
.questionnaire-header[b-o5g1m5ixb2] {
    background: linear-gradient(135deg, var(--primary-color) 0%, var(--primary-dark) 100%);
    color: white;
    padding: 2rem;
    border-radius: var(--border-radius) var(--border-radius) 0 0;
    text-align: center;
}

.questionnaire-form[b-o5g1m5ixb2] {
    background: white;
    padding: 2rem;
    border-radius: 0 0 var(--border-radius) var(--border-radius);
    box-shadow: var(--box-shadow-lg);
    font-family: var(--font-family);
}

.section-title[b-o5g1m5ixb2] {
    color: var(--primary-color);
    font-size: 1.3rem;
    font-weight: var(--font-weight-bold);
    margin: 2rem 0 1rem 0;
    padding-bottom: 0.5rem;
    border-bottom: 2px solid #e9ecef;
    text-transform: uppercase;
    letter-spacing: 1px;
}

.questionnaire-form .form-label[b-o5g1m5ixb2] {
    font-weight: var(--font-weight-normal);
    color: #495057;
    margin-bottom: 0.5rem;
}

.questionnaire-form .form-control[b-o5g1m5ixb2] {
    border: 2px solid #e9ecef;
    border-radius: var(--border-radius);
    padding: 0.75rem;
    transition: var(--transition);
    font-family: var(--font-family);
    background-color: white;
    color: #333;
    font-weight: var(--font-weight-normal);
}

    .questionnaire-form .form-control[b-o5g1m5ixb2]::placeholder {
        color: #adb5bd;
        font-style: italic;
        opacity: 0.8;
        font-weight: var(--font-weight-light);
    }

    /* Předvyplněná pole (readonly nebo s atributem data-prefilled) */
    .questionnaire-form .form-control[readonly][b-o5g1m5ixb2],
    .questionnaire-form .form-control[data-prefilled="true"][b-o5g1m5ixb2] {
        background-color: #fff3cd;
        border-color: var(--warning-color);
        color: #856404;
        font-weight: var(--font-weight-bold);
        font-style: italic;
    }

    /* Uživatelem vyplněná pole */
    .questionnaire-form .form-control:not(:placeholder-shown):not([readonly]):not([data-prefilled="true"])[b-o5g1m5ixb2] {
        background-color: #f8f9fa;
        border-color: var(--primary-color);
        color: #333;
        font-weight: var(--font-weight-bold);
    }

    .questionnaire-form .form-control:focus[b-o5g1m5ixb2],
    .form-check-input:focus[b-o5g1m5ixb2] {
        border-color: var(--primary-color);
        box-shadow: 0 0 0 0.25rem rgba(162, 123, 64, 0.25);
    }

.gdpr-section[b-o5g1m5ixb2] {
    background-color: #f8f9fa;
    padding: 1.5rem;
    border-radius: var(--border-radius);
    border: 1px solid #dee2e6;
    margin-top: 2rem;
}

.questionnaire-completed .alert[b-o5g1m5ixb2] {
    border-radius: var(--border-radius);
    border: none;
    padding: 1.5rem;
    font-size: 1rem;
    font-family: var(--font-family);
}

/* ===== 10. FAKTURA TAB ===== */
.faktura-card[b-o5g1m5ixb2] {
    border: none;
    box-shadow: var(--box-shadow-lg);
    border-radius: var(--border-radius-lg);
    font-family: var(--font-family);
}

    .faktura-card .card-header[b-o5g1m5ixb2] {
        background: linear-gradient(135deg, var(--primary-color), var(--primary-dark));
        color: white;
        border-radius: var(--border-radius-lg) var(--border-radius-lg) 0 0;
    }

.faktura-status .alert[b-o5g1m5ixb2] {
    border: none;
    border-radius: var(--border-radius);
    font-weight: var(--font-weight-normal);
}

.castka-label[b-o5g1m5ixb2] {
    color: var(--secondary-color);
    font-size: 0.9rem;
    margin-bottom: 0.25rem;
    font-weight: var(--font-weight-normal);
}

.castka-hodnota[b-o5g1m5ixb2] {
    font-size: 2rem;
    font-weight: var(--font-weight-bold);
    color: var(--success-color);
}

.payment-value[b-o5g1m5ixb2] {
    background: #f8f9fa;
    padding: 0.25rem 0.5rem;
    border-radius: var(--border-radius);
    font-family: monospace;
    font-weight: var(--font-weight-bold);
}

.payment-value-container[b-o5g1m5ixb2] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.payment-item[b-o5g1m5ixb2] {
    margin-bottom: 1rem;
}

    .payment-item strong[b-o5g1m5ixb2] {
        display: block;
        margin-bottom: 0.25rem;
        color: #495057;
        font-weight: var(--font-weight-bold);
    }

.payment-instructions[b-o5g1m5ixb2] {
    background: #e7f3ff;
    border: 1px solid #b8daff;
    border-radius: var(--border-radius);
    padding: 1.5rem;
}

    .payment-instructions h6[b-o5g1m5ixb2] {
        color: #004085;
        margin-bottom: 1rem;
        font-weight: var(--font-weight-bold);
    }

    .payment-instructions ol[b-o5g1m5ixb2] {
        margin: 0;
        padding-left: 1.5rem;
    }

    .payment-instructions li[b-o5g1m5ixb2] {
        color: #004085;
        margin-bottom: 0.5rem;
        line-height: 1.4;
        font-weight: var(--font-weight-normal);
    }

.faktura-pending[b-o5g1m5ixb2] {
    text-align: center;
    padding: 4rem 2rem;
    color: var(--secondary-color);
    font-family: var(--font-family);
}

    .faktura-pending h4[b-o5g1m5ixb2] {
        color: #856404;
        margin-bottom: 1rem;
        font-weight: var(--font-weight-normal);
    }

/* ===== 11. TLAČÍTKA A AKČNÍ PRVKY ===== */
.action-section[b-o5g1m5ixb2] {
    background: white;
    padding: 3rem;
    border-radius: var(--border-radius-lg);
    box-shadow: var(--box-shadow-lg);
    text-align: center;
    font-family: var(--font-family);
}

.action-header[b-o5g1m5ixb2] {
    margin-bottom: 2rem;
}

    .action-header h4[b-o5g1m5ixb2] {
        color: #333;
        margin-bottom: 0.5rem;
        font-weight: var(--font-weight-normal);
    }

    .action-header p[b-o5g1m5ixb2] {
        color: var(--secondary-color);
        margin: 0;
        font-weight: var(--font-weight-normal);
    }

.action-buttons[b-o5g1m5ixb2] {
    display: flex;
    gap: 1rem;
    justify-content: center;
    flex-wrap: wrap;
    margin-bottom: 1rem;
}

.action-btn[b-o5g1m5ixb2] {
    padding: 1rem 2rem;
    font-size: 1.1rem;
    font-weight: var(--font-weight-bold);
    border-radius: var(--border-radius);
    transition: var(--transition);
    min-width: 250px;
    text-transform: uppercase;
    letter-spacing: 1px;
    cursor: pointer;
}

.accept-btn[b-o5g1m5ixb2] {
    background: linear-gradient(135deg, var(--success-color), #20c997);
    border: none;
    box-shadow: 0 4px 15px rgba(40,167,69,0.4);
    color: white;
}

    .accept-btn:hover:not(:disabled)[b-o5g1m5ixb2] {
        transform: translateY(-2px);
        box-shadow: 0 6px 20px rgba(40,167,69,0.6);
    }

.reject-btn[b-o5g1m5ixb2] {
    background: white;
    color: var(--danger-color);
    border: 2px solid var(--danger-color);
}

    .reject-btn:hover:not(:disabled)[b-o5g1m5ixb2] {
        background: var(--danger-color);
        color: white;
        transform: translateY(-2px);
    }

.action-btn:disabled[b-o5g1m5ixb2],
.btn-success:disabled[b-o5g1m5ixb2] {
    opacity: 0.6;
    cursor: not-allowed;
    transform: none !important;
}

/* ===== 12. SUCCESS SEKCE ===== */
.success-section[b-o5g1m5ixb2] {
    background: linear-gradient(135deg, #d4edda, #c3e6cb);
    padding: 3rem;
    border-radius: var(--border-radius-lg);
    text-align: center;
    box-shadow: var(--box-shadow-lg);
    border: 2px solid var(--success-color);
    animation: successPulse-b-o5g1m5ixb2 0.8s ease-out;
    font-family: var(--font-family);
}

@keyframes successPulse-b-o5g1m5ixb2 {
    0% {
        transform: scale(0.95);
        opacity: 0.8;
    }

    50% {
        transform: scale(1.02);
        opacity: 0.9;
    }

    100% {
        transform: scale(1);
        opacity: 1;
    }
}

.success-content[b-o5g1m5ixb2] {
    max-width: 600px;
    margin: 0 auto;
}

.success-icon[b-o5g1m5ixb2] {
    font-size: 4rem;
    color: var(--success-color);
    margin-bottom: 1rem;
    animation: bounce-b-o5g1m5ixb2 1s ease-out;
}

@keyframes bounce-b-o5g1m5ixb2 {
    0%, 20%, 60%, 100% {
        transform: translateY(0);
    }

    40% {
        transform: translateY(-20px);
    }

    80% {
        transform: translateY(-10px);
    }
}

.success-section h3[b-o5g1m5ixb2] {
    color: #155724;
    margin-bottom: 1rem;
    font-weight: var(--font-weight-light);
    font-size: 2rem;
}

.success-section p[b-o5g1m5ixb2] {
    color: #155724;
    line-height: 1.6;
    margin-bottom: 1rem;
    font-size: 1.1rem;
    font-weight: var(--font-weight-normal);
}

.contact-reminder[b-o5g1m5ixb2] {
    margin-top: 2rem;
    padding-top: 2rem;
    border-top: 1px solid #dee2e6;
    text-align: center;
}

    .contact-reminder h5[b-o5g1m5ixb2] {
        color: #333;
        margin-bottom: 1rem;
        font-weight: var(--font-weight-normal);
    }

.contact-info[b-o5g1m5ixb2] {
    display: flex;
    gap: 1rem;
    justify-content: center;
    flex-wrap: wrap;
}

/* ===== 13. MODAL ÚPRAVY ===== */
.modal-content[b-o5g1m5ixb2] {
    border-radius: var(--border-radius-lg);
    border: none;
    box-shadow: var(--box-shadow-lg);
    font-family: var(--font-family);
}

.modal-header[b-o5g1m5ixb2] {
    border-bottom: 1px solid #f8f9fa;
    padding: 1.5rem 2rem;
}

.modal-body[b-o5g1m5ixb2] {
    padding: 2rem;
    line-height: 1.6;
    font-weight: var(--font-weight-normal);
}

.modal-footer[b-o5g1m5ixb2] {
    border-top: 1px solid #f8f9fa;
    padding: 1.5rem 2rem;
}

/* ===== 14. PROGRESS SEKCE ===== */
.progress-section[b-o5g1m5ixb2] {
    background: white;
    padding: 2rem;
    border-radius: var(--border-radius-lg);
    box-shadow: var(--box-shadow);
    font-family: var(--font-family);
}

/* ===== 15. CUSTOM SCROLLBAR ===== */
.contract-preview[b-o5g1m5ixb2]::-webkit-scrollbar {
    width: 12px;
}

.contract-preview[b-o5g1m5ixb2]::-webkit-scrollbar-track {
    background: #f1f1f1;
    border-radius: 6px;
}

.contract-preview[b-o5g1m5ixb2]::-webkit-scrollbar-thumb {
    background: #c1c1c1;
    border-radius: 6px;
}

    .contract-preview[b-o5g1m5ixb2]::-webkit-scrollbar-thumb:hover {
        background: #a8a8a8;
    }

/* ===== 16. FORMULÁŘOVÉ PRVKY ===== */
.form-control.is-valid[b-o5g1m5ixb2],
.form-select.is-valid[b-o5g1m5ixb2] {
    border-color: var(--success-color);
    box-shadow: 0 0 0 0.25rem rgba(40, 167, 69, 0.15);
}

.form-control.is-invalid[b-o5g1m5ixb2],
.form-select.is-invalid[b-o5g1m5ixb2] {
    border-color: var(--danger-color);
    box-shadow: 0 0 0 0.25rem rgba(220, 53, 69, 0.15);
}

.invalid-feedback[b-o5g1m5ixb2] {
    color: var(--danger-color);
    font-size: 0.875rem;
    margin-top: 0.25rem;
    display: flex;
    align-items: center;
    font-weight: var(--font-weight-normal);
}

    .invalid-feedback[b-o5g1m5ixb2]::before {
        content: "⚠️";
        margin-right: 0.5rem;
    }

.valid-feedback[b-o5g1m5ixb2] {
    color: var(--success-color);
    font-size: 0.875rem;
    margin-top: 0.25rem;
    display: flex;
    align-items: center;
    font-weight: var(--font-weight-normal);
}

.validation-summary[b-o5g1m5ixb2] {
    border-left: 4px solid var(--danger-color);
    margin-bottom: 1.5rem;
    font-family: var(--font-family);
}

    .validation-summary[b-o5g1m5ixb2]::before {
        content: "🚨 ";
        font-size: 1.2rem;
    }

/* ===== 17. ANIMACE A EFEKTY ===== */
@keyframes fadeSlideIn-b-o5g1m5ixb2 {
    from {
        opacity: 0;
        transform: translateY(40px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.container-nacteni[b-o5g1m5ixb2] {
    opacity: 0;
    transform: translateY(40px);
    animation: fadeSlideIn-b-o5g1m5ixb2 1s ease-out 0.3s forwards;
}

.fade-on-scroll[b-o5g1m5ixb2] {
    opacity: 0;
    transform: translateY(30px);
    transition: all 0.6s ease-out;
}

    .fade-on-scroll.visible[b-o5g1m5ixb2] {
        opacity: 1;
        transform: translateY(0);
    }

.form-success[b-o5g1m5ixb2] {
    animation: successPulse-b-o5g1m5ixb2 0.6s ease-in-out;
}

/* ===== 18. TOAST NOTIFIKACE (SLADĚNO S APP.CSS) ===== */
.custom-success-toast[b-o5g1m5ixb2] {
    background: linear-gradient(135deg, var(--success-color) 0%, #20c997 100%);
    color: white;
    border-radius: var(--border-radius);
    border: none;
    box-shadow: 0 4px 20px rgba(40, 167, 69, 0.3);
    font-family: var(--font-family);
}

.custom-error-toast[b-o5g1m5ixb2] {
    background: linear-gradient(135deg, var(--danger-color) 0%, #c82333 100%);
    color: white;
    border-radius: var(--border-radius);
    border: none;
    box-shadow: 0 4px 20px rgba(220, 53, 69, 0.3);
    font-family: var(--font-family);
}

.custom-info-toast[b-o5g1m5ixb2] {
    background: linear-gradient(135deg, var(--info-color) 0%, #138496 100%);
    color: white;
    border-radius: var(--border-radius);
    border: none;
    box-shadow: 0 4px 20px rgba(23, 162, 184, 0.3);
    font-family: var(--font-family);
}

.custom-warning-toast[b-o5g1m5ixb2] {
    background: linear-gradient(135deg, var(--warning-color) 0%, #e0a800 100%);
    color: #212529;
    border-radius: var(--border-radius);
    border: none;
    box-shadow: 0 4px 20px rgba(255, 193, 7, 0.3);
    font-family: var(--font-family);
}

/* ===== 19. RESPONZIVNÍ DESIGN ===== */
@media (max-width: 992px) {
    .hero-content h1[b-o5g1m5ixb2] {
        font-size: 2.5rem;
    }

    .hero-subtitle[b-o5g1m5ixb2] {
        font-size: 1.1rem;
    }

    .tabs-container[b-o5g1m5ixb2] {
        flex-direction: column;
    }

    .tab-button[b-o5g1m5ixb2] {
        border-bottom: 1px solid #dee2e6;
        padding: 1rem 1.5rem;
    }

        .tab-button.active[b-o5g1m5ixb2] {
            border-bottom: 3px solid var(--primary-color);
        }
}

@media (max-width: 768px) {
    .hero-content h1[b-o5g1m5ixb2] {
        font-size: 2rem;
    }

    .hero-subtitle[b-o5g1m5ixb2] {
        font-size: 1rem;
    }

    .offer-header[b-o5g1m5ixb2],
    .contract-header[b-o5g1m5ixb2],
    .questionnaire-header[b-o5g1m5ixb2],
    .faktura-header[b-o5g1m5ixb2] {
        flex-direction: column;
        text-align: center;
        gap: 1rem;
        padding: 1.5rem;
    }

    .offer-item[b-o5g1m5ixb2] {
        flex-direction: column;
        gap: 1rem;
        padding: 1rem 1.5rem;
    }

    .item-price[b-o5g1m5ixb2] {
        align-self: flex-end;
    }

    .total-row[b-o5g1m5ixb2] {
        flex-direction: column;
        gap: 0.5rem;
        text-align: center;
    }

    .action-buttons[b-o5g1m5ixb2] {
        flex-direction: column;
        align-items: center;
    }

    .action-btn[b-o5g1m5ixb2] {
        min-width: 100%;
        max-width: 300px;
    }

    .contact-info[b-o5g1m5ixb2] {
        flex-direction: column;
        align-items: center;
    }

    .loading-content[b-o5g1m5ixb2],
    .error-content[b-o5g1m5ixb2] {
        margin: 1rem;
        padding: 2rem;
    }

    .signature-row[b-o5g1m5ixb2] {
        flex-direction: column;
        gap: 2rem;
    }

    .contract-actions[b-o5g1m5ixb2] {
        flex-direction: column;
    }

        .contract-actions .btn[b-o5g1m5ixb2] {
            width: 100%;
        }

    .tab-disabled-content[b-o5g1m5ixb2] {
        padding: 3rem 1.5rem;
        margin: 1rem;
        min-height: 300px;
    }

    .questionnaire-form[b-o5g1m5ixb2] {
        padding: 1.5rem;
    }

    .success-section[b-o5g1m5ixb2] {
        padding: 2rem 1rem;
    }

        .success-section h3[b-o5g1m5ixb2] {
            font-size: 1.5rem;
        }

    .action-section[b-o5g1m5ixb2] {
        padding: 2rem 1rem;
    }
}

@media (max-width: 480px) {
    .hero-content[b-o5g1m5ixb2] {
        padding: 0 0.5rem;
    }

        .hero-content h1[b-o5g1m5ixb2] {
            font-size: 1.8rem;
        }

    .hero-badge[b-o5g1m5ixb2] {
        font-size: 0.8rem;
        padding: 0.4rem 0.8rem;
    }

    .countdown-badge[b-o5g1m5ixb2] {
        padding: 0.5rem 1rem;
        font-size: 0.9rem;
    }

    .main-card[b-o5g1m5ixb2] {
        margin: 0 0.5rem 1rem;
    }

    .offer-header[b-o5g1m5ixb2],
    .contract-header[b-o5g1m5ixb2],
    .questionnaire-header[b-o5g1m5ixb2],
    .faktura-header[b-o5g1m5ixb2] {
        padding: 1rem;
    }

    .offer-item[b-o5g1m5ixb2] {
        padding: 1rem;
    }

    .tab-disabled-content[b-o5g1m5ixb2] {
        padding: 2rem 1rem;
        margin: 0.5rem;
    }

    .questionnaire-form[b-o5g1m5ixb2],
    .contract-preview[b-o5g1m5ixb2],
    .contract-agreement[b-o5g1m5ixb2] {
        padding: 1rem;
    }

    .success-section[b-o5g1m5ixb2],
    .action-section[b-o5g1m5ixb2] {
        padding: 1.5rem 1rem;
        margin: 0 0.5rem;
    }

    .modal-header[b-o5g1m5ixb2],
    .modal-body[b-o5g1m5ixb2],
    .modal-footer[b-o5g1m5ixb2] {
        padding: 1rem;
    }
}

/* ===== 20. ACCESSIBILITY ===== */
.tab-button:focus[b-o5g1m5ixb2],
.action-btn:focus[b-o5g1m5ixb2],
.form-check-input:focus[b-o5g1m5ixb2] {
    outline: 2px solid var(--primary-color);
    outline-offset: 2px;
}

.tab-button.disabled:focus[b-o5g1m5ixb2] {
    outline: 2px solid var(--secondary-color);
    outline-offset: 2px;
}

/* ===== 21. PRINT STYLY ===== */
@media print {
    .hero-section[b-o5g1m5ixb2],
    .action-section[b-o5g1m5ixb2],
    .tabs-container[b-o5g1m5ixb2],
    .modal[b-o5g1m5ixb2],
    .modal-backdrop[b-o5g1m5ixb2],
    .contract-actions[b-o5g1m5ixb2],
    .next-step-hint[b-o5g1m5ixb2],
    .tab-disabled-content[b-o5g1m5ixb2] {
        display: none !important;
    }

    .main-card[b-o5g1m5ixb2] {
        box-shadow: none;
        border: 1px solid #ddd;
    }

    .tab-content[b-o5g1m5ixb2] {
        display: block !important;
    }

    .contract-preview.signed[b-o5g1m5ixb2],
    .contract-preview.ready-to-sign[b-o5g1m5ixb2] {
        border: 2px solid #000;
        page-break-inside: avoid;
    }

    .contract-status[b-o5g1m5ixb2],
    .contract-status.ready[b-o5g1m5ixb2] {
        background: #000 !important;
        color: #fff !important;
    }

    .signature-section[b-o5g1m5ixb2] {
        page-break-inside: avoid;
        margin-top: 2rem;
    }

    .success-section[b-o5g1m5ixb2] {
        background: white !important;
        box-shadow: none !important;
        border: 1px solid #ddd !important;
    }

    body[b-o5g1m5ixb2] {
        font-family: var(--font-family);
        font-size: 12pt;
        line-height: 1.4;
    }

    h1[b-o5g1m5ixb2], h2[b-o5g1m5ixb2], h3[b-o5g1m5ixb2], h4[b-o5g1m5ixb2], h5[b-o5g1m5ixb2], h6[b-o5g1m5ixb2] {
        font-family: var(--font-family);
        color: #000;
    }
}
/* ===== 22. KLIENTSKÝ ÚČET TAB - NOVÉ STYLY ===== */

/* === ÚČET VYTVOŘEN - SUCCESS STAV === */
.account-created-content[b-o5g1m5ixb2] {
    background: linear-gradient(135deg, #d4edda, #c3e6cb);
    border: 2px solid var(--success-color);
    border-radius: var(--border-radius-lg);
    padding: 0;
    margin: 2rem;
    overflow: hidden;
    animation: successPulse-b-o5g1m5ixb2 0.8s ease-out;
    font-family: var(--font-family);
}

.account-header[b-o5g1m5ixb2] {
    background: linear-gradient(135deg, var(--primary-color), var(--primary-dark));
    color: white;
    padding: 2rem;
    text-align: center;
    border-radius: var(--border-radius-lg) var(--border-radius-lg) 0 0;
}

    .account-header h3[b-o5g1m5ixb2] {
        margin: 0 0 0.5rem 0;
        font-size: 1.8rem;
        font-weight: var(--font-weight-normal);
    }

.account-subtitle[b-o5g1m5ixb2] {
    margin: 0;
    opacity: 0.9;
    font-size: 1rem;
    font-weight: var(--font-weight-light);
}

.account-success-info[b-o5g1m5ixb2] {
    background: white;
    padding: 2rem;
}

/* === FEATURES GRID === */
.features-grid[b-o5g1m5ixb2] {
    display: grid;
    grid-template-columns: 1fr;
    gap: 1rem;
    margin-top: 1rem;
}

.feature-item[b-o5g1m5ixb2] {
    display: flex;
    align-items: flex-start;
    gap: 1rem;
    padding: 1rem;
    background: #f8f9fa;
    border-radius: var(--border-radius);
    border-left: 4px solid var(--primary-color);
    transition: var(--transition);
}

    .feature-item:hover[b-o5g1m5ixb2] {
        background: #e9ecef;
        transform: translateX(5px);
    }

    .feature-item i[b-o5g1m5ixb2] {
        font-size: 1.5rem;
        margin-top: 0.25rem;
        flex-shrink: 0;
    }

    .feature-item div[b-o5g1m5ixb2] {
        flex: 1;
    }

        .feature-item div strong[b-o5g1m5ixb2] {
            display: block;
            font-weight: var(--font-weight-bold);
            color: #333;
            margin-bottom: 0.25rem;
        }

        .feature-item div span[b-o5g1m5ixb2] {
            font-size: 0.9rem;
            color: var(--secondary-color);
            line-height: 1.4;
            font-weight: var(--font-weight-normal);
        }

/* === LOGIN INFO KARTA === */
.login-info-card[b-o5g1m5ixb2] {
    background: linear-gradient(135deg, #e3f2fd, #bbdefb);
    border: 2px solid #2196f3;
    border-radius: var(--border-radius-lg);
    padding: 1.5rem;
    text-align: center;
    font-family: var(--font-family);
}

    .login-info-card h6[b-o5g1m5ixb2] {
        color: #1565c0;
        margin-bottom: 1rem;
        font-weight: var(--font-weight-bold);
    }

.login-details[b-o5g1m5ixb2] {
    margin-bottom: 1.5rem;
}

.detail-item[b-o5g1m5ixb2] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0.5rem 0;
    border-bottom: 1px solid rgba(33, 150, 243, 0.2);
}

    .detail-item:last-child[b-o5g1m5ixb2] {
        border-bottom: none;
    }

    .detail-item strong[b-o5g1m5ixb2] {
        color: #1565c0;
        font-weight: var(--font-weight-bold);
    }

    .detail-item code[b-o5g1m5ixb2] {
        background: white;
        border: 1px solid #2196f3;
        color: #1565c0;
        padding: 0.25rem 0.5rem;
        border-radius: var(--border-radius);
        font-weight: var(--font-weight-bold);
    }

.login-actions[b-o5g1m5ixb2] {
    margin-top: 1.5rem;
}

    .login-actions .btn[b-o5g1m5ixb2] {
        font-weight: var(--font-weight-bold);
        text-transform: uppercase;
        letter-spacing: 1px;
        box-shadow: 0 4px 15px rgba(0, 123, 255, 0.3);
        transition: var(--transition);
    }

        .login-actions .btn:hover[b-o5g1m5ixb2] {
            transform: translateY(-2px);
            box-shadow: 0 6px 20px rgba(0, 123, 255, 0.4);
        }

/* === TIMELINE KROKŮ === */
.next-steps-info[b-o5g1m5ixb2] {
    background: #f8f9fa;
    border-radius: var(--border-radius);
    padding: 1.5rem;
    margin-top: 2rem;
    border-left: 4px solid var(--info-color);
}

    .next-steps-info h6[b-o5g1m5ixb2] {
        color: var(--info-color);
        margin-bottom: 1rem;
        font-weight: var(--font-weight-bold);
    }

.steps-timeline[b-o5g1m5ixb2] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    position: relative;
    padding: 1rem 0;
}

    .steps-timeline[b-o5g1m5ixb2]::before {
        content: '';
        position: absolute;
        top: 50%;
        left: 0;
        right: 0;
        height: 2px;
        background: linear-gradient(to right, var(--success-color) 25%, #dee2e6 25%);
        z-index: 1;
    }

.step[b-o5g1m5ixb2] {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    background: white;
    padding: 0.5rem;
    border-radius: var(--border-radius);
    position: relative;
    z-index: 2;
    min-width: 120px;
    font-family: var(--font-family);
}

    .step i[b-o5g1m5ixb2] {
        font-size: 1.5rem;
        margin-bottom: 0.5rem;
        padding: 0.5rem;
        border-radius: 50%;
        width: 3rem;
        height: 3rem;
        display: flex;
        align-items: center;
        justify-content: center;
    }

    .step span[b-o5g1m5ixb2] {
        font-size: 0.8rem;
        font-weight: var(--font-weight-normal);
        line-height: 1.2;
    }

    .step.completed i[b-o5g1m5ixb2] {
        background: var(--success-color);
        color: white;
    }

    .step.completed span[b-o5g1m5ixb2] {
        color: var(--success-color);
        font-weight: var(--font-weight-bold);
    }

    .step.next i[b-o5g1m5ixb2] {
        background: var(--warning-color);
        color: #333;
        animation: pulse-soft-b-o5g1m5ixb2 2s infinite;
    }

    .step.next span[b-o5g1m5ixb2] {
        color: #856404;
        font-weight: var(--font-weight-bold);
    }

    .step.future i[b-o5g1m5ixb2] {
        background: #e9ecef;
        color: var(--secondary-color);
    }

    .step.future span[b-o5g1m5ixb2] {
        color: var(--secondary-color);
    }

/* === SUPPORT INFO === */
.support-info[b-o5g1m5ixb2] {
    margin-top: 2rem;
}

    .support-info .alert-heading[b-o5g1m5ixb2] {
        color: var(--info-color);
        font-weight: var(--font-weight-bold);
    }

.contact-methods[b-o5g1m5ixb2] {
    display: flex;
    gap: 0.5rem;
    flex-wrap: wrap;
}

    .contact-methods .btn[b-o5g1m5ixb2] {
        font-size: 0.9rem;
        padding: 0.5rem 1rem;
        border-radius: var(--border-radius);
    }

/* === FORMULÁŘ PRO VYTVOŘENÍ ÚČTU === */
.account-creation-content[b-o5g1m5ixb2] {
    background: white;
    border-radius: var(--border-radius-lg);
    overflow: hidden;
    margin: 2rem;
    box-shadow: var(--box-shadow-lg);
}

.account-form[b-o5g1m5ixb2] {
    padding: 2rem;
    font-family: var(--font-family);
}

    .account-form .form-label[b-o5g1m5ixb2] {
        font-weight: var(--font-weight-normal);
        color: #495057;
        margin-bottom: 0.5rem;
    }

    .account-form .form-control[b-o5g1m5ixb2] {
        border: 2px solid #e9ecef;
        border-radius: var(--border-radius);
        padding: 0.75rem;
        transition: var(--transition);
        font-family: var(--font-family);
        background-color: white;
        color: #333;
        font-weight: var(--font-weight-normal);
    }

        .account-form .form-control[b-o5g1m5ixb2]::placeholder {
            color: #adb5bd;
            font-style: italic;
            opacity: 0.8;
            font-weight: var(--font-weight-light);
        }

        .account-form .form-control[readonly][b-o5g1m5ixb2] {
            background-color: #fff3cd;
            border-color: var(--warning-color);
            color: #856404;
            font-weight: var(--font-weight-bold);
            font-style: italic;
        }

        .account-form .form-control:focus[b-o5g1m5ixb2] {
            border-color: var(--primary-color);
            box-shadow: 0 0 0 0.25rem rgba(162, 123, 64, 0.25);
        }

/* === INDIKÁTOR SÍLY HESLA === */
.password-strength[b-o5g1m5ixb2] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

    .password-strength small[b-o5g1m5ixb2] {
        font-weight: var(--font-weight-bold);
        display: flex;
        align-items: center;
        gap: 0.25rem;
    }

.password-match[b-o5g1m5ixb2] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

    .password-match small[b-o5g1m5ixb2] {
        font-weight: var(--font-weight-bold);
        display: flex;
        align-items: center;
        gap: 0.25rem;
    }

/* === FORM SUBMIT BUTTON === */
.account-form .btn-success[b-o5g1m5ixb2] {
    background: linear-gradient(135deg, var(--success-color), #20c997);
    border: none;
    box-shadow: 0 4px 15px rgba(40, 167, 69, 0.4);
    color: white;
    font-weight: var(--font-weight-bold);
    text-transform: uppercase;
    letter-spacing: 1px;
    padding: 1rem 2rem;
    min-width: 250px;
    transition: var(--transition);
}

    .account-form .btn-success:hover:not(:disabled)[b-o5g1m5ixb2] {
        transform: translateY(-2px);
        box-shadow: 0 6px 20px rgba(40, 167, 69, 0.6);
    }

    .account-form .btn-success:disabled[b-o5g1m5ixb2] {
        opacity: 0.6;
        cursor: not-allowed;
        transform: none !important;
        background: #6c757d;
        box-shadow: none;
    }

/* === FORM CHECK STYLING === */
.account-form .form-check[b-o5g1m5ixb2] {
    padding: 1rem;
    background: #f8f9fa;
    border-radius: var(--border-radius);
    border: 2px solid #dee2e6;
    transition: var(--transition);
}

    .account-form .form-check:hover[b-o5g1m5ixb2] {
        background-color: #e9ecef;
    }

    .account-form .form-check:has(input:checked)[b-o5g1m5ixb2] {
        border-color: var(--success-color);
        background: #d4edda;
    }

.account-form .form-check-input[b-o5g1m5ixb2] {
    width: 1.2rem;
    height: 1.2rem;
    margin-right: 0.75rem;
}

    .account-form .form-check-input:checked[b-o5g1m5ixb2] {
        background-color: var(--primary-color);
        border-color: var(--primary-color);
    }

    .account-form .form-check-input:focus[b-o5g1m5ixb2] {
        box-shadow: 0 0 0 0.25rem rgba(162, 123, 64, 0.25);
    }

.account-form .form-check-label[b-o5g1m5ixb2] {
    font-size: 1rem;
    line-height: 1.5;
    cursor: pointer;
    font-weight: var(--font-weight-normal);
}

    .account-form .form-check-label a[b-o5g1m5ixb2] {
        color: var(--primary-color);
        text-decoration: none;
        font-weight: var(--font-weight-bold);
        transition: var(--transition);
    }

        .account-form .form-check-label a:hover[b-o5g1m5ixb2] {
            color: var(--primary-dark);
            text-decoration: underline;
        }

/* === RESPONZIVNÍ DESIGN PRO ÚČET TAB === */
@media (max-width: 768px) {
    .account-created-content[b-o5g1m5ixb2],
    .account-creation-content[b-o5g1m5ixb2] {
        margin: 1rem 0.5rem;
    }

    .account-header[b-o5g1m5ixb2] {
        padding: 1.5rem 1rem;
    }

        .account-header h3[b-o5g1m5ixb2] {
            font-size: 1.5rem;
        }

    .account-success-info[b-o5g1m5ixb2] {
        padding: 1.5rem 1rem;
    }

    .features-grid[b-o5g1m5ixb2] {
        grid-template-columns: 1fr;
    }

    .feature-item[b-o5g1m5ixb2] {
        flex-direction: column;
        text-align: center;
        gap: 0.5rem;
    }

    .steps-timeline[b-o5g1m5ixb2] {
        flex-direction: column;
        gap: 1rem;
    }

        .steps-timeline[b-o5g1m5ixb2]::before {
            display: none;
        }

    .step[b-o5g1m5ixb2] {
        flex-direction: row;
        justify-content: flex-start;
        text-align: left;
        width: 100%;
        min-width: auto;
    }

        .step i[b-o5g1m5ixb2] {
            margin-right: 1rem;
            margin-bottom: 0;
        }

    .login-info-card[b-o5g1m5ixb2] {
        margin-top: 2rem;
    }

    .contact-methods[b-o5g1m5ixb2] {
        flex-direction: column;
    }

        .contact-methods .btn[b-o5g1m5ixb2] {
            width: 100%;
        }

    .account-form[b-o5g1m5ixb2] {
        padding: 1.5rem 1rem;
    }

        .account-form .btn-success[b-o5g1m5ixb2] {
            width: 100%;
            min-width: auto;
        }
}

@media (max-width: 480px) {
    .account-created-content[b-o5g1m5ixb2],
    .account-creation-content[b-o5g1m5ixb2] {
        margin: 0.5rem;
    }

    .account-header[b-o5g1m5ixb2] {
        padding: 1rem;
    }

        .account-header h3[b-o5g1m5ixb2] {
            font-size: 1.3rem;
        }

    .account-success-info[b-o5g1m5ixb2] {
        padding: 1rem;
    }

    .feature-item[b-o5g1m5ixb2] {
        padding: 0.75rem;
    }

    .login-info-card[b-o5g1m5ixb2] {
        padding: 1rem;
    }

    .detail-item[b-o5g1m5ixb2] {
        flex-direction: column;
        align-items: flex-start;
        gap: 0.25rem;
    }

    .account-form[b-o5g1m5ixb2] {
        padding: 1rem;
    }

    .next-steps-info[b-o5g1m5ixb2] {
        padding: 1rem;
        margin-top: 1rem;
    }

    .support-info .alert[b-o5g1m5ixb2] {
        padding: 1rem;
    }
}

/* === ACCESSIBILITY VYLEPŠENÍ === */
.account-form .form-control:focus[b-o5g1m5ixb2],
.account-form .form-check-input:focus[b-o5g1m5ixb2] {
    outline: 2px solid var(--primary-color);
    outline-offset: 2px;
}

.feature-item:focus-within[b-o5g1m5ixb2] {
    outline: 2px solid var(--primary-color);
    outline-offset: 2px;
}

/* === ANIMACE PRO REAL-TIME FEEDBACK === */
.password-strength[b-o5g1m5ixb2],
.password-match[b-o5g1m5ixb2] {
    animation: fadeSlideIn-b-o5g1m5ixb2 0.3s ease-out;
}

.form-check:has(input:checked)[b-o5g1m5ixb2] {
    animation: successPulse-b-o5g1m5ixb2 0.4s ease-out;
}

/* === PRINT STYLY PRO ÚČET TAB === */
@media print {
    .account-created-content[b-o5g1m5ixb2],
    .account-creation-content[b-o5g1m5ixb2] {
        background: white !important;
        border: 1px solid #ddd !important;
        box-shadow: none !important;
        margin: 0 !important;
        page-break-inside: avoid;
    }

    .account-header[b-o5g1m5ixb2] {
        background: #f8f9fa !important;
        color: #333 !important;
    }

    .login-info-card[b-o5g1m5ixb2] {
        background: white !important;
        border: 1px solid #ddd !important;
    }

    .feature-item[b-o5g1m5ixb2] {
        background: white !important;
        border: 1px solid #ddd !important;
        page-break-inside: avoid;
    }

    .support-info[b-o5g1m5ixb2],
    .login-actions[b-o5g1m5ixb2],
    .contact-methods[b-o5g1m5ixb2] {
        display: none !important;
    }

    .steps-timeline[b-o5g1m5ixb2]::before {
        background: #000 !important;
    }

    .step.completed i[b-o5g1m5ixb2] {
        background: #000 !important;
        color: white !important;
    }
}

/* === COMPLETION SUMMARY - SHRNUTÍ DOKONČENÉHO PROCESU === */
.completion-summary[b-o5g1m5ixb2] {
    background: linear-gradient(135deg, #d4edda, #c3e6cb);
    border: 2px solid var(--success-color);
    border-radius: var(--border-radius-lg);
    padding: 2rem;
    margin-top: 2rem;
    font-family: var(--font-family);
}

    .completion-summary h6[b-o5g1m5ixb2] {
        color: #155724;
        margin-bottom: 1.5rem;
        font-weight: var(--font-weight-bold);
        font-size: 1.2rem;
        text-align: center;
    }

.summary-content p[b-o5g1m5ixb2] {
    color: #155724;
    font-weight: var(--font-weight-bold);
    margin-bottom: 1rem;
}

.completed-list[b-o5g1m5ixb2] {
    list-style: none;
    padding: 0;
    margin-bottom: 1.5rem;
}

    .completed-list li[b-o5g1m5ixb2] {
        padding: 0.75rem 0;
        color: #155724;
        font-weight: var(--font-weight-normal);
        display: flex;
        align-items: center;
        border-bottom: 1px solid rgba(21, 87, 36, 0.2);
        transition: var(--transition);
    }

        .completed-list li:last-child[b-o5g1m5ixb2] {
            border-bottom: none;
        }

        .completed-list li:hover[b-o5g1m5ixb2] {
            background: rgba(21, 87, 36, 0.1);
            padding-left: 0.5rem;
            border-radius: var(--border-radius);
        }

.next-payment-info[b-o5g1m5ixb2] {
    margin: 1.5rem 0;
}

    .next-payment-info .alert[b-o5g1m5ixb2] {
        border: none;
        border-radius: var(--border-radius);
        background: linear-gradient(135deg, #cce5ff, #b3d9ff);
        border-left: 4px solid var(--info-color);
        font-family: var(--font-family);
    }

        .next-payment-info .alert strong[b-o5g1m5ixb2] {
            color: #004085;
        }

.client-zone-info[b-o5g1m5ixb2] {
    margin: 1.5rem 0;
}

    .client-zone-info .alert[b-o5g1m5ixb2] {
        border: none;
        border-radius: var(--border-radius);
        background: linear-gradient(135deg, rgba(162, 123, 64, 0.1), rgba(184, 149, 96, 0.1));
        border-left: 4px solid var(--primary-color);
    }

    .client-zone-info .alert-heading[b-o5g1m5ixb2] {
        color: var(--primary-color);
        font-weight: var(--font-weight-bold);
    }

    .client-zone-info .alert ul[b-o5g1m5ixb2] {
        padding-left: 1.5rem;
        margin-top: 0.75rem;
    }

    .client-zone-info .alert li[b-o5g1m5ixb2] {
        color: #333;
        margin-bottom: 0.5rem;
        line-height: 1.4;
        font-weight: var(--font-weight-normal);
    }

        .client-zone-info .alert li strong[b-o5g1m5ixb2] {
            color: var(--primary-color);
            font-weight: var(--font-weight-bold);
        }

/* === THANK YOU SECTION - PODĚKOVÁNÍ === */
.thank-you-section[b-o5g1m5ixb2] {
    background: linear-gradient(135deg, #fff3cd, #ffeaa7);
    border: 2px solid #f39c12;
    border-radius: var(--border-radius-lg);
    padding: 2rem;
    margin-top: 2rem;
    text-align: center;
    font-family: var(--font-family);
    animation: gratitudePulse-b-o5g1m5ixb2 0.8s ease-out;
}

@keyframes gratitudePulse-b-o5g1m5ixb2 {
    0% {
        transform: scale(0.98);
        opacity: 0.8;
    }

    50% {
        transform: scale(1.01);
        opacity: 0.95;
    }

    100% {
        transform: scale(1);
        opacity: 1;
    }
}

.gratitude-message[b-o5g1m5ixb2] {
    font-size: 1.5rem;
    color: #856404;
    margin-bottom: 1rem;
    font-weight: var(--font-weight-bold);
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    animation: heartBeat-b-o5g1m5ixb2 2s infinite;
}

@keyframes heartBeat-b-o5g1m5ixb2 {
    0%, 100% {
        transform: scale(1);
    }

    50% {
        transform: scale(1.05);
    }
}

.gratitude-text[b-o5g1m5ixb2] {
    color: #856404;
    font-size: 1.1rem;
    line-height: 1.6;
    margin: 0;
    font-weight: var(--font-weight-normal);
    max-width: 600px;
    margin: 0 auto;
}

/* === VYLEPŠENÍ HLAVNÍHO CTA TLAČÍTKA === */
.login-actions .btn-primary[b-o5g1m5ixb2] {
    background: linear-gradient(135deg, var(--primary-color), var(--primary-dark));
    border: none;
    box-shadow: 0 6px 20px rgba(162, 123, 64, 0.4);
    color: white;
    font-weight: var(--font-weight-bold);
    text-transform: uppercase;
    letter-spacing: 1px;
    padding: 1.25rem 2.5rem;
    font-size: 1.1rem;
    border-radius: var(--border-radius-lg);
    transition: var(--transition);
    position: relative;
    overflow: hidden;
}

    .login-actions .btn-primary[b-o5g1m5ixb2]::before {
        content: '';
        position: absolute;
        top: 0;
        left: -100%;
        width: 100%;
        height: 100%;
        background: linear-gradient(90deg, transparent, rgba(255,255,255,0.3), transparent);
        transition: left 0.6s ease;
    }

    .login-actions .btn-primary:hover[b-o5g1m5ixb2]::before {
        left: 100%;
    }

    .login-actions .btn-primary:hover[b-o5g1m5ixb2] {
        transform: translateY(-3px);
        box-shadow: 0 8px 25px rgba(162, 123, 64, 0.6);
        background: linear-gradient(135deg, var(--primary-dark), var(--primary-color));
    }

    .login-actions .btn-primary:active[b-o5g1m5ixb2] {
        transform: translateY(-1px);
    }

/* Přidejte tyto styly do VerejnaNabidka.razor.css */

/* === FAKTURY CONTAINER === */
.faktury-container[b-o5g1m5ixb2] {
    padding: 0;
}

.faktury-header[b-o5g1m5ixb2] {
    background: linear-gradient(135deg, var(--primary-color), var(--primary-dark));
    color: white;
    padding: 2rem;
    text-align: center;
}

    .faktury-header h3[b-o5g1m5ixb2] {
        margin: 0 0 0.5rem 0;
        font-weight: var(--font-weight-normal);
        font-size: 1.8rem;
    }

    .faktury-header p[b-o5g1m5ixb2] {
        margin: 0;
        opacity: 0.9;
    }

/* === FAKTURY TABS === */
.faktury-tabs[b-o5g1m5ixb2] {
    padding: 1rem 2rem;
    background: #f8f9fa;
    border-bottom: 2px solid #dee2e6;
}

    .faktury-tabs .nav-pills[b-o5g1m5ixb2] {
        gap: 0.5rem;
        flex-wrap: wrap;
    }

    .faktury-tabs .nav-link[b-o5g1m5ixb2] {
        background: white;
        color: var(--secondary-color);
        border: 2px solid #dee2e6;
        border-radius: var(--border-radius);
        padding: 0.75rem 1.25rem;
        font-weight: var(--font-weight-normal);
        transition: var(--transition);
        display: flex;
        align-items: center;
        gap: 0.5rem;
    }

        .faktury-tabs .nav-link:hover[b-o5g1m5ixb2] {
            background: #f8f9fa;
            border-color: var(--primary-color);
            color: var(--primary-color);
        }

        .faktury-tabs .nav-link.active[b-o5g1m5ixb2] {
            background: var(--primary-color);
            color: white;
            border-color: var(--primary-color);
            font-weight: var(--font-weight-bold);
        }

        .faktury-tabs .nav-link .badge[b-o5g1m5ixb2] {
            font-size: 0.7rem;
            padding: 0.2rem 0.4rem;
        }

/* === FAKTURY SUMMARY === */
.faktury-summary[b-o5g1m5ixb2] {
    background: white;
    padding: 2rem;
    border-radius: var(--border-radius-lg);
    box-shadow: var(--box-shadow);
}

    .faktury-summary h5[b-o5g1m5ixb2] {
        color: var(--primary-color);
        margin-bottom: 1.5rem;
        font-weight: var(--font-weight-bold);
        text-transform: uppercase;
        letter-spacing: 1px;
        font-size: 1.1rem;
    }

    .faktury-summary table[b-o5g1m5ixb2] {
        margin-bottom: 0;
    }

    .faktury-summary .table-active[b-o5g1m5ixb2] {
        background: rgba(162, 123, 64, 0.1);
        font-weight: var(--font-weight-bold);
    }

    .faktury-summary tfoot[b-o5g1m5ixb2] {
        font-size: 1.1rem;
    }

/* === TYP FAKTURY SPECIFIC STYLES === */
.faktura-card.faktura-rezervacni .card-header[b-o5g1m5ixb2] {
    background: linear-gradient(135deg, #007bff, #0056b3);
}

.faktura-card.faktura-predsvatebni .card-header[b-o5g1m5ixb2] {
    background: linear-gradient(135deg, #17a2b8, #138496);
}

.faktura-card.faktura-doplatek .card-header[b-o5g1m5ixb2] {
    background: linear-gradient(135deg, #ffc107, #e0a800);
    color: #333;
}

.faktura-card.faktura-finalni .card-header[b-o5g1m5ixb2] {
    background: linear-gradient(135deg, #28a745, #1e7e34);
}

/* === PAYMENT STATUS INDICATORS === */
.payment-status-grid[b-o5g1m5ixb2] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: 1rem;
    margin-bottom: 2rem;
}

.payment-status-card[b-o5g1m5ixb2] {
    background: white;
    border: 2px solid #dee2e6;
    border-radius: var(--border-radius);
    padding: 1rem;
    text-align: center;
    transition: var(--transition);
}

    .payment-status-card:hover[b-o5g1m5ixb2] {
        transform: translateY(-2px);
        box-shadow: var(--box-shadow);
    }

    .payment-status-card.paid[b-o5g1m5ixb2] {
        border-color: var(--success-color);
        background: rgba(40, 167, 69, 0.05);
    }

    .payment-status-card.pending[b-o5g1m5ixb2] {
        border-color: var(--warning-color);
        background: rgba(255, 193, 7, 0.05);
    }

    .payment-status-card.overdue[b-o5g1m5ixb2] {
        border-color: var(--danger-color);
        background: rgba(220, 53, 69, 0.05);
    }

    .payment-status-card .status-icon[b-o5g1m5ixb2] {
        font-size: 2rem;
        margin-bottom: 0.5rem;
    }

    .payment-status-card .status-amount[b-o5g1m5ixb2] {
        font-size: 1.5rem;
        font-weight: var(--font-weight-bold);
        margin-bottom: 0.25rem;
    }

    .payment-status-card .status-label[b-o5g1m5ixb2] {
        font-size: 0.9rem;
        color: var(--secondary-color);
    }

/* === RESPONSIVE === */
@media (max-width: 768px) {
    .faktury-header[b-o5g1m5ixb2] {
        padding: 1.5rem 1rem;
    }

        .faktury-header h3[b-o5g1m5ixb2] {
            font-size: 1.5rem;
        }

    .faktury-tabs[b-o5g1m5ixb2] {
        padding: 1rem;
    }

        .faktury-tabs .nav-pills[b-o5g1m5ixb2] {
            flex-direction: column;
        }

        .faktury-tabs .nav-link[b-o5g1m5ixb2] {
            width: 100%;
            justify-content: center;
        }

    .faktury-summary[b-o5g1m5ixb2] {
        padding: 1rem;
    }

        .faktury-summary .table[b-o5g1m5ixb2] {
            font-size: 0.875rem;
        }
}

@media (max-width: 480px) {
    .faktury-header[b-o5g1m5ixb2] {
        padding: 1rem;
    }

        .faktury-header h3[b-o5g1m5ixb2] {
            font-size: 1.3rem;
        }

    .faktury-tabs .nav-link[b-o5g1m5ixb2] {
        padding: 0.5rem 1rem;
        font-size: 0.9rem;
    }

    .faktury-summary h5[b-o5g1m5ixb2] {
        font-size: 1rem;
    }
}
