/* ═══════════════════════════════════════════════════
   EVCheck — evc-style.css v3.1
   Designed for non-technical users.
   Big cards. Simple language. Traffic-light colours.
═══════════════════════════════════════════════════ */

:root {
    --g:  #00C896;  --gd: #009E78;  --gl: #E6FAF5;
    --r:  #EF4444;  --rl: #FEF2F2;  --rb: #FECACA;
    --a:  #F59E0B;  --al: #FFFBEB;  --ab: #FDE68A;
    --dk: #111827;  --tx: #374151;  --mu: #6B7280;
    --bd: #E0E6E4;  --bg: #F6F8F7;  --wh: #fff;
    --fn: 'DM Sans',-apple-system,sans-serif;
    --fm: 'JetBrains Mono','Fira Mono',monospace;
    --rd: 14px;  --rdl: 20px;
    --sh: 0 2px 12px rgba(0,0,0,.07);
    --shl: 0 8px 32px rgba(0,0,0,.11);
}

/* ── Wrap ── */
.evc-wrap { max-width: 680px; margin: 0 auto; font-family: var(--fn); color: var(--tx); }

/* ── Input card ── */
.evc-card {
    background: var(--wh);
    border: 1px solid var(--bd);
    border-radius: var(--rdl);
    padding: 28px;
    box-shadow: var(--sh);
}

/* ── QR button ── */
.evc-qr-btn {
    width: 100%; display: flex; align-items: center; justify-content: center; gap: 10px;
    background: var(--g); color: #fff; border: none; border-radius: var(--rd);
    padding: 16px 24px; font-family: var(--fn); font-size: 15px; font-weight: 700;
    cursor: pointer; transition: background .18s, transform .12s; margin-bottom: 22px; letter-spacing: .01em;
}
.evc-qr-btn:hover  { background: var(--gd); }
.evc-qr-btn:active { transform: scale(.99); }
.evc-qr-btn:focus-visible { outline: 3px solid var(--g); outline-offset: 2px; }

/* ── Label ── */
.evc-label {
    display: block; font-size: 11px; font-weight: 700; color: var(--tx);
    text-transform: uppercase; letter-spacing: .08em; margin-bottom: 8px;
}

/* ── Input ── */
.evc-input-wrap { position: relative; display: flex; align-items: center; margin-bottom: 8px; }
.evc-input {
    width: 100%; padding: 14px 44px 14px 16px;
    border: 2px solid var(--bd); border-radius: var(--rd);
    font-family: var(--fm); font-size: 18px; font-weight: 600;
    color: var(--dk); letter-spacing: 2px; text-transform: uppercase;
    background: #FAFBFA; outline: none; caret-color: var(--g);
    transition: border-color .2s, box-shadow .2s; -webkit-appearance: none;
}
.evc-input::placeholder { color: #C9D0CE; font-size: 13px; letter-spacing: 1px; font-weight: 400; }
.evc-input:focus          { border-color: var(--g); box-shadow: 0 0 0 3px rgba(0,200,150,.12); background: #fff; }
.evc-input.is-valid       { border-color: var(--g); background: var(--gl); }
.evc-clear-btn {
    position: absolute; right: 12px; top: 50%; transform: translateY(-50%);
    background: #E0E6E4; border: none; border-radius: 50%; width: 24px; height: 24px;
    display: flex; align-items: center; justify-content: center; cursor: pointer;
    color: var(--mu); transition: background .15s, color .15s; padding: 0;
}
.evc-clear-btn:hover { background: #C9D0CE; color: var(--dk); }

/* ── Meta row ── */
.evc-input-meta { display: flex; justify-content: space-between; align-items: center; margin-bottom: 6px; }
.evc-counter { font-size: 12px; color: var(--mu); font-family: var(--fm); transition: color .2s; }
.evc-counter.is-complete { color: var(--g); font-weight: 700; }
.evc-paste-btn {
    display: flex; align-items: center; gap: 5px; background: none;
    border: 1px solid var(--bd); border-radius: 6px; padding: 5px 12px;
    font-family: var(--fn); font-size: 12px; font-weight: 600; color: var(--mu);
    cursor: pointer; transition: all .15s;
}
.evc-paste-btn:hover { border-color: var(--g); color: var(--g); }
.evc-input-hint { font-size: 12px; color: #9CA3AF; margin: 0 0 16px; line-height: 1.5; }

/* ── Examples ── */
.evc-examples {
    display: flex; align-items: center; flex-wrap: wrap; gap: 8px;
    margin-bottom: 20px; padding-top: 14px; border-top: 1px solid var(--bd);
}
.evc-examples-label { font-size: 12px; color: var(--mu); font-weight: 500; }
.evc-ex-btn {
    font-family: var(--fm); font-size: 11px; font-weight: 600; color: var(--gd);
    background: var(--gl); border: 1px solid rgba(0,200,150,.25);
    padding: 5px 12px; border-radius: 6px; cursor: pointer; transition: background .15s; letter-spacing: .5px;
}
.evc-ex-btn:hover { background: #C2F0E4; border-color: var(--g); }

/* ── Decode button ── */
.evc-decode-btn {
    width: 100%; padding: 17px 24px; background: var(--dk); color: #fff;
    border: none; border-radius: var(--rd); font-family: var(--fn);
    font-size: 15px; font-weight: 700; cursor: pointer;
    transition: background .18s, opacity .18s, transform .12s;
    letter-spacing: .04em; text-transform: uppercase;
    display: flex; align-items: center; justify-content: center; gap: 8px;
}
.evc-decode-btn:disabled { background: #D1D5DB; color: #9CA3AF; cursor: not-allowed; }
.evc-decode-btn:not(:disabled):hover  { background: #1F2937; }
.evc-decode-btn:not(:disabled):active { transform: scale(.99); }

@keyframes evc-spin { to { transform: rotate(360deg); } }
.evc-spinner { animation: evc-spin .8s linear infinite; }

/* ══════════════════════════════════════════════════════
   RESULTS — Plain-language, non-technical layout
══════════════════════════════════════════════════════ */
@keyframes evc-in { from { opacity:0; transform:translateY(-8px); } to { opacity:1; transform:translateY(0); } }
.evc-results { margin-top: 16px; animation: evc-in .28s ease; }

/* ── Overall Status Banner — the FIRST thing user sees ── */
.evc-status-banner {
    border-radius: var(--rdl) var(--rdl) 0 0;
    padding: 24px 28px;
    display: flex;
    align-items: center;
    gap: 18px;
}
.evc-status-banner.safe    { background: #064E3B; }
.evc-status-banner.warning { background: #78350F; }
.evc-status-banner.danger  { background: #7F1D1D; }

.evc-status-icon { font-size: 44px; flex-shrink: 0; line-height: 1; }
.evc-status-headline { font-size: 22px; font-weight: 700; color: #fff; margin: 0 0 4px; line-height: 1.2; }
.evc-status-sub      { font-size: 14px; color: rgba(255,255,255,.75); margin: 0; line-height: 1.5; }

/* ── Main info cards ── */
.evc-info-body {
    background: var(--wh);
    border: 1px solid var(--bd);
    border-top: none;
    border-radius: 0 0 var(--rdl) var(--rdl);
    overflow: hidden;
}

/* Big 3 cards — things users care most about */
.evc-big3 {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    border-bottom: 1px solid var(--bd);
}
.evc-big-card {
    padding: 20px;
    border-right: 1px solid var(--bd);
    text-align: center;
}
.evc-big-card:last-child { border-right: none; }
.evc-big-emoji  { font-size: 32px; margin-bottom: 6px; line-height: 1; }
.evc-big-label  { font-size: 10px; font-weight: 700; color: var(--mu); text-transform: uppercase; letter-spacing: .07em; margin-bottom: 5px; }
.evc-big-value  { font-size: 17px; font-weight: 700; color: var(--dk); line-height: 1.25; }
.evc-big-sub    { font-size: 12px; color: var(--mu); margin-top: 3px; line-height: 1.4; }
.evc-big-card.bad  .evc-big-value { color: var(--r); }
.evc-big-card.warn .evc-big-value { color: var(--a); }
.evc-big-card.good .evc-big-value { color: var(--gd); }

/* What to do section */
.evc-todo {
    padding: 20px 24px;
    border-bottom: 1px solid var(--bd);
}
.evc-todo-title {
    font-size: 12px; font-weight: 700; color: var(--mu);
    text-transform: uppercase; letter-spacing: .07em; margin-bottom: 12px;
}
.evc-todo-list { display: flex; flex-direction: column; gap: 10px; }
.evc-todo-item {
    display: flex; align-items: flex-start; gap: 12px;
    background: var(--bg); border-radius: 10px; padding: 13px 14px;
}
.evc-todo-item.urgent { background: var(--rl); border: 1px solid var(--rb); }
.evc-todo-item.caution { background: var(--al); border: 1px solid var(--ab); }
.evc-todo-item.ok { background: var(--gl); border: 1px solid #A7F3D0; }
.evc-todo-dot  { font-size: 20px; flex-shrink: 0; margin-top: 1px; }
.evc-todo-text { font-size: 14px; color: var(--tx); line-height: 1.6; }
.evc-todo-text strong { color: var(--dk); }
.evc-todo-text a { color: var(--gd); font-weight: 600; }
.evc-todo-text a.red { color: var(--r); }

/* Full details — collapsed by default, tap to expand */
.evc-details-toggle {
    width: 100%; background: none; border: none; cursor: pointer;
    padding: 14px 24px; display: flex; align-items: center; justify-content: space-between;
    font-family: var(--fn); font-size: 13px; font-weight: 600; color: var(--mu);
    border-bottom: 1px solid var(--bd); transition: background .15s;
}
.evc-details-toggle:hover { background: var(--bg); color: var(--dk); }
.evc-details-toggle svg { transition: transform .2s; flex-shrink: 0; }
.evc-details-toggle.open svg { transform: rotate(180deg); }

.evc-details-body { display: none; padding: 20px 24px; }
.evc-details-body.open { display: block; }

/* Technical grid — 3 cols, smaller, for tech-savvy users who expand */
.evc-tech-grid {
    display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; margin-bottom: 16px;
}
.evc-tech-card {
    background: var(--bg); border: 1px solid var(--bd);
    border-radius: 8px; padding: 11px 12px;
}
.evc-tech-label { font-size: 9px; font-weight: 700; color: #9CA3AF; text-transform: uppercase; letter-spacing: .06em; margin-bottom: 3px; }
.evc-tech-value { font-size: 13px; font-weight: 700; color: var(--dk); line-height: 1.3; }
.evc-tech-sub   { font-size: 11px; color: var(--mu); margin-top: 2px; font-family: var(--fm); }

/* Code bar — in details section */
.evc-code-bar {
    background: var(--dk); border-radius: 8px;
    padding: 14px 18px; font-family: var(--fm);
    font-size: 16px; font-weight: 700; letter-spacing: 3px;
    text-align: center; overflow-x: auto; white-space: nowrap;
    -webkit-overflow-scrolling: touch; margin-bottom: 14px;
}
.evc-legend {
    display: flex; flex-wrap: wrap; gap: 8px 16px; margin-bottom: 16px;
}
.evc-legend-item { display: flex; align-items: center; gap: 5px; font-size: 11px; color: var(--mu); }
.evc-legend-dot  { width: 8px; height: 8px; border-radius: 2px; flex-shrink: 0; }

/* CTA row */
.evc-cta-row {
    display: flex; flex-wrap: wrap; gap: 8px;
    padding: 16px 24px; border-top: 1px solid var(--bd);
}
.evc-cta-link {
    display: inline-flex; align-items: center; gap: 5px;
    font-family: var(--fn); font-size: 13px; font-weight: 600;
    padding: 9px 16px; border-radius: 7px; text-decoration: none;
    transition: all .15s; border: 1px solid var(--bd); color: var(--tx); background: var(--bg);
}
.evc-cta-link:hover { border-color: var(--g); color: var(--gd); }
.evc-cta-link.primary { background: var(--g); border-color: var(--g); color: #fff; }
.evc-cta-link.primary:hover { background: var(--gd); }
.evc-cta-link.fire { background: var(--r); border-color: var(--r); color: #fff; }
.evc-cta-link.fire:hover { background: #DC2626; }

/* Error */
.evc-error-panel {
    background: var(--rl); border: 1px solid var(--rb); border-radius: var(--rd);
    padding: 20px; text-align: center; font-size: 14px; color: var(--r); font-weight: 600;
}

/* ── QR Overlay ── */
.evc-qr-overlay {
    display: none; position: fixed; inset: 0;
    background: rgba(0,0,0,.65); z-index: 99999;
    align-items: center; justify-content: center; padding: 16px;
}
.evc-qr-overlay.is-open { display: flex; }
.evc-qr-box {
    background: var(--wh); border-radius: var(--rdl);
    width: 100%; max-width: 420px; overflow: hidden; box-shadow: var(--shl);
}
.evc-qr-header {
    display: flex; justify-content: space-between; align-items: center;
    padding: 16px 20px; border-bottom: 1px solid var(--bd);
}
.evc-qr-title  { font-size: 15px; font-weight: 700; color: var(--dk); }
.evc-qr-close  {
    background: #F2F5F4; border: none; border-radius: 6px;
    width: 30px; height: 30px; cursor: pointer; font-size: 14px;
    color: var(--mu); display: flex; align-items: center; justify-content: center;
    transition: background .15s;
}
.evc-qr-close:hover { background: #E0E6E4; color: var(--dk); }
#evcQrReader { width: 100% !important; }
#evcQrReader video { border-radius: 0 !important; }
.evc-qr-hint { padding: 12px 16px; font-size: 13px; text-align: center; color: var(--mu); margin: 0; background: #FAFBFA; }

/* ── Manufacturer Table ── */
.evc-mfr-wrap { font-family: var(--fn); }
.evc-mfr-search-row { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 14px; flex-wrap: wrap; }
.evc-mfr-search-box { flex: 1; min-width: 200px; position: relative; display: flex; align-items: center; }
.evc-mfr-search-box svg { position: absolute; left: 14px; pointer-events: none; }
.evc-mfr-search-box input {
    width: 100%; padding: 11px 14px 11px 40px;
    border: 2px solid var(--bd); border-radius: 10px;
    font-family: var(--fn); font-size: 14px; color: var(--dk);
    outline: none; transition: border-color .2s; background: var(--wh);
}
.evc-mfr-search-box input:focus { border-color: var(--g); }
.evc-mfr-count { font-size: 13px; color: var(--mu); white-space: nowrap; }
.evc-mfr-table-wrap { overflow-x: auto; border-radius: var(--rd); border: 1px solid var(--bd); }
.evc-mfr-table { width: 100%; border-collapse: collapse; font-size: 13px; }
.evc-mfr-table thead tr { background: var(--dk); }
.evc-mfr-table thead th { padding: 12px 16px; text-align: left; font-size: 10px; font-weight: 700; color: #9CA3AF; text-transform: uppercase; letter-spacing: .08em; white-space: nowrap; }
.evc-mfr-table tbody tr { border-bottom: 1px solid #F2F5F4; transition: background .12s; }
.evc-mfr-table tbody tr:hover { background: #F9FAFB; }
.evc-mfr-table tbody td { padding: 11px 16px; color: var(--tx); vertical-align: top; }
.evc-mfr-table tbody td:first-child { font-family: var(--fm); font-weight: 700; font-size: 14px; color: var(--dk); }
.evc-mfr-tag { display: inline-block; font-size: 10px; font-weight: 700; padding: 2px 8px; border-radius: 99px; background: var(--gl); color: var(--gd); }
.evc-mfr-note { font-size: 12px; color: #9CA3AF; margin-top: 12px; line-height: 1.6; }

/* ── Responsive ── */
@media (max-width: 600px) {
    .evc-card { padding: 18px 14px; }
    .evc-input { font-size: 15px; letter-spacing: 1.5px; }
    .evc-big3  { grid-template-columns: 1fr 1fr; }
    .evc-big3 .evc-big-card:nth-child(3) { grid-column: 1/-1; border-right: none; border-top: 1px solid var(--bd); }
    .evc-tech-grid { grid-template-columns: 1fr 1fr; }
    .evc-status-headline { font-size: 18px; }
    .evc-status-icon { font-size: 36px; }
    .evc-status-banner { padding: 18px 18px; gap: 12px; }
    .evc-code-bar { font-size: 13px; letter-spacing: 1.5px; }
    .evc-cta-row { padding: 14px 16px; }
    .evc-todo { padding: 16px; }
    .evc-details-body { padding: 16px; }
    .evc-details-toggle { padding: 12px 16px; }
}
@media (max-width: 380px) {
    .evc-big3 { grid-template-columns: 1fr; }
    .evc-big3 .evc-big-card { border-right: none; border-bottom: 1px solid var(--bd); }
    .evc-tech-grid { grid-template-columns: 1fr; }
}

/* ════════════════════════════════════════════════════
   RESULTS — Human-first layout v3.1
   Priority: Banner → 3 Facts → Actions → Links → Tech
════════════════════════════════════════════════════ */

/* Slide-in animation */
@keyframes evc-in { from { opacity:0; transform:translateY(-10px); } to { opacity:1; transform:translateY(0); } }
.evc-results { margin-top: 16px; animation: evc-in .3s ease; }

/* ── Status banner — first thing user sees ── */
.evc-banner {
    border-radius: 16px 16px 0 0;
    padding: 22px 24px;
    display: flex;
    align-items: center;
    gap: 16px;
}
.evc-banner-icon     { font-size: 40px; flex-shrink: 0; line-height: 1; }
.evc-banner-headline { font-size: 20px; font-weight: 700; color: #fff; margin: 0 0 4px; line-height: 1.2; }
.evc-banner-sub      { font-size: 14px; color: rgba(255,255,255,.8); margin: 0; line-height: 1.55; }

/* ── White body below banner ── */
.evc-result-body {
    background: #fff;
    border: 1px solid #E0E6E4;
    border-top: none;
    border-radius: 0 0 16px 16px;
    overflow: hidden;
}

/* ── Three key facts ── */
.evc-facts {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    border-bottom: 1px solid #E0E6E4;
}
.evc-fact {
    padding: 18px 16px;
    text-align: center;
    border-right: 1px solid #E0E6E4;
}
.evc-fact:last-child { border-right: none; }

.evc-fact-emoji { font-size: 28px; margin-bottom: 6px; line-height: 1; }
.evc-fact-label { font-size: 10px; font-weight: 700; color: #9CA3AF; text-transform: uppercase; letter-spacing: .07em; margin-bottom: 5px; }
.evc-fact-value { font-size: 15px; font-weight: 700; color: #111827; line-height: 1.25; }
.evc-fact-sub   { font-size: 12px; color: #6B7280; margin-top: 4px; line-height: 1.4; }

/* Colour states */
.evc-fact.good .evc-fact-value { color: #059669; }
.evc-fact.warn .evc-fact-value { color: #D97706; }
.evc-fact.bad  .evc-fact-value { color: #DC2626; }

/* ── What to do section ── */
.evc-actions {
    padding: 20px 20px 8px;
    border-bottom: 1px solid #E0E6E4;
}
.evc-actions-title {
    font-size: 11px; font-weight: 700; color: #9CA3AF;
    text-transform: uppercase; letter-spacing: .08em; margin-bottom: 12px;
}
.evc-action-item {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    border-radius: 10px;
    padding: 13px 14px;
    margin-bottom: 10px;
    border: 1px solid transparent;
}
/* Colour-coded action types */
.evc-action-item.urgent  { background: #FEF2F2; border-color: #FECACA; }
.evc-action-item.caution { background: #FFFBEB; border-color: #FDE68A; }
.evc-action-item.ok      { background: #F0FDF4; border-color: #BBF7D0; }

.evc-action-icon { font-size: 22px; flex-shrink: 0; margin-top: 1px; line-height: 1; }
.evc-action-text {
    font-size: 14px;
    color: #374151;
    line-height: 1.65;
}
.evc-action-text strong { color: #111827; }
.evc-action-text a      { color: #059669; font-weight: 600; text-decoration: none; }
.evc-action-text a:hover { text-decoration: underline; }
.evc-action-text a.red  { color: #DC2626; }

/* ── Helpful links row ── */
.evc-links {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    padding: 16px 20px;
    border-bottom: 1px solid #E0E6E4;
    background: #FAFBFA;
}
.evc-link-btn {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    font-family: 'DM Sans', sans-serif;
    font-size: 13px;
    font-weight: 600;
    padding: 9px 15px;
    border-radius: 8px;
    text-decoration: none;
    transition: all .15s;
    border: 1px solid #E0E6E4;
    color: #374151;
    background: #fff;
}
.evc-link-btn:hover       { border-color: #00C896; color: #059669; }
.evc-link-btn.highlight   { background: #00C896; border-color: #00C896; color: #fff; }
.evc-link-btn.highlight:hover { background: #009E78; }
.evc-link-btn.red         { background: #EF4444; border-color: #EF4444; color: #fff; }
.evc-link-btn.red:hover   { background: #DC2626; }

/* ── Technical details toggle ── */
.evc-details-wrap { border-top: none; }

.evc-details-btn {
    width: 100%;
    background: none;
    border: none;
    cursor: pointer;
    padding: 14px 20px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    font-family: 'DM Sans', sans-serif;
    font-size: 13px;
    font-weight: 600;
    color: #9CA3AF;
    transition: background .15s, color .15s;
}
.evc-details-btn:hover { background: #F6F8F7; color: #374151; }
.evc-details-btn.open  { color: #374151; }
.evc-details-btn.open svg { transform: rotate(180deg); }
.evc-details-btn svg   { transition: transform .22s; flex-shrink: 0; }

.evc-details-body      { display: none; padding: 0 20px 20px; }
.evc-details-body.open { display: block; }

/* Code bar */
.evc-codebar {
    background: #111827;
    border-radius: 8px;
    padding: 14px 16px;
    font-family: 'JetBrains Mono', monospace;
    font-size: 15px;
    font-weight: 700;
    letter-spacing: 3px;
    text-align: center;
    overflow-x: auto;
    white-space: nowrap;
    margin-bottom: 10px;
    -webkit-overflow-scrolling: touch;
}
/* Colour legend */
.evc-legend-row {
    display: flex;
    flex-wrap: wrap;
    gap: 6px 14px;
    margin-bottom: 14px;
}
.evc-leg-item {
    display: flex;
    align-items: center;
    gap: 5px;
    font-size: 11px;
    color: #9CA3AF;
}
.evc-leg-dot {
    width: 8px;
    height: 8px;
    border-radius: 2px;
    flex-shrink: 0;
}

/* Technical table */
.evc-tech-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 13px;
    border: 1px solid #E0E6E4;
    border-radius: 8px;
    overflow: hidden;
}
.evc-tech-table tr { border-bottom: 1px solid #F2F5F4; }
.evc-tech-table tr:last-child { border-bottom: none; }
.evc-tech-table tr:nth-child(even) { background: #FAFBFA; }
.evc-tech-key {
    padding: 10px 14px;
    color: #6B7280;
    font-weight: 500;
    width: 55%;
    vertical-align: top;
    line-height: 1.5;
}
.evc-tech-val {
    padding: 10px 14px;
    color: #111827;
    font-weight: 600;
    vertical-align: top;
    line-height: 1.5;
}

/* ── Responsive ── */
@media (max-width: 560px) {
    .evc-banner         { padding: 18px 16px; gap: 12px; border-radius: 12px 12px 0 0; }
    .evc-banner-icon    { font-size: 32px; }
    .evc-banner-headline{ font-size: 17px; }
    .evc-banner-sub     { font-size: 13px; }
    .evc-facts          { grid-template-columns: 1fr 1fr; }
    .evc-fact:nth-child(3) { grid-column: 1/-1; border-right: none; border-top: 1px solid #E0E6E4; }
    .evc-actions        { padding: 16px 14px 6px; }
    .evc-action-item    { padding: 11px 12px; }
    .evc-action-text    { font-size: 13px; }
    .evc-links          { padding: 12px 14px; }
    .evc-codebar        { font-size: 12px; letter-spacing: 1.5px; }
    .evc-details-body   { padding: 0 14px 16px; }
    .evc-details-btn    { padding: 13px 14px; }
    .evc-tech-key, .evc-tech-val { padding: 9px 10px; font-size: 12px; }
}
@media (max-width: 360px) {
    .evc-facts { grid-template-columns: 1fr; }
    .evc-fact  { border-right: none; border-bottom: 1px solid #E0E6E4; }
    .evc-fact:nth-child(3) { grid-column: auto; }
}