/* Doctor pages (listing + details): rules the compiled component SCSS does not cover. */

/* ---------- breadcrumb (filter-nav) ---------- */
.v-doctors .doctor-breadcrumb,
.v-doctor-details .doctor-breadcrumb { font-size: .95rem; }
.doctor-breadcrumb a { color: #0A0A0A; text-decoration: none; }
.doctor-breadcrumb a:hover { color: #0EB629; }
.doctor-breadcrumb i { margin: 0 .5rem; color: #737373; font-size: .8rem; }
.doctor-breadcrumb [aria-current] { color: #737373; }

/* ---------- listing cards ---------- */
.v-doctors .back i { font-size: 1.75rem; color: #0A0A0A; }
.v-doctors h1 { font-weight: 700; }
.v-doctors .doctor { margin-left: 0; margin-right: 0; text-align: start; }
.v-doctors .doctor .logo { background: #FFF0C5; border-radius: 20px; padding: 12px; align-self: flex-start; }
.v-doctors .doctor .logo img { width: 100%; height: auto; aspect-ratio: 1 / 1; object-fit: contain; }
.v-doctors .doctor h2 a { color: #0A0A0A !important; text-decoration: none; }
.v-doctors .doctor .doctor-title { color: #525252; margin-bottom: .5rem; }
.v-doctors .doctor .branch { margin-bottom: .25rem; }
.v-doctors .doctor .doctor-subcats a { text-decoration: none; }
.v-doctors .doctor .doctor-subcats .more-subs { font-weight: 600; margin: 0 .25rem; }
.v-doctors .doctor .actions .btn { min-width: 150px; }
.v-doctors .doctor .not-available { border: 1px solid #D4D4D4; cursor: default; }
@media (max-width: 767.98px) {
    .v-doctors .doctor { padding: 16px; }
    .v-doctors .doctor .actions { margin-top: .75rem; }
}

/* pagination + go to page */
.v-doctors .doctor-pagination .pagination { flex-wrap: wrap; margin-bottom: 0; }
.v-doctors .doctor-pagination #go-to-page { width: 80px; }

/* ---------- side filter ---------- */
.v-doctor-filter #filter legend { font-weight: 600; margin-bottom: .5rem; }
.v-doctor-filter .filter-scroll { max-height: 230px; overflow-y: auto; padding-inline-end: .25rem; }
.v-doctor-filter .form-check { margin-bottom: .25rem; }
.v-doctor-filter .form-check-input:checked { background-color: #0EB629; border-color: #0EB629; }
.v-doctor-filter #filter .row > .btn { width: 100%; }

/* ---------- sidebar ---------- */
.v-sidebar .card { width: 100%; }
.v-sidebar #DoctorForToday img { aspect-ratio: 1 / 1; object-fit: contain; }
.v-sidebar #DoctorForToday a { text-decoration: none; }

/* ---------- bottom sections ---------- */
.v-doctors #direct_access h2 { color: #fff; }
.v-doctors #tags .btn-info { margin: .25rem; }
.v-doctors .doctor-seo-text { line-height: 1.9; }
.v-faq .accordion-button { padding-inline-end: 2.5rem; }

/* ---------- details ---------- */
.v-doctor-details .boxed { margin-bottom: 1rem; }
.v-doctor-details #doctor .col-2,
.v-doctor-details #doctor .col-3 { background: #FFF0C5; border-radius: 20px; padding: 12px; align-self: flex-start; }
.v-doctor-details #doctor .col-3 img,
.v-doctor-details #doctor .col-2 img { width: 100%; height: auto; aspect-ratio: 1 / 1; object-fit: contain; }
.v-doctor-details #specialties { display: flow-root; margin-bottom: .5rem; }
.v-doctor-details #specialties p { margin-inline-end: .5rem; }
.v-doctor-details #specialties ul { list-style: none; padding: 0; margin: 0; display: flex; flex-wrap: wrap; gap: .25rem; }
.v-doctor-details .doctor-branches { clear: both; }
.v-doctor-details #specialties a,
.v-doctor-details .doctor-branches a { color: #0EB629; text-decoration: none; }
.v-doctor-details .doctor-branches .branch { padding: .5rem 0; border-bottom: 1px dashed #e5e5e5; }
.v-doctor-details .doctor-branches .branch:last-child { border-bottom: none; }
.v-doctor-details .doctor-facts li { margin-bottom: .25rem; }
.v-doctor-details .doctor-facts i,
.v-doctor-details .doctor-branches i { color: #0EB629; }
.v-doctor-details .doctor-description img { max-width: 100%; height: auto; }
.v-doctor-details .categories .btn-info,
.v-doctor-details .tags .btn-info { margin: .25rem; }
.v-doctor-details #tabs { display: flex; flex-wrap: wrap; gap: 1rem; padding: 0; margin: 1rem 0; }
.v-doctor-details #tabs li { float: none; margin: 0; }
.v-doctor-details #tabs a { color: #0A0A0A; font-weight: 600; text-decoration: none; }
.v-doctor-details #tabs a:hover { color: #0EB629; }
.v-doctor-details #hospitals a,
.v-doctor-details #centers a { color: #0A0A0A; text-decoration: none; }
.v-doctor-details #hospitals img,
.v-doctor-details #centers img { max-height: 90px; object-fit: contain; }
.v-doctor-details #insurance .card { display: inline-block; float: none; margin: .5rem; }
.v-doctor-details #insurance a { color: #0A0A0A; text-decoration: none; }
.v-doctor-details #gallery .card { display: inline-block; float: none; margin: .5rem; }
.v-doctor-details #gallery img { max-width: 220px; max-height: 220px; object-fit: cover; }
.v-doctor-details #scheduling-details .booking-card { background: #fff; }
.v-doctor-details #scheduling-details form .btn { margin: 0; }
.v-doctor-details :target { scroll-margin-top: 90px; }

/* rating widget: radios in DOM order 5..1, shown 1..5 */
.v-doctor-details .rating-stars { display: inline-flex; flex-direction: row-reverse; direction: ltr; gap: .15rem; }
.v-doctor-details .rating-stars input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.v-doctor-details .rating-stars label { cursor: pointer; font-size: 1.6rem; color: #D4D4D4; line-height: 1; }
.v-doctor-details .rating-stars label:hover,
.v-doctor-details .rating-stars label:hover ~ label,
.v-doctor-details .rating-stars input:checked ~ label { color: #FDB40E; }
.v-doctor-details #review .rating-stars label i { color: inherit; }
.v-doctor-details #review .text-lg .bi-star-fill { color: #FDB40E; }
.v-doctor-details .rating-stars input:focus-visible + label { outline: 2px solid #0EB629; outline-offset: 2px; }
.v-doctor-details .doctor-review-form.was-validated .rating-stars:has(input:invalid) ~ .rating-feedback { display: block; }

.v-doctor-details .doctor-reviews .review-item { padding: .75rem 0; border-bottom: 1px solid #eee; }
.v-doctor-details .doctor-reviews .stars i { color: #D4D4D4; }
.v-doctor-details .doctor-reviews .stars i.on { color: #FDB40E; }
.v-doctor-details #review .page-link { border: 1px solid #D4D4D4; }