/* IC action vocabulary. Category artwork, status indicators and destructive actions
   keep their own meaning; only action components and their spacing are shared. */
:root {
  --ic-action-primary: #ff9b36;
  --ic-action-primary-hover: #ffb568;
  --ic-action-ink: #0b2431;
  --ic-action-navy: #153f52;
  --ic-action-navy-hover: #20596d;
  --ic-action-teal: #087f78;
  --ic-action-line: #8baeb5;
  --ic-action-paper: #eef7f6;
  --ic-action-whatsapp: #25d366;
  --ic-action-whatsapp-hover: #52e58b;
  --ic-action-radius: 12px;
  --ic-action-gap: 12px;
}

/* Shared dimensions without increasing the density of table/status controls. */
:is(#ic-home-approved, #ic-events-approved, #ic-event-detail-approved) .button,
body.ic-native-page .button,
html body :is(#ic-about-approved,.ic-information-restored,.ic-public-information) .ic-information-actions > a.ic-information-button,
html body .ic-button,
html body .discovery-button,
.content-card .page-actions > a {
  box-sizing: border-box;
  border-radius: var(--ic-action-radius);
  line-height: 1.4;
  text-align: center;
  text-decoration: none;
  white-space: normal;
  max-width: 100%;
  overflow-wrap: anywhere;
}
:is(#ic-home-approved, #ic-events-approved, #ic-event-detail-approved) .button:not(.button-small):not(.button-status),
body.ic-native-page .button:not(.button-small):not(.button-status),
html body :is(#ic-about-approved,.ic-information-restored,.ic-public-information) .ic-information-actions > a.ic-information-button,
html body .ic-button,
html body .discovery-button,
.content-card .page-actions > a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-height: 48px;
  padding: 12px 20px;
  font-size: 1rem;
  font-weight: 800;
}

/* Primary = logo orange. This also covers the native account/admin family. */
:is(#ic-home-approved, #ic-events-approved, #ic-event-detail-approved) .button.button-primary,
body.ic-native-page .button.button-primary,
#ic-approved-header .ic-approved-button-primary,
#ic-approved-header .ic-approved-button-primary:visited,
html body :is(#ic-about-approved,.ic-information-restored,.ic-public-information) .ic-information-actions > a.ic-information-button,
html body .ic-button:not(.ic-button--outline):not(.ic-button--whatsapp),
html body .discovery-button:not(.discovery-button-secondary) {
  background: var(--ic-action-primary);
  border-color: var(--ic-action-primary);
  color: var(--ic-action-ink);
}
:is(#ic-home-approved, #ic-events-approved, #ic-event-detail-approved) .button.button-primary:hover:not(:disabled):not([aria-disabled="true"]),
body.ic-native-page .button.button-primary:hover:not(:disabled):not([aria-disabled="true"]),
#ic-approved-header .ic-approved-button-primary:hover,
html body :is(#ic-about-approved,.ic-information-restored,.ic-public-information) .ic-information-actions > a.ic-information-button:hover,
html body .ic-button:not(.ic-button--outline):not(.ic-button--whatsapp):hover:not(:disabled),
html body .discovery-button:not(.discovery-button-secondary):hover {
  background: var(--ic-action-primary-hover);
  border-color: var(--ic-action-primary-hover);
  color: var(--ic-action-ink);
}

/* Strong secondary = navy. Quiet secondary = light surface and teal border. */
:is(#ic-home-approved, #ic-events-approved, #ic-event-detail-approved) .button.button-dark,
body.ic-native-page .button.button-dark {
  background: var(--ic-action-navy);
  border-color: var(--ic-action-navy);
  color: #fff;
}
:is(#ic-home-approved, #ic-events-approved, #ic-event-detail-approved) .button.button-dark:hover:not(:disabled),
body.ic-native-page .button.button-dark:hover:not(:disabled) {
  background: var(--ic-action-navy-hover);
  border-color: var(--ic-action-navy-hover);
  color: #fff;
}
:is(#ic-home-approved, #ic-events-approved, #ic-event-detail-approved) .button:is(.button-outline, .button-light),
body.ic-native-page .button:is(.button-outline, .button-light),
html body .discovery-button.discovery-button-secondary,
.content-card .page-actions > a {
  background: #fff;
  border: 1px solid var(--ic-action-line);
  color: var(--ic-action-ink);
}
:is(#ic-home-approved, #ic-events-approved, #ic-event-detail-approved) .button:is(.button-outline, .button-light):hover:not(:disabled),
body.ic-native-page .button:is(.button-outline, .button-light):hover:not(:disabled),
html body .discovery-button.discovery-button-secondary:hover,
.content-card .page-actions > a:hover {
  background: var(--ic-action-paper);
  border-color: var(--ic-action-teal);
  color: var(--ic-action-ink);
}
/* This legacy legal wrapper otherwise adds its padding outside its width. */
body > .content-card { box-sizing: border-box; max-width: 100%; }
body.ic-native-page :is(.site-header, .feature-panel, .content-cta, .info-card.dark, .section-dark, .ic-section-hero) .button.button-outline,
:is(#ic-home-approved, #ic-events-approved, #ic-event-detail-approved) :is(.feature-panel, .info-card.dark, .section-dark, .ic-section-hero) .button.button-outline,
#ic-approved-header .ic-approved-button-outline,
#ic-approved-header .ic-approved-button-outline:visited,
html body .ic-button.ic-button--outline {
  border: 1px solid #91d2cd;
  background: var(--ic-action-teal);
  color: #fff;
}
body.ic-native-page :is(.site-header, .feature-panel, .content-cta, .info-card.dark, .section-dark, .ic-section-hero) .button.button-outline:hover,
:is(#ic-home-approved, #ic-events-approved, #ic-event-detail-approved) :is(.feature-panel, .info-card.dark, .section-dark, .ic-section-hero) .button.button-outline:hover,
#ic-approved-header .ic-approved-button-outline:hover,
html body .ic-button.ic-button--outline:hover {
  background: #096d68;
  color: #fff;
}

/* WhatsApp always stays a full, recognisable green, for both group and contact. */
:is(#ic-home-approved, #ic-events-approved, #ic-event-detail-approved) .button.button-whatsapp,
body.ic-native-page .button.button-whatsapp,
html body .ic-button.ic-button--whatsapp,
html body :is(#ic-about-approved,.ic-information-restored,.ic-public-information) .ic-information-actions > a.ic-information-button[href^="https://wa.me/"],
html body :is(#ic-about-approved,.ic-information-restored,.ic-public-information) .ic-information-actions > a.ic-information-button[href^="https://chat.whatsapp.com/"] {
  border: 1px solid var(--ic-action-whatsapp);
  background: var(--ic-action-whatsapp);
  color: var(--ic-action-ink);
}
:is(#ic-home-approved, #ic-events-approved, #ic-event-detail-approved) .button.button-whatsapp:hover,
body.ic-native-page .button.button-whatsapp:hover,
html body .ic-button.ic-button--whatsapp:hover,
html body :is(#ic-about-approved,.ic-information-restored,.ic-public-information) .ic-information-actions > a.ic-information-button[href^="https://wa.me/"]:hover,
html body :is(#ic-about-approved,.ic-information-restored,.ic-public-information) .ic-information-actions > a.ic-information-button[href^="https://chat.whatsapp.com/"]:hover {
  border-color: var(--ic-action-whatsapp-hover);
  background: var(--ic-action-whatsapp-hover);
  color: var(--ic-action-ink);
}

/* Bootstrap editorial actions use an older !important palette. Match that scope
   explicitly; FAQ toggles and image controls are not navigation/submit buttons. */
html body .main-wrapper.course-single-left-sidebar:has(> :is(.breadcrumb-bg,.ic-section-hero)) .btn:not(.btn-link):not(.btn-squre):not(.btn-danger):not(.btn-success) {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: var(--ic-action-primary) !important;
  border-color: var(--ic-action-primary) !important;
  color: var(--ic-action-ink) !important;
  border-radius: var(--ic-action-radius);
  min-height: 48px;
  padding: 12px 20px;
  font-weight: 800;
  line-height: 1.4;
  text-transform: none !important;
  white-space: normal;
  overflow-wrap: anywhere;
  gap: 8px;
}
html body .main-wrapper.course-single-left-sidebar:has(> :is(.breadcrumb-bg,.ic-section-hero)) .btn:not(.btn-link):not(.btn-squre):not(.btn-danger):not(.btn-success):hover {
  background: var(--ic-action-primary-hover) !important;
  border-color: var(--ic-action-primary-hover) !important;
  color: var(--ic-action-ink) !important;
}
html body .main-wrapper.course-single-left-sidebar:has(> :is(.breadcrumb-bg,.ic-section-hero)) a.btn:not(.btn-link):not(.btn-squre):not(.btn-danger):not(.btn-success)[href^="https://wa.me/"],
html body .main-wrapper.course-single-left-sidebar:has(> :is(.breadcrumb-bg,.ic-section-hero)) a.btn:not(.btn-link):not(.btn-squre):not(.btn-danger):not(.btn-success)[href^="https://chat.whatsapp.com/"] {
  background: var(--ic-action-whatsapp) !important;
  border-color: var(--ic-action-whatsapp) !important;
  color: var(--ic-action-ink) !important;
}
html body .main-wrapper.course-single-left-sidebar:has(> :is(.breadcrumb-bg,.ic-section-hero)) a.btn:not(.btn-link):not(.btn-squre):not(.btn-danger):not(.btn-success)[href^="https://wa.me/"]:hover,
html body .main-wrapper.course-single-left-sidebar:has(> :is(.breadcrumb-bg,.ic-section-hero)) a.btn:not(.btn-link):not(.btn-squre):not(.btn-danger):not(.btn-success)[href^="https://chat.whatsapp.com/"]:hover {
  background: var(--ic-action-whatsapp-hover) !important;
  border-color: var(--ic-action-whatsapp-hover) !important;
  color: var(--ic-action-ink) !important;
}

/* Identical rhythm for action rows; data tables retain their compact spacing. */
html body .main-wrapper.course-single-left-sidebar:has(> :is(.breadcrumb-bg,.ic-section-hero)) #filters {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-bottom: 24px;
}
html body .main-wrapper.course-single-left-sidebar:has(> :is(.breadcrumb-bg,.ic-section-hero)) #filters .button {
  min-height: 44px;
  margin: 0;
  padding: 10px 16px;
  border: 1px solid var(--ic-action-line);
  border-radius: 999px;
  background: #fff;
  color: var(--ic-action-ink);
  line-height: 1.4;
  white-space: normal;
}
html body .main-wrapper.course-single-left-sidebar:has(> :is(.breadcrumb-bg,.ic-section-hero)) #filters .button:is(.is-checked,:hover) {
  background: var(--ic-action-navy);
  border-color: var(--ic-action-navy);
  color: #fff;
}
html body .main-wrapper.course-single-left-sidebar:has(> :is(.breadcrumb-bg,.ic-section-hero)) :is(.btn,#filters .button):focus-visible {
  outline: 3px solid var(--ic-action-teal);
  outline-offset: 4px;
  box-shadow: 0 0 0 2px #fff;
}
:is(#ic-home-approved, #ic-events-approved, #ic-event-detail-approved) :is(.hero-actions, .form-actions),
body.ic-native-page :is(.hero-actions, .form-actions, .user-activity-actions),
html body :is(.ic-information-actions, .ic-hero-actions, .ic-form-actions),
.content-card .page-actions {
  gap: var(--ic-action-gap);
}
body.ic-native-page .auth-card > .form-grid,
body.ic-native-page .feature-panel > form {
  margin-block-start: 24px;
}
body.ic-native-page .data-table .form-actions { margin-block-start: 0; }
body.ic-native-page .data-table a.button-danger { color: #a21426; }
html body .ic-public-information .ic-information-actions,
html body .ic-information-restored .ic-information-actions,
#ic-about-approved .ic-information-actions { margin-block-start: 24px; }

/* The quick links now follow the hero instead of overlapping its last button. */
#ic-home-approved .hero-actions { width: 100%; align-items: center; }
#ic-home-approved .container.quick-grid { margin-block: 28px 0; }
#ic-home-approved .quick-grid + .section { padding-top: 56px; }
#ic-home-approved .event-actions { gap: 16px; margin-top: 20px; }
#ic-home-approved .hero-actions .button-whatsapp-group {
  justify-content: flex-start;
  gap: 12px;
  max-width: 490px;
  padding: 14px 20px;
  border: 2px solid #aff2c8;
  text-align: left;
}
#ic-home-approved .button-whatsapp-group .whatsapp-icon { flex: 0 0 25px; width: 25px; height: 25px; }
#ic-home-approved .whatsapp-group-copy { display: grid; gap: 4px; min-width: 0; }
#ic-home-approved .whatsapp-group-copy strong { font-size: 1rem; line-height: 1.35; overflow-wrap: anywhere; }
#ic-home-approved .whatsapp-group-copy small { font-size: .8rem; font-weight: 550; line-height: 1.4; }
#ic-home-approved .whatsapp-group-arrow { flex: 0 0 auto; margin-left: auto; font-size: 1.3rem; }

/* Focus is visible without making disabled actions look available. */
:is(#ic-home-approved, #ic-events-approved, #ic-event-detail-approved) .button:focus-visible,
body.ic-native-page .button:focus-visible,
html body :is(.ic-information-button, .ic-button, .discovery-button):focus-visible,
html body :is(#ic-about-approved,.ic-information-restored,.ic-public-information) .ic-information-actions > a.ic-information-button:focus-visible,
#ic-approved-header .ic-approved-button:focus-visible,
.content-card .page-actions > a:focus-visible {
  outline: 3px solid var(--ic-action-teal);
  outline-offset: 4px;
  box-shadow: 0 0 0 2px #fff;
}
html body .ic-section-hero .button:focus-visible,
body.ic-native-page .feature-panel .button:focus-visible { outline-color: #ffcb91; }
body.ic-native-page .button:disabled,
body.ic-native-page .button[aria-disabled="true"] { opacity: .55; cursor: not-allowed; transform: none; }

/* The standalone administrative maintenance view also uses the shared hero. */
body:has(> .ic-section-hero[data-hero-section="account"]) > main :is(button, a.button) {
  box-sizing: border-box;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 48px;
  padding: 12px 20px;
  border: 1px solid var(--ic-action-line);
  border-radius: var(--ic-action-radius);
  background: #fff;
  color: var(--ic-action-ink);
  font-weight: 700;
  text-align: center;
  overflow-wrap: anywhere;
}
body:has(> .ic-section-hero[data-hero-section="account"]) > main button[type="submit"] {
  background: var(--ic-action-primary);
  border-color: var(--ic-action-primary);
}
body:has(> .ic-section-hero[data-hero-section="account"]) > main button[type="submit"]:hover {
  background: var(--ic-action-primary-hover);
  border-color: var(--ic-action-primary-hover);
}
body:has(> .ic-section-hero[data-hero-section="account"]) > main :is(button, a.button):focus-visible {
  outline: 3px solid var(--ic-action-teal);
  outline-offset: 4px;
}

@media (max-width: 767px) {
  #ic-home-approved .ic-section-hero { padding-bottom: 40px; }
  #ic-home-approved .container.quick-grid { margin-top: 24px; }
  #ic-home-approved .quick-grid + .section { padding-top: 40px; }
}
@media (max-width: 640px) {
  #ic-home-approved .hero-actions,
  :is(#ic-home-approved, #ic-events-approved, #ic-event-detail-approved) .form-actions,
  body.ic-native-page :is(.auth-card, .feature-panel, .content-cta, .info-card) .form-actions,
  html body :is(.ic-information-actions, .ic-hero-actions),
  .content-card .page-actions {
    display: flex;
    flex-direction: column;
    align-items: stretch;
    gap: 12px;
  }
  #ic-home-approved .hero-actions > .button,
  :is(#ic-home-approved, #ic-events-approved, #ic-event-detail-approved) .form-actions > .button,
  html body .ic-information-actions > .ic-information-button { width: 100%; }
  #ic-home-approved .hero-actions .button-whatsapp-group { max-width: none; }
  .content-card .page-actions > a { flex: 0 0 auto; width: 100%; }
  #ic-approved-header .ic-approved-button { min-height: 44px; }
}