/* =========================================================
   File: assets/css/events.css
   Project: DumagueteAA QCS Lite
   Version: 0.1.0

   Purpose:
   Events Capability styling.

   Supports:
   - Events section
   - Event cards
   - Convention teaser
   - Event object presentation
   - Registration prompts
   - Payment component integration

   Event = Object
   Payment = Component

   ========================================================= */


/* =========================================================
   01) EVENTS SECTION
   ========================================================= */

.daa-events {
  background: var(--daa-bg-section);
}


/* =========================================================
   02) EVENT GRID
   ========================================================= */

.daa-events-grid {
  display: grid;
  gap: var(--daa-space-md);
}


/* =========================================================
   03) EVENT CARD
   ========================================================= */

.daa-event-card {
  padding: var(--daa-space-md);

  background: var(--daa-bg-card);

  border: 1px solid var(--daa-border-soft);
  border-radius: var(--daa-radius-soft);
}

.daa-event-card h3 {
  margin-bottom: 0.5rem;
}


/* =========================================================
   04) EVENT META
   ========================================================= */

.daa-event-meta {
  color: var(--daa-text-muted);
  font-size: 0.95rem;

  margin-bottom: var(--daa-space-sm);
}


/* =========================================================
   05) CONVENTION TEASER
   ========================================================= */

.daa-convention-teaser {
  padding: var(--daa-space-md);

  background: var(--daa-bg-light);

  border: 1px solid var(--daa-border-soft);
  border-radius: var(--daa-radius-soft);
}


/* =========================================================
   06) EVENT OBJECT
   ========================================================= */

.daa-event-object {
  max-width: var(--daa-max-content);
}

.daa-event-object-section {
  margin-bottom: var(--daa-space-lg);
}


/* =========================================================
   07) EVENT DETAILS
   ========================================================= */

.daa-event-details {
  display: grid;
  gap: var(--daa-space-sm);
}

.daa-event-detail {
  padding-bottom: var(--daa-space-sm);

  border-bottom: 1px solid var(--daa-border-soft);
}


/* =========================================================
   08) EVENT PAYMENT COMPONENT
   ========================================================= */

.daa-event-payment {
  margin-top: var(--daa-space-md);
}


/* =========================================================
   09) EVENT STATUS
   ========================================================= */

.daa-event-status {
  display: inline-block;

  padding: 0.25rem 0.75rem;

  border: 1px solid var(--daa-border-soft);
  border-radius: 999px;

  font-size: 0.875rem;
}

.daa-event-status--upcoming {
  background: var(--daa-bg-light);
}


/* =========================================================
   10) EVENT UPDATES
   ========================================================= */

.daa-event-updates {
  margin-top: var(--daa-space-lg);
}