/* PLANET Site Blocks: base layer shared by every component.
   Tokens (--psb-navy, --psb-radius-*, …) are printed inline from Settings. Logical properties only, so RTL needs no extra sheet. */

.psb {
	--psb-ink: #1E2B36;
	--psb-on-dark: #C9D6E2;
	--psb-zebra: #F7F8F6;
	--psb-line-strong: #CBD0CC;
	--psb-white: #FFFFFF;
	--psb-container: 1280px;
	--psb-gutter: 24px;
	--psb-font-body: 'Barlow', system-ui, sans-serif;
	--psb-font-heading: 'Barlow Condensed', sans-serif;
	--psb-font-code: 'Barlow Condensed', sans-serif;
	--psb-space: var(--psb-section-space, 88px);
	font-family: var(--psb-font-body);
	color: var(--psb-ink);
	font-size: 17px;
	line-height: 1.55;
	box-sizing: border-box;
}
.psb *, .psb *::before, .psb *::after { box-sizing: inherit; }

/* Arabic: IBM Plex Sans Arabic for everything except model codes. */
.psb:lang(ar), [dir="rtl"] .psb, .psb[dir="rtl"] {
	--psb-font-body: 'IBM Plex Sans Arabic', system-ui, sans-serif;
	--psb-font-heading: 'IBM Plex Sans Arabic', system-ui, sans-serif;
}

/* Section wrapper: background, spacing, anchor offset. */
.psb-section { background: var(--psb-white); scroll-margin-block-start: 96px; }
.psb-section[data-bg="ground"] { background: var(--psb-ground); }
.psb-section[data-bg="navy"] { background: var(--psb-navy); color: var(--psb-white); }
.psb-section[data-bg="deep"] { background: var(--psb-deep-navy); color: var(--psb-on-dark); }
.psb-section[data-bg="teal"] { background: var(--psb-teal); color: var(--psb-white); }
.psb-section[data-bg="transparent"] { background: transparent; }
.psb-container {
	/* !important: Astra's page-builder layout sets max-width: none on every grandchild of .entry-content. */
	max-width: var(--psb-container) !important;
	margin-inline: auto;
	padding-inline: var(--psb-gutter);
	padding-block: var(--psb-space);
}
.psb-section[data-spacing="compact"] .psb-container { padding-block: calc(var(--psb-space) / 2); }
.psb-section[data-spacing="tight"] .psb-container { padding-block: 22px; }
.psb-section[data-spacing="none"] .psb-container { padding-block: 0; }
@media (max-width: 767px) {
	.psb { --psb-space: var(--psb-section-space-mobile, 56px); --psb-gutter: 16px; }
}

/* Type scale (desktop → mobile via clamp). */
.psb-h1, .psb-h2, .psb-h3 {
	font-family: var(--psb-font-heading);
	font-weight: 700;
	color: var(--psb-navy);
	margin-block: 0 14px;
	overflow-wrap: anywhere;
}
.psb-h1 { font-size: clamp(44px, 6vw, 76px); line-height: 0.94; letter-spacing: -0.015em; margin-block-end: 22px; }
.psb-h2 { font-size: clamp(34px, 4.2vw, 52px); line-height: 1; }
.psb-h3 { font-size: clamp(24px, 2.4vw, 30px); line-height: 1.1; margin-block: 0 10px; }
.psb-dark .psb-h1,
.psb-dark .psb-h2,
.psb-dark .psb-h3 { color: var(--psb-white); }
.psb:lang(ar) .psb-h1, [dir="rtl"] .psb .psb-h1 { font-size: clamp(38px, 4.8vw, 60px); line-height: 1.25; letter-spacing: 0; }
.psb:lang(ar) .psb-h2, [dir="rtl"] .psb .psb-h2 { font-size: clamp(30px, 3.4vw, 42px); line-height: 1.25; }
.psb:lang(ar) .psb-h3, [dir="rtl"] .psb .psb-h3 { font-size: clamp(21px, 2vw, 24px); line-height: 1.3; }

.psb-lead { font-size: clamp(18px, 1.6vw, 20px); line-height: 1.55; color: var(--psb-text); margin-block: 0 32px; max-width: 32em; }
.psb-intro { font-size: 19px; color: var(--psb-text); margin-block: 0 48px; max-width: 38em; }
.psb-dark .psb-lead,
.psb-dark .psb-intro { color: var(--psb-on-dark); }
.psb-muted { color: var(--psb-muted); }

/* Model codes and dimensions: condensed, LTR. */
.psb-code { font-family: var(--psb-font-code); font-weight: 700; color: var(--psb-navy); unicode-bidi: isolate; }

/* Links and buttons. */
.psb a { color: var(--psb-teal); }
.psb a:hover { color: var(--psb-navy); }
/* Themes (Astra: .entry-content a) underline content links; styled links (buttons, cards) opt out. */
.psb.psb.psb a[class]:not(.psb-head__link) { text-decoration: none; }
.psb-dark a { color: var(--psb-white); }
.psb-dark a:hover { color: var(--psb-teal-light); }
.psb-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	min-block-size: 44px;
	padding: 15px 27px;
	border: 1px solid transparent;
	border-radius: var(--psb-radius-button, 6px);
	font: 600 17px/1.2 var(--psb-font-body);
	text-decoration: none;
	cursor: pointer;
	transition: background-color .15s, color .15s, border-color .15s;
}
.psb .psb-btn--primary { background: var(--psb-navy); color: var(--psb-white); }
.psb .psb-btn--primary:hover { background: var(--psb-deep-navy); color: var(--psb-white); }
.psb .psb-btn--accent { background: var(--psb-teal); color: var(--psb-white); }
.psb .psb-btn--accent:hover { background: var(--psb-navy); color: var(--psb-white); }
.psb .psb-btn--outline { background: transparent; color: var(--psb-navy); border-color: var(--psb-navy); }
.psb .psb-btn--outline:hover { background: var(--psb-navy); color: var(--psb-white); }
.psb-dark .psb-btn--outline { color: var(--psb-white); border-color: var(--psb-white); }
.psb-dark .psb-btn--primary { background: var(--psb-white); color: var(--psb-navy); }
.psb-btns { display: flex; flex-wrap: wrap; gap: 12px; }

/* Product renders sit on the panel colour. */
.psb-panel { background: var(--psb-panel); border-radius: var(--psb-radius-panel, 16px); }
.psb-render { display: block; max-inline-size: 100%; block-size: auto; object-fit: contain; mix-blend-mode: multiply; }

/* Data table (size chart, specs, decision table). */
.psb-table-wrap { overflow-x: auto; border-radius: var(--psb-radius-card, 12px); border: 1px solid var(--psb-line); background: var(--psb-white); }
.psb-tbl { width: 100%; border-collapse: collapse; font-size: 15px; min-width: 640px; }
.psb-tbl th { font-family: var(--psb-font-heading); font-weight: 600; font-size: 15px; text-align: start; padding: 12px 16px; background: var(--psb-navy); color: var(--psb-white); }
.psb-tbl td { padding: 11px 16px; border-block-end: 1px solid var(--psb-line); }
.psb-tbl tr:nth-child(even) td { background: var(--psb-zebra); }
.psb-tbl td.psb-code { font-size: 17px; }

/* Icons from the bundled stroke set. */
.psb-icon { flex: none; fill: none; stroke: currentColor; stroke-linecap: round; stroke-linejoin: round; }

/* Section header: heading with a link aligned to the end. */
.psb-head { display: flex; flex-wrap: wrap; gap: 16px; justify-content: space-between; align-items: flex-end; margin-block-end: 36px; }
.psb-head .psb-h2 { margin: 0; }
.psb-head__link { font-weight: 600; font-size: 17px; }

/* Form controls inherit the brand font. */
.psb input, .psb select, .psb textarea, .psb button { font: inherit; }
.psb input[type="checkbox"], .psb input[type="radio"] { inline-size: 20px; block-size: 20px; accent-color: var(--psb-teal); margin: 0; flex: none; }

/* Accessibility. */
.psb :focus-visible { outline: 3px solid var(--psb-teal-light); outline-offset: 2px; border-radius: 2px; }
.psb-visually-hidden {
	position: absolute !important;
	inline-size: 1px; block-size: 1px;
	padding: 0; margin: -1px;
	overflow: hidden; clip: rect(0 0 0 0);
	white-space: nowrap; border: 0;
}
@media (prefers-reduced-motion: reduce) {
	.psb *, .psb *::before, .psb *::after { animation-duration: 1ms !important; animation-iteration-count: 1 !important; transition-duration: 1ms !important; scroll-behavior: auto !important; }
}

/* Visibility per device (Elementor breakpoints). */
@media (min-width: 1025px) { .psb-hide-desktop { display: none !important; } }
@media (min-width: 768px) and (max-width: 1024px) { .psb-hide-tablet { display: none !important; } }
@media (max-width: 767px) { .psb-hide-mobile { display: none !important; } }

/* Small buttons, chips, compact tables (size chart, catalog, gallery). */
.psb .psb-btn--small { min-block-size: 44px; padding: 8px 14px; font-size: 14px; border-radius: 4px; }
.psb .psb-btn--outline-teal { background: transparent; color: var(--psb-teal); border-color: var(--psb-teal); }
.psb .psb-btn--outline-teal:hover { background: var(--psb-teal); color: var(--psb-white); }
.psb .psb-btn[aria-pressed="true"] { background: var(--psb-teal); color: var(--psb-white); border-color: var(--psb-teal); }
.psb-chip {
	min-block-size: 44px;
	padding: 8px 18px;
	border-radius: 22px;
	border: 1px solid var(--psb-navy);
	background: var(--psb-white);
	color: var(--psb-navy);
	font-weight: 600;
	font-size: 15px;
	cursor: pointer;
}
.psb-chip[aria-pressed="true"] { background: var(--psb-navy); color: var(--psb-white); }
.psb-tbl--compact { min-width: 480px; }
.psb-tbl--compact th[scope="row"] { background: transparent; color: var(--psb-muted); font-family: var(--psb-font-body); font-weight: 500; border-block-end: 1px solid var(--psb-line); inline-size: 22%; }
.psb-quote-add { margin: 0; }

/* Round finish swatch (hero, product gallery). */
.psb-swatch {
	inline-size: 48px;
	block-size: 48px;
	border-radius: 50%;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	background: var(--psb-white);
	border: 1px solid var(--psb-line-strong);
	padding: 0;
	cursor: pointer;
}
.psb-swatch[aria-pressed="true"] { border: 2px solid var(--psb-navy); }
.psb-swatch__dot { inline-size: 32px; block-size: 32px; border-radius: 50%; border: 1px solid #9AA5A0; }

/* Breadcrumbs (own component, catalog and gallery headers). */
.psb-breadcrumbs { font-size: 14px; color: var(--psb-muted); margin-block-end: 12px; }
.psb-breadcrumbs p { margin: 0; }
.psb .psb-breadcrumbs a { color: var(--psb-muted); }
.psb .psb-breadcrumbs a:hover { color: var(--psb-navy); }

/* Product card (catalog results, Product card, Related sizes). */
.psb-card { display: flex; flex-direction: column; block-size: 100%; background: var(--psb-white); border: 1px solid var(--psb-line-strong); border-radius: var(--psb-radius-button, 6px); overflow: hidden; }
.psb-card__media { display: block; position: relative; background: var(--psb-panel); padding: 18px; }
.psb-card__img { inline-size: 100%; block-size: 170px; }
.psb-card__badge { position: absolute; inset-block-start: 10px; inset-inline-start: 10px; background: var(--psb-navy); color: var(--psb-white); font: 600 15px/1.4 var(--psb-font-code); padding: 2px 8px; border-radius: 3px; }
.psb-card__body { display: flex; flex-direction: column; gap: 4px; flex: 1; padding: 16px 16px 12px; }
.psb-card__body p { margin: 0; }
.psb-card__series { font-size: 13px; color: var(--psb-muted); }
.psb-card__title { margin: 0; font-size: 24px; line-height: 1.15; }
.psb-card__dims { font-size: 15px; font-variant-numeric: tabular-nums; }
.psb-card__meta { font-size: 14px; color: var(--psb-muted); }
.psb-card__actions { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 8px; padding: 0 16px 16px; }
.psb-card__compare { display: flex; align-items: center; gap: 8px; min-block-size: 44px; font-size: 14px; cursor: pointer; }

/* Layout pages (catalog / product URLs): Astra pads .site-main on WooCommerce pages; sections run edge to edge. */
.psb-layout-page #primary.psb-layout .site-main { padding: 0; margin: 0; }
