@import "./source/tokens.css";
@import "./source/motion.css";
@import "./source/prism-select.module.css";
@import "./source/halo-flows-section.module.css";

* { box-sizing: border-box; }
html, body { height: 100%; width: 100%; }
body { margin: 0; overflow: hidden; background: var(--prism-cloud); }
button, input, select, textarea { font: inherit; }
button { cursor: pointer; }
button:disabled { cursor: not-allowed; }
img { display: block; }
[hidden] { display: none !important; }

.flowBoard { height: 100vh; min-height: 560px; position: relative; }
.prismShell { height: 100%; min-height: 0; }
.prismWorkspace { min-height: 0; }
.prismContent { height: 100%; overflow: hidden; }
.prismMain { min-height: 0; }
.boardPanel { min-height: 0; }
.kanbanScroller { min-height: 0; overflow: auto; }
.kanbanLane { min-height: 360px; }
.prismWordmark { width: 132px; }
.prismIconMark { height: 38px; width: auto; }
.prismNav .lucideIcon { height: 20px; width: 20px; }
.sidebarToggle .lucideIcon,
.mobilePrismHeader .lucideIcon,
.mobileFilterButton .lucideIcon,
.resetButton .lucideIcon,
.segmentedControl .lucideIcon,
.drawerClose .lucideIcon { height: 16px; width: 16px; }
.lucideIcon { display: inline-block; fill: none; stroke: currentColor; stroke-linecap: round; stroke-linejoin: round; stroke-width: 1.5; }

.prismPanelHeader h1,
.prismToolbar h2 { color: var(--prism-text-primary); margin: 0; }
.prismPanelHeader h1 { font-size: 1.28rem; font-weight: 700; letter-spacing: -0.012em; line-height: 1.18; }
.prismToolbar h2 { font-size: 1rem; font-weight: 600; }

.commandSelect { display: grid; gap: 4px; min-width: 132px; }
.commandSelect > span { color: var(--prism-text-muted); font-family: var(--halo-font-mono); font-size: .58rem; font-weight: 650; letter-spacing: .04em; text-transform: uppercase; }
.commandSelect select { appearance: none; background: var(--prism-surface); border: 1px solid var(--prism-border); border-radius: var(--radius-control); color: var(--prism-text-primary); font-size: .7rem; font-weight: 600; height: 34px; padding: 0 27px 0 10px; }
.commandSelect:nth-of-type(1) { min-width: 156px; }
.prismSearch > span { align-items: center; display: inline-flex; }
.prismSearch .lucideIcon { height: 16px; width: 16px; }

.field { gap: 4px; }
.control::after { color: var(--prism-text-muted); content: "⌄"; font-size: 14px; pointer-events: none; position: absolute; right: 10px; top: 8px; }
.select { height: 34px; min-height: 34px; }

.prismFilters .resetButton { align-items: center; display: inline-flex; justify-content: center; min-width: 34px; padding: 0; }
.segmentedControl button { gap: 5px; white-space: nowrap; }
.mobileFilterButton { white-space: nowrap; }

.prismTable tbody tr { cursor: pointer; }
.prismTable tbody tr:hover td { background: var(--prism-surface-raised); }
.prismTable td > button { background: transparent; border: 0; color: inherit; display: grid; padding: 0; text-align: left; }

.drawerLayer,
.dragConfirmLayer { z-index: 30; }
.drawerLayer { position: fixed; }
.dragConfirmLayer { position: fixed; }
.prismInspector { width: min(430px, 46vw); }
.inspectorHead { background: var(--prism-surface); }
.drawerClose { flex: 0 0 auto; }
.inspectorSection .inspectorAction,
.inspectorSection .inspectorSecondaryAction { margin-top: 0; }
.inspectorSection .field { margin-top: 4px; }
.activityTimeline article[data-unread="true"] { border-color: rgba(217, 70, 239, .36); }
.activityTimeline article[data-type="sms-in"] p,
.activityTimeline article[data-type="sms-out"] p { font-style: italic; }
.smsComposer .suggestionRow button { justify-content: flex-start; margin-top: 0; text-align: left; }

.mobileOverlay { z-index: 40; }
.mobileDrawerNav { display: grid; gap: 6px; margin-top: 20px; }
.mobileDrawerNav button { align-items: center; background: rgba(255,255,255,.055); border: 1px solid rgba(255,255,255,.1); border-radius: var(--radius-control); color: inherit; display: grid; gap: 10px; grid-template-columns: 20px minmax(0,1fr) auto; min-height: 42px; padding: 0 12px; text-align: left; }
.mobileDrawerNav .lucideIcon { height: 18px; width: 18px; }
.mobileDrawerNav small { color: var(--prism-sidebar-muted); }
.mobileSheetFields { display: grid; gap: 14px; min-height: 0; overflow-y: auto; padding: 20px 0; }
.mobileSheetActions { display: grid; gap: 8px; grid-template-columns: repeat(2,minmax(0,1fr)); }
.mobileSheetActions button { border: 1px solid var(--prism-border); border-radius: var(--radius-control); min-height: 42px; }
.mobileSheetActions button:last-child { background: var(--prism-text-primary); color: white; }
.mobileSheetHead strong { display: block; margin-top: 4px; }

.toast { align-items: center; background: var(--prism-sidebar-bg); border: 1px solid rgba(255,255,255,.12); border-radius: var(--radius-control); bottom: 18px; color: var(--prism-sidebar-strong); display: flex; gap: 16px; justify-content: space-between; left: 50%; max-width: min(92vw, 480px); padding: 12px 14px; position: fixed; transform: translateX(-50%); z-index: 60; }
.toast span { font-size: .78rem; line-height: 1.35; }
.toast button { background: white; border: 0; border-radius: 8px; color: var(--prism-text-primary); font-size: .72rem; font-weight: 750; min-height: 30px; padding: 0 10px; }

@media (max-width: 1020px) {
  .prismShell[data-sidebar="expanded"] { grid-template-columns: 64px minmax(0, 1fr); }
}

@media (max-width: 767px) {
  body { overflow: auto; }
  .flowBoard { min-height: 100svh; height: auto; }
  .prismShell { display: block; min-height: 100svh; }
  .prismSidebar { display: none; }
  .prismWorkspace { display: block; }
  .mobilePrismHeader { display: grid; }
  .prismCommandBar { padding: 10px 12px; }
  .commandSelect.desktopOnlyControl { display: none; }
  .prismContent { height: auto; min-height: calc(100svh - 120px); overflow: visible; padding: 10px; }
  .prismKpis article { border: 1px solid var(--prism-border); border-radius: var(--radius-control); padding: 10px 12px; }
  .prismToolbar { padding: 12px; }
  .prismFilters { width: 100%; }
  .prismFilters .segmentedControl:first-of-type { flex: 1 1 auto; }
  .prismFilters .segmentedControl:first-of-type button { flex: 1 1 auto; }
  .densityControl { display: none; }
  .resetButton { margin-left: auto; }
  .kanbanLane { min-height: 390px; }
  .prismInspector { border-radius: 14px 14px 0 0; max-height: 90svh; width: 100%; }
  .dragConfirmLayer { align-items: flex-end; padding: 0; }
  .dragConfirm { border-radius: 14px 14px 0 0; max-width: none; padding: 18px; }
  .mobileNavDrawer { min-height: 100svh; }
  .mobileFilterSheet { border-radius: 14px 14px 0 0; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; scroll-behavior: auto !important; transition-duration: .01ms !important; }
}
