/* ==========================================================
   KOKO Enterprise — Utilities
   Deliberately small, predictable and reusable.
   ========================================================== */

.text-left { text-align: left !important; }
.text-center { text-align: center !important; }
.text-right { text-align: right !important; }

.d-none,
.hidden { display: none !important; }
.d-block { display: block !important; }
.d-inline-block { display: inline-block !important; }
.d-flex { display: flex !important; }
.d-grid { display: grid !important; }

.align-start { align-items: flex-start !important; }
.align-center { align-items: center !important; }
.align-end { align-items: flex-end !important; }
.justify-start { justify-content: flex-start !important; }
.justify-center { justify-content: center !important; }
.justify-between { justify-content: space-between !important; }
.flex-wrap { flex-wrap: wrap !important; }

.w-100 { width: 100% !important; }
.max-text { max-width: var(--measure-text) !important; }
.max-narrow { max-width: var(--measure-narrow) !important; }
.max-wide { max-width: var(--measure-wide) !important; }
.mx-auto { margin-inline: auto !important; }

.mt-0 { margin-top: 0 !important; }
.mb-0 { margin-bottom: 0 !important; }
.mt-1 { margin-top: var(--space-3) !important; }
.mt-2 { margin-top: var(--space-5) !important; }
.mt-3 { margin-top: var(--space-6) !important; }
.mt-4 { margin-top: var(--space-7) !important; }
.mb-1 { margin-bottom: var(--space-3) !important; }
.mb-2 { margin-bottom: var(--space-5) !important; }
.mb-3 { margin-bottom: var(--space-6) !important; }
.mb-4 { margin-bottom: var(--space-7) !important; }

.pt-0 { padding-top: 0 !important; }
.pb-0 { padding-bottom: 0 !important; }
.pt-1 { padding-top: var(--space-3) !important; }
.pb-1 { padding-bottom: var(--space-3) !important; }
.pt-2 { padding-top: var(--space-5) !important; }
.pb-2 { padding-bottom: var(--space-5) !important; }
.pt-3 { padding-top: var(--space-6) !important; }
.pb-3 { padding-bottom: var(--space-6) !important; }
.pt-4 { padding-top: var(--space-7) !important; }
.pb-4 { padding-bottom: var(--space-7) !important; }

.overflow-hidden { overflow: hidden !important; }

.screen-reader-text {
	position: absolute !important;
	width: 1px !important;
	height: 1px !important;
	padding: 0 !important;
	margin: -1px !important;
	overflow: hidden !important;
	clip: rect(0, 0, 0, 0) !important;
	clip-path: inset(50%) !important;
	white-space: nowrap !important;
	border: 0 !important;
}

.screen-reader-text:focus {
	position: fixed !important;
	top: 1rem !important;
	left: 1rem !important;
	z-index: 100000 !important;
	width: auto !important;
	height: auto !important;
	padding: .9rem 1.2rem !important;
	margin: 0 !important;
	overflow: visible !important;
	clip: auto !important;
	clip-path: none !important;
	color: var(--color-primary) !important;
	background: var(--color-white) !important;
	border: 2px solid var(--color-accent) !important;
	box-shadow: var(--shadow-md) !important;
	font-size: .9rem !important;
	font-weight: 700 !important;
	line-height: 1.2 !important;
	text-decoration: none !important;
}
