/* MyHub - Fiori Horizon-inspired design system
   --------------------------------------------- */

:root {
  /* Brand & shell */
  --shell-bg: #0a4f92;
  --shell-bg-2: #0854a0;
  --shell-text: #ffffff;
  --shell-search-bg: #1664ad;
  --shell-search-text: #d6e6f5;

  /* Surfaces */
  --bg: #f5f6f7;
  --bg-soft: #eaecee;
  --surface: #ffffff;
  --surface-alt: #fafbfc;
  --border: #d9d9d9;
  --border-strong: #bcbcbc;
  --divider: #ebebeb;

  /* Text */
  --text: #1d2d3e;
  --text-muted: #556b82;
  --text-subtle: #6a7d92;
  --text-disabled: #a9b4c0;

  /* Brand actions */
  --primary: #0070f2;
  --primary-hover: #0064d9;
  --primary-active: #0058c1;
  --primary-soft: #e8f1fc;
  --link: #0070f2;

  /* Semantic */
  --success: #188918;
  --success-bg: #ebf5eb;
  --error: #bb0000;
  --error-bg: #f9e8e8;
  --warning: #b25e00;
  --warning-bg: #fdf2e6;
  --info: #0070f2;
  --info-bg: #e8f1fc;
  --critical-red: #d00040;

  /* Highlight bars */
  --bar-orange: #e76500;
  --row-selected: #ebf5fe;
  --row-hover: #f5f8fb;

  /* Status colors (charts) */
  --status-new: #ec407a;
  --status-not-required: #5b80f5;
  --status-auto-closed: #29b6f6;
  --status-postponed: #ce93d8;
  --status-completed: #ff8a3d;
  --status-in-progress: #4caf50;
  --status-postponed-2: #ad1457;
  --status-reset: #00897b;
  --status-waiting: #9e9e9e;

  /* Outbox status */
  --outbox-approved: #6a9eff;
  --outbox-awaiting: #ff9800;
  --outbox-in-progress: #2e7d32;
  --outbox-not-required: #ec407a;
  --outbox-posted: #ab47bc;
  --outbox-rejected: #00897b;

  /* Sizing */
  --radius-s: 4px;
  --radius-m: 8px;
  --radius-l: 12px;
  --shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.06);
  --shadow-md: 0 2px 8px rgba(0, 0, 0, 0.08);
  --shadow-lg: 0 4px 16px rgba(0, 0, 0, 0.12);

  --shell-h: 44px;
  --page-h: 100vh;

  /* Typography */
  --font: "72", "72full", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto,
    "Helvetica Neue", Arial, sans-serif;
  --fs-xs: 11px;
  --fs-s: 12px;
  --fs-m: 14px;
  --fs-l: 16px;
  --fs-xl: 18px;
  --fs-xxl: 22px;
  --fs-title: 28px;
}

/* Reset */
*,
*::before,
*::after {
  box-sizing: border-box;
}

html,
body {
  margin: 0;
  padding: 0;
  height: 100%;
}

body {
  font-family: var(--font);
  font-size: var(--fs-m);
  color: var(--text);
  background: var(--bg);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

a {
  color: var(--link);
  text-decoration: none;
}
a:hover {
  text-decoration: underline;
}

button {
  font-family: inherit;
  cursor: pointer;
  border: 0;
  background: transparent;
  color: inherit;
  padding: 0;
}

input,
select,
textarea {
  font-family: inherit;
  font-size: inherit;
  color: inherit;
}

::-webkit-scrollbar {
  width: 10px;
  height: 10px;
}
::-webkit-scrollbar-thumb {
  background: #c5c5c5;
  border-radius: 6px;
}
::-webkit-scrollbar-thumb:hover {
  background: #a8a8a8;
}
::-webkit-scrollbar-track {
  background: transparent;
}

/* Utility */
.hidden {
  display: none !important;
}
.text-muted {
  color: var(--text-muted);
}
.text-subtle {
  color: var(--text-subtle);
}
.row {
  display: flex;
  gap: 8px;
  align-items: center;
}
.spacer {
  flex: 1;
}

/* Generic icon */
.icon {
  width: 16px;
  height: 16px;
  display: inline-block;
  vertical-align: middle;
  flex-shrink: 0;
}
.icon-lg {
  width: 24px;
  height: 24px;
}
.icon-xl {
  width: 36px;
  height: 36px;
}