:root {
    --kdv-ballot-riksdag: #E2CE8F;
    --kdv-ballot-kommun: #F2EFF9;
    --kdv-ballot-region: #AACEE0;
    --kdv-banner-bg: #F8F8F8;
    --kdv-text: #111111;
    --kdv-muted: #676767;
    --kdv-box: #F1F1F1;
}

.kdv-site-bottom,
.kdv-site-bottom * { box-sizing: border-box; }

.kdv-site-bottom {
    position: relative;
    z-index: 2;
    width: 100%;
    margin: 0;
    padding: 0;
    background: var(--kdv-banner-bg);
    color: var(--kdv-text);
    font-family: inherit;
    overflow: visible;
    border-top: 1px solid rgba(0,0,0,.055);
}

/* Om sajten redan har det vita bandet med "Lyssna på startsidan" läggs
 * KD Valsedel in i SAMMA band. Vi skapar då ingen extra höjd alls. */
.kdv-host-band { position: relative !important; overflow: visible !important; }
.kdv-site-bottom.kdv-site-bottom--embedded {
    position: absolute;
    inset: 0;
    z-index: 1;
    background: transparent;
    border: 0;
    pointer-events: none;
}
.kdv-site-bottom.kdv-site-bottom--embedded .kdv-ballot-trigger { pointer-events: auto; }

.kdv-site-bottom__inner {
    position: relative;
    width: min(1320px, calc(100% - 40px));
    height: 72px;
    min-height: 72px;
    margin: 0 auto;
    padding: 0;
    display: grid;
    grid-template-columns: 170px minmax(590px, 1fr) 190px;
    gap: 20px;
    align-items: center;
    overflow: visible;
}
.kdv-site-bottom--embedded .kdv-site-bottom__inner {
    position: absolute;
    left: 50%;
    bottom: 0;
    height: 64px;
    min-height: 64px;
    transform: translateX(-50%);
}
.kdv-site-bottom--embedded .kdv-mark { transform: translateY(-15px) scale(.82); transform-origin:left center; }
.kdv-site-bottom--embedded .kdv-candidate-links__lead { font-size:clamp(15px,1vw,18px); }
.kdv-site-bottom--embedded .kdv-candidate-links__nav { font-size:clamp(12px,.82vw,14px); }
.kdv-site-bottom--embedded .kdv-countdown { transform:scale(.90); transform-origin:right center; }

.kdv-mark {
    position: relative;
    width: 165px;
    height: 94px;
    transform: translateY(-12px);
    overflow: hidden;
    isolation: isolate;
}
.kdv-paper {
    position: absolute;
    width: 53px;
    height: 86px;
    border-radius: 1px;
    box-shadow: 0 1px 2px rgba(0,0,0,.04);
    transform-origin: 50% 100%;
}
.kdv-paper--yellow { left: 10px; top: 23px; background: var(--kdv-ballot-riksdag); transform: rotate(-6deg); z-index: 1; }
.kdv-paper--white  { left: 49px; top: 7px;  background: var(--kdv-ballot-kommun);  transform: rotate(-7deg); z-index: 2; }
.kdv-paper--blue   { left: 89px; top: 13px; background: var(--kdv-ballot-region);  transform: rotate(-6deg); z-index: 3; }
.kdv-mark strong {
    position: absolute;
    left: 27px;
    top: 55px;
    z-index: 4;
    white-space: nowrap;
    font-size: 22px;
    line-height: 1;
    font-weight: 900;
    letter-spacing: -.04em;
    color: #000;
}

.kdv-candidate-links {
    min-width: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: nowrap;
    gap: 10px;
    white-space: nowrap;
}
.kdv-candidate-links__lead {
    margin: 0;
    font-size: clamp(17px, 1.2vw, 21px);
    line-height: 1.1;
    font-weight: 500;
}
.kdv-lead-separator,
.kdv-separator { color: #777; font-weight: 400; }
.kdv-candidate-links__nav {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: nowrap;
    gap: 8px;
    font-size: clamp(13px, .92vw, 15px);
    line-height: 1.15;
    font-weight: 700;
}
.kdv-ballot-trigger {
    color: #111;
    text-decoration: none;
    border: 0;
    border-bottom: 1px solid transparent;
    background: transparent;
    padding: 2px 0;
    margin: 0;
    font: inherit;
    font-weight: inherit;
    line-height: inherit;
    cursor: pointer;
}
.kdv-ballot-trigger:hover,
.kdv-ballot-trigger:focus-visible { border-bottom-color: currentColor; outline: none; }
.kdv-link-disabled { color: #929292; cursor: default; }

.kdv-countdown { width: 204px; justify-self: end; align-self: center; }
.kdv-countdown__title {
    margin: 0 0 3px;
    text-align: center;
    font-size: 9px;
    line-height: 1;
    font-weight: 700;
    letter-spacing: .09em;
    color: #555;
}
.kdv-countdown__grid { display: grid; grid-template-columns: repeat(4,1fr); gap: 4px; }
.kdv-time-unit { text-align: center; min-width: 0; }
.kdv-time-unit__value {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 35px;
    padding: 1px 2px 0;
    border-radius: 3px;
    background: #1f619e;
    color: #fff;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 23px;
    font-weight: 800;
    line-height: 1;
    font-variant-numeric: tabular-nums;
}
.kdv-time-unit__label { display: block; margin-top: 3px; color: #555; font-family: Arial, Helvetica, sans-serif; font-size: 8px; font-weight: 700; line-height: 1; letter-spacing: .02em; white-space: nowrap; }
.kdv-countdown__message { padding: 9px 8px; border-radius: 4px; background: #1f619e; color:#fff; text-align:center; font-family:Arial,Helvetica,sans-serif; font-size:16px; font-weight:800; line-height:1.15; }

@media (max-width: 1180px) {
    .kdv-site-bottom__inner { grid-template-columns: 145px minmax(480px,1fr) 170px; gap: 14px; width: min(1120px,calc(100% - 28px)); }
    .kdv-mark { transform: translateY(-10px) scale(.88); transform-origin:left center; width:150px; }
    .kdv-candidate-links { gap:7px; }
    .kdv-candidate-links__nav { gap:6px; }
    .kdv-countdown { width:196px; }
}

@media (max-width: 900px) {
    .kdv-site-bottom.kdv-site-bottom--embedded { position: relative; inset:auto; background:var(--kdv-banner-bg); pointer-events:auto; }
    .kdv-site-bottom--embedded .kdv-site-bottom__inner { position:relative; left:auto; bottom:auto; transform:none; }
    .kdv-site-bottom__inner { width:calc(100% - 28px); height:auto; min-height:0; padding:14px 0; grid-template-columns:120px 1fr; gap:12px 18px; }
    .kdv-mark { grid-row:1 / span 2; transform:translateY(-10px) scale(.74); transform-origin:left top; width:125px; }
    .kdv-candidate-links { justify-content:flex-start; flex-wrap:wrap; white-space:normal; }
    .kdv-candidate-links__lead { font-size:18px; }
    .kdv-lead-separator { display:none; }
    .kdv-candidate-links__nav { flex-wrap:wrap; justify-content:flex-start; font-size:14px; }
    .kdv-countdown { width:240px; justify-self:start; }
}

@media (max-width: 620px) {
    .kdv-site-bottom__inner { display:block; padding:16px 0 18px; }
    .kdv-mark { width:150px; height:74px; margin:0 auto 4px; transform:translateY(-12px) scale(.78); transform-origin:center top; }
    .kdv-candidate-links { display:block; text-align:center; }
    .kdv-candidate-links__lead { margin-bottom:8px; }
    .kdv-candidate-links__nav { justify-content:center; gap:6px 8px; }
    .kdv-countdown { width:min(280px,100%); margin:14px auto 0; }
    .kdv-time-unit__value { min-height:42px; font-size:27px; }
    .kdv-time-unit__label { font-size:9px; }
}

/* Valsedelsmodal */
body.kdv-modal-open { overflow:hidden; }
.kdv-ballot-modal,
.kdv-ballot-modal * { box-sizing:border-box; }
.kdv-ballot-modal[hidden] { display:none !important; }
.kdv-ballot-modal {
    position:fixed;
    inset:0;
    z-index:999999;
    display:grid;
    place-items:center;
    padding:22px 16px;
    font-family:Arial,Helvetica,sans-serif;
}
.kdv-ballot-modal__backdrop { position:absolute; inset:0; background:rgba(12,18,27,.62); opacity:0; transition:opacity .24s ease; }
.kdv-ballot-modal__dialog {
    position:relative;
    width:min(700px,calc(100vw - 32px));
    max-height:92vh;
    overflow:auto;
    overscroll-behavior:contain;
    transform:translateY(72vh) scale(.985);
    opacity:0;
    transition:transform .38s cubic-bezier(.18,.86,.24,1),opacity .22s ease;
    outline:none;
    scrollbar-gutter:stable;
    scrollbar-width:thin;
    scrollbar-color:#7f7f7f rgba(255,255,255,.34);
}
.kdv-ballot-modal__dialog::-webkit-scrollbar { width:8px; }
.kdv-ballot-modal__dialog::-webkit-scrollbar-track { background:rgba(255,255,255,.34); border-radius:999px; }
.kdv-ballot-modal__dialog::-webkit-scrollbar-thumb { background:#7f7f7f; border:2px solid transparent; background-clip:padding-box; border-radius:999px; }
.kdv-ballot-modal__dialog::-webkit-scrollbar-thumb:hover { background:#5f5f5f; border:2px solid transparent; background-clip:padding-box; }
.kdv-ballot-modal.kdv-ballot-modal--open .kdv-ballot-modal__backdrop { opacity:1; }
.kdv-ballot-modal.kdv-ballot-modal--open .kdv-ballot-modal__dialog { transform:translateY(0) scale(1); opacity:1; }
.kdv-ballot-modal__close {
    position:sticky;
    top:7px;
    z-index:6;
    float:right;
    width:42px;
    height:42px;
    margin:7px 7px -49px 0;
    border:1px solid #161616;
    border-radius:50%;
    background:rgba(255,255,255,.95);
    color:#111;
    font:400 31px/36px Arial,Helvetica,sans-serif;
    text-align:center;
    cursor:pointer;
    box-shadow:3px 4px 9px rgba(0,0,0,.16);
}
.kdv-ballot-modal__close:hover,
.kdv-ballot-modal__close:focus-visible { background:#fff; outline:3px solid rgba(0,94,161,.28); outline-offset:2px; }
.kdv-ballot-panel { padding-top:2px; }
.kdv-ballot-multi-note {
    width:min(630px,calc(100% - 38px));
    margin:4px auto 10px;
    padding:7px 10px;
    border-radius:3px;
    background:rgba(0,0,0,.74);
    color:#fff;
    text-align:center;
    font-size:12px;
    line-height:1.3;
    font-weight:700;
}
.kdv-ballot-paper + .kdv-ballot-paper { margin-top:34px; }
.kdv-ballot-picker { display:block; margin:0 auto 9px; width:min(610px,calc(100% - 38px)); color:#fff; font-size:13px; font-weight:700; }
.kdv-ballot-picker select { width:100%; margin-top:4px; min-height:36px; border:1px solid rgba(255,255,255,.8); border-radius:3px; background:#fff; color:#111; padding:4px 8px; }

.kdv-ballot-paper {
    --kdv-paper-bg:#fffefb;
    position:relative;
    width:min(630px,calc(100% - 38px));
    margin:8px auto 24px;
    padding:30px 54px 30px;
    background:var(--kdv-paper-bg);
    color:#101010;
    border:1px solid #181818;
    border-radius:1px;
    box-shadow:12px 15px 24px rgba(0,0,0,.24),3px 4px 0 rgba(0,0,0,.055);
}
.kdv-ballot-paper--kf { --kdv-paper-bg:#ffffff; }
.kdv-ballot-paper--rf { --kdv-paper-bg:#c4e7f2; }
.kdv-ballot-paper--rd { --kdv-paper-bg:#f9f7cd; }
.kdv-ballot-paper__election {
    margin:0 0 22px;
    text-align:center;
    font-family:'Arial Narrow','Liberation Sans Narrow',Arial,sans-serif;
    font-size:25px;
    line-height:1;
    letter-spacing:.035em;
    font-weight:800;
}
.kdv-ballot-paper__party-row { display:block; margin:0 0 30px; }
.kdv-ballot-kdmark { display:none !important; }
.kdv-ballot-party-name {
    display:block;
    width:100%;
    margin:0 0 32px;
    padding:0 8px;
    color:#005EA1;
    text-align:center;
    font-family:'Arial Narrow','Liberation Sans Narrow',Arial,Helvetica,sans-serif;
    font-size:clamp(23px,3.8vw,29px);
    line-height:1;
    letter-spacing:-.02em;
    font-weight:900;
    white-space:normal;
    overflow-wrap:anywhere;
}
.kdv-ballot-candidates { list-style:none; margin:0; padding:0; }
.kdv-ballot-candidate { display:grid; grid-template-columns:18px 28px minmax(0,1fr); gap:8px; align-items:start; margin:0 0 4px; font-size:14.5px; line-height:1.18; }
.kdv-ballot-box { display:block; width:17px; height:17px; border:1.2px solid #383838; background:rgba(255,255,255,.18); }
.kdv-ballot-order { text-align:right; font-variant-numeric:tabular-nums; }
.kdv-ballot-candidate__text em { font-size:.88em; font-style:normal; font-weight:700; }
.kdv-ballot-candidate--invalid { opacity:.58; }
.kdv-ballot-no-candidates { margin:42px 0; padding:14px; border:1px solid rgba(0,0,0,.18); background:rgba(255,255,255,.35); font-size:14px; line-height:1.4; }
.kdv-ballot-paper__footer { margin-top:44px; text-align:center; font-size:17px; }
.kdv-ballot-paper__footer strong { display:block; margin-bottom:7px; font-size:18px; }
.kdv-ballot-paper__footer div { display:flex; justify-content:center; gap:40px; font-size:26px; font-variant-numeric:tabular-nums; }
.kdv-ballot-source { width:min(630px,calc(100% - 38px)); margin:-12px auto 4px; padding:8px 10px; border-radius:3px; background:rgba(0,0,0,.82); color:#fff; text-align:center; font-size:12px; line-height:1.35; }
.kdv-ballot-source a { color:#fff; text-decoration:underline; }
.kdv-ballot-empty { width:min(630px,calc(100% - 38px)); margin:42px auto; padding:24px; background:#fff; border:1px solid #111; box-shadow:10px 12px 20px rgba(0,0,0,.2); }

@media (max-width:620px) {
    .kdv-ballot-modal { padding:10px 5px; }
    .kdv-ballot-modal__dialog { width:calc(100vw - 10px); max-height:96vh; }
    .kdv-ballot-paper { width:calc(100% - 12px); padding:27px 24px 26px; }
    .kdv-ballot-paper__election { font-size:21px; margin-bottom:19px; }
    .kdv-ballot-paper__party-row { margin-bottom:24px; }
    .kdv-ballot-party-name { margin-bottom:26px; padding:0; font-size:clamp(21px,7vw,27px); white-space:normal; }
    .kdv-ballot-candidate { grid-template-columns:16px 25px minmax(0,1fr); gap:6px; font-size:12.7px; }
    .kdv-ballot-box { width:15px; height:15px; }
    .kdv-ballot-paper__footer { margin-top:34px; }
    .kdv-ballot-source { width:calc(100% - 12px); }
}

@media (prefers-reduced-motion:reduce) {
    .kdv-ballot-modal__backdrop,
    .kdv-ballot-modal__dialog { transition:none !important; }
}
.kdv-ballot-modal .screen-reader-text {
    position:absolute !important;
    width:1px !important;
    height:1px !important;
    padding:0 !important;
    margin:-1px !important;
    overflow:hidden !important;
    clip:rect(0,0,0,0) !important;
    white-space:nowrap !important;
    border:0 !important;
}
.kdv-host-band .kdv-listen-control {
    position: relative;
    z-index: 8;
}
