/* Lantern configurator — mirrors the panel calculator's look (dpl- namespace). */
.dpl { margin: 0 0 1.25rem; font-size: 15px; line-height: 1.45; }
.dpl[hidden], .dpl [hidden] { display: none !important; }

.dpl-spec { display: flex; flex-wrap: wrap; gap: .35rem 1.5rem; margin: 0 0 1rem; padding: .6rem .8rem;
  background: #f6f5f2; border-radius: 8px; }
.dpl-spec-row { display: flex; gap: .4rem; align-items: baseline; }
.dpl-spec dt { margin: 0; font-size: 12px; text-transform: uppercase; letter-spacing: .04em; color: #8a8378; }
.dpl-spec dd { margin: 0; font-weight: 600; color: #2a2722; }

.dpl-field { margin: 0 0 1.1rem; }
.dpl-eyebrow { margin: 0 0 .45rem; font-size: 12px; text-transform: uppercase; letter-spacing: .06em; color: #8a8378; }

/* segmented size buttons */
.dpl-seg { display: flex; flex-wrap: wrap; gap: .5rem; }
.dpl-seg-in { position: absolute; opacity: 0; pointer-events: none; }
.dpl-seg-btn { display: inline-flex; align-items: center; padding: .5rem .85rem; border: 1.5px solid #ddd8cf;
  border-radius: 8px; cursor: pointer; background: #fff; transition: border-color .12s, background .12s; }
.dpl-seg-in:checked + .dpl-seg-btn { border-color: #b0872f; background: #fbf6ea; }
.dpl-seg-in:focus-visible + .dpl-seg-btn { outline: 2px solid #b0872f; outline-offset: 2px; }
.dpl-seg-big { font-weight: 600; }

/* finish cards */
.dpl-cards { display: flex; flex-wrap: wrap; gap: .5rem; }
.dpl-card-in { position: absolute; opacity: 0; pointer-events: none; }
.dpl-card { display: block; padding: .55rem .8rem; border: 1.5px solid #ddd8cf; border-radius: 8px;
  cursor: pointer; background: #fff; transition: border-color .12s, background .12s; }
.dpl-card-in:checked + .dpl-card { border-color: #b0872f; background: #fbf6ea; }
.dpl-card-in:focus-visible + .dpl-card { outline: 2px solid #b0872f; outline-offset: 2px; }
.dpl-card-title { font-weight: 600; }

/* colour swatches */
.dpl-swatches { display: flex; flex-wrap: wrap; gap: .6rem; }
.dpl-swatch-in { position: absolute; opacity: 0; pointer-events: none; }
.dpl-swatch { display: inline-flex; flex-direction: column; align-items: center; gap: .25rem; cursor: pointer; }
.dpl-swatch-dot { width: 30px; height: 30px; border-radius: 50%; background: var(--sw); border: 2px solid #fff;
  box-shadow: 0 0 0 1.5px #cfc9be; transition: box-shadow .12s; }
.dpl-swatch-in:checked + .dpl-swatch .dpl-swatch-dot { box-shadow: 0 0 0 2px #b0872f; }
.dpl-swatch-in:focus-visible + .dpl-swatch .dpl-swatch-dot { box-shadow: 0 0 0 2px #b0872f, 0 0 0 4px #fbf6ea; }
.dpl-swatch-lab { font-size: 12px; color: #6a6459; }

/* plexi add-on */
.dpl-addon { display: flex; align-items: flex-start; gap: .6rem; padding: .65rem .8rem; border: 1.5px solid #ddd8cf;
  border-radius: 8px; cursor: pointer; }
.dpl-addon-in { margin-top: .2rem; }
.dpl-addon-body { display: flex; flex-direction: column; flex: 1; }
.dpl-addon-label { font-weight: 600; }
.dpl-addon-desc { font-size: 13px; color: #6a6459; }
.dpl-addon-price { font-weight: 600; color: #b0872f; white-space: nowrap; }

/* summary */
.dpl-summary { margin-top: 1rem; padding-top: .9rem; border-top: 1px solid #eee7db; }
.dpl-errors { color: #b3261e; font-size: 14px; margin-bottom: .4rem; }
.dpl-error { margin: 0 0 .2rem; }
.dpl-price { display: flex; align-items: baseline; justify-content: space-between; }
.dpl-price-lab { font-size: 13px; text-transform: uppercase; letter-spacing: .05em; color: #8a8378; }
.dpl-price-val { font-size: 1.7rem; font-weight: 700; color: #2a2722; }
.dpl.is-loading .dpl-price-val { opacity: .45; }

.dpl-breakdown { margin-top: .7rem; font-size: 13px; }
.dpl-breakdown summary { cursor: pointer; color: #6a6459; }
.dpl-admin-tag { font-size: 10px; text-transform: uppercase; letter-spacing: .05em; background: #eee7db;
  color: #8a6b1f; padding: 1px 6px; border-radius: 4px; }
.dpl-breakdown-table { width: 100%; margin-top: .5rem; border-collapse: collapse; }
.dpl-breakdown-table td { padding: 2px 0; }
.dpl-breakdown-table .dpl-num { text-align: right; font-variant-numeric: tabular-nums; }
.dpl-geo { margin: .5rem 0 0; font-size: 12px; color: #8a8378; }

.dpl-from { font-size: .75em; color: #8a8378; margin-right: .15em; }
