/*
    Global utility classes. All prefixed with `u-` to avoid collision
    with framework / page CSS.
*/

/* === Display === */
.u-hidden { display: none; }
.u-inline-block { display: inline-block; }

/* === Cursor === */
.u-cursor-pointer { cursor: pointer; }
.u-cursor-help { cursor: help; }
.u-cursor-not-allowed { cursor: not-allowed; }

/* === Text === */
.u-text-center { text-align: center; }
.u-text-left { text-align: left; }
.u-text-right { text-align: right; }
.u-text-danger { color: #fc544b; }
.u-text-danger-bold { color: #fc544b; font-weight: bold; }
.u-text-muted { color: #6c757d; }
.u-bold { font-weight: bold; }
.u-fw-400 { font-weight: 400; }
.u-fw-500 { font-weight: 500; }
.u-fw-600 { font-weight: 600; }
.u-fw-700 { font-weight: 700; }
.u-text-uppercase { text-transform: uppercase; }
.u-text-nowrap { white-space: nowrap; }
.u-text-break { word-break: break-word; overflow-wrap: anywhere; }

/* === Font sizes (icons, headers, etc.) === */
.u-fs-12 { font-size: 12px; }
.u-fs-14 { font-size: 14px; }
.u-fs-15 { font-size: 15px; }
.u-fs-18 { font-size: 18px; }
.u-fs-20 { font-size: 20px; }
.u-fs-24 { font-size: 24px; }
.u-fs-30 { font-size: 30px; }

/* === Min/max width helpers (for table cells, inputs) === */
.u-min-w-120 { min-width: 120px; }
.u-min-w-150 { min-width: 150px; }
.u-min-w-180 { min-width: 180px; }
.u-min-w-220 { min-width: 220px; }
.u-min-h-150 { min-height: 150px; }
.u-mw-25pct { max-width: 25%; }
.u-mw-75pct { max-width: 75%; }

/* === List styling === */
.u-list-clean { list-style: none; padding: 0; }
.u-list-no-pad { padding: 0; }

/* === Sizing === */
.u-full-width { width: 100%; }
.u-full-height { height: 100%; }
.u-mw-50pct { max-width: 50%; }
.u-mw-100 { max-width: 100px; }
.u-mh-50 { max-height: 50px; }
.u-table-fullwidth { width: 100%; }

/* === Column widths (for table headers) === */
.u-col-w-30 { width: 30px; }
.u-col-w-40 { width: 40px; }
.u-col-w-48 { width: 48px; }
.u-col-w-50 { width: 50px; }
.u-col-w-60 { width: 60px; }
.u-col-w-64 { width: 64px; }
.u-col-w-80 { width: 80px; }
.u-col-w-100 { width: 100px; }
.u-col-w-120 { width: 120px; }
.u-col-w-150 { width: 150px; }

/* === Spacing helpers (margin/padding overrides) === */
.u-m-auto { margin: auto; }
.u-mt-n20 { margin-top: -20px; }
.u-mt-n30 { margin-top: -30px; }
.u-no-margin { margin: 0; }
.u-no-padding { padding: 0; }

/* === Background tints === */
.u-bg-white-soft { background-color: #fbfbfb; }
.u-bg-whitesmoke { background-color: whitesmoke; }

/* === Text decorations === */
.u-underline { text-decoration: underline; }

/* === Iframes === */
.u-iframe-fluid { width: 100%; height: auto; border: none; }

/* === Inline error label (red bold center) === */
.u-error-label { color: #f00; margin: auto; font-weight: bold; }

/* === Misc page-specific helpers === */
.u-h-50pct { height: 50%; }
.u-mh-50pct { max-height: 50%; }
.u-min-h-50 { min-height: 50px; }
.u-mx-10 { margin: 10px; }
.u-pill-30 { border-radius: 30px !important; }

/* === Spinner sizes === */
.u-spinner-sm { width: 4rem; height: 4rem; }
.u-spinner-md { width: 8rem; height: 8rem; }
.u-spinner-lg { width: 12rem; height: 12rem; }

/* === Borders === */
.u-no-border { border: 0; }
.u-border-radius-0 { border-radius: 0; }
.u-border-left-divider { border-left: solid 1px #c9c9c9; }

/* === Overflow === */
.u-overflow-hidden { overflow: hidden; }
.u-overflow-auto { overflow: auto; }
.u-overflow-y-auto { overflow-y: auto; }

/* === Animated rainbow banner === */
.navbar-bg-rainbow {
    background-image: -webkit-linear-gradient(left,#D68AB0 0%,#D8CE5D 25%,#6BD85D 50%,#5DB9D8 75%,#D85DCB 100%);
    background-size: 1000% 1000%;
    -webkit-animation: animated-bg 30s ease infinite;
    -moz-animation: animated-bg 30s ease infinite;
    -o-animation: animated-bg 30s ease infinite;
    animation: animated-bg 30s ease infinite;
}
@-webkit-keyframes animated-bg {
    0%   { background-position: 0% 50%; }
    50%  { background-position: 100% 50%; }
    100% { background-position: 0% 50%; }
}
@keyframes animated-bg {
    0%   { background-position: 0% 50%; }
    50%  { background-position: 100% 50%; }
    100% { background-position: 0% 50%; }
}

/* === Stripe row tones === */
.u-row-status-active   { background-color: #e6ffed; }
.u-row-status-disabled { background-color: #ffeef0; }
.u-row-soft-info       { border-left: solid 3px #00e0ff; }
