/* Skale Cookies – rutan, panelen och shortcodes. Allt under .skc-, färger som CSS-variabler. */
.skc-v{--skc-primary:#1F2A44;--skc-on-primary:#FFF;--skc-heading:#1F2A44;--skc-link:#2457A6;--skc-surface:#EEF2F7;--skc-z:9990;--skc-text:#4F5B6E;--skc-border:color-mix(in srgb,var(--skc-link) 14%,#FFF);--skc-surface-2:color-mix(in srgb,var(--skc-surface) 50%,#FFF);--skc-off:#8094AC}
.skc-v[hidden],.skc-v [hidden]{display:none!important}
.skc-root{box-sizing:border-box;font-family:inherit;font-size:16px;line-height:1.5;color:var(--skc-heading);text-align:left;letter-spacing:normal}
.skc-root *,.skc-root *::before,.skc-root *::after{box-sizing:inherit}
.skc-root p,.skc-root h2,.skc-root h3,.skc-root ul,.skc-root li,.skc-root table{margin:0;padding:0}
.skc-root h2,.skc-root h3{font-family:inherit;color:var(--skc-heading);letter-spacing:normal;text-transform:none;line-height:1.3}
.skc-root svg{display:block;flex:none}
.skc-root :focus-visible{outline:2px solid var(--skc-primary);outline-offset:2px}

/* Knappar: "Bara nödvändiga" och "Godkänn alla" har samma klass och ser exakt likadana ut. */
.skc-v .skc-btn,.skc-v .skc-textbtn,.skc-v .skc-switch,.skc-v .skc-panel__close{appearance:none;margin:0;font-family:inherit;text-transform:none;letter-spacing:normal;text-decoration:none;text-shadow:none;box-shadow:none;cursor:pointer;min-width:0;line-height:1.2}
.skc-v .skc-btn{display:inline-flex;align-items:center;justify-content:center;flex:1 1 0;min-height:48px;height:auto;padding:8px 12px;border:0;border-radius:8px;background:var(--skc-primary);color:var(--skc-on-primary);font-size:15px;font-weight:600;text-align:center}
.skc-v .skc-btn:hover,.skc-v .skc-btn:focus,.skc-v .skc-btn:active{background:color-mix(in srgb,var(--skc-primary) 88%,#000);color:var(--skc-on-primary);border:0}
.skc-v .skc-btn--outline,.skc-v .skc-btn--outline:hover,.skc-v .skc-btn--outline:focus,.skc-v .skc-btn--outline:active{border:1.5px solid var(--skc-primary);background:#FFF;color:var(--skc-primary)}
.skc-v .skc-btn--outline:hover{background:var(--skc-surface-2)}
.skc-v .skc-textbtn{display:inline-flex;align-items:center;gap:8px;min-height:44px;padding:0;border:0;background:transparent;color:var(--skc-link);font-size:14px;font-weight:600}
.skc-v .skc-textbtn:hover,.skc-v .skc-textbtn:focus,.skc-v .skc-textbtn:active{background:transparent;color:var(--skc-heading);border:0}

/* ---------- Rutan ---------- */
.skc-banner{position:fixed;z-index:var(--skc-z);left:24px;bottom:24px;width:440px;max-width:calc(100vw - 48px);max-height:calc(100vh - 48px);overflow:auto;display:flex;flex-direction:column;background:#FFF;border:1px solid var(--skc-border);border-radius:20px;box-shadow:0 16px 48px rgba(20,35,90,.18);opacity:0;transform:translateY(16px);transition:opacity .3s ease,transform .3s ease}
.skc-banner--right{left:auto;right:24px}
.skc-banner--in{opacity:1;transform:none}
.skc-banner__head{display:flex;align-items:center;gap:14px;padding:22px 28px 18px;background:var(--skc-surface-2);border-bottom:1px solid var(--skc-border)}
.skc-banner__icon{display:flex;align-items:center;justify-content:center;flex:none;width:48px;height:48px;border-radius:14px;background:#FFF;border:1px solid color-mix(in srgb,var(--skc-link) 20%,#FFF);color:var(--skc-heading)}
.skc-banner__titles{display:flex;flex-direction:column;gap:2px}
.skc-root .skc-banner__label{font-size:12px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--skc-link)}
.skc-root .skc-banner__title{font-size:20px;font-weight:600}
.skc-banner__body{display:flex;flex-direction:column;gap:16px;padding:20px 28px 12px}
.skc-root .skc-banner__text{font-size:15px;line-height:1.6;color:var(--skc-text)}
.skc-root .skc-banner__points{display:flex;flex-direction:column;gap:10px;list-style:none;font-size:14px;line-height:1.5}
.skc-root .skc-banner__points li{display:flex;align-items:flex-start;gap:10px;color:var(--skc-heading)}
.skc-banner__points svg{color:var(--skc-link)}
.skc-banner__actions{display:flex;gap:12px}
.skc-banner__foot{display:flex;align-items:center;justify-content:space-between;gap:12px}
.skc-banner__customize svg{display:none}
.skc-root .skc-banner__policy,.skc-root .skc-banner__inline-link{color:var(--skc-link);font-size:14px;text-decoration:underline;text-underline-offset:2px}
.skc-root .skc-banner__policy:hover,.skc-root .skc-banner__inline-link:hover{color:var(--skc-heading)}
.skc-banner__inline-link{display:none}

@media (max-width:600px){
	.skc-banner,.skc-banner--right{left:12px;right:12px;bottom:12px;width:auto;max-width:none;max-height:calc(100vh - 24px)}
	.skc-banner__head{gap:12px;padding:16px 20px 14px}
	.skc-banner__icon{width:44px;height:44px;border-radius:12px}
	.skc-banner__icon svg{width:22px;height:22px}
	.skc-root .skc-banner__label{font-size:11px}
	.skc-root .skc-banner__title{font-size:18px}
	.skc-banner__body{gap:14px;padding:16px 20px 8px}
	.skc-root .skc-banner__text{font-size:14px}
	.skc-root .skc-banner__points,.skc-root .skc-banner__policy{display:none}
	.skc-root .skc-banner__inline-link{display:inline}
	.skc-banner__actions{gap:10px}
	.skc-banner__foot{justify-content:center}
	.skc-v .skc-banner__customize{padding:0 12px}
	.skc-banner__customize svg{display:block}
}

/* ---------- Panelen ---------- */
.skc-panel{position:fixed;inset:0;z-index:calc(var(--skc-z) + 1);display:flex;align-items:center;justify-content:center;padding:24px;background:rgba(14,25,60,.45)}
.skc-panel__dialog{display:flex;flex-direction:column;width:600px;max-width:100%;max-height:100%;background:#FFF;border-radius:20px;box-shadow:0 24px 64px rgba(14,25,60,.3);overflow:hidden;animation:skc-in .25s ease-out}
.skc-panel__dialog:focus{outline:none}
@keyframes skc-in{from{opacity:0;transform:translateY(16px)}}
.skc-panel__head{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:24px 28px 0}
.skc-root .skc-panel__title{font-size:24px;font-weight:600}
.skc-v .skc-panel__close{display:flex;align-items:center;justify-content:center;flex:none;width:44px;height:44px;padding:0;border:0;border-radius:22px;background:var(--skc-surface);color:var(--skc-heading)}
.skc-v .skc-panel__close:hover,.skc-v .skc-panel__close:focus,.skc-v .skc-panel__close:active{background:color-mix(in srgb,var(--skc-surface) 80%,var(--skc-link));color:var(--skc-heading)}
.skc-panel__body{display:flex;flex-direction:column;gap:12px;padding:12px 28px 0;overflow:auto;overscroll-behavior:contain}
.skc-root .skc-panel__text{margin-bottom:8px;font-size:15px;line-height:1.6;color:var(--skc-text)}
.skc-cat{display:flex;flex-direction:column;gap:6px;padding:18px 20px;border:1px solid var(--skc-border);border-radius:14px}
.skc-cat__head{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:30px}
.skc-root .skc-cat__title{font-size:17px;font-weight:600}
.skc-cat__always{padding:6px 12px;border-radius:14px;background:var(--skc-surface);color:var(--skc-link);font-size:13px;font-weight:600;white-space:nowrap}
.skc-root .skc-cat__text{font-size:14px;line-height:1.55;color:var(--skc-text)}
.skc-v .skc-cat__toggle{align-self:flex-start;gap:6px}
.skc-cat__toggle[aria-expanded="true"] svg{transform:rotate(180deg)}
.skc-cat__cookies{padding:12px 14px;border-radius:10px;background:var(--skc-surface-2);font-size:13px;overflow-x:auto}
.skc-root .skc-mini{width:100%;border:0;border-collapse:collapse;font-size:13px;line-height:1.5}
.skc-root .skc-mini th,.skc-root .skc-mini td{padding:3px 12px 3px 0;border:0;background:none;text-align:left;vertical-align:top;color:var(--skc-heading)}
.skc-root .skc-mini th{font-weight:600}
.skc-panel__foot{display:flex;gap:12px;margin-top:24px;padding:20px 28px 24px;border-top:1px solid var(--skc-border)}

/* Switch: 52×30 synligt, 44 px hög touchyta. */
.skc-v .skc-switch{position:relative;flex:none;width:52px;height:44px;padding:0;border:0;background:transparent}
.skc-v .skc-switch:hover,.skc-v .skc-switch:focus,.skc-v .skc-switch:active{background:transparent;border:0}
.skc-switch::before{content:"";position:absolute;left:0;top:7px;width:52px;height:30px;border-radius:15px;background:var(--skc-off);transition:background .2s}
.skc-switch__knob{position:absolute;left:3px;top:10px;width:24px;height:24px;border-radius:12px;background:#FFF;box-shadow:0 1px 3px rgba(0,0,0,.25);transition:transform .2s}
.skc-switch[aria-checked="true"]::before{background:var(--skc-primary)}
.skc-switch[aria-checked="true"] .skc-switch__knob{transform:translateX(22px)}
.skc-root .skc-switch:focus-visible{outline-offset:-2px}

.skc-lock,.skc-lock body{overflow:hidden}

@media (max-width:600px){
	.skc-panel{align-items:stretch;padding:56px 0 0}
	.skc-panel__dialog{width:100%;max-height:none;border-radius:20px 20px 0 0}
	.skc-panel__head{padding:18px 16px 0 20px}
	.skc-root .skc-panel__title{font-size:21px}
	.skc-panel__body{flex:1;padding:10px 20px 16px}
	.skc-root .skc-panel__text{margin-bottom:0;font-size:14px}
	.skc-cat{padding:16px}
	.skc-root .skc-cat__title{font-size:16px}
	.skc-cat__always{padding:6px 10px;font-size:12px}
	.skc-panel__foot{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:0;padding:14px 16px 24px}
	.skc-panel__foot .skc-btn--outline{grid-column:1/-1;order:1}
}

@media (prefers-reduced-motion:reduce){
	.skc-banner,.skc-panel__dialog,.skc-switch::before,.skc-switch__knob{transition:none!important;animation:none!important}
	.skc-banner{transform:none!important}
}

/* ---------- Shortcodes ---------- */
.skc-v .skc-settings-btn{flex:none}
.skc-links{display:flex;flex-wrap:wrap;align-items:center;gap:8px 28px;font-size:14px;font-weight:500}
.skc-links ul{display:flex;flex-wrap:wrap;align-items:center;gap:8px 28px;margin:0;padding:0;list-style:none}
.skc-links li{margin:0;padding:0}
.skc-links a,.skc-links a:visited{color:inherit;text-decoration:none}
.skc-links a:hover{text-decoration:underline}
.skc-links :focus-visible{outline:2px solid currentColor;outline-offset:2px}
.skc-v .skc-links__btn,.skc-v .skc-links__btn:hover,.skc-v .skc-links__btn:focus,.skc-v .skc-links__btn:active{display:inline-flex;align-items:center;gap:8px;min-height:44px;padding:0 14px;border:1px solid color-mix(in srgb,currentColor 60%,transparent);border-radius:22px;background:transparent;color:inherit;font-family:inherit;font-size:14px;font-weight:600;line-height:1.2;cursor:pointer;margin:0;text-transform:none;box-shadow:none}
.skc-v .skc-links__btn:hover{border-color:currentColor}