/* AlgoXL utility classes — CSP Phase 4
   Replaces inline style= attributes across templates.
   Complements Bulma's built-in helpers. */

/* Cursor */
.u-pointer { cursor: pointer; }

/* Widths */
.u-w-50  { width: 50px; }
.u-w-60  { width: 60px; }
.u-w-80  { width: 80px; }
.u-w-full { width: 100%; }
.u-w-full-h-full { width: 100%; height: 100%; }
.u-w-90-max-1000 { width: 90%; max-width: 1000px; }

/* Spacing helpers not covered by Bulma at exact values used */
.u-mt-2rem { margin-top: 2rem; }
.u-mt-1rem { margin-top: 1rem; }
.u-mb-1rem { margin-bottom: 1rem; }
.u-mb-0-mr-05 { margin-bottom: 0; margin-right: 0.5rem; }
.u-mb-0-mr-1  { margin-bottom: 0; margin-right: 1rem; }
.u-mb-0 { margin-bottom: 0; }
.u-ml-2rem  { margin-left: 2rem; }
.u-ml-025rem { margin-left: 0.25rem; }
.u-ml-auto { margin-left: auto; }
.u-mt-2rem-mb-1rem { margin-top: 2rem; margin-bottom: 1rem; }
.u-mt-1rem-mb-1rem { margin-top: 1rem; margin-bottom: 1rem; }
.u-p-3rem  { padding: 3rem; }
.u-py-section { padding-top: 1.5rem; padding-bottom: 1rem; }
.u-mb-1rem-p-075 { margin-bottom: 1rem; padding: 0.75rem; }

/* Display */
.u-inline        { display: inline; }
.u-inline-block  { display: inline-block; }
.u-inline-font-0 { display: inline-block; font-size: 0; }
.u-relative      { position: relative; }

/* Flexbox gap combos */
.u-flex-gap-075-mb-1  { display: flex; align-items: center; gap: 0.75rem; margin-bottom: 1rem; }
.u-flex-gap-05        { display: flex; align-items: center; gap: 0.5rem; }
.u-flex-gap-05-mb-1   { display: flex; gap: 0.5rem; margin-bottom: 1rem; }
.u-flex-gap-05-ml-auto { display: flex; gap: 0.5rem; margin-left: auto; }
.u-flex-justify-between { gap: 0.5rem; justify-content: space-between; }
.u-flex-1 { flex: 1; }
.u-gap-1-mb-1 { gap: 1rem; margin-bottom: 1rem; }
.u-gap-075-mb-1 { gap: 0.75rem; margin-bottom: 1rem; }

/* Colors */
.u-color-white       { color: white; }
.u-color-white-90    { color: rgba(255,255,255,0.9); }
.u-color-slate       { color: #1e293b; }
.u-color-danger-sm   { color: #ef4444; font-size: 0.85rem; }
.u-color-grey        { color: #666; }
.u-color-muted       { margin-top: 2rem; font-size: 1rem; color: #6b7280; }

/* Loading overlay — absolute fill with semi-transparent bg */
.u-loading-overlay {
    display: none;
    position: absolute;
    top: 0; left: 0; right: 0; bottom: 0;
    background: rgba(255,255,255,0.8);
    z-index: 10;
}
.u-loading-overlay-inner {
    position: absolute;
    top: 50%; left: 50%;
    transform: translate(-50%, -50%);
}

/* Fixed bottom bar (cookie consent override) */
.u-fixed-bottom-bar {
    position: fixed;
    bottom: 0; left: 0; right: 0;
    z-index: 9999;
    margin: 0;
    border-radius: 0;
}

/* Zone select styled as a title element */
.u-zone-select {
    font-size: 1.25rem;
    font-weight: 700;
    border: 1px solid #dbdbdb;
    border-radius: 4px;
    padding: 0.35rem 0.75rem;
    padding-right: 2rem;
    cursor: pointer;
    background: white;
    min-width: 80px;
}

/* Inline label sizing */
.u-title-inline {
    font-size: 1.1rem;
    font-weight: 600;
}

/* Reversals button default state */
.u-btn-reversals-default {
    background-color: #dbdbdb;
    border: 1px solid #dbdbdb;
}