/**
 * NEXUS V.2.0.0 - Custom Styles
 *
 * ⚠️ CRITICAL: READ GOVUK_ONLY_POLICY.md BEFORE ADDING ANYTHING HERE
 *
 * RULE: ONLY use GOV.UK Frontend - V.1 CSS is BROKEN and FORBIDDEN
 *
 * This file should be NEARLY EMPTY.
 * GOV.UK Frontend provides 99% of what you need.
 *
 * Only add CSS here if:
 * 1. GOV.UK Frontend genuinely doesn't have it
 * 2. You've documented why it's needed
 * 3. You've followed GOV.UK patterns
 * 4. You've tested accessibility
 */

/**
 * Print styles
 * (Not in GOV.UK Frontend, but needed for printing)
 */
@media print {
  .govuk-header,
  .govuk-footer,
  .govuk-phase-banner {
    display: none;
  }
}

/**
 * Custom components not in GOV.UK Design System
 * (Following GOV.UK color palette and spacing)
 */

/* Card components - Transaction/Listing cards */
.nexus-card {
  background: #f8f8f8;
  padding: 15px 20px;
  margin-bottom: 24px;
}

.nexus-card--border-left-blue {
  border-left: 3px solid #1d70b8; /* GOV.UK blue */
}

.nexus-card--border-left-green {
  border-left: 3px solid #00703c; /* GOV.UK green */
}

.nexus-card--border-left-grey {
  border-left: 3px solid #505a5f; /* GOV.UK mid grey */
}

.nexus-card--border-left-primary {
  border-left: 4px solid #1d70b8; /* GOV.UK blue (thicker) */
}

/* Stats panel - Used in dashboard/profile sidebars */
.nexus-stats-panel {
  background: #f3f2f1; /* GOV.UK light grey */
  border: 1px solid #b1b4b6; /* GOV.UK mid grey */
  padding: 20px;
}

/* Reputation panel - User rating display */
.nexus-reputation-panel {
  background: #1d70b8; /* GOV.UK blue */
  color: white;
  border-radius: 4px;
  padding: 20px;
  margin-bottom: 24px;
}

.nexus-reputation-panel__column {
  text-align: center;
}

.nexus-reputation-panel__text {
  color: white;
}

/* Avatar components */
.nexus-avatar {
  width: 100%;
  max-width: 200px;
  border-radius: 8px;
  border: 2px solid #1d70b8; /* GOV.UK blue */
}

.nexus-avatar-placeholder {
  width: 100%;
  max-width: 200px;
  aspect-ratio: 1;
  background: #f3f2f1; /* GOV.UK light grey */
  border: 2px solid #b1b4b6; /* GOV.UK mid grey */
  border-radius: 8px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 4rem;
  color: #505a5f; /* GOV.UK mid grey */
}

/* Color utilities - Using GOV.UK color palette */
.nexus-color-muted {
  color: #505a5f; /* GOV.UK mid grey - for secondary text */
}

.nexus-color-success {
  color: #00703c; /* GOV.UK green - for positive values */
}

.nexus-color-error {
  color: #d4351c; /* GOV.UK red - for negative values */
}

.nexus-color-primary {
  color: #1d70b8; /* GOV.UK blue - for primary highlights */
}

/* Layout utilities */
.nexus-flex-space-between {
  display: flex;
  justify-content: space-between;
  align-items: start;
}

.nexus-text-right {
  text-align: right;
}

.nexus-text-center {
  text-align: center;
}

/* Transaction credit amounts */
.nexus-credit-amount {
  font-weight: 600;
}

.nexus-credit-sent {
  color: #d4351c; /* GOV.UK red */
}

.nexus-credit-received {
  color: #00703c; /* GOV.UK green */
}

.nexus-credit-large {
  font-size: 1.5rem;
}

/* Profile completeness bar */
.nexus-completeness-bar {
  width: 100%;
  height: 24px;
  background: #d8dde0; /* GOV.UK light grey */
  border-radius: 4px;
  overflow: hidden;
}

.nexus-completeness-bar__fill {
  height: 100%;
  background: #00703c; /* GOV.UK green */
  transition: width 0.3s ease;
}

/* Chart containers - Dashboard charts */
.nexus-chart-container {
  background: white;
  padding: 20px;
  border: 1px solid #b1b4b6; /* GOV.UK mid grey */
}

.nexus-chart-container canvas {
  max-height: 200px;
}

/* Admin dashboard - Stat panels */
.nexus-admin-stat-panel {
  margin-bottom: 20px;
}

.nexus-admin-stat-panel--blue {
  background-color: #1d70b8 !important; /* GOV.UK blue */
}

.nexus-admin-stat-panel--green {
  background-color: #00703c !important; /* GOV.UK green */
}

.nexus-admin-stat-panel--orange {
  background-color: #f47738 !important; /* GOV.UK orange */
}

.nexus-admin-stat-panel--purple {
  background-color: #912b88 !important; /* GOV.UK purple */
}

.nexus-admin-stat-panel__label {
  font-size: 1.2rem;
}

.nexus-admin-stat-panel__value {
  font-size: 3rem !important;
}

.nexus-admin-stat-panel__meta {
  font-size: 0.9rem;
}

/* Admin helpers */
.nexus-admin-actions {
  text-align: right;
  padding-top: 1rem;
}

.nexus-admin-bulk-actions {
  padding-top: 2.5rem;
}

/* Admin audit log formatting */
.nexus-admin-audit-changes {
  font-size: 12px;
  overflow-x: auto;
}

/* Message components - Inbox and conversation styling */
.nexus-message-unread {
  border-left: 4px solid #1d70b8; /* GOV.UK blue */
  background-color: #f8f8f8; /* GOV.UK light grey */
}

.nexus-message-thread {
  max-width: 800px;
}

.nexus-message {
  margin-bottom: 20px;
  padding: 15px;
  border-radius: 4px;
}

.nexus-message--sent {
  background-color: #e8f4f8; /* Light blue tint */
  margin-left: 40px;
}

.nexus-message--received {
  background-color: #f3f2f1; /* GOV.UK light grey */
  margin-right: 40px;
}

.nexus-message__header {
  margin-bottom: 10px;
  display: flex;
  justify-content: space-between;
  align-items: baseline;
}

.nexus-message__sender {
  font-weight: 700;
}

.nexus-message__time {
  color: #505a5f; /* GOV.UK mid grey */
  font-size: 0.875rem;
}

.nexus-message__body {
  line-height: 1.5;
}

/* User Menu Dropdown - Accessible dropdown menu for user navigation */
.nexus-user-menu {
  position: relative;
}

.govuk-service-navigation__link.nexus-user-menu__toggle {
  background: none;
  border: none;
  cursor: pointer;
  font-family: "GDS Transport", arial, sans-serif;
  font-size: 16px !important;
  line-height: 1.25 !important;
  font-weight: 400;
  display: inline-flex !important;
  align-items: center;
  gap: 6px;
  white-space: nowrap;
  text-decoration: none !important;
  padding: 5px 8px !important;
  margin: -5px -8px;
  box-sizing: border-box;
}

.govuk-service-navigation__link.nexus-user-menu__toggle:hover {
  text-decoration: underline !important;
  text-decoration-thickness: 3px;
  text-underline-offset: 0.1578em;
}

.govuk-service-navigation__link.nexus-user-menu__toggle:focus {
  outline: 3px solid #ffdd00 !important; /* GOV.UK focus yellow */
  outline-offset: 0 !important;
  text-decoration: none !important;
  box-shadow: none !important;
}

/* Yellow background only when dropdown is closed */
.govuk-service-navigation__link.nexus-user-menu__toggle:focus:not([aria-expanded="true"]) {
  color: #0b0c0c !important; /* GOV.UK black */
  background-color: #ffdd00 !important; /* GOV.UK focus yellow */
}

/* No yellow background when dropdown is open - just outline */
.govuk-service-navigation__link.nexus-user-menu__toggle:focus[aria-expanded="true"] {
  outline-color: transparent !important;
  background-color: transparent !important;
}

.nexus-user-menu__info {
  display: inline-flex;
  align-items: center;
  gap: 6px;
}

.nexus-user-menu__name {
  font-weight: 700;
}

.nexus-user-menu__separator {
  color: #505a5f; /* GOV.UK mid grey */
  font-weight: 400;
}

.nexus-user-menu__credits {
  font-size: 14px;
  font-weight: 400;
}

.nexus-user-menu__rating {
  font-size: 14px;
  font-weight: 400;
}

.nexus-user-menu__icon {
  transition: transform 0.15s ease-in-out;
  flex-shrink: 0;
  width: 12px;
  height: 12px;
  margin-left: 6px;
  vertical-align: middle;
}

.nexus-user-menu__toggle[aria-expanded="true"] .nexus-user-menu__icon {
  transform: rotate(180deg);
}

.nexus-user-menu__dropdown {
  position: absolute;
  top: calc(100% + 10px);
  right: 0;
  margin: 0;
  padding: 0;
  list-style: none;
  background: #ffffff;
  border: 1px solid #b1b4b6; /* GOV.UK mid grey */
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.18);
  min-width: 220px;
  max-width: 300px;
  z-index: 10002;
  border-radius: 0;
  isolation: isolate;
  overflow: hidden;
  box-sizing: border-box;
}

.nexus-user-menu__dropdown[hidden] {
  display: none;
}

/* Ensure dropdown appears above all content */
.govuk-service-navigation__item.nexus-user-menu {
  z-index: 10001;
  isolation: isolate;
}

.nexus-user-menu__item {
  margin: 0;
  padding: 0;
  list-style: none;
  overflow: hidden;
}

/* Mobile positioning adjustment */
@media (max-width: 40.0525em) {
  .nexus-user-menu__dropdown {
    top: calc(100% + 8px);
    right: -15px;
    min-width: 200px;
  }
}

/* Desktop tablet+ positioning */
@media (min-width: 40.0625em) {
  .govuk-service-navigation__item.nexus-user-menu {
    position: relative;
  }

  .nexus-user-menu__dropdown {
    top: calc(100% + 12px);
  }
}

.nexus-user-menu__link {
  display: block;
  position: relative;
  padding: 15px 20px;
  padding-left: 25px;
  font-family: "GDS Transport", arial, sans-serif;
  font-size: 16px;
  line-height: 1.25;
  font-weight: 400;
  color: #1d70b8; /* GOV.UK link blue */
  text-decoration: none;
  border: none;
  background: #ffffff;
  width: 100%;
  text-align: left;
  cursor: pointer;
  border-left: 5px solid transparent;
  transition: none;
  box-sizing: border-box;
}

.nexus-user-menu__link:hover {
  background-color: #f3f2f1; /* GOV.UK light grey */
  color: #003078; /* GOV.UK link hover blue */
  text-decoration: underline;
  text-decoration-thickness: 3px;
  text-underline-offset: 0.1578em;
  border-left-color: #1d70b8; /* GOV.UK link blue */
}

.nexus-user-menu__link:focus {
  outline: 3px solid #ffdd00 !important; /* GOV.UK focus yellow */
  outline-offset: -3px !important;
  color: #0b0c0c; /* GOV.UK black */
  background-color: #ffdd00; /* GOV.UK focus yellow */
  border-left-color: #0b0c0c; /* GOV.UK black */
  text-decoration: none;
  z-index: 1;
}

.nexus-user-menu__link:active {
  color: #0b0c0c; /* GOV.UK black */
  background-color: #ffdd00; /* GOV.UK focus yellow */
  border-left-color: #0b0c0c; /* GOV.UK black */
  text-decoration: none;
}

.nexus-user-menu__link--button {
  font-weight: 400;
}

.nexus-user-menu__divider {
  height: 1px;
  background: #b1b4b6; /* GOV.UK mid grey */
  margin: 5px 0;
  border: none;
  list-style: none;
}

.nexus-nav-logout-form {
  margin: 0;
  padding: 0;
}

/* Mobile-specific adjustments */
@media (max-width: 40.0525em) {
  .nexus-user-menu__toggle {
    font-size: 14px !important;
    gap: 4px;
  }

  .nexus-user-menu__info {
    gap: 4px;
  }

  .nexus-user-menu__name {
    font-size: 14px;
  }

  .nexus-user-menu__credits,
  .nexus-user-menu__rating {
    font-size: 12px;
  }

  .nexus-user-menu__separator {
    font-size: 12px;
  }

  .nexus-user-menu__icon {
    width: 10px;
    height: 10px;
    margin-left: 4px;
  }

  .nexus-user-menu__link {
    padding: 12px 15px;
    padding-left: 20px;
    font-size: 16px;
  }
}

/* Prevent any overflow from focus states */
.nexus-user-menu,
.nexus-user-menu__dropdown,
.nexus-user-menu__item {
  -webkit-transform: translateZ(0);
  transform: translateZ(0);
}

/**
 * NOTES:
 * - For panels: Use {{ govukPanel() }}
 * - For colors: Use GOV.UK color classes or nexus-color-* when needed
 * - For spacing: Use govuk-!-margin-* and govuk-!-padding-*
 * - For text: Use govuk-heading-* and govuk-body-*
 * - For layouts: Use govuk-grid-row and govuk-grid-column-*
 *
 * See: https://design-system.service.gov.uk/
 */
