/**
 * nak-icons.css — the UI icon family (1.20.0)
 *
 * Every icon from nak_ui_icon() is a bare 24 × 24 drawing; this file decides
 * how it is drawn. One set of shapes, three hands:
 *
 *   Khmer  — carved in sandstone: square caps, mitred corners, a firm 1.6.
 *   Indian — painted with a brush: round caps and joins, a fuller 1.9.
 *   Fusion — the meeting point: round caps, a balanced 1.75.
 *
 * Admin screens (no data-style) get a neutral 1.6 with round ends.
 *
 * @package NamasteAngkorTheme
 */

:root {
	--nak-ui-stroke: 1.75;
	--nak-ui-cap: round;
	--nak-ui-join: round;
}
html[data-style="fusion"] { --nak-ui-stroke: 1.75; --nak-ui-cap: round;  --nak-ui-join: round; }
html[data-style="indian"] { --nak-ui-stroke: 1.9;  --nak-ui-cap: round;  --nak-ui-join: round; }
html[data-style="khmer"]  { --nak-ui-stroke: 1.6;  --nak-ui-cap: square; --nak-ui-join: miter; }
.wp-admin { --nak-ui-stroke: 1.6; --nak-ui-cap: round; --nak-ui-join: round; }

.nak-ui-icon {
	display: inline-block;
	flex: 0 0 auto;
	vertical-align: middle;
	fill: none;
	stroke: currentColor;
	stroke-width: var(--nak-ui-stroke);
	stroke-linecap: var(--nak-ui-cap);
	stroke-linejoin: var(--nak-ui-join);
	stroke-miterlimit: 8;
	overflow: visible;
}
.nak-ui-icon .f { fill: currentColor; stroke: none; }

/* Small sizes stay crisp: thicker in proportion below 20px. */
.nak-ui-icon[width="16"], .nak-ui-icon[width="18"] { stroke-width: calc(var(--nak-ui-stroke) * 1.12); }

/* Icon badges (Why us, experience cards): a culture-shaped seat for the icon.
   Same footprint everywhere; the outline follows the culture's corner. */
.nak-why-us__icon,
.nak-experience-card__icon {
	display: inline-grid;
	place-items: center;
}
html[data-style="khmer"]  .nak-why-us__icon,
html[data-style="khmer"]  .nak-experience-card__icon { border-radius: 3px; }
html[data-style="indian"] .nak-why-us__icon,
html[data-style="indian"] .nak-experience-card__icon { border-radius: 50% 50% 46% 46% / 58% 58% 42% 42%; } /* temple-arch round */

/* Order menu: the round "+" keeps a bold cross; the header bag sits on the label's baseline. */
.nak-om-add .nak-ui-icon { stroke-width: 2.4; }
.nak-order-btn__icon.nak-ui-icon { width: 18px; height: 18px; }

/* KAT's booking trigger ("Reserve a table" on the Contact map) ships a 📅
   emoji; draw the family's calendar in its place (KAT itself unchanged). */
.kat-book__trigger-icon {
	display: inline-block;
	width: 18px; height: 18px;
	font-size: 0; line-height: 0; color: inherit;
	background: currentColor;
	-webkit-mask: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%221.9%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Crect%20x%3D%223.5%22%20y%3D%225%22%20width%3D%2217%22%20height%3D%2215.5%22%20rx%3D%222%22%2F%3E%3Cpath%20d%3D%22M3.5%2010h17M8%203v4M16%203v4%22%2F%3E%3Ccircle%20cx%3D%2212%22%20cy%3D%2215%22%20r%3D%221.4%22%20fill%3D%22%23000%22%20stroke%3D%22none%22%2F%3E%3C%2Fsvg%3E") center / contain no-repeat;
	mask: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%221.9%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Crect%20x%3D%223.5%22%20y%3D%225%22%20width%3D%2217%22%20height%3D%2215.5%22%20rx%3D%222%22%2F%3E%3Cpath%20d%3D%22M3.5%2010h17M8%203v4M16%203v4%22%2F%3E%3Ccircle%20cx%3D%2212%22%20cy%3D%2215%22%20r%3D%221.4%22%20fill%3D%22%23000%22%20stroke%3D%22none%22%2F%3E%3C%2Fsvg%3E") center / contain no-repeat;
}