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

:root {
  color-scheme: light;
  --bg: #f3f3f3;
  --bg-elev: #ffffff;
  --bg-elev-2: #f7f7f7;
  --bg-input: #ffffff;
  --border: #dedede;
  --border-strong: #cfcfcf;
  --border-bright: #b9b9b9;
  --text: #555555;
  --text-soft: #6f6f6f;
  --text-dim: #888888;
  --text-mute: #b3b3b3;
  --accent: #0797ca;
  --accent-hover: #087eaa;
  --accent-soft: rgba(7, 151, 202, 0.12);
  --accent-glow: rgba(7, 151, 202, 0.28);
  --accent-text: #087eaa;
  --success: #54d99a;
  --danger: #c73f3f;
  --warning: #c28c3c;
  --critical: #df493f;
  --kind-antes: #2ba7df;
  --kind-durante: #f5931d;
  --kind-despues: #df493f;
  --kind-antes-soft: rgba(43, 167, 223, 0.14);
  --kind-durante-soft: rgba(245, 147, 29, 0.14);
  --kind-despues-soft: rgba(223, 73, 63, 0.14);
  --radius: 4px;
  --radius-sm: 3px;
  --radius-lg: 4px;
  --shadow: 0 1px 3px rgba(0, 0, 0, 0.12);
  --mono: "JetBrains Mono", ui-monospace, "SF Mono", Menlo, monospace;
  --sans: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", system-ui, sans-serif;
}

html, body {
  margin: 0;
  background: var(--bg);
  color: var(--text);
  font-family: var(--sans);
  font-feature-settings: "cv11", "ss01";
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

body {
  min-height: 100vh;
  position: relative;
  overflow-x: hidden;
}

body::before {
  content: none;
}

body::after {
  content: none;
}

.hidden { display: none !important; }

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

button { border: 0; background: transparent; cursor: pointer; }
a { color: inherit; }

::selection { background: var(--accent-soft); color: var(--text); }

/* Ticket intake photo staging */
.ticket-intake-photos { margin-top: 12px; }
.ticket-intake-photo-thumbs { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 8px; }
.photo-thumb-item { position: relative; width: 72px; height: 72px; border-radius: 4px; overflow: hidden; border: 1px solid var(--border); }
.photo-thumb-item img { width: 100%; height: 100%; object-fit: cover; display: block; }
.photo-thumb-item .photo-thumb-remove { position: absolute; top: 2px; right: 2px; width: 18px; height: 18px; border-radius: 50%; background: rgba(0,0,0,0.55); color: #fff; font-size: 11px; line-height: 18px; text-align: center; cursor: pointer; border: 0; padding: 0; }
.ticket-intake-photo-actions { display: flex; gap: 8px; align-items: center; }
