/* cal-quick-add-card.css — Calm quick-add overlay (#1425)
   Loaded after kalender-blod-bolge.css to override slate/cool tokens. */

/* Variable rebinding — neutralise Blod Bolge slate inside the card */
.cal-quick-add-card,
.cal-quick-add-card * {
  --bb-slate: #6E8A7E;
  --bb-slate-dark: #4A7A68;
  --bb-slate-light: #EFF2EE;
  --bb-slate-bg: #FBF8F2;
  --bb-divider: #EDE6DA;
}

/* ---- Card shell ---- */

.cal-quick-add-card {
  background: #FFFEFB !important;
  border: 1px solid #E0D6C6 !important;
  border-radius: 14px !important;
  width: 320px;
  max-width: calc(100vw - 32px);
  box-shadow:
    0 1px 3px rgba(58, 47, 38, 0.06),
    0 4px 12px rgba(58, 47, 38, 0.04),
    0 8px 24px rgba(58, 47, 38, 0.03) !important;
  transition: box-shadow 0.15s ease;
}

.cal-quick-add-card:focus-within {
  box-shadow: none !important;
  outline: none !important;
}

/* ---- Date landmark ---- */

.cal-quick-add-card .cal-quick-add-date {
  font-size: 11px !important;
  font-weight: 700 !important;
  text-transform: uppercase;
  letter-spacing: 0.10em !important;
  color: #9A8E82 !important;
  display: flex;
  align-items: center;
  gap: 6px;
}

.cal-quick-add-card .cal-quick-add-date[data-calm-today="1"]::after {
  content: '';
  display: block;
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: #6E8A7E;
  flex-shrink: 0;
}

.cal-quick-add-card .cal-quick-add-date[data-calm-soon="1"]::after {
  content: '';
  display: block;
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: #C6D0CA;
  flex-shrink: 0;
}

/* ---- Input ---- */

.cal-quick-add-card .cal-quick-add-input {
  font-size: 14.5px !important;
  font-weight: 600 !important;
  color: #3A2F26 !important;
  caret-color: #6E8A7E !important;
  background: #FFFEFB !important;
  border: none !important;
  outline: none !important;
  box-shadow: none !important;
}

.cal-quick-add-card .cal-quick-add-input::placeholder {
  font-size: 14.5px !important;
  font-weight: 400 !important;
  color: #9A8E82 !important;
}

.cal-quick-add-card .cal-quick-add-input:focus-visible {
  border: none !important;
  outline: none !important;
  box-shadow: none !important;
}

/* ---- Actions row ---- */

.cal-quick-add-card .cal-quick-add-actions {
  border-top-color: #EDE6DA !important;
  background: #FBF8F2 !important;
}

/* ---- Flere detaljer ---- */

.cal-quick-add-card .cal-quick-add-details {
  height: 32px;
  border-radius: 10px !important;
  color: #4A7A68 !important;
  border: none;
  background: transparent;
  padding: 0 10px;
  transition: background-color 0.15s ease;
}

.cal-quick-add-card .cal-quick-add-details:hover {
  background: #EFF2EE !important;
  color: #4A7A68 !important;
}

.cal-quick-add-card .cal-quick-add-details:focus-visible {
  background: #EFF2EE !important;
  color: #4A7A68 !important;
  outline: none !important;
}

.cal-quick-add-card .cal-quick-add-details:focus {
  background: #EFF2EE !important;
  color: #4A7A68 !important;
  outline: none !important;
}

.cal-quick-add-card .cal-quick-add-details svg {
  opacity: 1 !important;
  stroke: #4A7A68;
}

/* ---- Mic ---- */

.cal-quick-add .cal-quick-add-card .cal-qa-mic {
  width: 36px;
  height: 36px;
  border-radius: 12px !important;
  border: none;
  background: transparent;
  color: #5C4D43 !important;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  transition: background-color 0.15s ease;
}

.cal-quick-add .cal-quick-add-card .cal-qa-mic svg {
  stroke: #5C4D43;
}

.cal-quick-add .cal-quick-add-card .cal-qa-mic:hover {
  background: #F4EFE5 !important;
  color: #5C4D43 !important;
}

.cal-quick-add .cal-quick-add-card .cal-qa-mic:focus-visible {
  background: #F4EFE5 !important;
  color: #5C4D43 !important;
  outline: none !important;
}

.cal-quick-add .cal-quick-add-card .cal-qa-mic:focus {
  background: #F4EFE5 !important;
  color: #5C4D43 !important;
  outline: none !important;
}

.cal-quick-add .cal-quick-add-card .cal-qa-mic[data-stt-state="recording"],
.cal-quick-add .cal-quick-add-card .cal-qa-mic.listening {
  background: #EFF2EE !important;
}

/* ---- Gem (save pill) ---- */

.cal-quick-add-card .cal-quick-add-save {
  height: 36px;
  border-radius: 18px !important;
  border: none;
  background: #6E8A7E !important;
  color: #fff !important;
  font-size: 13.5px !important;
  font-weight: 650 !important;
  padding: 0 18px;
  box-shadow: none !important;
  transition: background-color 0.15s ease, transform 0.15s ease !important;
}

.cal-quick-add-card .cal-quick-add-save:hover {
  background: #5E7A6E !important;
  box-shadow: none !important;
  transform: translateY(-1px) !important;
}

.cal-quick-add-card .cal-quick-add-save:active {
  transform: translateY(0) !important;
}

.cal-quick-add-card .cal-quick-add-save:focus-visible {
  background: #5E7A6E !important;
  outline: none !important;
}

.cal-quick-add-card .cal-quick-add-save:focus {
  background: #5E7A6E !important;
  outline: none !important;
}

/* ---- Dark mode overrides — purge remaining slate/cool tokens ---- */

[data-theme="dark"] .cal-quick-add-card .cal-quick-add-input {
  caret-color: #6E8A7E !important;
}

[data-theme="dark"] .cal-quick-add-card .cal-quick-add-save {
  background: #6E8A7E !important;
  box-shadow: none !important;
}

[data-theme="dark"] .cal-quick-add-card .cal-quick-add-save:hover {
  background: #5E7A6E !important;
  box-shadow: none !important;
}

/* ---- Reduced motion ---- */

@media (prefers-reduced-motion: reduce) {
  .cal-quick-add-card,
  .cal-quick-add-card *,
  .cal-quick-add-card *::before,
  .cal-quick-add-card *::after {
    transition: none !important;
    animation: none !important;
  }

  .cal-quick-add-card .cal-quick-add-input,
  .cal-quick-add-card .cal-quick-add-details,
  .cal-quick-add .cal-quick-add-card .cal-qa-mic,
  .cal-quick-add-card .cal-quick-add-save {
    transition: none !important;
  }

  .cal-quick-add-card .cal-quick-add-save:hover {
    transform: none !important;
  }
}

/* ---- Mobile — shrink gracefully ---- */

@media (max-width: 380px) {
  .cal-quick-add-card {
    width: calc(100vw - 32px);
    min-width: 0;
  }
}