/* ============================================================
   Delta Compatibility Layer (Temporary)
   Provides Beta-era utilities during Harbor-Delta migration.
   Remove each block once refactored into Delta-native modules.
   ============================================================ */

/* ------------------------------
   Border Utilities
   ------------------------------ */
.u-border { border: 1px solid var(--border-color, #ccc); }
.u-border-thin { border: 1px solid var(--border-color, #ccc); }
.u-border-thick { border: 3px solid var(--border-color, #ccc); }
.u-border-left { border-left: 4px solid var(--border-accent, #4aa3ff); }

/* Accent border (theme-driven) */
.u-border-accent {
    border-left: 4px solid var(--theme-accent-color, #4aa3ff);
}

/* ------------------------------
   Shadow Utilities
   ------------------------------ */
.u-shadow-sm { box-shadow: var(--shadow-sm); }
.u-shadow-md { box-shadow: var(--shadow-md); }
.u-shadow-lg { box-shadow: var(--shadow-lg); }

/* Beta "shadow-me" equivalent */
.u-shadow-me { box-shadow: var(--shadow-md); }

/* ------------------------------
   Rounding Utilities
   ------------------------------ */
.u-round-sm { border-radius: var(--radius-sm); }
.u-round-md { border-radius: var(--radius-md); }
.u-round-lg { border-radius: var(--radius-lg); }
.u-round-pill { border-radius: 999px; }

/* Beta "round-me" equivalent */
.u-round-me { border-radius: var(--radius-md); }

/* ------------------------------
   Width / Layout Helpers
   ------------------------------ */
.u-w-full { width: 100%; }
.u-w-half { width: 50%; }
.u-w-third { width: 33.333%; }
.u-w-quarter { width: 25%; }

/* ------------------------------
   Text Utilities
   ------------------------------ */
.u-text-center { text-align: center; }
.u-text-right { text-align: right; }
.u-text-left { text-align: left; }
.u-text-bold { font-weight: 700; }

.u-font--sm { font-size: var(--font-size-sm); }
.u-font--md { font-size: var(--font-size-md); }
.u-font--lg { font-size: var(--font-size-lg); }

/* ------------------------------
   Flex Utilities
   ------------------------------ */
.u-flex { display: flex; }
.u-flex-center { display: flex; justify-content: center; align-items: center; }
.u-flex-between { display: flex; justify-content: space-between; }
.u-flex-column { display: flex; flex-direction: column; }

/* ------------------------------
   Article Themes (Temporary)
   ------------------------------ */
article[data-article-theme="alert"] {
    --theme-accent-color: #e74c3c;
    border-left: 4px solid var(--theme-accent-color);
}

article[data-article-theme="info"] {
    --theme-accent-color: #3498db;
    border-left: 4px solid var(--theme-accent-color);
}

article[data-article-theme="warning"] {
    --theme-accent-color: #f1c40f;
    border-left: 4px solid var(--theme-accent-color);
}

article[data-article-theme="dockblue"] {
    --theme-accent-color: #4aa3ff;
    border-left: 4px solid var(--theme-accent-color);
}

article[data-article-theme] {
  margin-bottom: var(--space-xl) !important;
}

.u-mt-neg--md { margin-top: calc(var(--space-md) * -1); }
.u-mt-neg--lg { margin-top: calc(var(--space-lg) * -1); }
.u-mt-neg--xl { margin-top: calc(var(--space-xl) * -1); }

.hb-separator {
  margin-left: auto;
  margin-right: auto;
}

.u-inline-center {
    display: block;
    margin-left: auto;
    margin-right: auto;
}