/* ==========================================================================
   Healthcare DME — Product archive layout
   Shop, product categories, product tags. Styles hdme-archive-product.php.
   ========================================================================== */

.hdme-archive {
	display: block;
	padding-block: clamp(0.75rem, 0.6rem + 0.5vw, 1.25rem) clamp(2.5rem, 1.6rem + 3vw, 4rem);
	background: var(--hdme-page-bg);
}

/* Avada's sidebar layout sizes the main element down; these templates manage
   their own two-column grid. */
.hdme-scope main.hdme-archive {
	width: 100% !important;
	max-width: none !important;
	float: none !important;
	margin: 0 !important;
}
.archive .fusion-sidebar,
.post-type-archive-product .fusion-sidebar,
.tax-product_cat .fusion-sidebar { display: none !important; }

/* ---- Breadcrumbs + heading --------------------------------------------- */

.hdme-archive__crumbs {
	margin-bottom: var(--hdme-space-3);
	font-size: var(--hdme-text-sm);
	color: var(--hdme-text-muted);
}
.hdme-archive__crumbs a { color: var(--hdme-link); }
.hdme-crumb-sep { margin-inline: var(--hdme-space-2); color: var(--hdme-grey-300); }

.hdme-archive__head { margin-bottom: var(--hdme-space-4); }
.hdme-archive__title {
	margin: 0 0 var(--hdme-space-3);
	font-size: var(--hdme-text-2xl);
	line-height: var(--hdme-leading-tight);
	font-weight: var(--hdme-weight-bold);
	color: var(--hdme-grey-900);
}
.hdme-archive__intro {
	max-width: var(--hdme-container-text);
	color: var(--hdme-grey-600);
	font-size: var(--hdme-text-base);
	line-height: var(--hdme-leading-normal);
}
.hdme-archive__intro p:last-child { margin-bottom: 0; }

/* ---- Sub-category chips -------------------------------------------------
   226 categories, heavily nested. Surfacing the children is the difference
   between drilling in and giving up. */

.hdme-chips {
	display: flex;
	flex-wrap: wrap;
	gap: var(--hdme-space-2);
	margin: 0 0 var(--hdme-space-5);
	padding: 0;
	list-style: none;
}
.hdme-chips a {
	display: inline-flex;
	align-items: center;
	gap: var(--hdme-space-2);
	min-height: 38px;
	padding: 0.4rem 0.85rem;
	border: 1px solid var(--hdme-blue-200);
	border-radius: var(--hdme-radius-pill);
	background: #fff;
	color: var(--hdme-grey-700);
	font-size: var(--hdme-text-sm);
	font-weight: var(--hdme-weight-medium);
	text-decoration: none;
	transition: border-color var(--hdme-transition), background-color var(--hdme-transition), color var(--hdme-transition);
}
.hdme-chips a:hover {
	border-color: var(--hdme-blue-400);
	background: var(--hdme-blue-50);
	color: var(--hdme-blue-800);
}
.hdme-chips__n {
	padding: 1px var(--hdme-space-2);
	border-radius: var(--hdme-radius-pill);
	background: var(--hdme-grey-100);
	color: var(--hdme-grey-600);
	font-size: var(--hdme-text-xs);
	font-weight: var(--hdme-weight-semi);
}

/* ---- Two-column body ---------------------------------------------------- */

.hdme-archive__body {
	display: grid;
	gap: var(--hdme-space-6);
	align-items: start;
}
@media (min-width: 1000px) {
	.hdme-archive__body { grid-template-columns: 262px minmax(0, 1fr); }
}

.hdme-archive__aside { min-width: 0; }
.hdme-archive__filters .widget,
.hdme-archive__filters > div {
	background: var(--hdme-surface);
	border: 1px solid var(--hdme-border);
	border-radius: var(--hdme-radius-lg);
	padding: var(--hdme-space-4) var(--hdme-space-5);
	margin-bottom: var(--hdme-space-4);
}

/* Filters collapse behind a button on smaller screens. */
.hdme-filter-toggle { display: none; width: 100%; margin-bottom: var(--hdme-space-4); }
@media (max-width: 999px) {
	.hdme-filter-toggle { display: inline-flex; }
	.hdme-archive__filters { display: none; }
	.hdme-archive__filters.is-open { display: block; }
}

/* ---- Toolbar ------------------------------------------------------------ */

/* Shared toolbar: the custom product grid is visible even when the old Woo
   display option is categories-only. Never leave its sorting controls empty. */
.hdme-app-sort { display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:12px; margin-bottom:20px; }
.hdme-app-sort .woocommerce-result-count { margin:0; float:none; font-size:14px; color:#526780; }
.hdme-app-sort__form { display:flex; flex-wrap:wrap; align-items:center; gap:8px; margin:0; }
.hdme-app-sort label { font-size:14px; color:#3d5876; font-weight:600; }
.hdme-app-sort select { min-height:44px; max-width:100%; padding:8px 12px; border:1px solid #b7cce6; border-radius:10px; background:#fff; font-size:16px; color:#193b65; }
.hdme-app-sort button { min-height:44px; padding:8px 16px; border:0; border-radius:10px; background:#3366ad; color:white; font:600 14px/1.4 var(--hdme-font-body); cursor:pointer; }
.hdme-app-sort :is(select,button):focus-visible { outline:3px solid #427ed1; outline-offset:3px; }

.hdme-archive__toolbar {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: var(--hdme-space-3);
	margin-bottom: var(--hdme-space-4);
	padding-bottom: var(--hdme-space-3);
	border-bottom: 1px solid var(--hdme-border);
}
.hdme-archive__count {
	margin: 0;
	font-size: var(--hdme-text-sm);
	color: var(--hdme-text-muted);
}
.hdme-archive__sort select {
	min-height: var(--hdme-tap-min);
	font-size: max(16px, var(--hdme-text-sm));
	border-radius: var(--hdme-radius);
	border: 1px solid var(--hdme-border-strong);
	padding-inline: var(--hdme-space-3);
	background: var(--hdme-surface);
}

/* ---- Grid --------------------------------------------------------------- */

.hdme-grid--archive { grid-template-columns: repeat(2, 1fr); }
@media (min-width: 560px)  { .hdme-grid--archive { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 760px)  { .hdme-grid--archive { grid-template-columns: repeat(3, 1fr); } }
@media (min-width: 1280px) { .hdme-grid--archive { grid-template-columns: repeat(4, 1fr); } }

.hdme-pcard__media { position: relative; display: block; }
.hdme-pcard__flag {
	position: absolute;
	top: var(--hdme-space-2);
	left: var(--hdme-space-2);
	padding: 2px var(--hdme-space-3);
	border-radius: var(--hdme-radius-pill);
	background: var(--hdme-danger);
	color: #fff;
	font-size: var(--hdme-text-xs);
	font-weight: var(--hdme-weight-bold);
}
.hdme-pcard__flag--out { background: var(--hdme-grey-500); }

/* ---- Pagination --------------------------------------------------------- */

.hdme-archive__pager { margin-top: var(--hdme-space-6); }
.hdme-archive__pager ul.page-numbers {
	display: flex;
	flex-wrap: wrap;
	gap: var(--hdme-space-2);
	justify-content: center;
	list-style: none;
	margin: 0;
	padding: 0;
	border: 0;
}
.hdme-archive__pager li { border: 0; }
.hdme-archive__pager li > a,
.hdme-archive__pager li > span {
	min-width: var(--hdme-tap-min);
	min-height: var(--hdme-tap-min);
	display: inline-flex;
	align-items: center;
	justify-content: center;
	padding-inline: var(--hdme-space-3);
	border: 1px solid var(--hdme-border);
	border-radius: var(--hdme-radius);
	background: var(--hdme-surface);
	color: var(--hdme-grey-700);
	font-weight: var(--hdme-weight-medium);
	text-decoration: none;
}
.hdme-archive__pager a:hover { border-color: var(--hdme-blue-300); background: var(--hdme-blue-50); }
.hdme-archive__pager .current { background: var(--hdme-blue-600); border-color: var(--hdme-blue-600); color: #fff; }

/* Avada sizes every .page-numbers as a single cell, including our list. */
body.hdme-scope .hdme-archive__pager.woocommerce-pagination { display:block;float:none;width:100%;height:auto;clear:both; }
body.hdme-scope .hdme-archive__pager.woocommerce-pagination > ul.page-numbers {
	display:flex!important;flex-wrap:wrap;justify-content:center;gap:8px;
	width:100%!important;height:auto!important;min-width:0;max-width:none;
	margin:0!important;padding:0!important;border:0!important;background:transparent!important;
}
body.hdme-scope .hdme-archive__pager li { display:block;float:none;flex:none;margin:0;padding:0;border:0; }
body.hdme-scope .hdme-archive__pager li > .page-numbers {
	display:inline-flex!important;width:auto!important;height:auto!important;
	min-width:44px;min-height:44px;margin:0!important;padding:8px 12px!important;
}
body.hdme-scope .hdme-archive__pager :is(.next,.prev)::after { display:none; }

/* ---- Empty state -------------------------------------------------------- */

.hdme-empty {
	text-align: center;
	padding: var(--hdme-space-9) var(--hdme-space-5);
	background: var(--hdme-surface);
	border: 1px dashed var(--hdme-border-strong);
	border-radius: var(--hdme-radius-lg);
}
.hdme-empty h2 { margin: 0 0 var(--hdme-space-2); font-size: var(--hdme-text-xl); color: var(--hdme-grey-900); }
.hdme-empty p  { margin: 0 auto var(--hdme-space-5); max-width: 46ch; color: var(--hdme-grey-600); }

/* ==========================================================================
   Category description, moved below the grid
   These are long SEO articles — several hundred words on some categories.
   Above the products they pushed the grid off the first screen.
   ========================================================================== */

.hdme-archive__about {
	margin-top: clamp(2rem, 1.4rem + 2vw, 3.5rem);
	padding: clamp(1.25rem, 1rem + 1.5vw, 2.25rem);
	background: var(--hdme-surface);
	border: 1px solid var(--hdme-border);
	border-radius: var(--hdme-radius-lg);
}
.hdme-archive__about-title {
	margin: 0 0 var(--hdme-space-4);
	padding-bottom: var(--hdme-space-3);
	border-bottom: 1px solid var(--hdme-border);
	font-size: var(--hdme-text-xl);
	font-weight: var(--hdme-weight-bold);
	color: var(--hdme-grey-900);
}
.hdme-archive__about .hdme-archive__intro {
	max-width: none;
	width: 100%;
	color: var(--hdme-grey-700);
	line-height: var(--hdme-leading-normal);
}

@media (max-width: 767px) {
	.hdme-archive { padding-top: var(--hdme-space-3); }
	.hdme-archive__crumbs { margin-bottom: var(--hdme-space-2); }
	.hdme-chips {
		flex-wrap: nowrap;
		overflow-x: auto;
		padding-bottom: var(--hdme-space-2);
		scrollbar-width: thin;
	}
	.hdme-chips li { flex: 0 0 auto; }
	.hdme-chips a { min-height: var(--hdme-tap-min); }
}
.hdme-archive__about h2,
.hdme-archive__about h3 {
	margin-top: var(--hdme-space-5);
	margin-bottom: var(--hdme-space-3);
	font-size: var(--hdme-text-lg);
	font-weight: var(--hdme-weight-semi);
	color: var(--hdme-grey-900);
}
.hdme-category-path {display:flex;align-items:center;flex-wrap:wrap;gap:10px;font-size:14px;margin:0 0 24px;color:#4f6682;}
.hdme-category-path a {color:#245591;text-decoration:underline;text-underline-offset:3px;}
.hdme-category-browse {margin:0 0 28px;}
.hdme-category-browse h2 {margin:0 0 6px;font-size:22px;color:#193b65;}
.hdme-category-browse>p {font-size:14px;color:#526a85;margin:0 0 16px;}
.hdme-category-more {margin-top:14px;}
.hdme-category-more summary {cursor:pointer;color:#245591;font-weight:600;padding:10px 0;}
.hdme-category-more[open] summary {margin-bottom:10px;}
.hdme-category-tiles {display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;list-style:none;margin:0;padding:0;}
.hdme-category-tiles li {min-width:0;}
.hdme-category-tiles a {display:flex;flex-direction:column;gap:6px;height:100%;padding:16px;background:#fff;border:1px solid #bdd1eb;border-radius:12px;color:#244c7e;transition:border-color .15s,box-shadow .15s;}
.hdme-category-tiles a:hover {border-color:#3366ad;box-shadow:0 4px 14px #183e6814;}
.hdme-category-tiles__title {font-size:15px;font-weight:600;line-height:1.4;}
.hdme-category-tiles__count,.hdme-category-tiles__summary {font-size:12px;color:#526a85;line-height:1.5;}
.hdme-category-path a:focus-visible,.hdme-category-tiles a:focus-visible {outline:3px solid #669be1;outline-offset:3px;}
.hdme-filters #hdme-category-search {width:100%;min-width:0;min-height:44px;border:1px solid #b7cbe2;border-radius:8px;padding:10px;font-size:16px;background:white;}
.hdme-filters__list a[aria-current=page] {background:#e4eefb;border-radius:8px;font-weight:600;}
@media(max-width:1000px) {.hdme-category-tiles {grid-template-columns:repeat(3,minmax(0,1fr));}}
@media(max-width:650px) {.hdme-category-tiles {grid-template-columns:repeat(2,minmax(0,1fr));}.hdme-category-tiles a {padding:12px;}}
@media(max-width:380px) {.hdme-category-tiles {grid-template-columns:1fr;}}