/* File: custom-shared-styles.css 
   Description: Custom styles that load in both Editor and Frontend
*/

/* Force Bold Text to be Heavy (700) */
b,
strong,
th {
    font-weight: 700 !important;
}

/* 1. Style the Toggle Button */
.wp-block-accordion-heading__toggle {
    background-color: #2C6C6E !important; /* Your specific blue */
    color: #ffffff !important;           /* White text */
    padding: 1rem 1.5rem;               /* Added horizontal padding for the background */
    border-radius: 4px;                 /* Optional: slight rounding */
    border: none;
    width: 100%;
    display: flex;
    justify-content: space-between;
    align-items: center;
    transition: background-color 0.3s ease;
	font-size:20px;
}

/* 2. Hover effect for better UX */
/* Update your Accordion hover to target the button itself */
.wp-block-accordion-heading__toggle:hover {
    background-color: #89AF3E !important; 
}

/* 3. The Title Text */
.wp-block-accordion-heading__toggle-title {
    color: #ffffff !important;
    font-weight: 600;
}

/* 4. Hide the entire original icon container so the +/- can't show up */
.wp-block-accordion-heading__toggle-icon {
    display: none !important;
}

/* 5. Create a BRAND NEW icon from scratch using the Toggle button itself */
.wp-block-accordion-heading__toggle::after {
    content: "";
    display: inline-block;
    width: 14px;
    height: 14px;
    border-right: 3px solid #ffffff;
    border-bottom: 3px solid #ffffff;
    margin-left: 20px;
    transition: transform 0.3s ease-in-out;
    /* Points RIGHT when closed */
    transform: rotate(-45deg); 
}

/* 6. Rotate that new icon when the parent item is open */
.wp-block-accordion-item.is-open .wp-block-accordion-heading__toggle::after {
    /* Points DOWN when open */
    transform: rotate(45deg);
}
/* Ensure the first paragraph inside the panel doesn't have a top margin either */
.wp-block-accordion-panel > *:first-child {
    margin-top: 0 !important;
}

.wp-block-accordion-panel {
    padding: 1.5rem;
    border: 1px solid #e5e5e5;
    border-top: none; 
    background-color: #f9f9f9;
    margin-top: 0 !important; /* Forces it to touch the blue bar */
}
.wp-block-accordion, 
.wp-block-accordion-item {
    border: none !important;
	
}/* 1. Target the main Accordion container */
.wp-block-accordion {
    /* Kill the default WordPress block gap */
    gap: 1px !important; 
    display: flex;
    flex-direction: column;
}

/* 2. Remove any legacy margins that WordPress might be injecting */
.wp-block-accordion-item {
    margin-top: 0 !important;
    margin-bottom: 0 !important;
}

/* 3. Optional: Add a 1px border between items if the gap isn't showing */
.wp-block-accordion-item + .wp-block-accordion-item {
    border-top: 1px solid #ffffff; /* Or a darker shade if you want a visible line */
}
.wp-block-accordion-heading__toggle-title {
    text-decoration: none !important;
}
