/*
 * Kelas gaya satu fungsi. Ubah nilainya di sini, misalnya warna u-color-heading, dan semua halaman ikut berubah.
 *
 * File ini sengaja dimuat sebelum Bootstrap dan memakai !important. Dengan begitu kelas ini
 * mengalahkan gaya biasa, tapi tetap kalah dari kelas utilitas Bootstrap dan keenan.css.
 */

.u-border-none { border: 0 !important; }
.u-border-1-5 { border: 1.5px solid var(--line) !important; }
.u-border-1 { border: 1px solid var(--line) !important; }
.u-border-2 { border: 2px solid var(--line) !important; }
.u-margin-auto { margin: 0 auto !important; }
.u-overflow-hidden { overflow: hidden !important; }
.u-accent-green { accent-color: var(--green) !important; }
.u-bg-bri { background: #00529c !important; }
.u-bg-dot-green { background: #10b981 !important; }
.u-bg-dot-red { background: #dc2626 !important; }
.u-bg-blue-soft { background: #e3efff !important; }
.u-bg-mint { background: #e8f7ef !important; }
.u-bg-note { background: #edf6f1 !important; }
.u-bg-mint-strong { background: #edf8f1 !important; }
.u-bg-panel { background: #f4f8f5 !important; }
.u-bg-mint-soft { background: #f4fbf6 !important; }
.u-bg-white { background: #ffffff !important; }
.u-border-color-border { border-color: var(--border) !important; }
.u-border-color-line { border-color: var(--line) !important; }
.u-radius-4 { border-radius: 4px !important; }
.u-radius-full { border-radius: 50% !important; }
.u-no-shadow { box-shadow: none !important; }
.u-color-green-dark { color: #105832 !important; }
.u-color-heading { color: #113824 !important; }
.u-color-green-text { color: #125934 !important; }
.u-color-heading-soft { color: #143825 !important; }
.u-color-green-note { color: #16472d !important; }
.u-color-green-mid { color: #167344 !important; }
.u-color-green-deep { color: #17472d !important; }
.u-color-blue { color: #1d4ed8 !important; }
.u-color-green { color: var(--green) !important; }
.u-cursor-pointer { cursor: pointer !important; }
.u-d-grid { display: grid !important; }
.u-d-inline-block { display: inline-block !important; }
.u-shrink-0 { flex-shrink: 0 !important; }
.u-text-13-5 { font-size: 13.5px !important; }
.u-text-13 { font-size: 13px !important; }
.u-text-14 { font-size: 14px !important; }
.u-text-15 { font-size: 15px !important; }
.u-text-16 { font-size: 16px !important; }
.u-text-20 { font-size: 20px !important; }
.u-text-22 { font-size: 22px !important; }
.u-text-24 { font-size: 24px !important; }
.u-weight-700 { font-weight: 700 !important; }
.u-weight-750 { font-weight: 750 !important; }
.u-weight-800 { font-weight: 800 !important; }
.u-col-full { grid-column: 1 / -1 !important; }
.u-h-full { height: 100% !important; }
.u-h-32 { height: 32px !important; }
.u-h-400 { height: 400px !important; }
.u-h-44 { height: 44px !important; }
.u-h-48 { height: 48px !important; }
.u-h-50 { height: 50px !important; }
.u-h-52 { height: 52px !important; }
.u-h-9 { height: 9px !important; }
.u-h-auto { height: auto !important; }
.u-tracking-0-5 { letter-spacing: 0.5px !important; }
.u-tracking-0-6 { letter-spacing: 0.6px !important; }
.u-leading-1-8 { line-height: 1.8 !important; }
.u-margin-bottom-14 { margin-bottom: 14px !important; }
.u-max-h-130 { max-height: 130px !important; }
.u-max-h-220 { max-height: 220px !important; }
.u-max-h-420 { max-height: 420px !important; }
.u-max-w-full { max-width: 100% !important; }
.u-max-w-1050 { max-width: 1050px !important; }
.u-max-w-1120 { max-width: 1120px !important; }
.u-max-w-1140 { max-width: 1140px !important; }
.u-max-w-1150 { max-width: 1150px !important; }
.u-max-w-1200 { max-width: 1200px !important; }
.u-max-w-200 { max-width: 200px !important; }
.u-max-w-220 { max-width: 220px !important; }
.u-max-w-230 { max-width: 230px !important; }
.u-max-w-320 { max-width: 320px !important; }
.u-max-w-460 { max-width: 460px !important; }
.u-max-w-500 { max-width: 500px !important; }
.u-max-w-620 { max-width: 620px !important; }
.u-max-w-640 { max-width: 640px !important; }
.u-max-w-650 { max-width: 650px !important; }
.u-max-w-900 { max-width: 900px !important; }
.u-max-w-960 { max-width: 960px !important; }
.u-min-h-44 { min-height: 44px !important; }
.u-min-h-48 { min-height: 48px !important; }
.u-min-w-0 { min-width: 0 !important; }
.u-min-w-170 { min-width: 170px !important; }
.u-min-w-190 { min-width: 190px !important; }
.u-min-w-270 { min-width: 270px !important; }
.u-object-contain { object-fit: contain !important; }
.u-object-cover { object-fit: cover !important; }
.u-wrap-anywhere { overflow-wrap: anywhere !important; }
.u-place-center { place-items: center !important; }
.u-space-pre-line { white-space: pre-line !important; }
.u-w-full { width: 100% !important; }
.u-w-100 { width: 100px !important; }
.u-w-180 { width: 180px !important; }
.u-w-32 { width: 32px !important; }
.u-w-48 { width: 48px !important; }
.u-w-50 { width: 50px !important; }
.u-w-52 { width: 52px !important; }
.u-w-9 { width: 9px !important; }
.u-w-auto { width: auto !important; }
.u-w-fit { width: fit-content !important; }
.u-z-1050 { z-index: 1050 !important; }
.u-z-5 { z-index: 5 !important; }