/* FEAT-666-FE-1 — AI Recommendation Widget (air-*)
   Dark-first; light theme overrides below.
   Prefix: air-
   390px breakpoint tested.
*/

/* ── Widget container ─────────────────────────────────────────────────────── */
.air-widget {
  margin-bottom: 28px;
}

/* ── Cards list ──────────────────────────────────────────────────────────── */
.air-cards-list {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

/* ── Individual card ─────────────────────────────────────────────────────── */
.air-card {
  background: #252b3b;
  border-radius: 8px;
  padding: 14px 16px;
  border-left-width: 4px;
  border-left-style: solid;
}

.air-card-high   { border-left-color: #5ec97e; }
.air-card-medium { border-left-color: #f0c040; }
.air-card-low    { border-left-color: #9aa3b5; }

/* ── Text element classes (dark default) ─────────────────────────────────── */
.air-heading      { color: #e8eaf0; }
/* air-modal-title: always on dark modal bg — no light override */
.air-modal-title  { color: #e8eaf0; font-size: 16px; font-weight: bold; margin-bottom: 14px; }
/* air-label: inside dark modal boxes — no light override */
.air-label        { color: #9aa3b5; font-size: 13px; margin-top: 12px; display: block; }
.air-card-title   { color: #e8eaf0; font-weight: bold; font-size: 14px; }
.air-card-sub     { color: #9aa3b5; font-size: 13px; margin-bottom: 6px; }
.air-card-detail  { color: #9aa3b5; font-size: 11px; }

/* ── Band badge classes ────────────────────────────────────────────────────── */
.air-badge        { border-radius: 4px; padding: 2px 8px; font-size: 11px; font-weight: bold; }
.air-badge-high   { background: #1a4a2a; color: #5ec97e; }
.air-badge-medium { background: #3a2d00; color: #f0c040; }
.air-badge-low    { background: #2d2d2d; color: #9aa3b5; }

/* ── Action buttons ──────────────────────────────────────────────────────── */
.air-btn-accept,
.air-btn-reject,
.air-btn-edit {
  border: none;
  border-radius: 4px;
  padding: 4px 12px;
  font-size: 12px;
  cursor: pointer;
  font-weight: bold;
}

.air-btn-accept { background: #28a745; color: #fff; }
.air-btn-reject { background: #dc3545; color: #fff; }
.air-btn-edit   { background: #6b7488; color: #fff; }

.air-btn-accept:hover { background: #218838; }
.air-btn-reject:hover { background: #c82333; }
.air-btn-edit:hover   { background: #57606f; }

/* ── 390px responsive ─────────────────────────────────────────────────────── */
@media (max-width: 420px) {
  .air-card { padding: 10px 10px; }
  .air-btn-accept,
  .air-btn-reject,
  .air-btn-edit { padding: 4px 8px; font-size: 11px; }
}

/* ── Light theme ──────────────────────────────────────────────────────────── */
body[data-theme="light"] .air-card        { background: #f4f6fa; }

/* Page-level text overrides */
body[data-theme="light"] .air-heading     { color: #1a1f2e; }
body[data-theme="light"] .air-card-title  { color: #1a1f2e; }
body[data-theme="light"] .air-card-sub    { color: #5a6478; }
body[data-theme="light"] .air-card-detail { color: #5a6478; }

/* Badge light variants — maintain contrast on light card backgrounds */
body[data-theme="light"] .air-badge-high   { background: #d4f0de; color: #1a5c33; }
body[data-theme="light"] .air-badge-medium { background: #fff3cd; color: #7a5a00; }
body[data-theme="light"] .air-badge-low    { background: #e8eaef; color: #4a5568; }

body[data-theme="light"] .air-btn-accept { background: #28a745; color: #fff; }
body[data-theme="light"] .air-btn-reject { background: #dc3545; color: #fff; }
body[data-theme="light"] .air-btn-edit   { background: #6c757d; color: #fff; }

/* ── Booked card state (FEAT-670) ────────────────────────────────────────── */
.air-card-booked  { border-left-color: #28a745; }
.air-badge-booked { background: #1a4a2a; color: #5ec97e; }

.air-booked-detail { margin-left: 8px; }

.air-btn-undo {
  border: 1px solid #6b7488;
  background: transparent;
  color: #9aa3b5;
  border-radius: 4px;
  padding: 4px 12px;
  font-size: 12px;
  cursor: pointer;
}
.air-btn-undo:hover { background: rgba(107, 116, 136, 0.15); }

/* Toasts via className instead of inline colour */
.air-toast-success { color: #28a745; }
.air-toast-error   { color: #dc3545; }

body[data-theme="light"] .air-card-booked  { border-left-color: #28a745; }
body[data-theme="light"] .air-badge-booked { background: #d4f0de; color: #1a5c33; }
body[data-theme="light"] .air-btn-undo     { border-color: #9aa3b5; color: #5a6478; }
body[data-theme="light"] .air-toast-success { color: #1a5c33; }
body[data-theme="light"] .air-toast-error   { color: #c0392b; }

/* ── Show-more button ────────────────────────────────────────────────────── */
.air-show-more-btn {
  background: transparent;
  border: 1px solid #4a90d9;
  color: #4a90d9;
  border-radius: 6px;
  padding: 6px 18px;
  font-size: 13px;
  cursor: pointer;
  margin-top: 10px;
  width: 100%;
}

.air-show-more-btn:hover { background: rgba(74, 144, 217, 0.12); }

body[data-theme="light"] .air-show-more-btn {
  border-color: #1a6fbf;
  color: #1a6fbf;
}

body[data-theme="light"] .air-show-more-btn:hover {
  background: rgba(26, 111, 191, 0.08);
}