/* WASH data pages (wash.php, wash_list.php, wash_details.php) – loaded only on those templates. */

.dsk-wash { padding-top: 32px; padding-bottom: 56px; }
.dsk-wash .section-heading { margin-bottom: 24px; }
.dsk-wash__meta { color: var(--dsk-muted, #5f6b7a); margin: 6px 0 0; font-size: 15px; }
.dsk-wash__summary { max-width: 980px; margin: 0 auto 48px; }

.dsk-table {
	background: var(--dsk-surface, #fff);
	border: 1px solid var(--dsk-border, #e3e8ef) !important;
	border-radius: var(--dsk-radius, 10px);
	overflow: hidden;
	box-shadow: var(--dsk-shadow, 0 6px 24px rgba(8, 82, 158, .08));
	font-size: 15px;
	margin-bottom: 0;
}
.dsk-table caption {
	caption-side: top;
	padding: 0 0 12px;
	font-weight: 700;
	font-size: 18px;
	color: var(--dsk-text, #2b2f36);
	text-align: left;
}
.dsk-table > thead > tr > th {
	background: var(--dsk-primary, #08529e);
	color: #fff;
	border: 0 !important;
	font-weight: 600;
	padding: 12px 14px;
	white-space: nowrap;
}
.dsk-table td, .dsk-table tbody th, .dsk-table tfoot th {
	padding: 11px 14px !important;
	border-top: 1px solid var(--dsk-border, #e3e8ef) !important;
	vertical-align: middle !important;
}
.dsk-table tbody tr:nth-child(even) td { background: var(--dsk-surface-alt, #f6f8fb); }
.dsk-table tbody tr:hover td { background: #eef4fb; }
.dsk-table .num { text-align: right; font-variant-numeric: tabular-nums; }
.dsk-table tfoot th, .dsk-table tfoot td { background: #eaf1f9; font-weight: 700; }
.dsk-table__group th {
	background: #e9f0f8 !important;
	color: var(--dsk-primary, #08529e);
	font-size: 16px;
	font-weight: 700;
}
.dsk-table__subtotal th, .dsk-table__subtotal td { background: #fafbfd !important; color: var(--dsk-muted, #5f6b7a); }

.dsk-table--details th { width: 38%; background: var(--dsk-surface-alt, #f6f8fb); font-weight: 600; color: var(--dsk-muted, #5f6b7a); }

.dsk-btn-link {
	display: inline-block;
	padding: 5px 12px;
	border-radius: 999px;
	background: rgba(8, 82, 158, .08);
	color: var(--dsk-primary, #08529e);
	font-weight: 600;
	font-size: 14px;
	text-decoration: none !important;
	white-space: nowrap;
}
.dsk-btn-link:hover { background: var(--dsk-primary, #08529e); color: #fff; }

.dsk-wash__photos { display: flex; flex-wrap: wrap; gap: 12px; }
.dsk-wash__photos img { border-radius: 8px; object-fit: cover; box-shadow: 0 2px 10px rgba(0, 0, 0, .08); }

.dsk-wash__map {
	width: 100%;
	height: 340px;
	margin-top: 24px;
	border-radius: var(--dsk-radius, 10px);
	overflow: hidden;
	box-shadow: var(--dsk-shadow, 0 6px 24px rgba(8, 82, 158, .08));
}

.dsk-wash-notice {
	padding: 18px 20px;
	border-left: 4px solid var(--dsk-accent, #ed3889);
	background: var(--dsk-surface-alt, #f6f8fb);
	border-radius: 6px;
}

/* Mobile: list table turns into cards using the data-label attributes. */
@media (max-width: 640px) {
	.dsk-wash .table-responsive { border: 0; overflow-x: auto; -webkit-overflow-scrolling: touch; }
	.dsk-table td, .dsk-table tbody th, .dsk-table tfoot th { padding: 9px 10px !important; }
	.dsk-btn-link { padding: 4px 10px; font-size: 13px; }
	.dsk-wash__summary { margin-bottom: 32px; }
	.dsk-table thead th, .dsk-table > thead > tr > th { white-space: normal; padding: 10px; }
	.dsk-table td[data-label] { display: flex; justify-content: space-between; gap: 12px; text-align: right; }
	.dsk-table td[data-label]::before { content: attr(data-label); font-weight: 600; color: var(--dsk-muted, #5f6b7a); text-align: left; }
	.dsk-table tr:has(td[data-label]) { display: block; border-bottom: 6px solid var(--dsk-surface-alt, #f6f8fb); }
	.dsk-table tr:has(td[data-label]) td { display: flex; border-top: 0 !important; }
	.dsk-table thead:has(+ tbody td[data-label]) { display: none; }
	.dsk-table--details th { width: 45%; }
	.dsk-wash__map { height: 260px; }
}

/* Small phones: let the tables wrap so they fit the screen instead of scrolling sideways. */
@media (max-width: 640px) {
	.dsk-table { font-size: 13px; }
	.dsk-table caption { white-space: normal; font-size: 16px; }
	.dsk-table th, .dsk-table td { white-space: normal !important; overflow-wrap: break-word; }
	.dsk-wash__yearwise thead th:first-child,
	.dsk-wash__yearwise tbody td:first-child:empty { display: none; }
	.dsk-btn-link { white-space: nowrap; padding: 4px 8px; }
}

/* Year-wise table: one row per year, breakdown opens on demand. */
.dsk-wash__yearwise { max-width: 980px; margin: 0 auto; }
.dsk-wy .dsk-wy__action { text-align: right; width: 1%; white-space: nowrap; }
.dsk-wy__row th { font-size: 16px; color: var(--dsk-primary, #08529e); }
.dsk-wy__row.is-open th, .dsk-wy__row.is-open td { background: #e9f0f8 !important; }
.dsk-wy__row.is-open .dsk-wy__toggle { background: var(--dsk-primary, #08529e); color: #fff; }
.dsk-wy__toggle { min-width: 72px; text-align: center; }
.dsk-wy__panel > td { padding: 0 !important; background: #fff !important; }
.dsk-wy__body { padding: 12px 14px 16px; color: var(--dsk-muted, #5f6b7a); }
.dsk-wy__panel[hidden] { display: none !important; }
.dsk-table--inner { box-shadow: none; border-radius: 6px; font-size: 14px; margin: 0; }
.dsk-table--inner > thead > tr > th { background: #5a7fa8; padding: 9px 12px; }
.dsk-table--inner td { padding: 8px 12px !important; }
@media (max-width: 640px) {
	.dsk-wy__body { padding: 8px 4px 12px; }
	/* The panel row contains the inner table – don't let the card rules turn it into a block. */
	.dsk-wy__panel:not([hidden]) { display: table-row !important; border-bottom: 0 !important; }
	.dsk-wy__panel > td { display: table-cell !important; }
	.dsk-wy .dsk-wy__toggle { min-width: 58px; padding: 4px 8px; }
	.dsk-wy > thead { display: table-header-group !important; }
	.dsk-wy > thead th:first-child { display: table-cell !important; }
	/* Keep the year breakdown a compact table on phones (not cards). */
	.dsk-table--inner thead,
	.dsk-table--inner thead:has(+ tbody td[data-label]) { display: table-header-group !important; }
	.dsk-table--inner tr,
	.dsk-table--inner tr:has(td[data-label]) { display: table-row !important; border-bottom: 0 !important; }
	.dsk-table--inner td,
	.dsk-table--inner td[data-label] { display: table-cell !important; text-align: left; border-top: 1px solid var(--dsk-border, #e3e8ef) !important; padding: 7px 6px !important; }
	.dsk-table--inner td[data-label]::before { content: none !important; }
	.dsk-table--inner .num { text-align: right !important; }
	.dsk-table--inner > thead > tr > th { padding: 8px 6px; font-size: 12px; }
	/* Hardware Category is not needed on a small screen – the type says it. */
	.dsk-table--inner th:first-child,
	.dsk-table--inner td:first-child { display: none !important; }
}

/* Tabs: Hardware Summary | Year-wise Establishment */
.dsk-wash-tabs {
	display: flex;
	justify-content: center;
	gap: 6px;
	max-width: 980px;
	margin: 0 auto 28px;
	padding: 6px;
	background: var(--dsk-surface-alt, #f6f8fb);
	border: 1px solid var(--dsk-border, #e3e8ef);
	border-radius: 999px;
	width: fit-content;
}
.dsk-wash-tabs[hidden] { display: none !important; }
.dsk-wash-tabs__tab {
	appearance: none;
	border: 0;
	background: transparent;
	color: var(--dsk-primary, #08529e);
	font-weight: 600;
	font-size: 15px;
	line-height: 1.2;
	padding: 10px 22px;
	border-radius: 999px;
	cursor: pointer;
	transition: background-color .2s ease, color .2s ease;
}
.dsk-wash-tabs__tab:hover { background: rgba(8, 82, 158, .08); }
.dsk-wash-tabs__tab.is-active { background: var(--dsk-primary, #08529e); color: #fff; box-shadow: 0 4px 12px rgba(8, 82, 158, .25); }
.dsk-wash-tabs__tab:focus-visible { outline: 3px solid rgba(8, 82, 158, .35); outline-offset: 2px; }
.dsk-wash-panel[hidden] { display: none !important; }
.dsk-wash-has-tabs .dsk-wash__summary { margin-bottom: 0; }
@media (max-width: 640px) {
	.dsk-wash-tabs { width: 100%; border-radius: 12px; }
	.dsk-wash-tabs__tab { flex: 1 1 0; padding: 10px 8px; font-size: 14px; border-radius: 9px; }
}

/* Wash list: back link, year filter chips, pager */
.dsk-wash__back { margin: 0 0 14px; }
.dsk-wash__back a { font-weight: 600; text-decoration: none; }
.dsk-wash-years { display: flex; flex-wrap: wrap; gap: 8px; margin: 0 0 22px; }
.dsk-wash-years__chip {
	display: inline-flex; align-items: center; gap: 6px;
	padding: 6px 12px; border-radius: 999px;
	border: 1px solid var(--dsk-border, #e3e8ef); background: #fff;
	color: var(--dsk-primary, #08529e) !important; font-weight: 600; font-size: 14px; text-decoration: none !important;
}
.dsk-wash-years__chip span { font-weight: 400; font-size: 12px; color: var(--dsk-muted, #5f6b7a); }
.dsk-wash-years__chip:hover { border-color: var(--dsk-primary, #08529e); }
.dsk-wash-years__chip.is-active { background: var(--dsk-primary, #08529e); border-color: var(--dsk-primary, #08529e); color: #fff !important; }
.dsk-wash-years__chip.is-active span { color: rgba(255, 255, 255, .85); }
.dsk-wash-pager { display: flex; align-items: center; justify-content: center; gap: 14px; margin-top: 20px; flex-wrap: wrap; }
.dsk-wash-pager__info { color: var(--dsk-muted, #5f6b7a); font-size: 14px; }

/* Photo pop-up (wash-details) */
.dsk-wash-photo { display: inline-block; position: relative; cursor: zoom-in; border-radius: 8px; overflow: hidden; }
.dsk-wash-photo img { display: block; transition: transform .25s ease; }
.dsk-wash-photo:hover img, .dsk-wash-photo:focus-visible img { transform: scale(1.04); }
html.dsk-lb-open { overflow: hidden; }
.dsk-lb { position: fixed; inset: 0; z-index: 999999; display: flex; align-items: center; justify-content: center; padding: 56px 64px; }
.dsk-lb[hidden] { display: none !important; }
.dsk-lb__backdrop { position: absolute; inset: 0; background: rgba(10, 20, 35, .88); animation: dsk-lb-fade .15s ease-out; }
.dsk-lb__box { position: relative; margin: 0; max-width: 100%; max-height: 100%; display: flex; flex-direction: column; align-items: center; animation: dsk-lb-pop .18s ease-out; }
.dsk-lb__img { display: block; max-width: min(1100px, 100%); max-height: calc(100vh - 150px); width: auto; height: auto; border-radius: 8px; background: #222; box-shadow: 0 20px 60px rgba(0, 0, 0, .5); }
.dsk-lb__bar { display: flex; gap: 16px; justify-content: space-between; width: 100%; margin-top: 10px; color: #fff; font-size: 14px; }
.dsk-lb__count { opacity: .75; white-space: nowrap; }
.dsk-lb__btn { position: absolute; border: 0; background: rgba(255, 255, 255, .12); color: #fff; width: 44px; height: 44px; border-radius: 50%; font-size: 30px; line-height: 1; cursor: pointer; display: flex; align-items: center; justify-content: center; }
.dsk-lb__btn:hover, .dsk-lb__btn:focus-visible { background: rgba(255, 255, 255, .25); outline: none; }
.dsk-lb__btn[hidden] { display: none; }
.dsk-lb__close { top: 10px; right: 12px; }
.dsk-lb__prev { left: 10px; top: 50%; transform: translateY(-50%); }
.dsk-lb__next { right: 10px; top: 50%; transform: translateY(-50%); }
@media (max-width: 640px) {
	.dsk-lb { padding: 56px 8px 24px; }
	.dsk-lb__prev, .dsk-lb__next { top: auto; bottom: 14px; transform: none; }
	.dsk-lb__prev { left: calc(50% - 54px); }
	.dsk-lb__next { right: calc(50% - 54px); }
	.dsk-lb__img { max-height: calc(100vh - 170px); }
}
@keyframes dsk-lb-fade { from { opacity: 0; } }
@keyframes dsk-lb-pop { from { opacity: 0; transform: scale(.97); } }
@media (prefers-reduced-motion: reduce) { .dsk-lb__backdrop, .dsk-lb__box, .dsk-wash-photo img { animation: none; transition: none; } }

/* Summary and Year-wise tables: same width. */
.dsk-wash__summary, .dsk-wash__yearwise { max-width: 980px; margin-left: auto; margin-right: auto; }
.dsk-wash__summary .dsk-table, .dsk-wash__yearwise .dsk-wy { width: 100%; }