/* ================================================================
   BLUE VUE — PREMIUM DOCTOR CARDS & SINGLE DOCTOR PAGE
   ================================================================ */

/* ---------------------------------------------------------------
   DOCTOR ARCHIVE GRID
   --------------------------------------------------------------- */
.bv-doctors-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(270px, 1fr));
  gap: 28px;
}

/* ---------------------------------------------------------------
   DOCTOR CARD — PREMIUM REDESIGN
   --------------------------------------------------------------- */
.bv-doc-card {
  background: #ffffff;
  border-radius: 22px;
  overflow: hidden;
  border: 1px solid rgba(18, 111, 181, 0.1);
  box-shadow:
    0 1px 3px rgba(0, 0, 0, 0.04),
    0 8px 24px rgba(18, 111, 181, 0.06);
  transition:
    transform 0.4s cubic-bezier(0.16, 1, 0.3, 1),
    box-shadow 0.4s ease;
  display: flex;
  flex-direction: column;
  position: relative;
}
.bv-doc-card:hover {
  transform: translateY(-12px);
  box-shadow:
    0 4px 8px rgba(0,0,0,0.04),
    0 28px 60px rgba(18, 111, 181, 0.16);
}

/* === Photo Area === */
.bv-doc-photo-wrap {
  position: relative;
  height: 255px;
  background: linear-gradient(160deg, #d0e8f7 0%, #e6f2fc 50%, #eef8ff 100%);
  overflow: visible; /* allow badge to breathe if needed */
  flex-shrink: 0;
  border-radius: 22px 22px 0 0;
}
/* inner clip so photo doesn't bleed outside rounded top */
.bv-doc-photo-wrap > * { overflow: hidden; }
.bv-doc-photo-wrap::before { display: none; } /* remove the blob entirely */
.bv-doc-photo-wrap::after {
  content: '';
  position: absolute;
  bottom: 0; left: 0; right: 0;
  height: 60px;
  background: linear-gradient(to top,
    rgba(255,255,255,0.95) 0%,
    transparent 100%);
  pointer-events: none;
  z-index: 1;
  border-radius: 0;
}

.bv-doc-photo-wrap .bv-doc-photo {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: top center;
  display: block;
  border-radius: 22px 22px 0 0;
  transition: transform 0.5s cubic-bezier(0.16, 1, 0.3, 1);
}
.bv-doc-card:hover .bv-doc-photo {
  transform: scale(1.05);
}

.bv-doc-photo-placeholder {
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 6rem;
  color: rgba(18, 111, 181, 0.13);
  border-radius: 22px 22px 0 0;
}

/* Specialty badge — floats above photo, bottom-center */
.bv-doc-specialty-badge {
  position: absolute;
  top: unset !important; /* Force override sections.css top: 14px */
  bottom: -13px;
  left: 50%;
  transform: translateX(-50%);
  white-space: nowrap;
  background: var(--bv-primary, #126fb5);
  color: #fff;
  font-size: 0.67rem;
  font-weight: 700;
  letter-spacing: 1.4px;
  text-transform: uppercase;
  padding: 5px 16px;
  border-radius: 100px;
  box-shadow: 0 3px 10px rgba(18, 111, 181, 0.3);
  z-index: 10;
  height: auto !important; /* Prevent vertical stretching from previous rules */
}

/* === Card Body === */
.bv-doc-body {
  padding: 22px 22px 14px;  /* top padding leaves room for badge overhang */
  flex-grow: 1;
  display: flex;
  flex-direction: column;
  position: relative;
  z-index: 2;
}

/* Avatar circle above name (pulls from bottom of photo) */
.bv-doc-avatar-ring {
  width: 68px;
  height: 68px;
  border-radius: 50%;
  border: 3px solid #ffffff;
  box-shadow: 0 4px 14px rgba(18, 111, 181, 0.18);
  overflow: hidden;
  margin: -34px 0 12px 0;
  background: #d6ebf8;
  flex-shrink: 0;
  display: none; /* only shown when there's no main photo */
}

.bv-doc-name {
  font-size: 1.08rem;
  font-weight: 700;
  margin-bottom: 3px;
  line-height: 1.3;
  letter-spacing: -0.1px;
}
.bv-doc-name a {
  color: #0c2540;
  text-decoration: none;
  transition: color 0.22s;
}
.bv-doc-name a:hover { color: var(--bv-primary, #126fb5); }

.bv-doc-designation {
  font-size: 0.8rem;
  font-weight: 600;
  color: var(--bv-primary, #126fb5);
  margin-bottom: 3px;
  letter-spacing: 0.1px;
}

/* Thin horizontal rule between designation and degrees */
.bv-doc-body::after {
  content: '';
  display: block;
  height: 1px;
  background: linear-gradient(to right, rgba(18,111,181,0.12), transparent);
  margin: 8px 0;
  order: 3;
}

.bv-doc-degrees {
  font-size: 0.76rem;
  color: #7d92a8;
  margin-bottom: 10px;
  line-height: 1.5;
  flex-grow: 1;
  order: 4;
}
.bv-doc-chamber {
  font-size: 0.76rem;
  color: #99afc0;
  display: flex;
  align-items: center;
  gap: 5px;
  margin-bottom: 4px;
  order: 5;
}
.bv-doc-chamber i {
  color: var(--bv-primary, #126fb5);
  font-size: 0.7rem;
  flex-shrink: 0;
}

/* === Action Bar === */
.bv-doc-actions {
  display: grid;
  grid-template-columns: 1fr 1fr;
  border-top: 1px solid rgba(18, 111, 181, 0.08);
  margin-top: 6px;
}

.bv-doc-btn-profile,
.bv-doc-btn-appt {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  padding: 13px 8px;
  font-size: 0.76rem;
  font-weight: 700;
  text-decoration: none;
  transition: all 0.22s ease;
  letter-spacing: 0.2px;
  white-space: nowrap;
}

.bv-doc-btn-profile {
  color: var(--bv-primary, #126fb5);
  background: #f6faff;
  border-right: 1px solid rgba(18, 111, 181, 0.08);
  border-radius: 0 0 0 22px;
}
.bv-doc-btn-profile i { font-size: 0.8rem; }
.bv-doc-btn-profile:hover {
  background: #eaf3ff;
  color: #0b5fa0;
}

.bv-doc-btn-appt {
  color: #fff;
  background: linear-gradient(135deg, #126fb5 0%, #1a8ae0 100%);
  border-radius: 0 0 22px 0;
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.12);
}
.bv-doc-btn-appt i { font-size: 0.8rem; }
.bv-doc-btn-appt:hover {
  background: linear-gradient(135deg, #0d5fa0 0%, #126fb5 100%);
  color: #fff;
}

/* ---------------------------------------------------------------
   SINGLE DOCTOR PAGE — PREMIUM
   --------------------------------------------------------------- */
.bv-single-doctor-page { background: #f3f7fd; }

/* Breadcrumb */
.bv-sdp-breadcrumb {
  background: #fff;
  border-bottom: 1px solid #e0eaf5;
  padding: 11px 0;
  font-size: 0.82rem;
  color: #8a9ab0;
}
.bv-sdp-breadcrumb a {
  color: #8a9ab0;
  text-decoration: none;
  transition: color 0.2s;
}
.bv-sdp-breadcrumb a:hover { color: var(--bv-primary, #126fb5); }
.bv-sdp-breadcrumb .container {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
}
.bv-sdp-breadcrumb .fa-chevron-right { font-size: 0.62rem; color: #ccd5e0; }
.bv-sdp-breadcrumb span { color: var(--bv-primary, #126fb5); font-weight: 600; }

/* Hero */
.bv-sdp-hero {
  position: relative;
  background: linear-gradient(138deg, #051220 0%, #0a2340 50%, #126fb5 100%);
  padding: 64px 0 88px;
  overflow: hidden;
}
.bv-sdp-hero-bg {
  position: absolute; inset: 0;
  background-image:
    radial-gradient(circle at 80% 40%, rgba(100,170,229,0.12) 0%, transparent 55%),
    radial-gradient(circle at 10% 80%, rgba(18,111,181,0.1) 0%, transparent 40%);
  pointer-events: none;
}
.bv-sdp-hero-inner {
  position: relative; z-index: 2;
  display: flex; align-items: flex-end;
  gap: 48px; flex-wrap: wrap;
}

/* Photo */
.bv-sdp-photo-card { flex-shrink: 0; width: 230px; position: relative; margin-bottom: -64px; }
.bv-sdp-photo {
  width: 230px; height: 290px;
  object-fit: cover; object-position: top;
  border-radius: 20px; display: block;
  box-shadow: 0 24px 64px rgba(0,0,0,0.35);
  border: 4px solid rgba(255,255,255,0.12);
}
.bv-sdp-photo-placeholder {
  width: 230px; height: 290px; border-radius: 20px;
  background: rgba(255,255,255,0.07);
  display: flex; align-items: center; justify-content: center;
  font-size: 7rem; color: rgba(255,255,255,0.18);
  box-shadow: 0 24px 64px rgba(0,0,0,0.35);
}
.bv-sdp-specialty-tag {
  position: absolute; top: 16px; right: -10px;
  background: linear-gradient(135deg, #64aae5, #126fb5);
  color: #fff; font-size: 0.68rem; font-weight: 700;
  letter-spacing: 1.4px; text-transform: uppercase;
  padding: 6px 16px; border-radius: 100px;
  box-shadow: 0 4px 14px rgba(18,111,181,0.35);
}
.bv-sdp-phone-btn {
  display: flex; align-items: center; justify-content: center; gap: 8px;
  margin-top: 14px; background: rgba(255,255,255,0.09);
  border: 1px solid rgba(255,255,255,0.18); color: #fff;
  padding: 11px 20px; border-radius: 100px;
  font-size: 0.84rem; font-weight: 600; text-decoration: none;
  backdrop-filter: blur(8px); transition: all 0.25s;
}
.bv-sdp-phone-btn:hover { background: rgba(255,255,255,0.18); color: #fff; }

/* Info block */
.bv-sdp-info { flex: 1 1 360px; padding-bottom: 22px; }
.bv-sdp-eyebrow {
  display: inline-flex; align-items: center; gap: 7px;
  background: rgba(100,170,229,0.14);
  border: 1px solid rgba(100,170,229,0.32);
  color: #82c2f0; font-size: 0.72rem; font-weight: 700;
  letter-spacing: 2px; text-transform: uppercase;
  padding: 5px 14px; border-radius: 100px; margin-bottom: 14px;
}
.bv-sdp-name {
  font-size: clamp(1.8rem, 3.5vw, 2.7rem); font-weight: 800;
  color: #fff; line-height: 1.15; margin-bottom: 8px;
  letter-spacing: -0.5px;
}
.bv-sdp-designation {
  font-size: 1rem; font-weight: 600;
  color: #82c2f0; margin-bottom: 8px;
}
.bv-sdp-degrees {
  font-size: 0.88rem; color: rgba(255,255,255,0.6);
  margin-bottom: 20px; line-height: 1.6;
  display: flex; align-items: flex-start; gap: 8px;
}
.bv-sdp-degrees i { color: #64aae5; margin-top: 3px; flex-shrink: 0; }
.bv-sdp-meta-badges {
  display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 28px;
}
.bv-sdp-badge {
  display: inline-flex; align-items: center; gap: 6px;
  background: rgba(255,255,255,0.08); border: 1px solid rgba(255,255,255,0.13);
  color: rgba(255,255,255,0.78); font-size: 0.76rem; font-weight: 600;
  padding: 6px 14px; border-radius: 100px; backdrop-filter: blur(4px);
}
.bv-sdp-badge--spec {
  background: rgba(100,170,229,0.16);
  border-color: rgba(100,170,229,0.3);
  color: #82c2f0;
}
.bv-sdp-ctas { display: flex; align-items: center; gap: 14px; flex-wrap: wrap; }
.bv-sdp-btn-primary {
  display: inline-flex; align-items: center; gap: 9px;
  background: linear-gradient(135deg, #126fb5, #1a8ae0);
  color: #fff; text-decoration: none;
  padding: 14px 32px; border-radius: 100px;
  font-size: 0.95rem; font-weight: 700;
  box-shadow: 0 8px 24px rgba(18,111,181,0.4); transition: all 0.28s ease;
}
.bv-sdp-btn-primary:hover {
  background: linear-gradient(135deg, #0d5fa0, #126fb5);
  color: #fff; transform: translateY(-2px);
  box-shadow: 0 14px 32px rgba(18,111,181,0.5);
}
.bv-sdp-btn-secondary {
  display: inline-flex; align-items: center; gap: 9px;
  color: #fff; text-decoration: none;
  padding: 13px 28px; border-radius: 100px;
  font-size: 0.95rem; font-weight: 600;
  border: 2px solid rgba(255,255,255,0.3);
  transition: all 0.25s ease; backdrop-filter: blur(4px);
}
.bv-sdp-btn-secondary:hover {
  background: rgba(255,255,255,0.12);
  border-color: rgba(255,255,255,0.65);
  color: #fff; transform: translateY(-2px);
}

/* Body */
.bv-sdp-body { padding: 88px 0 64px; }
.bv-sdp-body-grid {
  display: grid;
  grid-template-columns: 1fr 320px;
  gap: 28px; align-items: start;
}
.bv-sdp-main { display: flex; flex-direction: column; gap: 22px; }

/* Panels */
.bv-sdp-panel {
  background: #fff; border-radius: 18px;
  border: 1px solid #dde8f5;
  box-shadow: 0 2px 16px rgba(18,111,181,0.05);
  overflow: hidden;
}
.bv-sdp-panel-header {
  display: flex; align-items: center; gap: 12px;
  padding: 18px 26px; border-bottom: 1px solid #edf3fb;
  background: linear-gradient(to right, #f7faff, #fff);
}
.bv-sdp-panel-header i {
  width: 38px; height: 38px; border-radius: 11px;
  background: rgba(18,111,181,0.09); color: var(--bv-primary, #126fb5);
  display: flex; align-items: center; justify-content: center;
  font-size: 0.95rem; flex-shrink: 0;
}
.bv-sdp-panel-header h2 {
  font-size: 1.05rem; font-weight: 700; color: #0c2540; margin: 0;
}
.bv-sdp-panel-body { padding: 22px 26px; }
.bv-sdp-content { font-size: 0.96rem; color: #3e5268; line-height: 1.82; }
.bv-sdp-panel-text { font-size: 0.94rem; color: #3e5268; line-height: 1.72; margin: 0; }

/* Sidebar */
.bv-sdp-sidebar { display: flex; flex-direction: column; gap: 22px; }
.bv-sdp-info-card,
.bv-sdp-schedule-card {
  background: #fff; border-radius: 18px;
  border: 1px solid #dde8f5;
  box-shadow: 0 2px 16px rgba(18,111,181,0.05);
  overflow: hidden;
}
.bv-sdp-info-card-title {
  display: flex; align-items: center; gap: 10px;
  font-size: 0.92rem; font-weight: 700; color: #0c2540;
  padding: 16px 20px; border-bottom: 1px solid #edf3fb;
  background: linear-gradient(to right, #f7faff, #fff); margin: 0;
}
.bv-sdp-info-card-title i { color: var(--bv-primary, #126fb5); }
.bv-sdp-info-list { list-style: none; margin: 0; padding: 0; }
.bv-sdp-info-list li {
  display: flex; flex-direction: column; gap: 2px;
  padding: 13px 20px; border-bottom: 1px solid #f0f6fc;
}
.bv-sdp-info-list li:last-child { border-bottom: none; }
.bv-sdp-info-label {
  font-size: 0.7rem; font-weight: 700;
  text-transform: uppercase; letter-spacing: 1.1px;
  color: #a8bacf; display: flex; align-items: center; gap: 6px;
}
.bv-sdp-info-label i { color: var(--bv-primary, #126fb5); }
.bv-sdp-info-val { font-size: 0.88rem; font-weight: 600; color: #1a2f45; }
.bv-sdp-info-val a { color: var(--bv-primary, #126fb5); text-decoration: none; }
.bv-sdp-info-val a:hover { text-decoration: underline; }

/* Schedule */
.bv-sdp-schedule-list { list-style: none; margin: 0; padding: 0; }
.bv-sdp-schedule-list li {
  display: flex; justify-content: space-between; align-items: center;
  padding: 12px 20px; border-bottom: 1px solid #f0f6fc; font-size: 0.87rem;
}
.bv-sdp-schedule-list li:nth-child(even) { background: #fafcff; }
.bv-sdp-schedule-list li:last-child { border-bottom: none; }
.bv-sdp-sched-day { font-weight: 700; color: #1a2f45; }
.bv-sdp-sched-time {
  color: var(--bv-primary, #126fb5); font-weight: 600;
  background: rgba(18,111,181,0.07);
  padding: 3px 10px; border-radius: 100px; font-size: 0.8rem;
}
.bv-sdp-no-schedule {
  padding: 18px 20px; font-size: 0.87rem; color: #8a9ab0;
  display: flex; align-items: flex-start; gap: 8px; margin: 0;
}
.bv-sdp-no-schedule i { color: #64aae5; margin-top: 2px; flex-shrink: 0; }
.bv-sdp-book-full {
  display: flex; align-items: center; justify-content: center; gap: 9px;
  margin: 14px 16px 16px;
  background: linear-gradient(135deg, #126fb5, #1a8ae0);
  color: #fff; padding: 14px 20px; border-radius: 13px;
  font-size: 0.9rem; font-weight: 700; text-decoration: none;
  box-shadow: 0 6px 18px rgba(18,111,181,0.28);
  transition: all 0.25s ease;
}
.bv-sdp-book-full:hover {
  background: linear-gradient(135deg, #0d5fa0, #126fb5);
  color: #fff; transform: translateY(-2px);
  box-shadow: 0 10px 24px rgba(18,111,181,0.38);
}

/* ---------------------------------------------------------------
   RESPONSIVE
   --------------------------------------------------------------- */
@media (max-width: 1023px) {
  .bv-sdp-body-grid { grid-template-columns: 1fr; }
  .bv-sdp-sidebar { grid-row: 1; }
}
@media (max-width: 767px) {
  .bv-sdp-hero { padding: 44px 0 76px; }
  .bv-sdp-hero-inner { flex-direction: column; align-items: center; text-align: center; }
  .bv-sdp-photo-card { margin-bottom: -56px; }
  .bv-sdp-info { text-align: center; }
  .bv-sdp-degrees { justify-content: center; }
  .bv-sdp-meta-badges { justify-content: center; }
  .bv-sdp-ctas { justify-content: center; }
  .bv-sdp-body { padding: 76px 0 40px; }
  .bv-doctors-grid { grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 18px; }
}
@media (max-width: 480px) {
  .bv-doctors-grid { grid-template-columns: 1fr 1fr; gap: 14px; }
  .bv-doc-btn-profile, .bv-doc-btn-appt { font-size: 0.75rem; padding: 12px 6px; gap: 5px; }
  .bv-sdp-hero-inner { gap: 28px; }
}
