/* Travel edits: the same paper, espresso, sage, jade, terracotta and brass variables. */
.ccsb .ccsb-card-title { margin:.45rem 0 .65rem; color:var(--ccsb-ink); font:700 1.5rem/1.15 var(--ccsb-head); letter-spacing:-.015em; overflow-wrap:anywhere; }
.ccsb .ccsb-mini-label { display:block; color:var(--ccsb-accent); font:700 .62rem/1.4 var(--ccsb-body); text-transform:uppercase; letter-spacing:.12em; }
.ccsb .ccsb-card-copy { color:var(--ccsb-muted); font:.86rem/1.6 var(--ccsb-body); }
.ccsb-card-copy p { margin:.5rem 0; }
.ccsb-card-copy:empty, .ccsb-card-note:empty, .ccsb-mini-label:empty { display:none; }
.ccsb .ccsb-card-note { margin:.5rem 0 0; color:var(--ccsb-muted); font:.76rem/1.5 var(--ccsb-body); }
.ccsb-edit-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:1rem; }
.ccsb-edit-grid > *, .ccsb-capsule-grid > *, .ccsb-photo-grid > *, .ccsb-dress-grid > * { min-width:0; }
.ccsb-edit-media { position:relative; aspect-ratio:4/5; overflow:hidden; background:var(--ccsb-soft); }
.ccsb .ccsb-edit-image { display:block; width:100%; height:100%; object-fit:cover; }
.ccsb-edit-media.is-illustration { display:grid; place-items:center; background:radial-gradient(circle at 50% 40%,rgba(255,255,255,.7),transparent 68%),var(--ccsb-soft); }
.ccsb-tone-espresso .ccsb-edit-media.is-illustration { background:radial-gradient(circle at 50% 40%,rgba(201,164,99,.13),transparent 68%),var(--ccsb-soft); }
.ccsb-edit-media.is-illustration::after { content:""; position:absolute; bottom:6%; width:58%; height:8%; border-radius:50%; background:radial-gradient(ellipse,rgba(58,40,23,.14),transparent 70%); pointer-events:none; }
.ccsb-garment { display:block; width:78%; height:88%; filter:drop-shadow(3px 6px 3px rgba(49,34,22,.11)); }
.ccsb-outfit-art { position:relative; width:100%; height:100%; }
.ccsb-outfit-art .ccsb-garment { position:absolute; width:65%; height:69%; top:2%; left:0; transform:rotate(-8deg); }
.ccsb-outfit-art .ccsb-garment:nth-child(2) { width:53%; height:74%; top:20%; left:45%; transform:rotate(7deg); }
.ccsb-outfit-art .ccsb-garment:nth-child(3) { width:36%; height:40%; top:54%; left:5%; transform:rotate(-7deg); }
.ccsb-edit-body { padding:1.1rem; }
.ccsb-card-meta { display:flex; flex-wrap:wrap; justify-content:space-between; align-items:baseline; gap:.4rem; color:var(--ccsb-accent); font:700 .6rem/1.45 var(--ccsb-body); text-transform:uppercase; letter-spacing:.09em; }
.ccsb-card-meta > :empty { display:none; }
.ccsb-look, .ccsb-product, .ccsb-capsule-item, .ccsb-stay, .ccsb-photo-card { overflow:hidden; border:1px solid var(--ccsb-line); border-radius:15px; background:var(--ccsb-surface); }
.ccsb-look__visual { position:relative; }
.ccsb-look__number { position:absolute; top:.75rem; left:.75rem; display:block; padding:.3rem .55rem; border-radius:99px; background:#fffbf5; color:#2b1d16; box-shadow:0 2px 7px rgba(43,29,22,.08); font:700 .55rem/1.3 var(--ccsb-body); letter-spacing:.14em; }
.ccsb .ccsb-look-pieces { list-style:none; padding:0; margin:.8rem 0 .4rem; border-top:1px solid var(--ccsb-line); }
.ccsb-look-pieces li { position:relative; margin:0; padding:.45rem 0 .45rem .9rem; border-bottom:1px solid var(--ccsb-line); font:.76rem/1.45 var(--ccsb-body); color:var(--ccsb-muted); }
.ccsb-look-pieces li::before { content:""; position:absolute; left:0; top:.9rem; width:4px; height:4px; border-radius:50%; background:var(--ccsb-accent); }
.ccsb-filter-bar { display:flex; flex-wrap:wrap; justify-content:space-between; align-items:center; gap:.6rem; margin-bottom:1.25rem; }
.ccsb-filter-buttons { display:flex; flex-wrap:wrap; gap:.4rem; }
.ccsb-filter-buttons button { min-height:44px; max-width:100%; border:1px solid var(--ccsb-line); border-radius:99px; padding:.45rem .85rem; background:transparent; color:var(--ccsb-ink); font:600 .74rem/1.3 var(--ccsb-body); cursor:pointer; overflow-wrap:anywhere; }
.ccsb-filter-buttons button[aria-pressed=true] { border-color:var(--ccsb-accent); background:var(--ccsb-accent); color:var(--ccsb-on-accent); }
.ccsb-filter-count { color:var(--ccsb-muted); font:500 .68rem/1.4 var(--ccsb-body); }
.ccsb-disclosure { padding:.8rem 1rem; margin-bottom:1.2rem; border:1px solid var(--ccsb-line); border-radius:9px; color:var(--ccsb-muted); background:var(--ccsb-soft); font:.75rem/1.5 var(--ccsb-body); }
.ccsb-disclosure p { margin:0; }
.ccsb-capsule-summary { display:flex; align-items:center; gap:.65rem; margin-bottom:1.2rem; color:var(--ccsb-muted); font:.8rem/1.4 var(--ccsb-body); }
.ccsb-capsule-summary .ccsb-icon { color:var(--ccsb-accent); }
.ccsb-capsule-summary strong { font:700 2.1rem/1 var(--ccsb-head); color:var(--ccsb-ink); }
.ccsb-capsule-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:1rem; }
.ccsb-capsule-item { position:relative; }
.ccsb-capsule-item .ccsb-edit-media { aspect-ratio:1/1; }
.ccsb-capsule-item .ccsb-card-title { font-size:1.25rem; }
.ccsb-quantity { position:absolute; top:.65rem; right:.65rem; display:grid; place-items:center; min-width:31px; height:31px; border:1px solid var(--ccsb-line); border-radius:50%; background:var(--ccsb-surface); font:700 .72rem var(--ccsb-body); }
.ccsb .ccsb-product-price { margin:.6rem 0; color:var(--ccsb-accent); font:700 1.3rem/1.25 var(--ccsb-head); }
.ccsb-product .ccsb-button { margin-top:.6rem; }
.ccsb-dress-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:1rem; }
.ccsb-dress-card { padding:1.2rem; border:1px solid var(--ccsb-line); border-radius:14px; background:var(--ccsb-soft); }
.ccsb-round-icon { display:grid; place-items:center; width:40px; height:40px; margin-bottom:1rem; border:1px solid var(--ccsb-line); border-radius:50%; background:var(--ccsb-surface); color:var(--ccsb-accent); }
.ccsb-dress-card dl, .ccsb-stay dl, .ccsb-photo-card dl { display:grid; gap:.8rem; margin:1rem 0; }
.ccsb-dress-card dt, .ccsb-stay dt, .ccsb-photo-card dt { color:var(--ccsb-accent); font:700 .59rem/1.4 var(--ccsb-body); text-transform:uppercase; letter-spacing:.1em; }
.ccsb-dress-card dd, .ccsb-stay dd, .ccsb-photo-card dd { margin:.3rem 0 0; color:var(--ccsb-muted); font:.82rem/1.5 var(--ccsb-body); overflow-wrap:anywhere; }
.ccsb-stay .ccsb-edit-media { aspect-ratio:3/2; }
.ccsb-stay-top { display:flex; justify-content:space-between; align-items:center; gap:.6rem; }
.ccsb-stay-top > :last-child { font:300 2.5rem/1 var(--ccsb-head); color:var(--ccsb-accent); opacity:.5; }
.ccsb-stay dl { padding-top:1rem; border-top:1px solid var(--ccsb-line); }
.ccsb .ccsb-route-label { display:flex; align-items:center; gap:.6rem; margin:0 0 1rem; color:var(--ccsb-accent); font:600 .9rem/1.5 var(--ccsb-body); }
.ccsb .ccsb-transport-table, .ccsb .ccsb-comparison-table { width:100%; table-layout:fixed; border-collapse:separate; border-spacing:0; margin:0; color:var(--ccsb-ink); font:.83rem/1.5 var(--ccsb-body); }
.ccsb-transport-table th, .ccsb-transport-table td, .ccsb-comparison-table th, .ccsb-comparison-table td { padding:1rem .85rem; border-bottom:1px solid var(--ccsb-line); text-align:left; vertical-align:top; overflow-wrap:anywhere; }
.ccsb-transport-table thead th, .ccsb-comparison-table thead th { background:var(--ccsb-soft); color:var(--ccsb-accent); font:700 .65rem/1.45 var(--ccsb-body); text-transform:uppercase; letter-spacing:.08em; }
.ccsb-transport-table th:first-child { width:25%; }
.ccsb-transport-table th:nth-child(2), .ccsb-transport-table th:nth-child(3) { width:15%; }
.ccsb-transport-table p, .ccsb-comparison-table p { margin:0; }
.ccsb-transport-table .ccsb-link { font-size:.73rem; }
.ccsb .ccsb-pick { display:inline-block; margin:.4rem 0 0; padding:.23rem .4rem; border-radius:99px; background:var(--ccsb-accent); color:var(--ccsb-on-accent); font:700 .53rem/1.3 var(--ccsb-body); text-transform:uppercase; letter-spacing:.09em; white-space:nowrap; }
.ccsb-transport-table th .ccsb-pick { display:table; }
.ccsb-comparison-table thead td, .ccsb-comparison-table tbody th { width:28%; }
.ccsb-comparison-table thead th { width:36%; text-transform:none; font:700 1.3rem/1.3 var(--ccsb-head); }
.ccsb-comparison-table th.is-picked { box-shadow:inset 0 3px 0 var(--ccsb-accent); }
.ccsb-comparison-table thead th .ccsb-pick { display:table; margin-top:.6rem; }
.ccsb-verdict { display:flex; align-items:flex-start; gap:.8rem; margin-top:1.2rem; padding:1rem; border:1px solid var(--ccsb-line); border-radius:12px; background:var(--ccsb-soft); color:var(--ccsb-muted); font:.86rem/1.6 var(--ccsb-body); }
.ccsb-verdict .ccsb-icon { color:var(--ccsb-accent); }
.ccsb-verdict p { margin:0; }
.ccsb-swaps { display:grid; gap:1.4rem; }
.ccsb-swap + .ccsb-swap { padding-top:1.3rem; border-top:1px solid var(--ccsb-line); }
.ccsb-swap-pair { display:grid; grid-template-columns:minmax(0,1fr) 35px minmax(0,1fr); align-items:stretch; margin:1rem 0 .65rem; }
.ccsb-swap-skip, .ccsb-swap-try { min-width:0; padding:1rem; border-radius:12px; background:var(--ccsb-soft); border:1px solid var(--ccsb-line); }
.ccsb-swap-skip { border-top:3px solid #bb775e; }
.ccsb-swap-try { border-top:3px solid #6c927c; }
.ccsb-swap-pair p { margin:.5rem 0 0; font:600 .92rem/1.5 var(--ccsb-body); }
.ccsb-swap-arrow { display:grid; place-items:center; color:var(--ccsb-accent); }
.ccsb .ccsb-prep-timeline { list-style:none; margin:0; padding:0; }
.ccsb-prep-timeline > li { display:grid; grid-template-columns:46px minmax(0,1fr); gap:1rem; position:relative; margin:0; padding:0 0 1.6rem; }
.ccsb-prep-timeline > li:last-child { padding-bottom:0; }
.ccsb-prep-timeline > li:not(:last-child)::before { content:""; position:absolute; top:43px; bottom:6px; left:22px; width:1px; background:var(--ccsb-line); }
.ccsb-prep-number { display:grid; place-items:center; align-self:start; width:44px; height:44px; border:1px solid var(--ccsb-line); border-radius:50%; background:var(--ccsb-soft); color:var(--ccsb-accent); font:700 .9rem var(--ccsb-head); }
.ccsb-photo-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:1rem; }
.ccsb-photo-card .ccsb-edit-media { aspect-ratio:16/10; }
.ccsb-photo-card .ccsb-garment { width:65%; height:100%; }
.ccsb-editor-media .components-button { margin:0 8px 12px 0; }
.ccsb-extra-row-fields input[type=color] { width:80px; height:40px; padding:3px; }

@container(max-width:700px) {
	.ccsb-edit-grid, .ccsb-dress-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
	.ccsb-capsule-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
	.ccsb-filter-count { flex-basis:100%; }
	.ccsb-transport-table, .ccsb-transport-table tbody { display:block; }
	.ccsb-transport-table thead { position:absolute; width:1px; height:1px; clip-path:inset(50%); overflow:hidden; }
	.ccsb-transport-table tbody { display:grid; gap:1rem; }
	.ccsb-transport-table tr { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); border:1px solid var(--ccsb-line); border-radius:12px; padding:.3rem .85rem; }
	.ccsb-transport-table tbody th { grid-column:1/-1; display:flex; flex-wrap:wrap; align-items:center; gap:.5rem; width:auto; }
	.ccsb-transport-table td { display:block; border-bottom:0; }
	.ccsb-transport-table td::before { content:attr(data-label); display:block; color:var(--ccsb-accent); font:700 .61rem/1.4 var(--ccsb-body); text-transform:uppercase; letter-spacing:.08em; margin-bottom:.4rem; }
	.ccsb-transport-table td:last-child { grid-column:1/-1; border-top:1px solid var(--ccsb-line); }
	.ccsb-transport-table .ccsb-pick { margin:0; }
}
@container(max-width:450px) {
	.ccsb-edit-grid, .ccsb-dress-grid, .ccsb-photo-grid { grid-template-columns:1fr; }
	.ccsb-looks .ccsb-edit-media { aspect-ratio:5/4; }
	.ccsb-product .ccsb-edit-media { aspect-ratio:5/4; }
	.ccsb-capsule-item .ccsb-edit-body { padding:.75rem; }
	.ccsb-capsule-item .ccsb-card-title { font-size:1.1rem; }
	.ccsb .ccsb-comparison-table { font-size:.73rem; }
	.ccsb-comparison-table th, .ccsb-comparison-table td { padding:.75rem .45rem; }
	.ccsb-comparison-table thead th { font-size:1.05rem; }
	.ccsb-comparison-table thead td, .ccsb-comparison-table tbody th { width:26%; }
	.ccsb-swap-pair { grid-template-columns:1fr; gap:.4rem; }
	.ccsb-swap-arrow { min-height:25px; transform:rotate(90deg); }
	.ccsb-filter-buttons button { padding-inline:.7rem; }
	.ccsb-prep-timeline > li { grid-template-columns:36px minmax(0,1fr); gap:.8rem; }
	.ccsb-prep-number { width:34px; height:34px; }
	.ccsb-prep-timeline > li:not(:last-child)::before { top:34px; left:16px; }
}
