/* Comfort hub (comfortfs.com panel) theme.
   Loaded AFTER style.css and only on hub pages; Kumaş Depo is unaffected. */

:root {
  --bg: #F6F4F0;
  --surface: #FFFFFF;
  --surface-2: #F6F4F0;
  --text: #2A2724;
  --text-muted: #6B635A;
  --border: #E7E2DA;
  --brand: #F2A93C;
  --brand-dark: #D98F22;
  --brand-contrast: #2A2724;
  --ok: #3F6B4A;
  --ok-bg: #E6EEE7;
  --ok-text: #3F6B4A;
  --warn: #9A6B10;
  --warn-bg: #FCEFD8;
  --warn-text: #9A6B10;
  --danger: #B3412B;
  --danger-bg: #F7E7E2;
  --danger-text: #B3412B;
  --shadow: 0 1px 3px rgba(42, 39, 36, .08), 0 1px 2px rgba(42, 39, 36, .06);
  --radius: 14px;
  --touch: 48px;
}

html, body {
  font-family: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
}

/* Buttons: dark text on the amber brand colour for contrast */
.btn-primary { background: var(--brand); color: var(--brand-contrast); }
.btn-primary:hover { background: var(--brand-dark); color: var(--brand-contrast); }

/* Topbar: light surface */
.topbar { background: var(--surface); color: var(--text); border-bottom: 1px solid var(--border); }
.topbar a.brand, .topbar .icon-btn, .topbar .user-chip { color: var(--text); }
.topbar a.brand { display: inline-flex; align-items: center; gap: 8px; }
.icon-btn { background: var(--surface-2); }
.lang-switch a.active { background: var(--surface-2); }
.notif-bell { background: var(--surface-2); }
.notif-bell:hover { background: var(--border); }
.notif-badge { box-shadow: 0 0 0 2px var(--surface); }
@keyframes notif-blink { 0%, 100% { background: var(--surface-2); } 50% { background: var(--danger-bg); } }
@media (prefers-reduced-motion: reduce) { .notif-bell.has-new { background: var(--danger-bg); } }
.notif-pop-item.notif-warning { background: var(--danger-bg); }
.notif-pop-item > span:first-child { flex: none; color: var(--brand-dark); }
.hub-av { background: var(--brand); color: var(--brand-contrast); }

.hub-logo-img { height: 28px; width: auto; display: block; }

/* App cards */
.hub-card { background: #fff; border: 1px solid var(--border); border-radius: var(--radius); }
.hub-card:hover { transform: translateY(-2px); box-shadow: 0 4px 14px rgba(42, 39, 36, .14); border-color: var(--brand); }
.hub-ic {
  width: 56px; height: 56px; border-radius: 14px;
  background: var(--surface-2); color: var(--brand-dark);
  display: flex; align-items: center; justify-content: center;
  margin: 0 auto 12px; font-size: 0;
}
.hub-ic svg { width: 28px; height: 28px; }

/* Inline SVG icons */
.ui-ic { width: 1.25em; height: 1.25em; flex: none; vertical-align: -0.2em; }
.ui-ic svg { width: 100%; height: 100%; }
.empty-state .ic svg { width: 40px; height: 40px; color: var(--text-muted); }

/* Notifications */
.hub-notif-item { border-left-color: var(--brand); }
.hub-notif-item.hub-notif-warning { border-left-color: var(--danger); background: var(--danger-bg); }
.hub-notif-ic { color: var(--brand-dark); display: inline-flex; }
.hub-notif-item.hub-notif-warning .hub-notif-ic { color: var(--danger); }