/* Shared public-page components used by listings and static pages. */

.listing-breadcrumbs {
    display: flex;
    align-items: center;
    gap: 9px;
    margin-bottom: 28px;
    color: rgba(255, 255, 255, 0.78);
    font-size: 0.78rem;
}

.listing-breadcrumbs a:hover {
    color: var(--white);
    text-decoration: underline;
}

.listing-page-heading {
    padding-block: clamp(30px, 4vw, 50px) 12px;
}

.listing-page-heading .listing-wide-container {
    width: min(calc(100% - 32px), 1656px);
}

.listing-page-heading .public-page-title {
    width: 100%;
    max-width: none;
}

.public-content-shell {
    width: min(calc(100% - 32px), 1490px);
    margin-inline: auto;
}

.listing-page-heading .listing-wide-container.public-content-shell {
    width: min(calc(100% - 32px), 1490px);
    margin-inline: auto;
}

.listing-page-heading .listing-breadcrumbs {
    min-width: 0;
    margin: 0;
    color: #748179;
    font-size: 0.9rem;
}

.listing-page-heading .listing-breadcrumbs a {
    color: #5c6e64;
    text-decoration: none;
}

.listing-page-heading .listing-breadcrumbs a:hover {
    color: var(--green-700);
}

.listing-page-heading .listing-breadcrumb-current {
    color: #30483c;
    font-weight: 400;
}

.listing-heading-toolbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 22px;
    min-height: 66px;
    margin-top: 24px;
    padding: 10px 12px 10px 18px;
    background: #fff;
    border: 1px solid #dce6e0;
    border-radius: 16px;
    box-shadow: 0 8px 26px rgba(24, 57, 44, 0.06);
}

.listing-heading-actions {
    display: flex;
    flex: 0 0 auto;
    align-items: center;
    gap: 9px;
}

.listing-heading-action {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 44px;
    height: 44px;
    padding: 0;
    color: #30493d;
    background: #fff;
    border: 1px solid #d4dfd9;
    border-radius: 999px;
    box-shadow: 0 4px 12px rgba(21, 53, 40, 0.07);
    font: inherit;
    cursor: pointer;
    transition: border-color 160ms ease, color 160ms ease, background 160ms ease;
}

.listing-heading-action:hover {
    color: var(--green-700);
    background: #f4f9f6;
    border-color: #a9c8b8;
}

.listing-heading-action:focus-visible {
    outline: 3px solid rgba(45, 106, 79, 0.18);
    outline-offset: 2px;
}

.listing-heading-action svg {
    width: 20px;
    height: 20px;
    fill: none;
    stroke: currentColor;
    stroke-linecap: round;
    stroke-linejoin: round;
    stroke-width: 1.7;
}

.listing-heading-favorite[aria-pressed="true"] {
    color: #a83636;
    background: #fff4f4;
    border-color: #e5baba;
}

.listing-heading-favorite[aria-pressed="true"] svg {
    fill: currentColor;
}

.listing-heading-report {
    color: #a77939;
    background: #fffbf4;
    border-color: #eadfce;
}

.listing-heading-report:hover {
    color: #8f642c;
    background: #fff7e8;
    border-color: #ddc8a9;
}

.listing-public-feature-list {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 9px;
    padding: 0;
    margin: 22px 0 0;
    list-style: none;
}

.listing-public-feature-list li {
    min-width: 0;
    color: #32483d;
    background: #f8fbf9;
    border: 1px solid #e0e9e4;
    border-radius: 11px;
    font-size: 0.84rem;
    font-weight: 700;
}

.listing-public-feature-item {
    display: flex;
    min-width: 0;
    min-height: 64px;
    align-items: center;
    gap: 9px;
    padding: 12px 14px 12px 9px;
    color: inherit;
    border-radius: inherit;
    text-decoration: none;
}

a.listing-public-feature-item {
    transition: color .18s ease, background-color .18s ease;
}

a.listing-public-feature-item:hover {
    color: var(--green-700);
    background: #f0f7f3;
}

a.listing-public-feature-item:focus-visible {
    outline: 2px solid var(--green-700);
    outline-offset: 2px;
}

.listing-public-feature-list i {
    display: grid;
    flex: 0 0 auto;
    width: 34px;
    height: 34px;
    color: var(--green-700);
    background: #edf6f1;
    border-radius: 8px;
    place-items: center;
}

.listing-public-feature-list svg {
    width: 20px;
    height: 20px;
    fill: none;
    stroke: currentColor;
    stroke-linecap: round;
    stroke-linejoin: round;
    stroke-width: 1.8;
}

.listing-public-feature-list span {
    min-width: 0;
    overflow-wrap: anywhere;
}

/* Desktop content density mirrors the previously used 90% browser zoom. */
@media (min-width: 1081px) {
    .listing-page-heading { padding-block: clamp(27px, 3.6vw, 45px) 11px; }
    .listing-page-heading .listing-wide-container { width: min(calc(100% - 32px), 1490px); }
    .listing-page-heading .listing-breadcrumbs { font-size: .81rem; }
    .listing-heading-toolbar { min-height: 59px; gap: 20px; margin-top: 22px; padding: 9px 11px 9px 16px; border-radius: 14px; }
    .listing-heading-actions { gap: 8px; }
    .listing-heading-action { min-width: 40px; height: 40px; }
    .listing-heading-action svg { width: 18px; height: 18px; }
    .listing-public-feature-list { gap: 8px; margin-top: 20px; }
    .listing-public-feature-list li { font-size: .76rem; }
    .listing-public-feature-item { min-height: 58px; gap: 8px; padding: 10px 12px 10px 8px; }
    .listing-public-feature-list i { width: 31px; height: 31px; }
    .listing-public-feature-list svg { width: 18px; height: 18px; }
}

@media (max-width: 760px) {
    .listing-page-heading {
        padding-top: 28px;
    }

    .listing-public-feature-list {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .listing-page-heading .listing-breadcrumbs {
        gap: 7px;
        overflow-x: auto;
        padding-bottom: 3px;
        white-space: nowrap;
        scrollbar-width: none;
    }

    .listing-heading-toolbar {
        align-items: stretch;
        flex-direction: column;
        gap: 9px;
        padding: 12px;
    }

    .listing-heading-actions {
        justify-content: flex-end;
        padding-top: 9px;
        border-top: 1px solid #edf1ef;
    }

    .listing-active-content .listing-page-heading .listing-breadcrumbs {
        display: none;
    }

    .listing-active-content .listing-heading-toolbar {
        align-items: center;
        justify-content: flex-end;
        flex-direction: row;
    }

    .listing-active-content .listing-heading-actions {
        padding-top: 0;
        border-top: 0;
    }

    .listing-page-heading .listing-breadcrumbs::-webkit-scrollbar {
        display: none;
    }
}

@media (max-width: 680px) {
    .public-content-shell {
        width: min(calc(100% - 30px), 1490px);
    }

    .listing-page-heading .listing-wide-container.public-content-shell {
        width: min(calc(100% - 30px), 1490px);
    }
}

@media (max-width: 640px) {
    .listing-public-feature-list {
        grid-template-columns: 1fr;
    }
}