/* UNITO Core UI. Logical properties only (RTL-ready). Colours follow the UNITO brand. */
:root {
	--unito-teal: #054E57;
	--unito-deep: #03363C;
	--unito-gold: #FDCA3D;
	--unito-warm: #F7F7F2;
	--unito-ink: #142C30;
	--unito-line: #DCDFDB;
	--unito-wa: #1FA855;
}

/* Icons inside text get a little room. */
.unito-terms i, .unito-gate i, .unito-supplier-code i, .unito-supplier-filter i,
.unito-register-note i, .unito-wa-hint i, .unito-handoff i { margin-inline-end: .4em; color: var(--unito-teal); }

/* ---------- Product page ---------- */
.unito-terms { list-style: none; margin: 0 0 1.2em; padding: 0; }
.unito-terms li { display: flex; gap: .5em; align-items: baseline; margin: 0 0 .45em; }
.unito-terms li::before { font-family: "Font Awesome 6 Free"; font-weight: 900; color: var(--unito-teal); content: "\f5fd"; }
.unito-terms li:last-child::before { content: "\f05a"; }
.unito-supplier-code { margin: 0 0 1em; font-weight: 600; }
.unito-supplier-code a { text-decoration: underline; text-underline-offset: 3px; }
.unito-gate { border: 1px solid var(--unito-line); background: var(--unito-warm); padding: 18px 20px; border-radius: 6px; margin: 0 0 1.2em; }
.unito-gate p { margin: 0 0 .8em; }
.unito-loop-moq { display: block; font-size: 13px; color: #5c6f6c; margin-top: 2px; }
.unito-price-login::before { font-family: "Font Awesome 6 Free"; font-weight: 900; content: "\f023"; margin-inline-end: .4em; font-size: .85em; }

/* ---------- Registration ---------- */
.unito-account-type { border: 0; padding: 0; margin: 0 0 18px; display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.unito-account-type legend { font-weight: 700; margin-bottom: 10px; padding: 0; }
.unito-account-type__option { position: relative; display: block; cursor: pointer; border: 1px solid var(--unito-line); border-radius: 6px; padding: 14px 16px; background: #fff; transition: border-color .15s; }
.unito-account-type__option input { position: absolute; opacity: 0; inset-inline-start: 0; }
.unito-account-type__option span { display: grid; gap: 2px; }
.unito-account-type__option i { font-size: 22px; color: var(--unito-teal); margin-bottom: 4px; }
.unito-account-type__option small { color: #5c6f6c; font-size: 13px; line-height: 1.4; }
.unito-account-type__option.is-active { border-color: var(--unito-teal); box-shadow: inset 0 0 0 1px var(--unito-teal); }
.unito-account-type__option:focus-within { outline: 2px solid var(--unito-gold); outline-offset: 2px; }
.unito-register-note { font-size: 14px; color: #3d5250; }
[data-unito-for][hidden] { display: none !important; }
@media (max-width: 480px) { .unito-account-type { grid-template-columns: 1fr; } }

/* ---------- My account: supplier application ---------- */
.unito-supplier-apply { display: flex; flex-wrap: wrap; gap: 14px 24px; align-items: center; justify-content: space-between; border: 1px solid var(--unito-line); background: var(--unito-warm); border-radius: 6px; padding: 18px 20px; margin: 24px 0 0; }
.unito-supplier-apply > div { flex: 1 1 280px; }
.unito-supplier-apply h3 { margin: 0 0 4px; font-size: 18px; }
.unito-supplier-apply h3 i { margin-inline-end: .4em; color: var(--unito-teal); }
.unito-supplier-apply p { margin: 0; color: #3d5250; }
.unito-sa-title { margin: 0 0 .6em; }
.unito-sa-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 0 20px; }
.unito-sa-grid > .form-row { float: none; width: auto; margin-inline: 0; }
.unito-sa-grid > .form-row-wide { grid-column: 1 / -1; }
.unito-sa-form select, .unito-sa-form textarea { width: 100%; }
.unito-sa-ack label { display: flex; gap: .6em; align-items: flex-start; font-weight: 400; cursor: pointer; }
.unito-sa-ack input { margin-top: .3em; flex: none; }
.unito-sa-summary { display: grid; grid-template-columns: minmax(140px, max-content) 1fr; gap: 8px 20px; margin: 0; border: 1px solid var(--unito-line); border-radius: 6px; padding: 18px 20px; }
.unito-sa-summary dt { font-weight: 600; color: #3d5250; }
.unito-sa-summary dd { margin: 0; overflow-wrap: anywhere; }
@media (max-width: 480px) { .unito-sa-grid, .unito-sa-summary { grid-template-columns: 1fr; } .unito-sa-summary dd { margin-bottom: 6px; } }

/* ---------- Cart: WhatsApp button ---------- */
.unito-wa-open.button { width: 100%; display: inline-flex; justify-content: center; align-items: center; gap: .5em; background: var(--unito-wa) !important; border-color: var(--unito-wa) !important; color: #fff !important; }
.unito-wa-open.button:hover { filter: brightness(.94); }
.unito-wa-open i { font-size: 1.25em; }
.unito-wa-hint { font-size: 13px; color: #5c6f6c; margin: 8px 0 0; text-align: center; }

/* ---------- WhatsApp modal ---------- */
.unito-modal-open, .unito-modal-open body { overflow: hidden; }
.unito-wa-modal { position: fixed; inset: 0; z-index: 100000; display: grid; place-items: center; padding: 16px; }
.unito-wa-modal[hidden] { display: none; }
.unito-wa-modal__backdrop { position: absolute; inset: 0; background: rgba(3, 54, 60, .55); }
.unito-wa-modal__panel { position: relative; width: min(560px, 100%); max-height: calc(100vh - 32px); overflow: auto; background: #fff; border-radius: 8px; box-shadow: 0 20px 60px rgba(0,0,0,.25); }
.unito-wa-modal__head { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 18px 22px; border-bottom: 1px solid var(--unito-line); }
.unito-wa-modal__head h2 { margin: 0; font-size: 20px; line-height: 1.3; color: var(--unito-ink); }
.unito-wa-modal__head h2 i { color: var(--unito-wa); }
.unito-wa-modal__close { background: none; border: 0; padding: 6px 8px; font-size: 18px; cursor: pointer; color: var(--unito-ink); }
.unito-wa-modal__body { padding: 18px 22px 22px; }
.unito-wa-modal__intro { margin: 0 0 10px; color: #3d5250; }
.unito-wa-modal__preview { text-align: start; white-space: pre-wrap; word-break: break-word; font-family: inherit; font-size: 14px; line-height: 1.55; margin: 0 0 14px; padding: 14px 16px; background: #e7f6ec; border-radius: 0 8px 8px 8px; border-inline-start: 3px solid var(--unito-wa); max-height: 300px; overflow: auto; color: var(--unito-ink); }
.unito-wa-modal__note { display: block; margin: 0 0 12px; }
.unito-wa-modal__note span { display: block; font-weight: 600; margin-bottom: 6px; }
.unito-wa-modal__note textarea { width: 100%; }
.unito-wa-modal__save { font-size: 13px; color: #3d5250; }
.unito-wa-modal__save i { color: var(--unito-teal); margin-inline-end: .35em; }
.unito-wa-modal__errors { margin: 0 0 12px; }
.unito-wa-modal__errors[hidden], .unito-wa-modal [hidden] { display: none !important; }
.unito-wa-modal__actions { display: flex; flex-wrap: wrap; gap: 10px; justify-content: flex-end; margin-top: 14px; }
.unito-wa-send.button, .unito-wa-again.button { background: var(--unito-wa) !important; border-color: var(--unito-wa) !important; color: #fff !important; display: inline-flex; gap: .45em; align-items: center; }
.unito-wa-send[disabled] { opacity: .5; cursor: not-allowed; }
.unito-wa-modal__done { font-size: 18px; font-weight: 600; color: var(--unito-ink); }
.unito-wa-modal__done i { color: var(--unito-wa); margin-inline-end: .35em; }

/* ---------- Order handoff (checkout flow) ---------- */
.unito-handoff { border: 1px solid var(--unito-line); background: var(--unito-warm); padding: 18px 20px; border-radius: 6px; margin: 0 0 24px; }
.unito-handoff-ref { font-weight: 700; }
.unito-handoff-wa.button { background: var(--unito-wa) !important; border-color: var(--unito-wa) !important; color: #fff !important; }
.unito-handoff-wa.button::before { font-family: "Font Awesome 6 Brands"; content: "\f232"; margin-inline-end: .45em; font-weight: 400; }

/* ---------- Minimum order filter ---------- */
.unito-moq-filter { list-style: none; margin: 0; padding: 0; }
.unito-moq-filter li { margin: 0 0 8px; }
.unito-moq-filter a { color: var(--unito-ink); }
.unito-moq-filter a:hover { color: var(--unito-teal); }
.unito-moq-filter li.chosen a { color: var(--unito-teal); font-weight: 700; }
.unito-moq-filter li.chosen a::before { font-family: "Font Awesome 6 Free"; font-weight: 900; content: "\f00c"; margin-inline-end: .45em; }

/* ---------- Suppliers page ---------- */
.unito-suppliers { display: grid; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); gap: 20px; }
.unito-supplier-card { background: #fff; border: 1px solid var(--unito-line); border-radius: 6px; padding: 22px; display: flex; flex-direction: column; gap: 8px; }
.unito-supplier-card__icon { margin: 0; font-size: 26px; color: var(--unito-teal); }
.unito-supplier-card__code { margin: 0; font-size: 26px; letter-spacing: .02em; color: var(--unito-ink); }
.unito-supplier-card__types, .unito-supplier-card__count { margin: 0; color: #3d5250; font-size: 15px; }
.unito-supplier-card__types i, .unito-supplier-card__count i { color: var(--unito-teal); margin-inline-end: .4em; width: 1.1em; }
.unito-supplier-card__link { margin-top: auto; align-self: flex-start; }
.unito-supplier-filter { padding: 12px 16px; background: var(--unito-warm); border: 1px solid var(--unito-line); border-radius: 6px; }
.unito-suppliers-empty { color: #5c6f6c; }

@media (prefers-reduced-motion: reduce) { .unito-account-type__option { transition: none; } }