/* ═══════════════════════════════════════════════════════════════
   Download Box – Frontend (mcdm-cf-*)
   ═══════════════════════════════════════════════════════════════ */
.mcdm-cf-box { margin: 28px 0; border-radius: 6px; overflow: hidden; border: 1px solid #e0e0e0; box-shadow: 0 2px 8px rgba(0,0,0,.08); font-family: inherit; }

/* Header */
.mcdm-cf-header { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 10px; padding: 13px 18px; background: linear-gradient(135deg, #b71c1c 0%, #e53935 100%); color: #fff; }
.mcdm-cf-title { display: flex; align-items: center; gap: 8px; font-size: 14px; font-weight: 700; letter-spacing: .3px; }
.mcdm-cf-count { background: rgba(0,0,0,.25); border-radius: 4px; padding: 2px 9px; font-size: 12px; font-weight: 700; }
.mcdm-cf-filters { display: flex; gap: 8px; flex-wrap: wrap; }
.mcdm-cf-filters select { padding: 5px 10px; border-radius: 4px; border: 1px solid rgba(255,255,255,.3); background: rgba(255,255,255,.15); color: #fff; font-size: 12px; cursor: pointer; outline: none; appearance: none; -webkit-appearance: none; }
.mcdm-cf-filters select option { background: #b71c1c; color: #fff; }

/* Table */
.mcdm-cf-table-wrap { overflow-x: auto; background: #fff; }
.mcdm-cf-table { width: 100%; border-collapse: collapse; font-size: 13px; }
.mcdm-cf-table thead th { padding: 9px 14px; text-align: left; font-size: 11px; text-transform: uppercase; letter-spacing: .5px; font-weight: 700; color: #757575; background: #fafafa; border-bottom: 2px solid #e0e0e0; white-space: nowrap; }
.mcdm-cf-table tbody tr { border-bottom: 1px solid #f5f5f5; transition: background .12s; }
.mcdm-cf-table tbody tr:last-child { border-bottom: none; }
.mcdm-cf-table tbody tr:hover { background: #fff8f8; }
.mcdm-cf-table td { padding: 11px 14px; vertical-align: middle; }

/* Cells */
.mcdm-cf-td-gv { min-width: 90px; }
.mcdm-cf-td-loader { white-space: nowrap; }
.mcdm-cf-gv-tag { display: inline-block; padding: 3px 8px; border-radius: 3px; font-size: 11px; font-weight: 700; background: #fce4ec; color: #c62828; border: 1px solid #f48fb1; white-space: nowrap; margin: 1px; }
.mcdm-cf-loader-tag { display: inline-block; padding: 3px 8px; border-radius: 3px; font-size: 11px; font-weight: 600; border: 1px solid; margin: 1px; line-height: 1.4; }
.mcdm-cf-loader-tag.fabric   { background: #e3f2fd; color: #1565c0; border-color: #90caf9; }
.mcdm-cf-loader-tag.forge    { background: #fff8e1; color: #e65100; border-color: #ffcc80; }
.mcdm-cf-loader-tag.neoforge { background: #fce4ec; color: #ad1457; border-color: #f48fb1; }
.mcdm-cf-loader-tag.quilt    { background: #ede7f6; color: #4527a0; border-color: #ce93d8; }
.mcdm-cf-loader-tag.other    { background: #f5f5f5; color: #616161; border-color: #e0e0e0; }
.mcdm-cf-td-size, .mcdm-cf-td-date { color: #9e9e9e; font-size: 12px; white-space: nowrap; }
.mcdm-cf-dash { color: #bdbdbd; }
.mcdm-cf-no-result { padding: 28px; text-align: center; color: #bdbdbd; font-style: italic; }

/* Download buttons */
.mcdm-cf-td-dl { white-space: nowrap; text-align: right; }
.mcdm-cf-dl-btn-row { display: inline-flex; align-items: center; gap: 5px; padding: 6px 14px; border-radius: 4px; font-size: 12px; font-weight: 700; text-decoration: none !important; background: #e53935; color: #fff !important; transition: background .15s, transform .15s; white-space: nowrap; line-height: 1.3; }
.mcdm-cf-dl-btn-row:hover { background: #b71c1c !important; color: #fff !important; transform: translateY(-1px); }
.mcdm-cf-dl-btn-row.mcdm-cf-dl-mirror { background: #fff; color: #e53935 !important; border: 2px solid #e53935; padding: 4px 12px; }
.mcdm-cf-dl-btn-row.mcdm-cf-dl-mirror:hover { background: #e53935 !important; color: #fff !important; transform: translateY(-1px); }

/* Footer */
.mcdm-cf-dl-footer { display: flex; align-items: center; padding: 10px 18px; border-top: 1px solid #eeeeee; background: #fafafa; border-radius: 0 0 6px 6px; }
.mcdm-cf-dl-hint { font-size: 12px; color: #bdbdbd; }

/* Game version collapse */
.mcdm-gv-fade   { display: none; }
.mcdm-gv-toggle { display: none; }
@media (max-width: 640px) {
    .mcdm-gv-wrap {
        overflow: hidden;
        max-height: 72px;
        transition: max-height .3s ease;
    }
    .mcdm-gv-wrap.open { max-height: 600px; }
    .mcdm-gv-toggle {
        display: flex;
        align-items: center;
        justify-content: center;
        width: 22px;
        height: 18px;
        margin: 3px auto 0;
        background: #fce4ec;
        border: 1px solid #f48fb1;
        border-radius: 4px;
        cursor: pointer;
        color: #e53935;
        padding: 0;
        transition: transform .25s;
    }
    .mcdm-gv-toggle:hover { background: #f8bbd0; }
    .mcdm-gv-toggle.open { transform: rotate(180deg); }
    .mcdm-gv-toggle svg { display: block; }
}

/* Mobile layout */
@media (max-width: 640px) {
    .mcdm-cf-table thead { display: none; }
    .mcdm-cf-table tbody tr {
        display: grid;
        grid-template-columns: 1fr 1fr auto;
        grid-template-rows: auto auto;
        grid-template-areas: "name gv dl" "loader gv dl";
        border-bottom: 1px solid #f5f5f5;
        align-items: center;
    }
    .mcdm-cf-table tbody tr:last-child { border-bottom: none; }
    .mcdm-cf-td-gv     { grid-area: gv; align-self: center; justify-self: center; padding: 6px 8px; text-align: center; }
    .mcdm-cf-td-gv .mcdm-gv-wrap > div { justify-content: center; }
    .mcdm-cf-td-name   { display: block !important; grid-area: name; align-self: end; padding: 8px 8px 2px; font-size: 12px; }
    .mcdm-cf-td-loader { grid-area: loader; align-self: start; padding: 2px 8px 8px; }
    .mcdm-cf-td-size   { display: none !important; }
    .mcdm-cf-td-date   { display: none !important; }
    .mcdm-cf-td-dl     { grid-area: dl; align-self: center; padding: 6px 8px; text-align: right; }
    .mcdm-cf-td-dl > div { flex-direction: column !important; align-items: flex-end !important; gap: 4px !important; }
    .mcdm-cf-dl-btn-row { padding: 5px 10px; font-size: 11px; }
}