.doctor-detail-page { padding: 48px 20px 64px; background: #f5f8f7; }
.doctor-detail-page .doctor-detail-content { max-width: 1200px; margin: 0 auto; }
.doctor-detail-page .doctor-profile-hero { display: grid; grid-template-columns: 340px minmax(0, 1fr); gap: 48px; padding: 36px; background: #fff; border: 1px solid #e0e9e6; border-radius: 16px; }
.doctor-detail-page .doctor-profile-photo { margin: 0; align-self: start; }
.doctor-detail-page .doctor-profile-photo img { display: block; width: 100%; height: auto; border-radius: 60px; border-top-right-radius: 0; overflow: hidden; background: #edf4f2; }
.doctor-detail-page .doctor-profile-summary { min-width: 0; }
.doctor-detail-page .doctor-profile-summary h1 { color: #2f636d; font-family: 'Prompt', sans-serif; font-size: clamp(26px, 2.4vw, 36px); line-height: 1.45; margin: 0 0 12px; }
.doctor-detail-page .doctor-license { color: #555; margin: 0 0 24px; }
.doctor-detail-page .doctor-profile-facts { margin: 0; }
.doctor-detail-page .doctor-profile-fact + .doctor-profile-fact { margin-top: 20px; }
.doctor-detail-page .doctor-profile-fact dt { font-weight: 600; color: #2f636d; margin-bottom: 7px; }
.doctor-detail-page .doctor-profile-fact dd { margin: 0; }
.doctor-detail-page .doctor-profile-chips { display: flex; flex-wrap: wrap; gap: 8px; padding: 0; margin: 0; list-style: none; }
.doctor-detail-page .doctor-profile-chips li { max-width: 100%; padding: 5px 12px; border-radius: 6px; background: #eff6f4; }
.doctor-detail-page .doctor-info-section { margin-top: 24px; padding: 30px 36px; border: 1px solid #e0e9e6; border-radius: 12px; background: #fff; }
.doctor-detail-page .doctor-info-section h2 { color: #2f636d; font-family: 'Prompt', sans-serif; font-size: 24px; line-height: 1.5; margin: 0 0 20px; }
.doctor-detail-page .doctor-info-list { list-style: disc outside; margin: 0; padding-left: 24px; }
.doctor-detail-page .doctor-info-list li { padding-left: 6px; white-space: pre-line; }
.doctor-detail-page .doctor-info-list li + li { margin-top: 14px; }
.doctor-detail-page .doctor-info-list li::marker { color: #2f636d; }
.doctor-detail-page .doctor-schedule { width: 100%; table-layout: fixed; border-collapse: collapse; }
.doctor-detail-page .doctor-schedule th, .doctor-detail-page .doctor-schedule td { padding: 14px 18px; text-align: left; border-bottom: 1px solid #e0e9e6; }
.doctor-detail-page .doctor-schedule th { width: 45%; font-weight: 600; background: #eff6f4; }
.doctor-detail-page .doctor-schedule-note { margin: 20px 0 0; white-space: pre-line; }
.doctor-detail-page .doctor-profile-summary, .doctor-detail-page .doctor-info-section { overflow-wrap: anywhere; line-height: 1.8; font-size: 18px; }
.doctor-detail-page .doctor-visually-hidden { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
@media (max-width: 1199px) {
 .doctor-detail-page .doctor-profile-hero { grid-template-columns: minmax(220px, 30%) minmax(0, 1fr); gap: 28px; padding: 28px; }
}
@media (max-width: 767px) {
 .doctor-detail-page { padding: 24px 16px 40px; }
 .doctor-detail-page .doctor-profile-hero { grid-template-columns: minmax(0, 1fr); padding: 20px; gap: 24px; }
 .doctor-detail-page .doctor-profile-photo { width: 100%; max-width: 340px; margin: 0 auto; }
 .doctor-detail-page .doctor-info-section { padding: 24px 20px; margin-top: 16px; }
 .doctor-detail-page .doctor-info-section h2 { font-size: 22px; }
 .doctor-detail-page .doctor-schedule th, .doctor-detail-page .doctor-schedule td { padding: 12px 10px; }
}

/* Education: readable entries for long qualifications, without changing stored content. */
.doctor-detail-page .doctor-education-section .doctor-info-list {
  list-style: none;
  padding: 0;
  margin: 0;
  display: grid;
  gap: 12px;
}
.doctor-detail-page .doctor-education-section .doctor-info-list li {
  padding: 14px 18px;
  border-left: 3px solid #2f636d;
  border-radius: 0 8px 8px 0;
  background: #f5f9f8;
  white-space: pre-line;
  overflow-wrap: anywhere;
  line-height: 1.85;
}
.doctor-detail-page .doctor-education-section .doctor-info-list li + li { margin-top: 0; }
@media (max-width: 767px) {
  .doctor-detail-page .doctor-education-section .doctor-info-list li { padding: 12px 14px; }
}

/* Keep the desktop profile compact: facts use two columns instead of a tall stack. */
@media (min-width: 900px) {
  .doctor-detail-page .doctor-profile-facts {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    column-gap: 22px;
    row-gap: 16px;
  }
  .doctor-detail-page .doctor-profile-fact + .doctor-profile-fact { margin-top: 0; }
}
