/*--------------------------------------------------------------
This is your custom stylesheet.

Add your own styles here to make theme updates easier.
To override any styles from other stylesheets, simply copy them into here and edit away.

Make sure to respect the media queries! Otherwise you may
accidentally add desktop styles to the mobile layout.
https://www.w3schools.com/css/css_rwd_mediaqueries.asp
--------------------------------------------------------------*/

.buddypanel .side-panel-menu a:hover img {
  -webkit-filter: invert(1);
  filter: invert(1);
}

.bb-mobile-panel-inner .side-panel-menu a img {
  -webkit-filter: invert(1);
  filter: invert(1);
}

.gform_wrapper .gform_validation_errors a {
  text-decoration: none !important;
}

.gform_wrapper .gform_validation_errors a.redirect-link,
.login #login_error a.redirect-link,
.login .message a.redirect-link {
  text-decoration: underline !important;
}

.gform_wrapper .gform_validation_errors a.redirect-link:hover,
.login #login_error a.redirect-link:hover,
.login .message a.redirect-link:hover {
  opacity: 0.8 !important;
}

.gadoe-reg-form .gfield_validation_message,
.gadoe-reg-form .validation_message {
  padding: 12.992px 24px !important;
}

.gform_wrapper.gadoe-reg-form_wrapper.gravity-theme
  .gform_validation_errors
  > ol {
  padding-left: 0;
}

body.buddypress.register
  #buddypress
  .gform_wrapper.gadoe-reg-form_wrapper
  input[type='submit'],
body.buddypress.activation
  #buddypress
  .gform_wrapper.gadoe-reg-form_wrapper
  input[type='submit'] {
  color: #fff;
  border-radius: 20px;
  transition: all 0.25s;
  background-color: #005b63 !important;
  border: 1px solid rgba(0, 0, 0, 0.1) !important;
}

body.buddypress.register
  #buddypress
  .gform_wrapper.gadoe-reg-form_wrapper
  input[type='submit']:hover,
body.buddypress.activation
  #buddypress
  .gform_wrapper.gadoe-reg-form_wrapper
  input[type='submit']:hover {
  background-color: #008a96 !important;
  border: 1px solid rgba(0, 0, 0, 0.1) !important;
}

.gform_required_legend {
  display: none;
}

.gadoe-reg-form .top_label .gfield_label {
  color: #122b46;
}

.gadoe-reg-form input[type='color'],
.gadoe-reg-form input[type='date'],
.gadoe-reg-form input[type='datetime-local'],
.gadoe-reg-form input[type='datetime'],
.gadoe-reg-form input[type='email'],
.gadoe-reg-form input[type='month'],
.gadoe-reg-form input[type='number'],
.gadoe-reg-form input[type='password'],
.gadoe-reg-form input[type='search'],
.gadoe-reg-form input[type='tel'],
.gadoe-reg-form input[type='text'],
.gadoe-reg-form input[type='time'],
.gadoe-reg-form input[type='url'],
.gadoe-reg-form input[type='week'],
.gadoe-reg-form select,
.gadoe-reg-form textarea {
  background-color: #fff;
  box-sizing: border-box;
  border-radius: 2px;
  color: #333;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  display: block;
  float: none;
  font-size: 16px;
  font-family: inherit;
  border: 1px solid #ccc;
  padding: 6px 10px;
  height: 38px;
  width: 100%;
  line-height: 1.3;
}

.gadoe-reg-form legend,
.gadoe-reg-form .gfield > .gform-field-label {
  font-weight: 700 !important;
}

#recently-active-groups {
  visibility: hidden;
  position: relative;
  width: 4.5rem;
}

#recently-active-groups:after {
  visibility: visible;
  position: absolute;
  top: 0;
  left: 0;
  content: 'My Groups';
}

body.registration .gform_wrapper.gf_browser_chrome form select {
  padding: 0 12px;
}

body.login #loginform h4 {
  margin-top: 30px;
}

/* ============================================================
   REGISTRATION PAGE ONLY — scoped to body.register
   Single, final definition for every accordion/form style tweak.
   Verify 183 is this page's ID on production before using.
   ============================================================ */

:root {
  --gadoe-navy: #122b46;
  --gadoe-teal: #005b63;
  --gadoe-teal-light: #40b0bc;
  --gadoe-border: #d5d8dc;
}

/* ---- Accordion cards ---- */
body.register .e-n-accordion-item {
  border: 1px solid var(--gadoe-border) !important;
  border-radius: 12px !important;
  overflow: hidden;
  margin-bottom: 12px !important;
  box-shadow: 0 4px 16px rgba(18, 25, 97, 0.08);
  transition:
    box-shadow 0.2s ease,
    border-color 0.2s ease;
}
body.register .e-n-accordion-item[open] {
  border-color: var(--gadoe-teal-light) !important;
  box-shadow: 0 6px 20px rgba(0, 91, 99, 0.12);
}
body.register .e-n-accordion-item-title {
  padding: 16px 18px !important;
  font-weight: 600 !important;
  color: var(--gadoe-navy) !important;
  cursor: pointer;
  transition: background-color 0.2s ease;
}
body.register .e-n-accordion-item-title:hover {
  background-color: rgba(64, 176, 188, 0.08);
}
body.register .e-n-accordion-item[open] > .e-n-accordion-item-title {
  background-color: rgba(64, 176, 188, 0.1);
}
body.register .e-n-accordion-item-title-icon svg {
  color: var(--gadoe-teal) !important;
  fill: var(--gadoe-teal) !important;
  transition: transform 0.2s ease;
}
body.register .e-n-accordion-item[open] .e-n-accordion-item-title-icon {
  transform: rotate(180deg);
}
body.register .e-n-accordion-item > .e-con {
  padding: 20px 22px 24px !important;
}
body.register .e-n-accordion-item h3 {
  color: var(--gadoe-navy);
  margin-bottom: 12px;
}
body.register .e-n-accordion-item img {
  max-width: 100%;
  height: auto;
  border-radius: 8px;
  border: 1px solid var(--gadoe-border);
  box-shadow: 0 4px 16px rgba(18, 25, 97, 0.08);
}
body.register .e-n-accordion-item ol li {
  margin-bottom: 10px;
  line-height: 1.6;
}

/* ---- Checkbox / radio (single technique — no negative margins) ---- */
body.register .gadoe-reg-form .gfield_checkbox input[type='checkbox'],
body.register .gadoe-reg-form .gfield_radio input[type='radio'] {
  position: absolute !important;
  opacity: 0 !important;
  width: 20px !important;
  height: 20px !important;
  margin: 0 !important;
  cursor: pointer;
}
body.register .gadoe-reg-form .gfield_checkbox .gchoice,
body.register .gadoe-reg-form .gfield_radio .gchoice {
  position: relative;
  padding-left: 0;
  margin-bottom: 10px !important;
}
body.register .gadoe-reg-form .gfield_checkbox label,
body.register .gadoe-reg-form .gfield_radio label {
  margin-left: 0 !important;
  display: inline-block;
  padding-left: 28px;
}
body.register .gform-theme--foundation .gform_fields {
  row-gap: 0;
}
body.register
  .gform_wrapper
  .ginput_container_radio
  .gfield_radio
  .gchoice
  input[type='radio']:checked
  + label::after {
  background-color: white;
  width: 12px;
  height: 12px;
}
body.register #buddypress * a {
  color: var(--bb-primary-color);
}
body.register #buddypress * a:hover {
  color: var(--bb-login-register-link-color-hover);
}
body.register #buddypress .elementor-section > .elementor-container {
  padding-left: 0;
  padding-right: 0;
}
body.buddypress.register article.bp_register,
body.register #page #primary .bp_register .entry-header,
body.register .bp_register .buddypress-wrap {
  max-width: 760px;
}
body.buddypress.register article.bp_register .entry-header span {
  display: none!important;
}
body.register .gadoe-reg-form .gfield_checkbox label:before,
body.register .gadoe-reg-form .gfield_radio label:before {
  content: '';
  position: absolute;
  left: 0;
  top: 1px;
  width: 20px;
  height: 20px;
  background: #fff;
  border: 1px solid var(--gadoe-border);
  border-radius: 4px;
  transition:
    background-color 0.15s ease,
    border-color 0.15s ease;
}
body.register .gadoe-reg-form .gfield_radio label:before {
  border-radius: 50%;
}
body.register .gadoe-reg-form input[type='checkbox']:checked + label:before,
body.register .gadoe-reg-form input[type='radio']:checked + label:before {
  background-color: var(--gadoe-teal) !important;
  border-color: var(--gadoe-teal) !important;
}
body.register .gadoe-reg-form input:focus-visible + label:before {
  outline: 2px solid var(--gadoe-teal-light);
  outline-offset: 2px;
}

/* ---- Terms of Service / Privacy Policy box ---- */
body.register .gadoe-reg-form .gadoe-reg-disclaimer .gfield_description {
  background-color: #f7f9fa !important;
  border: 1px solid var(--gadoe-border);
  border-radius: 10px;
  padding: 16px 18px !important;
  margin: 12px 0 16px !important;
  height: 320px !important;
  max-height: none !important;
  overflow-y: scroll;
  overflow-x: hidden;
  font-size: 13px;
  line-height: 1.65;
}
body.register
  .gadoe-reg-form
  .gadoe-reg-disclaimer
  .gfield_description.validation_message {
  height: auto !important;
  overflow-y: hidden;
}
body.register
  .gadoe-reg-form
  .gadoe-reg-disclaimer
  .gfield_description::-webkit-scrollbar {
  width: 8px;
}
body.register
  .gadoe-reg-form
  .gadoe-reg-disclaimer
  .gfield_description::-webkit-scrollbar-thumb {
  background: var(--gadoe-teal-light);
  border-radius: 8px;
}

/* ---- Field spacing & inputs ---- */
body.register .gadoe-reg-form .gfield {
  margin-bottom: 20px !important;
}
body.register .gadoe-reg-form input[type='text'],
body.register .gadoe-reg-form input[type='email'],
body.register .gadoe-reg-form input[type='password'] {
  border-radius: 8px !important;
  transition:
    border-color 0.15s ease,
    box-shadow 0.15s ease;
}
body.register .gadoe-reg-form input:focus {
  border-color: var(--gadoe-teal-light) !important;
  box-shadow: 0 0 0 3px rgba(64, 176, 188, 0.2) !important;
  outline: none;
}

/* ---- Submit button (scoped to this form only) ---- */
body.register #gform_5 input.gform_button {
  padding: 12px 28px !important;
  font-weight: 600 !important;
  transition:
    background-color 0.15s ease,
    transform 0.1s ease;
}
body.register #gform_5 input.gform_button:hover {
  transform: translateY(-1px);
}

/* ===== Contact/FAQ page styling to match registration page ===== */
/* Scoped to the Contact page only (page-id-82) */

/* Narrow, centered content column like the registration page */
body.page-id-82 .elementor-element-c616f5b > .elementor-container,
body.page-id-82 h1.entry-title {
  max-width: 760px;
  margin: 0 auto;
}

/* Page title */
body.page-id-82 h1.entry-title {
  color: #122B46;
}

/* Section headings (GaDOE Community / Professional Learning) */
body.page-id-82 h2.elementor-heading-title {
  color: #122B46;
  font-weight: 600;
}

/* Body copy inside accordion panels and intro text */
body.page-id-82 article {
  color: #4D5C6D;
}

/* Links */
body.page-id-82 article a {
  color: #40B0BC;
  text-decoration: none;
}
body.page-id-82 article a:hover {
  text-decoration: underline;
}

/* ===== Accordion styling to match registration page (contact page only) ===== */

body.page-id-82 .e-n-accordion-item {
  overflow: hidden;
  box-shadow: rgba(18, 25, 97, 0.08) 0px 4px 16px;
  transition: box-shadow 0.2s, border-color 0.2s;
  border: 1px solid #D5D8DC !important;
  border-radius: 12px !important;
  margin-bottom: 12px !important;
}

body.page-id-82 .e-n-accordion-item[open] {
  box-shadow: rgba(0, 91, 99, 0.12) 0px 6px 20px;
  border-color: #40B0BC !important;
}

/* Note: no background-color/color forced here so widget-specific accent styling
   (like the "Still need support" header) can still show through */
body.page-id-82 .e-n-accordion-item-title {
  cursor: pointer;
  transition: background-color 0.2s;
  padding: 16px 18px !important;
  font-weight: 600 !important;
}

body.page-id-82 .e-n-accordion-item-title:hover {
  background-color: rgba(64, 176, 188, 0.08);
}

body.page-id-82 .e-n-accordion-item[open] > .e-n-accordion-item-title {
  background-color: rgba(64, 176, 188, 0.1);
}

body.page-id-82 .e-n-accordion-item > .e-con {
  padding: 20px 22px 24px !important;
}

body.page-id-82 .e-n-accordion-item h3 {
  color: #122B46;
  margin-bottom: 12px;
}

body.page-id-82 .e-n-accordion-item img {
  max-width: 100%;
  height: auto;
  border-radius: 8px;
  border: 1px solid #D5D8DC;
  box-shadow: rgba(18, 25, 97, 0.08) 0px 4px 16px;
}