﻿.accordion {
	width:100%;
	margin:0 auto;
}

.accordion:not(:first-of-type) {
	margin-top:34px;
}


/* ==============================
   ACCORDION ITEM
   ============================== */

.accordion-item {
	background:#eae8e5;
	border-radius:34px;
	margin-bottom:14px;
	overflow:hidden;
}


/* ==============================
   ACCORDION HEADER
   ============================== */

.accordion-header {
	position:relative;
	z-index:2;
}

.accordion-button {
	width:100%;
	display:block;
	padding:0.9em 3em 0.9em 1.2em;
	border:none;
	text-align:left;
	cursor:pointer;
	background:#2a81b9;
	color:#fff;
	font-size:110%;
	font-weight:bold;
	box-sizing:border-box;
	border-radius:34px;
	margin:0;
	position:relative;
	z-index:20;
	transition:
		background .3s ease,
		color .3s ease;
}

.accordion-button:hover,
.accordion-button.active {
	background:#f9bc5d!important;
	color:#02478e!important;
}

.accordion-button,
.accordion-button:hover,
.accordion-button:focus,
.accordion-button:active {
	transform:none!important;
	top:0!important;
	left:0!important;
	box-shadow:none!important;
	outline:none!important;
}


/* ==============================
   ICONS
   ============================== */

.accordion-button:after {
	position:absolute;
	right:1.5em;
	top:50%;
	transform:
		translateY(-50%)
		rotate(0deg);
	transform-origin:center;
	content:"\f067";
	font-family:"Font Awesome 6 Free";
	font-weight:900;
	transition:transform .3s ease;
}

.accordion-button.active:after {
	transform:
		translateY(-50%)
		rotate(45deg);
}


/* ==============================
   ACCORDION CONTENT
   ============================== */

.accordion-collapse {
	position:relative;
	z-index:1;
}

.accordion-body {
	margin-top:-22px;
	padding: 44px 34px 28px	34px;
}

.accordion-body p:first-child {
	margin-top:0;
}

.accordion-body p {
	padding:5px 0;
	margin:5px 0;
}


/* ==============================
   PAGE-SPECIFIC OVERRIDES
   ============================== */

section#how-we-work .accordion-item {
	background:#fff;
}


/* ==============================
   BUILDER UI
   ============================== */

#accordion-builder {
	margin-top:10px;
}

.accordion-builder-item {
	border:1px solid #d6d6d6;
	background:#f8f8f8;
	padding:12px;
	margin-bottom:12px;
	border-radius:4px;
}

.accordion-builder-item label {
	display:block;
	font-weight:bold;
	margin-bottom:5px;
}

.accordion-builder-item input,
.accordion-builder-item textarea {
	width:100%;
	box-sizing:border-box;
	padding:8px;
	margin-bottom:10px;
	font-size:13px;
}

.accordion-builder-item textarea {
	resize:vertical;
	min-height:80px;
}

.accordion-builder-item.dragging {
	opacity:0.5;
}


/* ==============================
   DRAG HANDLE
   ============================== */

.drag-handle {
	cursor:move;
	background:#e9e9e9;
	padding:8px 10px;
	margin:-12px -12px 12px -12px;
	border-bottom:1px solid #d6d6d6;
	font-weight:bold;
	user-select:none;
}

.drag-handle:hover {
	background:#dcdcdc;
}


/* ==============================
   BUILDER ACTIONS
   ============================== */

.accordion-actions {
	margin-top:10px;
}

.remove-tab.disabled,
.remove-tab:disabled {
	opacity:0.5;
	cursor:not-allowed;
}