/* Dodos Store Sync. Inherits the theme's fonts and colours; change --dss-accent to match a brand. */
.dss-store,
.dss-locator {
	--dss-accent: #1a1a1a;
	--dss-accent-text: #fff;
	--dss-line: #e3e3e3;
	--dss-muted: #666;
	--dss-open: #1d7a3a;
	--dss-closed: #a3262a;
	--dss-card: #fafafa;
	--dss-radius: 6px;
}

.dss-main #content-area { padding: 40px 0 60px; }

/* Store page */
.dss-back { margin: 0 0 16px; padding: 0; font-size: 14px; }
.dss-back a { color: var(--dss-muted); text-decoration: none; }
.dss-back a:hover { text-decoration: underline; }
.dss-store__header { margin-bottom: 24px; }
.dss-store__name { margin: 0 0 8px; padding: 0; }
.dss-store__status { margin: 0; padding: 0; }
.dss-store__grid { display: grid; grid-template-columns: minmax(0, 1fr); gap: 32px; }
@media (min-width: 900px) {
	.dss-store__grid { grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); align-items: start; }
}
.dss-section { margin: 0 0 28px; }
.dss-section h2,
.dss-section h3 { margin: 0 0 8px; padding: 0; font-size: 18px; }
.dss-section address { font-style: normal; line-height: 1.6; margin-bottom: 12px; }
.dss-phone { font-size: 18px; margin: 0; padding: 0; }
.dss-store__map iframe { display: block; width: 100%; height: 420px; border: 0; border-radius: var(--dss-radius); background: #eee; }
.dss-notice { padding: 12px 16px; margin: 0 0 24px; border-left: 4px solid var(--dss-closed); background: #fbeeee; }

.dss-hours { width: 100%; max-width: 420px; border-collapse: collapse; border: 0; margin: 0; }
.dss-hours th,
.dss-hours td { padding: 6px 0; border: 0; border-bottom: 1px solid var(--dss-line); text-align: left; font-weight: normal; }
.dss-hours td { text-align: right; white-space: nowrap; }
.dss-hours tr.is-today th,
.dss-hours tr.is-today td { font-weight: 700; }

.dss-special { list-style: none; margin: 0; padding: 0; }
.dss-special li { display: flex; flex-wrap: wrap; gap: 4px 12px; padding: 6px 0; border-bottom: 1px solid var(--dss-line); }
.dss-special__date { min-width: 90px; font-weight: 600; }
.dss-special__note { color: var(--dss-muted); width: 100%; font-size: 14px; }

.dss-badge { display: inline-block; padding: 3px 10px; border-radius: 999px; font-size: 13px; font-weight: 600; line-height: 1.5; background: #eee; color: #333; }
.dss-badge--open { background: #e5f3e9; color: var(--dss-open); }
.dss-badge--closed { background: #f7e4e4; color: var(--dss-closed); }

.dss-button { display: inline-block; padding: 10px 18px; border: 1px solid var(--dss-accent); border-radius: var(--dss-radius); background: var(--dss-accent); color: var(--dss-accent-text); font-size: 15px; line-height: 1.3; text-decoration: none; cursor: pointer; }
.dss-button:hover { opacity: .88; color: var(--dss-accent-text); }
.dss-button--plain { background: transparent; color: var(--dss-accent); }
.dss-button--plain:hover { color: var(--dss-accent); }
.dss-button[disabled] { opacity: .6; cursor: progress; }

/* Store list */
.dss-locator__controls { display: flex; flex-wrap: wrap; gap: 12px 16px; align-items: flex-end; margin-bottom: 12px; }
.dss-field { display: flex; flex-direction: column; gap: 4px; margin: 0; }
.dss-field--search { flex: 1 1 260px; }
.dss-field__label { font-size: 13px; color: var(--dss-muted); }
.dss-field input,
.dss-field select { min-height: 42px; padding: 8px 12px; border: 1px solid #ccc; border-radius: var(--dss-radius); background: #fff; font-size: 15px; width: 100%; }
.dss-field--near { flex-direction: row; gap: 8px; }
.dss-locator__count { color: var(--dss-muted); font-size: 14px; margin: 0 0 16px; padding: 0; }
.dss-group__title { margin: 32px 0 8px; padding: 0; }
.dss-subgroup__title { margin: 20px 0 12px; padding: 0; font-size: 17px; color: var(--dss-muted); }
.dss-cards { list-style: none !important; margin: 0 !important; padding: 0 !important; display: grid; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); gap: 16px; }
.dss-cards--nearest { margin-top: 8px !important; }
.dss-card { margin: 0 !important; padding: 16px 18px; border: 1px solid var(--dss-line); border-radius: var(--dss-radius); background: var(--dss-card); display: flex; flex-direction: column; gap: 6px; }
.dss-store [hidden], .dss-locator [hidden] { display: none !important; }
.dss-card p { margin: 0; padding: 0; font-size: 14px; line-height: 1.5; }
.dss-card__name { margin: 0; padding: 0; font-size: 17px; line-height: 1.3; }
.dss-card__name a { color: inherit; text-decoration: none; }
.dss-card__name a:hover { text-decoration: underline; }
.dss-card__address { color: var(--dss-muted); }
.dss-card__state { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; }
.dss-card__distance { font-size: 13px; color: var(--dss-muted); }
.dss-card__more { margin-top: auto !important; padding-top: 4px !important; display: flex; flex-wrap: wrap; gap: 4px 16px; align-items: baseline; }
.dss-card__show { padding: 0; border: 0; background: none; color: var(--dss-muted); font: inherit; font-size: 14px; text-decoration: underline; cursor: pointer; }
.dss-card__show:hover { color: inherit; }
.dss-card.is-active { border-color: var(--dss-accent); box-shadow: 0 0 0 1px var(--dss-accent); }
.dss-locator__empty,
.dss-locator__geo-error { padding: 12px 0; color: var(--dss-muted); }
.dss-locator .screen-reader-text { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(1px, 1px, 1px, 1px); white-space: nowrap; }

/* Store list with a map: list and map side by side on wide screens, map above the list on phones. */
.dss-locator__map { height: 340px; border: 1px solid var(--dss-line); border-radius: var(--dss-radius); background: #eef0f2; z-index: 0; }
.dss-locator--map .dss-locator__layout { display: grid; grid-template-columns: minmax(0, 1fr); gap: 8px; }
.dss-locator--map .dss-group__title { margin-top: 24px; }
@media (min-width: 980px) {
	.dss-locator--map .dss-locator__layout { grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: 28px; align-items: start; }
	.dss-locator--map .dss-locator__map-wrap { order: 2; position: sticky; top: 24px; }
	.dss-locator--map .dss-locator__map { height: min(680px, calc(100vh - 48px)); }
	.dss-locator--map .dss-cards { grid-template-columns: minmax(0, 1fr); gap: 12px; }
	.dss-locator--map .dss-group:first-child .dss-group__title { margin-top: 0; }
}
.dss-locator .leaflet-container { font-family: inherit; }
.dss-locator .leaflet-control-attribution { font-size: 11px; line-height: 1.4; }
.dss-locator .leaflet-container a { color: inherit; }
.dss-locator .leaflet-control-attribution a { color: #0078a8; }
.dss-pin { color: var(--dss-accent); background: none; border: 0; filter: drop-shadow(0 1px 2px rgba(0, 0, 0, .35)); }
.dss-pin svg { display: block; }
.dss-cluster { display: flex !important; align-items: center; justify-content: center; border-radius: 50%; background: var(--dss-accent); color: var(--dss-accent-text); font-weight: 700; font-size: 14px; box-shadow: 0 0 0 5px rgba(0, 0, 0, .18); }
.dss-popup p { margin: 0 0 6px; padding: 0; font-size: 14px; line-height: 1.45; }
.dss-popup__name { font-weight: 700; font-size: 15px !important; }
.dss-popup__name a { text-decoration: none; }
.dss-popup__address { color: var(--dss-muted); }
.dss-popup__links { display: flex; flex-wrap: wrap; gap: 4px 14px; margin: 8px 0 0 !important; }
.dss-popup__links a { text-decoration: underline !important; }
.dss-locator .leaflet-popup-content { margin: 14px 16px; }