/*
Signal Labs Tool File: schedule/pages/requests/open-shifts.css
Version: v5.14.0
Purpose: Open Shifts / VOT Foundation page styling.
*/
.open-shifts-shell {
  width: min(1180px, calc(100% - 32px));
  margin: 0 auto 48px;
  color: #e5eefb;
}
.open-shifts-hero,
.open-shifts-panel,
.open-shifts-form-card {
  border: 1px solid rgba(148, 163, 184, 0.24);
  border-radius: 24px;
  background: rgba(15, 23, 42, 0.72);
  box-shadow: 0 18px 40px rgba(15, 23, 42, 0.16);
}
.open-shifts-hero { padding: 28px; margin-bottom: 18px; }
.open-shifts-hero h1 { margin: 0 0 10px; font-size: clamp(2rem, 4vw, 3.4rem); }
.open-shifts-hero p,
.open-shifts-panel p,
.open-shifts-form-card p { color: rgba(226, 232, 240, 0.78); line-height: 1.7; }
.open-shifts-grid { display: grid; grid-template-columns: minmax(280px, 0.82fr) minmax(320px, 1.18fr); gap: 18px; }
.open-shifts-panel,
.open-shifts-form-card { padding: 22px; }
.open-shift-summary { display: grid; gap: 10px; margin: 16px 0; }
.open-shift-stat { padding: 14px; border: 1px solid rgba(148, 163, 184, 0.22); border-radius: 16px; background: rgba(30, 41, 59, 0.52); }
.open-shift-stat strong { display:block; font-size: 1.65rem; }
.open-shift-status-line { color: rgba(125, 211, 252, 0.95); font-weight: 750; }
.vot-form-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.vot-form-grid label,
.vot-notes label { display: grid; gap: 6px; color: rgba(226, 232, 240, 0.9); font-weight: 750; }
.vot-form-grid input,
.vot-form-grid select,
.vot-notes textarea { width: 100%; border: 1px solid rgba(148, 163, 184, 0.28); border-radius: 12px; padding: 10px 12px; color: #f8fafc; background: rgba(15, 23, 42, 0.9); }
.vot-notes { margin-top: 12px; }
.vot-hours-preview { margin-top: 14px; padding: 14px; border-radius: 16px; border: 1px solid rgba(34, 197, 94, 0.32); background: rgba(34, 197, 94, 0.1); }
.vot-hours-preview strong { display:block; font-size: 1.45rem; }
.open-shift-list { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 14px; margin-top: 14px; }
.open-shift-card { padding: 18px; border: 1px solid rgba(148, 163, 184, 0.24); border-radius: 20px; background: rgba(15, 23, 42, 0.68); }
.open-shift-card--short { border-color: rgba(248, 113, 113, 0.5); }
.open-shift-card--watch { border-color: rgba(250, 204, 21, 0.45); }
.open-shift-card__topline { display: flex; justify-content: space-between; gap: 10px; color: rgba(125, 211, 252, 0.92); font-weight: 850; font-size: .82rem; text-transform: uppercase; letter-spacing: .07em; }
.open-shift-card h3 { margin: 12px 0 4px; }
.open-shift-details { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; margin: 14px 0; }
.open-shift-details div { padding: 10px; border-radius: 14px; background: rgba(30, 41, 59, 0.56); }
.open-shift-details dt { color: rgba(148, 163, 184, 0.95); font-size: .78rem; text-transform: uppercase; }
.open-shift-details dd { margin: 4px 0 0; font-weight: 800; }
.open-shift-tags { display: flex; flex-wrap: wrap; gap: 8px; margin: 12px 0; }
.open-shift-tags span { border: 1px solid rgba(34, 197, 94, 0.34); color: rgba(220, 252, 231, 0.96); border-radius: 999px; padding: 6px 9px; font-size: .82rem; background: rgba(34, 197, 94, 0.1); }
.open-shift-card button { width: 100%; border: 0; border-radius: 14px; padding: 11px; font-weight: 900; color: rgba(15, 23, 42, .82); background: rgba(226, 232, 240, .72); }
.vot-request-list { display: grid; gap: 10px; margin-top: 14px; }
.vot-request-card { display: flex; justify-content: space-between; gap: 12px; padding: 14px; border: 1px solid rgba(148, 163, 184, 0.22); border-radius: 16px; background: rgba(30, 41, 59, 0.52); }
.vot-request-card h3 { margin: 0 0 4px; }
.vot-request-card p { margin: 0; }
.reason-list { display: grid; grid-template-columns: repeat(auto-fit, minmax(210px, 1fr)); gap: 10px; padding: 0; list-style: none; }
.reason-list li { padding: 12px; border-radius: 16px; border: 1px solid rgba(148, 163, 184, 0.22); background: rgba(30, 41, 59, 0.52); }
.reason-list strong, .reason-list span { display: block; }
.reason-list span { margin-top: 4px; color: rgba(226, 232, 240, 0.72); font-size: .88rem; }
@media (max-width: 860px) { .open-shifts-grid, .vot-form-grid { grid-template-columns: 1fr; } }
@media (max-width: 720px) { .open-shifts-shell { width: min(100% - 20px, 1180px); } }
.opportunity-filter {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin: 12px 0 4px;
}
.opportunity-filter button,
.open-shift-card button,
.award-button {
  border: 1px solid rgba(148, 163, 184, 0.28);
  border-radius: 999px;
  padding: 9px 12px;
  color: rgba(226, 232, 240, 0.95);
  background: rgba(30, 41, 59, 0.72);
  font-weight: 850;
  cursor: pointer;
}
.opportunity-filter button[aria-pressed="true"] {
  border-color: rgba(125, 211, 252, 0.64);
  background: rgba(14, 165, 233, 0.2);
}
.open-shift-card--selected {
  outline: 2px solid rgba(125, 211, 252, 0.72);
  outline-offset: 3px;
}
.open-shift-card button {
  width: 100%;
  margin-top: 10px;
}
.section-heading-row {
  display: flex;
  justify-content: space-between;
  gap: 14px;
  align-items: flex-start;
}
.section-heading-row h2,
.section-heading-row p { margin-top: 0; }
.section-heading-row > span {
  border: 1px solid rgba(125, 211, 252, 0.36);
  border-radius: 999px;
  padding: 8px 12px;
  color: rgba(224, 242, 254, 0.96);
  background: rgba(14, 165, 233, 0.12);
  font-weight: 900;
  white-space: nowrap;
}
.opportunity-preview-card {
  display: grid;
  gap: 5px;
  margin-top: 14px;
  padding: 14px;
  border: 1px solid rgba(125, 211, 252, 0.32);
  border-radius: 16px;
  background: rgba(14, 165, 233, 0.1);
}
.opportunity-preview-card strong,
.opportunity-preview-card span,
.opportunity-preview-card small { display: block; }
.award-review {
  display: grid;
  gap: 14px;
  margin-top: 14px;
}
.award-review__header {
  display: flex;
  justify-content: space-between;
  gap: 16px;
  padding: 16px;
  border: 1px solid rgba(148, 163, 184, 0.22);
  border-radius: 18px;
  background: rgba(30, 41, 59, 0.48);
}
.award-review__header h3,
.award-review__header p { margin: 0; }
.award-review__recommendation {
  min-width: 210px;
  padding: 12px;
  border-radius: 16px;
  border: 1px solid rgba(34, 197, 94, 0.34);
  background: rgba(34, 197, 94, 0.1);
}
.award-review__recommendation span,
.award-review__recommendation strong { display: block; }
.award-review__recommendation span { color: rgba(187, 247, 208, 0.82); font-size: .82rem; text-transform: uppercase; letter-spacing: .07em; }
.award-review__recommendation strong { margin-top: 4px; font-size: 1.2rem; }
.eligibility-rules {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.eligibility-rules span {
  border: 1px solid rgba(148, 163, 184, 0.24);
  border-radius: 999px;
  padding: 7px 10px;
  background: rgba(15, 23, 42, 0.72);
  color: rgba(226, 232, 240, 0.88);
  font-size: .86rem;
  font-weight: 800;
}
.volunteer-table {
  display: grid;
  gap: 8px;
}
.volunteer-table__row {
  display: grid;
  grid-template-columns: minmax(180px, 1.2fr) .45fr .65fr 1fr;
  gap: 10px;
  align-items: center;
  padding: 12px;
  border: 1px solid rgba(148, 163, 184, 0.2);
  border-radius: 14px;
  background: rgba(15, 23, 42, 0.58);
}
.volunteer-table__row--head {
  color: rgba(125, 211, 252, 0.95);
  font-size: .78rem;
  font-weight: 900;
  text-transform: uppercase;
  letter-spacing: .07em;
}
.volunteer-table small { display:block; margin-top: 3px; color: rgba(226, 232, 240, 0.62); }
.empty-state {
  padding: 14px;
  border: 1px dashed rgba(148, 163, 184, 0.32);
  border-radius: 16px;
  color: rgba(226, 232, 240, 0.72);
}
.award-button:disabled {
  opacity: .72;
  cursor: not-allowed;
}
@media (max-width: 780px) {
  .award-review__header,
  .section-heading-row { flex-direction: column; }
  .award-review__recommendation { min-width: 0; }
  .volunteer-table__row { grid-template-columns: 1fr; }
}