/* ============================================================
   VANE — Member Resources
   Document filter bar (FacetWP) + category accordion
   Child theme root: member-resources.css
   ============================================================ */

/* ------------------------------------------------------------
   Filter bar
   ------------------------------------------------------------ */

.vane-document-filter-bar {
    background: #f9fafb;
    border: 1px solid #eceff2;
    border-radius: 0.75rem;
    padding: 1.25rem;
    margin-bottom: 2.75rem;
    box-shadow: none;
}

/* Search input — full width, no magnifier */
.facetwp-facet-document_search {
    margin-bottom: 0;
}

.facetwp-facet-document_search input.facetwp-search {
    width: 100%;
    max-width: none;
    padding: 1rem 1.125rem;
    border: 1px solid #cfd6dd;
    border-radius: 0.5rem;
    background: #fff;
    color: var(--vane-navy, #00385e);
    font-size: 1rem;
    line-height: 1.4;
    box-sizing: border-box;
    transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

.facetwp-facet-document_search input.facetwp-search::placeholder {
    color: #6b7280;
    opacity: 1;
}

.facetwp-facet-document_search input.facetwp-search:focus {
    outline: none;
    border-color: var(--vane-navy, #00385e);
    box-shadow: 0 0 0 3px rgba(0, 56, 94, 0.08);
}

.facetwp-facet-document_search .facetwp-icon,
.facetwp-facet-document_search .facetwp-search-icon {
    display: none !important;
}

/* Category pills */
.facetwp-facet-document_category {
    display: flex;
    flex-wrap: wrap;
    gap: 0.625rem;
    margin: 1rem 0 0;
    padding: 0;
}

.facetwp-facet-document_category .facetwp-checkbox {
    display: inline-flex;
    align-items: center;
    gap: 0.375rem;
    margin: 0;
    padding: 0.625rem 1.25rem;
    border: 1px solid #cfd6dd;
    border-radius: 999px;
    background: #fff;
    color: var(--vane-navy, #00385e);
    font-size: 0.9375rem;
    line-height: 1.2;
    cursor: pointer;
    transition: background 0.15s ease, border-color 0.15s ease;
}

.facetwp-facet-document_category .facetwp-checkbox::before,
.facetwp-facet-document_category .facetwp-checkbox::after {
    content: none !important;
}

.facetwp-facet-document_category .facetwp-checkbox:hover {
    border-color: var(--vane-navy, #00385e);
}

.facetwp-facet-document_category .facetwp-counter {
    opacity: 0.55;
    font-size: 0.875rem;
}

/* Selected pill — mint fill + circular clear icon */
.facetwp-facet-document_category .facetwp-checkbox.checked {
    background: var(--vane-mint, #abe2c7);
    border-color: var(--vane-mint, #abe2c7);
    color: var(--vane-navy, #00385e);
    font-weight: 700;
    padding-right: 0.75rem;
}

.facetwp-facet-document_category .facetwp-checkbox.checked .facetwp-counter {
    display: none;
}

.facetwp-facet-document_category .facetwp-checkbox.checked::after {
    content: "" !important;
    flex: 0 0 auto;
    width: 1.125rem;
    height: 1.125rem;
    margin-left: 0.25rem;
    background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Ccircle cx='10' cy='10' r='10' fill='%2300385E'/%3E%3Cpath d='M6.9 6.9l6.2 6.2M13.1 6.9l-6.2 6.2' stroke='%23ffffff' stroke-width='1.8' stroke-linecap='round'/%3E%3C/svg%3E") no-repeat center / contain;
}

/* Soft Limit toggle — dashed so it doesn't read as another category */
.facetwp-facet-document_category .facetwp-toggle {
    display: inline-flex;
    align-items: center;
    flex-basis: auto;
    margin-top: 0;
    padding: 0.625rem 1.25rem;
    border: 1px dashed #cfd6dd;
    border-radius: 999px;
    background: transparent;
    color: var(--vane-navy, #00385e);
    font-size: 0.9375rem;
    font-weight: 600;
    line-height: 1.2;
    text-decoration: none;
    cursor: pointer;
    transition: border-color 0.15s ease, background 0.15s ease;
}

.facetwp-facet-document_category .facetwp-toggle:hover {
    border-color: var(--vane-navy, #00385e);
    background: #fff;
}

/* ------------------------------------------------------------
   Document accordion
   One bordered card, hairline-separated rows — keeps the collapsed
   stack compact when there are a lot of categories.
   ------------------------------------------------------------ */

.vane-doc-accordions {
    border: 1px solid var(--vane-hairline, #e4e8ec);
    border-radius: 0.5rem;
    overflow: hidden;
    background: #fff;
}

.vane-doc-accordion {
    margin: 0;
    border: 0;
    border-radius: 0;
}

.vane-doc-accordion + .vane-doc-accordion {
    border-top: 1px solid var(--vane-hairline, #e4e8ec);
}

.vane-doc-accordion__header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    width: 100%;
    padding: 1rem 1.25rem;
    border: 0;
    background: #fff;
    color: var(--vane-navy, #00385e);
    font-family: inherit;
    font-size: 1.0625rem;
    font-weight: 700;
    line-height: 1.3;
    text-align: left;
    cursor: pointer;
    transition: background 0.15s ease;
}

.vane-doc-accordion__header:hover {
    background: #f9fafb;
}

.vane-doc-accordion__header:focus-visible {
    outline: 2px solid var(--vane-navy, #00385e);
    outline-offset: -2px;
}

.vane-doc-accordion__header[aria-expanded="true"] {
    border-bottom: 1px solid var(--vane-hairline, #e4e8ec);
}

.vane-doc-accordion__count {
    margin-left: auto;
    font-size: 0.875rem;
    font-weight: 400;
    opacity: 0.55;
}

.vane-doc-accordion__header::after {
    content: "";
    flex: 0 0 auto;
    width: 0.75rem;
    height: 0.5rem;
    background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 10 5'%3E%3Cpath d='M9.82557 4.09574L5.61046 0.239361C5.51356 0.150709 5.41666 0.0886529 5.31976 0.0531919C5.22286 0.0177309 5.11627 0 5 0C4.88372 0 4.77713 0.0177309 4.68023 0.0531919C4.58333 0.0886529 4.48643 0.150709 4.38953 0.239361L0.174419 4.09574C0.116279 4.14894 0.0728683 4.20674 0.0441861 4.26915C0.015504 4.33156 0.000775193 4.39787 0 4.46808C0 4.60993 0.0534883 4.73404 0.160465 4.84043C0.267442 4.94681 0.407752 5 0.581395 5L9.4186 5C9.59302 5 9.73371 4.94681 9.84069 4.84043C9.94767 4.73404 10.0008 4.60993 9.99999 4.46809C9.99999 4.43262 9.94185 4.30851 9.82557 4.09574Z' fill='%2300385E'/%3E%3C/svg%3E") no-repeat center / contain;
    transition: transform 0.2s ease;
}

.vane-doc-accordion__header[aria-expanded="false"]::after {
    transform: rotate(180deg);
}

.vane-doc-accordion__panel {
    padding: 1rem 1.25rem 1.25rem;
}

.vane-doc-accordion__header[aria-expanded="false"] + .vane-doc-accordion__panel {
    display: none;
}

/* Categories past the visible cap */
.vane-doc-accordion.is-overflow {
    display: none;
}

.vane-doc-accordions.is-expanded .vane-doc-accordion.is-overflow {
    display: block;
}

.vane-doc-categories-toggle {
    display: block;
    width: 100%;
    padding: 0.875rem 1.25rem;
    border: 0;
    border-top: 1px solid var(--vane-hairline, #e4e8ec);
    background: #f9fafb;
    color: var(--vane-navy, #00385e);
    font-family: inherit;
    font-size: 0.9375rem;
    font-weight: 700;
    text-align: center;
    cursor: pointer;
    transition: background 0.15s ease;
}

.vane-doc-categories-toggle:hover {
    background: #f2f5f8;
}

.vane-doc-categories-toggle:focus-visible {
    outline: 2px solid var(--vane-navy, #00385e);
    outline-offset: -2px;
}

/* ------------------------------------------------------------
   Document rows
   ------------------------------------------------------------ */

.vane-doc-row {
    display: flex;
    align-items: center;
    gap: 1.25rem;
    padding: 0.75rem 0;
}

.vane-doc-row + .vane-doc-row {
    border-top: 1px solid #f1f4f7;
}

.vane-doc-row__icon {
    flex: 0 0 auto;
    width: 2.5rem;
    height: 2.5rem;
    background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 60 60'%3E%3Cpath d='M33.417 6C33.5551 6 33.667 6.11193 33.667 6.25V19C33.667 20.1044 34.5627 20.9996 35.667 21H48.417C48.5551 21 48.667 21.1119 48.667 21.25V52C48.667 53.1046 47.7716 54 46.667 54H13.334C12.2296 53.9998 11.334 53.1045 11.334 52V8C11.334 6.89554 12.2296 6.00018 13.334 6H33.417ZM18.001 43.667C17.4488 43.6672 17.001 44.1148 17.001 44.667C17.0012 45.219 17.4489 45.6668 18.001 45.667H31.334C31.886 45.6668 32.3338 45.219 32.334 44.667C32.334 44.1148 31.8861 43.6672 31.334 43.667H18.001ZM18.001 35.667C17.4488 35.6672 17.001 36.1148 17.001 36.667C17.0012 37.219 17.449 37.6668 18.001 37.667H34.001C34.553 37.6668 35.0008 37.219 35.001 36.667C35.001 36.1148 34.5531 35.6672 34.001 35.667H18.001ZM18.001 27.667C17.4488 27.6672 17.001 28.1148 17.001 28.667C17.0012 29.219 17.449 29.6668 18.001 29.667H34.001C34.553 29.6668 35.0008 29.219 35.001 28.667C35.001 28.1148 34.5531 27.6672 34.001 27.667H18.001ZM35.334 6.60352C35.334 6.3809 35.6032 6.26954 35.7607 6.42676L48.2412 18.9062C48.3986 19.0637 48.2869 19.3327 48.0645 19.333H36.334C35.7818 19.3328 35.334 18.8852 35.334 18.333V6.60352Z' fill='%2300385E'/%3E%3C/svg%3E") no-repeat center / contain;
}

.vane-doc-row__title {
    flex: 1 1 auto;
    min-width: 0;
    margin: 0;
    color: var(--vane-navy, #00385e);
    font-size: 1rem;
    font-weight: 700;
    line-height: 1.4;
}

.vane-doc-row__desc {
    display: block;
    margin-top: 0.25rem;
    color: var(--vane-gray, #353f47);
    font-size: 0.875rem;
    font-weight: 400;
}

/* Download button */
.vane-doc-download {
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    min-width: 11rem;
    padding: 0.875rem 1.5rem;
    border: 0;
    border-radius: 0.25rem;
    background: var(--vane-mint, #abe2c7);
    color: var(--vane-navy, #00385e);
    box-shadow: 0 3px 0 -1px var(--vane-navy, #00385e);
    font-size: 0.8125rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    text-decoration: none;
    cursor: pointer;
    transition: transform 0.12s ease, box-shadow 0.12s ease, background 0.15s ease;
}

.vane-doc-download:hover,
.vane-doc-download:focus {
    background: var(--vane-navy, #00385e) !important;
    color: #fff !important;
    box-shadow: 0 3px 0 -1px var(--vane-mint, #abe2c7) !important;
    text-decoration: none !important;
}

.vane-doc-download:active {
    transform: translateY(2px);
    box-shadow: 0 1px 0 -1px var(--vane-navy, #00385e);
}

.vane-doc-download__icon {
    flex: 0 0 auto;
    width: 1rem;
    height: 1rem;
    background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none'%3E%3Cpath d='M2.66667 11.3333L2.66667 11.6667C2.66667 12.6095 2.66667 13.0809 2.95956 13.3738C3.25245 13.6667 3.72386 13.6667 4.66667 13.6667L11.3333 13.6667C12.2761 13.6667 12.7475 13.6667 13.0404 13.3738C13.3333 13.0809 13.3333 12.6095 13.3333 11.6667L13.3333 11.3333' stroke='%2300385E' stroke-width='1.5' stroke-linecap='round'/%3E%3Cpath d='M10.8953 9.04255L8.36628 11.3564C8.30814 11.4096 8.25 11.4468 8.19186 11.4681C8.13372 11.4894 8.06977 11.5 8 11.5C7.93023 11.5 7.86628 11.4894 7.80814 11.4681C7.75 11.4468 7.69186 11.4096 7.63372 11.3564L5.10465 9.04255C5.06977 9.01064 5.04372 8.97596 5.02651 8.93851C5.0093 8.90106 5.00047 8.86128 5 8.81915C5 8.73404 5.03209 8.65957 5.09628 8.59574C5.16047 8.53191 5.24465 8.5 5.34884 8.5L10.6512 8.5C10.7558 8.5 10.8402 8.53191 10.9044 8.59574C10.9686 8.65957 11.0005 8.73404 11 8.81915C11 8.84043 10.9651 8.91489 10.8953 9.04255Z' fill='%2300385E'/%3E%3Cpath d='M8.53119 8.50097C8.51366 8.78148 8.28105 9 8 9C7.71895 9 7.48634 8.78148 7.46881 8.50097L7.06238 1.99805C7.02858 1.45721 7.4581 1 8 1C8.5419 1 8.97142 1.45721 8.93762 1.99805L8.53119 8.50097Z' fill='%2300385E'/%3E%3C/svg%3E") no-repeat center / contain;
}

.vane-doc-download:hover .vane-doc-download__icon,
.vane-doc-download:focus .vane-doc-download__icon {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none'%3E%3Cpath d='M2.66667 11.3333L2.66667 11.6667C2.66667 12.6095 2.66667 13.0809 2.95956 13.3738C3.25245 13.6667 3.72386 13.6667 4.66667 13.6667L11.3333 13.6667C12.2761 13.6667 12.7475 13.6667 13.0404 13.3738C13.3333 13.0809 13.3333 12.6095 13.3333 11.6667L13.3333 11.3333' stroke='%23ffffff' stroke-width='1.5' stroke-linecap='round'/%3E%3Cpath d='M10.8953 9.04255L8.36628 11.3564C8.30814 11.4096 8.25 11.4468 8.19186 11.4681C8.13372 11.4894 8.06977 11.5 8 11.5C7.93023 11.5 7.86628 11.4894 7.80814 11.4681C7.75 11.4468 7.69186 11.4096 7.63372 11.3564L5.10465 9.04255C5.06977 9.01064 5.04372 8.97596 5.02651 8.93851C5.0093 8.90106 5.00047 8.86128 5 8.81915C5 8.73404 5.03209 8.65957 5.09628 8.59574C5.16047 8.53191 5.24465 8.5 5.34884 8.5L10.6512 8.5C10.7558 8.5 10.8402 8.53191 10.9044 8.59574C10.9686 8.65957 11.0005 8.73404 11 8.81915C11 8.84043 10.9651 8.91489 10.8953 9.04255Z' fill='%23ffffff'/%3E%3Cpath d='M8.53119 8.50097C8.51366 8.78148 8.28105 9 8 9C7.71895 9 7.48634 8.78148 7.46881 8.50097L7.06238 1.99805C7.02858 1.45721 7.4581 1 8 1C8.5419 1 8.97142 1.45721 8.93762 1.99805L8.53119 8.50097Z' fill='%23ffffff'/%3E%3C/svg%3E");
}
/* ------------------------------------------------------------
   Empty state + utilities
   ------------------------------------------------------------ */

.vane-doc-empty {
    margin: 0;
    padding: 2rem 0;
    color: var(--vane-gray, #353f47);
    font-size: 1rem;
    text-align: center;
}

/* Fallback if the parent theme doesn't ship one */
.vane-doc-row .screen-reader-text {
    position: absolute;
    width: 1px;
    height: 1px;
    margin: -1px;
    padding: 0;
    overflow: hidden;
    clip: rect(0 0 0 0);
    white-space: nowrap;
    border: 0;
}

/* ------------------------------------------------------------
   Mobile
   ------------------------------------------------------------ */

@media (max-width: 767px) {
    .vane-document-filter-bar {
        padding: 1rem;
    }

    .facetwp-facet-document_search input.facetwp-search {
        padding: 0.875rem 1rem;
        font-size: 1rem; /* keep at 16px+ so iOS doesn't zoom on focus */
    }

    .vane-doc-accordion__header {
        padding: 0.875rem 1rem;
        font-size: 1rem;
    }

    .vane-doc-accordion__panel {
        padding: 0.875rem 1rem 1rem;
    }

    .vane-doc-row {
        flex-wrap: wrap;
        gap: 0.75rem 1rem;
    }

    .vane-doc-row__title {
        flex: 1 1 60%;
    }

    .vane-doc-download {
        flex: 1 1 100%;
        min-width: 0;
    }
}
