@import '_content/Elioplus.DesignSystem/Elioplus.DesignSystem.ynbp2ev2ya.bundle.scp.css';

/* /Components/Layout/AdminLayout.razor.rz.scp.css */
.admin-page[b-99pxp8wfg7] {
    display: flex;
    flex-direction: column;
    min-height: 100vh;
}

.admin-sidebar[b-99pxp8wfg7] {
    background: linear-gradient(180deg, var(--ds-gray-800) 0%, var(--ds-gray-700) 100%);
    display: flex;
    flex-direction: column;
}

/* Same reason as main in MainLayout: from 641px up .admin-page is a flex row of a 240px
   sidebar that does not shrink and this column, and a flex item's min-width defaults to
   auto, so this column would not go below its own min-content. The widest thing inside
   it is an admin data table, which dragged the column to 1041px inside a 768px window
   and scrolled the whole page sideways. With this the column takes the width it is
   given and the table scrolls inside its own container, which is where a wide table
   should scroll. */
.admin-main[b-99pxp8wfg7] {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    background: var(--ds-surface-sunken);
}

.admin-topbar[b-99pxp8wfg7] {
    background: var(--ds-surface);
    border-bottom: 1px solid var(--ds-border);
    height: 3.25rem;
    display: flex;
    align-items: center;
    padding: 0 1.5rem;
    gap: 0.75rem;
    position: sticky;
    top: 0;
    z-index: 1;
}

.admin-content[b-99pxp8wfg7] {
    flex: 1;
    padding: 1.5rem;
}

@media (min-width: 641px) {
    .admin-page[b-99pxp8wfg7] {
        flex-direction: row;
    }

    .admin-sidebar[b-99pxp8wfg7] {
        width: 240px;
        flex-shrink: 0;
        height: 100vh;
        position: sticky;
        top: 0;
        overflow-y: auto;
    }
}
/* /Components/Layout/AdminNavMenu.razor.rz.scp.css */
.admin-brand[b-0qsqxmviof] {
    background: rgba(0, 0, 0, 0.15);
    padding: 16px 20px;
}

.admin-brand-inner[b-0qsqxmviof] {
    display: flex;
    align-items: center;
    gap: 10px;
}

.admin-brand-name[b-0qsqxmviof] {
    font-size: 0.95rem;
    font-weight: 700;
    color: var(--ds-text-inverse);
    letter-spacing: 0.04em;
    line-height: 1.2;
}

.admin-brand-sub[b-0qsqxmviof] {
    font-size: 0.7rem;
    color: rgba(255, 255, 255, 0.65);
    letter-spacing: 0.03em;
}

.admin-nav-scroll[b-0qsqxmviof] {
    padding: 12px 0;
    overflow-y: auto;
    flex: 1;
}

[b-0qsqxmviof] .admin-nav-menu .mud-nav-link {
    color: rgba(255, 255, 255, 0.85);
    border-radius: 0;
    padding: 10px 20px;
    font-size: var(--ds-text-14);
    font-weight: 500;
}

[b-0qsqxmviof] .admin-nav-menu .mud-nav-link:hover {
    background: rgba(255, 255, 255, 0.08);
    color: var(--ds-text-inverse);
}

[b-0qsqxmviof] .admin-nav-menu .mud-nav-link.active {
    background: rgba(255, 255, 255, 0.12);
    color: var(--ds-text-inverse);
    font-weight: 600;
    border-left: 3px solid var(--ds-white);
}

[b-0qsqxmviof] .admin-nav-menu .mud-nav-link .mud-icon-root {
    color: rgba(255, 255, 255, 0.7);
}

[b-0qsqxmviof] .admin-nav-menu .mud-nav-link.active .mud-icon-root {
    color: var(--ds-text-inverse);
}
/* /Components/Layout/HostedLayout.razor.rz.scp.css */
.hosted-layout[b-csgah3skhw] {
    min-height: 100vh;
    background: #f8f9fa;
}
/* /Components/Layout/MainLayout.razor.rz.scp.css */
.page[b-2jd4njen66] {
    position: relative;
    display: flex;
    flex-direction: column;
}

/* min-width: 0 is load-bearing, not tidying. From 641px up .page is a flex row of a
   280px sidebar that does not shrink and this column, and a flex item's min-width
   defaults to auto - meaning it refuses to become narrower than its own min-content.
   The dashboard's min-content is about 499px, so between the sidebar appearing and the
   viewport reaching roughly 820px the row demanded 779px inside 768 and the whole page
   scrolled sideways by about 11px. Everything inside this column already carries
   min-width: 0 and shrinks; this was the one floor in the chain. */
main[b-2jd4njen66] {
    flex: 1;
    min-width: 0;
    background-color: #eef2f7;
}

.sidebar[b-2jd4njen66] {
    background-image: linear-gradient(180deg, #0b3c8a 0%, #1a52c9 100%);
}

/* The greeting is one line inside a bar of fixed height. These four declarations used to
   live only in the phone media query below - the width where they matter least, because
   there the sidebar is hidden and the bar is full width. From 641px up the sidebar takes
   280px, the bar is at its narrowest relative to its content, and a flex item whose
   min-width is auto cannot shrink past its own longest word: the title wrapped to five
   lines and spilled out of a 3.5rem bar onto the page beneath it. It truncates at every
   width now, which is what the fixed height always assumed. */
.top-row[b-2jd4njen66]  .mud-typography-h6 {
    min-width: 0;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.top-row[b-2jd4njen66] {
    background-color: #f7f7f7;
    border-bottom: 1px solid #d6d5d5;
    justify-content: flex-start;
    height: 3.5rem;
    display: flex;
    align-items: center;
    gap: 1rem;
}

    .top-row[b-2jd4njen66]  a, .top-row[b-2jd4njen66]  .btn-link {
        white-space: nowrap;
        margin-left: 1.5rem;
        text-decoration: none;
    }

    .top-row[b-2jd4njen66]  a:hover, .top-row[b-2jd4njen66]  .btn-link:hover {
        text-decoration: underline;
    }

    .top-row[b-2jd4njen66]  a:first-child {
        overflow: hidden;
        text-overflow: ellipsis;
    }

@media (max-width: 640.98px) {
    .top-row[b-2jd4njen66] {
        justify-content: space-between;
        gap: 0.5rem;
        padding-left: 0.5rem !important;
        padding-right: 0.5rem !important;
    }

    .top-row[b-2jd4njen66]  .mud-typography-h6 {
        margin-left: 0 !important;
        font-size: var(--ds-text-16);
    }

    /* DashboardHome's greeting title. That page used to carry `.top-row .mud-typography-h6
       { min-width: 0; font-size: 0.95rem; line-height: 1.2 }` in its own style block, which
       applied only while it was mounted; the rule above outranked it on min-width and
       font-size, so line-height was the one declaration that ever took effect. */
    main:has(.dashboard-home) .top-row[b-2jd4njen66]  .mud-typography-h6 {
        line-height: 1.2;
    }

    .top-row[b-2jd4njen66]  a, .top-row[b-2jd4njen66]  .btn-link {
        margin-left: 0;
    }
}

@media (min-width: 641px) {
    .page[b-2jd4njen66] {
        flex-direction: row;
    }

    .sidebar[b-2jd4njen66] {
        width: 280px; /* Increased from 250px */
        flex-shrink: 0;
        height: 100vh;
        position: sticky;
        top: 0;
        overflow: hidden;
        transition: width 0.2s ease;
    }

    .sidebar.sidebar-collapsed[b-2jd4njen66] {
        width: 0;
    }

    .sidebar.sidebar-collapsed[b-2jd4njen66]  nav,
    .sidebar.sidebar-collapsed[b-2jd4njen66]  .mud-navmenu,
    .sidebar.sidebar-collapsed[b-2jd4njen66]  .mud-drawer-content {
        display: none;
    }

    .top-row[b-2jd4njen66] {
        position: sticky;
        top: 0;
        z-index: 1;
    }

    .top-row.auth[b-2jd4njen66]  a:first-child {
        flex: 1;
        text-align: right;
        width: 0;
    }

    .top-row[b-2jd4njen66], article[b-2jd4njen66] {
        padding-left: 2rem !important;
        padding-right: 1.5rem !important;
    }
}

#blazor-error-ui[b-2jd4njen66] {
    color-scheme: light only;
    background: lightyellow;
    bottom: 0;
    box-shadow: 0 -1px 2px rgba(0, 0, 0, 0.2);
    box-sizing: border-box;
    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-2jd4njen66] {
        cursor: pointer;
        position: absolute;
        right: 0.75rem;
        top: 0.5rem;
    }
/* /Components/Layout/MinimalLayout.razor.rz.scp.css */
.minimal-layout[b-q03h3v6oqr] {
    display: flex;
    flex-direction: column;
    min-height: 100vh;
    background:
        radial-gradient(circle at 30% 20%, rgba(255,255,255,0.08), transparent 40%),
        linear-gradient(135deg, #0b3c8a 0%, #1e5fd8 100%);
}

.minimal-content[b-q03h3v6oqr] {
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 2rem 0;
}
/* /Components/Layout/ModernUserInfoCard.razor.rz.scp.css */
.modern-user-card[b-hffe7zw6i1] {
    background: transparent;
}

.action-buttons[b-hffe7zw6i1] {
    display: flex;
    gap: 4px;
    justify-content: flex-start;
    margin-top: 8px;
}

/* The icon buttons are MudIconButtons, which render their own elements. */
.action-buttons[b-hffe7zw6i1]  .action-icon-btn {
    width: 36px;
    height: 36px;
    background: white;
    border: 1px solid var(--ds-border);
    border-radius: 8px;
    transition: all 0.2s ease;
}

.action-buttons[b-hffe7zw6i1]  .action-icon-btn:hover {
    background: #f5f5f5;
    border-color: var(--ds-primary);
    transform: translateY(-1px);
    box-shadow: 0 2px 4px rgba(0,0,0,0.1);
}

/* No hover background here: Color.Error gives the button MudBlazor's
   `hover:mud-error-hover` class, whose background-color is !important. */
.action-buttons[b-hffe7zw6i1]  .logout-btn:hover {
    border-color: var(--ds-error);
}

/* There is deliberately no icon-size rule. The component's old <style> block had
   `.action-icon-btn ::deep .mud-icon-root { font-size: 18px }`, which a plain style
   element cannot parse, so the icon has always used MudBlazor's own size. It was
   removed rather than revived, because reviving it would change the rendered size. */
/* /Components/Layout/NavMenu.razor.rz.scp.css */
/* Moved from the style block that used to sit in NavMenu.razor. They come first so that,
   at equal (scoped) specificity, the rules below still win every conflict - as they did
   when these were unscoped and so ranked below every rule in this file. */

/* User Profile Card */
.user-profile-card[b-xag6uafnjk] {
    padding: 16px;
    margin: 16px 12px;
    background: var(--ds-surface-alt);
    border-radius: 12px;
    border: 1px solid var(--ds-border);
}

/* Nav Section Label (subtle) */
.nav-section-label[b-xag6uafnjk] {
    padding: 12px 16px 8px 16px;
    font-size: var(--ds-text-12);
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: var(--ds-text-muted);
}

/* Subtle Divider */
.nav-divider[b-xag6uafnjk] {
    height: 1px;
    background: linear-gradient(90deg, transparent 0%, var(--ds-border) 50%, transparent 100%);
    margin: 0 16px;
}

/* The nav-link and icon styling that used to sit in that style block targeted
   `.modern-nav-menu ::deep .mud-nav-link` and friends. ::deep is a CSS-isolation
   construct that the Razor compiler rewrites in a .razor.css file; inside a plain, non-isolated
   style element it reaches the browser literally, and the CSS parser discards every
   rule containing it. Those eight rules therefore never applied, and the menu has
   always rendered with MudBlazor's own nav-link styling. Removed rather than
   corrected: making them work would change how the menu looks. */

/* Smooth Scrolling */
.nav-scrollable[b-xag6uafnjk] {
    overflow-y: auto;
    overflow-x: hidden;
    height: calc(100vh - 60px);
}

.nav-scrollable[b-xag6uafnjk]::-webkit-scrollbar {
    width: 6px;
}

.nav-scrollable[b-xag6uafnjk]::-webkit-scrollbar-track {
    background: transparent;
}

.nav-scrollable[b-xag6uafnjk]::-webkit-scrollbar-thumb {
    background: rgba(0, 0, 0, 0.15);
    border-radius: 3px;
}

.nav-scrollable[b-xag6uafnjk]::-webkit-scrollbar-thumb:hover {
    background: rgba(0, 0, 0, 0.25);
}

/* Top Row Height */
.top-row[b-xag6uafnjk] {
    height: 60px;
    display: flex;
    align-items: center;
}

/* Category Quick Filters (Nested) */
.category-filters[b-xag6uafnjk] {
    padding: 0 12px 2px 12px; /* Further reduced top padding to 0 */
    margin-left: 36px; /* Indent under parent nav item - reduced for better badge visibility */
}

.category-filter-link[b-xag6uafnjk] {
    display: flex;
    align-items: center; /* Center align for single-line layout */
    gap: 6px;
    padding: 6px 10px; /* Slightly increased for better click target */
    margin: 0;
    border-radius: 6px;
    text-decoration: none;
    color: var(--ds-text-secondary);
    font-size: var(--ds-text-13);
    line-height: 1.4;
    transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
    min-height: 32px; /* Increased for better usability */
}

.category-filter-link:hover[b-xag6uafnjk] {
    background: var(--ds-surface-sunken);
    color: var(--ds-text-body);
}

.category-filter-link.active[b-xag6uafnjk] {
    background: var(--ds-primary-surface);
    color: var(--ds-primary-strong);
    font-weight: 600;
}

/* Empty categories (0 count) - muted style */
.category-filter-link.empty[b-xag6uafnjk] {
    color: var(--ds-text-muted);
    cursor: default;
}

.category-filter-link.empty:hover[b-xag6uafnjk] {
    background: var(--ds-surface-alt);
    color: var(--ds-text-muted);
}

.category-filter-link.empty.active[b-xag6uafnjk] {
    background: var(--ds-surface-sunken);
    color: var(--ds-text-secondary);
}

/* Bullet point */
.category-bullet[b-xag6uafnjk] {
    flex-shrink: 0;
    font-size: var(--ds-text-14);
    line-height: 1.4;
    font-weight: bold;
    margin-right: 4px;
}

/* Category name with text truncation */
.category-filter-link .category-name[b-xag6uafnjk] {
    flex: 1;
    min-width: 0; /* Allow flex item to shrink below content size */
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap; /* Single line only */
    line-height: 1.4;
    max-width: 160px; /* Limit width to ensure badge visibility */
}

/* Count badge */
.category-filter-link .category-count[b-xag6uafnjk] {
    flex-shrink: 0;
    background: var(--ds-surface-chip);
    /* This count is 10px and semibold, so it gets no large-text exemption, and
       --ds-text-secondary on the chip is 3.9:1 - it has to be read, so it takes the
       next role down the ramp at 8.3:1 rather than a value off the ramp. */
    color: var(--ds-text-body);
    padding: 2px 6px;
    border-radius: 10px;
    font-size: var(--ds-text-10);
    font-weight: 600;
    margin-left: 4px;
    min-width: 20px;
    text-align: center;
    line-height: 1.4;
}

.category-filter-link.active .category-count[b-xag6uafnjk] {
    background: var(--ds-blue-200);
    color: var(--ds-primary-strong);
}

/* ------------------------------------------------------------------------- */

/* Modern Mobile Toggle Button */
.navbar-toggler[b-xag6uafnjk] {
    appearance: none;
    cursor: pointer;
    width: 3rem;
    height: 2.5rem;
    color: white;
    position: absolute;
    top: 0.5rem;
    right: 1rem;
    border: 1px solid rgba(255, 255, 255, 0.2);
    border-radius: 8px;
    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.9%29' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e") no-repeat center/1.5rem rgba(255, 255, 255, 0.1);
    transition: all 0.2s ease;
}

.navbar-toggler:hover[b-xag6uafnjk] {
    background-color: rgba(255, 255, 255, 0.2);
    transform: scale(1.05);
}

.navbar-toggler:checked[b-xag6uafnjk] {
    background-color: rgba(255, 255, 255, 0.3);
}

/* Enhanced Top Row */
.top-row[b-xag6uafnjk] {
    min-height: 3.5rem;
    display: flex;
    align-items: center;
}

/* Mobile Menu Behavior with Smooth Animation */
.nav-scrollable[b-xag6uafnjk] {
    display: none;
    animation: slideIn-b-xag6uafnjk 0.3s ease-out;
}

@keyframes slideIn-b-xag6uafnjk {
    from {
        opacity: 0;
        transform: translateX(-20px);
    }
    to {
        opacity: 1;
        transform: translateX(0);
    }
}

.navbar-toggler:checked ~ .nav-scrollable[b-xag6uafnjk] {
    display: block;
}

/* Desktop Sidebar Styling */
@media (min-width: 641px) {
    .navbar-toggler[b-xag6uafnjk] {
        display: none;
    }

    .nav-scrollable[b-xag6uafnjk] {
        display: block;
        height: calc(100vh - 3.5rem);
        background: linear-gradient(180deg, #FAFAFA 0%, #F5F5F5 100%);
        border-right: 1px solid #E0E0E0;
    }
}

/* Allow sidebar to scroll smoothly */
.nav-scrollable[b-xag6uafnjk] {
    overflow-y: auto;
    overflow-x: hidden;
    padding: 8px 0;
}

/* Beautiful focus states */
.nav-scrollable:focus-within[b-xag6uafnjk] {
    outline: 2px solid var(--mud-palette-primary);
    outline-offset: -2px;
}
/* /Components/Layout/PrometheonLayout.razor.rz.scp.css */
/* The public header. The container and brand classes it also uses are shared with
   the pages and PrometheonFooter, so their rules live in styles/shared/public-pages.css. */

.prometheon-header[b-lw2rfihzvq] {
    background: var(--prometheon-hero-bg);
    color: var(--ds-text-inverse);
    height: 64px;
    border-bottom: none;
    box-shadow: none;
}

.prometheon-header-inner[b-lw2rfihzvq] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 2rem;
    height: 64px;
    padding: 0;
}

.prometheon-nav[b-lw2rfihzvq] {
    display: flex;
    align-items: center;
    gap: 1.5rem;
    font-size: 0.95rem;
}

.prometheon-nav-link[b-lw2rfihzvq] {
    color: var(--ds-text-inverse);
    text-decoration: none;
    font-weight: 500;
    opacity: 0.9;
    transition: opacity 0.15s ease;
}

.prometheon-nav-link:hover[b-lw2rfihzvq] {
    opacity: 1;
}

.prometheon-nav-link--active[b-lw2rfihzvq] {
    opacity: 1;
    border-bottom: 2px solid rgba(255, 255, 255, 0.8);
    padding-bottom: 2px;
}

.prometheon-header-actions[b-lw2rfihzvq] {
    display: flex;
    align-items: center;
    gap: 12px;
}

.ph-btn-cta[b-lw2rfihzvq] {
    background: var(--ds-primary);
    color: var(--ds-text-inverse);
    border: 1px solid rgba(255, 255, 255, 0.4);
    border-radius: 8px;
    padding: 8px 16px;
    font-weight: 600;
    font-size: 0.9rem;
    cursor: pointer;
    text-decoration: none;
    transition: background 0.15s ease;
}

.ph-btn-cta:hover[b-lw2rfihzvq] {
    background: var(--ds-primary-hover);
}

.ph-btn-secondary[b-lw2rfihzvq] {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    background: transparent;
    border: 1px solid rgba(255, 255, 255, 0.35);
    color: var(--ds-text-inverse);
    border-radius: 8px;
    padding: 8px 16px;
    font-weight: 500;
    font-size: 0.9rem;
    text-decoration: none;
    transition: background 0.15s ease, border-color 0.15s ease;
}

.ph-btn-secondary:hover[b-lw2rfihzvq] {
    background: rgba(255, 255, 255, 0.1);
    border-color: rgba(255, 255, 255, 0.6);
}

@media (max-width: 768px) {
    /* The shared .prometheon-container narrows to 1.25rem here. In the old single
       style block that rule came after `.prometheon-header-inner { padding: 0 }` and
       so won on phones; scoped, this rule outranks it, so the padding is restated. */
    .prometheon-header-inner[b-lw2rfihzvq] {
        flex-wrap: wrap;
        gap: 1rem;
        padding: 0 1.25rem;
    }

    .prometheon-nav[b-lw2rfihzvq] {
        order: 3;
        width: 100%;
        justify-content: center;
        gap: 1rem;
        padding-top: 0.75rem;
        border-top: 1px solid rgba(255, 255, 255, 0.15);
    }
}
/* /Components/Pages/Admin/Dashboard.razor.rz.scp.css */
.admin-dashboard-header[b-2icyr4xv10] {
    margin-bottom: 24px;
}

[b-2icyr4xv10] .admin-stat-card {
    background: var(--ds-surface);
    border: 1px solid var(--ds-border);
    border-radius: 12px;
    padding: 20px;
    display: flex;
    flex-direction: column;
    gap: 8px;
    transition: border-color 0.15s ease;
}

[b-2icyr4xv10] .admin-stat-card:hover {
    border-color: var(--ds-border-emphasis);
}

.admin-stat-icon[b-2icyr4xv10] {
    width: 40px;
    height: 40px;
    border-radius: 10px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 4px;
}

[b-2icyr4xv10] .admin-pending-card {
    background: var(--ds-surface);
    border: 1px solid var(--ds-border);
    border-radius: 12px;
    padding: 20px;
}

.admin-pending-row[b-2icyr4xv10] {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 10px 12px;
    border-radius: 8px;
    cursor: pointer;
    transition: background 0.15s ease;
}

.admin-pending-row:hover[b-2icyr4xv10] {
    background: var(--ds-surface-alt);
}

.admin-pending-text[b-2icyr4xv10] {
    flex: 1;
    font-size: var(--ds-text-14);
    color: var(--ds-text-body);
}
/* /Components/Pages/Admin/Targeting/LeadSuggestions.razor.rz.scp.css */
/* The rows are rendered by MudTable (RowClass="cursor-pointer"). The pointer cursor
   itself comes from MudBlazor's .cursor-pointer utility; this adds the hover tint. */
.admin-dashboard[b-8gf4st5nyx]  .cursor-pointer:hover {
    background-color: var(--ds-surface-alt) !important;
}
/* /Components/Pages/Analytics.razor.rz.scp.css */
.mi-cat-row[b-wxvzk7vehw] {
    margin-bottom: 14px;
}

.mi-cat-row:last-child[b-wxvzk7vehw] {
    margin-bottom: 0;
}

.mi-trend-chart[b-wxvzk7vehw] {
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    height: 160px;
    gap: 8px;
    padding: 8px 0 0;
}

.mi-trend-col[b-wxvzk7vehw] {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    height: 100%;
}

.mi-trend-bar[b-wxvzk7vehw] {
    width: 100%;
    background: var(--ds-indigo-500);
    border-radius: 3px 3px 0 0;
    display: flex;
    align-items: flex-start;
    justify-content: center;
    padding-top: 4px;
    margin-top: auto;
}

.mi-trend-val[b-wxvzk7vehw] {
    color: white;
    font-size: var(--ds-text-11);
    font-weight: 600;
}

.mi-trend-lbl[b-wxvzk7vehw] {
    margin-top: 6px;
    font-size: var(--ds-text-11);
    color: var(--ds-text-muted);
    text-align: center;
}

.mi-rfq-row[b-wxvzk7vehw] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 12px 8px;
    margin: 0 -8px;
    border-bottom: 1px solid var(--ds-divider);
    cursor: pointer;
    border-radius: 4px;
    transition: background-color 0.15s;
}

.mi-rfq-row:last-child[b-wxvzk7vehw] {
    border-bottom: none;
}

.mi-rfq-row:hover[b-wxvzk7vehw] {
    background-color: var(--ds-surface-alt);
}

/* ── Patterns that were repeated inline ─────────────────────
   Five identical metric cards, and six text treatments used three to five times
   each. Everything here is the declaration string that used to sit in the style
   attribute, unchanged.

   Most of them land on a MudBlazor component, and a child component's rendered
   element never carries this component's scope attribute, so those go through
   ::deep. The bar track is a plain <div> of ours and does not need it. */
[b-wxvzk7vehw] .mi-card {
    border: 1px solid var(--ds-border);
    border-radius: 8px;
    height: 100%;
}

[b-wxvzk7vehw] .mi-value {
    font-weight: 700;
    color: var(--ds-text-primary);
}

[b-wxvzk7vehw] .mi-hint {
    color: var(--ds-text-muted);
    margin-top: 2px;
}

[b-wxvzk7vehw] .mi-caps {
    color: var(--ds-text-muted);
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

/* The trailing count beside a row label. */
[b-wxvzk7vehw] .mi-row-meta {
    color: var(--ds-text-muted);
    font-weight: 600;
    flex-shrink: 0;
    margin-left: 8px;
}

.mi-bar-track[b-wxvzk7vehw] {
    height: 4px;
    background: var(--ds-surface-sunken);
    border-radius: 2px;
}
/* /Components/Pages/Dashboard/Billing.razor.rz.scp.css */
.billing-plans[b-t3oxumwu3y] { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 220px), 1fr)); gap: 16px; }
.billing-summary[b-t3oxumwu3y] { background: white; border: 1px solid var(--ds-border); border-radius: 12px; padding: 28px; }
.billing-summary-heading[b-t3oxumwu3y] { display: flex; justify-content: space-between; align-items: center; gap: 16px; flex-wrap: wrap; }
.billing-details[b-t3oxumwu3y], .billing-balances[b-t3oxumwu3y] { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px; margin-top: 28px; }
.billing-details dt[b-t3oxumwu3y], .billing-balances span[b-t3oxumwu3y] { color: var(--ds-text-body); font-size: var(--ds-text-14); margin-bottom: 8px; }
.billing-details dd[b-t3oxumwu3y] { margin: 0; font-weight: 600; }
.billing-balances > div[b-t3oxumwu3y] { display: flex; flex-direction: column; padding: 16px; background: var(--ds-surface-alt); border-radius: 8px; }
.billing-balances strong[b-t3oxumwu3y] { font-size: var(--ds-text-24); }
@media (max-width: 600px) { .billing-details[b-t3oxumwu3y], .billing-balances[b-t3oxumwu3y] { grid-template-columns: 1fr; } .billing-summary[b-t3oxumwu3y] { padding: 20px; } }
/* /Components/Pages/Dashboard/CustomerAcquisitionSuite.razor.rz.scp.css */
.suite-page[b-mtcnkdlx3a] { max-width: 1400px; margin: auto; }
.suite-hero[b-mtcnkdlx3a] { padding: clamp(24px, 5vw, 56px); border: 1px solid var(--ds-indigo-100); border-radius: 16px; background: linear-gradient(120deg, var(--ds-indigo-50), var(--ds-surface)); }
.suite-hero[b-mtcnkdlx3a]  h1 { max-width: 850px; font-size: clamp(1.8rem, 3vw, 2.8rem); line-height: 1.2; font-weight: 700; }
.suite-hero[b-mtcnkdlx3a]  p, .suite-final[b-mtcnkdlx3a]  p { max-width: 800px; }
.suite-actions[b-mtcnkdlx3a] { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 28px; }
.suite-card[b-mtcnkdlx3a] { height: 100%; padding: 28px; background: white; border: 1px solid var(--ds-border); border-radius: 12px; }
.suite-workflow[b-mtcnkdlx3a] { margin: 40px 0; }
.suite-workflow ol[b-mtcnkdlx3a] { list-style: none; padding: 0; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; margin-top: 24px; counter-reset: steps; }
.suite-workflow li[b-mtcnkdlx3a] { display: flex; flex-direction: column; gap: 12px; border-top: 3px solid var(--ds-primary-surface); padding: 20px; background: var(--ds-surface-alt); border-radius: 8px; counter-increment: steps; }
.suite-workflow strong[b-mtcnkdlx3a]::before { content: counter(steps) ". "; color: var(--ds-indigo-600); }
.suite-workflow span[b-mtcnkdlx3a] { color: var(--ds-text-body); font-size: var(--ds-text-14); }
.suite-final[b-mtcnkdlx3a] { padding: clamp(24px, 4vw, 40px); border: 1px solid var(--ds-border); background: white; border-radius: 12px; }
.suite-pricing-block[b-mtcnkdlx3a] { margin: 40px 0; }
@media (max-width: 800px) { .suite-workflow ol[b-mtcnkdlx3a] { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 480px) { .suite-workflow ol[b-mtcnkdlx3a] { grid-template-columns: 1fr; } .suite-actions[b-mtcnkdlx3a] { flex-direction: column; align-items: stretch; } }
/* /Components/Pages/Dashboard/DashboardHome.razor.rz.scp.css */
/* Moved from the style block that used to sit in DashboardHome.razor. They come first so
   that, at equal (scoped) specificity, the rules below still win any conflict - as they
   did when these were unscoped. The app-bar greeting rule went to MainLayout.razor.css. */

/* The dismiss control sits over the banner's top-right corner. The row below reserves space
   for it so the heading never runs underneath. */
[b-df0cq89xci] .supplier-visibility-banner {
    position: relative;
}

.supplier-visibility-banner .supplier-plan-banner-row[b-df0cq89xci] {
    padding-right: 28px;
}

[b-df0cq89xci] .supplier-visibility-banner-dismiss {
    position: absolute;
    top: 4px;
    right: 4px;
    color: var(--ds-text-secondary);
}

[b-df0cq89xci] .supplier-visibility-banner-dismiss:hover {
    color: var(--ds-blue-900);
}

/* Wraps rather than never wrapping. The rule below handles phones, but it keys off
   767.98px while the sidebar appears at 641px, so between those two the content column
   is already narrow and this row was still refusing to reflow - the actions are
   flex: 0 0 auto and simply pushed the page wider. Wrapping lets flex decide on the
   width the column actually has: the buttons drop under the message when there is no
   room for both and sit beside it when there is, so the desktop row is unchanged. */
.supplier-plan-banner-row[b-df0cq89xci] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 16px;
    width: 100%;
}

/* flex-basis 0, not auto. With the row wrapping, an auto basis means the message asks
   for its max-content width when the browser decides where to break the line - so a
   message that would happily shrink pushed the buttons onto a second row even at 1440,
   where both fitted side by side. At zero it takes the space left over instead, and the
   row still wraps when the buttons alone no longer fit. */
[b-df0cq89xci] .supplier-plan-banner-message {
    flex: 1 1 0;
    min-width: 0;
    font-size: 0.95rem;
    line-height: 1.4;
}

.supplier-plan-banner-actions[b-df0cq89xci] {
    display: flex;
    align-items: center;
    flex: 0 0 auto;
    flex-wrap: nowrap;
    gap: 8px;
}

@media (max-width: 767.98px) {
    .supplier-plan-banner-row[b-df0cq89xci],
    .supplier-plan-banner-actions[b-df0cq89xci] {
        flex-wrap: wrap;
    }

    .supplier-plan-banner-actions[b-df0cq89xci],
    .supplier-plan-banner-actions > div[b-df0cq89xci] {
        width: 100%;
        min-width: 0;
    }

    .supplier-plan-banner-actions[b-df0cq89xci]  .mud-button-root {
        max-width: 100%;
    }

    .supplier-plan-banner-actions[b-df0cq89xci]  .mud-button-label {
        min-width: 0;
        white-space: normal;
    }
}

[b-df0cq89xci] .kpi-tile {
    cursor: pointer;
    transition: transform 0.12s ease, box-shadow 0.12s ease;
}

[b-df0cq89xci] .kpi-tile:hover {
    transform: translateY(-1px);
    box-shadow: 0 6px 18px rgba(17, 24, 39, 0.08);
}

/* Pulse dot animation for newly created RFQs */
.pulse-dot[b-df0cq89xci] {
    width: 8px;
    height: 8px;
    border-radius: 999px;
    display: inline-block;
    margin-right: 6px;
    background: var(--ds-success);
    position: relative;
}

.pulse-dot[b-df0cq89xci]::after {
    content: "";
    position: absolute;
    inset: -6px;
    border-radius: 999px;
    border: 2px solid rgba(16, 185, 129, 0.45);
    animation: pulsePing-b-df0cq89xci 1.2s ease-out infinite;
}

@keyframes pulsePing-b-df0cq89xci {
    0% {
        transform: scale(0.6);
        opacity: 0.9;
    }
    100% {
        transform: scale(1.6);
        opacity: 0;
    }
}

/* Guidance UX styles for newly created RFQs */
.rfq-title-wrap[b-df0cq89xci] {
    position: relative;
    display: inline-flex;
    align-items: center;
    gap: 8px;
}

.rfq-tip[b-df0cq89xci] {
    position: absolute;
    left: 0;
    bottom: calc(100% + 8px);
    background: var(--ds-success);
    color: var(--ds-text-inverse);
    font-size: var(--ds-text-12);
    padding: 8px 12px;
    border-radius: 8px;
    white-space: nowrap;
    box-shadow: 0 4px 12px rgba(16, 185, 129, 0.3);
    z-index: 2;
    pointer-events: none;
}

.rfq-tip[b-df0cq89xci]::after {
    content: "";
    position: absolute;
    top: 100%;
    left: 14px;
    border-width: 6px 6px 0 6px;
    border-style: solid;
    border-color: var(--ds-success) transparent transparent transparent;
}

.rfq-coach[b-df0cq89xci] {
    margin-left: 16px;
    margin-top: 4px;
    font-size: var(--ds-text-12);
    color: var(--ds-text-secondary);
}

/* ------------------------------------------------------------------------- */

/* Recent Items */
.recent-item[b-df0cq89xci] {
    padding: 12px 16px;
    transition: background 0.18s ease;
}

.recent-item:hover[b-df0cq89xci] {
    background: rgba(47, 111, 228, 0.04);
}

/* Unviewed Row Highlight */
.recent-item.unviewed[b-df0cq89xci] {
    background: linear-gradient(to right, rgba(47, 111, 228, 0.05), transparent);
    border-left: 3px solid var(--ds-primary);
}

/* Dashboard Table Row Interactions */
.dashboard-row[b-df0cq89xci] {
    transition: background 0.18s ease, border-left 0.18s ease;
    border-left: 3px solid transparent;
}

.dashboard-row:hover[b-df0cq89xci] {
    background: var(--ds-surface-alt);
    border-left: 3px solid var(--ds-info);
}

/* Focus States (Accessibility) */
[b-df0cq89xci] .mud-button-root:focus-visible {
    outline: none;
    box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.2);
}

[b-df0cq89xci] .mud-input:focus-within {
    box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.2);
}

/* Clickable Icon Feedback */
[b-df0cq89xci] .mud-icon-button:hover .mud-icon-root {
    transform: scale(1.05);
}

[b-df0cq89xci] .mud-icon-button .mud-icon-root {
    transition: transform 0.18s ease;
}


/* ── Patterns lifted out of repeated inline styles ────────────────────────── */

/* The KPI tiles: MudPaper, so the tile itself is reached with ::deep. */
[b-df0cq89xci] .kpi-tile {
    min-height: 120px;
}

[b-df0cq89xci] .kpi-value {
    color: var(--ds-text-primary);
    font-weight: var(--ds-weight-semibold);
    font-size: var(--ds-text-28);
}

/* Tile accents. Decorative per-tile colours, not status. */
[b-df0cq89xci] .kpi-icon--info {
    color: var(--ds-blue-500);
}

[b-df0cq89xci] .kpi-chip--info {
    background: var(--ds-info-surface);
}

/* The banner action buttons sit on a tinted banner, so they carry their own
   resting colours rather than the shared button intents. */
[b-df0cq89xci] .banner-action {
    border-color: var(--ds-border-emphasis);
    color: var(--ds-blue-900);
    background: var(--ds-surface);
}

/* Table header strip for the dashboard's own lists. */
.table-head-row[b-df0cq89xci] {
    background: var(--ds-surface-alt);
    border-top: 1px solid var(--ds-border);
    border-bottom: 1px solid var(--ds-border);
}

/* The dot between two metadata values. */
[b-df0cq89xci] .meta-dot {
    font-size: 8px;
    color: var(--ds-text-muted);
}

/* The shortcut tiles are an avatar, a label and a trailing icon on one line. Three of
   them share a row from MudBlazor's sm breakpoint upward, and sm is a VIEWPORT width -
   but the column these sit in is the viewport minus a 280px sidebar, so at 767px each
   tile is about 137px. A nowrap row in 137px pushed the trailing icon clean off the
   page, 21px past the viewport edge, because nothing in the row could shrink.

   Wrapping lets the label drop under the avatar when the tile is narrow and changes
   nothing once there is room for one line, which is every width where the tiles are
   comfortable anyway. */
.dash-tile-row[b-df0cq89xci] {
    flex-wrap: wrap;
}

.dash-tile-row[b-df0cq89xci]  .mud-typography {
    min-width: 0;
}
/* /Components/Pages/Dashboard/EditProfile.razor.rz.scp.css */
/* Patterns lifted out of repeated inline styles on this page. The field label and
   its hint appear once per editable field; the upload box once per upload slot.
   All three sit on MudText/MudPaper, so they are reached with ::deep. */

[b-5angnvp9nw] .field-label {
    font-weight: var(--ds-weight-medium);
    color: var(--ds-text-primary);
    margin-bottom: 8px;
}

[b-5angnvp9nw] .field-hint {
    color: var(--ds-text-muted);
    margin-bottom: 8px;
    display: block;
}

[b-5angnvp9nw] .upload-box {
    border: 1px dashed var(--ds-border);
    border-radius: 8px;
    padding: 16px;
    text-align: center;
}

[b-5angnvp9nw] .section-hint {
    color: var(--ds-text-muted);
    margin-bottom: 16px;
}

[b-5angnvp9nw] .section-hint--loose {
    color: var(--ds-text-muted);
    margin-bottom: 24px;
}

[b-5angnvp9nw] .section-title {
    font-weight: var(--ds-weight-semibold);
    color: var(--ds-text-primary);
    margin-bottom: 4px;
}
/* /Components/Pages/Dashboard/MyProposalDetails.razor.rz.scp.css */
.rfq-snapshot-desc[b-l5xb4ec0nt] {
    display: -webkit-box;
    -webkit-line-clamp: 4;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.rfq-snapshot-toggle[b-l5xb4ec0nt] {
    background: none;
    border: none;
    padding: 4px 0 0;
    cursor: pointer;
    color: var(--ds-indigo-500);
    font-size: var(--ds-text-13);
    font-weight: 500;
}

.rfq-snapshot-toggle:hover[b-l5xb4ec0nt] {
    text-decoration: underline;
}

.rfq-snapshot-meta[b-l5xb4ec0nt] {
    margin-bottom: 12px;
}

.status-pill[b-l5xb4ec0nt] {
    display: inline-flex;
    align-items: center;
    padding: 5px 14px;
    border-radius: 20px;
    font-size: var(--ds-text-13);
    font-weight: 600;
    letter-spacing: 0.02em;
    white-space: nowrap;
    flex-shrink: 0;
}

.status-pill-interested[b-l5xb4ec0nt] {
    background: var(--ds-warning-surface);
    color: var(--ds-warning-text);
}

.status-pill-accepted[b-l5xb4ec0nt] {
    background: var(--ds-success-surface);
    color: var(--ds-success-text);
}

.status-pill-rejected[b-l5xb4ec0nt] {
    background: var(--ds-error-surface);
    color: var(--ds-error-text);
}

.status-pill-default[b-l5xb4ec0nt] {
    background: var(--ds-surface-sunken);
    color: var(--ds-gray-600);
}

/* ── Patterns that were repeated inline ─────────────────────
   The micro-label above a value appears six times; the section title and the
   trailing hint twice each. Declarations unchanged. ::deep because MudText's
   rendered element does not carry this component's scope attribute. */
[b-l5xb4ec0nt] .mpd-micro-label {
    color: var(--ds-text-muted);
    text-transform: uppercase;
    font-size: 10px;
    font-weight: 600;
    letter-spacing: 0.5px;
}

/* A qualifier trailing a heading, deliberately lighter than it. */
.mpd-trailing-note[b-l5xb4ec0nt] {
    font-weight: 400;
    color: var(--ds-text-muted);
    font-size: 12px;
    margin-left: 8px;
}
/* /Components/Pages/Dashboard/ProposalList.razor.rz.scp.css */
/* ---------------------------------------------------------------------------
   Moved here from the <style> block in ProposalList.razor.

   These rules only ever styled this page's own markup, so component isolation is
   where they belong: scoped, they can no longer reach anything else. A Razor <style>
   block is injected at render time, after every linked stylesheet, which made these
   rules outrank the application's own CSS for reasons that had nothing to do with
   ownership.

   Carried across otherwise verbatim. Two edits were needed: Razor's @@ escaping of
   at-rules is undone, and the three rules that reach a MudBlazor component root
   become ::deep (see below).
   --------------------------------------------------------------------------- */
/* Header */
.proposals-header[b-7mhuhtoc4e] {
    margin-bottom: 32px;
}

.header-content[b-7mhuhtoc4e] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 24px;
    flex-wrap: wrap;
}

.header-left[b-7mhuhtoc4e] {
    flex: 1;
    min-width: 300px;
}

/* ::deep on the next three rules only.

   .search-field and .status-filter-field are handed to MudTextField / MudSelect
   through Class="...", so they land on those components' own root elements, which
   never carry this page's isolation attribute. Scoped normally they would match
   nothing at all; ::deep moves the attribute to an ancestor the page does render.
   Every other rule in this file styles markup this page renders itself and is
   scoped normally.

   Note that .search-field is also styled in wwwroot/styles/shared/dashboard-list.css.
   As a render-time <style> block these rules simply came last; as ::deep they carry
   the ancestor attribute and so outrank the bare .search-field there on specificity
   instead of on load order. The winner is unchanged. */

[b-7mhuhtoc4e] .status-filter-field {
    width: 170px;
}

/* Table Header */
.table-header-row[b-7mhuhtoc4e] {
    display: grid;
    grid-template-columns: 2fr 1fr 120px 130px 130px 90px;
    gap: 16px;
    padding: 16px 24px;
    background: var(--ds-surface-alt);
    border-bottom: 1px solid var(--ds-border);
}

.table-row[b-7mhuhtoc4e] {
    display: grid;
    grid-template-columns: 2fr 1fr 120px 130px 130px 90px;
    gap: 16px;
    padding: 20px 24px;
    border-bottom: 1px solid var(--ds-divider);
    transition: all 0.15s ease;
}

/* Tender Column */
.td-tender[b-7mhuhtoc4e] {
    flex-direction: column;
    align-items: flex-start;
    gap: 4px;
}

.tender-title[b-7mhuhtoc4e] {
    font-weight: 600;
    font-size: var(--ds-text-15);
    color: var(--ds-text-primary);
    line-height: 1.3;
}

.tender-meta[b-7mhuhtoc4e] {
    font-size: var(--ds-text-12);
    color: var(--ds-text-muted);
    font-style: italic;
    line-height: 1.4;
}

/* Buyer Column */
.td-buyer[b-7mhuhtoc4e] {
    color: var(--ds-text-secondary);
    font-size: var(--ds-text-14);
}

/* Status Column */
.td-status[b-7mhuhtoc4e] {
    justify-content: flex-start;
}

.status-badge[b-7mhuhtoc4e] {
    display: inline-flex;
    align-items: center;
    padding: 4px 12px;
    border-radius: 20px;
    font-size: var(--ds-text-12);
    font-weight: 600;
    letter-spacing: 0.02em;
}

.status-interested[b-7mhuhtoc4e] {
    background: var(--ds-warning-surface);
    color: var(--ds-warning-text);
}

.status-accepted[b-7mhuhtoc4e] {
    background: var(--ds-success-surface);
    color: var(--ds-success-text);
}

.status-rejected[b-7mhuhtoc4e] {
    background: var(--ds-error-surface);
    color: var(--ds-error-text);
}

.status-default[b-7mhuhtoc4e] {
    background: var(--ds-surface-sunken);
    color: var(--ds-gray-600);
}

/* Submitted Column */
.td-submitted[b-7mhuhtoc4e] {
    flex-direction: column;
    align-items: flex-start;
    gap: 2px;
}

.date-primary[b-7mhuhtoc4e] {
    color: var(--ds-text-body);
    font-size: var(--ds-text-13);
}

.date-secondary[b-7mhuhtoc4e] {
    color: var(--ds-text-muted);
    font-size: var(--ds-text-11);
}

/* Actions Column */
.td-actions[b-7mhuhtoc4e] {
    display: flex;
    justify-content: flex-end;
    align-items: center;
}

.view-link[b-7mhuhtoc4e] {
    color: var(--ds-indigo-600);
    font-weight: 500;
    font-size: var(--ds-text-14);
    text-decoration: none !important;
    cursor: pointer;
    transition: color 0.15s;
}

.view-link:hover[b-7mhuhtoc4e] {
    color: var(--ds-indigo-700);
}

/* Pagination */
.pagination-container[b-7mhuhtoc4e] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 16px 24px;
    border-top: 1px solid var(--ds-border);
    background: var(--ds-surface-alt);
}

.pagination-info[b-7mhuhtoc4e] {
    font-size: var(--ds-text-13);
    color: var(--ds-text-secondary);
}

.pagination-controls[b-7mhuhtoc4e] {
    display: flex;
    align-items: center;
    gap: 12px;
}

/* Responsive */
@media (max-width: 1200px) {
    .table-header-row[b-7mhuhtoc4e],
    .table-row[b-7mhuhtoc4e] {
        grid-template-columns: 2fr 1fr 100px 120px 120px 80px;
        gap: 12px;
    }
}

@media (max-width: 968px) {
    .header-content[b-7mhuhtoc4e] {
        flex-direction: column;
    }

    .header-right[b-7mhuhtoc4e] {
        width: 100%;
        flex-wrap: wrap;
    }

    [b-7mhuhtoc4e] .search-field {
        flex: 1;
        min-width: min(200px, 100%);
    }

    [b-7mhuhtoc4e] .status-filter-field {
        width: 150px;
    }

    .table-header-row[b-7mhuhtoc4e] {
        display: none;
    }

    .table-row[b-7mhuhtoc4e] {
        grid-template-columns: 1fr;
        gap: 12px;
        padding: 16px;
    }

    .td[b-7mhuhtoc4e] {
        justify-content: flex-start !important;
    }

    .td-actions[b-7mhuhtoc4e] {
        justify-content: flex-start !important;
    }
}
/* /Components/Pages/Dashboard/ProposalsReceived.razor.rz.scp.css */
/* ── Stat Cards ── */
[b-ca68i96avp] .stat-card {
    text-align: center;
    padding: 20px 16px;
    border-radius: 12px;
    border: 1px solid var(--ds-border);
    background: var(--ds-surface);
    transition: all 0.2s ease;
}

[b-ca68i96avp] .stat-card:hover {
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.06);
}

[b-ca68i96avp] .stat-card--total {
    border-top: 3px solid var(--ds-indigo-700);
}

[b-ca68i96avp] .stat-card--interested {
    border-top: 3px solid var(--ds-amber-600);
}

[b-ca68i96avp] .stat-card--accepted {
    border-top: 3px solid var(--ds-green-600);
}

[b-ca68i96avp] .stat-card--rejected {
    border-top: 3px solid var(--ds-red-600);
}

/* ── Proposal Cards ── */
[b-ca68i96avp] .proposal-card {
    border-radius: 12px;
    border: 1px solid var(--ds-border);
    background: var(--ds-surface);
    transition: all 0.25s ease;
}

[b-ca68i96avp] .proposal-card:hover {
    transform: translateY(-2px);
    box-shadow: 0 6px 20px rgba(67, 56, 202, 0.08);
    border-color: var(--ds-primary-surface);
}

/* ── Card Footer ── */
[b-ca68i96avp] .proposal-card-footer {
    padding: 12px 20px !important;
    margin-top: auto;
    border-top: 1px solid var(--ds-divider);
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    width: 100%;
}

/* ── Action Buttons ── */
[b-ca68i96avp] .proposal-action-btn {
    color: var(--ds-text-muted) !important;
    transition: all 0.15s ease;
}

[b-ca68i96avp] .proposal-action-btn:hover {
    color: var(--ds-text-secondary) !important;
    background: var(--ds-surface-sunken) !important;
}

[b-ca68i96avp] .proposal-action-btn--primary {
    color: var(--ds-indigo-700) !important;
}

[b-ca68i96avp] .proposal-action-btn--primary:hover {
    color: #3730a3 !important;
    background: var(--ds-indigo-50) !important;
}


/* The uppercase field label above each value in the proposal panel, used four
   times inline. ::deep because it sits on a MudText. */
[b-ca68i96avp] .pr-field-label {
    color: var(--ds-text-secondary);
    font-weight: 500;
    text-transform: uppercase;
    font-size: 0.7rem;
    letter-spacing: 0.08em;
}
/* /Components/Pages/Dashboard/RfqList.razor.rz.scp.css */
/* ---------------------------------------------------------------------------
   Moved here from the <style> block in RfqList.razor.

   These rules only ever styled this page's own markup, so component isolation is
   where they belong: scoped, they can no longer reach anything else. A Razor <style>
   block is injected at render time, after every linked stylesheet, which made these
   rules outrank the application's own CSS for reasons that had nothing to do with
   ownership.

   Carried across otherwise verbatim. Two edits were needed: Razor's @@ escaping of
   at-rules is undone, and the seven rules that reach a MudBlazor component root
   become ::deep (see below).
   --------------------------------------------------------------------------- */
/* Page Header (Outside table) */
.page-header[b-k6mb6nh9xi] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 20px;
    gap: 24px;
}

.header-left[b-k6mb6nh9xi] {
    flex: 1;
}

/* ::deep on seven rules in this file, and only those seven.

   .create-btn, .search-field, .toolbar-filter and .views-icon are handed to
   MudButton, MudTextField, MudSelect and MudIcon through Class="...", so they land
   on those components' own root elements, which never carry this page's isolation
   attribute. Scoped normally these rules would match nothing at all.

   Which rules needed it was measured, not guessed: each selector the build generated
   was run against the live DOM beside the original it came from. Seven matched
   elements unscoped and nothing scoped. Notably .group-tab.active and
   .proposal-badge.empty did NOT need it - `active` and `empty` also appear on
   MudBlazor elements elsewhere on the page, so a per-class reading calls them
   ambiguous, but the selectors themselves resolve to this page's own markup.

   Everything else here styles markup this page renders itself and is scoped
   normally, which is the point: those rules can no longer reach anything else. */

[b-k6mb6nh9xi] .create-btn {
    text-transform: none;
    font-weight: 500;
    padding: 8px 20px;
    white-space: nowrap;
}

/* Integrated Toolbar */
.table-toolbar[b-k6mb6nh9xi] {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    padding: 16px 20px;
    border-bottom: 1px solid var(--ds-border);
    background: #fafbfc;
    gap: 12px;
}

[b-k6mb6nh9xi] .toolbar-filter {
    width: 180px;
    min-width: 180px;
}

/* Three rules sizing the toolbar filters to 40px used to sit here, written as
   `.toolbar-filter :global(.mud-input-root)` and so on. :global() is a CSS Modules
   construct; it means nothing to Blazor and nothing to CSS. Injected into the page
   literally, the parser discards every rule containing it - verified in the browser:
   of three such rules written to a style element, one parsed, and it was the one
   without :global(). So these never applied and their six !important declarations
   never did anything. Removed rather than corrected: making them work would resize
   the filters. */

/* Table Header */
.table-header[b-k6mb6nh9xi] {
    display: grid;
    grid-template-columns: 2fr 120px 120px 100px 120px 140px;
    gap: 16px;
    padding: 16px 24px;
    background: var(--ds-surface-alt);
    border-bottom: 1px solid var(--ds-border);
}

.table-row[b-k6mb6nh9xi] {
    display: grid;
    grid-template-columns: 2fr 120px 120px 100px 120px 140px;
    gap: 16px;
    padding: 20px 24px;
    border-bottom: 1px solid var(--ds-divider);
    transition: all 0.15s ease;
}

/* Lifecycle group tabs */
.group-tabs[b-k6mb6nh9xi] {
    display: flex;
    gap: 4px;
    padding: 12px 16px 0 16px;
    border-bottom: 1px solid var(--ds-border);
}

.group-tab[b-k6mb6nh9xi] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    background: none;
    border: none;
    border-bottom: 2px solid transparent;
    padding: 8px 12px;
    font-size: var(--ds-text-13);
    font-weight: 600;
    color: var(--ds-text-secondary);
    cursor: pointer;
}

.group-tab:hover[b-k6mb6nh9xi] {
    color: var(--ds-text-body);
}

.group-tab.active[b-k6mb6nh9xi] {
    color: var(--ds-blue-600);
    border-bottom-color: var(--ds-blue-600);
}

.group-count[b-k6mb6nh9xi] {
    font-size: var(--ds-text-11);
    font-weight: 600;
    background: var(--ds-surface-sunken);
    color: var(--ds-text-secondary);
    border-radius: 999px;
    padding: 1px 7px;
}

.group-tab.active .group-count[b-k6mb6nh9xi] {
    background: var(--ds-info-surface);
    color: var(--ds-info-text);
}

/* Lifecycle status pill */
.status-pill[b-k6mb6nh9xi] {
    display: inline-block;
    padding: 2px 8px;
    border-radius: 999px;
    font-size: var(--ds-text-11);
    font-weight: 600;
    letter-spacing: 0.02em;
}

.status-pill--open[b-k6mb6nh9xi] {
    background: #dcfce7;
    color: #166534;
}

.status-pill--expired[b-k6mb6nh9xi] {
    background: var(--ds-warning-surface);
    color: var(--ds-warning-text);
}

.status-pill--closed[b-k6mb6nh9xi] {
    background: var(--ds-surface-sunken);
    color: var(--ds-gray-600);
}

.status-pill--awarded[b-k6mb6nh9xi] {
    background: var(--ds-info-surface);
    color: var(--ds-info-text);
}

.status-pill--cancelled[b-k6mb6nh9xi] {
    background: var(--ds-error-surface);
    color: var(--ds-error-text);
}

.archived-row[b-k6mb6nh9xi] {
    opacity: 0.6;
}

/* RFQ Column */
.td-rfq[b-k6mb6nh9xi] {
    flex-direction: column;
    align-items: flex-start;
    gap: 4px;
}

.rfq-title-link[b-k6mb6nh9xi] {
    font-weight: 600;
    color: var(--ds-text-primary);
    text-decoration: none;
    cursor: pointer;
    transition: color 0.2s ease;
}

.rfq-title-link:hover[b-k6mb6nh9xi] {
    color: var(--ds-indigo-600);
    text-decoration: underline;
}

.rfq-title[b-k6mb6nh9xi] {
    font-weight: 600;
    color: var(--ds-text-primary);
}

.rfq-meta[b-k6mb6nh9xi] {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: var(--ds-text-12);
    color: var(--ds-text-secondary);
}

.rfq-classification[b-k6mb6nh9xi] {
    font-size: var(--ds-text-12);
    color: rgba(113, 128, 150, 0.75);
    line-height: 1.4;
}

.meta-item[b-k6mb6nh9xi] {
    display: flex;
    align-items: center;
    gap: 4px;
}

.meta-badge[b-k6mb6nh9xi] {
    padding: 2px 8px;
    border-radius: 4px;
    font-size: var(--ds-text-11);
    font-weight: 500;
}

.meta-badge.archived[b-k6mb6nh9xi] {
    background: #edf2f7;
    color: var(--ds-text-body);
}

/* Proposals Column */
.td-proposals[b-k6mb6nh9xi] {
    justify-content: flex-start;
}

.proposal-badge[b-k6mb6nh9xi] {
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 4px 12px;
    border-radius: 6px;
    font-size: var(--ds-text-13);
    font-weight: 500;
}

.proposal-badge.empty[b-k6mb6nh9xi] {
    background: var(--ds-surface-alt);
    color: var(--ds-text-muted);
}

.proposal-badge:not(.empty):not(.has-new)[b-k6mb6nh9xi] {
    background: #e6fffa;
    color: #2c7a7b;
}

.proposal-badge.has-new[b-k6mb6nh9xi] {
    background: #fef5e7;
    color: #975a16;
    border: 1px solid #f6e05e;
}

.proposal-badge .count[b-k6mb6nh9xi] {
    font-weight: 600;
}

.proposal-badge .new-indicator[b-k6mb6nh9xi] {
    font-size: var(--ds-text-11);
    color: #ed8936;
}

/* Views Column */
.td-views[b-k6mb6nh9xi] {
    justify-content: flex-start;
}

.views-count[b-k6mb6nh9xi] {
    display: flex;
    align-items: center;
    gap: 6px;
    color: var(--ds-text-secondary);
    font-size: var(--ds-text-13);
}

[b-k6mb6nh9xi] .views-icon {
    font-size: var(--ds-text-16);
    color: var(--ds-text-muted);
}

/* Created Column */
.td-created[b-k6mb6nh9xi] {
    color: var(--ds-text-body);
    font-size: var(--ds-text-13);
}

/* Pagination */
.pagination-container[b-k6mb6nh9xi] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 16px 24px;
    border-top: 1px solid var(--ds-border);
    background: var(--ds-surface-alt);
}

.pagination-info[b-k6mb6nh9xi] {
    font-size: var(--ds-text-13);
    color: var(--ds-text-secondary);
}

.pagination-controls[b-k6mb6nh9xi] {
    display: flex;
    align-items: center;
    gap: 12px;
}

/* Responsive */
@media (max-width: 1200px) {
    .table-header[b-k6mb6nh9xi],
    .table-row[b-k6mb6nh9xi] {
        grid-template-columns: 2fr 110px 100px 90px 100px 120px;
        gap: 12px;
    }
}

@media (max-width: 1100px) {
    .page-header[b-k6mb6nh9xi] {
        flex-direction: column;
        align-items: flex-start;
    }

    .header-right[b-k6mb6nh9xi] {
        width: 100%;
    }

    [b-k6mb6nh9xi] .search-field {
        flex: 1;
    }

    .table-toolbar[b-k6mb6nh9xi] {
        flex-wrap: wrap;
    }

    [b-k6mb6nh9xi] .toolbar-filter {
        flex: 1;
        min-width: 160px;
    }
}

@media (max-width: 968px) {
    .header-right[b-k6mb6nh9xi] {
        flex-direction: column;
    }

    [b-k6mb6nh9xi] .search-field,
    [b-k6mb6nh9xi] .create-btn {
        width: 100%;
    }

    .table-toolbar[b-k6mb6nh9xi] {
        flex-direction: column;
        align-items: stretch;
    }

    [b-k6mb6nh9xi] .toolbar-filter {
        width: 100%;
    }

    .table-header[b-k6mb6nh9xi] {
        display: none;
    }

    .table-row[b-k6mb6nh9xi] {
        grid-template-columns: 1fr;
        gap: 12px;
        padding: 16px;
    }

    .td[b-k6mb6nh9xi] {
        justify-content: flex-start !important;
    }
}
/* /Components/Pages/HeroRender.razor.rz.scp.css */
/* ══════════════════════════════════════════════════════════
   Hero Render Page — Subtle Angled Marketing Composition
   Scene: very light rotateZ(-1.5deg) only
   Panels: per-panel perspective(1600px) with gentle rotations
   Clean, readable, professional
   ══════════════════════════════════════════════════════════ */

/* ── Scene Container ─────────────────────────────────── */
.hero-scene[b-3b8ih7jmai] {
    width: 1600px;
    height: 900px;
    margin: 0 auto;
    overflow: visible;
    background: transparent;
}

.hero-inner[b-3b8ih7jmai] {
    width: 1300px;
    height: 100%;
    margin: 0 auto;
    position: relative;
    transform: rotateZ(-1.5deg);
    transform-origin: center center;
}

/* ── Base Panel ───────────────────────────────────────── */
.hr-panel[b-3b8ih7jmai] {
    position: absolute;
    pointer-events: none;
}

/* ── Card (shared) ────────────────────────────────────── */
.hr-card[b-3b8ih7jmai] {
    background: var(--ds-surface);
    border-radius: 14px;
    box-shadow:
        0 30px 60px rgba(11, 31, 51, 0.12),
        0 10px 20px rgba(11, 31, 51, 0.08);
    overflow: hidden;
    font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
    font-size: var(--ds-text-12);
    color: var(--ds-text-primary);
}

/* Dashboard gets slightly stronger elevation */
.hr-dashboard .hr-card[b-3b8ih7jmai] {
    box-shadow:
        0 50px 100px rgba(11, 31, 51, 0.16),
        0 20px 40px rgba(11, 31, 51, 0.10);
}

.hr-card-header[b-3b8ih7jmai] {
    padding: 14px 16px 10px;
    border-bottom: 1px solid var(--ds-divider);
}

.hr-card-title[b-3b8ih7jmai] {
    font-size: var(--ds-text-14);
    font-weight: 700;
    color: var(--ds-text-primary);
}

.hr-card-body[b-3b8ih7jmai] {
    padding: 12px 16px 16px;
}

/* ── Top Bar (Dashboard center panel) ─────────────────── */
.hr-topbar[b-3b8ih7jmai] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 10px 16px;
    background: var(--ds-surface);
    border-bottom: 1px solid var(--ds-border);
}

.hr-topbar-left[b-3b8ih7jmai] {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: var(--ds-text-12);
    color: var(--ds-text-secondary);
}

.hr-topbar-brand[b-3b8ih7jmai] {
    font-weight: 600;
    color: var(--ds-text-body);
}

.hr-topbar-sep[b-3b8ih7jmai] {
    color: var(--ds-gray-300);
}

.hr-topbar-page[b-3b8ih7jmai] {
    color: var(--ds-text-muted);
}

.hr-topbar-right[b-3b8ih7jmai] {
    display: flex;
    align-items: center;
}

.hr-btn-create[b-3b8ih7jmai] {
    background: linear-gradient(135deg, var(--ds-success) 0%, var(--ds-green-600) 100%);
    color: var(--ds-text-inverse);
    font-size: var(--ds-text-11);
    font-weight: 600;
    padding: 5px 12px;
    border-radius: 6px;
    white-space: nowrap;
}

/* ── Welcome ──────────────────────────────────────────── */
.hr-welcome[b-3b8ih7jmai] {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 12px 16px;
    background: #eef3ff;
    border-bottom: 1px solid #d5dde8;
}

.hr-welcome-avatar[b-3b8ih7jmai] {
    width: 32px;
    height: 32px;
    border-radius: 50%;
    background: linear-gradient(135deg, var(--ds-info), var(--ds-blue-600));
    color: var(--ds-text-inverse);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: var(--ds-text-11);
    font-weight: 700;
}

.hr-welcome-greeting[b-3b8ih7jmai] {
    font-size: var(--ds-text-13);
    font-weight: 600;
    color: var(--ds-blue-900);
}

/* ── KPI Tiles ────────────────────────────────────────── */
.hr-kpi-row[b-3b8ih7jmai] {
    display: flex;
    gap: 10px;
}

.hr-kpi[b-3b8ih7jmai] {
    flex: 1;
    display: flex;
    align-items: center;
    gap: 8px;
    background: var(--ds-surface);
    border: 1px solid var(--ds-border);
    border-radius: 10px;
    padding: 10px 12px;
}

.hr-kpi-icon[b-3b8ih7jmai] {
    width: 28px;
    height: 28px;
    border-radius: 8px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: var(--ds-text-14);
    flex-shrink: 0;
}

.hr-kpi-label[b-3b8ih7jmai] {
    display: block;
    font-size: var(--ds-text-10);
    color: var(--ds-text-secondary);
    font-weight: 600;
}

.hr-kpi-val[b-3b8ih7jmai] {
    display: block;
    font-size: var(--ds-text-20);
    font-weight: 700;
    color: var(--ds-text-primary);
    line-height: 1.1;
}

/* KPI cards (Dashboard center) */
.hr-kpi-card[b-3b8ih7jmai] {
    flex: 1;
    background: var(--ds-surface);
    border: 1px solid var(--ds-border);
    border-radius: 10px;
    padding: 10px 12px;
    text-align: left;
}

.hr-kpi-icon-sm[b-3b8ih7jmai] {
    width: 22px;
    height: 22px;
    border-radius: 6px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 4px;
}

.hr-kpi-card-label[b-3b8ih7jmai] {
    display: block;
    font-size: var(--ds-text-10);
    color: var(--ds-text-secondary);
    font-weight: 600;
}

.hr-kpi-card-val[b-3b8ih7jmai] {
    display: block;
    font-size: var(--ds-text-18);
    font-weight: 700;
    color: var(--ds-text-primary);
    line-height: 1.2;
}

/* ── KPI compact row (Proposals Received) ─────────────── */
.hr-kpi-row-compact[b-3b8ih7jmai] {
    display: flex;
    gap: 12px;
    margin-bottom: 8px;
}

.hr-kpi-mini[b-3b8ih7jmai] {
    flex: 1;
    text-align: center;
}

.hr-kpi-mini-val[b-3b8ih7jmai] {
    display: block;
    font-size: var(--ds-text-18);
    font-weight: 700;
    color: var(--ds-text-primary);
}

.hr-kpi-mini-label[b-3b8ih7jmai] {
    display: block;
    font-size: 9px;
    color: var(--ds-text-muted);
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.03em;
}

/* ── Tables ───────────────────────────────────────────── */
.hr-table[b-3b8ih7jmai] {
    margin-top: 6px;
}

.hr-table-header[b-3b8ih7jmai] {
    display: flex;
    justify-content: space-between;
    padding: 6px 0;
    border-bottom: 1px solid var(--ds-border);
    font-size: 9px;
    font-weight: 700;
    color: var(--ds-text-muted);
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

.hr-table-row[b-3b8ih7jmai] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 7px 0;
    border-bottom: 1px solid var(--ds-divider);
    font-size: var(--ds-text-11);
    color: var(--ds-text-body);
}

.hr-table-row:last-child[b-3b8ih7jmai] {
    border-bottom: none;
}

.hr-date[b-3b8ih7jmai] {
    font-size: var(--ds-text-10);
    color: var(--ds-text-muted);
    white-space: nowrap;
}

.hr-section-label[b-3b8ih7jmai] {
    font-size: var(--ds-text-12);
    font-weight: 700;
    color: var(--ds-text-primary);
    margin: 8px 0 4px;
}

.hr-divider[b-3b8ih7jmai] {
    border-top: 1px solid var(--ds-divider);
    margin: 8px 0;
}

/* ── Badges ───────────────────────────────────────────── */
.hr-badge[b-3b8ih7jmai] {
    font-size: 9px;
    font-weight: 700;
    padding: 2px 8px;
    border-radius: 999px;
    white-space: nowrap;
    text-transform: uppercase;
    letter-spacing: 0.02em;
}

.hr-badge-green[b-3b8ih7jmai] {
    background: var(--ds-success-surface);
    color: var(--ds-success-text);
}

.hr-badge-yellow[b-3b8ih7jmai] {
    background: var(--ds-warning-surface);
    color: var(--ds-warning-text);
}

.hr-badge-blue[b-3b8ih7jmai] {
    background: var(--ds-info-surface);
    color: #1e40af;
}

.hr-badge-gray[b-3b8ih7jmai] {
    background: var(--ds-surface-sunken);
    color: var(--ds-text-secondary);
}

/* ── Proposal / Recommendation Items ──────────────────── */
.hr-proposal-item[b-3b8ih7jmai],
.hr-rec-item[b-3b8ih7jmai] {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 7px 0;
    border-bottom: 1px solid var(--ds-divider);
}

.hr-proposal-item:last-child[b-3b8ih7jmai],
.hr-rec-item:last-child[b-3b8ih7jmai] {
    border-bottom: none;
}

.hr-proposal-dot[b-3b8ih7jmai],
.hr-rec-dot[b-3b8ih7jmai] {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    flex-shrink: 0;
}

.hr-proposal-info[b-3b8ih7jmai],
.hr-rec-info[b-3b8ih7jmai] {
    flex: 1;
    min-width: 0;
}

.hr-proposal-name[b-3b8ih7jmai],
.hr-rec-name[b-3b8ih7jmai] {
    display: block;
    font-size: var(--ds-text-11);
    font-weight: 600;
    color: var(--ds-text-primary);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.hr-proposal-sub[b-3b8ih7jmai],
.hr-rec-sub[b-3b8ih7jmai] {
    display: block;
    font-size: 9px;
    color: var(--ds-text-muted);
}

/* ── Chart placeholder ────────────────────────────────── */
.hr-chart-placeholder[b-3b8ih7jmai] {
    margin: 8px 0;
    padding: 4px 0;
}

/* ── Stat row (Analytics) ─────────────────────────────── */
.hr-stat-row[b-3b8ih7jmai] {
    display: flex;
    gap: 12px;
    margin-bottom: 6px;
}

.hr-mini-stat[b-3b8ih7jmai] {
    flex: 1;
    text-align: center;
}

.hr-mini-stat-label[b-3b8ih7jmai] {
    display: block;
    font-size: 9px;
    color: var(--ds-text-muted);
    font-weight: 600;
    text-transform: uppercase;
}

.hr-mini-stat-value[b-3b8ih7jmai] {
    display: block;
    font-size: var(--ds-text-16);
    font-weight: 700;
}

/* ══════════════════════════════════════════════════════════
   Panel Positions & Subtle Transforms
   Scene: rotateZ(-1.5deg) — barely noticeable tilt
   Panels: perspective(1600px) rotateX(2deg) + rotateY(±8deg)
   Dashboard: rotateX(1deg) scale(1.06) — dominant center
   All sharp, no blur, no opacity changes
   ══════════════════════════════════════════════════════════ */

/* Dashboard — CENTER, dominant */
.hr-dashboard[b-3b8ih7jmai] {
    left: 50%;
    top: 44%;
    z-index: 10;
    transform: translate(-50%, -50%) perspective(1600px) rotateX(1deg) scale(1.06);
}

/* Analytics — back-left, partially behind My RFQs (20-25% visible) */
.hr-analytics[b-3b8ih7jmai] {
    left: 18%;
    top: 46%;
    z-index: 2;
    transform: translate(-50%, -50%) perspective(1600px) rotateX(2deg) rotateY(8deg) scale(0.82);
}

/* My RFQs — left, overlaps dashboard ~15% */
.hr-my-rfqs[b-3b8ih7jmai] {
    left: 25%;
    top: 52%;
    z-index: 5;
    transform: translate(-50%, -50%) perspective(1600px) rotateX(2deg) rotateY(8deg) scale(0.92);
}

/* Proposals Received — right, closer to dashboard, overlaps ~10-15% */
.hr-proposals-received[b-3b8ih7jmai] {
    left: 74%;
    top: 44%;
    z-index: 5;
    transform: translate(-50%, -50%) perspective(1600px) rotateX(2deg) rotateY(-8deg) scale(0.92);
}

/* My Proposals — bottom center-right, overlaps dashboard ~15-20% */
.hr-my-proposals[b-3b8ih7jmai] {
    left: 44%;
    top: 72%;
    z-index: 12;
    transform: translate(-50%, -50%) perspective(1600px) rotateX(2deg) scale(0.95);
}

/* Recommended for You — bottom right, overlaps dashboard ~15-20% */
.hr-recommended[b-3b8ih7jmai] {
    left: 72%;
    top: 74%;
    z-index: 12;
    transform: translate(-50%, -50%) perspective(1600px) rotateX(2deg) rotateY(-8deg) scale(0.95);
}
/* /Components/Pages/PrometheonLanding.razor.rz.scp.css */
.dp-hero[b-a4mixe265j] {
    overflow-x: clip;
}

.prometheon-landing[b-a4mixe265j] {
    font-family: inherit;
    color: var(--pp-title);
    position: relative;
    overflow: hidden;
    z-index: 2;
}

.prometheon-landing[b-a4mixe265j]::before {
    content: "";
    position: absolute;
    inset: 0;
    background:
        radial-gradient(circle at 20% 15%, rgba(126, 140, 235, 0.18), transparent 45%),
        radial-gradient(circle at 80% 25%, rgba(140, 112, 220, 0.18), transparent 45%),
        radial-gradient(circle at 50% 70%, rgba(128, 188, 160, 0.08), transparent 55%);
    pointer-events: none;
    z-index: 0;
}

.prometheon-landing[b-a4mixe265j]::after {
    content: "";
    position: absolute;
    inset: 0;
    background-image: linear-gradient(130deg, rgba(255, 255, 255, 0.5) 0%, rgba(240, 245, 255, 0.8) 55%, rgba(255, 255, 255, 0.4) 100%);
    opacity: 0.4;
    pointer-events: none;
    z-index: 0;
}

.prometheon-landing main[b-a4mixe265j] {
    position: relative;
    z-index: 1;
}

.prometheon-landing .prometheon-container[b-a4mixe265j] {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 2.5rem;
}

.prometheon-landing .prometheon-button[b-a4mixe265j] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0.85rem 1.8rem;
    border-radius: 16px;
    font-weight: 600;
    text-decoration: none;
    box-shadow: 0 12px 24px rgba(69, 76, 128, 0.18);
    color: var(--ds-text-inverse);
}

.prometheon-landing .prometheon-button.primary[b-a4mixe265j] {
    background: var(--ds-primary);
}

.prometheon-landing .prometheon-button.secondary[b-a4mixe265j] {
    background: #5b6de1;
}

.prometheon-landing .prometheon-button.success[b-a4mixe265j] {
    background: #3c8a6a;
}

/* ============================================================================
   ENTERPRISE POSITIONING SECTION
   Structured, authoritative layout for Buyers and Vendors
   Flows with the landing gradient - no solid background block
   ============================================================================ */

.prometheon-landing .prometheon-enterprise[b-a4mixe265j] {
    padding: 4rem 0 4.5rem;
    background: transparent;
    position: relative;
    z-index: 1;
}

.prometheon-landing .prometheon-enterprise-header[b-a4mixe265j] {
    text-align: center;
    max-width: 720px;
    margin: 0 auto 3.5rem;
}

.prometheon-landing .prometheon-enterprise-title[b-a4mixe265j] {
    font-size: 1.85rem;
    font-weight: 600;
    color: var(--pp-title);
    margin: 0 0 1rem;
    letter-spacing: -0.01em;
    line-height: 1.3;
    text-shadow: 0 1px 2px rgba(255, 255, 255, 0.5);
}

.prometheon-landing .prometheon-enterprise-subtitle[b-a4mixe265j] {
    font-size: 1.05rem;
    color: #4d5474;
    line-height: 1.6;
    margin: 0;
    font-weight: 400;
}

.prometheon-landing .prometheon-enterprise-grid[b-a4mixe265j] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 2rem;
    max-width: 960px;
    margin: 0 auto;
}

/* Translucent column cards for readability on gradient */
.prometheon-landing .prometheon-enterprise-column[b-a4mixe265j] {
    padding: 2.25rem 2.5rem;
    background: rgba(255, 255, 255, 0.7);
    backdrop-filter: blur(4px);
    -webkit-backdrop-filter: blur(4px);
    border-radius: 16px;
    border: 1px solid rgba(255, 255, 255, 0.6);
    box-shadow: 0 4px 20px rgba(89, 109, 217, 0.06);
}

.prometheon-landing .prometheon-enterprise-column-title[b-a4mixe265j] {
    font-size: 1.15rem;
    font-weight: 600;
    color: #2b3161;
    margin: 0 0 1.75rem;
    padding-bottom: 1rem;
    border-bottom: 1px solid rgba(120, 130, 190, 0.1);
}

.prometheon-landing .prometheon-enterprise-list[b-a4mixe265j] {
    list-style: none;
    margin: 0 0 2rem;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.prometheon-landing .prometheon-enterprise-list li[b-a4mixe265j] {
    display: flex;
    align-items: flex-start;
    gap: 0.75rem;
    font-size: 0.95rem;
    color: #3d4470;
    line-height: 1.5;
}

.prometheon-landing .prometheon-enterprise-check[b-a4mixe265j] {
    flex-shrink: 0;
    font-size: 0.85rem;
    color: #4a9d6e;
    font-weight: 500;
    margin-top: 0.1rem;
}

/* ============================================================================
   TRUSTED COMPANIES SECTION
   Enterprise logo belt - horizontal strip, fully visible logos
   ============================================================================ */

.prometheon-landing .prometheon-trusted[b-a4mixe265j] {
    padding: 4rem 0 4.5rem;
    background: transparent;
    position: relative;
    z-index: 1;
}

.prometheon-landing .prometheon-trusted-header[b-a4mixe265j] {
    text-align: center;
    max-width: 600px;
    margin: 0 auto 2rem;
}

.prometheon-landing .prometheon-trusted-title[b-a4mixe265j] {
    font-size: 1.35rem;
    font-weight: 600;
    color: #2b3161;
    margin: 0 0 0.5rem;
    letter-spacing: -0.01em;
    background: none;
}

/* Subtle background band behind logos - light touch for contrast */
.prometheon-landing .prometheon-trusted-belt[b-a4mixe265j] {
    background: rgba(255, 255, 255, 0.35);
    border: 1px solid rgba(255, 255, 255, 0.25);
    border-radius: 12px;
    padding: 1.25rem 1.5rem;
    max-width: 1100px;
    margin: 0 auto;
}

/* Horizontal logo row - flex for single row on desktop */
.prometheon-landing .prometheon-trusted-logos[b-a4mixe265j] {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: stretch;
    gap: 1rem;
}

/* One tile per logo. The uniform white card is what lets square marks, wide
   wordmarks, transparent PNGs and white-matted JPEGs sit together evenly. */
.prometheon-landing .prometheon-trusted-logo[b-a4mixe265j] {
    flex: 1 1 130px;
    max-width: 170px;
    min-height: 112px;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0.75rem 1rem;
    background: rgba(255, 255, 255, 0.7);
    border: 1px solid rgba(255, 255, 255, 0.6);
    border-radius: 12px;
    box-shadow: 0 4px 20px rgba(89, 109, 217, 0.06);
    transition: transform 0.15s ease, box-shadow 0.15s ease;
}

.prometheon-landing .prometheon-trusted-logo:hover[b-a4mixe265j] {
    transform: translateY(-2px);
    box-shadow: 0 8px 24px rgba(89, 109, 217, 0.12);
}

/* Individual logo styling - NO opacity/grayscale muting.
   Bounded on both axes so every asset keeps its own aspect ratio. The height cap is
   deliberately close to the tile's inner width: the square assets carry a lot of built-in
   padding, so letting them fill the box is what makes their mark read at the same optical
   size as the tight-cropped wordmarks next to them. */
.prometheon-landing .prometheon-trusted-logos img[b-a4mixe265j] {
    display: block;
    width: auto;
    height: auto;
    max-width: 100%;
    max-height: 88px;
    object-fit: contain;
    opacity: 1;
    filter: none;
}

.prometheon-landing .prometheon-cta-row[b-a4mixe265j] {
    padding: 2.5rem 0 4rem;
    background: var(--ds-surface);
    border-top: 1px solid var(--ds-divider);
}

.prometheon-landing .prometheon-cta-grid[b-a4mixe265j] {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 1.5rem;
}

.prometheon-landing .prometheon-cta-grid .prometheon-button[b-a4mixe265j] {
    width: 100%;
    text-align: center;
}

/* ── Platform Stats ─────────────────────────────────────── */
.prometheon-landing .prometheon-stats[b-a4mixe265j] {
    padding: 3rem 0;
    background: var(--ds-surface);
    border-bottom: 1px solid var(--ds-border);
}

.prometheon-landing .prometheon-stats-grid[b-a4mixe265j] {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 1.5rem;
}

.prometheon-landing .prometheon-stats-card[b-a4mixe265j] {
    background: var(--ds-surface);
    border: 1px solid var(--ds-border);
    border-radius: 12px;
    padding: 1.75rem 1.5rem;
    display: flex;
    flex-direction: column;
    gap: 0.35rem;
}

.prometheon-landing .prometheon-stats-value[b-a4mixe265j] {
    font-size: var(--ds-text-32);
    font-weight: 700;
    color: var(--pp-title);
    line-height: 1.1;
}

.prometheon-landing .prometheon-stats-label[b-a4mixe265j] {
    font-size: var(--ds-text-12);
    font-weight: 600;
    letter-spacing: 0.04em;
    color: var(--ds-text-secondary);
}

@media (max-width: 960px) {
    .prometheon-landing .prometheon-stats-grid[b-a4mixe265j] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 480px) {
    .prometheon-landing .prometheon-stats-grid[b-a4mixe265j] {
        grid-template-columns: 1fr;
    }

    .prometheon-landing .prometheon-stats-value[b-a4mixe265j] {
        font-size: var(--ds-text-28);
    }
}

@media (max-width: 1024px) {

    .prometheon-landing .prometheon-enterprise-grid[b-a4mixe265j] {
        gap: 2rem;
    }

    .prometheon-landing .prometheon-enterprise-column[b-a4mixe265j] {
        padding: 1.75rem 2rem;
    }

    .prometheon-landing .prometheon-trusted-logos[b-a4mixe265j] {
        gap: 0.875rem;
    }

    /* Three tiles per row on tablet - two even rows of the six logos. */
    .prometheon-landing .prometheon-trusted-logo[b-a4mixe265j] {
        flex: 0 1 calc(33.333% - 0.6rem);
        max-width: calc(33.333% - 0.6rem);
        min-height: 100px;
        padding: 0.625rem 0.875rem;
    }

    .prometheon-landing .prometheon-trusted-logos img[b-a4mixe265j] {
        max-height: 80px;
    }

    .prometheon-landing .prometheon-cta-grid[b-a4mixe265j] {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 720px) {
    .prometheon-landing .prometheon-container[b-a4mixe265j] {
        padding: 0 1.5rem;
    }

    .prometheon-landing .prometheon-enterprise[b-a4mixe265j] {
        padding: 3rem 0 3.5rem;
    }

    .prometheon-landing .prometheon-enterprise-header[b-a4mixe265j] {
        margin-bottom: 2.5rem;
    }

    .prometheon-landing .prometheon-enterprise-title[b-a4mixe265j] {
        font-size: var(--ds-text-24);
    }

    .prometheon-landing .prometheon-enterprise-subtitle[b-a4mixe265j] {
        font-size: 0.95rem;
    }

    .prometheon-landing .prometheon-enterprise-grid[b-a4mixe265j] {
        grid-template-columns: 1fr;
        gap: 1.5rem;
    }

    .prometheon-landing .prometheon-enterprise-column[b-a4mixe265j] {
        padding: 1.5rem;
    }

    .prometheon-landing .prometheon-enterprise-column-title[b-a4mixe265j] {
        font-size: 1.05rem;
        margin-bottom: 1.25rem;
        padding-bottom: 0.75rem;
    }

    .prometheon-landing .prometheon-enterprise-list[b-a4mixe265j] {
        margin-bottom: 1.5rem;
    }

    .prometheon-landing .prometheon-enterprise-list li[b-a4mixe265j] {
        font-size: 0.9rem;
    }

    .prometheon-landing .prometheon-trusted[b-a4mixe265j] {
        padding: 2.5rem 0 3rem;
    }

    .prometheon-landing .prometheon-trusted-header[b-a4mixe265j] {
        margin-bottom: 1.25rem;
    }

    .prometheon-landing .prometheon-trusted-title[b-a4mixe265j] {
        font-size: 1.15rem;
    }

    .prometheon-landing .prometheon-trusted-belt[b-a4mixe265j] {
        padding: 1rem 0.75rem;
        border-radius: 10px;
    }

    .prometheon-landing .prometheon-trusted-logos[b-a4mixe265j] {
        gap: 0.75rem;
    }

    /* Two tiles per row on phones - three even rows of the six logos. */
    .prometheon-landing .prometheon-trusted-logo[b-a4mixe265j] {
        flex: 0 1 calc(50% - 0.375rem);
        max-width: calc(50% - 0.375rem);
        min-height: 92px;
        padding: 0.625rem 0.75rem;
    }

    .prometheon-landing .prometheon-trusted-logos img[b-a4mixe265j] {
        max-height: 72px;
    }
}

/* /Components/Pages/Public/Companies.razor.rz.scp.css */
/* ============================================================================
   COMPANY DIRECTORY PAGE - Unified Prometheon Styling
   Matches Tenders page layout, typography, spacing, and background system
   ============================================================================ */

/* Page wrapper - plain white like Tenders */
.prometheon-page[b-sx9bfnbfbv] {
    font-family: inherit;
    color: var(--pp-title);
    background: var(--ds-surface);
    position: relative;
    min-height: 100vh;
    display: flex;
    flex-direction: column;
    overflow-x: hidden;
}

.prometheon-page[b-sx9bfnbfbv]::before {
    display: none;
}

.prometheon-page[b-sx9bfnbfbv]::after {
    display: none;
}

.prometheon-page .prometheon-main[b-sx9bfnbfbv] {
    position: relative;
    z-index: 1;
}

/* ============================================================================
   MAIN CONTENT AREA
   ============================================================================ */

.prometheon-main[b-sx9bfnbfbv] {
    flex: 1;
    display: flex;
    flex-direction: column;
    padding: 3rem 0 0;
}

.companies-list-zone[b-sx9bfnbfbv] {
    background: #f7f9fc;
    flex: 1;
    padding: 0.3rem 0 4rem;
}

/* ============================================================================
   COMPANY LIST CONTAINER - Wrapper for grid + pagination
   ============================================================================ */

.company-list-container[b-sx9bfnbfbv] {
    background: rgba(255, 255, 255, 0.95);
    border: 1px solid var(--pp-border);
    border-radius: 8px;
    padding: 1.25rem;
}

/* ============================================================================
   COMPANY CARD - Enterprise Style (Dense, Structured, Institutional)
   ============================================================================ */

.company-card[b-sx9bfnbfbv] {
    background: var(--ds-surface);
    border: 1px solid var(--pp-border);
    border-radius: 6px;
    padding: 0.875rem 1rem;
    transition: background 0.12s ease;
    min-width: 0;
    overflow: hidden;
}

.company-card:hover[b-sx9bfnbfbv] {
    background: #fafbfc;
}

/* Header Row */
/* The header is [logo][name][joined date] on one line, and it wraps the date onto a
   second line when the name would otherwise be squeezed to an ellipsis. That is not a
   breakpoint: giving the name a minimum width lets flex decide, so the header reflows on
   the width the CARD actually has rather than on the width the window has. In the
   three-column grid that means the date drops below on a tablet, where a card is ~221px,
   and stays on the title line from ~1024px up, where there is room for both. */
.company-header[b-sx9bfnbfbv] {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 0.65rem;
    margin-bottom: 0.5rem;
    min-width: 0;
}

/* Identity */
.company-identity[b-sx9bfnbfbv] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    flex-wrap: wrap;
    flex: 1;
    /* The width below which the name is not worth showing at all; hitting it is what
       pushes the date onto its own line. */
    min-width: 7.5rem;
}

.company-name[b-sx9bfnbfbv] {
    display: block;
    font-size: var(--ds-text-20);
    font-weight: 600;
    color: var(--pp-heading);
    line-height: 1.3;
    min-width: 0;
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* Joined Date - Now in header row */
.company-joined[b-sx9bfnbfbv] {
    font-size: var(--ds-text-12);
    color: var(--ds-text-secondary);
    font-weight: 400;
    flex-shrink: 0;
    margin-left: auto;
}

/* Company Description */
.company-description[b-sx9bfnbfbv] {
    font-size: var(--ds-text-14);
    color: var(--ds-gray-600);
    line-height: 1.6;
    margin-bottom: 0.75rem;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* Metadata Row */
.company-meta[b-sx9bfnbfbv] {
    font-size: var(--ds-text-12);
    color: var(--ds-text-secondary);
    font-weight: 400;
    margin-bottom: 0.625rem;
    line-height: 1.4;
    background: var(--ds-surface-sunken);
    border-radius: 4px;
    padding: 0.25rem 0.5rem;
    display: inline-block;
}

.company-meta-separator[b-sx9bfnbfbv] {
    margin: 0 0.35rem;
    opacity: 0.5;
}

/* Capability Tags Row */
.company-tags[b-sx9bfnbfbv] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.3rem;
    margin-bottom: 0.625rem;
}

.company-tag[b-sx9bfnbfbv] {
    display: inline-block;
    padding: 0.15rem 0.45rem;
    font-size: 0.68rem;
    font-weight: 500;
    color: #4a5171;
    background: #eff0fb;
    border-radius: 3px;
    line-height: 1.4;
    white-space: nowrap;
    max-width: 140px;
    overflow: hidden;
    text-overflow: ellipsis;
}

.company-tag--overflow[b-sx9bfnbfbv] {
    background: var(--ds-surface-chip);
    /* Same reason as the nav count badge: --ds-text-secondary on the chip is 3.9:1,
       and a "+3 more" a user has to read does not get the large-text exemption. */
    color: var(--ds-text-body);
    font-weight: 600;
}

/* Divider */
.company-divider[b-sx9bfnbfbv] {
    height: 1px;
    background: var(--ds-border);
    margin-bottom: 0.625rem;
}

/* Action Row */
.company-actions[b-sx9bfnbfbv] {
    display: flex;
    justify-content: flex-end;
    align-items: center;
}

.company-link[b-sx9bfnbfbv] {
    font-size: 0.8rem;
    font-weight: 500;
    color: #4a5171;
    text-decoration: none;
    transition: color 0.12s ease;
}

.company-link:hover[b-sx9bfnbfbv] {
    color: var(--pp-heading);
}

/* ============================================================================
   RESPONSIVE ADJUSTMENTS
   ============================================================================ */

@media (max-width: 768px) {

    .prometheon-page-title[b-sx9bfnbfbv] {
        font-size: var(--ds-text-28);
    }

    .prometheon-page-title--sm[b-sx9bfnbfbv] {
        font-size: 1.35rem;
    }

    .prometheon-page-description[b-sx9bfnbfbv] {
        font-size: 0.9rem;
    }

    .prometheon-page-subtitle[b-sx9bfnbfbv] {
        font-size: 0.95rem;
    }
}

/* ============================================================================
   COMPANY PAGINATION - Info text + rows-per-page + MudPagination page numbers
   ============================================================================ */
.company-pagination[b-sx9bfnbfbv] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 0.75rem;
    padding-top: 0.85rem;
    margin-top: 0.35rem;
    border-top: 1px solid var(--pp-divider);
}

.company-pagination-info[b-sx9bfnbfbv] {
    font-size: 0.8rem;
    color: var(--ds-text-secondary);
}

.company-pagination-info strong[b-sx9bfnbfbv] {
    color: var(--ds-text-body);
    font-weight: 600;
}

.company-pagination-controls[b-sx9bfnbfbv] {
    display: flex;
    align-items: center;
    gap: 1rem;
    flex-wrap: wrap;
}

.company-pagination-controls[b-sx9bfnbfbv]  .company-pagination-size {
    width: 140px;
}

/* 640px, not 600px: this page is the only one in the public set that had its own
   phone line, and the two are indistinguishable here - the pagination stacks the
   same way at 601, 620 and 639px either way (verified by screenshot at all three).
   The rest of the public pages break at 640. */
@media (max-width: 640px) {
    .company-pagination[b-sx9bfnbfbv] {
        flex-direction: column;
        align-items: flex-start;
    }

    .company-pagination-controls[b-sx9bfnbfbv] {
        width: 100%;
        justify-content: space-between;
    }
}
/* /Components/Pages/Public/CompanyProfile.razor.rz.scp.css */
/* ============================================================================
   COMPANY PROFILE PAGE - Enterprise Procurement Dossier
   Matches Tender Details styling: divider-based, structured, institutional
   ============================================================================ */

/* ============================================================================
   PAGE FOUNDATION - Same as Tenders/TenderDetails
   ============================================================================ */

.prometheon-page[b-xcj2it5z7h] {
    font-family: inherit;
    color: var(--pp-title);
    position: relative;
    overflow: hidden;
    min-height: 100vh;
    display: flex;
    flex-direction: column;
}

.prometheon-page[b-xcj2it5z7h]::before {
    content: "";
    position: absolute;
    inset: 0;
    background:
        radial-gradient(circle at 20% 15%, rgba(126, 140, 235, 0.18), transparent 45%),
        radial-gradient(circle at 80% 25%, rgba(140, 112, 220, 0.18), transparent 45%),
        radial-gradient(circle at 50% 70%, rgba(128, 188, 160, 0.08), transparent 55%);
    pointer-events: none;
    z-index: 0;
}

.prometheon-page[b-xcj2it5z7h]::after {
    content: "";
    position: absolute;
    inset: 0;
    background-image: linear-gradient(130deg, rgba(255, 255, 255, 0.5) 0%, rgba(240, 245, 255, 0.8) 55%, rgba(255, 255, 255, 0.4) 100%);
    opacity: 0.4;
    pointer-events: none;
    z-index: 0;
}

.prometheon-page .prometheon-main[b-xcj2it5z7h] {
    position: relative;
    z-index: 1;
}

/* ============================================================================
   MAIN CONTENT
   ============================================================================ */

.prometheon-main[b-xcj2it5z7h] {
    flex: 1;
    padding: 2rem 0 3rem;
}

/* ============================================================================
   LOADING & ERROR STATES
   ============================================================================ */

.cp-loading[b-xcj2it5z7h],
.cp-error[b-xcj2it5z7h] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 1rem;
    padding: 4rem 2rem;
    background: rgba(255, 255, 255, 0.95);
    border: 1px solid var(--pp-border);
    border-radius: 8px;
    text-align: center;
}

.cp-loading[b-xcj2it5z7h] {
    color: #5d6578;
    font-size: var(--ds-text-14);
}

.cp-error-title[b-xcj2it5z7h] {
    font-size: var(--ds-text-18);
    font-weight: 600;
    color: var(--pp-title);
}

.cp-error-text[b-xcj2it5z7h] {
    font-size: var(--ds-text-14);
    color: var(--ds-text-secondary);
}

/* ============================================================================
   BUTTONS
   ============================================================================ */


.cp-btn--solid[b-xcj2it5z7h] {
    background: var(--ds-secondary);
    color: var(--ds-text-inverse);
    border: 1px solid var(--ds-secondary);
}

.cp-btn--solid:hover[b-xcj2it5z7h] {
    background: var(--pp-accent-hover);
    border-color: var(--pp-accent-hover);
}

@media (max-width: 768px) {

    .cp-btn[b-xcj2it5z7h] {
        width: 100%;
    }
}
/* /Components/Pages/Public/CompanyProfileHosted.razor.rz.scp.css */
.hosted-page[b-ea9p5h9f7f] {
    min-height: 100vh;
    display: flex;
    flex-direction: column;
    background: #f8f9fa;
}

.hosted-main[b-ea9p5h9f7f] {
    flex: 1;
    padding: 2rem 0;
}

.hosted-container[b-ea9p5h9f7f] {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 1.5rem;
}

/* Loading state */
.cp-loading[b-ea9p5h9f7f] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 1rem;
    padding: 4rem 0;
    color: var(--ds-text-secondary);
}

/* Error state */
.cp-error[b-ea9p5h9f7f] {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    padding: 4rem 2rem;
    max-width: 600px;
    margin: 0 auto;
}

.cp-error-title[b-ea9p5h9f7f] {
    font-size: var(--ds-text-24);
    font-weight: 600;
    color: var(--ds-gray-800);
    margin-bottom: 0.5rem;
}

.cp-error-text[b-ea9p5h9f7f] {
    color: var(--ds-text-secondary);
    margin-bottom: 1.5rem;
}

.cp-error-detail[b-ea9p5h9f7f] {
    color: var(--ds-text-muted);
    font-size: var(--ds-text-14);
    margin-bottom: 1rem;
}

.cp-btn--solid[b-ea9p5h9f7f] {
    background: var(--ds-primary);
    color: white;
}

.cp-btn--solid:hover[b-ea9p5h9f7f] {
    background: var(--ds-primary-hover);
}

/* Mobile responsive */
@media (max-width: 768px) {
    .hosted-main[b-ea9p5h9f7f] {
        padding: 1rem 0;
    }

    .hosted-container[b-ea9p5h9f7f] {
        padding: 0 1rem;
    }

    .cp-error[b-ea9p5h9f7f] {
        padding: 2rem 1rem;
    }
}
/* /Components/Pages/Public/ItSuppliers.razor.rz.scp.css */
/* ============================================================================
   IT Suppliers landing page.

   Built on the shared dp- design system - the tokens in
   wwwroot/styles/foundations/tokens.css, and the buttons, section rhythm and
   container in wwwroot/styles/shared/public-pages.css. Only what that system
   does not already provide is defined here.

   Unlike the homepage this page has no full-bleed blue hero: the blue band is
   the standard PrometheonLayout header, then the page opens on a light intro,
   the way Tenders and Companies do. Blue returns once, at the closing CTA.
   ============================================================================ */

.it-suppliers[b-i1wtwpzghc] {
    background: var(--dp-bg);
}

/* Shared bits ------------------------------------------------------------- */

.it-suppliers .its-eyebrow[b-i1wtwpzghc] {
    display: inline-block;
    font-size: var(--ds-text-11);
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--dp-primary);
    margin-bottom: 12px;
}

.it-suppliers .its-section-header[b-i1wtwpzghc] {
    text-align: center;
    max-width: 680px;
    margin: 0 auto 44px;
}

.it-suppliers .its-section-title[b-i1wtwpzghc] {
    font-size: var(--ds-text-28);
    font-weight: 700;
    color: var(--dp-text);
    margin: 0 0 12px;
    line-height: 1.25;
}

.it-suppliers .its-section-sub[b-i1wtwpzghc] {
    font-size: var(--ds-text-16);
    line-height: 1.7;
    color: var(--dp-text-secondary);
    margin: 0;
}

.it-suppliers .its-check[b-i1wtwpzghc] {
    color: var(--dp-success);
    font-weight: 700;
    flex-shrink: 0;
}

/* 1. Intro ---------------------------------------------------------------- */

.it-suppliers .its-intro[b-i1wtwpzghc] {
    background: var(--ds-surface);
    border-bottom: 1px solid var(--dp-border);
    padding: 56px 0 52px;
}

.it-suppliers .its-intro__grid[b-i1wtwpzghc] {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    gap: 56px;
    align-items: center;
}

.it-suppliers .its-intro__title[b-i1wtwpzghc] {
    font-size: 38px;
    font-weight: 700;
    line-height: 1.18;
    color: var(--pp-heading);
    margin: 0 0 16px;
}

.it-suppliers .its-intro__sub[b-i1wtwpzghc] {
    font-size: 17px;
    line-height: 1.65;
    color: var(--dp-text-secondary);
    margin: 0 0 28px;
    max-width: 520px;
}

.it-suppliers .its-intro__actions[b-i1wtwpzghc] {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
}

.it-suppliers .its-intro__note[b-i1wtwpzghc] {
    font-size: var(--ds-text-13);
    color: var(--dp-text-muted);
    margin: 16px 0 0;
}

.it-suppliers .its-intro__visual img[b-i1wtwpzghc] {
    display: block;
    width: 100%;
    height: auto;
}

/* 2. Social proof --------------------------------------------------------- */

.it-suppliers .its-proof[b-i1wtwpzghc] {
    background: var(--dp-surface-alt);
    border-bottom: 1px solid var(--dp-border);
    padding: 22px 0;
}

.it-suppliers .its-proof__bar[b-i1wtwpzghc] {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    gap: 12px 48px;
}

.it-suppliers .its-proof__item[b-i1wtwpzghc] {
    display: flex;
    align-items: baseline;
    gap: 8px;
}

.it-suppliers .its-proof__value[b-i1wtwpzghc] {
    font-size: 19px;
    font-weight: 700;
    color: var(--pp-heading);
}

.it-suppliers .its-proof__label[b-i1wtwpzghc] {
    font-size: var(--ds-text-13);
    color: var(--dp-text-secondary);
}

/* Vendor logo strip ------------------------------------------------------- */

.it-suppliers .its-logos[b-i1wtwpzghc] {
    background: var(--ds-surface);
    border-top: 1px solid var(--dp-border);
    padding: 34px 0;
}

.it-suppliers .its-logos__title[b-i1wtwpzghc] {
    text-align: center;
    font-size: var(--ds-text-12);
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--dp-text-muted);
    margin: 0 0 22px;
}

.it-suppliers .its-logos__row[b-i1wtwpzghc] {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    gap: 16px 44px;
}

/* No tile chrome: these are the same flat wordmarks the main site runs, and
   boxing them made the strip heavier than the section deserves. */
.it-suppliers .its-logos__item[b-i1wtwpzghc] {
    display: flex;
    align-items: center;
    justify-content: center;
    opacity: 0.75;
    transition: opacity 0.15s ease;
}

.it-suppliers .its-logos__item:hover[b-i1wtwpzghc] {
    opacity: 1;
}

.it-suppliers .its-logos__item img[b-i1wtwpzghc] {
    display: block;
    width: auto;
    height: auto;
    max-width: 150px;
    max-height: 34px;
    object-fit: contain;
}

/* 3. Who it's for --------------------------------------------------------- */

.it-suppliers .its-audience[b-i1wtwpzghc] {
    background: var(--ds-surface);
    border-bottom: 1px solid var(--dp-border);
    padding: 34px 0;
}

/* Title and chips share a row on desktop, which is what keeps this section a
   single band rather than another full-height card grid. */
.it-suppliers .its-audience__row[b-i1wtwpzghc] {
    display: flex;
    align-items: center;
    gap: 32px;
}

.it-suppliers .its-audience__title[b-i1wtwpzghc] {
    flex: 0 0 auto;
    max-width: 230px;
    font-size: 17px;
    font-weight: 700;
    color: var(--dp-text);
    margin: 0;
    line-height: 1.4;
}

.it-suppliers .its-audience__chips[b-i1wtwpzghc] {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.it-suppliers .its-chip[b-i1wtwpzghc] {
    padding: 7px 14px;
    border-radius: 999px;
    font-size: var(--ds-text-13);
    font-weight: 500;
    background: var(--ds-blue-50);
    color: var(--dp-primary);
    border: 1px solid var(--ds-blue-200);
    white-space: nowrap;
}

/* 4. How it works --------------------------------------------------------- */

.it-suppliers .its-benefits[b-i1wtwpzghc] {
    background: var(--dp-surface-alt);
    border-bottom: 1px solid var(--dp-border);
}

.it-suppliers .its-benefit[b-i1wtwpzghc] {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    gap: 56px;
    align-items: center;
    padding: 36px 0;
}

.it-suppliers .its-benefit--reversed .its-benefit__text[b-i1wtwpzghc] {
    order: 2;
}

.it-suppliers .its-benefit--reversed .its-benefit__visual[b-i1wtwpzghc] {
    order: 1;
}

.it-suppliers .its-benefit__title[b-i1wtwpzghc] {
    font-size: var(--ds-text-22);
    font-weight: 700;
    color: var(--dp-text);
    margin: 0 0 12px;
    line-height: 1.3;
}

.it-suppliers .its-benefit__body[b-i1wtwpzghc] {
    font-size: 15.5px;
    line-height: 1.7;
    color: var(--dp-text-secondary);
    margin: 0;
}

/* Capped rather than filling the column: at full track width the 480x300 artwork
   drives the row past 480px tall and the copy floats in the middle of it. */
.it-suppliers .its-benefit__visual[b-i1wtwpzghc] {
    display: flex;
    justify-content: center;
}

.it-suppliers .its-benefit__visual img[b-i1wtwpzghc] {
    display: block;
    width: 100%;
    max-width: 480px;
    height: auto;
    background: var(--dp-surface);
    border: 1px solid var(--dp-border);
    border-radius: var(--dp-radius-lg);
    box-shadow: var(--dp-shadow);
    padding: 14px;
}

/* 5. Plans ---------------------------------------------------------------- */

.it-suppliers .its-plans[b-i1wtwpzghc] {
    background: var(--ds-surface);
}

.it-suppliers .its-plan__grid[b-i1wtwpzghc] {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 16px;
    align-items: stretch;
}

.it-suppliers .its-plan[b-i1wtwpzghc] {
    display: flex;
    flex-direction: column;
    background: var(--dp-surface);
    border: 1px solid var(--dp-border);
    border-radius: var(--dp-radius-lg);
    box-shadow: var(--dp-shadow);
    padding: 22px 18px 18px;
    min-width: 0;
}

.it-suppliers .its-plan--free[b-i1wtwpzghc] {
    background: var(--dp-surface-alt);
}

.it-suppliers .its-plan__name[b-i1wtwpzghc] {
    font-size: 17px;
    font-weight: 700;
    color: var(--dp-text);
    margin: 0 0 12px;
}

.it-suppliers .its-plan__price[b-i1wtwpzghc] {
    display: flex;
    align-items: baseline;
    gap: 3px;
}

.it-suppliers .its-plan__amount[b-i1wtwpzghc] {
    font-size: var(--ds-text-28);
    font-weight: 700;
    color: var(--pp-heading);
    line-height: 1.1;
}

.it-suppliers .its-plan__period[b-i1wtwpzghc] {
    font-size: var(--ds-text-13);
    color: var(--dp-text-muted);
}

.it-suppliers .its-plan__billing[b-i1wtwpzghc] {
    font-size: var(--ds-text-12);
    color: var(--dp-text-muted);
    margin: 6px 0 0;
    padding-bottom: 16px;
    border-bottom: 1px solid var(--dp-border);
}

.it-suppliers .its-plan__features[b-i1wtwpzghc] {
    list-style: none;
    margin: 16px 0 20px;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 12px;
    /* Pushes every card's CTA to the bottom edge so the five buttons line up. */
    flex: 1;
}

.it-suppliers .its-plan__features li[b-i1wtwpzghc] {
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.it-suppliers .its-plan__feature-label[b-i1wtwpzghc] {
    font-size: 11.5px;
    color: var(--dp-text-muted);
}

.it-suppliers .its-plan__feature-value[b-i1wtwpzghc] {
    font-size: 13.5px;
    font-weight: 600;
    color: var(--dp-text);
    line-height: 1.4;
}

.it-suppliers .its-plan__feature--highlight .its-plan__feature-value[b-i1wtwpzghc] {
    color: var(--dp-primary);
}

.it-suppliers .its-plan__footnote[b-i1wtwpzghc] {
    font-size: 11.5px;
    line-height: 1.5;
    color: var(--dp-text-muted);
    margin: 0 0 16px;
}

.it-suppliers .its-plan__cta[b-i1wtwpzghc] {
    width: 100%;
}

/* 6. Customer Acquisition Suite ------------------------------------------- */

.it-suppliers .its-suite[b-i1wtwpzghc] {
    background: var(--dp-surface-alt);
    border-top: 1px solid var(--dp-border);
    border-bottom: 1px solid var(--dp-border);
}

.it-suppliers .its-suite__inner[b-i1wtwpzghc] {
    max-width: 760px;
    margin: 0 auto;
    text-align: center;
}

.it-suppliers .its-suite__lead[b-i1wtwpzghc],
.it-suppliers .its-suite__outro[b-i1wtwpzghc] {
    font-size: var(--ds-text-16);
    line-height: 1.7;
    color: var(--dp-text-secondary);
    margin: 0;
}

.it-suppliers .its-suite__features[b-i1wtwpzghc] {
    list-style: none;
    margin: 26px 0;
    padding: 22px 24px;
    background: var(--dp-surface);
    border: 1px solid var(--dp-border);
    border-radius: var(--dp-radius-lg);
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 14px 22px;
    text-align: left;
}

.it-suppliers .its-suite__feature[b-i1wtwpzghc] {
    display: flex;
    align-items: center;
    gap: 9px;
    font-size: var(--ds-text-14);
    font-weight: 500;
    color: var(--dp-text);
}

.it-suppliers .its-suite__actions[b-i1wtwpzghc] {
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    gap: 12px;
    margin-top: 28px;
}

/* 7. FAQ ------------------------------------------------------------------ */

.it-suppliers .its-faq[b-i1wtwpzghc] {
    background: var(--ds-surface);
}

.it-suppliers .its-faq__list[b-i1wtwpzghc] {
    max-width: 820px;
    margin: 0 auto;
    border: 1px solid var(--dp-border);
    border-radius: var(--dp-radius-lg);
    box-shadow: var(--dp-shadow);
    overflow: hidden;
    background: var(--dp-surface);
}

.it-suppliers .its-faq__item + .its-faq__item[b-i1wtwpzghc] {
    border-top: 1px solid var(--dp-border);
}

.it-suppliers .its-faq__question[b-i1wtwpzghc] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    padding: 17px 22px;
    font-size: var(--ds-text-15);
    font-weight: 600;
    color: var(--dp-text);
    cursor: pointer;
    list-style: none;
    transition: background 0.15s ease;
}

/* Replace the native disclosure triangle with a marker that tracks open state. */
.it-suppliers .its-faq__question[b-i1wtwpzghc]::-webkit-details-marker {
    display: none;
}

.it-suppliers .its-faq__question[b-i1wtwpzghc]::after {
    content: "+";
    font-size: var(--ds-text-20);
    font-weight: 400;
    line-height: 1;
    color: var(--dp-primary);
    flex-shrink: 0;
}

.it-suppliers .its-faq__item[open] .its-faq__question[b-i1wtwpzghc]::after {
    content: "\2013";
}

.it-suppliers .its-faq__question:hover[b-i1wtwpzghc] {
    background: var(--dp-surface-alt);
}

.it-suppliers .its-faq__answer[b-i1wtwpzghc] {
    margin: 0;
    padding: 0 22px 19px;
    font-size: var(--ds-text-15);
    line-height: 1.7;
    color: var(--dp-text-secondary);
}

/* 8. Final CTA ------------------------------------------------------------ */

.it-suppliers .its-final[b-i1wtwpzghc] {
    background: var(--prometheon-hero-gradient);
    color: var(--ds-text-inverse);
    padding: 44px 0;
}

.it-suppliers .its-final__inner[b-i1wtwpzghc] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 32px;
    flex-wrap: wrap;
}

.it-suppliers .its-final__title[b-i1wtwpzghc] {
    font-size: 26px;
    font-weight: 700;
    margin: 0 0 8px;
    line-height: 1.25;
}

.it-suppliers .its-final__sub[b-i1wtwpzghc] {
    font-size: 15.5px;
    line-height: 1.6;
    opacity: 0.9;
    max-width: 560px;
    margin: 0;
}

.it-suppliers .its-final__actions[b-i1wtwpzghc] {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
}

/* Responsive -------------------------------------------------------------- */

@media (max-width: 1100px) {
    .it-suppliers .its-plan__grid[b-i1wtwpzghc] {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

@media (max-width: 900px) {
    .it-suppliers .its-intro__grid[b-i1wtwpzghc],
    .it-suppliers .its-benefit[b-i1wtwpzghc] {
        grid-template-columns: minmax(0, 1fr);
        gap: 32px;
    }

    /* Image always follows its copy once the rows stack. */
    .it-suppliers .its-benefit--reversed .its-benefit__text[b-i1wtwpzghc] {
        order: 1;
    }

    .it-suppliers .its-benefit--reversed .its-benefit__visual[b-i1wtwpzghc] {
        order: 2;
    }

    .it-suppliers .its-intro__visual[b-i1wtwpzghc] {
        max-width: 520px;
    }

    .it-suppliers .its-audience__row[b-i1wtwpzghc] {
        flex-direction: column;
        align-items: flex-start;
        gap: 16px;
    }

    .it-suppliers .its-audience__title[b-i1wtwpzghc] {
        max-width: none;
    }

    .it-suppliers .its-suite__features[b-i1wtwpzghc] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 768px) {
    .it-suppliers .its-intro[b-i1wtwpzghc] {
        padding: 40px 0 36px;
    }

    .it-suppliers .its-intro__title[b-i1wtwpzghc] {
        font-size: 30px;
    }

    .it-suppliers .its-section-title[b-i1wtwpzghc] {
        font-size: var(--ds-text-24);
    }

    .it-suppliers .its-section-header[b-i1wtwpzghc] {
        margin-bottom: 32px;
    }

    .it-suppliers .its-plan__grid[b-i1wtwpzghc] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .it-suppliers .its-proof__bar[b-i1wtwpzghc] {
        gap: 10px 28px;
    }
}

@media (max-width: 560px) {
    .it-suppliers .its-plan__grid[b-i1wtwpzghc],
    .it-suppliers .its-suite__features[b-i1wtwpzghc] {
        grid-template-columns: minmax(0, 1fr);
    }

    .it-suppliers .its-intro__actions .dp-btn[b-i1wtwpzghc],
    .it-suppliers .its-final__actions .dp-btn[b-i1wtwpzghc],
    .it-suppliers .its-suite__actions .dp-btn[b-i1wtwpzghc] {
        width: 100%;
    }

    .it-suppliers .its-proof__bar[b-i1wtwpzghc] {
        flex-direction: column;
        align-items: flex-start;
        gap: 8px;
    }

    .it-suppliers .its-final__title[b-i1wtwpzghc] {
        font-size: var(--ds-text-22);
    }
}
/* /Components/Pages/Public/TenderDetails.razor.rz.scp.css */
/* ============================================================================
   TENDER DETAILS PAGE - Divider-Based Procurement Dossier
   Uses same header, footer, background as Tenders listing page
   Structure: Title → Metadata Strip → Description → Actions
   Separated by dividers, not cards
   ============================================================================ */

/* ============================================================================
   PAGE FOUNDATION - Same as Tenders page
   ============================================================================ */

.prometheon-page[b-dhw4m4niou] {
    font-family: inherit;
    color: var(--pp-title);
    position: relative;
    overflow: hidden;
    min-height: 100vh;
    display: flex;
    flex-direction: column;
}

.prometheon-page[b-dhw4m4niou]::before {
    content: "";
    position: absolute;
    inset: 0;
    background:
        radial-gradient(circle at 20% 15%, rgba(126, 140, 235, 0.18), transparent 45%),
        radial-gradient(circle at 80% 25%, rgba(140, 112, 220, 0.18), transparent 45%),
        radial-gradient(circle at 50% 70%, rgba(128, 188, 160, 0.08), transparent 55%);
    pointer-events: none;
    z-index: 0;
}

.prometheon-page[b-dhw4m4niou]::after {
    content: "";
    position: absolute;
    inset: 0;
    background-image: linear-gradient(130deg, rgba(255, 255, 255, 0.5) 0%, rgba(240, 245, 255, 0.8) 55%, rgba(255, 255, 255, 0.4) 100%);
    opacity: 0.4;
    pointer-events: none;
    z-index: 0;
}

.prometheon-page .prometheon-main[b-dhw4m4niou] {
    position: relative;
    z-index: 1;
}

/* ============================================================================
   MAIN CONTENT
   ============================================================================ */

.prometheon-main[b-dhw4m4niou] {
    flex: 1;
    padding: 2rem 0 3rem;
}

/* ============================================================================
   DOSSIER - Main Content Container
   ============================================================================ */

.td-dossier[b-dhw4m4niou] {
    background: rgba(255, 255, 255, 0.95);
    border-radius: 8px;
    border: 1px solid var(--pp-border);
}

/* Loading & Error States */
.td-loading[b-dhw4m4niou],
.td-error[b-dhw4m4niou] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 1rem;
    padding: 4rem 2rem;
    background: rgba(255, 255, 255, 0.95);
    border: 1px solid var(--pp-border);
    border-radius: 8px;
    text-align: center;
}

.td-loading[b-dhw4m4niou] {
    color: #5d6578;
    font-size: var(--ds-text-14);
}

.td-error-title[b-dhw4m4niou] {
    font-size: var(--ds-text-18);
    font-weight: 600;
    color: var(--pp-title);
}

.td-error-text[b-dhw4m4niou] {
    font-size: var(--ds-text-14);
    color: var(--ds-text-secondary);
}

/* ============================================================================
   DIVIDER
   ============================================================================ */

.td-divider[b-dhw4m4niou] {
    height: 1px;
    background: var(--ds-border);
    margin: 0;
}

/* ============================================================================
   TITLE BLOCK
   ============================================================================ */

.td-title-block[b-dhw4m4niou] {
    padding: 1.25rem 1.75rem 1.5rem;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
}

/* Keeps the CTA pair and its reassurance line as one right-hand unit, so .td-title-block
   still has exactly two flex children and its space-between layout is unchanged. */
.td-cta-cluster[b-dhw4m4niou] {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 0.45rem;
}

/* Secondary ("Need more details?") + primary ("Submit Proposal") on one row. */
.td-cta-actions[b-dhw4m4niou] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.td-cta-note[b-dhw4m4niou] {
    font-size: 0.72rem;
    color: var(--ds-text-muted);
    line-height: 1.3;
    letter-spacing: 0.01em;
    white-space: nowrap;
}

/* ============================================================================
   "NEED MORE DETAILS?" POPOVER
   Anchored popover on desktop, bottom sheet under 768px.
   ============================================================================ */

.td-hint[b-dhw4m4niou] {
    position: relative;
    display: inline-flex;
}

.td-hint-trigger[b-dhw4m4niou] {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    padding: 0.55rem 0.85rem;
    font-family: inherit;
    font-size: var(--ds-text-13);
    font-weight: 600;
    line-height: 1;
    color: var(--ds-secondary);
    background: transparent;
    border: 1px solid transparent;
    border-radius: 6px;
    cursor: pointer;
    white-space: nowrap;
    transition: all 0.15s ease;
}

.td-hint-trigger:hover[b-dhw4m4niou] {
    background: #f4f5fd;
    border-color: #dfe3fa;
}

.td-hint-trigger:focus-visible[b-dhw4m4niou] {
    outline: 2px solid var(--ds-secondary);
    outline-offset: 2px;
}

.td-hint--open .td-hint-trigger[b-dhw4m4niou] {
    background: #eef0fc;
    border-color: #ccd3f6;
}

.td-hint-trigger-icon[b-dhw4m4niou] {
    flex-shrink: 0;
    opacity: 0.85;
}

/* Invisible on desktop - it exists only to catch the outside click. */
.td-hint-scrim[b-dhw4m4niou] {
    position: fixed;
    inset: 0;
    z-index: 40;
    background: transparent;
}

.td-hint-panel[b-dhw4m4niou] {
    position: absolute;
    top: calc(100% + 0.6rem);
    right: 0;
    z-index: 41;
    /* Sized to its own content rather than a fixed 21rem, so the three-step flow row
       below stays on one line without the panel being padded out any wider than that
       row actually needs. min/max keep it in a sane band on either side. */
    width: max-content;
    min-width: 21rem;
    max-width: min(30rem, calc(100vw - 2.5rem));
    padding: 0.95rem 1.05rem 1.05rem;
    background: var(--ds-surface);
    border: 1px solid var(--pp-border);
    border-radius: 10px;
    box-shadow: 0 14px 34px rgba(31, 37, 83, 0.15), 0 2px 6px rgba(31, 37, 83, 0.06);
    text-align: left;
    animation: td-hint-in-b-dhw4m4niou 0.16s ease-out;
}

/* Caret pointing back at the trigger. */
.td-hint-panel[b-dhw4m4niou]::before {
    content: "";
    position: absolute;
    top: -5px;
    right: 1.6rem;
    width: 9px;
    height: 9px;
    background: var(--ds-surface);
    border-left: 1px solid var(--pp-border);
    border-top: 1px solid var(--pp-border);
    border-radius: 1px;
    transform: rotate(45deg);
}

@keyframes td-hint-in-b-dhw4m4niou {
    from { opacity: 0; transform: translateY(-4px); }
    to { opacity: 1; transform: translateY(0); }
}

@keyframes td-hint-sheet-in-b-dhw4m4niou {
    from { transform: translateY(100%); }
    to { transform: translateY(0); }
}

/* Drag-handle affordance - only meaningful in the mobile bottom-sheet form. */
.td-hint-grip[b-dhw4m4niou] {
    display: none;
}

.td-hint-panel-head[b-dhw4m4niou] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 0.75rem;
    margin-bottom: 0.7rem;
}

.td-hint-panel-title[b-dhw4m4niou] {
    font-size: var(--ds-text-14);
    font-weight: 700;
    color: var(--pp-heading);
    line-height: 1.35;
    letter-spacing: -0.005em;
}

.td-hint-panel-close[b-dhw4m4niou] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    width: 24px;
    height: 24px;
    margin: -3px -5px 0 0;
    padding: 0;
    color: var(--ds-text-muted);
    background: transparent;
    border: none;
    border-radius: 5px;
    cursor: pointer;
    transition: all 0.15s ease;
}

.td-hint-panel-close:hover[b-dhw4m4niou] {
    color: var(--ds-gray-600);
    background: var(--pp-surface-alt);
}

/* nowrap on desktop is what the panel's max-content width is sized against - the two
   rules together are what keeps Submit Proposal -> Message the buyer -> Clarify details
   on a single row. Re-wrapped in the mobile bottom sheet below. */
.td-hint-flow[b-dhw4m4niou] {
    display: flex;
    flex-wrap: nowrap;
    align-items: center;
    gap: 0.3rem;
    margin-bottom: 0.75rem;
}

.td-hint-step[b-dhw4m4niou] {
    display: inline-flex;
    align-items: center;
    padding: 0.26rem 0.6rem;
    font-size: 0.72rem;
    font-weight: 600;
    line-height: 1.3;
    color: var(--ds-gray-600);
    background: #f5f6fa;
    border: 1px solid #e6e8f2;
    border-radius: 999px;
    white-space: nowrap;
}

.td-hint-step--first[b-dhw4m4niou] {
    color: #4453b8;
    background: #eef0fc;
    border-color: #d4dbf7;
}

.td-hint-arrow[b-dhw4m4niou] {
    font-size: 0.72rem;
    line-height: 1;
    color: #b8bdcc;
}

.td-hint-panel-text[b-dhw4m4niou] {
    /* Capped so the sentence never becomes the widest child and stretches the
       max-content panel past what the flow row needs. */
    max-width: 24rem;
    margin: 0;
    font-size: 0.8rem;
    line-height: 1.5;
    color: #5b6172;
}

.td-dossier--secondary[b-dhw4m4niou] {
    margin-top: 1rem;
}

.td-title[b-dhw4m4niou] {
    font-size: 1.65rem;
    font-weight: 700;
    color: var(--pp-heading);
    margin: 0;
    line-height: 1.3;
    letter-spacing: -0.01em;
}

/* ============================================================================
   METADATA STRIP
   ============================================================================ */

/* Section Header */
.td-section-header[b-dhw4m4niou] {
    padding: 0.75rem 1.75rem 0;
}

.td-section-label[b-dhw4m4niou] {
    font-size: 0.7rem;
    font-weight: 600;
    color: var(--ds-text-secondary);
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

/* RFQ Metadata Grid */
.td-metadata-strip[b-dhw4m4niou] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 0.75rem 1rem;
    padding: 0.5rem 1.75rem;
}

.td-metadata-strip--row1[b-dhw4m4niou] {
    padding-top: 0.75rem;
    padding-bottom: 0.5rem;
}

.td-metadata-strip--row2[b-dhw4m4niou] {
    padding-top: 0.5rem;
    padding-bottom: 1rem;
}

/* Buyer Strip */
.td-buyer-strip[b-dhw4m4niou] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1.5rem;
    padding: 0.75rem 1.75rem 1rem;
}

.td-buyer-info[b-dhw4m4niou] {
    display: flex;
    gap: 2.5rem;
}

.td-meta-item[b-dhw4m4niou] {
    display: flex;
    flex-direction: column;
    gap: 0.2rem;
}

.td-meta-label[b-dhw4m4niou] {
    font-size: 0.65rem;
    font-weight: 600;
    color: var(--ds-text-muted);
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

.td-meta-value[b-dhw4m4niou] {
    font-size: var(--ds-text-13);
    font-weight: 500;
    color: var(--ds-text-body);
    display: flex;
    align-items: center;
    gap: 0.35rem;
    flex-wrap: wrap;
}

.td-meta-value--mono[b-dhw4m4niou] {
    font-family: 'SF Mono', Monaco, 'Cascadia Code', Consolas, monospace;
    font-size: var(--ds-text-12);
    letter-spacing: 0.02em;
    color: var(--ds-text-secondary);
}

.td-meta-value--deadline[b-dhw4m4niou] {
    font-weight: 600;
    color: var(--pp-heading);
}

/* Status Badge */
.td-status[b-dhw4m4niou] {
    display: inline-block;
    padding: 0.2rem 0.45rem;
    font-size: 0.6rem;
    font-weight: 700;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    border-radius: 3px;
}
/* Lifecycle modifiers. These class names never appear in the markup: they are built at
   runtime by RfqLifecycleDisplay.StatusClass("td-status", ...), which returns
   td-status--open, --closing or --closed. */
.td-status--open[b-dhw4m4niou] {
    background: #dcfce7;
    color: #166534;
}

.td-status--closing[b-dhw4m4niou] {
    background: var(--ds-warning-surface);
    color: var(--ds-warning-text);
}

.td-status--closed[b-dhw4m4niou] {
    background: var(--ds-surface-sunken);
    color: var(--ds-text-secondary);
}

/* Urgent Badge */
.td-urgent[b-dhw4m4niou] {
    font-size: 0.55rem;
    font-weight: 700;
    color: var(--ds-text-inverse);
    background: var(--ds-red-600);
    padding: 0.1rem 0.3rem;
    border-radius: 3px;
    text-transform: uppercase;
}

/* ============================================================================
   CONTENT SECTION (Description)
   ============================================================================ */

.td-content-section[b-dhw4m4niou] {
    padding: 0.75rem 1.75rem 1.25rem;
}

.td-description[b-dhw4m4niou] {
    font-size: 0.925rem;
    line-height: 1.7;
    color: var(--ds-text-body);
}

.td-description p[b-dhw4m4niou] {
    margin: 0;
    white-space: pre-wrap;
}

.td-description-empty[b-dhw4m4niou] {
    color: var(--ds-text-muted);
    font-style: italic;
}

/* ============================================================================
   PROCUREMENT REQUIREMENTS SECTION
   ============================================================================ */

.td-requirements-grid[b-dhw4m4niou] {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 0.75rem 1rem;
    padding: 0.75rem 1.75rem 1.25rem;
}

.td-req-group[b-dhw4m4niou] {
    display: flex;
    flex-direction: column;
    gap: 0.4rem;
}

.td-req-tags[b-dhw4m4niou] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.3rem;
}

.td-req-tag[b-dhw4m4niou] {
    display: inline-block;
    padding: 0.25rem 0.6rem;
    font-size: 0.8rem;
    font-weight: 500;
    color: var(--ds-text-body);
    background: var(--pp-surface-alt);
    border: 1px solid var(--pp-border);
    border-radius: 4px;
    white-space: nowrap;
    max-width: 200px;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* ============================================================================
   BUTTONS
   ============================================================================ */


.td-btn--solid[b-dhw4m4niou] {
    background: var(--ds-secondary);
    color: var(--ds-text-inverse);
    border: 1px solid var(--ds-secondary);
}

.td-btn--solid:hover[b-dhw4m4niou] {
    background: var(--pp-accent-hover);
    border-color: var(--pp-accent-hover);
}

.td-btn--outline[b-dhw4m4niou] {
    background: var(--ds-surface);
    color: var(--ds-secondary);
    border: 1px solid var(--ds-gray-300);
}

.td-btn--outline:hover[b-dhw4m4niou] {
    background: #f8f9fb;
    border-color: var(--ds-secondary);
}

.td-btn--sm[b-dhw4m4niou] {
    font-size: 0.72rem;
    padding: 0.55rem 0.65rem;
}

/* ============================================================================
   RESPONSIVE
   ============================================================================ */

@media (max-width: 1100px) {
    .td-metadata-strip[b-dhw4m4niou] {
        grid-template-columns: repeat(3, 1fr);
    }
}

@media (max-width: 900px) {
    .td-metadata-strip[b-dhw4m4niou] {
        grid-template-columns: repeat(2, 1fr);
        gap: 0.85rem 1rem;
    }

    .td-requirements-grid[b-dhw4m4niou] {
        grid-template-columns: repeat(2, 1fr);
    }

    .td-buyer-strip[b-dhw4m4niou] {
        flex-direction: column;
        align-items: flex-start;
        gap: 1rem;
    }

    .td-buyer-info[b-dhw4m4niou] {
        flex-direction: column;
        gap: 0.75rem;
    }
}

@media (max-width: 768px) {

    .td-title[b-dhw4m4niou] {
        font-size: 1.35rem;
    }

    .td-metadata-strip[b-dhw4m4niou] {
        grid-template-columns: repeat(2, 1fr);
    }

    .td-cta-cluster[b-dhw4m4niou] {
        align-items: stretch;
        gap: 0.6rem;
    }

    /* Primary CTA on top, "Need more details?" beneath it - thumb reach first. */
    .td-cta-actions[b-dhw4m4niou] {
        flex-direction: column-reverse;
        align-items: stretch;
        gap: 0.5rem;
    }

    .td-cta-note[b-dhw4m4niou] {
        text-align: center;
        white-space: normal;
    }

    .td-btn[b-dhw4m4niou] {
        width: 100%;
    }

    /* Popover becomes a bottom sheet: reachable, full-width and dismissible by tapping
       the dimmed scrim behind it. */
    .td-hint[b-dhw4m4niou] {
        display: block;
    }

    .td-hint-trigger[b-dhw4m4niou] {
        width: 100%;
        justify-content: center;
        padding: 0.6rem 0.85rem;
        background: var(--ds-surface);
        border-color: var(--ds-gray-300);
    }

    .td-hint-scrim[b-dhw4m4niou] {
        z-index: 1200;
        background: rgba(31, 37, 83, 0.4);
    }

    .td-hint-panel[b-dhw4m4niou] {
        position: fixed;
        top: auto;
        right: 0;
        bottom: 0;
        left: 0;
        z-index: 1201;
        width: auto;
        min-width: 0;
        max-width: none;
        padding: 0.6rem 1.15rem calc(1.35rem + env(safe-area-inset-bottom));
        border-bottom: none;
        border-radius: 14px 14px 0 0;
        box-shadow: 0 -10px 40px rgba(31, 37, 83, 0.22);
        animation: td-hint-sheet-in-b-dhw4m4niou 0.2s ease-out;
    }

    .td-hint-panel[b-dhw4m4niou]::before {
        display: none;
    }

    .td-hint-grip[b-dhw4m4niou] {
        display: block;
        width: 36px;
        height: 4px;
        margin: 0 auto 0.75rem;
        background: #dcdfe8;
        border-radius: 999px;
    }

    .td-hint-panel-title[b-dhw4m4niou] {
        font-size: 0.95rem;
    }

    /* The sheet is full-width and narrow: let the flow wrap and the text fill it. */
    .td-hint-flow[b-dhw4m4niou] {
        flex-wrap: wrap;
    }

    .td-hint-panel-text[b-dhw4m4niou] {
        max-width: none;
        font-size: 0.84rem;
    }

    .td-title-block[b-dhw4m4niou],
    .td-metadata-strip[b-dhw4m4niou],
    .td-content-section[b-dhw4m4niou] {
        padding-left: 1.25rem;
        padding-right: 1.25rem;
    }
}

@media (max-width: 480px) {
    /* Narrower than the shared .prometheon-container gutter, which stops at 768px. */
    .prometheon-container[b-dhw4m4niou] {
        padding: 0 1rem;
    }

    .td-title-block[b-dhw4m4niou],
    .td-metadata-strip[b-dhw4m4niou],
    .td-content-section[b-dhw4m4niou] {
        padding-left: 1rem;
        padding-right: 1rem;
    }
}
/* /Components/Pages/Public/Tenders.razor.rz.scp.css */
/* ============================================================================
   David - PUBLIC TENDERS PAGE - Unified Prometheon Styling
   Matches homepage layout, typography, spacing, and background system
   ============================================================================ */

/* Page wrapper - plain white like homepage */
.prometheon-page[b-0fqgjqx01t] {
    font-family: inherit;
    color: var(--pp-title);
    background: var(--ds-surface);
    position: relative;
    min-height: 100vh;
    display: flex;
    flex-direction: column;
}

.prometheon-page[b-0fqgjqx01t]::before {
    display: none;
}

.prometheon-page[b-0fqgjqx01t]::after {
    display: none;
}

.prometheon-page .prometheon-main[b-0fqgjqx01t] {
    position: relative;
    z-index: 1;
}

/* ============================================================================
   MAIN CONTENT AREA
   ============================================================================ */

.prometheon-main[b-0fqgjqx01t] {
    flex: 1;
    display: flex;
    flex-direction: column;
    padding: 3rem 0 0;
}

/* Cool blue-grey ground for the results. Slightly deeper than the old #f7f9fc now that
   the white list panel is gone and the cards sit directly on it - this is the only thing
   separating one card from the next. */
.tenders-list-zone[b-0fqgjqx01t] {
    background: #f2f5fa;
    border-top: 1px solid #e6ebf4;
    flex: 1;
    padding: 1rem 0 4rem;
}

/* ============================================================================
   RESPONSIVE ADJUSTMENTS
   ============================================================================ */

@media (max-width: 768px) {

    .prometheon-page-title[b-0fqgjqx01t] {
        font-size: var(--ds-text-28);
    }

    .prometheon-page-subtitle[b-0fqgjqx01t] {
        font-size: 0.95rem;
    }
}

/* ---------------------------------------------------------------------------
   Moved here from the <style> block in Tenders.razor.

   These rules only ever styled this page's own markup, so component isolation is
   where they belong: scoped, they can no longer reach anything else. A Razor <style>
   block is injected at render time, after every linked stylesheet, which made these
   rules outrank the application's own CSS for reasons that had nothing to do with
   ownership.

   Carried across otherwise verbatim. Two edits were needed: Razor's @@ escaping of
   at-rules is undone, and .tender-pagination-size becomes ::deep (see below).
   --------------------------------------------------------------------------- */

/* ============================================================================
   REASSURANCE STRIP
   One compact page-level statement above the filters, replacing the note that
   used to repeat on every tender row. Slim by design: single row on desktop,
   copy left, three benefit pills right.
   ============================================================================ */
.tender-reassure[b-0fqgjqx01t] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 0.6rem 1.5rem;
    position: relative;
    margin: 0.75rem 0 0.85rem;
    padding: 0.7rem 1rem 0.7rem 1.1rem;
    background: linear-gradient(180deg, var(--ds-surface) 0%, #f6f9ff 100%);
    border: 1px solid #dfe6f5;
    border-radius: 10px;
    overflow: hidden;
}

/* Restrained brand rail, matching the proposal drawer's confidence panel. */
.tender-reassure[b-0fqgjqx01t]::before {
    content: "";
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    width: 3px;
    background: linear-gradient(180deg, var(--ds-primary) 0%, #6ea8f0 100%);
}

.tender-reassure-copy[b-0fqgjqx01t] {
    min-width: 0;
}

.tender-reassure-title[b-0fqgjqx01t] {
    margin: 0 0 0.15rem;
    font-size: var(--ds-text-14);
    font-weight: 700;
    line-height: 1.3;
    letter-spacing: -0.005em;
    color: var(--pp-heading);
}

.tender-reassure-text[b-0fqgjqx01t] {
    margin: 0;
    font-size: 0.8rem;
    line-height: 1.4;
    color: var(--ds-text-secondary);
}

.tender-reassure-benefits[b-0fqgjqx01t] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.4rem;
    margin: 0;
    padding: 0;
    list-style: none;
}

.tender-reassure-benefit[b-0fqgjqx01t] {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    padding: 0.3rem 0.6rem;
    background: var(--ds-surface);
    border: 1px solid #e3e9f4;
    border-radius: 999px;
}

.tender-reassure-icon[b-0fqgjqx01t] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    width: 20px;
    height: 20px;
    border-radius: 999px;
}

.tender-reassure-label[b-0fqgjqx01t] {
    font-size: var(--ds-text-12);
    font-weight: 600;
    line-height: 1.2;
    color: var(--ds-text-body);
    white-space: nowrap;
}

/* One quiet accent each - the same family used by the drawer's benefit tiles. */
.tender-reassure-benefit--free[b-0fqgjqx01t] {
    border-color: #cdeadd;
}

.tender-reassure-benefit--free .tender-reassure-icon[b-0fqgjqx01t] {
    color: #0f9f6e;
    background: #e7f7f0;
}

.tender-reassure-benefit--nosignup[b-0fqgjqx01t] {
    border-color: #d9dcf7;
}

.tender-reassure-benefit--nosignup .tender-reassure-icon[b-0fqgjqx01t] {
    color: var(--ds-indigo-600);
    background: #eceefe;
}

.tender-reassure-benefit--quick[b-0fqgjqx01t] {
    border-color: #d2e2fa;
}

.tender-reassure-benefit--quick .tender-reassure-icon[b-0fqgjqx01t] {
    color: var(--ds-primary);
    background: #e7f0fd;
}

/* ============================================================================
   TENDER LIST CONTAINER - Wrapper for list + pagination
   ============================================================================ */
/* No white panel around the list: the cards are the white surfaces and the tinted
   results zone behind them is what separates one from the next. Keeping the panel
   here is what made the page read as one flat sheet of white. */
.tender-list-container[b-0fqgjqx01t] {
    background: transparent;
    border: none;
    border-radius: 0;
    padding: 0.25rem 0 0;
}

/* ============================================================================
   TENDER PAGINATION - Info text + rows-per-page + MudPagination page numbers
   ============================================================================ */
/* Same white surface as a card - a hairline top border would disappear against the
   tinted zone now that the list is not inside a white panel. */
.tender-pagination[b-0fqgjqx01t] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 0.75rem;
    margin-top: 0.5rem;
    padding: 0.6rem 1rem;
    background: var(--ds-surface);
    border: 1px solid #dde3ee;
    border-radius: 7px;
    box-shadow: 0 1px 2px rgba(31, 37, 83, 0.045);
}

.tender-pagination-info[b-0fqgjqx01t] {
    font-size: 0.8rem;
    color: var(--ds-text-secondary);
}

.tender-pagination-info strong[b-0fqgjqx01t] {
    color: var(--ds-text-body);
    font-weight: 600;
}

.tender-pagination-controls[b-0fqgjqx01t] {
    display: flex;
    align-items: center;
    gap: 1rem;
    flex-wrap: wrap;
}

/* ::deep because this class is handed to a MudSelect via Class="...", so it lands on
   that component's root element, which never carries this page's isolation attribute.
   Everything else in this file styles markup the page renders itself and is scoped
   normally. */
[b-0fqgjqx01t] .tender-pagination-size {
    width: 140px;
}

@media (max-width: 600px) {
    .tender-pagination[b-0fqgjqx01t] {
        flex-direction: column;
        align-items: flex-start;
    }

    .tender-pagination-controls[b-0fqgjqx01t] {
        width: 100%;
        justify-content: space-between;
    }
}

/* ============================================================================
   TENDER DATA GRID - Reset MudDataGrid table chrome so rows read as a plain
   card list (header is hidden via HeaderClass="d-none"; a single
   TemplateColumn renders the full card markup per row).
   ============================================================================ */
/* The three .tender-data-grid rules moved to
   wwwroot/styles/integrations/mudblazor.css - they reach MudDataGrid's own
   markup, which is why they were global here in the first place. */

/* ============================================================================
   TENDER CARD - Enterprise Procurement Module
   ============================================================================ */
/* White card on the tinted results zone - the separation now comes from the
   surface contrast and a defined border, not from extra padding. */
.tender-card[b-0fqgjqx01t] {
    background: var(--ds-surface);
    padding: 0.55rem 1rem 0.5rem;
    margin-bottom: 8px;
    transition: border-color 0.12s ease, box-shadow 0.12s ease;
    border: 1px solid #dde3ee;
    border-radius: 7px;
    box-shadow: 0 1px 2px rgba(31, 37, 83, 0.045);
}

.tender-card:hover[b-0fqgjqx01t] {
    border-color: #c8d2e6;
    box-shadow: 0 2px 8px rgba(31, 37, 83, 0.075);
}

/* Top Meta Row */
.tender-meta-row[b-0fqgjqx01t] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 0.2rem;
    gap: 0.75rem;
}

.tender-meta-left[b-0fqgjqx01t] {
    display: flex;
    align-items: center;
    gap: 0.6rem;
}

/* Status Badge */
.tender-status[b-0fqgjqx01t] {
    display: inline-block;
    padding: 0.15rem 0.45rem;
    font-size: var(--ds-text-10);
    font-weight: 700;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    border-radius: 2px;
}

.tender-status--open[b-0fqgjqx01t] {
    background: #dcfce7;
    color: #166534;
}

.tender-status--closing[b-0fqgjqx01t] {
    background: var(--ds-warning-surface);
    color: var(--ds-warning-text);
}

.tender-status--closed[b-0fqgjqx01t] {
    background: var(--ds-surface-sunken);
    color: var(--ds-text-secondary);
}

/* RFQ ID */
.tender-id[b-0fqgjqx01t] {
    font-size: 0.7rem;
    font-weight: 600;
    color: var(--ds-text-secondary);
    font-family: 'SF Mono', Monaco, 'Cascadia Code', Consolas, monospace;
    letter-spacing: 0.02em;
}

/* Published Date */
.tender-published[b-0fqgjqx01t] {
    font-size: 0.7rem;
    font-weight: 500;
    color: var(--ds-text-secondary);
    flex-shrink: 0;
}

/* Title */
.tender-title[b-0fqgjqx01t] {
    font-size: 1.2rem;
    font-weight: 600;
    color: var(--pp-heading);
    margin: 0 0 0.15rem;
    line-height: 1.3;
    letter-spacing: -0.01em;
}

/* Title and description as links: inherit their type entirely, so the only thing
   that marks them as clickable is the hover/focus treatment. */
.tender-title-link[b-0fqgjqx01t],
.tender-description-link[b-0fqgjqx01t] {
    color: inherit;
    text-decoration: none;
    border-radius: 3px;
    transition: color 0.12s ease;
}

.tender-title-link:hover[b-0fqgjqx01t] {
    color: #3d4bb0;
    text-decoration: underline;
    text-underline-offset: 2px;
}

.tender-description-link[b-0fqgjqx01t] {
    display: block;
}

.tender-description-link:hover .tender-description[b-0fqgjqx01t] {
    color: var(--ds-gray-600);
}

.tender-title-link:focus-visible[b-0fqgjqx01t],
.tender-description-link:focus-visible[b-0fqgjqx01t] {
    outline: 2px solid var(--ds-secondary);
    outline-offset: 2px;
}

/* Description (demoted) */
.tender-description[b-0fqgjqx01t] {
    font-size: var(--ds-text-13);
    color: rgba(75, 85, 99, 0.85);
    line-height: 1.45;
    margin: 0 0 0.4rem;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    transition: color 0.12s ease;
}

/* Structured Metadata Grid */
.tender-metadata[b-0fqgjqx01t] {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 0.4rem 0.5rem;
    margin-bottom: 0.4rem;
}

.tender-meta-item[b-0fqgjqx01t] {
    display: flex;
    flex-direction: column;
    gap: 0.15rem;
}

.tender-meta-label[b-0fqgjqx01t] {
    font-size: var(--ds-text-10);
    font-weight: 600;
    color: var(--ds-text-muted);
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

.tender-meta-value[b-0fqgjqx01t] {
    font-size: 0.8rem;
    font-weight: 500;
    color: var(--ds-text-body);
    display: inline-flex;
    align-items: center;
    align-self: flex-start;
    gap: 0.35rem;
    flex-wrap: wrap;
    background: #f8f9fb;
    border: 1px solid var(--pp-divider);
    border-radius: 4px;
    padding: 0.25rem 0.5rem;
}

.tender-meta-value--deadline[b-0fqgjqx01t] {
    font-weight: 600;
    color: var(--pp-heading);
    font-size: 0.8rem;
}

/* Urgent Styling */
.tender-meta-item--urgent .tender-meta-value[b-0fqgjqx01t] {
    color: #b45309;
}

.tender-urgent[b-0fqgjqx01t] {
    font-size: 0.6rem;
    font-weight: 700;
    color: var(--ds-text-inverse);
    background: var(--ds-red-600);
    padding: 0.1rem 0.3rem;
    border-radius: 2px;
    text-transform: uppercase;
}

/* Assignment Tag Groups */
.tender-assign-groups[b-0fqgjqx01t] {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 0.4rem 0.5rem;
    margin-bottom: 0.4rem;
}

.tender-assign-group[b-0fqgjqx01t] {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}

.tender-assign-label[b-0fqgjqx01t] {
    font-size: var(--ds-text-10);
    font-weight: 600;
    color: var(--ds-text-muted);
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

.tender-assign-tags[b-0fqgjqx01t] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.3rem;
}

.tender-tag[b-0fqgjqx01t] {
    display: inline-block;
    padding: 0.25rem 0.5rem;
    font-size: 0.8rem;
    font-weight: 500;
    color: var(--ds-text-body);
    background: var(--pp-surface-alt);
    border: 1px solid var(--pp-border);
    border-radius: 3px;
    white-space: nowrap;
    max-width: 160px;
    overflow: hidden;
    text-overflow: ellipsis;
}

.tender-tag--overflow[b-0fqgjqx01t] {
    color: var(--ds-text-secondary);
    background: transparent;
    border-color: var(--ds-gray-300);
    font-weight: 600;
}

/* Actions */
.tender-actions[b-0fqgjqx01t] {
    display: flex;
    justify-content: flex-end;
    gap: 0.5rem;
    padding-top: 0.4rem;
    border-top: 1px solid var(--pp-divider);
}

.tender-btn--solid[b-0fqgjqx01t] {
    background: var(--pp-heading);
    color: var(--ds-text-inverse);
    border: 1px solid var(--pp-heading);
}

.tender-btn--solid:hover[b-0fqgjqx01t] {
    background: #2a3268;
    border-color: #2a3268;
}

.tender-btn--outline[b-0fqgjqx01t] {
    background: var(--ds-surface);
    color: var(--pp-heading);
    border: 1px solid var(--ds-gray-300);
}

.tender-btn--outline:hover[b-0fqgjqx01t] {
    background: #f8f9fb;
    border-color: var(--ds-border-hover);
}

/* Responsive */
@media (max-width: 900px) {
    .tender-metadata[b-0fqgjqx01t],
    .tender-assign-groups[b-0fqgjqx01t] {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 600px) {
    .tender-metadata[b-0fqgjqx01t],
    .tender-assign-groups[b-0fqgjqx01t] {
        grid-template-columns: 1fr;
    }

    .tender-meta-item[b-0fqgjqx01t] {
        flex-direction: row;
        justify-content: space-between;
        align-items: center;
    }

    .tender-actions[b-0fqgjqx01t] {
        flex-direction: column;
    }

    /* Copy over pills: at this width the three pills would otherwise fill the row. */
    .tender-reassure[b-0fqgjqx01t] {
        gap: 0.65rem;
    }

    .tender-reassure-benefits[b-0fqgjqx01t] {
        gap: 0.35rem;
    }

    .tender-btn[b-0fqgjqx01t] {
        width: 100%;
    }

    .tender-meta-row[b-0fqgjqx01t] {
        flex-direction: column;
        align-items: flex-start;
        gap: 0.35rem;
    }
}
/* /Components/Shared/AcquisitionSuitePricing.razor.rz.scp.css */
.suite-pricing-plans[b-ywx568rxl7] { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; }
@media (max-width: 1200px) { .suite-pricing-plans[b-ywx568rxl7] { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 600px) { .suite-pricing-plans[b-ywx568rxl7] { grid-template-columns: 1fr; } }
/* /Components/Shared/BillingPlanCard.razor.rz.scp.css */
.billing-plan[b-sebl5h64s8] { display: flex; flex-direction: column; padding: 24px; border: 1px solid var(--ds-border); border-radius: 12px; background: var(--ds-surface); min-width: 0; }
.billing-plan-current[b-sebl5h64s8] { border: 2px solid var(--ds-indigo-600); padding: 23px; }
.billing-plan-label[b-sebl5h64s8] { color: var(--ds-text-body); font-size: var(--ds-text-12); font-weight: 600; margin-bottom: 16px; }
.billing-plan-current .billing-plan-label[b-sebl5h64s8] { color: var(--ds-indigo-600); }
.billing-price[b-sebl5h64s8] { font-size: var(--ds-text-32); font-weight: 700; margin-top: 16px; color: var(--ds-text-primary); }
.billing-price span[b-sebl5h64s8] { font-size: var(--ds-text-14); font-weight: 400; color: var(--ds-text-body); }
.billing-features[b-sebl5h64s8] { list-style: none; padding: 0; margin: 0 0 24px; flex: 1; }
.billing-features li[b-sebl5h64s8] { display: flex; justify-content: space-between; flex-wrap: wrap; gap: 8px; padding: 12px 0; border-top: 1px solid var(--ds-divider); font-size: var(--ds-text-14); }
/* /Components/Shared/CompanyLogo.razor.rz.scp.css */
/* Company logo presentation.

   This component renders the only markup that carries these classes, so the rules
   belong here rather than in a global stylesheet.

   Everything static now lives here. The style attribute in the markup carries only
   what varies at runtime - the size and corner radius from the Size/BorderRadius
   parameters, and the initials font size derived from them.

   Two declarations below changed when the static half of the inline style moved in,
   because the inline values were the ones actually winning:
     .company-logo-placeholder had `display: inline-flex` and `background: #f1f5f9`
     in this file, both permanently overridden by `display: flex` and the gradient in
     the style attribute. What is written here now is what the component has always
     rendered. */

.company-logo[b-6hl225gw8p] {
    object-fit: contain;
    background: var(--ds-surface);
    padding: 4px;
    border: 1px solid var(--ds-border);
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05);
    display: inline-block;
    vertical-align: middle;
}

.company-logo-placeholder[b-6hl225gw8p] {
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--prometheon-brand-gradient);
    color: white;
    font-weight: 600;
    border: 1px solid var(--ds-border);
    vertical-align: middle;
}
/* /Components/Shared/CompanyProfileView.razor.rz.scp.css */
/* ============================================================================
   SHARED COMPANY PROFILE VIEW
   Used by both public and hosted company pages
   ============================================================================ */

/* Company Dossier */
.cp-dossier[b-z8bkowbh1h] {
    background: rgba(255, 255, 255, 0.85);
    border: 1px solid rgba(99, 102, 241, 0.15);
    border-radius: 12px;
    padding: 2.5rem;
    margin-bottom: 2.5rem;
    box-shadow:
        0 1px 3px rgba(0, 0, 0, 0.06),
        0 8px 20px rgba(99, 102, 241, 0.08);
}

.cp-vendor-header[b-z8bkowbh1h] {
    display: flex;
    align-items: center;
    gap: 1.5rem;
    margin-bottom: 1.5rem;
}

.cp-vendor-title[b-z8bkowbh1h] {
    font-size: 2.5rem;
    font-weight: 700;
    color: var(--pp-title);
    margin: 0;
    line-height: 1.2;
}

.cp-title-block[b-z8bkowbh1h] {
    display: flex;
    align-items: baseline;
    justify-content: flex-end;
    flex-wrap: wrap;
    gap: 1rem;
    margin-bottom: 1.5rem;
}

.cp-tenders-count[b-z8bkowbh1h] {
    font-size: var(--ds-text-14);
    font-weight: 600;
    color: var(--ds-indigo-500);
    background: rgba(99, 102, 241, 0.08);
    padding: 0.375rem 0.875rem;
    border-radius: 999px;
}

.cp-divider[b-z8bkowbh1h] {
    height: 1px;
    background: rgba(99, 102, 241, 0.15);
    margin: 2rem 0;
}

/* Metadata Section */
.cp-section-header[b-z8bkowbh1h] {
    margin-bottom: 1rem;
}

.cp-section-label[b-z8bkowbh1h] {
    font-size: var(--ds-text-14);
    font-weight: 700;
    color: var(--ds-indigo-500);
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

.cp-metadata-strip[b-z8bkowbh1h] {
    display: flex;
    gap: 3.5rem;
    flex-wrap: wrap;
}

.cp-meta-item[b-z8bkowbh1h] {
    display: flex;
    flex-direction: column;
    gap: 0.375rem;
}

.cp-meta-label[b-z8bkowbh1h] {
    font-size: var(--ds-text-12);
    font-weight: 600;
    color: var(--ds-text-muted);
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

.cp-meta-value[b-z8bkowbh1h] {
    font-size: var(--ds-text-15);
    font-weight: 500;
    color: var(--pp-title);
}

/* ============================================================================
   TENDERS SECTION
   ============================================================================ */

.cp-tenders-section[b-z8bkowbh1h] {
    margin-top: 3rem;
}

.cp-section-title[b-z8bkowbh1h] {
    font-size: var(--ds-text-24);
    font-weight: 700;
    color: var(--pp-title);
    margin-bottom: 1.5rem;
}

.tender-list[b-z8bkowbh1h] {
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
}

.tender-card[b-z8bkowbh1h] {
    background: rgba(255, 255, 255, 0.85);
    border: 1px solid rgba(99, 102, 241, 0.15);
    border-radius: 10px;
    padding: 1.75rem;
    transition: all 0.3s ease;
}

.tender-card:hover[b-z8bkowbh1h] {
    border-color: rgba(99, 102, 241, 0.3);
    box-shadow:
        0 1px 3px rgba(0, 0, 0, 0.06),
        0 8px 20px rgba(99, 102, 241, 0.12);
    transform: translateY(-2px);
}

/* Tender Card Layout - Vertical stack: content on top, actions below */
.tender-card-layout[b-z8bkowbh1h] {
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
}

.tender-content[b-z8bkowbh1h] {
    flex: 1;
    min-width: 0;
}

/* Tender Actions - Bottom right, horizontal layout */
.tender-actions[b-z8bkowbh1h] {
    display: flex;
    flex-direction: row;
    gap: 0.75rem;
    align-self: flex-end;
    justify-content: flex-end;
}

/* Tender Card - Top Meta Row */
.tender-meta-row[b-z8bkowbh1h] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 0.75rem;
    margin-bottom: 1rem;
}

.tender-meta-left[b-z8bkowbh1h] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.tender-status[b-z8bkowbh1h] {
    font-size: var(--ds-text-12);
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    padding: 0.375rem 0.75rem;
    border-radius: 999px;
}
/* Built at runtime by RfqLifecycleDisplay.StatusClass("tender-status", ...), so this
   class name is never written in the markup. */
.tender-status--open[b-z8bkowbh1h] {
    color: var(--ds-success);
    background: rgba(16, 185, 129, 0.1);
}

.tender-id[b-z8bkowbh1h] {
    font-size: var(--ds-text-13);
    font-weight: 600;
    color: var(--ds-text-secondary);
    font-family: 'Courier New', monospace;
}

.tender-published[b-z8bkowbh1h] {
    font-size: var(--ds-text-13);
    color: var(--ds-text-muted);
}

/* Tender Title */
.tender-title[b-z8bkowbh1h] {
    font-size: var(--ds-text-20);
    font-weight: 700;
    color: var(--pp-title);
    margin: 0 0 0.75rem 0;
}

/* Tender Description */
.tender-description[b-z8bkowbh1h] {
    color: var(--ds-gray-600);
    line-height: 1.65;
    margin-bottom: 1.25rem;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
    width: 100%;
}

/* Tender Metadata Grid */
.tender-metadata[b-z8bkowbh1h] {
    display: flex;
    flex-direction: column;
    gap: 1rem;
    margin-bottom: 1.25rem;
}

.tender-meta-row-grid[b-z8bkowbh1h] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
    gap: 1.5rem;
}

.tender-meta-item[b-z8bkowbh1h] {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}

.tender-meta-label[b-z8bkowbh1h] {
    font-size: var(--ds-text-12);
    font-weight: 600;
    color: var(--ds-text-muted);
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

.tender-meta-value[b-z8bkowbh1h] {
    font-size: var(--ds-text-14);
    font-weight: 500;
    color: var(--ds-text-body);
}

/* Tags Section */
.tender-meta-tags-section[b-z8bkowbh1h] {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

.tender-meta-tags-group[b-z8bkowbh1h] {
    display: flex;
    align-items: flex-start;
    gap: 0.75rem;
    flex-wrap: wrap;
}

.tender-meta-tags-label[b-z8bkowbh1h] {
    font-size: var(--ds-text-12);
    font-weight: 600;
    color: var(--ds-text-secondary);
    text-transform: uppercase;
    letter-spacing: 0.05em;
    padding-top: 0.375rem;
    flex-shrink: 0;
}

.tender-meta-tags[b-z8bkowbh1h] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
    flex: 1;
}

.tender-tag[b-z8bkowbh1h] {
    display: inline-flex;
    align-items: center;
    padding: 0.375rem 0.75rem;
    font-size: var(--ds-text-13);
    font-weight: 500;
    border-radius: 6px;
    white-space: nowrap;
}

.tender-tag--spec[b-z8bkowbh1h] {
    background: rgba(16, 185, 129, 0.1);
    color: var(--ds-green-600);
    border: 1px solid rgba(16, 185, 129, 0.2);
}

.tender-tag--product[b-z8bkowbh1h] {
    background: rgba(99, 102, 241, 0.1);
    color: var(--ds-indigo-500);
    border: 1px solid rgba(99, 102, 241, 0.2);
}

.tender-tag--more[b-z8bkowbh1h] {
    background: rgba(156, 163, 175, 0.1);
    color: var(--ds-text-secondary);
    border: 1px solid rgba(156, 163, 175, 0.2);
}

/* Tender Actions */
.tender-actions[b-z8bkowbh1h] {
    display: flex;
    gap: 0.75rem;
    flex-wrap: wrap;
}

.cp-btn--outline[b-z8bkowbh1h] {
    background: transparent;
    color: var(--ds-indigo-500);
    border: 2px solid var(--ds-indigo-500);
}

.cp-btn--outline:hover[b-z8bkowbh1h] {
    background: rgba(99, 102, 241, 0.08);
}

.cp-btn--solid[b-z8bkowbh1h] {
    background: var(--ds-indigo-500);
    color: white;
    border: 2px solid var(--ds-indigo-500);
}

.cp-btn--solid:hover[b-z8bkowbh1h] {
    background: var(--ds-indigo-600);
    border-color: var(--ds-indigo-600);
}

/* Empty State */
.cp-empty-state[b-z8bkowbh1h] {
    text-align: center;
    padding: 3rem 2rem;
    background: rgba(249, 250, 251, 0.75);
    border: 1px dashed rgba(156, 163, 175, 0.3);
    border-radius: 10px;
}

.cp-empty-title[b-z8bkowbh1h] {
    font-size: var(--ds-text-18);
    font-weight: 600;
    color: var(--ds-text-body);
    display: block;
    margin-bottom: 0.5rem;
}

.cp-empty-text[b-z8bkowbh1h] {
    font-size: var(--ds-text-15);
    color: var(--ds-text-secondary);
}

/* ============================================================================
   RESPONSIVE
   ============================================================================ */

@media (max-width: 768px) {
    .cp-dossier[b-z8bkowbh1h] {
        padding: 1.5rem;
    }

    .cp-vendor-header[b-z8bkowbh1h] {
        flex-direction: column;
        align-items: flex-start;
        text-align: left;
    }

    .cp-vendor-title[b-z8bkowbh1h] {
        font-size: var(--ds-text-28);
    }

    .cp-metadata-strip[b-z8bkowbh1h] {
        gap: 1.5rem;
    }

    .tender-card[b-z8bkowbh1h] {
        padding: 1.25rem;
    }

    .tender-card-layout[b-z8bkowbh1h] {
        flex-direction: column;
        gap: 1.5rem;
    }

    .tender-actions[b-z8bkowbh1h] {
        width: 100%;
        min-width: unset;
    }

    .cp-btn[b-z8bkowbh1h] {
        width: 100%;
    }

    .tender-title[b-z8bkowbh1h] {
        font-size: var(--ds-text-18);
    }

    .tender-meta-row-grid[b-z8bkowbh1h] {
        grid-template-columns: repeat(2, 1fr);
        gap: 1rem;
    }

    .tender-meta-tags-group[b-z8bkowbh1h] {
        flex-direction: column;
        align-items: flex-start;
        gap: 0.5rem;
    }
}

/* ============================================================================
   SOCIAL MEDIA LINKS
   ============================================================================ */

.cp-social-links[b-z8bkowbh1h] {
    display: flex;
    gap: 1rem;
    flex-wrap: wrap;
    align-items: center;
}

.cp-social-link[b-z8bkowbh1h] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.625rem 1rem;
    background: rgba(255, 255, 255, 0.9);
    border: 1.5px solid rgba(99, 102, 241, 0.2);
    border-radius: 8px;
    color: var(--ds-gray-600);
    font-size: var(--ds-text-14);
    font-weight: 500;
    text-decoration: none;
    transition: all 0.2s ease;
}

.cp-social-link:hover[b-z8bkowbh1h] {
    background: rgba(99, 102, 241, 0.05);
    border-color: var(--ds-indigo-500);
    color: var(--ds-indigo-500);
    transform: translateY(-1px);
    box-shadow: 0 2px 8px rgba(99, 102, 241, 0.15);
}

.cp-social-icon[b-z8bkowbh1h] {
    width: 1.25rem;
    height: 1.25rem;
    flex-shrink: 0;
}

@media (max-width: 640px) {
    .cp-social-links[b-z8bkowbh1h] {
        gap: 0.75rem;
    }

    .cp-social-link[b-z8bkowbh1h] {
        padding: 0.5rem 0.875rem;
        font-size: var(--ds-text-13);
    }

    .cp-social-icon[b-z8bkowbh1h] {
        width: 1.125rem;
        height: 1.125rem;
    }
}

/* ============================================================================
   VENDOR CAPABILITIES CARD
   ============================================================================ */

.cp-vendor-capabilities[b-z8bkowbh1h] {
    background: rgba(255, 255, 255, 0.85);
    border: 1px solid rgba(99, 102, 241, 0.15);
    border-radius: 12px;
    padding: 2.5rem;
    margin-bottom: 2.5rem;
    box-shadow:
        0 1px 3px rgba(0, 0, 0, 0.06),
        0 8px 20px rgba(99, 102, 241, 0.08);
}

.cp-capability-section[b-z8bkowbh1h] {
    margin-bottom: 2rem;
}

.cp-capability-section:last-child[b-z8bkowbh1h] {
    margin-bottom: 0;
}

.cp-capability-title[b-z8bkowbh1h] {
    font-size: var(--ds-text-15);
    font-weight: 700;
    color: var(--ds-text-body);
    margin: 0 0 1rem 0;
    letter-spacing: -0.01em;
}

/* Industry Classification Grid */
.cp-classification-grid[b-z8bkowbh1h] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: 1.5rem;
}

.cp-classification-item[b-z8bkowbh1h] {
    display: flex;
    flex-direction: column;
    gap: 0.375rem;
}

.cp-classification-label[b-z8bkowbh1h] {
    font-size: var(--ds-text-12);
    font-weight: 600;
    color: var(--ds-text-muted);
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

.cp-classification-value[b-z8bkowbh1h] {
    font-size: var(--ds-text-15);
    font-weight: 600;
    color: var(--pp-title);
}

/* Tags Container */
.cp-tags-container[b-z8bkowbh1h] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
}

.cp-tag[b-z8bkowbh1h] {
    display: inline-flex;
    align-items: center;
    padding: 0.375rem 0.875rem;
    background: rgba(99, 102, 241, 0.08);
    color: var(--ds-indigo-500);
    font-size: var(--ds-text-13);
    font-weight: 600;
    border-radius: 999px;
    transition: all 0.2s ease;
}

.cp-tag:hover[b-z8bkowbh1h] {
    background: rgba(99, 102, 241, 0.15);
    transform: translateY(-1px);
}

.cp-tag--more[b-z8bkowbh1h] {
    background: rgba(107, 114, 128, 0.08);
    color: var(--ds-text-secondary);
}

.cp-tag--more:hover[b-z8bkowbh1h] {
    background: rgba(107, 114, 128, 0.15);
}

/* Procurement Capabilities Subsections */
.cp-procurement-group[b-z8bkowbh1h] {
    margin-bottom: 1.5rem;
}

.cp-procurement-group:last-child[b-z8bkowbh1h] {
    margin-bottom: 0;
}

.cp-procurement-label[b-z8bkowbh1h] {
    display: block;
    font-size: var(--ds-text-13);
    font-weight: 700;
    color: var(--ds-text-secondary);
    text-transform: uppercase;
    letter-spacing: 0.05em;
    margin-bottom: 0.75rem;
}

/* Tag color variations for different capability types */
.cp-tag--category[b-z8bkowbh1h] {
    background: rgba(139, 92, 246, 0.08);
    color: #8b5cf6;
}

.cp-tag--category:hover[b-z8bkowbh1h] {
    background: rgba(139, 92, 246, 0.15);
}

.cp-tag--product[b-z8bkowbh1h] {
    background: rgba(34, 197, 94, 0.08);
    color: #22c55e;
}

.cp-tag--product:hover[b-z8bkowbh1h] {
    background: rgba(34, 197, 94, 0.15);
}

.cp-tag--rfq[b-z8bkowbh1h] {
    background: rgba(234, 88, 12, 0.08);
    color: #ea580c;
}

.cp-tag--rfq:hover[b-z8bkowbh1h] {
    background: rgba(234, 88, 12, 0.15);
}

.cp-tag--subcat[b-z8bkowbh1h] {
    background: rgba(14, 165, 233, 0.08);
    color: #0ea5e9;
}

.cp-tag--subcat:hover[b-z8bkowbh1h] {
    background: rgba(14, 165, 233, 0.15);
}

.cp-tag--spec[b-z8bkowbh1h] {
    background: rgba(236, 72, 153, 0.08);
    color: #ec4899;
}

.cp-tag--spec:hover[b-z8bkowbh1h] {
    background: rgba(236, 72, 153, 0.15);
}

/* Responsive adjustments */
@media (max-width: 768px) {
    .cp-vendor-capabilities[b-z8bkowbh1h] {
        padding: 1.75rem;
    }

    .cp-classification-grid[b-z8bkowbh1h] {
        grid-template-columns: 1fr;
        gap: 1rem;
    }

    .cp-procurement-group[b-z8bkowbh1h] {
        margin-bottom: 1.25rem;
    }
}

/* /Components/Shared/CreateRfqDrawer.razor.rz.scp.css */
/* Reassurance line under the public Create-RFQ form. Rendered by this component
   only, so it moves here out of the global stylesheet. */

.rfq-trust-note[b-1v88lfipqk] {
  font-size: var(--ds-text-12);
  color: #16a34a;
  display: flex;
  align-items: center;
  gap: 8px;
  margin: 4px 0 0;
  padding: 10px 14px;
  background: var(--ds-green-50);
  border-radius: 8px;
  border: 1px solid #bbf7d0;
}

/* Kept as-is: an empty, hidden pseudo-element. It is inert, but removing it is a
   visual decision rather than an ownership one. */
.rfq-trust-note[b-1v88lfipqk]::before {
  content: "";
  display: none;
}
/* /Components/Shared/CreateRfqInternalDrawer.razor.rz.scp.css */
/* Section and field labelling inside the internal (dashboard) Create-RFQ drawer.
   Rendered by this component only, so it moves here out of the global stylesheet.
   The drawer shell itself stays shared - see wwwroot/styles/shared/drawer.css. */

.rfq-internal-section[b-mfqbss12kx] {
  padding: 20px 0;
  border-bottom: 1px solid var(--ds-divider);
}

.rfq-internal-section:last-of-type[b-mfqbss12kx] {
  border-bottom: none;
}

.rfq-internal-section__title[b-mfqbss12kx] {
  font-size: var(--ds-text-14);
  font-weight: 600;
  color: var(--ds-gray-800);
  margin: 0 0 4px;
  letter-spacing: 0.01em;
}

.rfq-internal-section__hint[b-mfqbss12kx] {
  font-size: var(--ds-text-12);
  color: var(--ds-text-secondary);
  margin: 0 0 14px;
}

.rfq-internal-label[b-mfqbss12kx] {
  font-size: var(--ds-text-13);
  font-weight: 500;
  color: var(--ds-text-body);
  margin: 0 0 2px;
}

.rfq-internal-hint[b-mfqbss12kx] {
  font-size: var(--ds-text-11);
  color: var(--ds-text-muted);
  margin: 0;
}
/* /Components/Shared/CreateRfqModal.razor.rz.scp.css */
/* Section Styling */
.rfq-section[b-e3wxrwwsnl] {
    padding: 20px 0;
    border-bottom: 1px solid var(--ds-border);
}

.rfq-section:last-of-type[b-e3wxrwwsnl] {
    border-bottom: none;
}

/* .section-title sits on MudText, which renders its own element. */
.rfq-section[b-e3wxrwwsnl]  .section-title {
    font-weight: 600;
    color: var(--ds-gray-800);
    margin-bottom: 16px;
    font-size: var(--ds-text-15);
    letter-spacing: 0.01em;
}
/* /Components/Shared/EnterprisePagination.razor.rz.scp.css */
/* ============================================================================
   ENTERPRISE PAGINATION - Platform-wide list navigation standard
   Subtle, compact, institutional styling
   ============================================================================ */

.pagination-container[b-bc378mbl37] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1.5rem;
    padding: 1rem 0 0;
    margin-top: 1rem;
    border-top: 1px solid var(--ds-border);
    flex-wrap: wrap;
}

/* Info text: "Showing 1-10 of 81 items" */
.pagination-info[b-bc378mbl37] {
    font-size: 0.8rem;
    color: var(--ds-text-secondary);
    font-weight: 400;
}

.pagination-info strong[b-bc378mbl37] {
    font-weight: 600;
    color: var(--ds-text-body);
}

/* Controls container */
.pagination-controls[b-bc378mbl37] {
    display: flex;
    align-items: center;
    gap: 1.5rem;
    flex-wrap: wrap;
}

/* Rows per page selector */
.pagination-rows[b-bc378mbl37] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.pagination-rows-label[b-bc378mbl37] {
    font-size: var(--ds-text-12);
    color: var(--ds-text-secondary);
    font-weight: 500;
}

.pagination-select[b-bc378mbl37] {
    padding: 0.3rem 0.5rem;
    font-size: var(--ds-text-12);
    font-weight: 500;
    color: var(--ds-text-body);
    background: var(--ds-surface);
    border: 1px solid var(--ds-gray-300);
    border-radius: 4px;
    cursor: pointer;
    outline: none;
    transition: border-color 0.15s ease;
}

.pagination-select:hover[b-bc378mbl37] {
    border-color: var(--ds-border-hover);
}

.pagination-select:focus[b-bc378mbl37] {
    border-color: var(--ds-secondary);
}

/* Navigation buttons container */
.pagination-nav[b-bc378mbl37] {
    display: flex;
    align-items: center;
    gap: 0.25rem;
}

/* All pagination buttons */
.pagination-btn[b-bc378mbl37] {
    padding: 0.35rem 0.65rem;
    font-size: var(--ds-text-12);
    font-weight: 500;
    color: var(--ds-gray-600);
    background: var(--ds-surface);
    border: 1px solid var(--ds-gray-300);
    border-radius: 4px;
    cursor: pointer;
    transition: all 0.12s ease;
    line-height: 1;
}

.pagination-btn:hover:not(:disabled)[b-bc378mbl37] {
    background: var(--ds-surface-alt);
    border-color: var(--ds-border-hover);
    color: var(--pp-heading);
}

.pagination-btn:disabled[b-bc378mbl37] {
    opacity: 0.5;
    cursor: not-allowed;
}

/* Page number buttons */
.pagination-page[b-bc378mbl37] {
    min-width: 32px;
    justify-content: center;
}

.pagination-page--active[b-bc378mbl37] {
    background: var(--ds-surface-sunken);
    border-color: var(--ds-secondary);
    color: var(--ds-secondary);
    font-weight: 600;
}

/* Ellipsis */
.pagination-ellipsis[b-bc378mbl37] {
    padding: 0 0.35rem;
    color: var(--ds-text-muted);
    font-size: var(--ds-text-12);
}

/* Responsive */
@media (max-width: 640px) {
    .pagination-container[b-bc378mbl37] {
        flex-direction: column;
        align-items: stretch;
        gap: 0.75rem;
    }
    
    .pagination-info[b-bc378mbl37] {
        text-align: center;
    }
    
    .pagination-controls[b-bc378mbl37] {
        justify-content: center;
        flex-direction: column;
        gap: 0.75rem;
    }
    
    .pagination-nav[b-bc378mbl37] {
        justify-content: center;
    }
}
/* /Components/Shared/ExistingCompanyConfirmation.razor.rz.scp.css */
.ecc[b-1s7fm0bs1f] {
    border: 1px solid #d5dde8;
    border-radius: 12px;
    background: var(--ds-surface-alt);
    padding: 20px;
}

.ecc__icon[b-1s7fm0bs1f] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    border-radius: 10px;
    background: var(--ds-indigo-100);
    color: #3730a3;
    margin-bottom: 12px;
}

.ecc__title[b-1s7fm0bs1f] {
    margin: 0 0 6px;
    font-size: var(--ds-text-16);
    font-weight: 600;
    color: var(--ds-text-primary);
}

.ecc__body[b-1s7fm0bs1f] {
    margin: 0 0 16px;
    font-size: 13.5px;
    line-height: 1.6;
    color: var(--ds-gray-600);
}

.ecc__actions[b-1s7fm0bs1f] {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.ecc__continue[b-1s7fm0bs1f] {
    width: 100%;
}
/* /Components/Shared/FileList.razor.rz.scp.css */
.file-list-container[b-m1hkw7qeoa] {
    width: 100%;
}

.no-files[b-m1hkw7qeoa] {
    background: #f9f9f9;
    border-radius: 8px;
    border: 1px dashed #e0e0e0;
}

.file-list[b-m1hkw7qeoa] {
    display: flex;
    flex-direction: column;
}

.file-item[b-m1hkw7qeoa] {
    background: var(--ds-surface);
    border: 1px solid #e8e8e8;
    border-radius: 8px;
    transition: all 0.2s ease;
}

.file-item:hover[b-m1hkw7qeoa] {
    border-color: var(--ds-primary);
    box-shadow: 0 2px 8px rgba(102, 126, 234, 0.1);
}

.file-icon[b-m1hkw7qeoa] {
    width: 40px;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #f5f5f5;
    border-radius: 8px;
}

.file-info[b-m1hkw7qeoa] {
    flex: 1;
    overflow: hidden;
}

.file-actions[b-m1hkw7qeoa] {
    flex-shrink: 0;
}

/* /Components/Shared/FileUpload.razor.rz.scp.css */
.file-upload-container[b-3l88pgsohw] {
    width: 100%;
}

.drop-zone[b-3l88pgsohw] {
    border: 2px dashed #ccc;
    border-radius: 12px;
    padding: 32px;
    text-align: center;
    transition: all 0.3s ease;
    background: #fafafa;
    cursor: pointer;
}

.drop-zone:hover[b-3l88pgsohw] {
    border-color: var(--ds-primary);
    background: #f0f4ff;
}

.drop-zone.dragging[b-3l88pgsohw] {
    border-color: var(--ds-primary);
    background: #e8edff;
    transform: scale(1.01);
}

.drop-zone-content[b-3l88pgsohw] {
    display: flex;
    flex-direction: column;
    align-items: center;
}

.visibility-selection[b-3l88pgsohw] {
    background: #f5f5f5;
    border-radius: 8px;
    padding: 16px;
}

.selected-files[b-3l88pgsohw] {
    background: var(--ds-surface);
    border: 1px solid #e0e0e0;
    border-radius: 8px;
    padding: 16px;
}

.selected-file[b-3l88pgsohw] {
    background: #f9f9f9;
    border-radius: 6px;
    transition: background 0.2s;
}

.selected-file:hover[b-3l88pgsohw] {
    background: #f0f0f0;
}
/* /Components/Shared/HostedFooter.razor.rz.scp.css */
.hosted-footer[b-ebkt59lecv] {
    background: var(--prometheon-hero-bg);
    border-top: 1px solid rgba(255, 255, 255, 0.1);
    padding: 2rem 0;
    margin-top: auto;
}

.hosted-footer-container[b-ebkt59lecv] {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 1.5rem;
    text-align: center;
}

.hosted-footer-text[b-ebkt59lecv] {
    color: rgba(255, 255, 255, 0.9);
    font-size: var(--ds-text-14);
}

.hosted-footer-link[b-ebkt59lecv] {
    color: white;
    font-weight: 600;
    text-decoration: none;
    transition: color 0.2s;
}

.hosted-footer-link:hover[b-ebkt59lecv] {
    color: rgba(255, 255, 255, 0.8);
    text-decoration: underline;
}
/* /Components/Shared/HostedHeader.razor.rz.scp.css */
.hosted-header[b-ctxko7kd3x] {
    background: var(--prometheon-hero-bg);
    border-bottom: 1px solid rgba(255, 255, 255, 0.1);
    padding: 1rem 0;
    position: sticky;
    top: 0;
    z-index: 10;
}

.hosted-header-container[b-ctxko7kd3x] {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 1.5rem;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    gap: 1.5rem;
}

.hosted-company-info[b-ctxko7kd3x] {
    display: flex;
    flex-direction: column;
    gap: 0.05rem;
}

.hosted-company-name[b-ctxko7kd3x] {
    font-size: 3.5rem;
    font-weight: 600;
    color: white;
    margin: 0;
    line-height: 1.2;
}

.hosted-company-domain[b-ctxko7kd3x] {
    font-size: var(--ds-text-14);
    color: rgba(255, 255, 255, 0.7);
    margin: 0;
    line-height: 1.2;
}

@media (max-width: 640px) {
    .hosted-header[b-ctxko7kd3x] {
        padding: 1rem 0;
    }

    .hosted-company-name[b-ctxko7kd3x] {
        font-size: var(--ds-text-32);
    }

    .hosted-company-domain[b-ctxko7kd3x] {
        font-size: var(--ds-text-12);
    }
}
/* /Components/Shared/OnboardingTour.razor.rz.scp.css */
/* Tour Overlay */
.tour-overlay[b-4p79qlmoj5] {
    animation: fadeIn-b-4p79qlmoj5 0.3s ease;
}

@keyframes fadeIn-b-4p79qlmoj5 {
    from { opacity: 0; }
    to { opacity: 1; }
}

/* Tour Card Animation */
.tour-card[b-4p79qlmoj5] {
    animation: slideUp-b-4p79qlmoj5 0.4s ease;
}

@keyframes slideUp-b-4p79qlmoj5 {
    from {
        opacity: 0;
        transform: translateX(-50%) translateY(20px);
    }
    to {
        opacity: 1;
        transform: translateX(-50%) translateY(0);
    }
}

/* Spotlight Animation */
.tour-spotlight[b-4p79qlmoj5] {
    animation: spotlightPulse-b-4p79qlmoj5 2s ease-in-out infinite;
}

@keyframes spotlightPulse-b-4p79qlmoj5 {
    0%, 100% {
        border-color: rgba(102, 126, 234, 0.8);
        box-shadow: 0 0 0 9999px rgba(0, 0, 0, 0.6), 0 0 20px rgba(102, 126, 234, 0.5);
    }
    50% {
        border-color: rgba(102, 126, 234, 1);
        box-shadow: 0 0 0 9999px rgba(0, 0, 0, 0.6), 0 0 30px rgba(102, 126, 234, 0.8);
    }
}

/* Button Hover States */
.tour-card button:hover[b-4p79qlmoj5] {
    transform: translateY(-1px);
}

/* Highlighted element style */
[b-4p79qlmoj5] .tour-highlighted {
    position: relative;
    z-index: 10001 !important;
}
/* /Components/Shared/PrometheonFooter.razor.rz.scp.css */
.prometheon-footer[b-zcov2hrsrg] {
    background: #1b3554;
    color: var(--ds-text-inverse);
    padding: 2.5rem 0 1.5rem;
    margin-top: auto;
    position: relative;
    z-index: 1;
}

.prometheon-container[b-zcov2hrsrg] {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 2.5rem;
}

.prometheon-footer-grid[b-zcov2hrsrg] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1.5rem;
    align-items: center;
}

.prometheon-footer-brand[b-zcov2hrsrg] {
    display: flex;
    align-items: center;
    gap: 0.85rem;
}

.prometheon-brand-text[b-zcov2hrsrg] {
    display: flex;
    flex-direction: column;
    line-height: 1.1;
}

.prometheon-brand-name[b-zcov2hrsrg] {
    font-size: 1.1rem;
    font-weight: 700;
    letter-spacing: 0.08em;
}

.prometheon-brand-subtitle[b-zcov2hrsrg] {
    font-size: var(--ds-text-12);
    opacity: 0.8;
}

.prometheon-elioplus-link[b-zcov2hrsrg] {
    color: inherit;
    text-decoration: none;
}

.prometheon-elioplus-link:hover[b-zcov2hrsrg] {
    text-decoration: underline;
}

.prometheon-footer-social[b-zcov2hrsrg] {
    display: flex;
    justify-content: flex-end;
    gap: 1rem;
}

.prometheon-footer-social a[b-zcov2hrsrg] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    background: rgba(255, 255, 255, 0.08);
    border-radius: 8px;
    color: rgba(255, 255, 255, 0.75);
    transition: color 0.15s ease, background 0.15s ease;
    text-decoration: none;
}

.prometheon-footer-social a:hover[b-zcov2hrsrg] {
    color: var(--ds-text-inverse);
    background: rgba(255, 255, 255, 0.15);
}

.prometheon-footer-social svg[b-zcov2hrsrg] {
    width: 16px;
    height: 16px;
    flex-shrink: 0;
}

/* Mirrors the header's public links so the two navigations stay in step. */
.prometheon-footer-nav[b-zcov2hrsrg] {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 0.75rem 1.5rem;
    margin-top: 1.75rem;
    padding-top: 1.25rem;
    border-top: 1px solid rgba(255, 255, 255, 0.12);
    font-size: var(--ds-text-14);
}

.prometheon-footer-nav a[b-zcov2hrsrg] {
    color: var(--ds-text-inverse);
    text-decoration: none;
    font-weight: 500;
    opacity: 0.8;
    transition: opacity 0.15s ease;
}

.prometheon-footer-nav a:hover[b-zcov2hrsrg] {
    opacity: 1;
}

.prometheon-footer-copy[b-zcov2hrsrg] {
    text-align: center;
    margin-top: 1rem;
    font-size: 0.8rem;
    opacity: 0.7;
}

.prometheon-footer-copy a[b-zcov2hrsrg] {
    color: inherit;
    text-decoration: none;
}

.prometheon-footer-copy a:hover[b-zcov2hrsrg] {
    text-decoration: underline;
}

@media (max-width: 768px) {
    .prometheon-footer-grid[b-zcov2hrsrg] {
        grid-template-columns: 1fr;
        text-align: center;
        gap: 1.5rem;
    }

    .prometheon-footer-brand[b-zcov2hrsrg] {
        justify-content: center;
    }

    .prometheon-footer-social[b-zcov2hrsrg] {
        justify-content: center;
    }

    .prometheon-container[b-zcov2hrsrg] {
        padding: 0 1.25rem;
    }
}
/* /Components/Shared/ProposalDrawer.razor.rz.scp.css */
/* ============================================================================
   PROPOSAL DRAWER - confidence panel
   Closes the public proposal form: sits after the last input and directly above the
   footer's Continue action.

   Deliberately scoped rather than global. This was first written when App.razor
   linked MudBlazor.min.css last, after every application stylesheet; it now links it
   first (see the note there). The reasoning still holds: a plain-class rule in a
   global sheet is easy to outrank and the first casualty of a stale static-asset
   build, while scoped rules carry an extra [b-*] attribute (class + attribute
   specificity) and ship with the component.

   Treatment rules: informational Prometheon blue, never success green as the dominant
   surface, never a validation/alert look - nothing has been submitted at this point.
   ============================================================================ */

.pd-panel[b-juncbq84yu] {
    position: relative;
    /* Kept tight against the last field: the panel is meant to be read in the same
       glance as the form, without the viewport having to be scrolled to reach it. */
    margin-top: 14px;
    padding: 13px 16px 13px 17px;
    background:
        radial-gradient(130% 120% at 0% 0%, var(--ds-surface) 0%, rgba(255, 255, 255, 0) 60%),
        linear-gradient(180deg, #f6f9ff 0%, #eef4fd 100%);
    border: 1px solid #d8e3f6;
    border-radius: 12px;
    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04), 0 10px 24px rgba(47, 111, 228, 0.07);
    overflow: hidden;
}

/* Restrained brand rail - the panel's only saturated element besides the mark. */
.pd-panel[b-juncbq84yu]::before {
    content: "";
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    width: 3px;
    background: linear-gradient(180deg, var(--ds-primary) 0%, #6ea8f0 100%);
}

.pd-panel__head[b-juncbq84yu] {
    display: flex;
    align-items: flex-start;
    gap: 12px;
}

.pd-panel__mark[b-juncbq84yu] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    width: 32px;
    height: 32px;
    margin-top: 1px;
    color: var(--ds-text-inverse);
    background: linear-gradient(180deg, var(--ds-primary) 0%, #4f8fdc 100%);
    border-radius: 9px;
    box-shadow: 0 2px 6px rgba(47, 111, 228, 0.32);
}

.pd-panel__copy[b-juncbq84yu] {
    min-width: 0;
}

.pd-panel__title[b-juncbq84yu] {
    margin: 0 0 4px;
    font-size: var(--ds-text-15);
    font-weight: 700;
    line-height: 1.3;
    letter-spacing: -0.01em;
    color: #0f172a;
}

.pd-panel__text[b-juncbq84yu] {
    margin: 0;
    font-size: var(--ds-text-13);
    line-height: 1.5;
    color: var(--ds-gray-600);
}

/* ----------------------------------------------------------------------------
   Benefits - three scannable tiles, not bullets and not one grey sentence.
   auto-fit keeps them on one row in the 700px drawer and lets them wrap, then
   stack, as the drawer narrows.
   ---------------------------------------------------------------------------- */

.pd-benefits[b-juncbq84yu] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(152px, 1fr));
    gap: 8px;
    margin-top: 10px;
}

.pd-benefit[b-juncbq84yu] {
    display: flex;
    align-items: center;
    gap: 8px;
    min-width: 0;
    padding: 8px 11px;
    background: var(--ds-surface);
    border: 1px solid #e3e9f4;
    border-radius: 9px;
    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04);
}

.pd-benefit__icon[b-juncbq84yu] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    width: 24px;
    height: 24px;
    border-radius: 7px;
}

.pd-benefit__label[b-juncbq84yu] {
    font-size: 12.5px;
    font-weight: 600;
    line-height: 1.25;
    letter-spacing: -0.005em;
    color: var(--ds-text-body);
}

/* One quiet accent each, all drawn from the Prometheon blue family except the single
   positive green on "Free to submit" - enough to separate them at a glance without
   turning the panel into a rainbow. */
.pd-benefit--free[b-juncbq84yu] {
    border-color: #cdeadd;
    background: linear-gradient(180deg, var(--ds-surface) 0%, #f4fcf8 100%);
}

.pd-benefit--free .pd-benefit__icon[b-juncbq84yu] {
    color: #0f9f6e;
    background: #e7f7f0;
}

.pd-benefit--nosignup[b-juncbq84yu] {
    border-color: #d9dcf7;
    background: linear-gradient(180deg, var(--ds-surface) 0%, #f7f8ff 100%);
}

.pd-benefit--nosignup .pd-benefit__icon[b-juncbq84yu] {
    color: var(--ds-indigo-600);
    background: #eceefe;
}

.pd-benefit--quick[b-juncbq84yu] {
    border-color: #d2e2fa;
    background: linear-gradient(180deg, var(--ds-surface) 0%, #f5f9ff 100%);
}

.pd-benefit--quick .pd-benefit__icon[b-juncbq84yu] {
    color: var(--ds-primary);
    background: #e7f0fd;
}

/* ---------------------------------------------------------------------------
   Tender context block.

   Moved here from the global stylesheet: this drawer renders the only markup
   carrying these classes, and it renders it directly, so the component's own
   isolation scope reaches it.

   The drawer shell around it is genuinely shared with the two Create-RFQ
   drawers and stays in wwwroot/styles/shared/drawer.css.

   Position matters. While these rules were global they were plain class
   selectors, and .pd-step2__context - being scoped - outranked them. Scoping
   both makes the two equally specific, so the step-2 overrides further down
   only keep winning because they come after this block. Keep it above them.
   --------------------------------------------------------------------------- */

.rfq-tender-context[b-juncbq84yu] {
  background: var(--ds-surface-alt);
  border: 1px solid var(--ds-border);
  border-radius: 8px;
  padding: 12px 16px;
  margin-bottom: 20px;
  pointer-events: none;
  user-select: none;
}

.rfq-tender-context__label[b-juncbq84yu] {
  font-size: var(--ds-text-11);
  font-weight: 500;
  color: var(--ds-text-muted);
  text-transform: uppercase;
  letter-spacing: 0.05em;
  margin: 0 0 4px;
}

.rfq-tender-context__title[b-juncbq84yu] {
  font-size: var(--ds-text-14);
  font-weight: 600;
  color: var(--ds-text-primary);
  margin: 0 0 8px;
}

.rfq-tender-context__chips[b-juncbq84yu] {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}

.rfq-tender-context__chip[b-juncbq84yu] {
  font-size: var(--ds-text-11);
  color: var(--ds-text-body);
  background: var(--ds-surface-chip);
  border-radius: 4px;
  padding: 2px 8px;
}

/* ============================================================================
   STEP 2 - contact details
   The four inputs are short and the drawer body is tall, so the step is laid out
   as a full-height column: fields at the top, the closing reassurance pushed down
   against the submit action. Without this the step reads as four inputs floating
   in an empty panel. The paired two-column rows themselves are unchanged (.ds-field-row
   in styles/shared/drawer.css) and still collapse to one column on a narrow drawer.
   ============================================================================ */

/* The inactive step is hidden, not unmounted - so this has to beat the display rules
   below, which would otherwise keep the hidden step laid out. */
.pd-step[hidden][b-juncbq84yu] {
    display: none !important;
}

.pd-step2[b-juncbq84yu] {
    display: flex;
    flex-direction: column;
    min-height: 100%;
}

.pd-step2__context[b-juncbq84yu] {
    margin-bottom: 0;
}

.pd-step2__context .rfq-tender-context__title[b-juncbq84yu] {
    margin-bottom: 0;
}

/* The two field rows take the space between the context strip and the closing
   reassurance and sit centred in it, rather than stacking against the top edge.
   ::deep because MudForm renders the .ds-drawer-form element, so it carries no scope id. */
.pd-step2[b-juncbq84yu]  .ds-drawer-form {
    flex: 1;
    justify-content: center;
    padding: 20px 0;
}

/* ----------------------------------------------------------------------------
   Compact closing reassurance - the same three promises as Step 1's panel, as a
   single quiet row. Deliberately NOT the full panel: the explanation is Step 1's job,
   this is only the last thing read before submitting.
   ---------------------------------------------------------------------------- */

.pd-reassure[b-juncbq84yu] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 6px;
    margin-top: auto;
    padding-top: 18px;
}

.pd-reassure__item[b-juncbq84yu] {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    padding: 6px 10px;
    background: var(--ds-surface);
    border: 1px solid #e3e9f4;
    border-radius: 999px;
}

.pd-reassure__icon[b-juncbq84yu] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    width: 20px;
    height: 20px;
    border-radius: 999px;
}

.pd-reassure__label[b-juncbq84yu] {
    font-size: var(--ds-text-12);
    font-weight: 600;
    line-height: 1.2;
    letter-spacing: -0.005em;
    color: var(--ds-text-body);
    white-space: nowrap;
}

/* Same accents as the Step 1 tiles, so the two read as one promise restated. */
.pd-reassure__item--free[b-juncbq84yu] {
    border-color: #cdeadd;
}

.pd-reassure__item--free .pd-reassure__icon[b-juncbq84yu] {
    color: #0f9f6e;
    background: #e7f7f0;
}

.pd-reassure__item--nosignup[b-juncbq84yu] {
    border-color: #d9dcf7;
}

.pd-reassure__item--nosignup .pd-reassure__icon[b-juncbq84yu] {
    color: var(--ds-indigo-600);
    background: #eceefe;
}

.pd-reassure__item--quick[b-juncbq84yu] {
    border-color: #d2e2fa;
}

.pd-reassure__item--quick .pd-reassure__icon[b-juncbq84yu] {
    color: var(--ds-primary);
    background: #e7f0fd;
}

/* ----------------------------------------------------------------------------
   RESPONSIVE - the drawer goes full-width below 540px (see .ds-drawer in
   wwwroot/styles/shared/drawer.css)
   ---------------------------------------------------------------------------- */

@media (max-width: 540px) {
    .pd-panel[b-juncbq84yu] {
        margin-top: 12px;
        padding: 12px 14px 12px 15px;
    }

    .pd-panel__head[b-juncbq84yu] {
        gap: 10px;
    }

    .pd-panel__mark[b-juncbq84yu] {
        width: 28px;
        height: 28px;
        border-radius: 8px;
    }

    .pd-panel__title[b-juncbq84yu] {
        font-size: var(--ds-text-14);
    }

    .pd-panel__text[b-juncbq84yu] {
        font-size: 12.5px;
    }

    /* Stack rather than squeeze: two short tiles beside one long label reads badly. */
    .pd-benefits[b-juncbq84yu] {
        grid-template-columns: 1fr;
        gap: 7px;
    }

    .pd-benefit[b-juncbq84yu] {
        padding: 8px 10px;
    }

    /* The full-screen drawer has room below the fields already - keep the closing row
       tight to them rather than stranded at the bottom of a tall phone viewport. */
    .pd-step2[b-juncbq84yu] {
        min-height: 0;
    }

    /* Nothing to centre once the content is taller than the phone viewport. */
    .pd-step2[b-juncbq84yu]  .ds-drawer-form {
        padding: 16px 0 0;
    }

    .pd-reassure[b-juncbq84yu] {
        padding-top: 20px;
    }
}
/* /Components/Shared/RestrictedDashboard.razor.rz.scp.css */
.rd[b-axqux9tzz9] { display: flex; flex-direction: column; gap: 8px; }

.rd-banner[b-axqux9tzz9] {
    display: flex;
    align-items: flex-start;
    gap: 16px;
    flex-wrap: wrap;
    border: 1px solid #d5dde8;
    border-radius: 12px;
    background: #eef3ff;
    padding: 18px 20px;
    margin-bottom: 8px;
}

.rd-banner__icon[b-axqux9tzz9] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    border-radius: 10px;
    background: var(--ds-surface);
    color: var(--ds-blue-900);
    flex-shrink: 0;
}

.rd-banner__text[b-axqux9tzz9] { flex: 1 1 320px; min-width: 240px; }

.rd-banner__title[b-axqux9tzz9] {
    margin: 0 0 4px;
    font-size: var(--ds-text-16);
    font-weight: 600;
    color: var(--ds-blue-900);
}

.rd-banner__body[b-axqux9tzz9] {
    margin: 0;
    font-size: var(--ds-text-13);
    line-height: 1.6;
    color: var(--ds-text-body);
}

.rd-banner__action[b-axqux9tzz9] { flex-shrink: 0; align-self: center; }

.rd-section-label[b-axqux9tzz9] {
    font-size: var(--ds-text-11);
    font-weight: 700;
    letter-spacing: 0.6px;
    text-transform: uppercase;
    color: var(--ds-text-muted);
    margin: 12px 0 8px;
}

.rd-grid[b-axqux9tzz9] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
    gap: 12px;
}

.rd-card[b-axqux9tzz9] {
    border: 1px solid var(--ds-border);
    border-radius: 10px;
    background: var(--ds-surface);
    padding: 14px 16px;
    text-decoration: none;
    display: block;
}

.rd-card--open[b-axqux9tzz9] { transition: border-color 120ms ease, box-shadow 120ms ease; }

.rd-card--open:hover[b-axqux9tzz9] {
    border-color: var(--ds-primary);
    box-shadow: 0 2px 10px rgba(47, 111, 228, 0.12);
}

.rd-card--locked[b-axqux9tzz9] { background: var(--ds-surface-alt); border-style: dashed; }
.rd-card--locked .rd-card__title[b-axqux9tzz9] { color: var(--ds-text-secondary); }
.rd-card--empty[b-axqux9tzz9] { background: var(--ds-surface-alt); }

.rd-card__head[b-axqux9tzz9] {
    display: flex;
    align-items: center;
    gap: 8px;
    color: var(--ds-blue-900);
    margin-bottom: 8px;
}

.rd-card__title[b-axqux9tzz9] {
    font-size: var(--ds-text-13);
    font-weight: 600;
    color: var(--ds-text-primary);
}

/* The lock is a MudIcon. It has no colour of its own: MudIcon defaults to
   Color.Inherit (`color: inherit !important`), so it takes the header's colour. */
.rd-card__head[b-axqux9tzz9]  .rd-card__lock { margin-left: auto; }

.rd-card__primary[b-axqux9tzz9] {
    margin: 0 0 4px;
    font-size: var(--ds-text-14);
    font-weight: 600;
    color: var(--ds-text-primary);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.rd-card__hint[b-axqux9tzz9] {
    margin: 0;
    font-size: var(--ds-text-12);
    line-height: 1.5;
    color: var(--ds-text-secondary);
}
