@import '_content/Blazor.Bootstrap/Blazor.Bootstrap.olwso25aue.bundle.scp.css';

/* _content/JointLib/Components/Layout/MainLayout.razor.rz.scp.css */
/* ===== PAGE LAYOUT ===== */
.page[b-2uq4rciekv] {
    display: flex;
    /* COLOANĂ e starea de bază (mobil): meniul stă DEASUPRA conținutului.
       Media query-ul de la 641px comută pe „row" pentru desktop.

       Lipsea, iar `row` fiind valoarea implicită a unui flex container, meniul de
       260px rămânea alături de conținut la orice lățime — pe un ecran de 375px
       lăsa <main> cu 115px. Layoutul de mobil nu fusese niciodată aplicat efectiv. */
    flex-direction: column;
    min-height: 100vh;
}

/* Sub prag, bara laterală e o bandă pe toată lățimea, nu o coloană cât ecranul. */
@media (max-width: 640.98px) {
    .sidebar[b-2uq4rciekv] {
        width: 100%;
        min-height: 0;
        height: auto;
    }
}

/* ===== MAIN CONTENT AREA ===== */
main[b-2uq4rciekv] {
    flex: 1;
    background-color: var(--bs-secondary-bg); /* EXACT dashboard gray */
    padding: 0;
    display: flex;            /* column layout so the footer can pin to the bottom */
    flex-direction: column;
}

    /* Optional: smoother look */
    main > div[b-2uq4rciekv] {
        border-radius: 0;
    }

/* Content grows to fill the space, pushing the footer to the bottom
   (sticky-footer pattern). flex-shrink:0 keeps tall pages from squishing. */
.content[b-2uq4rciekv] {
    flex: 1 0 auto;
}

/* ===== SITE FOOTER ===== */
.app-footer[b-2uq4rciekv] {
    flex: 0 0 auto;
    text-align: center;
    padding: 0.8rem 1rem;
    font-size: 0.85rem;
    color: var(--bs-secondary-color);
    border-top: 1px solid var(--bs-border-color);
}

.app-footer a[b-2uq4rciekv] {
    color: var(--bs-secondary-color);
    text-decoration: none;
}

.app-footer a:hover[b-2uq4rciekv] {
    color: var(--bs-primary);
    text-decoration: underline;
}

.footer-sep[b-2uq4rciekv] {
    margin: 0 0.5rem;
    opacity: 0.5;
}

.sidebar[b-2uq4rciekv] {
    background-image: linear-gradient(180deg, rgb(5, 39, 103) 0%, #3a0647 70%);
}

.top-row[b-2uq4rciekv] {
    background-color: var(--bs-body-bg);
    border-bottom: 1px solid var(--bs-border-color);
    justify-content: flex-end;
    height: 3.5rem;
    /* În coloana flex <main>, .top-row e singurul copil comprimabil
       (.content e flex:1 0 auto, footer flex:0 0 auto). Fără flex-shrink:0
       bara se micșora sub 3.5rem când conținutul devenea înalt (ex. după
       „Calculează" pe /fundatii/presiuni-winkler). flex-shrink:0 o fixează. */
    flex-shrink: 0;
    display: flex;
    align-items: center;
    gap: 0.25rem;
}

/* Wrapper pushes theme switcher + auth to the right */
.sidebar-toggle-wrap[b-2uq4rciekv] {
    margin-right: auto;
    display: flex;
    align-items: center;
}

    .top-row[b-2uq4rciekv]  a, .top-row[b-2uq4rciekv]  .btn-link {
        white-space: nowrap;
        text-decoration: none;
    }

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

    /* NB: spacing/orientation for the right-side action cluster (.topbar-actions)
       lives in app.css, not here — scoped CSS was unreliable while cached. */

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

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

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

    .sidebar[b-2uq4rciekv] {
        width: auto;
        height: 100vh;
        position: sticky;
        top: 0;
    }

    .top-row[b-2uq4rciekv] {
        position: sticky;
        top: 0;
        /* Peste conținutul paginii (ex. butonul Salvează Draft din /create, z-index:10),
           dar sub modale (1040+). Altfel conținutul iese peste bară la scroll. */
        z-index: 100;
    }

    .top-row.auth[b-2uq4rciekv]  a:first-child {
        flex: 1;
        text-align: right;
        width: 0;
    }


}

#blazor-error-ui[b-2uq4rciekv] {
    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-2uq4rciekv] {
        cursor: pointer;
        position: absolute;
        right: 0.75rem;
        top: 0.5rem;
    }

/* ===== OVERRIDES TO JOIN SIDEBAR + TOP BAR ===== */

/* Remove spacing */
.page[b-2uq4rciekv] {
    margin: 0;
}

/* Kill template padding */
.top-row[b-2uq4rciekv] {
    padding-left: 0 !important;
    margin-left: 0;
}

/* Align top bar with sidebar */
@media (min-width: 641px) {
    main[b-2uq4rciekv] {
        padding-left: 0;
    }

    .top-row[b-2uq4rciekv] {
        padding-right: 1rem;
    }
}


/* _content/JointLib/Components/Layout/NavMenu.razor.rz.scp.css */
/* ===== SIDEBAR ===== */
/* NB: „.sidebar” apare în DOUĂ locuri — div-ul din MainLayout și cel de aici, imbricat.
   Regulile de mobil trebuie puse în ambele fișiere scoped: fiecare își vede doar
   propriul element, iar un selector global din app.css ar avea specificitate mai mică
   decât selectorul scoped (`.sidebar[b-xxx]`) și ar pierde. */
.sidebar[b-fp5xlv4drk] {
    width: 260px;
    min-height: 100vh;
    background-color: var(--bs-body-bg);
    border-right: 1px solid var(--bs-border-color);
    transition: width 0.25s ease;
    overflow: hidden;
}

/* ===== TOP ROW ===== */
.top-row[b-fp5xlv4drk] {
    height: 56px;
    background-color: var(--bs-body-bg);
    border-bottom: 1px solid var(--bs-border-color);
    display: flex;
    align-items: center;
}

/* ===== BRAND ALIGNMENT (sidebar extins) =====
   Aliniază centrul stelei-logo cu axa verticală a iconițelor din nav
   (casă, profil metalic etc.). Iconițele stau la ~40px de marginea sidebar-ului
   (nav-item px-3 = 16px + nav-link padding 16px + jumătate icon). Steaua are 26px,
   deci marginea ei stângă trebuie la ~27px ca centrul să cadă pe aceeași axă.
   Anulăm padding-ul implicit al Bootstrap .navbar (--bs-navbar-padding-x) care
   împingea steaua prea la dreapta. Starea colapsată e gestionată în app.css. */
.top-row.navbar[b-fp5xlv4drk] { padding-left: 0 !important; } /* !important: bundle-ul scoped stă sub Bootstrap în cascadă */
.navbar-brand[b-fp5xlv4drk]   { padding-left: 27px; }


/* ===== BASE NAV LINK (LEVEL 1) ===== */
.nav-link[b-fp5xlv4drk] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 0.6rem 1rem;
    font-size: 0.95rem;
    font-weight: 500;
    color: var(--bs-body-color);
    border-radius: 8px;
    text-decoration: none;
    cursor: pointer;
    transition: background-color 0.2s ease, color 0.2s ease;
    white-space: nowrap;
}

    .nav-link:hover[b-fp5xlv4drk] {
        background-color: var(--bs-primary-bg-subtle);
        color: var(--bs-primary) !important;
    }

    .nav-link.active[b-fp5xlv4drk] {
        background-color: var(--bs-primary-bg-subtle);
        color: var(--bs-primary);
    }

    /* ===== ICONS ===== */
    .nav-link i.bi[b-fp5xlv4drk],
    .nav-link span.bi[b-fp5xlv4drk] {
        font-size: 1.05rem;
        color: var(--bs-secondary-color);
        flex-shrink: 0;
    }

    .nav-link.active i.bi[b-fp5xlv4drk],
    .nav-link.active span.bi[b-fp5xlv4drk] {
        color: var(--bs-primary);
    }

/* ===== LEVEL 2 ===== */
.sidebar .collapse > .nav-link[b-fp5xlv4drk] {
    font-size: 0.9rem;
    padding: 0.5rem 1rem;
    margin: 0.2rem 0;
    border-radius: 6px;
}

    .sidebar .collapse > .nav-link.active[b-fp5xlv4drk] {
        background-color: var(--bs-primary-bg-subtle);
        color: var(--bs-primary);
    }


/* ===== LEVEL 3 ===== */
.sidebar .collapse .collapse > .nav-link[b-fp5xlv4drk] {
    font-size: 0.85rem;
    padding: 0.4rem 1rem;
    margin: 0.10rem 0;
    border-radius: 6px;
    color: var(--bs-secondary-color);
}

    .sidebar .collapse .collapse > .nav-link:hover[b-fp5xlv4drk] {
        background-color: var(--bs-primary-bg-subtle);
        color: var(--bs-primary);
    }

    .sidebar .collapse .collapse > .nav-link.active[b-fp5xlv4drk] {
        background-color: var(--bs-primary-bg-subtle);
        color: var(--bs-primary);
    }

/* ===== LONG LABELS WRAP (no clipping) ===== */
/* Sub-menu links wrap onto a second line instead of being cut off by the
   sidebar's overflow:hidden (ex: "Incovoiere-Compresiune"). The leading icon
   stays pinned to the first text line. */
.sidebar .collapse .nav-link[b-fp5xlv4drk] {
    white-space: normal;
    align-items: flex-start;
    line-height: 1.25;
}

    .sidebar .collapse .nav-link .bi:first-child[b-fp5xlv4drk] {
        margin-top: 1px;
    }

/* ===== INDENTATION ===== */
.sidebar .collapse[b-fp5xlv4drk] {
    margin-left: 0.75rem;
    padding-left: 0.75rem;
    border-left: 1px dashed var(--bs-border-color);
}

    .sidebar .collapse .collapse[b-fp5xlv4drk] {
        margin-left: 0.75rem;
        padding-left: 0.75rem;
        border-left: 1px dotted var(--bs-border-color);
    }

        .sidebar .collapse .collapse > .nav-link[b-fp5xlv4drk]::before {
            content: none;
        }

.nav-link.active:hover[b-fp5xlv4drk] {
    background-color: var(--bs-primary-bg-subtle);
    color: var(--bs-primary);
}

/* ===== COLLAPSE ARROW ===== */
.collapse-arrow[b-fp5xlv4drk] {
    transition: transform 0.2s ease-in-out;
}

.nav-link:not(.collapsed) .collapse-arrow[b-fp5xlv4drk] {
    transform: rotate(180deg);
}

/* ===== INTERNAL SIDEBAR SCROLL (desktop) ===== */
/* Pin the sidebar to one viewport tall and let the nav list scroll inside it,
   so expanding menus gives the sidebar its own scrollbar instead of adding one
   to the whole page. The brand row stays fixed; only .nav-scrollable scrolls. */
@media (min-width: 641px) {
    .sidebar[b-fp5xlv4drk] {
        height: 100vh;
        display: flex;
        flex-direction: column;
    }

    .top-row[b-fp5xlv4drk] {
        flex: 0 0 auto;
    }

    .nav-scrollable[b-fp5xlv4drk] {
        flex: 1 1 auto;
        min-height: 0;       /* let the flex child shrink so it can scroll */
        overflow-y: auto;
        overflow-x: hidden;
    }
}

/* ===== MOBIL (sub 641px) =====
   Bara devine o bandă pe toată lățimea, cu doar rândul de brand vizibil. Lista de
   navigare e ascunsă implicit și se deschide din butonul din bara de sus — altfel
   ar împinge conținutul paginii cu câteva ecrane mai jos.
   Regula care o REDESCHIDE (`html.sidebar-open`) stă în app.css: CSS-ul scoped nu
   poate ținti <html>. */
@media (max-width: 640.98px) {
    .sidebar[b-fp5xlv4drk] {
        width: 100%;
        min-height: 0;
        height: auto;
    }

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

/* _content/JointLib/Components/Layout/SidebarToggle.razor.rz.scp.css */
.sidebar-toggle-btn[b-kbftv60tax] {
    background: none;
    border: none;
    cursor: pointer;
    padding: 0.4rem 0.6rem;
    color: var(--bs-body-color);
    border-radius: 6px;
    font-size: 1.4rem;
    display: flex;
    align-items: center;
    flex-shrink: 0;
    transition: background-color 0.2s ease;
    line-height: 1;
}

.sidebar-toggle-btn:hover[b-kbftv60tax] {
    background-color: var(--bs-secondary-bg);
}
/* _content/JointLib/Components/Pages/Beton/SectionAnalysis.razor.rz.scp.css */
/* Styles are defined inline in SectionAnalysis.razor to match the beam page pattern. */
/* _content/JointLib/Components/Pages/Company/CompanyPublicPage.razor.rz.scp.css */
/* Pagina publică a firmei — aceeași limbă vizuală cu profilul de persoană
   (UserProfile.razor.css): copertă + card mare care înglobează tot. */

.cpp-page[b-ftgcwd7k6p] {
    --cpp-accent: #6d6df2;
    --cpp-accent-light: #a5a5f8;
    margin-top: -1.1rem; /* anulează padding-top din .content global */
}

.cpp-shell[b-ftgcwd7k6p] {
    border-radius: 18px;
    border: 1px solid var(--bs-border-color);
    background: color-mix(in srgb, var(--cpp-accent) 5%, var(--bs-body-bg));
    box-shadow: 0 10px 30px -12px rgba(15, 23, 42, .35);
    overflow: hidden;
}

/* ── Copertă ─────────────────────────────────────────── */
.cpp-cover[b-ftgcwd7k6p] {
    height: 200px;
    background: linear-gradient(135deg, #1e1b4b 0%, #4338ca 52%, #6d6df2 100%);
    position: relative;
    overflow: hidden;
}

.cpp-cover[b-ftgcwd7k6p]::before,
.cpp-cover[b-ftgcwd7k6p]::after {
    content: "";
    position: absolute;
    border-radius: 50%;
    border: 2px solid rgba(255, 255, 255, 0.14);
    pointer-events: none;
}

.cpp-cover[b-ftgcwd7k6p]::before { width: 280px; height: 280px; top: -130px; right: 6%; }
.cpp-cover[b-ftgcwd7k6p]::after {
    width: 150px; height: 150px; bottom: -80px; right: 20%;
    background: radial-gradient(circle, rgba(255, 255, 255, .10), transparent 70%);
    border: none;
}

/* ── Antet ───────────────────────────────────────────── */
.cpp-hero[b-ftgcwd7k6p] {
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    gap: 20px;
    flex-wrap: wrap;
    padding: 0 28px 42px;
}

.cpp-hero-id[b-ftgcwd7k6p] {
    display: flex;
    align-items: flex-end;
    gap: 18px;
    min-width: 0;
}

.cpp-logo-wrap[b-ftgcwd7k6p] {
    margin-top: -56px;
    flex-shrink: 0;
    position: relative;
}

.cpp-logo[b-ftgcwd7k6p] {
    width: 112px;
    height: 112px;
    border-radius: 22px;
    border: 4px solid var(--bs-body-bg);
    object-fit: contain;
    background: var(--bs-body-bg);
    box-shadow: 0 0 0 2px var(--cpp-accent-light), 0 8px 18px -6px rgba(67, 56, 202, .55);
}

.cpp-logo-fallback[b-ftgcwd7k6p] {
    display: flex;
    align-items: center;
    justify-content: center;
    background: linear-gradient(135deg, #312e81, #6d6df2);
    color: #fff;
    font-size: 2rem;
    font-weight: 700;
}

.cpp-hero-meta[b-ftgcwd7k6p] { padding-bottom: 4px; min-width: 0; }
.cpp-name[b-ftgcwd7k6p] { font-size: 1.5rem; font-weight: 700; line-height: 1.15; margin: 0; }
.cpp-handle[b-ftgcwd7k6p] { font-size: .8rem; color: var(--bs-secondary-color); margin-top: 2px; }

.cpp-meta-line[b-ftgcwd7k6p] {
    display: flex;
    flex-wrap: wrap;
    gap: 6px 18px;
    margin-top: 8px;
    font-size: 0.8rem;
    color: var(--bs-secondary-color);
}

/* ── Statistici compacte ─────────────────────────────── */
.cpp-stats[b-ftgcwd7k6p] {
    display: flex;
    gap: 8px;
    margin-left: auto;
    padding-bottom: 6px;
}

.cpp-stat[b-ftgcwd7k6p] {
    display: flex;
    flex-direction: column;
    align-items: center;
    min-width: 72px;
    padding: 6px 10px;
    border-radius: 10px;
    background: color-mix(in srgb, var(--cpp-accent) 6%, transparent);
    border: 1px solid var(--bs-border-color);
}

.cpp-stat-icon[b-ftgcwd7k6p] { font-size: .85rem; color: var(--cpp-accent-light); }
.cpp-stat-value[b-ftgcwd7k6p] { font-size: .9rem; font-weight: 700; line-height: 1.2; color: var(--cpp-accent-light); }
.cpp-stat-label[b-ftgcwd7k6p] {
    font-size: .56rem;
    letter-spacing: .3px;
    text-transform: uppercase;
    color: var(--bs-secondary-color);
}

/* ── Corp: două carduri suprapuse peste antet ────────── */
.cpp-body[b-ftgcwd7k6p] {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1.6fr);
    gap: 18px;
    padding: 0 20px 22px;
    margin-top: -30px;
    position: relative;
    z-index: 2;
    align-items: start;
}

.cpp-card[b-ftgcwd7k6p] {
    background: var(--bs-body-bg);
    border: 1px solid var(--bs-border-color);
    border-radius: 14px;
    padding: 18px 18px 20px;
    box-shadow: 0 8px 24px -12px rgba(15, 23, 42, .3);
    min-width: 0;
}

.cpp-card-title[b-ftgcwd7k6p] {
    font-size: .92rem;
    font-weight: 700;
    color: var(--cpp-accent-light);
    margin-bottom: 14px;
    display: flex;
    align-items: center;
}

.cpp-section-title[b-ftgcwd7k6p] {
    font-size: .82rem;
    font-weight: 700;
    color: var(--cpp-accent-light);
    margin-bottom: 12px;
    display: flex;
    align-items: center;
    gap: 8px;
}

.cpp-section-title[b-ftgcwd7k6p]::before {
    content: "";
    width: 3px;
    height: 14px;
    border-radius: 2px;
    background: linear-gradient(var(--cpp-accent-light), var(--cpp-accent));
    flex-shrink: 0;
}

.cpp-info-row[b-ftgcwd7k6p] {
    display: flex;
    justify-content: space-between;
    gap: 8px;
    flex-wrap: wrap;
    font-size: .8rem;
    padding: 5px 0;
    border-bottom: 1px solid var(--bs-border-color);
}

.cpp-info-row:last-of-type[b-ftgcwd7k6p] { border-bottom: none; }

.cpp-info-key[b-ftgcwd7k6p] {
    font-weight: 600;
    color: var(--bs-secondary-color);
    white-space: nowrap;
    flex-shrink: 0;
}

.cpp-info-row > span + span[b-ftgcwd7k6p] {
    min-width: 0;
    text-align: right;
    overflow-wrap: anywhere;
}

/* ── Echipă ──────────────────────────────────────────── */
.cpp-member-list[b-ftgcwd7k6p] { display: flex; flex-direction: column; gap: 8px; }

.cpp-member[b-ftgcwd7k6p] {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 7px 9px;
    border-radius: 10px;
    border: 1px solid var(--bs-border-color);
    text-decoration: none;
    color: inherit;
    min-width: 0;
    transition: border-color .15s ease, background .15s ease;
}

.cpp-member:hover[b-ftgcwd7k6p] {
    color: inherit;
    border-color: var(--cpp-accent);
    background: color-mix(in srgb, var(--cpp-accent) 7%, transparent);
}

.cpp-member-avatar[b-ftgcwd7k6p] {
    width: 34px;
    height: 34px;
    border-radius: 50%;
    object-fit: cover;
    flex-shrink: 0;
}

.cpp-member-initials[b-ftgcwd7k6p] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: .7rem;
    font-weight: 700;
    color: #fff;
    background: linear-gradient(135deg, #312e81, #6d6df2);
}

.cpp-member-info[b-ftgcwd7k6p] { display: flex; flex-direction: column; min-width: 0; }
.cpp-member-name[b-ftgcwd7k6p] {
    font-size: .83rem;
    font-weight: 600;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.cpp-member-title[b-ftgcwd7k6p] {
    font-size: .7rem;
    color: var(--bs-secondary-color);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.cpp-member-role[b-ftgcwd7k6p] {
    margin-left: auto;
    flex-shrink: 0;
    font-size: .62rem;
    text-transform: uppercase;
    letter-spacing: .4px;
    color: var(--bs-secondary-color);
}

/* ── Tool-uri ────────────────────────────────────────── */
.cpp-tool-grid[b-ftgcwd7k6p] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(190px, 1fr));
    gap: 12px;
}

.cpp-tool[b-ftgcwd7k6p] {
    display: block;
    height: 100%;
    border: 1px solid var(--bs-border-color);
    border-radius: 12px;
    padding: 14px;
    text-decoration: none;
    color: inherit;
    min-width: 0;
    transition: transform .15s ease, border-color .15s ease;
}

.cpp-tool:hover[b-ftgcwd7k6p] { transform: translateY(-2px); border-color: var(--cpp-accent); color: inherit; }

.cpp-tool-name[b-ftgcwd7k6p] {
    font-size: .86rem;
    font-weight: 650;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.cpp-tool-meta[b-ftgcwd7k6p] { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 6px; }
.cpp-hashtag[b-ftgcwd7k6p] { font-size: .72rem; color: var(--cpp-accent-light); }
.cpp-tool-author[b-ftgcwd7k6p] { margin-top: 8px; font-size: .68rem; color: var(--bs-secondary-color); }

@media (max-width: 991px) {
    .cpp-body[b-ftgcwd7k6p] { grid-template-columns: 1fr; margin-top: -18px; }
}

@media (max-width: 768px) {
    .cpp-hero[b-ftgcwd7k6p] { flex-direction: column; align-items: center; text-align: center; }
    .cpp-hero-id[b-ftgcwd7k6p] { flex-direction: column; align-items: center; }
    .cpp-meta-line[b-ftgcwd7k6p] { justify-content: center; }
    .cpp-stats[b-ftgcwd7k6p] { margin-left: 0; width: 100%; justify-content: center; }
}
/* _content/JointLib/Components/Pages/ImageDropdown.razor.rz.scp.css */
.image-selector[b-89nz2lbmce] {
    position: relative;
    width: 366px;
}

/* Preview image (acts like dropdown toggle) */
.image-preview[b-89nz2lbmce] {
    width: 366px;
    height: 204px;
    object-fit: cover;
    border-radius: 6px;
    cursor: pointer;
    border: 1px solid #dee2e6;
    transition: box-shadow 0.2s ease, border-color 0.2s ease;
}

    .image-preview:hover[b-89nz2lbmce] {
        border-color: #86b7fe;
        box-shadow: 0 0 0 0.2rem rgba(13,110,253,.25);
    }

/* Dropdown menu */
.image-menu[b-89nz2lbmce] {
    position: absolute;
    top: calc(100% + 6px);
    left: 0;
    width: 100%;
    background: #fff;
    border: 1px solid rgba(0,0,0,.15);
    border-radius: 6px;
    box-shadow: 0 0.5rem 1rem rgba(0,0,0,.175);
    padding: 8px;
    z-index: 1050;
    max-height: 500px;
    overflow-y: auto;
    animation: dropdownFade-b-89nz2lbmce 0.15s ease-out;
}

/* Dropdown item */
.image-item[b-89nz2lbmce] {
    padding: 4px;
    border-radius: 4px;
    cursor: pointer;
    transition: background-color 0.15s ease;
}

    .image-item:hover[b-89nz2lbmce] {
        background-color: #f8f9fa;
    }

    .image-item img[b-89nz2lbmce] {
        width: 100%;
        height: 204px;
        object-fit: cover;
        border-radius: 4px;
    }

/* Animation */
@keyframes dropdownFade-b-89nz2lbmce {
    from {
        opacity: 0;
        transform: translateY(-5px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}
/* _content/JointLib/Components/Pages/Messaging/Messages.razor.rz.scp.css */
/* ── Pagina mesaje (pct. 7) ───────────────────────────── */
/* Fără margin-top negativ: fereastra e centrată vertical în .content prin
   `main:has(.messages-page) > .content` din app.css, deci spațiul se împarte
   simetric sus/jos (înainte era lipită de bara de sus). */
.messages-page[b-48pph1lk6p] {
    width: 100%;
}

.messages-layout[b-48pph1lk6p] {
    display: flex;
    height: calc(100vh - 150px);
    min-height: 420px;
    border: 1px solid var(--bs-border-color);
    border-radius: 14px;
    overflow: hidden;
    background: var(--bs-body-bg);
}

/* ── Lista de conversații ── */
.convo-list[b-48pph1lk6p] {
    width: 320px;
    flex-shrink: 0;
    border-right: 1px solid var(--bs-border-color);
    display: flex;
    flex-direction: column;
    overflow-y: auto;
}

.convo-list-header[b-48pph1lk6p] {
    padding: 16px 18px;
    font-weight: 700;
    font-size: 1.05rem;
    border-bottom: 1px solid var(--bs-border-color);
    position: sticky;
    top: 0;
    background: var(--bs-body-bg);
    z-index: 1;
}

.convo-empty[b-48pph1lk6p] {
    padding: 20px 18px;
    font-size: 0.85rem;
    color: var(--bs-secondary-color);
}

.convo-item[b-48pph1lk6p] {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 12px 16px;
    text-decoration: none;
    color: var(--bs-body-color);
    border-bottom: 1px solid var(--bs-border-color);
    transition: background 0.15s;
}

.convo-item:hover[b-48pph1lk6p] {
    background: var(--bs-tertiary-bg);
}

.convo-item.active[b-48pph1lk6p] {
    background: var(--bs-primary-bg-subtle);
}

.convo-avatar[b-48pph1lk6p] {
    width: 44px;
    height: 44px;
    border-radius: 50%;
    flex-shrink: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    background: linear-gradient(135deg, #4c1d95, #7c3aed);
    color: #fff;
    font-weight: 700;
    font-size: 0.85rem;
    overflow: hidden;
}

.convo-avatar.sm[b-48pph1lk6p] {
    width: 36px;
    height: 36px;
    font-size: 0.75rem;
}

.convo-avatar img[b-48pph1lk6p] {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.convo-meta[b-48pph1lk6p] {
    flex-grow: 1;
    min-width: 0;
}

.convo-name[b-48pph1lk6p] {
    font-weight: 600;
    font-size: 0.9rem;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.convo-last[b-48pph1lk6p] {
    font-size: 0.78rem;
    color: var(--bs-secondary-color);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.convo-unread[b-48pph1lk6p] {
    flex-shrink: 0;
    min-width: 20px;
    height: 20px;
    padding: 0 6px;
    border-radius: 10px;
    background: var(--bs-primary);
    color: #fff;
    font-size: 0.7rem;
    font-weight: 700;
    display: flex;
    align-items: center;
    justify-content: center;
}

/* ── Thread ── */
.convo-thread[b-48pph1lk6p] {
    flex-grow: 1;
    display: flex;
    flex-direction: column;
    min-width: 0;
}

.thread-placeholder[b-48pph1lk6p] {
    margin: auto;
    text-align: center;
    color: var(--bs-secondary-color);
}

.thread-placeholder i[b-48pph1lk6p] {
    font-size: 3rem;
    opacity: 0.5;
}

.thread-placeholder p[b-48pph1lk6p] {
    margin-top: 10px;
}

.thread-header[b-48pph1lk6p] {
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 12px 16px;
    border-bottom: 1px solid var(--bs-border-color);
    flex-shrink: 0;
}

.thread-back[b-48pph1lk6p] {
    color: var(--bs-body-color);
    font-size: 1.1rem;
    text-decoration: none;
    display: none;
}

.thread-header-user[b-48pph1lk6p] {
    display: flex;
    align-items: center;
    gap: 10px;
    text-decoration: none;
    color: var(--bs-body-color);
}

.thread-header-name[b-48pph1lk6p] {
    font-weight: 600;
}

.thread-messages[b-48pph1lk6p] {
    flex-grow: 1;
    overflow-y: auto;
    padding: 18px;
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.thread-empty[b-48pph1lk6p] {
    margin: auto;
    color: var(--bs-secondary-color);
    font-size: 0.85rem;
}

.msg-row[b-48pph1lk6p] {
    display: flex;
    max-width: 75%;
}

.msg-row.mine[b-48pph1lk6p] {
    align-self: flex-end;
    justify-content: flex-end;
}

.msg-row.theirs[b-48pph1lk6p] {
    align-self: flex-start;
}

.msg-bubble[b-48pph1lk6p] {
    padding: 8px 12px;
    border-radius: 14px;
    font-size: 0.88rem;
    line-height: 1.45;
}

.msg-row.theirs .msg-bubble[b-48pph1lk6p] {
    background: var(--bs-tertiary-bg);
    border-bottom-left-radius: 4px;
}

.msg-row.mine .msg-bubble[b-48pph1lk6p] {
    background: var(--bs-primary);
    color: #fff;
    border-bottom-right-radius: 4px;
}

.msg-text[b-48pph1lk6p] {
    white-space: pre-wrap;
    word-break: break-word;
}

.msg-time[b-48pph1lk6p] {
    font-size: 0.65rem;
    opacity: 0.7;
    margin-top: 3px;
    text-align: right;
}

.thread-compose[b-48pph1lk6p] {
    display: flex;
    gap: 8px;
    padding: 12px 16px;
    border-top: 1px solid var(--bs-border-color);
    flex-shrink: 0;
}

/* ── Responsive: un singur panou pe mobil ── */
@media (max-width: 767.98px) {
    .convo-list[b-48pph1lk6p] {
        width: 100%;
    }

    .hide-on-mobile[b-48pph1lk6p] {
        display: none !important;
    }

    .thread-back[b-48pph1lk6p] {
        display: inline-block;
    }
}
/* _content/JointLib/Components/Pages/Metal/Rezistenta/Compresiune.razor.rz.scp.css */
.input-label[b-dsdrhnt5py] {
    width: 90px;
    justify-content: flex-start;
    white-space: nowrap;
}
/* _content/JointLib/Components/Pages/Metal/Rezistenta/Incovoiere cu efort axial.razor.rz.scp.css */
.input-label[b-61qqz7u85y] {
    width: 130px;
    justify-content: flex-start;
    white-space: nowrap;
}
/* _content/JointLib/Components/Pages/Metal/Rezistenta/Moment si Taietoare.razor.rz.scp.css */
.input-label[b-hgqqztjx82] {
    width: 130px;
    justify-content: flex-start;
    white-space: nowrap;
}
/* _content/JointLib/Components/Pages/Metal/Rezistenta/Moment.razor.rz.scp.css */
.input-label[b-wylu7b7hmv] {
    width: 130px;
    justify-content: flex-start;
    white-space: nowrap;
}
/* _content/JointLib/Components/Pages/Metal/Rezistenta/Taietoare.razor.rz.scp.css */
.input-label[b-2u6pp87mdy] {
    width: 130px;
    justify-content: flex-start;
    white-space: nowrap;
}
/* _content/JointLib/Components/Pages/Metal/Stabilitate/Flambaj.razor.rz.scp.css */
.input-label[b-jh037qjrr6] {
    width: 130px;
    justify-content: flex-start;
    white-space: nowrap;
}
/* _content/JointLib/Components/Pages/Metal/Stabilitate/Incovoiere-Compresiune.razor.rz.scp.css */
.input-label[b-eypq24ox0c] {
    width: 130px;
    justify-content: flex-start;
    white-space: nowrap;
}
/* _content/JointLib/Components/Pages/Tools/UserProfile.razor.rz.scp.css */
/* ── Profile page wrapper ─────────────────────────────── */
.profile-page[b-5jx7yaz765] {
    --profile-accent: #7c3aed;
    --profile-accent-light: #a78bfa;
    --profile-accent-pink: #e879f9;
    margin-top: -1.1rem; /* anulează padding-top din .content global */
}

.not-found-wrap[b-5jx7yaz765] {
    text-align: center;
    padding: 80px 20px;
    color: var(--bs-secondary-color);
}

/* ── Cover intern (în cardul sidebar) ────────────────── */
.sidebar-cover[b-5jx7yaz765] {
    width: 100%;
    height: 138px;
    background: linear-gradient(135deg, #2e1065 0%, #6d28d9 52%, #a855f7 100%);
    flex-shrink: 0;
    position: relative;
    overflow: hidden;
}

/* Cercuri decorative subtile pe copertă (motivul din referință), pur ornamentale. */
.sidebar-cover[b-5jx7yaz765]::before,
.sidebar-cover[b-5jx7yaz765]::after {
    content: "";
    position: absolute;
    border-radius: 50%;
    border: 2px solid rgba(255, 255, 255, 0.14);
    pointer-events: none;
}
.sidebar-cover[b-5jx7yaz765]::before { width: 150px; height: 150px; top: -60px; right: -40px; }
.sidebar-cover[b-5jx7yaz765]::after  { width: 90px;  height: 90px;  bottom: -34px; left: -24px;
    background: radial-gradient(circle, rgba(255,255,255,.10), transparent 70%); border: none; }

/* ── Card mare care înglobează tot ────────────────────── */
.profile-shell[b-5jx7yaz765] {
    border-radius: 18px;
    border: 1px solid var(--bs-border-color);
    /* fundal ușor tentat violet, ca sub-cardurile albe/închise să iasă în evidență */
    background: color-mix(in srgb, var(--profile-accent) 5%, var(--bs-body-bg));
    box-shadow: 0 10px 30px -12px rgba(15, 23, 42, .35);
    overflow: hidden;      /* clipează cover-ul la colțurile rotunjite */
}

/* ── Dashboard: 3 carduri care se urcă peste antet ────── */
.profile-dashboard[b-5jx7yaz765] {
    display: grid;
    /* minmax(0,…) împiedică o coloană cu conținut lat (nume de tool) să se umfle */
    grid-template-columns: minmax(0, 1fr) minmax(0, 1.7fr) minmax(0, 1fr);
    gap: 18px;
    padding: 0 20px 22px;
    margin-top: -30px;       /* suprapunerea peste cover/antet */
    position: relative;
    z-index: 2;
    align-items: start;
}
.dashboard-single[b-5jx7yaz765] { grid-template-columns: 1fr; }

.dash-card[b-5jx7yaz765] {
    background: var(--bs-body-bg);
    border: 1px solid var(--bs-border-color);
    border-radius: 14px;
    padding: 18px 18px 20px;
    box-shadow: 0 8px 24px -12px rgba(15, 23, 42, .3);
}

.dash-card-title[b-5jx7yaz765] {
    font-size: 0.92rem;
    font-weight: 700;
    color: var(--profile-accent-light);
    margin-bottom: 14px;
    display: flex;
    align-items: center;
}

/* Listă de tool-uri compactă (card 3) */
.tool-list[b-5jx7yaz765] { display: flex; flex-direction: column; gap: 8px; }
.tool-list-item[b-5jx7yaz765] {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 9px 11px;
    border-radius: 10px;
    border: 1px solid var(--bs-border-color);
    text-decoration: none;
    transition: border-color .15s ease, background .15s ease;
}
.tool-list-item:hover[b-5jx7yaz765] {
    border-color: var(--profile-accent);
    background: color-mix(in srgb, var(--profile-accent) 7%, transparent);
}
.tool-list-icon[b-5jx7yaz765] { color: var(--profile-accent); font-size: 1.05rem; flex-shrink: 0; }
.tool-list-name[b-5jx7yaz765] { font-size: 0.85rem; font-weight: 600; color: var(--bs-body-color); }
.tool-list-meta[b-5jx7yaz765] { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 2px; }

@media (max-width: 991px) {
    .profile-dashboard[b-5jx7yaz765] { grid-template-columns: 1fr; margin-top: -18px; }
}

.profile-hero-cover[b-5jx7yaz765] {
    height: 230px;
    background: linear-gradient(135deg, #2e1065 0%, #6d28d9 52%, #a855f7 100%);
    position: relative;
    overflow: hidden;
}
.profile-hero-cover[b-5jx7yaz765]::before,
.profile-hero-cover[b-5jx7yaz765]::after {
    content: "";
    position: absolute;
    border-radius: 50%;
    border: 2px solid rgba(255, 255, 255, 0.14);
    pointer-events: none;
}
.profile-hero-cover[b-5jx7yaz765]::before { width: 280px; height: 280px; top: -130px; right: 6%; }
.profile-hero-cover[b-5jx7yaz765]::after  { width: 150px; height: 150px; bottom: -80px; right: 20%;
    background: radial-gradient(circle, rgba(255,255,255,.10), transparent 70%); border: none; }

.profile-hero-body[b-5jx7yaz765] {
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    gap: 20px;
    flex-wrap: wrap;
    padding: 0 28px 42px;   /* padding-bottom mărit: loc pentru suprapunerea cardurilor */
}

.profile-hero-id[b-5jx7yaz765] {
    display: flex;
    align-items: flex-end;
    gap: 18px;
    min-width: 0;
}

/* avatarul urcă peste copertă, la stânga (nu centrat ca în sidebar) */
.hero-avatar-wrap[b-5jx7yaz765] {
    margin-top: -56px;
    justify-content: flex-start;
    flex-shrink: 0;
}
.hero-avatar-wrap .profile-avatar-img[b-5jx7yaz765],
.hero-avatar-wrap .profile-avatar-initials[b-5jx7yaz765] {
    width: 112px;
    height: 112px;
    font-size: 2rem;
}
.hero-avatar-wrap .avatar-upload-label[b-5jx7yaz765] {
    width: 112px;
    height: 112px;
    left: 0;
    transform: none;
}

.profile-hero-meta[b-5jx7yaz765] { padding-bottom: 4px; min-width: 0; }
.hero-name[b-5jx7yaz765] { font-size: 1.5rem; line-height: 1.15; }
.hero-meta-line[b-5jx7yaz765] {
    display: flex;
    flex-wrap: wrap;
    gap: 6px 18px;
    margin-top: 8px;
    font-size: 0.8rem;
    color: var(--bs-secondary-color);
}
.hero-meta-line a[b-5jx7yaz765] { color: var(--bs-secondary-color); text-decoration: none; }
.hero-meta-line a:hover[b-5jx7yaz765] { color: var(--profile-accent-light); text-decoration: underline; }

/* Plăcuțe compacte: trebuie să stea pe un singur rând sub copertă, lângă nume. */
.profile-hero-stats[b-5jx7yaz765] {
    display: flex;
    gap: 8px;
    margin-left: auto;
    padding-bottom: 6px;
}
.profile-hero-stats .stat-item[b-5jx7yaz765] {
    min-width: 72px;
    padding: 6px 10px;
    gap: 0;
    border-radius: 10px;
}
.profile-hero-stats .stat-icon[b-5jx7yaz765]  { font-size: 0.85rem; margin-bottom: 0; }
.profile-hero-stats .stat-value[b-5jx7yaz765] { font-size: 0.9rem; line-height: 1.2; }
.profile-hero-stats .stat-label[b-5jx7yaz765] { font-size: 0.56rem; letter-spacing: 0.3px; }

.profile-hero-tabs[b-5jx7yaz765] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
    flex-wrap: wrap;
    border-top: 1px solid var(--bs-border-color);
    padding: 4px 16px 0;
}
.hero-tabs[b-5jx7yaz765] { border-bottom: none; padding: 0; }
.hero-actions[b-5jx7yaz765] { display: flex; gap: 8px; padding-bottom: 6px; flex-shrink: 0; }

/* Sidebarul de sub hero nu mai are copertă — doar padding sus */
.sidebar-card-flat .basic-info-section[b-5jx7yaz765] { padding-top: 18px; }

@media (max-width: 768px) {
    .profile-hero-body[b-5jx7yaz765] { flex-direction: column; align-items: center; text-align: center; }
    .profile-hero-id[b-5jx7yaz765] { flex-direction: column; align-items: center; }
    .hero-avatar-wrap[b-5jx7yaz765] { justify-content: center; }
    .hero-avatar-wrap .avatar-upload-label[b-5jx7yaz765] { left: 50%; transform: translateX(-50%); }
    .hero-meta-line[b-5jx7yaz765] { justify-content: center; }
    .profile-hero-stats[b-5jx7yaz765] { margin-left: 0; width: 100%; justify-content: center; }
    .profile-hero-tabs[b-5jx7yaz765] { flex-direction: column; align-items: stretch; }
    .hero-tabs[b-5jx7yaz765] { overflow-x: auto; }
    .hero-actions[b-5jx7yaz765] { justify-content: center; }
}

/* ── Cards ────────────────────────────────────────────── */
.profile-card[b-5jx7yaz765] {
    border-radius: 16px;
    border: 1px solid var(--bs-border-color);
    background: var(--bs-body-bg);
    box-shadow: 0 6px 22px -8px rgba(15, 23, 42, .28);
}

.sidebar-card[b-5jx7yaz765] {
    overflow: hidden; /* clipează cover-ul la colțurile rotunjite */
    padding-bottom: 20px;
}

.content-card[b-5jx7yaz765] {
    padding: 0;
}

/* ── Avatar ───────────────────────────────────────────── */
.avatar-wrap[b-5jx7yaz765] {
    display: flex;
    justify-content: center;
    margin-top: -44px; /* suprapune cover-ul intern din card */
    position: relative;
}

.profile-avatar-img[b-5jx7yaz765],
.profile-avatar-initials[b-5jx7yaz765] {
    width: 92px;
    height: 92px;
    border-radius: 50%;
    border: 4px solid var(--bs-body-bg);
    object-fit: cover;
    flex-shrink: 0;
    /* Inel fin accent + umbră — face avatarul să „stea" peste copertă. */
    box-shadow: 0 0 0 2px var(--profile-accent-light), 0 8px 18px -6px rgba(124, 58, 237, .55);
}

.profile-avatar-initials[b-5jx7yaz765] {
    display: flex;
    align-items: center;
    justify-content: center;
    background: linear-gradient(135deg, #4c1d95, #7c3aed);
    color: #fff;
    font-size: 1.6rem;
    font-weight: 700;
}

.online-dot[b-5jx7yaz765] {
    position: absolute;
    bottom: 6px;
    right: calc(50% - 40px);
    width: 14px;
    height: 14px;
    border-radius: 50%;
    background: #22c55e;
    border: 2px solid var(--bs-body-bg);
}

/* ── Sidebar text ─────────────────────────────────────── */
.profile-name[b-5jx7yaz765] {
    font-size: 1.1rem;
    font-weight: 700;
}

.profile-designation[b-5jx7yaz765] {
    font-size: 0.82rem;
    color: var(--bs-secondary-color);
    margin-top: 2px;
}

.profile-location[b-5jx7yaz765] {
    font-size: 0.78rem;
    color: var(--bs-secondary-color);
    margin-top: 4px;
}

/* ── Stats row — trei plăcuțe (ca în referință) ───────── */
.stats-row[b-5jx7yaz765] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 8px;
    padding: 12px 20px;
}

.stat-item[b-5jx7yaz765] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 2px;
    padding: 10px 4px;
    border-radius: 12px;
    background: color-mix(in srgb, var(--profile-accent) 6%, transparent);
    border: 1px solid var(--bs-border-color);
    transition: border-color .15s ease, background .15s ease;
}

.stat-item:hover[b-5jx7yaz765] {
    border-color: var(--profile-accent-light);
    background: color-mix(in srgb, var(--profile-accent) 11%, transparent);
}

/* Dinamica veche folosea despărțitoare verticale; cu plăcuțele nu mai au sens. */
.stat-divider[b-5jx7yaz765] { display: none; }

.stat-icon[b-5jx7yaz765] {
    font-size: 1.2rem;
    color: var(--profile-accent-pink);
    margin-bottom: 2px;
}

.stat-value[b-5jx7yaz765] {
    font-size: 1.1rem;
    font-weight: 700;
    color: var(--profile-accent-light);
}

.stat-label[b-5jx7yaz765] {
    font-size: 0.65rem;
    letter-spacing: 0.5px;
    color: var(--bs-secondary-color);
    text-transform: uppercase;
}

.stat-divider[b-5jx7yaz765] {
    width: 1px;
    height: 40px;
    background: var(--bs-border-color);
}

/* ── Sidebar sections ─────────────────────────────────── */
.sidebar-hr[b-5jx7yaz765] {
    margin: 12px 20px;
    border-color: var(--bs-border-color);
    opacity: 0.4;
}

.basic-info-section[b-5jx7yaz765] {
    padding: 0 20px;
}

.basic-info-title[b-5jx7yaz765] {
    font-size: 0.78rem;
    font-weight: 700;
    color: var(--profile-accent-light);
    margin-bottom: 10px;
    letter-spacing: 0.3px;
}

.basic-info-row[b-5jx7yaz765] {
    display: flex;
    justify-content: space-between;
    font-size: 0.8rem;
    padding: 5px 0;
    border-bottom: 1px solid var(--bs-border-color);
    gap: 8px;
    /* Valoarea (nume lung, titlu, e-mail fără spații) trebuie să treacă pe rândul
       următor și să se rupă, altfel împinge rândul în afara cardului. */
    flex-wrap: wrap;
}

/* al doilea <span> = valoarea */
.basic-info-row > span + span[b-5jx7yaz765] {
    min-width: 0;
    text-align: right;
    overflow-wrap: anywhere;
    word-break: break-word;
}

.basic-info-row:last-child[b-5jx7yaz765] {
    border-bottom: none;
}

.bi-label[b-5jx7yaz765] {
    font-weight: 600;
    color: var(--bs-secondary-color);
    white-space: nowrap;
    flex-shrink: 0;
}

/* ── Followers list ───────────────────────────────────── */
.view-all-link[b-5jx7yaz765] {
    font-size: 0.72rem;
    color: var(--profile-accent-light);
    text-decoration: none;
}

.view-all-link:hover[b-5jx7yaz765] {
    text-decoration: underline;
}

.followers-list[b-5jx7yaz765] {
    padding: 0 20px;
    display: flex;
    flex-direction: column;
    gap: 8px;
    margin-top: 8px;
}

.follower-row[b-5jx7yaz765] {
    display: flex;
    align-items: center;
    gap: 10px;
}

.follower-avatar[b-5jx7yaz765] {
    width: 36px;
    height: 36px;
    border-radius: 50%;
    background: linear-gradient(135deg, #4c1d95, #7c3aed);
    color: #fff;
    font-size: 0.7rem;
    font-weight: 700;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    overflow: hidden;
}

.follower-avatar img[b-5jx7yaz765] {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.follower-name[b-5jx7yaz765] {
    font-size: 0.82rem;
    font-weight: 500;
    color: var(--bs-body-color);
}

.follower-btn[b-5jx7yaz765] {
    border-radius: 50%;
    width: 26px;
    height: 26px;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0;
    font-size: 0.9rem;
    border: 1px solid var(--bs-border-color);
    color: var(--bs-secondary-color);
    background: transparent;
    line-height: 1;
}

.follower-btn:hover[b-5jx7yaz765] {
    background: var(--profile-accent);
    border-color: var(--profile-accent);
    color: #fff;
}

/* ── Tab navigation ───────────────────────────────────── */
.profile-tabs[b-5jx7yaz765] {
    display: flex;
    gap: 4px;
    padding: 12px 16px 0;
    border-bottom: 1px solid var(--bs-border-color);
    overflow: visible;
}

.tab-btn[b-5jx7yaz765] {
    background: transparent;
    border: none;
    border-bottom: 3px solid transparent;
    padding: 8px 16px;
    font-size: 0.85rem;
    font-weight: 500;
    color: var(--bs-secondary-color);
    cursor: pointer;
    white-space: nowrap;
    transition: color 0.15s, border-color 0.15s;
    margin-bottom: -1px;
}

.tab-btn:hover[b-5jx7yaz765] {
    color: var(--bs-body-color);
}

.tab-btn.active[b-5jx7yaz765] {
    color: var(--profile-accent-light);
    border-bottom-color: var(--profile-accent);
    font-weight: 600;
}

/* ── Tab body ─────────────────────────────────────────── */
.tab-body[b-5jx7yaz765] {
    padding: 20px 24px 24px;
}

/* ── Content sections (About) ─────────────────────────── */
.content-section[b-5jx7yaz765] {
    margin-bottom: 8px;
}

.section-title[b-5jx7yaz765] {
    font-size: 0.82rem;
    font-weight: 700;
    color: var(--profile-accent-light);
    margin-bottom: 12px;
    letter-spacing: 0.3px;
    display: flex;
    align-items: center;
    gap: 8px;
}

/* Bară-accent mică înaintea titlului de secțiune. */
.section-title[b-5jx7yaz765]::before {
    content: "";
    width: 3px;
    height: 14px;
    border-radius: 2px;
    background: linear-gradient(var(--profile-accent-light), var(--profile-accent));
    flex-shrink: 0;
}

.section-hr[b-5jx7yaz765] {
    border-color: var(--bs-border-color);
    opacity: 0.35;
    margin: 16px 0;
}

.about-bio[b-5jx7yaz765] {
    font-size: 0.88rem;
    line-height: 1.7;
    color: var(--bs-body-color);
    white-space: pre-wrap;
    overflow-wrap: anywhere;
}

/* Nici URL-urile lungi din contact/social nu au voie să lățească cardul. */
.contact-value[b-5jx7yaz765],
.contact-row[b-5jx7yaz765] { min-width: 0; overflow-wrap: anywhere; }

/* ── Contact grid ─────────────────────────────────────── */
.contact-grid[b-5jx7yaz765] {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.contact-row[b-5jx7yaz765] {
    display: flex;
    align-items: center;
    gap: 10px;
    font-size: 0.85rem;
}

.contact-icon[b-5jx7yaz765] {
    color: var(--profile-accent);
    font-size: 1rem;
    flex-shrink: 0;
    width: 20px;
    text-align: center;
}

.contact-label[b-5jx7yaz765] {
    font-weight: 600;
    color: var(--bs-secondary-color);
    min-width: 70px;
}

.contact-value[b-5jx7yaz765] {
    color: var(--bs-body-color);
    text-decoration: none;
}

a.contact-value:hover[b-5jx7yaz765] {
    text-decoration: underline;
    color: var(--profile-accent-light);
}

/* ── Firme (la ce firme lucrează persoana) ────────────── */
.company-list[b-5jx7yaz765] {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.company-chip[b-5jx7yaz765] {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 8px 10px;
    border-radius: 10px;
    border: 1px solid var(--bs-border-color);
    text-decoration: none;
    color: inherit;
    min-width: 0;
    transition: border-color .15s ease, background .15s ease;
}

.company-chip:hover[b-5jx7yaz765] {
    color: inherit;
    border-color: var(--profile-accent);
    background: color-mix(in srgb, var(--profile-accent) 7%, transparent);
}

.company-chip-logo[b-5jx7yaz765] {
    width: 28px;
    height: 28px;
    border-radius: 7px;
    object-fit: contain;
    flex-shrink: 0;
    background: var(--bs-body-bg);
}

.company-chip-initials[b-5jx7yaz765] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 0.65rem;
    font-weight: 700;
    color: #fff;
    background: linear-gradient(135deg, #4c1d95, #7c3aed);
}

.company-chip-name[b-5jx7yaz765] {
    font-size: 0.83rem;
    font-weight: 600;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.company-chip-role[b-5jx7yaz765] {
    margin-left: auto;
    flex-shrink: 0;
    font-size: 0.65rem;
    text-transform: uppercase;
    letter-spacing: .4px;
    color: var(--bs-secondary-color);
}

/* ── Skills ───────────────────────────────────────────── */
.skills-wrap[b-5jx7yaz765] {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.skill-badge[b-5jx7yaz765] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 4px 12px;
    border-radius: 20px;
    font-size: 0.78rem;
    font-weight: 500;
    border: 1px solid color-mix(in srgb, var(--profile-accent) 45%, transparent);
    color: var(--profile-accent-light);
    background: color-mix(in srgb, var(--profile-accent) 9%, transparent);
    transition: background .15s ease, border-color .15s ease;
}

.skill-badge:hover[b-5jx7yaz765] {
    background: color-mix(in srgb, var(--profile-accent) 16%, transparent);
    border-color: var(--profile-accent);
}

.skill-badge-removable[b-5jx7yaz765] {
    padding-right: 6px;
}

.skill-remove-btn[b-5jx7yaz765] {
    background: none;
    border: none;
    padding: 0 2px;
    font-size: 1rem;
    line-height: 1;
    cursor: pointer;
    color: var(--profile-accent-light);
    opacity: 0.7;
}

.skill-remove-btn:hover[b-5jx7yaz765] {
    opacity: 1;
}

/* ── Social media cards ───────────────────────────────── */
.social-grid[b-5jx7yaz765] {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
}

.social-card[b-5jx7yaz765] {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 12px 16px;
    border-radius: 12px;
    text-decoration: none;
    color: #fff;
    min-width: 150px;
    flex: 1;
    max-width: 200px;
    transition: opacity 0.15s, transform 0.15s;
}

.social-card:hover[b-5jx7yaz765] {
    opacity: 0.88;
    transform: translateY(-2px);
    color: #fff;
}

.social-card-icon[b-5jx7yaz765] {
    font-size: 1.6rem;
    flex-shrink: 0;
}

.social-card-label[b-5jx7yaz765] {
    font-size: 0.82rem;
    font-weight: 700;
}

.social-card-url[b-5jx7yaz765] {
    font-size: 0.72rem;
    opacity: 0.85;
    word-break: break-all;
}

.social-github[b-5jx7yaz765]   { background: #4c1d95; }
.social-twitter[b-5jx7yaz765]  { background: #1a91da; }
.social-linkedin[b-5jx7yaz765] { background: #0077b5; }
.social-portfolio[b-5jx7yaz765]{ background: #c2410c; }

/* ── Timeline ─────────────────────────────────────────── */
.timeline-post[b-5jx7yaz765] {
    padding: 8px 0;
}

.timeline-post-header[b-5jx7yaz765] {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 10px;
}

.timeline-post-author[b-5jx7yaz765] {
    font-size: 0.88rem;
    font-weight: 600;
}

.timeline-post-date[b-5jx7yaz765] {
    font-size: 0.75rem;
    color: var(--bs-secondary-color);
}

.timeline-post-body[b-5jx7yaz765] {
    padding-left: 48px;
}

.timeline-tool-name[b-5jx7yaz765] {
    font-size: 0.95rem;
    font-weight: 600;
    color: var(--profile-accent-light);
    text-decoration: none;
}

.timeline-tool-name:hover[b-5jx7yaz765] {
    text-decoration: underline;
}

.timeline-tool-meta[b-5jx7yaz765] {
    margin-top: 6px;
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
}

.hashtag[b-5jx7yaz765] {
    font-size: 0.78rem;
    color: var(--profile-accent-light);
}

/* ── Friends grid ─────────────────────────────────────── */
.friends-grid[b-5jx7yaz765] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
    gap: 16px;
}

.friend-card[b-5jx7yaz765] {
    border: 1px solid var(--bs-border-color);
    border-radius: 12px;
    padding: 20px 16px 16px;
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    gap: 6px;
    transition: border-color 0.15s;
}

.friend-card:hover[b-5jx7yaz765] {
    border-color: var(--profile-accent);
}

.friend-avatar[b-5jx7yaz765] {
    width: 64px;
    height: 64px;
    border-radius: 50%;
    background: linear-gradient(135deg, #4c1d95, #7c3aed);
    color: #fff;
    font-size: 1rem;
    font-weight: 700;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 4px;
}

.friend-name[b-5jx7yaz765] {
    font-size: 0.9rem;
    font-weight: 600;
}

.friend-email[b-5jx7yaz765] {
    font-size: 0.72rem;
    color: var(--bs-secondary-color);
    max-width: 100%;
}

.friend-title-badge[b-5jx7yaz765] {
    font-size: 0.7rem;
    padding: 2px 10px;
    border-radius: 20px;
    background: rgba(124, 58, 237, 0.12);
    color: var(--profile-accent-light);
    border: 1px solid rgba(124, 58, 237, 0.3);
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* ── Edit profile sections ────────────────────────────── */
.edit-section[b-5jx7yaz765] {
    padding: 4px 0 12px;
}

.edit-section-title[b-5jx7yaz765] {
    font-size: 0.82rem;
    font-weight: 700;
    color: var(--profile-accent-light);
    margin-bottom: 16px;
    letter-spacing: 0.3px;
}

/* ── Upload avatar / cover (owner) — pct. 2 ───────────── */
.upload-indicator[b-5jx7yaz765] {
    display: flex;
    align-items: center;
    font-size: 0.85rem;
    color: var(--profile-accent-light);
}

/* Cover: întreaga copertă devine clickabilă pentru owner */
.cover-upload-label[b-5jx7yaz765] {
    position: absolute;
    inset: 0;
    margin: 0;
    cursor: pointer;
    display: flex;
    align-items: flex-start;
    justify-content: flex-end;
    transition: background 0.15s;
}

.cover-upload-label:hover[b-5jx7yaz765] {
    background: rgba(0, 0, 0, 0.25);
}

.cover-edit-badge[b-5jx7yaz765] {
    margin: 8px;
    padding: 4px 10px;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    background: rgba(0, 0, 0, 0.55);
    color: #fff;
    border-radius: 20px;
    font-size: 0.72rem;
    font-weight: 500;
}

/* Avatar: cerc clickabil peste poză, cu badge cameră */
.avatar-upload-label[b-5jx7yaz765] {
    position: absolute;
    top: 0;
    left: 50%;
    transform: translateX(-50%);
    width: 88px;
    height: 88px;
    margin: 0;
    border-radius: 50%;
    cursor: pointer;
    transition: background 0.15s;
}

.avatar-upload-label:hover[b-5jx7yaz765] {
    background: rgba(0, 0, 0, 0.35);
}

.avatar-edit-badge[b-5jx7yaz765] {
    position: absolute;
    bottom: 2px;
    right: 2px;
    width: 26px;
    height: 26px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--profile-accent);
    color: #fff;
    border: 2px solid var(--bs-body-bg);
    border-radius: 50%;
    font-size: 0.72rem;
}

/* ── Postări: composer + conținut (pct. 3) ────────────── */
.post-composer[b-5jx7yaz765] {
    padding: 4px 0 8px;
}

.post-content[b-5jx7yaz765] {
    font-size: 0.9rem;
    line-height: 1.6;
    color: var(--bs-body-color);
    white-space: pre-wrap;
    word-break: break-word;
    margin-bottom: 8px;
}

.post-content a[b-5jx7yaz765] {
    color: var(--profile-accent-light);
    text-decoration: underline;
    word-break: break-all;
}

.post-image[b-5jx7yaz765] {
    display: block;
    max-width: 100%;
    max-height: 380px;
    border-radius: 10px;
    margin-bottom: 8px;
    border: 1px solid var(--bs-border-color);
    object-fit: cover;
}

.post-image-preview[b-5jx7yaz765] {
    position: relative;
    display: inline-block;
}

.post-image-preview img[b-5jx7yaz765] {
    display: block;
    max-width: 220px;
    max-height: 150px;
    border-radius: 8px;
    border: 1px solid var(--bs-border-color);
}

.post-image-remove[b-5jx7yaz765] {
    position: absolute;
    top: -8px;
    right: -8px;
    width: 22px;
    height: 22px;
    padding: 0;
    border-radius: 50%;
    border: 2px solid var(--bs-body-bg);
    background: var(--bs-danger, #dc3545);
    color: #fff;
    font-size: 0.9rem;
    line-height: 1;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
}
/* _content/JointLib/Components/Shared/AgentStatusBadge.razor.rz.scp.css */
/* Pastila de stare a agentului, în bara de sus. Discretă când totul e în regulă,
   vizibilă când nu e — dar niciodată alarmantă: agentul oprit e o stare normală,
   nu o eroare. */

.agb[b-yihm5thx69] {
    position: relative;
    display: inline-flex;
    align-items: center;
}

.agb-pill[b-yihm5thx69] {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    background: transparent;
    border: 1px solid var(--bs-border-color);
    border-radius: 999px;
    padding: 0.22rem 0.6rem;
    font-size: 0.78rem;
    line-height: 1.3;
    color: var(--bs-body-color);
    cursor: pointer;
    white-space: nowrap;
    transition: border-color .12s ease, background-color .12s ease;
}

.agb-pill:hover[b-yihm5thx69] {
    background: var(--bs-secondary-bg);
}

.agb-dot[b-yihm5thx69] {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    flex: 0 0 auto;
}

.agb-on .agb-dot[b-yihm5thx69] {
    background: #22c55e;
    box-shadow: 0 0 0 3px rgba(34, 197, 94, .18);
}

.agb-off .agb-dot[b-yihm5thx69] {
    background: #f59e0b;
    box-shadow: 0 0 0 3px rgba(245, 158, 11, .18);
}

.agb-off .agb-pill[b-yihm5thx69] {
    border-color: rgba(245, 158, 11, .45);
}

/* Sub ~560px rămâne doar bujia colorată: bara de sus e deja aglomerată pe telefon,
   iar starea se poate citi din culoare. */
@media (max-width: 560px) {
    .agb-label[b-yihm5thx69] { display: none; }
    .agb-pill[b-yihm5thx69] { padding: 0.3rem; }
}

.agb-pop[b-yihm5thx69] {
    position: absolute;
    top: calc(100% + 8px);
    right: 0;
    z-index: 1080;
    width: 268px;
    background: var(--bs-body-bg);
    border: 1px solid var(--bs-border-color);
    border-radius: 10px;
    box-shadow: 0 10px 30px rgba(0, 0, 0, .18);
    padding: 12px 13px;
    font-size: 0.82rem;
    text-align: left;
}

.agb-pop-t[b-yihm5thx69] {
    font-weight: 600;
    margin-bottom: 5px;
    color: var(--bs-emphasis-color);
}

.agb-pop-d[b-yihm5thx69] {
    color: var(--bs-secondary-color);
    line-height: 1.5;
    margin-bottom: 10px;
}

.agb-chips[b-yihm5thx69] {
    display: flex;
    flex-wrap: wrap;
    gap: 5px;
}

.agb-chip[b-yihm5thx69] {
    background: var(--bs-secondary-bg);
    border: 1px solid var(--bs-border-color);
    border-radius: 6px;
    padding: 2px 7px;
    font-size: 0.74rem;
    color: var(--bs-body-color);
}

.agb-btn[b-yihm5thx69] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    width: 100%;
    border: none;
    border-radius: 8px;
    padding: 7px 12px;
    font-size: 0.82rem;
    font-weight: 600;
    color: #fff;
    background: #7c5cff;
    cursor: pointer;
}

.agb-btn:hover:not(:disabled)[b-yihm5thx69] { background: #6b4bef; }
.agb-btn:disabled[b-yihm5thx69] { opacity: .7; cursor: default; }

.agb-spin[b-yihm5thx69] {
    width: 12px;
    height: 12px;
    border: 2px solid #ffffff55;
    border-top-color: #fff;
    border-radius: 50%;
    animation: agb-spin-b-yihm5thx69 .7s linear infinite;
}

@keyframes agb-spin-b-yihm5thx69 { to { transform: rotate(360deg); } }

.agb-hint[b-yihm5thx69] {
    margin-top: 9px;
    font-size: 0.76rem;
    line-height: 1.5;
    color: var(--bs-secondary-color);
}

.agb-hint a[b-yihm5thx69] {
    color: #7c5cff;
    text-decoration: none;
    font-weight: 600;
}

.agb-hint a:hover[b-yihm5thx69] { text-decoration: underline; }

.agb-hint-quiet[b-yihm5thx69] { margin-top: 7px; }

/* Versiunile din interiorul unui chip de program („Tekla  2026 · 2023"). Mai stinse decât
   numele, ca ochiul să prindă întâi programul și abia apoi ce versiuni sunt active. */
.agb-chip-v[b-yihm5thx69] {
    margin-left: 5px;
    opacity: .7;
    font-variant-numeric: tabular-nums;
}
/* _content/JointLib/Components/Shared/FeedPostCard.razor.rz.scp.css */
/* Cardul de postare (feed + profil). Paletă proprie, ca să arate identic oriunde e folosit
   — nu depinde de variabilele paginii-gazdă. Accentul indigo e cel din app.css. */
.fp-card[b-6nvsgs8z9c] {
    --fp-surface: #ffffff;
    --fp-surface-2: #f6f6fb;
    --fp-border: rgba(15, 23, 42, 0.09);
    --fp-muted: #6b6880;
    --fp-accent: #5b5be6;
    --fp-shadow: 0 2px 10px rgba(15, 23, 42, 0.06);
    --fp-shadow-lg: 0 14px 30px -12px rgba(15, 23, 42, 0.26);

    border: 1px solid var(--fp-border);
    border-radius: 16px;
    background: var(--fp-surface);
    box-shadow: var(--fp-shadow);
    padding: 18px;
    margin-bottom: 16px;
    transition: box-shadow .18s ease;
}

[data-bs-theme="dark"] .fp-card[b-6nvsgs8z9c] {
    --fp-surface: rgba(255, 255, 255, 0.035);
    --fp-surface-2: rgba(255, 255, 255, 0.06);
    --fp-border: rgba(255, 255, 255, 0.09);
    --fp-muted: #9a97ad;
    --fp-accent: #8b8bf5;
    --fp-shadow: 0 2px 10px rgba(0, 0, 0, 0.28);
    --fp-shadow-lg: 0 16px 34px -12px rgba(0, 0, 0, 0.60);
}

.fp-card:hover[b-6nvsgs8z9c] { box-shadow: var(--fp-shadow-lg); }

/* ── „X a distribuit postarea" ── */
.fp-shared-by[b-6nvsgs8z9c] {
    display: flex;
    align-items: center;
    gap: 6px;
    color: var(--fp-muted);
    font-size: .74rem;
    padding-bottom: 10px;
    margin-bottom: 12px;
    border-bottom: 1px solid var(--fp-border);
}

.fp-shared-by a[b-6nvsgs8z9c] { color: inherit; font-weight: 650; text-decoration: none; }
.fp-shared-by a:hover[b-6nvsgs8z9c] { color: var(--fp-accent); }

/* ── Antet ── */
.fp-head[b-6nvsgs8z9c] { display: flex; align-items: flex-start; gap: 12px; }
.fp-head-text[b-6nvsgs8z9c] { flex: 1; min-width: 0; }
.fp-head-actions[b-6nvsgs8z9c] { display: flex; gap: 2px; flex-shrink: 0; }

.fp-avatar-link[b-6nvsgs8z9c] { text-decoration: none; flex-shrink: 0; }

.fp-avatar[b-6nvsgs8z9c] {
    width: 44px; height: 44px;
    border-radius: 50%;
    object-fit: cover;
    display: flex; align-items: center; justify-content: center;
    font-weight: 650; font-size: .82rem; color: #fff;
    background: linear-gradient(135deg, #6d6df2, #7c4de0);
}

.fp-avatar-sm[b-6nvsgs8z9c] { width: 32px; height: 32px; font-size: .7rem; }

.fp-author[b-6nvsgs8z9c] { font-weight: 650; font-size: .88rem; text-decoration: none; color: inherit; }
.fp-author:hover[b-6nvsgs8z9c] { color: var(--fp-accent); }
.fp-author-sm[b-6nvsgs8z9c] { font-size: .8rem; }

.fp-meta[b-6nvsgs8z9c] { color: var(--fp-muted); font-size: .72rem; display: inline-flex; align-items: center; gap: 4px; }

.fp-icon-btn[b-6nvsgs8z9c] {
    border: none; background: transparent;
    color: var(--fp-muted);
    opacity: .5;
    font-size: .9rem; line-height: 1;
    padding: 5px; border-radius: 8px;
    cursor: pointer;
    transition: opacity .15s ease, color .15s ease, background .15s ease;
}

.fp-card:hover .fp-icon-btn[b-6nvsgs8z9c] { opacity: 1; }
.fp-icon-btn:hover[b-6nvsgs8z9c] { color: var(--fp-accent); background: var(--fp-surface-2); }
.fp-icon-danger:hover[b-6nvsgs8z9c] { color: #ef4444; background: rgba(239, 68, 68, .12); }
.fp-icon-btn:disabled[b-6nvsgs8z9c] { opacity: .3; cursor: default; }

/* ── Conținut ── */
.fp-body[b-6nvsgs8z9c] { font-size: .87rem; line-height: 1.6; white-space: pre-wrap; margin: 12px 0 0; }
.fp-img[b-6nvsgs8z9c] { max-width: 100%; max-height: 420px; border-radius: 12px; margin-top: 12px; }

.fp-tool[b-6nvsgs8z9c] {
    display: inline-flex; align-items: center; gap: 6px;
    margin-top: 12px;
    border: 1px solid var(--fp-border);
    border-radius: 10px;
    background: rgba(91, 91, 230, .10);
    color: var(--fp-accent);
    font-size: .78rem; font-weight: 600;
    padding: 7px 14px;
    text-decoration: none;
    transition: border-color .15s ease;
}

[data-bs-theme="dark"] .fp-tool[b-6nvsgs8z9c] { background: rgba(139, 139, 245, .14); }
.fp-tool:hover[b-6nvsgs8z9c] { border-color: var(--fp-accent); color: var(--fp-accent); }

/* ── Numărători ── */
.fp-counts[b-6nvsgs8z9c] {
    display: flex; align-items: center; gap: 14px;
    margin-top: 14px; padding-top: 12px;
    border-top: 1px solid var(--fp-border);
    color: var(--fp-muted); font-size: .74rem;
}

.fp-counts i[b-6nvsgs8z9c] { color: var(--fp-accent); }

.fp-count-btn[b-6nvsgs8z9c] {
    border: none; background: transparent; padding: 0;
    color: inherit; font-size: inherit; cursor: pointer;
}

.fp-count-btn:hover[b-6nvsgs8z9c] { color: var(--fp-accent); text-decoration: underline; }

/* ── Butoane acțiune (pastile colorate discret) ── */
.fp-actions[b-6nvsgs8z9c] {
    display: flex; align-items: center; gap: 8px; flex-wrap: wrap;
    margin-top: 12px; padding-top: 12px;
    border-top: 1px solid var(--fp-border);
}

.fp-btn[b-6nvsgs8z9c] {
    display: inline-flex; align-items: center; gap: 6px;
    border: 1px solid transparent;
    border-radius: 10px;
    font-size: .78rem; font-weight: 600;
    padding: 7px 14px;
    cursor: pointer;
    transition: filter .15s ease, transform .12s ease, border-color .15s ease;
}

.fp-btn:hover:not(:disabled)[b-6nvsgs8z9c] { transform: translateY(-1px); filter: brightness(.97); }
.fp-btn:disabled[b-6nvsgs8z9c] { opacity: .5; cursor: default; }

.fp-btn-comment[b-6nvsgs8z9c] { background: rgba(16, 185, 129, .12); color: #059669; }
.fp-btn-comment.on[b-6nvsgs8z9c], .fp-btn-comment:hover:not(:disabled)[b-6nvsgs8z9c] { border-color: rgba(16, 185, 129, .5); }

.fp-btn-like[b-6nvsgs8z9c] { background: rgba(91, 91, 230, .12); color: #5b5be6; }
.fp-btn-like.on[b-6nvsgs8z9c] { background: rgba(91, 91, 230, .22); border-color: rgba(91, 91, 230, .55); }
.fp-btn-like:hover:not(:disabled)[b-6nvsgs8z9c] { border-color: rgba(91, 91, 230, .5); }

.fp-btn-share[b-6nvsgs8z9c] {
    margin-left: auto;
    background: linear-gradient(135deg, #f59e0b, #f97316);
    color: #fff;
    box-shadow: 0 6px 16px -6px rgba(245, 158, 11, .6);
}

.fp-btn-share.on[b-6nvsgs8z9c] { background: linear-gradient(135deg, #ea580c, #c2410c); }

[data-bs-theme="dark"] .fp-btn-comment[b-6nvsgs8z9c] { background: rgba(16, 185, 129, .16); color: #34d399; }
[data-bs-theme="dark"] .fp-btn-like[b-6nvsgs8z9c] { background: rgba(139, 139, 245, .16); color: #a5a5f8; }
[data-bs-theme="dark"] .fp-btn-like.on[b-6nvsgs8z9c] { background: rgba(139, 139, 245, .28); }

/* ── Comentarii ── */
.fp-comments[b-6nvsgs8z9c] {
    margin-top: 14px; padding-top: 14px;
    border-top: 1px solid var(--fp-border);
}

.fp-comment[b-6nvsgs8z9c] { display: flex; gap: 10px; margin-bottom: 10px; }

.fp-comment-bubble[b-6nvsgs8z9c] {
    flex: 1; min-width: 0;
    background: var(--fp-surface-2);
    border: 1px solid var(--fp-border);
    border-radius: 12px;
    padding: 8px 12px;
}

.fp-comment-head[b-6nvsgs8z9c] { display: flex; align-items: center; gap: 8px; }
.fp-comment-text[b-6nvsgs8z9c] { font-size: .82rem; line-height: 1.5; margin-top: 2px; white-space: pre-wrap; }

.fp-comment-form[b-6nvsgs8z9c] { display: flex; gap: 8px; align-items: flex-start; margin-top: 12px; }

.fp-comment-form textarea[b-6nvsgs8z9c] {
    border: 1px solid var(--fp-border);
    border-radius: 10px;
    background: var(--fp-surface-2);
    font-size: .82rem;
    resize: vertical;
    min-height: 38px;
}

.fp-comment-form textarea:focus[b-6nvsgs8z9c] {
    border-color: var(--fp-accent);
    box-shadow: 0 0 0 3px rgba(91, 91, 230, .15);
    background: var(--fp-surface-2);
}

.fp-btn-send[b-6nvsgs8z9c] {
    background: linear-gradient(135deg, #6d6df2 0%, #5b5be6 50%, #7c4de0 100%);
    color: #fff;
    flex-shrink: 0;
    box-shadow: 0 6px 16px -6px rgba(91, 91, 230, .55);
}

@media (max-width: 575.98px) {
    .fp-btn[b-6nvsgs8z9c] { padding: 7px 10px; }
    .fp-btn-share[b-6nvsgs8z9c] { margin-left: 0; }
}