/**
 * BW Downloads — WPDM packages grouped into cards.
 *
 * Scoped under .elementor-widget-bw-downloads so the rules outrank the
 * Elementor global kit (`.elementor-kit-N h4`) and the theme's link styles.
 * Selector weights are kept at parity with the CSS Elementor generates from
 * the widget controls, so controls win on source order rather than being
 * locked out by a heavier default.
 */

.elementor-widget-bw-downloads {
    --bw-blue: #005eb8;
    --bw-blue-dk: #00427f;
    --bw-orange: #f28120;
    --bw-orange-tint: #fdf0e4;
    --bw-ink: #101720;
    --bw-body: #5b6570;
    --bw-mute: #8a95a1;
    --bw-line: #e2e6ea;
    --bw-soft: #f7f9fb;
}

.elementor-widget-bw-downloads * {
    box-sizing: border-box;
}

/* ========================================== search & filter toolbar ====== */
/* wraps the toolbar plus whichever layout follows, so the script has a single
   scope to query and two widgets on one page never filter each other */
.elementor-widget-bw-downloads .bw-dl-wrap {
    display: block;
}

.elementor-widget-bw-downloads .bw-dl-tools {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 10px;
    margin-bottom: 18px;
}

.elementor-widget-bw-downloads .bw-dl-search {
    position: relative;
    display: flex;
    align-items: center;
    flex: 1 1 260px;
    min-width: 200px;
}

.elementor-widget-bw-downloads .bw-dl-search svg {
    position: absolute;
    left: 14px;
    color: var(--bw-mute);
    pointer-events: none;
}

.elementor-widget-bw-downloads .bw-dl-search input[type="search"] {
    width: 100%;
    margin: 0;
    padding: 11px 14px 11px 38px;
    border: 1px solid var(--bw-line);
    border-radius: 999px;
    background: #fff;
    font: 400 13.5px/1.4 'Open Sans', Arial, sans-serif;
    color: var(--bw-ink);
    -webkit-appearance: none;
    appearance: none;
}

.elementor-widget-bw-downloads .bw-dl-search input[type="search"]:focus {
    outline: none;
    border-color: var(--bw-blue);
    box-shadow: 0 0 0 3px rgba(0, 94, 184, .12);
}

.elementor-widget-bw-downloads .bw-dl-select {
    flex: 0 0 auto;
    margin: 0;
    padding: 10px 34px 10px 14px;
    border: 1px solid var(--bw-line);
    border-radius: 999px;
    background-color: #fff;
    /* chevron drawn inline so the control needs no icon font */
    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%238a95a1' stroke-width='2.5' stroke-linecap='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right 13px center;
    font: 600 12.5px/1.4 'Open Sans', Arial, sans-serif;
    color: var(--bw-body);
    cursor: pointer;
    -webkit-appearance: none;
    appearance: none;
}

.elementor-widget-bw-downloads .bw-dl-select:focus {
    outline: none;
    border-color: var(--bw-blue);
}

.elementor-widget-bw-downloads .bw-dl-clear {
    flex: 0 0 auto;
    margin: 0;
    padding: 10px 16px;
    border: 1px solid transparent;
    border-radius: 999px;
    background: transparent;
    font: 800 10.5px/1 'Open Sans', Arial, sans-serif;
    letter-spacing: 1.1px;
    text-transform: uppercase;
    color: var(--bw-blue);
    cursor: pointer;
}

.elementor-widget-bw-downloads .bw-dl-clear:hover {
    border-color: var(--bw-line);
}

.elementor-widget-bw-downloads .bw-dl-results {
    margin-left: auto;
    font: 600 11.5px/1.4 'Open Sans', Arial, sans-serif;
    color: var(--bw-mute);
    white-space: nowrap;
}

.elementor-widget-bw-downloads .bw-dl-none {
    margin: 0;
    padding: 26px 20px;
    text-align: center;
    border: 1px dashed var(--bw-line);
    border-radius: 14px;
    font: 400 13.5px/1.6 'Open Sans', Arial, sans-serif;
    color: var(--bw-mute);
}

/* [hidden] has to beat the display rules the layouts set */
.elementor-widget-bw-downloads [hidden] {
    display: none !important;
}

.elementor-widget-bw-downloads .bw-dl {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 22px;
    align-items: start;
}

.elementor-widget-bw-downloads .bw-dl-card {
    border: 1px solid var(--bw-line);
    border-radius: 14px;
    background: #fff;
    overflow: hidden;
    min-width: 0;
}

/* ---------------------------------------------------------- card head --- */
.elementor-widget-bw-downloads .bw-dl-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 15px 20px;
    background: var(--bw-soft);
    border-bottom: 1px solid var(--bw-line);
}

.elementor-widget-bw-downloads .bw-dl-h {
    margin: 0;
    padding: 0;
    font: 800 11.5px/1.3 'Open Sans', Arial, sans-serif;
    letter-spacing: 1.5px;
    text-transform: uppercase;
    color: var(--bw-ink);
}

.elementor-widget-bw-downloads .bw-dl-count {
    flex: 0 0 auto;
    font: 800 10px/1 'Open Sans', Arial, sans-serif;
    letter-spacing: 1px;
    text-transform: uppercase;
    color: var(--bw-mute);
}

/* --------------------------------------------------------------- rows --- */
.elementor-widget-bw-downloads .bw-dl-row {
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 13px 20px;
    border-bottom: 1px solid var(--bw-line);
    text-decoration: none;
    color: inherit;
    transition: background .15s ease;
}

.elementor-widget-bw-downloads .bw-dl-row:last-child {
    border-bottom: none;
}

.elementor-widget-bw-downloads .bw-dl-row:hover {
    background: var(--bw-soft);
}

.elementor-widget-bw-downloads .bw-dl-row:focus-visible {
    outline: 2px solid var(--bw-blue);
    outline-offset: -2px;
}

.elementor-widget-bw-downloads .bw-dl-ic {
    flex: 0 0 34px;
    width: 34px;
    height: 34px;
    border-radius: 9px;
    background: var(--bw-orange-tint);
    color: var(--bw-orange);
    display: flex;
    align-items: center;
    justify-content: center;
}

.elementor-widget-bw-downloads .bw-dl-ic svg {
    display: block;
}

.elementor-widget-bw-downloads .bw-dl-t {
    flex: 1 1 auto;
    min-width: 0;
    display: block;
}

.elementor-widget-bw-downloads .bw-dl-t b {
    display: block;
    font: 700 13px/1.4 'Open Sans', Arial, sans-serif;
    color: var(--bw-ink);
}

.elementor-widget-bw-downloads .bw-dl-m {
    display: block;
    font: 400 11.5px/1.4 'Open Sans', Arial, sans-serif;
    color: var(--bw-mute);
    margin-top: 1px;
}

.elementor-widget-bw-downloads .bw-dl-btn {
    flex: 0 0 auto;
    padding: 8px 16px;
    border-radius: 999px;
    border: 2px solid var(--bw-line);
    background: transparent;
    font: 800 10.5px/1 'Open Sans', Arial, sans-serif;
    letter-spacing: 1.1px;
    text-transform: uppercase;
    color: var(--bw-body);
    white-space: nowrap;
    transition: border-color .15s ease, color .15s ease, background .15s ease;
}

/* button hover is defined once, further down, and keyed on the button itself
   rather than on the row — hovering anywhere in a row should not light up its
   button */

/* a gated package links to its own page to unlock rather than to a dead file */
.elementor-widget-bw-downloads .bw-dl-row.is-locked .bw-dl-ic {
    background: var(--bw-line);
    color: var(--bw-mute);
}

/* ================================================== single-table layout === */
.elementor-widget-bw-downloads .bw-dl-tablewrap {
    border: 1px solid var(--bw-line);
    border-radius: 14px;
    overflow: hidden;
    background: #fff;
}

.elementor-widget-bw-downloads .bw-dl-table {
    width: 100%;
    border-collapse: collapse;
    margin: 0;
    table-layout: auto;
}

/* Themes routinely style `table th, table td { border: 1px solid }`. Those
   inherited rules were drawing the stray vertical rules between columns, so
   clear everything and re-apply only the horizontal hairlines below. */
.elementor-widget-bw-downloads .bw-dl-table th,
.elementor-widget-bw-downloads .bw-dl-table td {
    border: 0;
    background-image: none;
}

.elementor-widget-bw-downloads .bw-dl-table thead th {
    background: var(--bw-soft);
    border-bottom: 1px solid var(--bw-line);
    padding: 13px 18px;
    text-align: left;
    font: 800 10px/1.35 'Open Sans', Arial, sans-serif;
    letter-spacing: 1.5px;
    text-transform: uppercase;
    color: var(--bw-mute);
    white-space: nowrap;
}

/* Group header row. Defaults to a light grey band so it reads as a divider
   rather than another data row; background, text, accent bar and spacing are
   all exposed as controls. Kept at (0,3,0) — the same weight Elementor
   generates — so those controls win on source order. */
.elementor-widget-bw-downloads .bw-dl-grouprow th {
    background: var(--bw-soft);
    border-bottom: 1px solid var(--bw-line) !important;
    padding: 12px 18px 11px;
    text-align: left;
    box-shadow: none;
}

.elementor-widget-bw-downloads .bw-dl-grouprow .bw-dl-h {
    font: 800 11.5px/1.3 'Open Sans', Arial, sans-serif;
    letter-spacing: 1.6px;
    text-transform: uppercase;
    color: var(--bw-ink);
}

.elementor-widget-bw-downloads .bw-dl-grouprow .bw-dl-count {
    margin-left: 10px;
    font: 700 10px/1 'Open Sans', Arial, sans-serif;
    letter-spacing: .8px;
    text-transform: uppercase;
    color: var(--bw-mute);
}

.elementor-widget-bw-downloads .bw-dl-table tbody td {
    padding: 12px 18px;
    border-bottom: 1px solid var(--bw-line);
    font: 400 13px/1.5 'Open Sans', Arial, sans-serif;
    color: var(--bw-body);
    vertical-align: middle;
}

.elementor-widget-bw-downloads .bw-dl-table tbody tr:last-child td {
    border-bottom: none;
}

.elementor-widget-bw-downloads .bw-dl-table tbody tr:hover td {
    background: var(--bw-soft);
}

.elementor-widget-bw-downloads .bw-dl-c-title {
    width: 55%;
}

/* NOTE: no display override here. `display:flex` on a <td> replaces
   `display:table-cell`, which drops the cell out of the table layout
   algorithm — columns stop aligning and rows collapse. The icon is aligned
   inline instead. */
.elementor-widget-bw-downloads .bw-dl-table td.bw-dl-c-title a {
    font: 700 13px/1.4 'Open Sans', Arial, sans-serif;
    color: var(--bw-ink);
    text-decoration: none;
    vertical-align: middle;
}

.elementor-widget-bw-downloads .bw-dl-table td.bw-dl-c-title a:hover {
    color: var(--bw-blue);
}

.elementor-widget-bw-downloads .bw-dl-c-type,
.elementor-widget-bw-downloads .bw-dl-c-size,
.elementor-widget-bw-downloads .bw-dl-c-date,
.elementor-widget-bw-downloads .bw-dl-c-ver,
.elementor-widget-bw-downloads .bw-dl-c-dls {
    white-space: nowrap;
    font-size: 12.5px;
    color: var(--bw-mute);
}

.elementor-widget-bw-downloads .bw-dl-c-btn {
    text-align: right;
    white-space: nowrap;
}

.elementor-widget-bw-downloads .bw-dl-table .bw-dl-btn {
    display: inline-block;
}

/* The one button-hover default, shared by both layouts. Kept at the same
   weight as the generated control rule so the Style controls still win. */
.elementor-widget-bw-downloads .bw-dl-btn:hover {
    border-color: var(--bw-blue);
    color: var(--bw-blue);
}

.elementor-widget-bw-downloads .bw-dl-table tr.is-locked .bw-dl-ic {
    background: var(--bw-line);
    color: var(--bw-mute);
}

/* inline-flex so the cell stays a table-cell; the base rule uses flex for the
   card layout, where the row really is a flex container */
.elementor-widget-bw-downloads .bw-dl-table .bw-dl-ic {
    display: inline-flex;
    flex: none;
    width: 30px;
    height: 30px;
    margin-right: 11px;
    vertical-align: middle;
}

/* ------------------------------------------------- table on mobile --- *
 * Below 768px the table stops being a table and each row becomes a stacked
 * block. The previous approach — min-width plus horizontal scroll — pushed
 * the Download button off-screen with nothing to suggest it was there.
 *
 * thead is hidden, so every value carries its own caption from the
 * data-label attribute the render adds.                                   */
@media (max-width: 767px) {
    .elementor-widget-bw-downloads .bw-dl-tablewrap {
        overflow-x: visible;
    }

    .elementor-widget-bw-downloads .bw-dl-table {
        min-width: 0;
    }

    .elementor-widget-bw-downloads .bw-dl-table thead {
        display: none;
    }

    .elementor-widget-bw-downloads .bw-dl-table,
    .elementor-widget-bw-downloads .bw-dl-table tbody,
    .elementor-widget-bw-downloads .bw-dl-table tr,
    .elementor-widget-bw-downloads .bw-dl-table th,
    .elementor-widget-bw-downloads .bw-dl-table td {
        display: block;
    }

    /* the group heading row keeps its full-width band */
    .elementor-widget-bw-downloads .bw-dl-table tr.bw-dl-grouprow th {
        width: 100%;
        padding: 11px 14px;
    }

    .elementor-widget-bw-downloads .bw-dl-table tr[data-bw-item] {
        padding: 14px;
        border-top: 1px solid var(--bw-line);
    }

    /* the group band already draws the line above the first item in a group */
    .elementor-widget-bw-downloads .bw-dl-table tr.bw-dl-grouprow + tr[data-bw-item] {
        border-top: 0;
    }

    .elementor-widget-bw-downloads .bw-dl-table tr[data-bw-item] td {
        padding: 0;
        border: 0;
    }

    /* Title: icon and text on one line, with the text wrapping beside the
       icon rather than beneath it. Flex is safe here — these cells are
       already display:block in this breakpoint, so it replaces block, not
       table-cell, and none of the table layout algorithm is involved. */
    .elementor-widget-bw-downloads .bw-dl-table td.bw-dl-c-title {
        display: flex;
        align-items: flex-start;
        gap: 10px;
        width: auto;
        margin: 0 0 10px;
    }

    .elementor-widget-bw-downloads .bw-dl-table td.bw-dl-c-title .bw-dl-ic {
        margin-right: 0;
        margin-top: 1px;
    }

    .elementor-widget-bw-downloads .bw-dl-table td.bw-dl-c-title a {
        flex: 1 1 auto;
        min-width: 0;
        font-size: 13.5px;
        line-height: 1.45;
    }

    /* Meta values sit on one wrapping line. The row is a block, so
       inline-block children flow together instead of stacking. */
    .elementor-widget-bw-downloads .bw-dl-table td.bw-dl-c-type,
    .elementor-widget-bw-downloads .bw-dl-table td.bw-dl-c-size,
    .elementor-widget-bw-downloads .bw-dl-table td.bw-dl-c-date,
    .elementor-widget-bw-downloads .bw-dl-table td.bw-dl-c-ver,
    .elementor-widget-bw-downloads .bw-dl-table td.bw-dl-c-dls {
        display: inline-block;
        margin: 0 12px 0 0;
        font-size: 12px;
        color: var(--bw-body);
        white-space: nowrap;
    }

    .elementor-widget-bw-downloads .bw-dl-table td[data-label]::before {
        content: attr(data-label) " ";
        margin-right: 3px;
        font: 700 9px/1 'Open Sans', Arial, sans-serif;
        letter-spacing: .9px;
        text-transform: uppercase;
        color: var(--bw-mute);
    }

    /* full-width tap target rather than a pill hidden off the right edge */
    .elementor-widget-bw-downloads .bw-dl-table td.bw-dl-c-btn {
        margin-top: 12px;
    }

    .elementor-widget-bw-downloads .bw-dl-table td.bw-dl-c-btn .bw-dl-btn {
        display: block;
        box-sizing: border-box;
        width: 100%;
        max-width: 100%;
        margin: 0;          /* clears the cards-layout indent */
        min-height: 42px;
        padding: 0;
        line-height: 38px;  /* 42 less the 2px rule top and bottom */
        text-align: center;
    }

    /* the toolbar controls each take a full line rather than sharing one */
    .elementor-widget-bw-downloads .bw-dl-select {
        width: 100%;
    }

    /* the result count reads as a caption under the controls instead of a
       stray right-aligned fragment on its own line */
    .elementor-widget-bw-downloads .bw-dl-results {
        display: block;
        width: 100%;
        margin-top: -2px;
        text-align: left;
    }
}

.elementor-widget-bw-downloads .bw-dl-empty {
    margin: 0;
    font: 400 14px/1.6 'Open Sans', Arial, sans-serif;
    color: var(--bw-mute);
}

/* --------------------------------------------------------- responsive --- */
@media (max-width: 1024px) {
    .elementor-widget-bw-downloads .bw-dl {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 767px) {
    .elementor-widget-bw-downloads .bw-dl {
        grid-template-columns: minmax(0, 1fr);
    }
    .elementor-widget-bw-downloads .bw-dl-row {
        flex-wrap: wrap;
    }
    /* Cards layout only: line the button up under the title, past the icon.
       Unscoped, this also hit the table layout's width:100% button and pushed
       it 48px off the right edge of the card. */
    .elementor-widget-bw-downloads .bw-dl-row .bw-dl-btn {
        margin-left: 48px;
    }
}
