:root {
  --bg: #ffffff;
  --card: #ffffff;
  /* Matches the card stroke used in the brand illustrations (#E5E7EB) */
  --card-border: #e5e7eb;
  --card-hover: #f8fafc;
  --border: #e5e7eb;
  --muted: #6b7280;
  --text: #1f2d2a;
  /* Brand palette — Astravyn HR (landing page) */
  --illus-sage: #7ba078;
  --illus-green-deep: #4e7a68;
  --illus-gold: #d9b25f;
  --illus-bg-soft: #e3e9f8;
  --brand-blue: #4563c0;
  --brand-blue-deep: #3450a8;
  --accent: #4563c0;
  --accent-2: #3450a8;
  --accent-soft: rgba(69, 99, 192, 0.12);
  --success: #4e7a68;
  --danger: #ef4444;
  --radius: 16px;
}

html,
body {
  background: var(--bg) !important;
  background-image: none !important;
}

html[data-theme="dark"] {
  color-scheme: dark;
  --bg: #0f1419;
  --card: #171e28;
  --card-border: #2a3544;
  --card-hover: #1e2836;
  --border: #2a3544;
  --muted: #94a3b8;
  --text: #e8eef7;
  --illus-bg-soft: #1a2433;
  --brand-blue: #6b8adf;
  --brand-blue-deep: #8aa3e8;
  --accent: #6b8adf;
  --accent-2: #8aa3e8;
  --accent-soft: rgba(107, 138, 223, 0.16);
}

html[data-theme="dark"] body {
  color: var(--text);
}

/* Welcome dashboard */
.welcome-container {
  background: var(--bg) !important;
  background-image: none !important;
}

.user-info-card,
.quick-actions-card,
.quick-stats-card,
.calendar-preview-section,
.dashboard-shell-card,
.summary-chart-card,
.mini-metric-card {
  background: var(--card) !important;
  border-color: var(--card-border) !important;
}

/* Attendance Dashboard: remove the outer card shell so only the inner panels
   read as cards (no card-on-card). */
.calendar-preview-section.attendance-dashboard {
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  padding: 0 !important;
}

/* Landing feature cards: illustrations sit directly on the card surface. */
.feature-illustration {
  border: none !important;
  background: transparent !important;
  border-radius: 0 !important;
}

/* Welcome dashboard: flatten nested mini panels inside shell cards. */
.metric-mini-card,
.month-stats-attendance,
.summary-chart-card.mini-chart-card {
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
}

.month-stats-attendance {
  border-top: 1px solid #eef2f6 !important;
  border-radius: 0 !important;
  padding-top: 12px !important;
}

.quick-actions-card .action-link {
  background: transparent !important;
  border: none !important;
  border-top: 1px solid #eef2f6 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}

.inline-stat {
  background: transparent !important;
  border: none !important;
  border-radius: 0 !important;
}

/* Timesheet editor */
.category-container,
.time-tracking-clock-card,
.summary-card,
.key-metrics-card,
.chart-card,
.calendar-section.dashboard-card,
.summary-cell-card {
  background: var(--card) !important;
  border-color: var(--card-border) !important;
}

/* Dashboard/calendar container — no border color */
.main-dashboard-container.left.card {
  background: var(--card) !important;
  border: none !important;
}

.category-container,
.summary-card {
  border: 1px solid var(--card-border) !important;
}

/* Work Hours + Month Stats + Attendance moved below the calendar (left column) */
.calendar-left-col .summary-right-workhours,
.calendar-left-col .calendar-attendance-chart .chart-card {
  border: 1px solid var(--card-border) !important;
}

/* Time Tracking card — no inner border */
.time-tracking-clock-card {
  border: none !important;
}

.info-container {
  background: var(--card) !important;
}

/* Action sections — flat layout with line dividers (no nested cards) */
.actions-container .action-section {
  background: transparent !important;
  border: none !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  padding: 0 20px !important;
}

.actions-container .action-section:first-child {
  padding-left: 0 !important;
}

.actions-container .action-section:not(:first-child) {
  border-left: 1px solid var(--card-border, #e5e7eb) !important;
}

@media (max-width: 768px) {
  .actions-container .action-section:not(:first-child) {
    border-left: none !important;
    border-top: 1px solid var(--card-border, #e5e7eb) !important;
    padding-left: 0 !important;
    padding-top: 16px !important;
  }
}

/* Settings modal */
.settings-card,
.settings-modal-container,
.reminder-management-list {
  background: var(--card) !important;
  border-color: var(--card-border) !important;
}

.settings-card,
.settings-modal-container {
  border: 1px solid var(--card-border) !important;
}

/* Landing */
.feature-card,
.pricing-highlight,
.step-card {
  background: var(--card) !important;
  border-color: var(--card-border) !important;
}

/* Pricing */
.plan {
  background: var(--card) !important;
  border-color: var(--card-border) !important;
}

/* User details / account settings */
.card-section {
  background: var(--card) !important;
  border: 1px solid var(--card-border) !important;
}

/* Shared card surfaces on standalone pages */
.card,
.form-card,
.section-card,
.workspace {
  background: var(--card) !important;
  border-color: var(--card-border) !important;
}

.card,
.form-card,
.section-card {
  border: 1px solid var(--card-border) !important;
}

/* Timesheet layout wrapper — no outer box */
.container > .card {
  border: none !important;
  box-shadow: none !important;
  background: transparent !important;
}

/* Auth modals — keep a neutral frame; do not inherit page card-border accents */
.auth-modal-content {
  background: var(--card) !important;
  border: 1px solid #e5e7eb !important;
}