/* === Base Container === */
.dacdb-areas-container {
    font-family: var(--mmp-font-family);
    color: var(--mmp-text);
    line-height: var(--line-height-base);
    margin-bottom: var(--paragraph-spacing-base); /* Add some space below the container */
}

/* === Debug Info === */
.dacdb-debug-info {
    background-color: var(--mmp-surface);
    border: 1px solid var(--mmp-border-color);
    padding: 1rem;
    margin-bottom: 1.5rem;
    font-size: var(--font-sm);
    color: var(--mmp-muted);
    overflow-wrap: break-word; /* Prevent long URLs from breaking layout */
}

/* === General Officer Styles === */
.dacdb-area__officer-figure {
    margin: 0;
    flex-shrink: 0; /* Prevent image from shrinking */
}

.dacdb-area__officer-image {
    display: block; /* Remove extra space below image */
    height: auto; /* Maintain aspect ratio, width is set inline */
    object-fit: cover; /* Ensure image covers the area */
    aspect-ratio: 4 / 5; /* Maintain aspect ratio */
    border: 1px solid var(--mmp-border-color);
    border-radius: 4px; /* Slightly rounded corners */
    background-color: var(--mmp-surface); /* Background for placeholders */
}

.dacdb-area__officer-image--placeholder {
    padding: 10px; /* Add some padding so the SVG isn't edge-to-edge */
    object-fit: contain; /* Don't stretch the placeholder */
    opacity: 0.6;
}

.dacdb-area__officer-details {
    font-size: var(--font-md);
}

.dacdb-area__officer-details strong {
    font-weight: var(--font-weight-bold);
    color: var(--mmp-heading);
}

.dacdb-area__contact-link {
    display: inline-block; /* Allows padding/margin */
    margin-top: 0.5rem;
    padding: 0.3rem 0.8rem;
    background-color: var(--mmp-blue);
    color: var(--mmp-offwhite);
    text-decoration: none;
    border-radius: 3px;
    font-size: var(--font-sm);
    transition: background-color 0.2s ease-in-out;
}

.dacdb-area__contact-link:hover,
.dacdb-area__contact-link:focus {
    background-color: var(--mmp-red);
    color: var(--mmp-offwhite);
}

/* === Style 0 & 1: Linear List === */
.dacdb-areas--style-0 .dacdb-area__officer,
.dacdb-areas--style-1 .dacdb-area__officer {
    display: flex;
    gap: 1.5rem; /* Space between image and text */
    padding-bottom: 1.5rem;
    margin-bottom: 1.5rem;
    border-bottom: 1px solid var(--mmp-border-color);
}

.dacdb-areas--style-0 .dacdb-area__officer:last-child,
.dacdb-areas--style-1 .dacdb-area__officer:last-child {
    border-bottom: none; /* Remove border from last item */
    margin-bottom: 0;
    padding-bottom: 0;
}

/* === Style 2 & 3: Grouped Areas === */
.dacdb-area--grouped,
.dacdb-area--grouped-list {
    padding-bottom: 1.5rem;
    margin-bottom: 1.5rem;
    border-bottom: 1px solid var(--mmp-border-color);
}

.dacdb-area--grouped:last-child,
.dacdb-area--grouped-list:last-child {
     border-bottom: none; /* Remove border from last section */
     margin-bottom: 0;
     padding-bottom: 0;
}

.dacdb-area__title {
    font-size: var(--font-lg);
    font-weight: var(--font-weight-bold);
    color: var(--mmp-heading);
    margin-bottom: 1rem;
}

.dacdb-area__content {
    display: flex;
    flex-wrap: wrap; /* Allow columns to wrap on smaller screens */
    gap: 2rem; /* Space between columns */
}

.dacdb-area__officers-column {
    flex: 1; /* Allow officer column to grow */
    min-width: 250px; /* Minimum width before wrapping */
    display: flex;
    flex-direction: column;
    gap: 1.5rem; /* Space between multiple officers in the same area */
}

.dacdb-area__clubs-column {
    flex: 1; /* Allow club column to grow */
    min-width: 200px; /* Minimum width */
}

.dacdb-area__clubs-column strong {
     font-weight: var(--font-weight-bold);
     color: var(--mmp-heading);
}

/* Style officer display within grouped styles */
.dacdb-area--grouped .dacdb-area__officer,
.dacdb-area--grouped-list .dacdb-area__officer {
     display: flex;
     gap: 1rem; /* Smaller gap within grouped view */
}


/* === Style 3 Specifics: Club List === */
.dacdb-area__clubs-column--list ul {
    list-style: disc;
    margin: 0.5rem 0 0 1.2rem; /* Top margin and left indent */
    padding: 0;
}

.dacdb-area__clubs-column--list li {
    margin-bottom: 0.3rem;
}

/* === No Results / Error Messages === */
.dacdb-areas__no-results,
.dacdb-error {
    color: var(--mmp-muted);
    font-style: italic;
    padding: 1rem;
    border: 1px dashed var(--mmp-border-color);
    text-align: center;
}

.dacdb-error {
    color: var(--mmp-red);
    border-color: var(--mmp-red);
    font-style: normal;
    font-weight: var(--font-weight-bold);
}

/* === Responsive Adjustments (Optional Example) === */
@media (max-width: 768px) {
    /* Stack officer image and details vertically on smaller screens for linear list */
    .dacdb-areas--style-0 .dacdb-area__officer,
    .dacdb-areas--style-1 .dacdb-area__officer {
        flex-direction: column;
        align-items: flex-start; /* Align items to the start */
        gap: 1rem;
    }

    .dacdb-area__officer-figure {
         margin-bottom: 0.5rem; /* Add space below image when stacked */
    }

    /* Ensure grouped columns stack nicely */
    .dacdb-area__content {
        flex-direction: column;
        gap: 1.5rem;
    }
}
