/**
 * EHS skin for LearnDash + Groups Plus + first-party shortcode boxes.
 * Loads on the theme shell only (wp_enqueue_scripts). Does not edit plugin PHP.
 *
 * Depends on: ehs-design-tokens.css
 */

/* -------------------------------------------------------------------------
   Global readability on LD wrappers
   ------------------------------------------------------------------------- */
.learndash-wrapper,
.learndash-wrapper * {
  box-sizing: border-box;
}

.learndash-wrapper {
  color: var(--ehs-text);
  font-family: var(--ehs-font);
}

.learndash-wrapper a {
  color: var(--ehs-primary);
}

.learndash-wrapper a:hover,
.learndash-wrapper a:focus {
  color: var(--ehs-primary-hover);
}

/* -------------------------------------------------------------------------
   Buttons (LD + common plugin buttons)
   ------------------------------------------------------------------------- */
.learndash-wrapper .ld-button,
.learndash-wrapper .btn-join,
.learndash-wrapper a.btn-blue,
.learndash-wrapper .ld-expand-button,
.learndash-wrapper .ld-login.ld-button,
.custom-reports-button,
.button.custom-reports-button {
  background: var(--ehs-primary, var(--ehs-primary-hex)) !important;
  background-color: var(--ehs-primary, var(--ehs-primary-hex)) !important;
  border: 1px solid var(--ehs-primary, var(--ehs-primary-hex)) !important;
  border-radius: var(--ehs-radius-sm) !important;
  color: #fff !important;
  box-shadow: var(--ehs-shadow-sm);
  font-weight: 700;
  text-decoration: none !important;
  transition: background-color 0.15s ease, border-color 0.15s ease, box-shadow 0.15s ease;
}

.learndash-wrapper .ld-button:hover,
.learndash-wrapper .ld-button:focus,
.learndash-wrapper a.btn-blue:hover,
.custom-reports-button:hover,
.button.custom-reports-button:hover {
  background: var(--ehs-primary-hover, #152a4a) !important;
  background-color: var(--ehs-primary-hover, #152a4a) !important;
  border-color: var(--ehs-primary-hover, #152a4a) !important;
  color: #fff !important;
  box-shadow: var(--ehs-shadow-md);
}

.learndash-wrapper .ld-button.ld-button-reverse,
.learndash-wrapper .ld-button-reverse,
a.ld-button-reverse {
  background: var(--ehs-surface) !important;
  color: var(--ehs-primary) !important;
  border: 1px solid var(--ehs-border-strong) !important;
}

.learndash-wrapper .ld-button.ld-button-reverse:hover,
a.ld-button-reverse:hover {
  background: var(--ehs-primary-soft) !important;
  color: var(--ehs-primary-hover) !important;
}

/* -------------------------------------------------------------------------
   Profile summary (ld_profile)
   ------------------------------------------------------------------------- */
.learndash-wrapper .ld-profile-summary {
  background: var(--ehs-surface);
  border: 1px solid var(--ehs-border);
  border-radius: var(--ehs-radius);
  box-shadow: var(--ehs-shadow-md);
  padding: 1.25rem 1.5rem;
  margin-bottom: 1.5rem;
}

.learndash-wrapper .ld-profile-summary .ld-profile-card {
  gap: 1rem;
}

.learndash-wrapper .ld-profile-summary .ld-profile-heading {
  color: var(--ehs-text);
  font-weight: 800;
}

.learndash-wrapper .ld-profile-summary .ld-profile-stats {
  border-top: 1px solid var(--ehs-border);
  margin-top: 1rem;
  padding-top: 1rem;
}

.learndash-wrapper .ld-profile-summary .ld-profile-stats .ld-profile-stat {
  border-right: 1px solid var(--ehs-border);
  flex: 1 1 0;
  min-width: 72px;
  padding: 0.25rem 0.5rem !important;
  text-align: center;
}

.learndash-wrapper .ld-profile-summary .ld-profile-stats .ld-profile-stat:last-child {
  border-right: none;
}

.learndash-wrapper .ld-profile-summary .ld-profile-stats .ld-profile-stat strong,
.learndash-wrapper .ld-profile-summary .ld-profile-stats .ld-profile-stat .ld-profile-stat-value {
  color: var(--ehs-primary);
  font-weight: 800;
}

.learndash-wrapper .ld-profile-summary .ld-profile-stats .ld-profile-stat span,
.learndash-wrapper .ld-profile-summary .ld-profile-stats .ld-profile-stat .ld-profile-stat-label {
  color: var(--ehs-text-muted);
  font-size: 0.8rem;
}

/* Course rows in profile */
.learndash-wrapper .ld-course-list-items .ld-item-list-item,
.learndash-wrapper .ld-item-list .ld-item-list-item {
  background: var(--ehs-surface);
  border: 1px solid var(--ehs-border);
  border-radius: var(--ehs-radius-sm);
  margin-bottom: 0.65rem;
  box-shadow: var(--ehs-shadow-sm);
}

.learndash-wrapper .ld-item-list-item:hover {
  border-color: var(--ehs-border-strong);
  box-shadow: var(--ehs-shadow-md);
}

.learndash-wrapper .ld-status,
.learndash-wrapper .ld-status-icon {
  border-radius: 999px;
}

.learndash-wrapper .ld-status-complete,
.learndash-wrapper .ld-status.ld-status-complete {
  background: var(--ehs-success-soft) !important;
  color: var(--ehs-success) !important;
}

.learndash-wrapper .ld-status-progress,
.learndash-wrapper .ld-status.ld-status-in-progress,
.learndash-wrapper .ld-status-incomplete {
  background: var(--ehs-primary-soft) !important;
  color: var(--ehs-primary) !important;
}

.learndash-wrapper .ld-progress .ld-progress-bar .ld-progress-bar-percentage {
  background: var(--ehs-primary) !important;
}

.learndash-wrapper .ld-progress .ld-progress-bar {
  background: var(--ehs-surface-muted) !important;
  border-radius: 999px;
  overflow: hidden;
}

/* -------------------------------------------------------------------------
   Login modal (theme chrome)
   ------------------------------------------------------------------------- */
.learndash-wrapper .ld-modal.ld-login-modal,
.ld-modal.ld-login-modal {
  font-family: var(--ehs-font);
}

.learndash-wrapper .ld-modal .ld-modal-heading,
.ld-modal .ld-modal-heading {
  color: var(--ehs-text);
  font-weight: 800;
}

.learndash-wrapper .ld-login-modal input[type="text"],
.learndash-wrapper .ld-login-modal input[type="password"],
.learndash-wrapper .ld-login-modal input[type="email"],
.ld-login-modal input[type="text"],
.ld-login-modal input[type="password"],
.ld-login-modal input[type="email"] {
  border: 1px solid var(--ehs-border-strong) !important;
  border-radius: var(--ehs-radius-sm) !important;
  color: var(--ehs-text);
}

.learndash-wrapper .ld-login-modal input:focus,
.ld-login-modal input:focus {
  outline: 2px solid var(--ehs-focus);
  border-color: var(--ehs-primary) !important;
}

/* -------------------------------------------------------------------------
   Groups Plus (/reports/) — body.ehs-shell-reports from body_class filter
   Align plugin chrome to EHS design tokens (do not edit vendor PHP).
   ------------------------------------------------------------------------- */

/* Map Groups Plus CSS variables to EHS tokens */
body.ehs-shell-reports {
  --groups-plus-code-bg: var(--ehs-surface, #fff);
  --groups-plus-input-bg: var(--ehs-surface-muted, #f1f5f9);
  --groups-plus-header-bg: var(--ehs-surface-muted, #f8fafc);
  --groups-plus-header-border: var(--ehs-border, #e2e8f0);
  --groups-plus-header-border-radius: var(--ehs-radius, 8px);
  --groups-plus-user-table-hader-bg: var(--ehs-surface-muted, #f1f5f9);
  --groups-plus-user-table-borders-color: var(--ehs-border, #e2e8f0);
  --groups-plus-modal-overlay-bg: rgba(15, 23, 42, 0.45);
  --groups-plus-modal-bg: var(--ehs-surface, #fff);
  --groups-plus-modal-tab-bg: var(--ehs-surface-muted, #eef2f7);
  --groups-plus-modal-tab-active-bg: var(--ehs-surface, #fff);
  --global-palette-btn-bg: var(--ehs-primary-hex, #1b365d);
  --global-palette-btn: #fff;
  --global-palette-btn-bg-hover: #152a4a;
  --global-palette-btn-hover: #fff;
  --global-palette-btn-bg-active: #152a4a;
  --global-palette-btn-active: #fff;
  --global-palette-btn-bg-focus: #152a4a;
  --global-palette-btn-focus: #fff;
}

body.ehs-shell-reports .entry-content,
body.ehs-shell-reports .groups_plus_container {
  font-family: var(--ehs-font, Lato, system-ui, sans-serif);
  color: var(--ehs-text, var(--ehs-text-hex, #1e293b));
  max-width: 1100px;
  margin-left: auto;
  margin-right: auto;
}

body.ehs-shell-reports .entry-title,
body.ehs-shell-reports h1.entry-title {
  color: var(--ehs-primary-hex, #1b365d);
  font-weight: 800;
}

/* Header / seats bar */
body.ehs-shell-reports .groups_plus_header,
body.ehs-shell-reports .groups_plus_header_box,
body.ehs-shell-reports [class*="groups_plus_header"] {
  background: linear-gradient(180deg, #fff, var(--ehs-surface-muted, #f8fafc)) !important;
  border: 1px solid var(--ehs-border, #e2e8f0) !important;
  border-radius: 0.9rem !important;
  box-shadow: var(--ehs-shadow-sm, 0 1px 3px rgba(15, 23, 42, 0.06));
  margin-bottom: 1.25rem;
  padding: 1rem 1.15rem !important;
}

body.ehs-shell-reports .groups_plus_header_box h5,
body.ehs-shell-reports .groups_plus_title h5 {
  color: var(--ehs-primary-hex, #1b365d);
  font-weight: 800;
  font-size: 1.35rem;
  margin: 0 0 0.35rem;
}

body.ehs-shell-reports .groups_plus_admin_header {
  background: var(--ehs-surface, #fff);
  border: 1px solid var(--ehs-border, #e2e8f0);
  border-radius: 0.75rem;
  padding: 0.85rem 1rem !important;
  margin-bottom: 1rem;
}

body.ehs-shell-reports .groups_plus_admin_header label.title {
  color: var(--ehs-text-muted, #64748b);
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  font-size: 0.72rem;
}

body.ehs-shell-reports .groups_plus_admin_header select {
  border: 1px solid var(--ehs-border-strong, #cbd5e1) !important;
  border-radius: var(--ehs-radius-sm, 6px) !important;
  min-height: 2.4rem;
  padding: 0.35rem 0.75rem !important;
  font-weight: 600;
  color: var(--ehs-text-hex, #1e293b);
  background: #fff;
}

body.ehs-shell-reports .groups_plus_licenses,
body.ehs-shell-reports .groups_plus_remaining_licenses {
  color: var(--ehs-text-hex, #1e293b);
  font-weight: 700;
}

body.ehs-shell-reports .learndash-groups-plus-user-licenses:before,
body.ehs-shell-reports .learndash-groups-plus-user-licenses-remaining:before {
  color: var(--ehs-primary-hex, #1b365d) !important;
}

/* Primary CTAs — brand navy (override plugin blue + Kadence green vars) */
body.ehs-shell-reports .btn_groups_plus,
body.ehs-shell-reports a.btn_groups_plus,
body.ehs-shell-reports button.btn_groups_plus,
body.ehs-shell-reports .entry-content .button,
body.ehs-shell-reports .entry-content button[type="submit"],
body.ehs-shell-reports .entry-content a.button,
body.ehs-shell-reports .groups_plus_header .button,
body.ehs-shell-reports [class*="groups_plus"] .button,
body.ehs-shell-reports [class*="groups-plus"] .button {
  background: var(--ehs-primary-hex, #1b365d) !important;
  background-color: var(--ehs-primary-hex, #1b365d) !important;
  border: 1px solid var(--ehs-primary-hex, #1b365d) !important;
  border-radius: var(--ehs-radius-sm, 6px) !important;
  color: #fff !important;
  font-weight: 800 !important;
  box-shadow: var(--ehs-shadow-sm);
  text-decoration: none !important;
  transition: background-color 0.15s ease, border-color 0.15s ease, box-shadow 0.15s ease;
  padding: 0.45em 1em !important;
  line-height: 1.4;
}

body.ehs-shell-reports .btn_groups_plus:hover,
body.ehs-shell-reports a.btn_groups_plus:hover,
body.ehs-shell-reports button.btn_groups_plus:hover,
body.ehs-shell-reports .btn_groups_plus:focus,
body.ehs-shell-reports a.btn_groups_plus:focus {
  background: #152a4a !important;
  background-color: #152a4a !important;
  border-color: #152a4a !important;
  color: #fff !important;
  opacity: 1 !important;
  box-shadow: var(--ehs-shadow-md);
}

/* Secondary / black variant buttons */
body.ehs-shell-reports .btn_groups_plus_black,
body.ehs-shell-reports a.btn_groups_plus_black {
  background: #fff !important;
  color: var(--ehs-primary-hex, #1b365d) !important;
  border: 1px solid var(--ehs-border-strong, #cbd5e1) !important;
}

body.ehs-shell-reports .btn_groups_plus_black:hover,
body.ehs-shell-reports a.btn_groups_plus_black:hover {
  background: var(--ehs-primary-soft, #eef2f7) !important;
  color: var(--ehs-primary-hex, #1b365d) !important;
  border-color: var(--ehs-primary-hex, #1b365d) !important;
}

/* Tables */
body.ehs-shell-reports .groups_user_table,
body.ehs-shell-reports .groups_plus_table,
body.ehs-shell-reports .entry-content table {
  border-collapse: separate;
  border-spacing: 0;
  width: 100%;
  border: 1px solid var(--ehs-border, #e2e8f0) !important;
  border-radius: 0.75rem;
  overflow: hidden;
  background: #fff;
  box-shadow: var(--ehs-shadow-sm);
}

body.ehs-shell-reports .groups_user_table thead,
body.ehs-shell-reports .groups_plus_table thead,
body.ehs-shell-reports .entry-content table th {
  background: var(--ehs-surface-muted, #f1f5f9) !important;
  color: var(--ehs-primary-hex, #1b365d) !important;
  font-weight: 800 !important;
  font-size: 0.82rem;
  text-transform: uppercase;
  letter-spacing: 0.03em;
}

body.ehs-shell-reports .groups_user_table td,
body.ehs-shell-reports .groups_user_table th,
body.ehs-shell-reports .groups_plus_table td,
body.ehs-shell-reports .groups_plus_table th,
body.ehs-shell-reports .entry-content table td,
body.ehs-shell-reports .entry-content table th {
  border-color: var(--ehs-border, #e2e8f0) !important;
  color: var(--ehs-text-hex, #1e293b);
  padding: 0.75rem 0.9rem !important;
  vertical-align: middle;
}

body.ehs-shell-reports .groups_user_table tbody tr:hover td,
body.ehs-shell-reports .groups_plus_table tbody tr:hover td {
  background: rgba(25, 58, 85, 0.03);
}

body.ehs-shell-reports .groups_user_table tbody tr td:first-child h5 {
  color: var(--ehs-primary-hex, #1b365d);
  font-weight: 800;
  font-size: 1.1rem;
}

/* Nested report rows */
body.ehs-shell-reports .div-table-container .div-table-row,
body.ehs-shell-reports .div-table-container .div-table-row-header {
  border-color: var(--ehs-border, #e2e8f0) !important;
  border-radius: 0.55rem !important;
  background: #fff;
}

body.ehs-shell-reports .div-table-container .div-table-row-header.div-table-row-team-name-header {
  background: var(--ehs-surface-muted, #f8fafc) !important;
}

body.ehs-shell-reports .groups_plus_report_list h3 {
  color: var(--ehs-primary-hex, #1b365d);
  font-weight: 800;
}

/* Modals */
body.ehs-shell-reports .groups-plus-modal,
.groups-plus-modal {
  background-color: rgba(15, 23, 42, 0.45) !important;
}

body.ehs-shell-reports .groups-plus-modal-content,
.groups-plus-modal .groups-plus-modal-content {
  border-radius: 0.85rem;
  box-shadow: var(--ehs-shadow-lg, 0 12px 32px rgba(20, 30, 50, 0.18));
  border: 1px solid var(--ehs-border, #e2e8f0);
  overflow: hidden;
  max-width: min(920px, 92vw);
  height: auto;
  max-height: min(88vh, 820px);
  top: 6vh !important;
}

body.ehs-shell-reports .groups-plus-modal-header,
.groups-plus-modal .groups-plus-modal-header {
  background: var(--ehs-primary-hex, #1b365d) !important;
  color: #fff !important;
  font-weight: 800;
  letter-spacing: 0.04em;
  padding: 0.85rem 1.1rem !important;
}

body.ehs-shell-reports .groups-plus-modal-content .groups-plus-modal-nav,
.groups-plus-modal .groups-plus-modal-nav {
  background: var(--ehs-surface-muted, #eef2f7) !important;
  border-bottom: 1px solid var(--ehs-border, #e2e8f0);
}

body.ehs-shell-reports .groups-plus-modal-content ul.tabs li,
.groups-plus-modal ul.tabs li {
  font-weight: 800;
  font-size: 0.78rem;
  letter-spacing: 0.04em;
  color: var(--ehs-text-muted, #64748b);
  border-radius: 0.45rem 0.45rem 0 0;
}

body.ehs-shell-reports .groups-plus-modal-content ul.tabs li.current,
.groups-plus-modal ul.tabs li.current {
  background: #fff !important;
  color: var(--ehs-primary-hex, #1b365d) !important;
  box-shadow: inset 0 -2px 0 var(--ehs-accent, #f5a623);
}

body.ehs-shell-reports .groups-plus-modal-content .groups-plus-close,
.groups-plus-modal .groups-plus-close {
  background: var(--ehs-primary-hex, #1b365d) !important;
  border-radius: 0 0.85rem 0 0.55rem;
  font-size: 1.25rem !important;
  padding: 0.55rem 0.85rem !important;
  position: absolute !important;
  right: 0 !important;
  top: 0 !important;
}

/* Forms inside modal */
body.ehs-shell-reports .groups-plus-modal-container input[type="email"],
body.ehs-shell-reports .groups-plus-modal-container input[type="password"],
body.ehs-shell-reports .groups-plus-modal-container input[type="text"],
body.ehs-shell-reports .groups-plus-modal-container select,
body.ehs-shell-reports .groups-plus-modal-container textarea,
.groups-plus-modal input[type="email"],
.groups-plus-modal input[type="password"],
.groups-plus-modal input[type="text"],
.groups-plus-modal select,
.groups-plus-modal textarea {
  border: 1px solid var(--ehs-border-strong, #cbd5e1) !important;
  border-radius: var(--ehs-radius-sm, 6px) !important;
  background: #fff !important;
  box-shadow: none !important;
  min-height: 2.5rem;
  padding: 0.5rem 0.75rem !important;
  color: var(--ehs-text-hex, #1e293b);
}

body.ehs-shell-reports .groups-plus-modal-container input:focus,
body.ehs-shell-reports .groups-plus-modal-container select:focus,
body.ehs-shell-reports .groups-plus-modal-container textarea:focus,
.groups-plus-modal input:focus,
.groups-plus-modal select:focus,
.groups-plus-modal textarea:focus {
  border-color: var(--ehs-primary-hex, #1b365d) !important;
  outline: 3px solid rgba(27, 54, 93, 0.2);
  outline-offset: 1px;
}

body.ehs-shell-reports .groups-plus-form-label,
body.ehs-shell-reports .groups-plus-modal-container label,
.groups-plus-modal label {
  font-weight: 700;
  color: var(--ehs-text-hex, #1e293b);
  font-size: 0.88rem;
}

body.ehs-shell-reports label.error,
.groups-plus-modal label.error {
  color: var(--ehs-error, #b91c1c) !important;
  font-weight: 700;
}

/* Select2 */
body.ehs-shell-reports .select2-container--default .select2-selection--single,
body.ehs-shell-reports .entry-content .select2-container--default .select2-selection--single {
  border-color: var(--ehs-border-strong, #cbd5e1) !important;
  border-radius: var(--ehs-radius-sm, 6px) !important;
  min-height: 38px;
}

body.ehs-shell-reports .select2-container--default .select2-results__option--highlighted[aria-selected],
.select2-container--default .select2-results__option--highlighted[aria-selected] {
  background: var(--ehs-primary-hex, #1b365d) !important;
}

/* SweetAlert (plugin confirm dialogs) */
.swal-modal {
  border-radius: 0.75rem !important;
  font-family: var(--ehs-font, Lato, system-ui, sans-serif) !important;
}
.swal-button--confirm {
  background: var(--ehs-primary-hex, #1b365d) !important;
}
.swal-button--cancel {
  background: var(--ehs-surface-muted, #e2e8f0) !important;
  color: var(--ehs-text-hex, #1e293b) !important;
}

/* Empty states */
body.ehs-shell-reports .groups_plus_table td,
body.ehs-shell-reports .groups_user_table td {
  font-size: 0.95rem;
}

/* Container spacing under site nav */
body.ehs-shell-reports .groups_plus_container {
  margin-top: 0.5rem !important;
  margin-bottom: 2.5rem !important;
  padding: 0 0.25rem;
}

/* Progress / status chips in nested reports */
body.ehs-shell-reports .ld-status-complete,
body.ehs-shell-reports a.btn-learndash-groups-plus-assignment-approved {
  background: var(--ehs-success-hex, #2e7d32) !important;
  border-radius: 999px !important;
}
body.ehs-shell-reports .ld-status-progress {
  background: #d97706 !important;
  border-radius: 999px !important;
}

/* Focus visibility */
body.ehs-shell-reports a:focus-visible,
body.ehs-shell-reports button:focus-visible,
body.ehs-shell-reports .btn_groups_plus:focus-visible {
  outline: 2px solid var(--ehs-primary-hex, #1b365d);
  outline-offset: 2px;
}

/* -------------------------------------------------------------------------
   First-party shortcode boxes (parent_group_* / NDS)
   ------------------------------------------------------------------------- */
.nds-info-box {
  background: var(--ehs-primary-soft);
  padding: 15px;
  border-left: 5px solid var(--ehs-primary);
  border-radius: var(--ehs-radius-sm);
  margin-bottom: 15px;
  box-shadow: var(--ehs-shadow-sm);
}

.nds-info-box h4 {
  margin: 0 0 5px 0;
  font-size: 16px;
  color: var(--ehs-primary);
  font-weight: 800;
}

.nds-info-box p {
  margin: 0;
  font-size: 14px;
  color: var(--ehs-text);
}

.nds-error-message {
  background: var(--ehs-warning-soft);
  color: var(--ehs-text);
  padding: 10px 12px;
  border-left: 5px solid var(--ehs-warning);
  border-radius: var(--ehs-radius-sm);
  font-weight: 700;
  margin-bottom: 15px;
}

.nds-warning-message {
  background: var(--ehs-warning-soft);
  color: var(--ehs-text);
  padding: 10px 12px;
  border-left: 5px solid var(--ehs-warning);
  border-radius: var(--ehs-radius-sm);
  margin-bottom: 15px;
}

.nds-group-thumbnail {
  max-width: 280px;
  height: auto;
  border-radius: var(--ehs-radius);
  box-shadow: var(--ehs-shadow-md);
}

/* -------------------------------------------------------------------------
   Focus visibility (a11y)
   ------------------------------------------------------------------------- */
.learndash-wrapper a:focus-visible,
.learndash-wrapper button:focus-visible,
.learndash-wrapper .ld-button:focus-visible,
.custom-reports-button:focus-visible {
  outline: 2px solid var(--ehs-primary);
  outline-offset: 2px;
}