/* The couple's Pass editor (Film + Pass, v185): js/occasi-studio-weekend.js. Uses the studio's own tokens. */
.pass-editor{display:grid;gap:10px}
.pass-editor>.help{margin:0 0 4px}
.pass-step{border:1px solid var(--line,#dce1d8);border-radius:10px;background:var(--white,#fffdf8)}
.pass-step>summary{display:flex;align-items:baseline;justify-content:space-between;gap:12px;padding:14px 16px;cursor:pointer;list-style:none;font-weight:600;font-size:15px;min-height:48px}
.pass-step>summary::-webkit-details-marker{display:none}
.pass-step>summary::after{content:'';flex:0 0 auto;width:8px;height:8px;border-right:1.5px solid currentColor;border-bottom:1.5px solid currentColor;transform:rotate(45deg) translateY(-3px);margin-left:4px;align-self:center;transition:transform .15s}
.pass-step[open]>summary::after{transform:rotate(225deg) translateY(-1px)}
.pass-step>summary small{flex:1 1 auto;text-align:right;font-weight:400;font-size:13px;color:var(--muted,#65736e);min-width:0;overflow-wrap:anywhere}
.pass-editor .pass-step>.pass-step-body{padding:2px 16px 16px;display:grid;gap:4px}
.pass-editor input[type=color]{-webkit-appearance:none;appearance:none;width:44px;height:38px;min-height:0;padding:3px;border:1px solid #c9d0c6;border-radius:6px;background:#fff;cursor:pointer;flex:0 0 auto}
.pass-editor input[type=color]::-webkit-color-swatch-wrapper{padding:0}
.pass-editor input[type=color]::-webkit-color-swatch{border:0;border-radius:4px}
.pass-editor input[type=color]::-moz-color-swatch{border:0;border-radius:4px}
.pass-step-body .field{margin-bottom:8px}
.pass-sub{font:600 13px/1.3 var(--sans,'DM Sans',sans-serif);letter-spacing:.06em;text-transform:uppercase;color:var(--muted,#65736e);margin:16px 0 6px}
.pass-mini{font-size:13px;font-weight:600;margin:10px 0 6px}
.pass-warn{color:#9a3d2b}
.pass-ev{border-left:6px solid var(--ec);padding-left:14px}
.pass-ev-head{display:flex;gap:10px;align-items:center;margin-bottom:6px}
.pass-ev-head strong{display:block;font-size:16px}
.pass-ev-head small{display:block;color:var(--muted,#65736e);font-size:13px}
.pass-ev-bar{width:14px;height:14px;border-radius:50%;background:var(--ec);flex:0 0 auto;box-shadow:0 0 0 3px color-mix(in srgb,var(--ec) 22%,transparent)}
.pass-swatches{border:0;margin:6px 0 4px;padding:0;display:flex;flex-wrap:wrap;gap:8px;align-items:center;min-width:0}
.pass-swatches legend{font-size:14px;font-weight:600;padding:0;margin-bottom:6px}
.pass-swatch{width:32px;height:32px;border-radius:50%;border:2px solid #fff;background:var(--c);box-shadow:0 0 0 1px #c9d0c6;padding:0}
.pass-swatch[aria-pressed="true"]{box-shadow:0 0 0 2px var(--ink,#183f4b)}
.pass-custom{display:inline-flex;align-items:center;gap:6px;font-size:13px;margin-left:4px}
.pass-custom input{width:40px;height:32px;padding:0;border:1px solid #c9d0c6;border-radius:6px;background:none}
.pass-dcolours{display:grid;gap:8px}
.pass-dcolour{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:8px;align-items:center}
.pass-editor .pass-dcolour>*,.pass-editor .pass-dcolour .colour-picker{margin:0}
.pass-dlabel{min-height:40px;padding:6px 10px;border:1px solid #c9d0c6;border-radius:5px;background:#fff;min-width:0}
.pass-chips{display:flex;flex-wrap:wrap;gap:6px}
.pass-chip{display:inline-flex;align-items:center;gap:6px;min-height:36px;padding:4px 12px 4px 6px;border:1px solid #c9d0c6;border-radius:999px;background:#fff;font-size:13px}
.pass-chip::before{content:'';width:20px;height:20px;border-radius:50%;background:var(--c);box-shadow:inset 0 0 0 1px rgba(0,0,0,.12)}
.pass-modes{border:0;margin:4px 0 8px;padding:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;min-width:0}
.pass-modes legend{font-size:14px;font-weight:600;padding:0;margin-bottom:8px}
.pass-mode{display:flex;gap:10px;align-items:flex-start;padding:12px;border:1px solid #c9d0c6;border-radius:10px;background:#fff;cursor:pointer;min-height:64px}
.pass-mode input{margin-top:4px;flex:0 0 auto}
.pass-mode b{display:block;font-size:14px}
.pass-mode small{display:block;font-size:13px;color:var(--muted,#65736e);line-height:1.35}
.pass-mode:has(input:checked){border-color:var(--ink,#183f4b);box-shadow:0 0 0 1px var(--ink,#183f4b)}
.pass-switch{font-weight:600}
.pass-checks{border:0;margin:8px 0;padding:0;min-width:0}
.pass-checks legend{font-size:14px;font-weight:600;padding:0}
.pass-pinstate{margin-top:-4px;font-size:13px;overflow-wrap:anywhere}
.pass-addrow{display:flex;flex-wrap:wrap;gap:8px;margin-top:4px}
.pass-place .field{margin-bottom:6px}
.pass-langs{margin-top:4px}
.pass-timeline{list-style:none;margin:0 0 8px;padding:0 0 0 18px;border-left:2px solid var(--line,#dce1d8);display:grid;gap:10px}
.pass-timeline li{position:relative;display:grid;grid-template-columns:minmax(0,1fr) auto;gap:0 10px;font-size:14px}
.pass-timeline li::before{content:'';position:absolute;left:-25px;top:6px;width:10px;height:10px;border-radius:50%;background:var(--white,#fffdf8);border:2px solid #9aa79f}
.pass-timeline li.is-now::before{background:var(--coral,#bb6d59);border-color:var(--coral,#bb6d59)}
.pass-timeline li span{color:var(--muted,#65736e);font-size:13px;text-align:right}
.pass-timeline li small{grid-column:1/-1;color:var(--muted,#65736e);font-size:13px}
@media (max-width:560px){
  .pass-step>summary{flex-wrap:wrap;padding:14px}
  .pass-step>summary small{flex-basis:100%;order:3;text-align:left}
  .pass-step>summary::after{order:2;margin-left:auto}
  .pass-editor .pass-step>.pass-step-body{padding:2px 12px 14px}
  .pass-modes{grid-template-columns:minmax(0,1fr)}
  .pass-ev{padding-left:10px}
  .pass-timeline li{grid-template-columns:minmax(0,1fr)}
  .pass-timeline li span{text-align:left}
}
