/**
 * Section: Procedures Grid
 *
 * Figma node 488:4514 — full-bleed light-teal background.
 * Each section = CatBlock header (col-4 label/btn + col-8 intro) above a
 * white SvcItem card (left teal border, accordion rows inside).
 *
 * BEM namespace: .azuri-procedures
 */

/* ==========================================================================
   Section shell
   ========================================================================== */

.azuri-procedures {
	background-color: #f5f9fa;
	padding-top:    var(--azuri-space-10);
	padding-bottom: var(--azuri-space-10);
}

/* Optional page-level intro */
.azuri-procedures__page-intro {
	font-family:   var(--azuri-font-family-base);
	font-size:     var(--azuri-font-size-md);
	color:         var(--azuri-color-ink);
	line-height:   var(--azuri-line-height-xs);
	margin-bottom: calc(var(--azuri-space-8) * 2);
}

/* ==========================================================================
   Service Section block
   ========================================================================== */

.azuri-procedures__section {
	border-top:     1px solid rgba(42, 173, 181, 0.15);
    padding-top: 55px;
    padding-bottom: 55px;
}

.azuri-procedures__section:first-of-type {
	border-top: none;
}

/* ==========================================================================
   Section header — CatBlock (col-4 label+btn / col-8 intro)
   Figma: left col 345px / right col 731px within 1100px container
   ========================================================================== */

.azuri-procedures__section-header {
	align-items:   flex-start;
	margin-bottom: var(--azuri-space-8);
}

.azuri-procedures__meta-col .azuri_inner {
	padding-right: var(--azuri-space-6);
}

/* Eyebrow label — "GENERAL MEDICAL" */
.azuri-procedures__label {
	font-family:    var(--azuri-font-family-base);
	font-size:      11px;
	font-weight:    var(--azuri-font-weight-medium);
	color:          var(--azuri-color-teal);
	letter-spacing: 2px;
	text-transform: uppercase;
	margin:         0 0 var(--azuri-space-3);
	line-height:    var(--azuri-line-height-xs);
}

/* Book Online pill button */
.azuri-procedures__book-btn {
	display:          inline-flex;
	align-items:      center;
	gap:              var(--azuri-space-1);
	background-color: var(--azuri-color-teal);
    max-width: 122px;
    color: #fff !important;
	font-family:      var(--azuri-font-family-base);
	font-size:        12px;
	font-weight:      var(--azuri-font-weight-medium);
	height:           33px;
	padding:          0 var(--azuri-space-5);
	border-radius:    var(--azuri-radius-pill);
	text-decoration:  none;
	transition:       background-color 0.2s ease;
	white-space:      nowrap;
}

.azuri-procedures__book-btn:hover,
.azuri-procedures__book-btn:focus-visible {
	background-color: var(--azuri-color-teal-700);
	outline:          none;
}

.azuri-procedures__book-btn:focus-visible {
	box-shadow: 0 0 0 3px rgba(42, 173, 181, 0.35);
}

.azuri-procedures__book-btn--no-link {
	cursor:         default;
	pointer-events: none;
}

/* Intro paragraph — right col */
.azuri-procedures__intro-content {
	font-family: var(--azuri-font-family-base);
	font-size:   14px;
	font-weight: var(--azuri-font-weight-regular);
	color:       #5a6f80;
	line-height: 1.8;
	margin:      0;
}

.azuri-procedures__intro-content p { margin: 0 0 var(--azuri-space-3); }
.azuri-procedures__intro-content p:last-child { margin-bottom: 0; }

/* ==========================================================================
   SvcItem card — white card with left teal border (Figma node 573:946)
   ========================================================================== */

.azuri-procedures__accordion {
	background-color: var(--azuri-color-white);
	border-left:      3px solid var(--azuri-color-teal);
	overflow:         hidden;
}

/* Card title row — "Core GP services" heading + bottom divider */
.azuri-procedures__accordion-header {
	display:         flex;
	align-items:     center;
	justify-content: space-between;
	padding:         var(--azuri-space-4) var(--azuri-space-5);
	border-bottom:   1px solid rgba(42, 173, 181, 0.18);
}

.azuri-procedures__accordion-title {
	font-family:    var(--azuri-font-family-base);
	font-size:      var(--azuri-font-size-lg);
	font-weight:    var(--azuri-font-weight-regular);
	color:          var(--azuri-color-ink);
	letter-spacing: -0.3px;
	line-height:    var(--azuri-line-height-xs);
	margin:         0;
}

/* Accordion rows */
.azuri-procedures__accordion-item {
	border-bottom: 1px solid rgba(42, 173, 181, 0.12);
}

.azuri-procedures__accordion-item:last-child {
	border-bottom: none;
}

/* ==========================================================================
   Accordion trigger row
   ========================================================================== */

.azuri-procedures__item-trigger {
	display:         flex;
	align-items:     center;
	justify-content: space-between;
	width:           100%;
	background:      transparent;
	border:          none;
	padding:         var(--azuri-space-3) var(--azuri-space-5);
	cursor:          pointer;
	text-align:      left;
	gap:             var(--azuri-space-4);
	transition:      background-color 0.15s ease;
}

.azuri-procedures__item-trigger:hover {
	background-color: rgba(42, 173, 181, 0.04);
}

.azuri-procedures__item-trigger:focus-visible {
	outline:        2px solid var(--azuri-color-teal);
	outline-offset: -2px;
}

.azuri-procedures__item-trigger[disabled] {
	cursor: default;
}

.azuri-procedures__item-trigger[disabled]:hover {
	background-color: transparent;
}

.azuri-procedures__item-trigger[aria-expanded="true"] {
	background-color: rgba(42, 173, 181, 0.06);
}

.azuri-procedures__item-trigger[aria-expanded="true"] .azuri-procedures__chevron {
	transform: rotate(180deg);
}

/* Service name — teal, 14px, medium */
.azuri-procedures__item-title {
    font-size: 22px;
    font-weight: normal;
    color: #2E404F;
    flex: 1;
    min-width: 0;
    text-align: left;
}

.azuri-procedures__item-icon {
	display:     flex;
	align-items: center;
	color:       #fff;
	flex-shrink: 0;    
    background-color: #2aadb5;
    border-radius: 10px;
    padding: 2px;
}

.azuri-procedures__chevron {
	transition: transform 0.2s ease;
}

/* ==========================================================================
   Expanded panel
   ========================================================================== */

.azuri-procedures__item-panel {
	background-color: var(--azuri-color-white);
	border-top:       1px solid rgba(42, 173, 181, 0.1);
	overflow:         hidden;
}

.azuri-procedures__item-panel:not([hidden]) {
	display: block;
}

.azuri-procedures__item-panel-inner {
	padding: var(--azuri-space-5);
}

/* Custom content items */
.azuri-procedures__custom-content {
	display:        flex;
	flex-direction: column;
	gap:            var(--azuri-space-5);
}
.azuri-procedures__custom-content .azuri-procedures__content-item:last-child {
    border: 0;
    padding-bottom: 0;
}
.azuri-procedures__content-item {
	font-family: var(--azuri-font-family-base);
	font-size:   var(--azuri-font-size-md);
	color:       var(--azuri-color-ink);
	line-height: var(--azuri-line-height-xs);   
    border-bottom: 1px solid rgba(42, 173, 181, 0.1);
    padding-bottom: 13px;    
    display: flex;
    column-gap: 10px;
}
.azuri-procedures__content-item-heading {
    font-size: 14px;
    font-weight: normal;
    color: #2AADB5;
    margin: 0;
}

.azuri-procedures__content-item-body {
	color: #9AABB8;
    line-height: 1.7;
    font-size: 12px;
}

.azuri-procedures__content-item-body p:last-child { margin-bottom: 0; }

.azuri-procedures__content-item-body ul,
.azuri-procedures__content-item-body ol {
	padding-left: var(--azuri-space-5);
	margin:       var(--azuri-space-2) 0;
}

.azuri-procedures__content-item-body li {
	margin-bottom: var(--azuri-space-1);
}

/* ==========================================================================
   Related pages list
   ========================================================================== */

.azuri-procedures__page-list {
	list-style: none;
	margin:     0;
	padding:    0;
	display:    flex;
	flex-wrap:  wrap;
	gap:        var(--azuri-space-3);
}

.azuri-procedures__page-item {
	flex:  0 0 auto;
	width: 100%;
}

@media ( min-width: 640px ) {
	.azuri-procedures__page-item {
		width: calc(50% - var(--azuri-space-3) / 2);
	}
}

@media ( min-width: 1024px ) {
	.azuri-procedures__page-item {
		width: calc(33.333% - var(--azuri-space-3) * 2 / 3);
	}
}

.azuri-procedures__page-link {
	display:          flex;
	flex-direction:   column;
	gap:              var(--azuri-space-1);
	padding:          var(--azuri-space-4);
	background-color: rgba(245, 249, 250, 0.7);
	border:           1px solid rgba(42, 173, 181, 0.15);
	border-radius:    var(--azuri-radius-md);
	text-decoration:  none;
	transition:       border-color 0.15s ease, background-color 0.15s ease;
}

.azuri-procedures__page-link:hover,
.azuri-procedures__page-link:focus-visible {
	border-color:     var(--azuri-color-teal);
	background-color: rgba(42, 173, 181, 0.04);
	outline:          none;
}

.azuri-procedures__page-link:focus-visible {
	box-shadow: 0 0 0 3px rgba(42, 173, 181, 0.25);
}

.azuri-procedures__page-title {
	font-family: var(--azuri-font-family-base);
	font-size:   var(--azuri-font-size-md);
	font-weight: var(--azuri-font-weight-medium);
	color:       var(--azuri-color-navy);
	line-height: var(--azuri-line-height-xs);
}

.azuri-procedures__page-excerpt {
	font-family: var(--azuri-font-family-base);
	font-size:   var(--azuri-font-size-xs);
	color:       #5a6f80;
	line-height: var(--azuri-line-height-xs);
}

.azuri-procedures__page-arrow {
	font-style: normal;
	color:      var(--azuri-color-teal);
	font-size:  var(--azuri-font-size-md);
	margin-top: var(--azuri-space-1);
}

/* ==========================================================================
   Responsive
   ========================================================================== */

@media ( max-width: 1023.98px ) {

	.azuri-procedures__section-header { flex-wrap: wrap; }

	.azuri-procedures__meta-col .azuri_inner {
		padding-right:  0;
		padding-bottom: var(--azuri-space-5);
	}
}

@media ( max-width: 767px ) {

	.azuri-procedures {
		padding-top:    var(--azuri-space-8);
		padding-bottom: var(--azuri-space-8);
	}

	.azuri-procedures__item-trigger {
		padding: var(--azuri-space-3) var(--azuri-space-4);
	}

	.azuri-procedures__item-panel-inner {
		padding: var(--azuri-space-4);
	}

	.azuri-procedures__page-item {
		width: 100%;
	}
}
