/*
 * Together-suite styles for happynectar.
 *
 * Extracted from the legacy withministries2023 theme.css. Covers:
 *   - single content view (single-content.php)
 *   - track chooser (template-parts/track-chooser.php)
 *   - delegation UI (inc/together/delegate_dashboard.php)
 *   - accept-access form (rendered by [accept_access_form] shortcode)
 *   - in-page access-result modal
 *
 * Long-term plan: tune via NectarBlocks Code Options → Custom CSS, or
 * promote each chunk to a NectarBlocks-native pattern.
 */

.results_wrapper article .eyebrow {
  margin: 24px 0 8px;
  font-weight: 300;
}

#page-content.single_post_content picture img {
  max-width: 100%;
  border-radius: 20px;
}

#page-content.single_post_content .container {
  max-width: 1200px;
  width: 90%;
  display: flex;
  gap: 2em;
  align-items: flex-start;
}

@media screen and (max-width: 767px) {
  #page-content.single_post_content .container {
    flex-direction: column;
  }
}

#page-content.single_post_content .primary {
  flex: 2;
}

#page-content.single_post_content .update_sidebar {
  width: 100%;
  flex: 1;
  border-radius: 20px;
  padding: 30px;
  border: 0.75px solid #232A3C;
  background: #ffffff;
  box-shadow: -10px 10px 0 #232A3C;
}

#page-content.single_post_content .update_sidebar h2:first-of-type {
  margin-top: 0;
}

#page-content.single_post_content .color_cards {
  width: 100%;
  margin-left: 0;
}

#page-content.single_post_content .color_cards .container {
  margin: 0;
  gap: 0;
  max-width: unset;
  width: 100%;
}

@media screen and (min-width: 768px) {
  #page-content.single_post_content .color_cards .container .card {
    width: 50%;
  }
}

.eyebrow {
  font-weight: 300;
  margin-bottom: 0;
  opacity: 0.8;
}

.back_to_blog {
  margin: 5vh auto 5vh;
  display: flex;
  gap: 0.5em;
}

.back_to_blog a {
  text-decoration: none !important;
}

.back_to_blog a:hover {
  text-decoration: underline !important;
}

.results_wrapper article a .eyebrow, .results_wrapper article a .blog_title, .results_wrapper article a .date {
  padding: 0 20px;
}

#track_chooser {
  display: flex;
  gap: 0.5em;
  align-items: center;
  padding: 0.5em;
  border: 2px solid #232A3C;
  justify-content: space-between;
  max-width: 18em;
}

#track_chooser .label {
  text-transform: uppercase;
  font-size: 0.8em;
  font-weight: bold;
}

#page-content.single_content {
  padding-bottom: 2em;
}

.single_content h2 {
  margin-top:1em;
}

#page-content.single_content #blog_header h1 {
  font-size: 28px;
}

@media only screen and (min-width: 390px) {
  #page-content.single_content #blog_header h1 {
    font-size: calc(28px + 8 * (100vw - 390px) / (1280 - 390));
  }
}

@media only screen and (min-width: 1280px) {
  #page-content.single_content #blog_header h1 {
    font-size: 36px;
  }
}

#page-content.single_content picture img {
  max-width: 100%;
  border-radius: 20px;
}

#page-content.single_content .container {
  max-width: 1200px;
  width: 90%;
  display: flex;
  gap: 2em;
  align-items: flex-start;
}

@media screen and (max-width: 767px) {
  #page-content.single_content .container {
    flex-direction: column;
  }
}

#page-content.single_content .primary {
  flex: 2;
}

#page-content.single_content a:not(.button):not(.wp-element-button) {
  text-decoration-color: orange;
  text-decoration-thickness: 2px;
}

#page-content.single_content .update_sidebar {
  width: 100%;
  flex: 1;
  border-radius: 20px;
  padding: 30px;
  border: 0.75px solid #232A3C;
  background: #ffffff;
  box-shadow: -10px 10px 0 #232A3C;
}

#page-content.single_content .update_sidebar h2:first-of-type {
  margin-top: 0;
}

.show_on_print {
  display: none;
}

.track_flex {
  display: flex;
  gap: 1em;
  justify-content: space-between;
  align-items: center;
  flex-wrap: wrap;
  margin:1em 0;
}

@media print {
  body.single-content #site-header, body.single-content #mobile_menu, body.single-content #site-footer, body.single-content .happy_modal, body.single-content .back_to_blog, body.single-content #sidebar, body.single-content #printButton, body.single-content #track_chooser, body.single-content #featured_image, body.single-content .wp-block-embed.is-type-video {
    display: none !important;
  }
  body.single-content .show_on_print {
    display: block;
  }
  body.single-content .show_on_print.track_heading {
    display: flex;
  }
  body.single-content .track_flex {
    display: block;
  }
}

@media screen {
  .print-only {
    display: none;
  }
}

table#delegated_users {
  border-collapse: collapse;
}

table#delegated_users tbody {
  background: #ffffff;
}

table#delegated_users td, table#delegated_users th {
  border: 1px solid #000000;
  padding: 5px 5px;
}

table#delegated_users td tr:nth-child(even), table#delegated_users th tr:nth-child(even) {
  background: #FAF5F2;
}

@media screen and (max-width: 767px) {
  table#delegated_users {
    display: block;
    max-width: 100%;
    font-size: 12px;
    overflow: scroll;
  }
}

#invite_new_delegate {
  display: flex;
  flex-wrap: wrap;
  gap: 1em;
}

#invite_new_delegate input[type=email] {
  flex: 1;
  padding: 0.5em;
  border: 1px solid black;
  border-radius: 8px;
}

.content_table div {
  display: flex;
  gap: 0.5em;
  margin-bottom: 0.5em;
  align-items: center;
}

.content_table span {
  width: 1em;
  height: 1em;
  background-image: url('data:image/svg+xml,<%3Fxml version="1.0" encoding="UTF-8"%3F><svg id="Layer_2" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 90 90"><defs><style>.cls-1{fill:none;}.cls-2{clip-path:url(%23clippath);}.cls-3{fill:%23ff9433;}</style><clipPath id="clippath"><rect class="cls-1" width="90" height="90"/></clipPath></defs><g id="Layer_1-2"><g class="cls-2"><g id="Group_3"><path id="Path_6" class="cls-3" d="m65.52,56.32c6.06.78,13.45,3.53,21.68,8.1,1.17-2.52,2.1-5.15,2.8-7.84-13.82-7.46-25.67-10.21-34.47-7.95-3.14.81-5.59,3.26-6.4,6.4-2.28,8.87.53,20.83,8.11,34.78,2.68-.73,5.29-1.7,7.79-2.89-4.64-8.32-7.43-15.79-8.22-21.9-.07-.63.38-1.19,1-1.26.35-.04.69.08.94.33l16.31,16.31c2.1-1.78,4.03-3.74,5.79-5.86l-16.28-16.28c-.44-.45-.44-1.17,0-1.61.25-.25.59-.37.94-.33"/><path id="Path_7" class="cls-3" d="m48.63,34.47c.81,3.14,3.26,5.58,6.4,6.39,8.87,2.28,20.83-.53,34.78-8.11-.73-2.68-1.7-5.29-2.89-7.79-8.32,4.64-15.79,7.43-21.9,8.22-.63.07-1.19-.38-1.26-1-.04-.35.08-.69.33-.94l16.31-16.31c-1.78-2.1-3.74-4.03-5.86-5.78l-16.28,16.28c-.45.44-1.17.44-1.61,0-.25-.25-.37-.59-.33-.94.78-6.06,3.53-13.45,8.1-21.68-2.52-1.17-5.15-2.11-7.84-2.8-7.46,13.82-10.21,25.67-7.95,34.47"/><path id="Path_8" class="cls-3" d="m33.18,24.98c.07.63-.38,1.19-1,1.26-.35.04-.69-.08-.94-.33L14.93,9.61c-2.1,1.78-4.03,3.74-5.78,5.86l16.28,16.28c.44.45.44,1.17,0,1.61-.25.25-.59.37-.94.33-6.06-.78-13.45-3.53-21.68-8.1-1.17,2.52-2.11,5.15-2.8,7.84,13.82,7.46,25.67,10.21,34.47,7.95,3.14-.81,5.59-3.26,6.39-6.4,2.28-8.87-.53-20.83-8.11-34.78-2.68.73-5.29,1.7-7.8,2.89,4.64,8.32,7.43,15.79,8.22,21.9"/><path id="Path_9" class="cls-3" d="m41.37,55.53c-.81-3.14-3.26-5.59-6.4-6.4-8.87-2.28-20.83.53-34.78,8.11.73,2.68,1.7,5.29,2.89,7.79,8.32-4.64,15.79-7.43,21.9-8.22.63-.07,1.19.38,1.26,1,.04.35-.08.69-.33.94l-16.31,16.31c1.78,2.1,3.74,4.03,5.86,5.78l16.28-16.28c.45-.44,1.17-.44,1.61,0,.25.25.37.59.33.94-.78,6.06-3.53,13.45-8.1,21.68,2.52,1.17,5.15,2.11,7.84,2.8,7.46-13.82,10.21-25.67,7.95-34.47"/></g></g></g></svg>') !important;
  display: block;
}

h2.delegate_heading {
  display: flex;
  gap: 0.5em;
  align-items: center;
  flex-wrap: wrap;
}

h2.delegate_heading a {
  font-size: 1rem;
}

#quarterly_updates article .eyebrow {
  margin: 24px 0 8px;
  font-weight: 300;
  padding: 0 20px;
}

.access_message {
  display: flex;
  position: fixed;
  top: 0;
  left: 0;
  width: 100vw;
  height: 100vh;
  background: rgba(0, 0, 0, 0.5);
  align-items: center;
  justify-content: center;
  z-index: 10000;
}

.access_message .inner {
  background: #FF9433;
  color: #000000;
  padding: 1em;
  border-radius: 8px;
  text-align: center;
}

.access_message .inner .button {
  background: #ffffff;
  color: #000000;
}

.accept_delegation_form {
  max-width: 300px;
}

.accept_delegation_form .input_row {
  margin-bottom: 0.5em;
}

.accept_delegation_form .input_row label {
  display: block;
  margin-bottom: 0.5em;
}

.accept_delegation_form input[type=email], .accept_delegation_form input[type=password] {
  padding: 0.5em;
  border: 1px solid black;
  border-radius: 8px;
  display: block;
  width: 100%;
}