.bv-detail-hero {
    display: flex;
    flex-wrap: wrap;
    gap: 20px;
    align-items: flex-start;
    background: var(--bv-surface);
    border: 1px solid var(--bv-border);
    border-radius: var(--bv-radius-lg);
    padding: 28px;
    margin-top: 24px;
}

.bv-detail-hero__photo {
    width: 64px;
    height: 64px;
    border-radius: var(--bv-radius-md);
    background: var(--bv-primary-light);
    color: var(--bv-primary-dark);
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 700;
    font-size: 1.1rem;
    flex-shrink: 0;
}

.bv-detail-hero__body {
    flex: 1;
    min-width: 240px;
}

.bv-detail-hero__meta {
    color: var(--bv-text-muted);
    margin-bottom: 8px;
}

.bv-detail-hero__actions {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    width: 100%;
    margin-top: 12px;
}

.bv-detail-tabs {
    margin-top: 32px;
}

.bv-detail-tabs__nav {
    display: flex;
    gap: 6px;
    border-bottom: 1px solid var(--bv-border);
    overflow-x: auto;
}

.bv-detail-tabs__nav button {
    min-height: 44px;
    padding: 0 16px;
    border: none;
    background: none;
    font-weight: 600;
    color: var(--bv-text-muted);
    cursor: pointer;
    border-bottom: 3px solid transparent;
    white-space: nowrap;
}

.bv-detail-tabs__nav button.is-active {
    color: var(--bv-primary-dark);
    border-bottom-color: var(--bv-primary);
}

.bv-detail-tabs__panel {
    padding-top: 24px;
}

.bv-map-placeholder {
    height: 200px;
    border-radius: var(--bv-radius-md);
    background: repeating-linear-gradient(45deg, var(--bv-background), var(--bv-background) 10px, #eef3f2 10px, #eef3f2 20px);
    border: 1px dashed var(--bv-border);
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    color: var(--bv-text-muted);
    font-size: 0.875rem;
    padding: 16px;
}

@media (max-width: 640px) {
    .bv-detail-hero {
        padding: 20px;
    }

    .bv-detail-hero__actions .bv-btn {
        flex: 1 1 calc(50% - 5px);
    }
}

/* ── Facility detail (AAZ.Healthcare FacilityDetail.cshtml) ─────────────────
   Order: facility information (hero → contact + intro/hours/services) → departments → doctors.
   Departments/doctors sections are rendered only when real public data exists. */

.bv-detail-hero__badges {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
    margin-top: 4px;
}

.bv-detail-hero__badges .bv-flag {
    margin: 0;
}

.bv-facility-overview {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 340px;
    grid-template-areas: "main contact";
    gap: 24px;
    align-items: start;
    margin-top: 24px;
}

.bv-facility-overview--single {
    grid-template-columns: minmax(0, 1fr);
    grid-template-areas: "main";
}

.bv-facility-overview--single .bv-facility-contact {
    grid-area: main;
}

.bv-facility-main {
    grid-area: main;
    display: grid;
    gap: 24px;
    min-width: 0;
}

.bv-facility-contact {
    grid-area: contact;
}

.bv-facility-card {
    background: var(--bv-surface);
    border: 1px solid var(--bv-border);
    border-radius: var(--bv-radius-md);
    padding: 24px;
    min-width: 0;
}

.bv-facility-card h2 {
    font-size: 1.15rem;
    margin-bottom: 16px;
}

.bv-facility-card__text {
    margin: 0;
    white-space: pre-line;
}

.bv-facility-contact__list {
    display: grid;
    gap: 14px;
    margin: 0;
}

.bv-facility-overview--single .bv-facility-contact__list {
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
}

.bv-facility-contact__list dt {
    font-size: 0.8rem;
    font-weight: 600;
    color: var(--bv-text-muted);
    margin-bottom: 2px;
}

.bv-facility-contact__list dd {
    margin: 0;
    overflow-wrap: anywhere;
}

.bv-facility-contact__list a {
    font-weight: 600;
    text-decoration: none;
}

.bv-facility-contact__address {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
}

.bv-facility-contact__directions {
    flex: none;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 44px;
    height: 44px;
    margin-top: -10px;
    border: 1px solid var(--bv-border);
    border-radius: var(--bv-radius-md);
    color: var(--bv-primary);
}

.bv-facility-contact__directions:hover {
    border-color: var(--bv-primary);
    color: var(--bv-primary-dark);
}

.bv-facility-contact__directions:focus-visible {
    outline: 2px solid var(--bv-primary);
    outline-offset: 2px;
}

.bv-facility-contact__emergency dd a {
    color: var(--bv-danger);
}

/* Weekly schedule */
.bv-hours__group + .bv-hours__group {
    margin-top: 16px;
    padding-top: 16px;
    border-top: 1px solid var(--bv-border);
}

.bv-hours__label {
    font-size: 0.95rem;
    margin-bottom: 8px;
}

.bv-hours__group--emergency .bv-hours__label {
    color: var(--bv-danger);
}

.bv-hours__rows {
    list-style: none;
    margin: 0;
    padding: 0;
    display: grid;
    gap: 8px;
}

.bv-hours__row {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    gap: 4px 16px;
    padding: 10px 14px;
    border-radius: var(--bv-radius-sm);
    background: var(--bv-background);
}

.bv-hours__group--emergency .bv-hours__row {
    background: var(--bv-danger-light);
}

.bv-hours__days {
    font-weight: 600;
}

.bv-hours__times {
    display: flex;
    flex-wrap: wrap;
    gap: 4px 12px;
    font-variant-numeric: tabular-nums;
}

.bv-hours__group--emergency .bv-hours__times {
    color: var(--bv-danger);
    font-weight: 600;
}

.bv-hours__note {
    color: var(--bv-text-muted);
    padding: 0 14px;
}

/* Departments and doctors */
.bv-facility-section {
    margin-top: 40px;
}

/* 2026-10-19 PO: "Nguồn dữ liệu" on the facility page as a light card (facility page only). */
.bv-hospital-detail-page .bv-source-block {
    margin-top: 40px;
    padding: 20px;
    background: #f1f5f9;
    border: 1px solid var(--bv-border);
    border-radius: var(--bv-radius-md);
}

.bv-hospital-detail-page .bv-source-block h2 {
    font-size: 1.15rem;
    margin: 0 0 8px;
}

.bv-hospital-detail-page .bv-source-block p {
    margin: 0;
}

.bv-facility-section__title {
    display: flex;
    align-items: center;
    gap: 10px;
    font-size: 1.35rem;
    margin-bottom: 16px;
}

.bv-facility-section__count {
    font-size: 0.8rem;
    font-weight: 600;
    padding: 2px 10px;
    border-radius: 999px;
    background: var(--bv-primary-light);
    color: var(--bv-primary-dark);
}

.bv-department-list {
    list-style: none;
    margin: 0;
    padding: 0;
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
    gap: 12px;
}

.bv-department-item {
    background: var(--bv-surface);
    border: 1px solid var(--bv-border);
    border-radius: var(--bv-radius-sm);
    padding: 14px 16px;
    min-width: 0;
}

.bv-department-item h3 {
    font-size: 1rem;
    margin: 0;
}

.bv-department-item p {
    margin: 4px 0 0;
    font-size: 0.875rem;
    color: var(--bv-text-muted);
    overflow-wrap: anywhere;
}

.bv-facility-doctors {
    margin-top: 0;
}

.bv-facility-links {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.bv-facility-links a {
    display: inline-flex;
    align-items: center;
    min-height: 36px;
    padding: 6px 14px;
    border: 1px solid var(--bv-border);
    border-radius: 999px;
    text-decoration: none;
    font-size: 0.9rem;
}

.bv-facility-links a:hover {
    border-color: var(--bv-primary);
}

.bv-hospital-detail-page .bv-ratings-block {
    margin-top: 40px;
}

@media (max-width: 960px) {
    .bv-facility-overview {
        grid-template-columns: minmax(0, 1fr);
        grid-template-areas: "contact" "main";
    }
}

@media (max-width: 640px) {
    .bv-facility-overview,
    .bv-facility-main {
        gap: 16px;
    }

    .bv-facility-card {
        padding: 18px;
    }

    .bv-facility-section {
        margin-top: 32px;
    }

    .bv-hospital-detail-page .bv-source-block {
        margin-top: 32px;
        padding: 16px;
    }
}

/* Doc 47 D-47-7: department cards open the department page. */
.bv-department-item--link {
    display: flex;
    flex-direction: column;
    height: 100%;
    color: var(--bv-text);
    text-decoration: none;
}

.bv-department-item--link:hover,
.bv-department-item--link:focus-visible {
    border-color: var(--bv-primary);
}

.bv-department-item--link:focus-visible {
    outline: 2px solid var(--bv-primary);
    outline-offset: 2px;
}

.bv-department-item__cta {
    margin-top: auto;
    padding-top: 8px;
    font-size: 0.875rem;
    font-weight: 600;
    color: var(--bv-primary);
}

/* Doc 47 §4.1: department detail page (reuses the facility hero/section/doctor-card styles above). */
.bv-department-back {
    display: inline-flex;
    gap: 6px;
    align-items: center;
    min-height: 44px;
    font-weight: 600;
    color: var(--bv-primary);
    text-decoration: none;
}

.bv-department-back:hover {
    text-decoration: underline;
}

.bv-department-hero {
    margin-top: 8px;
}

.bv-department-hero h1 {
    margin: 4px 0 8px;
}

.bv-department-hero__owner {
    margin: 0 0 12px;
    color: var(--bv-text-muted);
}

.bv-department-hero__owner a {
    font-weight: 600;
    color: var(--bv-primary);
}

.bv-department-info {
    display: grid;
    grid-template-columns: minmax(160px, 220px) 1fr;
    gap: 12px 24px;
    margin: 0;
    padding: 20px 24px;
    background: var(--bv-surface);
    border: 1px solid var(--bv-border);
    border-radius: var(--bv-radius-md);
}

.bv-department-info dt {
    color: var(--bv-text-muted);
}

.bv-department-info dd {
    margin: 0;
    min-width: 0;
    overflow-wrap: anywhere;
}

.bv-department-info__text {
    white-space: pre-line;
}

.bv-department-empty {
    margin: 0;
    padding: 16px 20px;
    border: 1px dashed var(--bv-border);
    border-radius: var(--bv-radius-md);
    color: var(--bv-text-muted);
    background: var(--bv-surface);
}

@media (max-width: 639px) {
    .bv-department-info {
        grid-template-columns: 1fr;
        gap: 4px;
        padding: 16px;
    }

    .bv-department-info dd + dt {
        margin-top: 12px;
    }
}

/* ── Doc 74: Giới thiệu, Chuyên môn và thế mạnh, Hướng dẫn đi khám ───────────
   Every block renders only for a public section (FacilityGuideService.IsPublic). */

.bv-guide-source {
    margin: 16px 0 0;
    font-size: 0.8rem;
    color: var(--bv-text-muted);
}

.bv-guide-source a {
    color: inherit;
    font-weight: 600;
}

.bv-strengths {
    list-style: none;
    margin: 0;
    padding: 0;
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
    gap: 12px;
}

.bv-strengths li {
    display: grid;
    gap: 4px;
    align-content: start;
    padding: 14px 16px;
    border: 1px solid var(--bv-border);
    border-radius: var(--bv-radius-sm);
    min-width: 0;
}

.bv-strengths h3 {
    margin: 0;
    font-size: 0.95rem;
}

.bv-strengths p {
    margin: 0;
    font-size: 0.875rem;
    color: var(--bv-text-muted);
}

.bv-strengths a {
    font-size: 0.85rem;
    font-weight: 600;
    text-decoration: none;
}

.bv-guide__list {
    border-top: 1px solid var(--bv-border);
}

.bv-guide__item {
    border-bottom: 1px solid var(--bv-border);
}

.bv-guide__item > summary,
.bv-faq__item > summary {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    min-height: 52px;
    padding: 12px 0;
    font-weight: 600;
    cursor: pointer;
    list-style: none;
}

.bv-guide__item > summary::-webkit-details-marker,
.bv-faq__item > summary::-webkit-details-marker {
    display: none;
}

.bv-guide__item > summary::after,
.bv-faq__item > summary::after {
    content: "";
    flex: none;
    width: 9px;
    height: 9px;
    margin-right: 4px;
    border-right: 2px solid var(--bv-text-muted);
    border-bottom: 2px solid var(--bv-text-muted);
    transform: rotate(45deg);
    transition: transform 0.15s ease;
}

.bv-guide__item[open] > summary::after,
.bv-faq__item[open] > summary::after {
    transform: rotate(-135deg);
}

.bv-guide__item > summary:focus-visible,
.bv-faq__item > summary:focus-visible {
    outline: 3px solid var(--bv-primary);
    outline-offset: 2px;
}

.bv-guide__body {
    display: grid;
    gap: 12px;
    padding-bottom: 20px;
    min-width: 0;
}

.bv-guide__body > .bv-guide-source {
    margin-top: 4px;
}

.bv-guide__subhead {
    margin: 0;
    font-size: 0.8rem;
    font-weight: 600;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: var(--bv-text-muted);
}

.bv-guide__text {
    margin: 0;
    white-space: pre-line;
    overflow-wrap: anywhere;
}

.bv-guide-steps {
    margin: 0;
    padding-left: 22px;
    display: grid;
    gap: 8px;
}

.bv-guide-steps strong {
    display: block;
}

.bv-guide-steps span {
    display: block;
    font-size: 0.9rem;
    color: var(--bv-text-muted);
}

.bv-guide-docs {
    list-style: none;
    margin: 0;
    padding: 0;
    display: grid;
    gap: 6px;
}

.bv-guide-docs li {
    position: relative;
    padding-left: 24px;
}

.bv-guide-docs li::before {
    content: "";
    position: absolute;
    left: 5px;
    top: 5px;
    width: 6px;
    height: 11px;
    border-right: 2px solid var(--bv-primary);
    border-bottom: 2px solid var(--bv-primary);
    transform: rotate(45deg);
}

.bv-guide-links {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.bv-fees {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.9rem;
}

.bv-fees th,
.bv-fees td {
    padding: 8px 0;
    text-align: left;
    vertical-align: top;
    border-bottom: 1px solid var(--bv-border);
}

.bv-fees th {
    font-size: 0.8rem;
    font-weight: 600;
    color: var(--bv-text-muted);
}

.bv-fees th:last-child,
.bv-fees td:last-child {
    padding-left: 12px;
    text-align: right;
    white-space: nowrap;
    font-variant-numeric: tabular-nums;
}

.bv-fees small {
    display: block;
    color: var(--bv-text-muted);
}

.bv-fees__note {
    margin: 0;
    font-size: 0.8rem;
    color: var(--bv-text-muted);
}

.bv-faq__item {
    border-top: 1px dashed var(--bv-border);
}

.bv-faq__item > summary {
    min-height: 48px;
    font-weight: 500;
}

.bv-faq__item > p {
    padding-bottom: 12px;
}

/* Doc 74 §5.4 — Preview only. */
.bv-preview-bar {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 8px 16px;
    margin-top: 24px;
    padding: 12px 16px;
    border-radius: var(--bv-radius-sm);
    background: var(--bv-text);
    color: var(--bv-surface);
    font-weight: 600;
}

.bv-preview-bar a {
    color: inherit;
}

.bv-guide--draft {
    outline: 2px dashed #b45309;
    outline-offset: 4px;
}

.bv-guide-state {
    display: inline-block;
    margin-left: 8px;
    padding: 2px 8px;
    border-radius: 999px;
    background: #fef3c7;
    color: #92400e;
    font-size: 0.75rem;
    font-weight: 600;
    vertical-align: middle;
}

@media (max-width: 640px) {
    .bv-strengths {
        grid-template-columns: minmax(0, 1fr);
    }

    .bv-fees thead {
        display: none;
    }

    .bv-fees,
    .bv-fees tbody,
    .bv-fees tr,
    .bv-fees td {
        display: block;
        width: 100%;
    }

    .bv-fees tr {
        padding: 8px 0;
        border-bottom: 1px solid var(--bv-border);
    }

    .bv-fees td,
    .bv-fees td:last-child {
        padding: 0;
        border: 0;
        text-align: left;
    }
}

@media (prefers-reduced-motion: reduce) {
    .bv-guide__item > summary::after,
    .bv-faq__item > summary::after {
        transition: none;
    }
}
