/* ========================================================================
   File: public/css/styles.css  (GLOBAL)
   Purpose: app-wide globals (no homescreen chrome here)
   ======================================================================== */

/* ---------- Global spinner (overlay container) ---------- */
#globalSpinner {
  position: fixed; inset: 0;
  background-color: rgba(255,255,255,0.8);
  display: none;
  align-items: center; justify-content: center;
  z-index: 10000;
}

/* ---------- Unified spinner primitives ---------- */
:root {
  --ds-spinner-size: 60px;
  --ds-spinner-thickness: 8px;
  --ds-spinner-color: var(--ds-accent, #3498db);
}

.ds-spinner {
  border: var(--ds-spinner-thickness) solid rgba(0,0,0,.05);
  border-top-color: var(--ds-spinner-color);
  border-radius: 50%;
  width: var(--ds-spinner-size);
  height: var(--ds-spinner-size);
  animation: ds-spin 1s linear infinite;
}
.ds-spinner--sm { --ds-spinner-size: 18px; --ds-spinner-thickness: 3px; }
.ds-spinner--md { --ds-spinner-size: 36px; --ds-spinner-thickness: 6px; }
.ds-spinner--lg { --ds-spinner-size: 60px; --ds-spinner-thickness: 8px; }

.ds-spinner-overlay {
  position: fixed;
  inset: 0;
  background-color: rgba(255,255,255,.8);
  display: none;
  align-items: center;
  justify-content: center;
  z-index: 10000;
}

@keyframes ds-spin { to { transform: rotate(360deg); } }

/* ---------- Global tokens ---------- */
:root {
  --app-background-color: #f0f6fb;
  --app-font-family: 'Open Sans', system-ui, -apple-system, Segoe UI, Arial, sans-serif;
  --app-font-size: 14px;

  /* shared heights */
  --header-h: 70px;
  --crumb-h: 60px;

  /* sidebar widths (referenced by homescreen.css) */
  --sidebar-collapsed: 90px;
  --sidebar-expanded: 250px;
}

/* ---------- Global layout wrapper ---------- */
#app-layout-container {
  display: flex; flex-direction: row;
  width: 100%; height: 100vh; overflow: hidden;
  background-color: var(--app-background-color);
}

/* ---------- Generic read-only utility ---------- */
input[readonly], textarea[readonly] {
  background-color: #e9ecef; border-color: #ced4da; cursor: not-allowed;
}

 /* File End: public/css/styles.css