/* ================================
   Accordion – Full Header Button + Rotating Chevron
   ================================ */

.accordion-item {
    background: #1f6f94;
    border-radius: 8px;
    margin-bottom: 18px;
    overflow: hidden;
    border: none;
    box-shadow: 0 3px 10px rgba(0,0,0,0.08);
}

.accordion-header{
    margin-bottom:0;
    margin-top:0;
}

/* Make the button fill the whole header */
.accordion-button {
    background: #1f6f94; 
    color: #fff;
    font-weight: 700;
    padding: 1.8em 2em;
    font-size: 1.55rem; 
    border: none;
    width: 100%;
    box-shadow: none;
    border-radius: 0;
    transition: background .25s ease, color .25s ease;
}

/* REMOVE Bootstrap’s default arrow */
.accordion-button::after {
    background-image: none !important;
}

/* Your Font Awesome chevron */
.accordion-button::after {
    content: "\f078"; 
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    font-size: 1.2rem;
    color: #fff;
    transition: transform .3s ease;
}

/* Rotate chevron when open */
.accordion-button:not(.collapsed)::after {
    transform: rotate(-180deg);
}

.accordion-button:hover {
    background: #195c7a;
    color: #fff;
}

.accordion-button:focus {
    box-shadow: none;
}

.accordion-body {
    background: #ffffff;
    padding: 1.8em 2em;
    font-size: 1.45rem;
    line-height: 1.7;
    color: #333;
    border-top: 1px solid rgba(255,255,255,0.3);
}