/* DanseMessen – Tilbehør & Looks */

/* Tilbehør på skoen: kort ved siden af hinanden i stedet for en lang liste */
.dms-addons{margin:14px 0 16px;padding:0;border:0;min-width:0;width:100%;flex:1 1 100%;grid-column:1/-1;box-sizing:border-box}
@media (max-width:600px){
  .dms-addons-grid{grid-template-columns:1fr 1fr}
  .dms-addon label{flex-direction:column;align-items:flex-start;padding-right:0}
  .dms-addon-img img{width:40px;height:40px}
}
.dms-addons legend{padding:0;margin:0 0 8px;font-size:13px;font-weight:750;letter-spacing:.02em}
.dms-addons-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:8px}
.dms-addon{position:relative;display:flex;flex-direction:column;gap:6px;padding:8px;border:1px solid var(--dm-line,#e6e0da);border-radius:12px;background:#fff;transition:border-color .15s ease,box-shadow .15s ease}
.dms-addon:has(input:checked){border-color:var(--dm-accent,#8a1c3d);box-shadow:0 0 0 1px var(--dm-accent,#8a1c3d)}
.dms-addon input[type=checkbox]{position:absolute;top:10px;right:10px;width:18px;height:18px;margin:0;accent-color:var(--dm-accent,#8a1c3d)}
.dms-addon label{display:flex;gap:8px;align-items:center;cursor:pointer;margin:0;padding-right:22px}
.dms-addon-img img{width:44px;height:44px;object-fit:cover;border-radius:8px;display:block}
.dms-addon-text{display:flex;flex-direction:column;line-height:1.25;min-width:0}
.dms-addon-text strong{font-size:13px}
.dms-addon-text small{font-size:11.5px;opacity:.7}
.dms-addon-price{font-size:12.5px;font-weight:700;margin-top:2px}
.dms-addon-select{width:100%;min-height:36px;font-size:12.5px;border-radius:8px}
.dms-addon.is-missing .dms-addon-select{outline:2px solid #c0392b}

/* Vejledning på varen: "Derfor …" og plejeguide */
.dms-guides{clear:both;display:grid;gap:10px;margin:28px 0 8px}
.dms-guide-box{border:1px solid var(--dm-line,#e6e0da);border-radius:14px;background:#fff}
.dms-guide-box>summary{cursor:pointer;padding:14px 18px;font-size:17px;font-weight:750;list-style-position:inside}
.dms-guide-box[open]>summary{border-bottom:1px solid var(--dm-line,#e6e0da)}
.dms-guide-text{padding:12px 18px 6px;font-size:15px;line-height:1.65;max-width:75ch}
.dms-guide-text p{margin:0 0 12px}
.dms-guide-text ul{margin:0 0 12px 18px}
.dms-guide-video{font-weight:700}

/* To looks i én boks med faner */
.dms-look-switch{clear:both;margin:28px 0}
.dms-look-tabs{display:flex;gap:6px;margin:0 0 -1px;position:relative;z-index:1}
.dms-look-tabs [role=tab]{display:flex;flex-direction:column;align-items:flex-start;gap:1px;padding:10px 16px;border:1px solid var(--dm-line,#e6e0da);border-bottom-color:transparent;border-radius:14px 14px 0 0;background:#f3efeb;color:inherit;cursor:pointer;text-align:left}
.dms-look-tabs [role=tab] strong{font-size:14px}
.dms-look-tabs [role=tab] small{font-size:12px;opacity:.7}
.dms-look-tabs [role=tab][aria-selected=true]{background:#fbfaf8;border-bottom-color:#fbfaf8}
.dms-look-panel>.dms-look{margin:0;border-top-left-radius:0}
.dms-look-panel[hidden]{display:none}
@media (max-width:640px){.dms-look-tabs [role=tab]{flex:1;padding:9px 10px}.dms-look-tabs [role=tab] small{display:none}}

/* Køb looket */
.dms-look{clear:both;display:grid;grid-template-columns:minmax(0,5fr) minmax(0,6fr);gap:28px;margin:36px 0;padding:24px;border:1px solid var(--dm-line,#e6e0da);border-radius:18px;background:#fbfaf8}
.dms-look-hero{width:100%;height:100%;max-height:560px;object-fit:cover;border-radius:14px;display:block}
.dms-look-collage{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.dms-look-collage img{width:100%;aspect-ratio:1;object-fit:cover;border-radius:12px;background:#fff;display:block}
.dms-look-eyebrow{margin:0 0 4px;color:var(--dm-accent,#8a1c3d);font-size:12px;font-weight:800;letter-spacing:.08em;text-transform:uppercase}
.dms-look h2{margin:0 0 6px;font-size:26px}
.dms-look-intro{margin:0 0 14px;opacity:.85}
.dms-look-items{list-style:none;margin:0 0 14px;padding:0;display:grid;gap:8px}
.dms-look-item{display:grid;grid-template-columns:20px 56px minmax(0,1fr);gap:12px;align-items:center;padding:8px 10px;border-radius:12px;background:#fff;border:1px solid var(--dm-line,#e6e0da)}
.dms-look-item input[type=checkbox]{width:18px;height:18px;margin:0;accent-color:var(--dm-accent,#8a1c3d)}
.dms-look-item.is-unavailable{opacity:.55}
.dms-look-thumb img{width:56px;height:56px;object-fit:cover;border-radius:8px;display:block}
.dms-look-info{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:4px 10px;align-items:center}
.dms-look-info label{margin:0;font-size:14px;line-height:1.3;cursor:pointer}
.dms-look-info em{font-style:normal;opacity:.6;font-size:12px}
.dms-look-price{font-size:13.5px;font-weight:700;white-space:nowrap}
.dms-look-info select{grid-column:1/-1;min-height:38px;font-size:13px;border-radius:8px}
.dms-look-item.is-missing select{outline:2px solid #c0392b}
.dms-look-sale{grid-column:1/-1;display:inline-block;justify-self:start;padding:2px 8px;border-radius:999px;background:#fdecef;color:#9b1c3a;font-size:11.5px;font-weight:700}
.dms-look-sale[hidden]{display:none}
.dms-slot-label{display:block;font-size:11px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;color:var(--dm-accent,#8a1c3d)}
.dms-build .dms-look-item.is-empty .dms-look-thumb img{opacity:.35}
.dms-build .dms-look-item.is-loading{opacity:.6}
.dms-build .dms-look-item.is-current{border-color:var(--dm-accent,#8a1c3d)}
.dms-look-info select+select{margin-top:6px}
.dms-look-addons-note{font-size:12.5px;opacity:.75}
.dms-look-addons-note[hidden]{display:none}
.dms-look-info .dms-build-size{grid-column:1/-1;min-height:38px;font-size:13px;border-radius:8px;background:#fff}
.dms-look-info .dms-build-product{grid-column:1/-1;min-height:38px;font-size:13px;border-radius:8px}
.dms-build-count{grid-column:1/-1;font-size:12px;opacity:.7}
.dms-build-count[hidden]{display:none}
.dms-guide-slot{grid-column:1/-1;display:contents}

/* Størrelsesguide */
.dms-guide-btn{display:inline-flex;align-items:center;gap:6px;margin:0 0 10px;padding:0;border:0;background:none;color:var(--dm-accent,#8a1c3d);font-size:13px;font-weight:700;text-decoration:underline;text-underline-offset:3px;cursor:pointer}
.dms-guide-btn::before{content:"📏";text-decoration:none}
.dms-look-info .dms-guide-btn{grid-column:1/-1;justify-self:start;margin:2px 0 0;font-size:12px}
.dms-guide-btn.is-loading{opacity:.5}
.dms-guide-dialog{width:min(760px,calc(100vw - 32px));max-height:calc(100vh - 48px);padding:0;border:0;border-radius:16px;box-shadow:0 20px 60px rgba(0,0,0,.25)}
.dms-guide-dialog::backdrop{background:rgba(0,0,0,.45)}
.dms-guide-head{position:sticky;top:0;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:14px 18px;background:#fff;border-bottom:1px solid var(--dm-line,#e6e0da)}
.dms-guide-head h2{margin:0;font-size:18px}
.dms-guide-close{width:40px;height:40px;border:0;border-radius:50%;background:#f3efeb;font-size:24px;line-height:1;cursor:pointer}
.dms-guide-body{padding:16px 18px 20px;overflow:auto}
.dms-guide-body img{max-width:100%;height:auto}
.dms-guide-table-wrap{overflow-x:auto;margin:0 0 14px}
.dms-guide-table{border-collapse:collapse;font-size:13px;min-width:100%}
.dms-guide-table th,.dms-guide-table td{padding:7px 10px;border:1px solid var(--dm-line,#e6e0da);text-align:center;white-space:nowrap}
.dms-guide-table th{background:#fbfaf8}

/* Danseskole-lister */
.dms-school-pickers{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:12px;margin:0 0 8px}
.dms-school-pickers label{display:flex;flex-direction:column;gap:6px;font-weight:750}
.dms-school-pickers select{min-height:46px;border-radius:10px;font-size:15px}
.dms-school-list[hidden]{display:none}

/* "Husk også": valgfrie ekstra varer, tydeligt adskilt fra listen */
.dms-extras{margin:4px 0 16px;padding:14px 14px 6px;border:1px dashed #b9aec6;border-radius:14px;background:#faf8fc}
.dms-extras-title{margin:0 0 2px;font-size:17px}
.dms-extras-title small{font-size:13px;font-weight:600;opacity:.7}
.dms-extras-intro{margin:0 0 10px;font-size:13px;opacity:.8}
.dms-look-item.is-extra{background:#fff}
.dms-extras-offer{margin:4px 0 6px;padding:8px 10px;border-radius:10px;background:#fdecef;color:#7a1531;font-size:13px}
.dms-look-extras-note{font-size:12.5px;opacity:.75}

/* "ⓘ Hvorfor?" – lille forklaring, ingen indlejrede videoer */
.dms-why{position:relative;display:inline-block;grid-column:1/-1;justify-self:start}
.dms-why-btn{padding:2px 0;border:0;background:none;color:#5b4b73;font-size:12px;font-weight:700;cursor:pointer;text-decoration:underline dotted;text-underline-offset:3px}
.dms-why-pop{display:none;position:absolute;left:0;bottom:calc(100% + 6px);z-index:40;width:max-content;max-width:min(300px,78vw);padding:10px 12px;border-radius:10px;background:#231c2e;color:#fff;font-size:12.5px;font-weight:500;line-height:1.45;box-shadow:0 10px 30px rgba(0,0,0,.25);white-space:normal}
.dms-why-pop a{display:block;margin-top:6px;color:#ffd6e3;font-weight:700}
.dms-why:hover .dms-why-pop,.dms-why:focus-within .dms-why-pop,.dms-why.is-open .dms-why-pop{display:block}
.dms-addon .dms-why{margin-top:-2px}
@media (hover:none){.dms-why:hover .dms-why-pop{display:none}.dms-why.is-open .dms-why-pop{display:block}}
/* Smalle skærme: folder ud under knappen i stedet for at svæve – kan aldrig gå uden for skærmen */
@media (max-width:640px){
  .dms-why{display:block;width:100%}
  .dms-why-pop{position:static;width:auto;max-width:none;margin:4px 0 2px;box-shadow:none}
  .dms-why:hover .dms-why-pop,.dms-why:focus-within .dms-why-pop{display:none}
  .dms-why.is-open .dms-why-pop{display:block}
}
.dms-look-extras-note[hidden]{display:none}
.dms-school-missing{padding:10px 14px;border-radius:10px;background:#fdecef;color:#9b1c3a}
.dms-school-teacher{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:14px;margin:32px 0 8px;padding:18px 20px;border:1px dashed var(--dm-accent,#8a1c3d);border-radius:14px;background:#fff}
.dms-school-teacher p{margin:4px 0 0;max-width:60ch}
.dms-school-note{margin:0 0 10px;padding:8px 12px;border-radius:10px;background:#f3eef9;font-size:13px}
.dms-school-note span{font-weight:700}
.dms-school-note a{color:inherit;font-weight:650}
.dms-look-total{display:flex;flex-direction:column;gap:2px;margin:0 0 12px}
.dms-look-total strong.dms-look-sum{margin-left:6px;font-size:18px}
.dms-look-save{color:var(--dm-accent,#8a1c3d);font-size:14px}
.dms-look-add{width:100%;min-height:50px;border-radius:999px!important;font-weight:750!important}
@media (max-width:820px){
  .dms-look{grid-template-columns:1fr;padding:16px;gap:16px}
  .dms-look-collage{grid-template-columns:repeat(4,1fr)}
}

/* --- Gavekort: felter på produktsiden skal fylde hele rækken --- */
.dms-gk-til-field,
.dms-gk-belob-field {
    grid-column: 1 / -1;
    width: 100%;
    margin: 0 0 14px;
}
.dms-gk-til-field input,
.dms-gk-belob-field input {
    width: 100%;
    max-width: 420px;
    padding: 10px 12px;
}
.dms-gk-til-field .description,
.dms-gk-belob-field .description {
    display: block;
    font-size: .9em;
    opacity: .75;
    margin-top: 4px;
}
.dms-gk-belob-field[hidden] { display: none; }

/* Gavekort: gavekort-pluginets egne felter (Til-mail, Fra, Besked) skal også
   fylde hele rækken i stedet for at blive klemt ned i antal-kolonnen. */
.woocommerce-variation-add-to-cart #pwgc-purchase-container,
form.variations_form #pwgc-purchase-container {
    grid-column: 1 / -1;
    width: 100%;
}
#pwgc-purchase-container .pwgc-field-container { width: 100%; margin-bottom: 12px; }
#pwgc-purchase-container input[type="text"],
#pwgc-purchase-container input[type="email"],
#pwgc-purchase-container textarea {
    width: 100%;
    max-width: 420px;
    padding: 10px 12px;
}
/* Kun ét beløbsvalg: så er listen overflødig, og vi viser bare beløbsfeltet. */
form.variations_form.dms-gk-kun-belob .variations { display: none; }

/* --- Byg dit eget look: vælg varen på billedet i stedet for på navnet --- */
.dms-look-info { min-width: 0; }
.dms-build-cards {
    grid-column: 1 / -1;
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(108px, 1fr));
    gap: 10px;
    max-width: 100%;
    padding: 4px 0 6px;
    margin: 6px 0 4px;
}
.dms-pick {
    scroll-snap-align: start;
    display: grid;
    gap: 4px;
    padding: 6px 6px 8px;
    border: 1px solid #e0dad1;
    border-radius: 6px;
    background: #fff;
    cursor: pointer;
    text-align: left;
    font: inherit;
    color: inherit;
}
.dms-pick img {
    width: 100%;
    aspect-ratio: 1 / 1;
    object-fit: cover;
    border-radius: 4px;
    display: block;
}
.dms-pick-name {
    font-size: 13px;
    line-height: 1.3;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}
.dms-pick-price { font-size: 13px; font-weight: 700; }
.dms-pick-sale { font-size: 11px; color: #8b1e3f; font-weight: 600; }
.dms-pick:hover { border-color: #8b1e3f; }
.dms-pick:focus-visible { outline: 2px solid #8b1e3f; outline-offset: 2px; }
.dms-pick.is-selected { border-color: #8b1e3f; box-shadow: inset 0 0 0 1px #8b1e3f; }
.dms-pick[hidden] { display: none; }
/* Navnelisten bliver liggende for skærmlæsere og uden JavaScript, men skjules visuelt,
   når billedvælgeren er i brug. */
.dms-look-item.has-cards select.dms-build-product {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0 0 0 0);
    white-space: nowrap;
    border: 0;
}
@media (max-width: 600px) {
    .dms-build-cards { grid-template-columns: repeat(auto-fill, minmax(96px, 1fr)); gap: 8px; }
}

/* Så længe pladsen er tom, siger den tomme billedramme ingenting – billedvælgeren
   nedenunder viser varerne. Så giver vi pladsen til kortene i stedet. */
.dms-look-item.has-cards.is-empty { grid-template-columns: 20px minmax(0, 1fr); }
.dms-look-item.has-cards.is-empty .dms-look-thumb { display: none; }
@media (max-width: 700px) {
    .dms-look-item.has-cards .dms-build-cards { grid-template-columns: repeat(auto-fill, minmax(92px, 1fr)); }
}

/* Sidevisning under billedvælgeren */
.dms-pager {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    margin: 2px 0 6px;
    font: 400 13px/1.4 system-ui, sans-serif;
    color: #69645d;
}
.dms-pager button {
    font: 600 13px/1 system-ui, sans-serif;
    padding: 7px 12px;
    border: 1px solid #d8d2c8;
    border-radius: 5px;
    background: #fff;
    cursor: pointer;
}
.dms-pager button:disabled { opacity: .4; cursor: default; }
.dms-pager button:not(:disabled):hover { border-color: #8b1e3f; color: #8b1e3f; }
.dms-pager[hidden] { display: none; }
.dms-pager { grid-column: 1 / -1; }

/* --- Banner øverst på varesiden, der peger ned på looket --- */
.dms-look-banner {
    display: flex;
    align-items: center;
    gap: 12px;
    margin: 0 0 18px;
    padding: 12px 14px;
    border: 1px solid #e3c9d3;
    border-left: 4px solid #8b1e3f;
    border-radius: 8px;
    background: #fbf3f6;
    text-decoration: none;
    color: #171717;
}
.dms-look-banner:hover { background: #f6e8ee; border-color: #8b1e3f; }
.dms-look-banner-tag {
    flex: none;
    font: 700 13px/1 system-ui, sans-serif;
    letter-spacing: .02em;
    padding: 8px 10px;
    border-radius: 999px;
    background: #8b1e3f;
    color: #fff;
    white-space: nowrap;
}
.dms-look-banner-text { display: grid; gap: 2px; min-width: 0; }
.dms-look-banner-text strong { font: 600 15px/1.3 system-ui, sans-serif; }
.dms-look-banner-text small { font: 400 13px/1.3 system-ui, sans-serif; color: #69645d; }
.dms-look-banner-arrow { margin-left: auto; font-size: 20px; color: #8b1e3f; }
@media (max-width: 480px) {
    .dms-look-banner { gap: 10px; padding: 10px 12px; }
    .dms-look-banner-text strong { font-size: 14px; }
}

/* Oplysning om, at rabatten bortfalder ved delvis returnering */
.dms-look-return {
    display: block;
    margin-top: 6px;
    padding-top: 6px;
    border-top: 1px dashed var(--dm-line, #e6e0da);
    font: 400 12px/1.5 system-ui, sans-serif;
    color: #69645d;
}

/* Byg dit eget look: billedet af det valgte kommer op i collagen til venstre */
.dms-build-collage { grid-template-columns: 1fr 1fr; gap: 10px; }
.dms-build-cell {
    position: relative;
    display: grid;
    align-content: end;
    aspect-ratio: 1;
    border-radius: 12px;
    border: 1px dashed #ded7cd;
    background: #fff;
    overflow: hidden;
}
.dms-build-cell.is-filled { border-style: solid; border-color: #e6e0da; }
.dms-build-cell img {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 12px;
}
.dms-build-cell-empty {
    position: absolute;
    inset: 0;
    display: grid;
    place-items: center;
    padding: 8px;
    text-align: center;
    font: 400 12px/1.35 system-ui, sans-serif;
    color: #9a948b;
}
.dms-build-cell-label {
    position: relative;
    z-index: 1;
    margin: 6px;
    padding: 3px 8px;
    border-radius: 999px;
    background: rgba(255, 255, 255, .92);
    font: 600 11px/1.4 system-ui, sans-serif;
    letter-spacing: .02em;
    color: #4a453f;
    justify-self: start;
}

/* --- Landingsside for danselærere --- */
.dms-laerer { max-width: 760px; }
.dms-laerer-form { display: grid; gap: 18px; }
.dms-laerer-form fieldset { border: 1px solid var(--dm-line, #e6e0da); border-radius: 10px; padding: 14px 16px; margin: 0; }
.dms-laerer-form legend { font: 600 14px/1.3 system-ui, sans-serif; padding: 0 6px; }
.dms-laerer-valg { display: flex; flex-wrap: wrap; gap: 10px 18px; }
.dms-laerer-valg-lodret { flex-direction: column; gap: 8px; }
.dms-laerer-valg label { display: flex; align-items: center; gap: 7px; font-size: 15px; }
.dms-laerer-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(230px, 1fr)); gap: 14px; }
.dms-laerer-form label { display: grid; gap: 5px; font: 600 14px/1.3 system-ui, sans-serif; }
.dms-laerer-form input[type=text], .dms-laerer-form input[type=email], .dms-laerer-form input[type=tel],
.dms-laerer-form input[type=url], .dms-laerer-form input[type=number], .dms-laerer-form textarea {
    width: 100%; padding: 10px 12px; border: 1px solid var(--dm-line, #ddd6cc); border-radius: 6px;
    font: 400 15px/1.4 system-ui, sans-serif;
}
.dms-laerer-form small { font: 400 13px/1.4 system-ui, sans-serif; color: #69645d; }
.dms-laerer-bred { display: grid; gap: 5px; }
.dms-laerer-send button { font-size: 16px; padding: 13px 26px; }
.dms-laerer-lille { font: 400 13px/1.5 system-ui, sans-serif; color: #69645d; }
.dms-laerer-fejl { padding: 10px 14px; border-left: 4px solid #a5561a; background: #fbebdd; border-radius: 4px; }
.dms-laerer-kvittering { padding: 20px 22px; border: 1px solid #cfe3d6; border-left: 4px solid #2f7d57; background: #f1f8f4; border-radius: 8px; }
.dms-laerer-kvittering h2 { margin-top: 0; }
.dms-hp { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }

/* --- Landingsside for danselærere: hele siden --- */
.dms-laerer-side { display: grid; gap: 40px; max-width: 1040px; }
.dms-laerer-side h3 { font-size: clamp(1.25rem, 3vw, 1.6rem); margin: 0 0 14px; }
.dms-laerer-eyebrow { font: 600 12px/1 system-ui, sans-serif; letter-spacing: .18em; text-transform: uppercase; color: #8b1e3f; margin: 0 0 10px; }
.dms-laerer-hero {
    display: grid; grid-template-columns: minmax(0, 3fr) minmax(0, 2fr); gap: 28px; align-items: center;
    padding: 28px 30px; border: 1px solid var(--dm-line, #e6e0da); border-radius: 18px;
    background: linear-gradient(180deg, #fbf3f6 0%, #fff 100%);
}
.dms-laerer-hero h2 { margin: 0 0 12px; font-size: clamp(1.6rem, 4.2vw, 2.3rem); line-height: 1.15; }
.dms-laerer-lead { font-size: 17px; line-height: 1.55; margin: 0 0 18px; }
.dms-laerer-hero-knapper { display: flex; flex-wrap: wrap; gap: 10px; margin: 0 0 10px; }
.dms-laerer-knap {
    display: inline-block; padding: 13px 22px; border-radius: 8px; background: #8b1e3f; color: #fff;
    font: 600 15px/1 system-ui, sans-serif; text-decoration: none; border: 1px solid #8b1e3f;
}
.dms-laerer-knap:hover { background: #67162f; border-color: #67162f; color: #fff; }
.dms-laerer-knap-let { background: #fff; color: #8b1e3f; }
.dms-laerer-knap-let:hover { background: #f6e8ee; color: #8b1e3f; }
.dms-laerer-tal { list-style: none; margin: 0; padding: 0; display: grid; gap: 12px; }
.dms-laerer-tal li { display: grid; gap: 2px; padding: 12px 16px; background: #fff; border: 1px solid var(--dm-line, #e6e0da); border-radius: 12px; }
.dms-laerer-tal strong { font: 700 24px/1 Georgia, serif; color: #8b1e3f; }
.dms-laerer-tal span { font: 400 13px/1.4 system-ui, sans-serif; color: #69645d; }

.dms-laerer-trin { list-style: none; counter-reset: trin; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 16px; }
.dms-laerer-trin li { counter-increment: trin; display: grid; gap: 6px; padding: 18px 18px 18px 18px; border: 1px solid var(--dm-line, #e6e0da); border-radius: 12px; background: #fff; }
.dms-laerer-trin li::before { content: counter(trin); font: 700 13px/24px system-ui, sans-serif; width: 24px; height: 24px; border-radius: 50%; background: #8b1e3f; color: #fff; text-align: center; }
.dms-laerer-trin strong { font-size: 16px; }
.dms-laerer-trin span { font-size: 14px; line-height: 1.5; color: #4a453f; }

.dms-laerer-kerne { padding: 20px 24px; border: 1px solid #f0d9e2; border-left: 4px solid #8b1e3f; border-radius: 12px; background: #fbf3f6; }
.dms-laerer-kerne p { margin: 0; font-size: 16px; line-height: 1.6; color: #3a3631; }

.dms-laerer-kort { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 16px; }
.dms-laerer-kort > div { padding: 18px; border: 1px solid var(--dm-line, #e6e0da); border-radius: 12px; background: #fff; }
.dms-laerer-kort strong { display: block; margin-bottom: 6px; font-size: 16px; }
.dms-laerer-kort p { margin: 0; font-size: 14px; line-height: 1.55; color: #4a453f; }

.dms-laerer-eksempel { display: grid; grid-template-columns: minmax(0, 3fr) minmax(0, 2fr); gap: 28px; align-items: start; }
.dms-laerer-eksempel p { line-height: 1.6; }
.dms-laerer-link { font-weight: 600; }
.dms-laerer-mock { list-style: none; margin: 0; padding: 16px; border: 1px solid var(--dm-line, #e6e0da); border-radius: 14px; background: #fff; display: grid; gap: 10px; }
.dms-laerer-mock li { display: flex; justify-content: space-between; gap: 12px; font: 400 14px/1.4 system-ui, sans-serif; }
.dms-laerer-mock li em { font-style: normal; font-weight: 600; white-space: nowrap; }
.dms-laerer-mock-tag { font: 600 11px/1 system-ui, sans-serif; letter-spacing: .14em; text-transform: uppercase; color: #8b1e3f; }
.dms-laerer-mock-sum { border-top: 1px solid var(--dm-line, #e6e0da); padding-top: 10px; font-weight: 700; }

.dms-laerer-faq { display: grid; gap: 8px; }
.dms-laerer-faq details { border: 1px solid var(--dm-line, #e6e0da); border-radius: 10px; background: #fff; padding: 12px 16px; }
.dms-laerer-faq summary { cursor: pointer; font: 600 15px/1.4 system-ui, sans-serif; }
.dms-laerer-faq p { margin: 10px 0 0; font-size: 14px; line-height: 1.6; color: #4a453f; }
.dms-laerer-intro { margin-top: -6px; color: #69645d; }

@media (max-width: 820px) {
    .dms-laerer-hero, .dms-laerer-eksempel { grid-template-columns: 1fr; }
    .dms-laerer-tal { grid-template-columns: repeat(3, 1fr); }
    .dms-laerer-tal li { padding: 10px 12px; }
    .dms-laerer-tal strong { font-size: 19px; }
}
@media (max-width: 480px) {
    .dms-laerer-tal { grid-template-columns: 1fr; }
    .dms-laerer-hero { padding: 20px; }
}

/* --- Oversigt over danseskoler --- */
.dms-skoler { display: grid; gap: 22px; max-width: 900px; }
.dms-skoler-soeg { display: grid; grid-template-columns: repeat(auto-fit, minmax(190px, 1fr)); gap: 12px; align-items: end; padding: 16px; border: 1px solid var(--dm-line, #e6e0da); border-radius: 12px; background: #fff; }
.dms-skoler-soeg label { display: grid; gap: 5px; font: 600 14px/1.3 system-ui, sans-serif; }
.dms-skoler-soeg input, .dms-skoler-soeg select { padding: 10px 12px; border: 1px solid var(--dm-line, #ddd6cc); border-radius: 6px; font: 400 15px/1.4 system-ui, sans-serif; }
.dms-skoler-soeg button { justify-self: start; }
.dms-skoler-antal { font: 600 14px/1 system-ui, sans-serif; color: #69645d; margin: 0; }
.dms-skoler-liste { list-style: none; margin: 0; padding: 0; display: grid; gap: 14px; }
.dms-skole-kort { padding: 18px 20px; border: 1px solid var(--dm-line, #e6e0da); border-radius: 12px; background: #fff; display: grid; gap: 8px; }
.dms-skole-hoved { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; flex-wrap: wrap; }
.dms-skole-hoved h3 { margin: 0; font-size: 1.15rem; }
.dms-skole-by { font: 600 13px/1 system-ui, sans-serif; color: #8b1e3f; }
.dms-skole-om { margin: 0; font-size: 15px; line-height: 1.55; }
.dms-skole-maerker { display: flex; flex-wrap: wrap; gap: 6px; margin: 0; }
.dms-skole-maerker span { font: 600 12px/1 system-ui, sans-serif; padding: 5px 9px; border-radius: 999px; background: #f6e8ee; color: #8b1e3f; }
.dms-skole-hold summary { cursor: pointer; font: 600 14px/1.4 system-ui, sans-serif; }
.dms-skole-hold ul { margin: 8px 0 0; padding-left: 20px; font-size: 14px; line-height: 1.6; }
.dms-skole-links { display: flex; justify-content: space-between; gap: 12px; flex-wrap: wrap; margin: 0; font-size: 14px; }
.dms-skole-alder { color: #69645d; }
.dms-skoler-tom, .dms-skoler-note { font-size: 15px; line-height: 1.6; }
.dms-skoler-note { padding-top: 6px; border-top: 1px solid var(--dm-line, #e6e0da); color: #69645d; }

/* --- Byg dit eget look paa mobil: vaelg foerst, se resultatet bagefter ---
   Paa en smal skaerm klapper looket sammen til een kolonne, og collagen staar
   foerst i koden - saa kunden moedte fire tomme billedfelter, foer hun kunne
   vaelge noget. Butikken bad om den omvendte raekkefoelge: foerst vaelger man
   nederdel, top, stroemper og sko, og til sidst ser man det samlede look.
   Kun byg-selv-looks: et faerdigt look viser med god grund billedet foerst. */
@media (max-width: 820px) {
  .dms-look.dms-build .dms-look-body  { order: 1; }
  .dms-look.dms-build .dms-look-media { order: 2; }
  .dms-look.dms-build .dms-look-media::before {
    content: "Dit look";
    display: block;
    margin: 4px 0 8px;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: .08em;
    text-transform: uppercase;
    color: #7b6f66;
  }
}