/*
 * Section: Doctor Body
 *
 * Main content area + practitioner details sidebar for individual doctor pages.
 * Driven by ACF flexible content (doctor_page_content) and sidebar fields (doctor_sidebar_*).
 *
 * Figma node: 1592:2
 */

/* ── Section-scoped tokens ──────────────────────────────────────────────── */

:root {
	--azuri-dbd-pad-top:         64px;
	--azuri-dbd-pad-bottom:      80px;
	--azuri-dbd-col-gap:         80px;
	--azuri-dbd-block-gap:       48px;
	--azuri-dbd-heading-size:    32px;
	--azuri-dbd-heading-lh:      40px;
	--azuri-dbd-body-size:       16px;
	--azuri-dbd-body-lh:         28px;
	--azuri-dbd-small-size:      15px;
	--azuri-dbd-small-lh:        24px;
	--azuri-dbd-block-inner-gap: 16px;
	--azuri-dbd-list-gap:        10px;
	--azuri-dbd-bullet-size:     5px;
	--azuri-dbd-item-pad-y:      18px;
	--azuri-dbd-sidebar-w:       360px;
	--azuri-dbd-sidebar-pad:     28px;
	--azuri-dbd-sidebar-radius:  12px;
	--azuri-dbd-sidebar-gap:     24px;
	--azuri-dbd-sidebar-bg:      #f5f9fa;
	--azuri-dbd-sidebar-label-size: 11px;
	--azuri-dbd-sidebar-label-ls:   1.5px;
	--azuri-dbd-sidebar-value-size: 15px;
	--azuri-dbd-sidebar-value-lh:   22px;
	--azuri-dbd-sidebar-title-size: 18px;
	--azuri-dbd-sidebar-row-gap:    24px;
	--azuri-dbd-border-color:    #e1e8ed;
	--azuri-dbd-text-muted:      #5a6f80;
}

/* ── Base section ───────────────────────────────────────────────────────── */

.azuri-doctor-body {
	background:     var(--azuri-color-white);
	box-sizing:     border-box;
	padding-bottom: var(--azuri-dbd-pad-bottom);
	padding-top:    var(--azuri-dbd-pad-top);
}

/* ── Row ────────────────────────────────────────────────────────────────── */

.azuri-doctor-body__row {
	align-items: flex-start;
}

/* ── Main column ────────────────────────────────────────────────────────── */

.azuri-doctor-body__main-col {
	padding-right: calc(var(--azuri-dbd-col-gap) * 0.5);
}

.azuri-doctor-body__main {
	display:        flex;
	flex-direction: column;
	gap:            var(--azuri-dbd-block-gap);
}

/* ── Shared block styles ────────────────────────────────────────────────── */

.azuri-doctor-body__block {
	display:        flex;
	flex-direction: column;
	gap:            var(--azuri-dbd-block-inner-gap);
	width:          100%;
}
.azuri-doctor-body__rich-text h3 {
    font-size: 24px;
    margin-bottom: 0;
    padding: 20px 0;
}
.azuri-doctor-body__block-heading {
	color:       var(--azuri-color-ink);
	font-family: var(--azuri-font-family-base);
	font-size:   var(--azuri-dbd-heading-size);
	font-weight: 300;
	line-height: var(--azuri-dbd-heading-lh);
	margin:      0;
}

.azuri-doctor-body__block-intro {
	color:       var(--azuri-color-ink);
	font-family: var(--azuri-font-family-base);
	font-size:   var(--azuri-dbd-body-size);
	font-weight: var(--azuri-font-weight-regular);
	line-height: var(--azuri-dbd-body-lh);
	margin:      0;
}

/* ── Text block: rich text ──────────────────────────────────────────────── */

.azuri-doctor-body__rich-text {
	display:        flex;
	flex-direction: column;
	gap:            16px;
}

.azuri-doctor-body__rich-text p,
.azuri-doctor-body__rich-text li {
	color:       var(--azuri-color-ink);
	font-family: var(--azuri-font-family-base);
	font-size:   var(--azuri-dbd-body-size);
	font-weight: var(--azuri-font-weight-regular);
	line-height: var(--azuri-dbd-body-lh);
	margin:      0;
}

.azuri-doctor-body__rich-text ul,
.azuri-doctor-body__rich-text ol {
	margin:      0;
	padding-left: 20px;
}

/* ── Two-column bullet list ─────────────────────────────────────────────── */

.azuri-doctor-body__two-col-list {
	display: flex;
	gap:     60px;
}

.azuri-doctor-body__bullet-list {
	display:        flex;
	flex:           1 1 0;
	flex-direction: column;
	gap:            var(--azuri-dbd-list-gap);
	list-style:     none;
	margin:         0;
	min-width:      0;
	padding:        0;
}

.azuri-doctor-body__bullet-item {
	align-items: center;
	display:     flex;
	gap:         14px;
}

.azuri-doctor-body__bullet-dot {
	background:    var(--azuri-color-teal);
	border-radius: 50%;
	display:       block;
	flex-shrink:   0;
	height:        var(--azuri-dbd-bullet-size);
	width:         var(--azuri-dbd-bullet-size);
}

.azuri-doctor-body__bullet-item span:last-child {
	color:       var(--azuri-color-ink);
	font-family: var(--azuri-font-family-base);
	font-size:   var(--azuri-dbd-small-size);
	font-weight: var(--azuri-font-weight-regular);
	line-height: 1.4;
}

/* ── Item list with descriptions ────────────────────────────────────────── */

.azuri-doctor-body__item-list {
	border-top:     1px solid var(--azuri-dbd-border-color);
	display:        flex;
	flex-direction: column;
	width:          100%;
}

.azuri-doctor-body__item-row {
	border-bottom:  1px solid var(--azuri-dbd-border-color);
	display:        flex;
	flex-direction: column;
	gap:            6px;
	padding:        var(--azuri-dbd-item-pad-y) 0;
}

.azuri-doctor-body__item-title {
	color:       var(--azuri-color-ink);
	font-family: var(--azuri-font-family-base);
	font-size:   var(--azuri-dbd-body-size);
	font-weight: var(--azuri-font-weight-medium);
	line-height: 1.4;
	margin:      0;
}

.azuri-doctor-body__item-desc {
	color:       var(--azuri-dbd-text-muted);
	font-family: var(--azuri-font-family-base);
	font-size:   var(--azuri-dbd-small-size);
	font-weight: var(--azuri-font-weight-regular);
	line-height: var(--azuri-dbd-small-lh);
	margin:      0;
}

/* ── Sidebar column ─────────────────────────────────────────────────────── */

.azuri-doctor-body__sidebar-col {
	align-self: flex-start;
	padding-left: calc(var(--azuri-dbd-col-gap) * 0.5);
	position: sticky;
	top: 32px;
}

.azuri-doctor-body__sidebar {
	background:    var(--azuri-dbd-sidebar-bg);
	border-radius: var(--azuri-dbd-sidebar-radius);
	display:       flex;
	flex-direction: column;
	gap:           var(--azuri-dbd-sidebar-gap);
	padding:       var(--azuri-dbd-sidebar-pad);
	width:         100%;
}

.azuri-doctor-body__sidebar-title {
	color:       var(--azuri-color-ink);
	font-family: var(--azuri-font-family-base);
	font-size:   var(--azuri-dbd-sidebar-title-size);
	font-weight: var(--azuri-font-weight-medium);
	line-height: 1.3;
	margin:      0;
}

.azuri-doctor-body__sidebar-row {
	display:        flex;
	flex-direction: column;
	gap:            6px;
}

.azuri-doctor-body__sidebar-label {
	color:          var(--azuri-dbd-text-muted);
	font-family:    var(--azuri-font-family-base);
	font-size:      var(--azuri-dbd-sidebar-label-size);
	font-weight:    var(--azuri-font-weight-semibold);
	letter-spacing: var(--azuri-dbd-sidebar-label-ls);
	line-height:    1.4;
	margin:         0;
	text-transform: uppercase;
}

.azuri-doctor-body__sidebar-value {
	color:       var(--azuri-color-ink);
	font-family: var(--azuri-font-family-base);
	font-size:   var(--azuri-dbd-sidebar-value-size);
	font-weight: var(--azuri-font-weight-regular);
	line-height: var(--azuri-dbd-sidebar-value-lh);
	margin:      0;
}

.azuri-doctor-body__sidebar-avail {
	display: flex;
	gap:     12px;
}

.azuri-doctor-body__avail-days {
	flex-shrink: 0;
}

.azuri-doctor-body__avail-hours {
	color: var(--azuri-dbd-text-muted);
}

/* ── Sidebar divider ────────────────────────────────────────────────────── */

.azuri-doctor-body__sidebar-divider {
	background: var(--azuri-dbd-border-color);
	height:     1px;
	width:      100%;
}

/* ── Sidebar CTA buttons ────────────────────────────────────────────────── */

.azuri-doctor-body__sidebar-cta {
	display:        flex;
	flex-direction: column;
	gap:            10px;
}

.azuri-doctor-body__sidebar-btn {
	border-radius:   var(--azuri-radius-pill);
	box-sizing:      border-box;
	display:         block;
	font-family:     var(--azuri-font-family-base);
	font-size:       13px;
	font-weight:     var(--azuri-font-weight-semibold);
	line-height:     1;
	padding:         12px 24px;
	text-align:      center;
	text-decoration: none;
	transition:      background-color 0.2s ease, color 0.2s ease, border-color 0.2s ease;
	width:           100%;
}

.azuri-doctor-body__sidebar-btn--primary {
	background: var(--azuri-color-teal);
	border:     2px solid var(--azuri-color-teal);
	color:      var(--azuri-color-white);
}

.azuri-doctor-body__sidebar-btn--primary:hover,
.azuri-doctor-body__sidebar-btn--primary:focus-visible {
	background:   var(--azuri-color-teal-700);
	border-color: var(--azuri-color-teal-700);
	color:        var(--azuri-color-white);
}

.azuri-doctor-body__sidebar-btn--ghost {
	background:  transparent;
	border:      1px solid var(--azuri-dbd-border-color);
	color:       var(--azuri-color-ink);
}

.azuri-doctor-body__sidebar-btn--ghost:hover,
.azuri-doctor-body__sidebar-btn--ghost:focus-visible {
	border-color: var(--azuri-color-teal);
	color:        var(--azuri-color-teal);
}

/* ── Responsive: tablet (≤ 1023px) ─────────────────────────────────────── */

@media (max-width: 1023px) {
	:root {
		--azuri-dbd-col-gap:      40px;
		--azuri-dbd-heading-size: 26px;
		--azuri-dbd-heading-lh:   34px;
		--azuri-dbd-pad-top:      48px;
		--azuri-dbd-pad-bottom:   56px;
	}

	.azuri-doctor-body__two-col-list {
		gap: 32px;
	}
}

/* ── Responsive: mobile (≤ 767px) ──────────────────────────────────────── */

@media (max-width: 767px) {
	:root {
		--azuri-dbd-pad-top:      36px;
		--azuri-dbd-pad-bottom:   48px;
		--azuri-dbd-block-gap:    36px;
		--azuri-dbd-sidebar-pad:  20px;  /* tighter on narrow screens */
	}

	/* Cancel column gutter overrides — xs cols already handle padding */
	.azuri-doctor-body__main-col {
		padding-right: 0;
	}

	.azuri-doctor-body__sidebar-col {
		padding-left: 0;
		margin-top:   32px;
	}

	/* Two-col list: stack to single column */
	.azuri-doctor-body__two-col-list {
		flex-direction: column;
		gap:            8px;
	}

	/* Availability: stack days/hours vertically so they don't break mid-word */
	.azuri-doctor-body__sidebar-avail {
		flex-direction: column;
		gap:            2px;
	}

	.azuri-doctor-body__avail-days {
		font-weight: var(--azuri-font-weight-medium);
	}

	.azuri-doctor-body__avail-hours {
		font-size: 14px;
		opacity:   0.85;
	}
}