/*
Theme Name: vBriefings
Version: v01c
Theme URI: https://frostwp.com/
Author: Greg Fuller
Author URI: https://wpengine.com/
Description: The vBriefing Theme is a fork of WP Engine's Frost 1.0.8 Theme. It has been extensively modified to accomodate the vBriefing advocacy platform.
Requires at least: 6.4
Tested up to: 6.4
Requires PHP: 7.0
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: frost
*/

/* Defaults
---------------------------------------- */

*,
*::before,
*::after {
  box-sizing: border-box;
}

html {
  scroll-behavior: smooth;
}

a,
button,
input:focus,
input[type="button"],
input[type="submit"],
textarea:focus,
.wp-element-button {
  transition: all 0.2s ease-in-out;
}

a,
a:focus,
a:hover,
a:not(.wp-element-button) {
  text-decoration-thickness: 1px;
}

b,
strong,
th {
  font-weight: 350;
}

/* -- Forms -- */

input,
select,
textarea {
  background-color: var(--wp--preset--color--base);
  border: 1px solid var(--wp--preset--color--contrast);
  border-radius: 0;
  color: var(--wp--preset--color--contrast);
  font-family: var(--wp--preset--font-family--primary);
  font-size: var(--wp--preset--font-size--medium);
  font-weight: var(--wp--custom--font-weight--light);
  line-height: var(--wp--custom--line-height--body);
  padding: 10px 20px;
  width: 100%;
}

input:focus,
textarea:focus {
  background-color: var(--wp--preset--color--neutral);
  outline: none;
}

input[type="checkbox"],
input[type="image"],
input[type="radio"] {
  width: auto;
}

input[type="button"],
input[type="email"],
input[type="search"],
input[type="submit"],
input[type="text"],
textarea {
  -webkit-appearance: none;
}

::placeholder {
  color: var(--wp--preset--color--contrast);
  font-size: var(--wp--preset--font-size--small);
  opacity: 0.5;
}

/* 
Style the footnote citations.
Also, prevent larger line heights on lines that have footnote citations by decreasing the
font size. It really looks bad when lines with and without citations have difference
spaces between them.
*/
sup {
  vertical-align: top;
  font-size: 0.6em;
  margin-left: 2px;
  margin-right: 2px;
}
sup a {
  border-radius: 5px;
  color: black;
  background: #dedede;
  padding: 1px 4px;
}

/* Blocks
---------------------------------------- */

/* -- Code -- */

*:not(.wp-block-code) > code {
  background-color: var(--wp--preset--color--neutral);
  font-size: var(--wp--preset--font-size--small);
  padding: 5px 8px;
}

/* -- Navigation -- */

.wp-block-navigation__responsive-container.is-menu-open {
  padding: var(--wp--custom--spacing--gap);
}

.wp-block-navigation__responsive-container.is-menu-open
  .wp-block-navigation__responsive-container-content {
  padding-top: var(--wp--custom--spacing--gap);
}

.wp-block-navigation__responsive-container-close,
.wp-block-navigation__responsive-container-open {
  border: 1px solid currentColor;
  padding: 2px;
}

.has-background .wp-block-navigation__responsive-container-open:focus,
.has-background .wp-block-navigation__responsive-container-open:hover {
  color: var(--wp--preset--color--base);
}

/* -- Navigation Submenu -- */

.wp-block-navigation:not(.has-background)
  .wp-block-navigation__submenu-container {
  background-color: var(--wp--preset--color--contrast);
  border: var(--wp--preset--color--contrast);
  color: var(--wp--preset--color--base);
  padding: 10px;
}

.wp-block-navigation :where(.wp-block-navigation__submenu-container) a {
  padding: 2px 10px;
}

/* Media Queries
---------------------------------------- */

@media only screen and (max-width: 600px) {
  /* -- Utility -- */

  .is-style-hidden-mobile {
    display: none !important;
  }
}

@media only screen and (max-width: 782px) {
  /* -- Columns -- */

  .is-style-columns-reverse {
    flex-direction: column-reverse;
  }
}

/*==========================================================================
Global Changes
============================================================================*/

mark {
  color: #000 !important;
  background: var(--wp--preset--color--light-accent) !important;
}

/* kadence block don't recognize appearence (font-weight) */
.kb-button span {
  font-weight: 400 !important;
}

p,
li {
  margin-top: 8px;
  margin-bottom: 8px;
}

.xvbPageSection details p {
  margin-left: 36px !important;
}

.vbBriefingSection details ul {
  margin-top: 0;
}

.vbBriefingSection details li {
  margin-left: 20px;
}

/* nested details */

.vbBriefingSection details details {
  margin-left: 20px;
}

.vbBriefingSection details details p {
  margin-left: 36px !important;
}

details details li {
  margin-left: 40px;
}

/*==========================================================================
UTILITY CLASSES
============================================================================*/
.vbBriefingSection .vbNote,
.vbNote {
  display: block !important;
  font-style: italic;
  padding-left: 10px;
}

.vbHide {
  display: none !important;
}

.vbQuote {
  display: block !important;
  margin-left: 50px;
  font-style: italic;
  border-left: 1px solid rgb(202, 202, 202);
  padding-left: 10px;
}

.vbNoBullet p,
p.vbNoBullet {
  display: block !important;
}
.vbIndent {
  margin-left: 28px !important;
}
.vbOutdent {
  margin-left: -28px !important;
}

.vbBriefingSection p.vbOutdent {
  margin-left: 0px !important;
}

.vbBriefingSection p.vbOutdentSmall {
  margin-left: 16px !important;
}

body
  .is-layout-constrained
  > :where(:not(.alignleft):not(.alignright):not(.alignfull))
  .vbIndent {
  margin-left: 30px !important;
}

.vbRounded {
  border-radius: 8px;
}

@media (max-width: 782px) {
  .vbHideMaxWidth782 {
    display: none !important;
  }
}

/*==========================================================================
SINGLE POST (BRIEFING) CONTENT
For the Content, we leave the block settings alone will editing a briefing.
We do the formatting here based on the classes put in the advance section of
blocks. We do this to make the content edits less susceptible to inadvertant
changes.
============================================================================*/

/* footnotes in admin surrounded by {{{}}} should be marked
as code to make it easier to read the text.
ADMIN CSS IS IN ASE ENHANCEMENTS PLUGIN  */

.vbBriefingTopNote {
  margin-top: -20px !important;
}

.single-post code {
  background-color: transparent !important;
  color: #7c7c7c;
  padding: 8px 0 !important;
}
.single-post code a {
  color: #7c7c7c !important;
}

.vbBriefingMetricsParagraph {
  font-size: 17px;
}

.vbTopDetailsCompanionRelated {
  margin-top: -10px;
}

.vbTopDetailsSummary {
  margin-top: 10px;
}

.xvbTopDetailsSummary p {
  display: list-item;
  margin-left: 34px;
}

.vbCounterclaims h3,
.vbKeySomethings h3 {
  font-size: 22px;
  padding: 10px;
  border: 1px solid black;
  margin-bottom: 20px;
}

.vbCounterclaims h4,
.vbKeySomethings h4,
.vbSupplementary h4 {
  font-size: 19px;
  padding-left: 10px;
  margin-bottom: 10px;
  margin-top: 20px !important;
}

.vbH2Section {
  padding: 0;
  margin: 0;
  border: 1px solid #384173;
  margin-top: 30px !important;
  margin-bottom: 16px !important;
}

.vbH2SectionPreface,
.vbH2SectonFrontMatter {
  margin-top: 0 !important;
}

.vbH2SectionPreface {
  margin-top: 0 !important;
}

.vbH2Section h2 {
  font-size: 30px;
  padding: 10px;
  color: white;
  padding: 3px 10px;
  background-color: var(--wp--preset--color--primary) !important;
}

.vbH2Section p {
  color: black;
  margin-top: 0;
  font-size: 15px;
  background-color: #eee;
  padding: 1px 5px 1px 12px;
  background-color: #fff7e8 !important;
}

.vbBriefingSection p {
  display: list-item;
  margin-left: 28px !important;
}

/* accomodate Kadence advanced table: reset from list-item */
table p {
  display: block;
}

.vbBriefingSection details > p {
  margin-left: 38px !important;
}

.vbBriefingSection h5 {
  margin-left: 28px !important;
}

.vbDetailsTopLevel p {
  margin-left: 0 !important;
}

body.single .vbDetailsLevel0 {
  margin-left: 3px !important;
}

body.single .vbDetailsLevel1 {
  margin-left: 20px !important;
  margin-top: 15px !important;
  margin-bottom: 3px !important;
}

body.single .vbDetailsLevel1 p,
body.single .vbDetailsLevel1 div {
  margin-left: 35px !important;
}

body.single .vbDetailsLevel1CanvaHtml {
  margin-left: 20px !important;
}

body.single .vbDetailsLevel1CanvaHtml > div {
  margin-top: 15px !important;
}

.vbDetailsHowTo {
  clear: both !important; /* for when after gallery */
}

.vbARMemesAndInfographics figcaption {
  display: none !important;
}

.vbDetailsHowTo summary {
  color: red;
  margin-top: 0px !important;
  margin-bottom: 0px !important;
}

.vbAdvocacyResources,
.vbNoBullet {
  margin-left: 0 !important;
}

p.vbAdvocacyResourcesContains {
  margin-left: 0 !important;
  display: block !important;
}

.vbBriefingSection p::marker {
  color: #7c7c7c;
}

.vbBriefingSection li::marker {
  color: #aaa;
}

.vbBriefingSection ul {
  margin-top: 0 !important;
  margin-left: 18px !important;
}

.vbBriefingSection li {
  margin-top: 8px;
  margin-bottom: 8px;
}

/* must come after above */
.vbH2Section p {
  display: block;
  margin-left: 0 !important;
}

/* advocacy resources */
.vbHideAdvocacyResources {
  margin-top: 0 !important;
}

/* gutter image floating right into 36px border */

.vbSingleContent .vbGutterImage {
  float: right !important;
  margin-right: -56px !important;
  margin-left: 2px !important;
  width: 36px !important;
  max-width: 36px !important;
}

.vbSingleContent .vbGutterImage img {
  max-width: 36px !important;
  width: 36px !important;
}

.vbSingleContent .vbGutterImage figcaption {
  display: none !important;
}

/* lightbox */

#slb_viewer_wrap .slb_theme_slb_baseline .slb_container {
  padding: 12px 12px 0 12px !important;
}

#slb_viewer_wrap .slb_theme_slb_default .slb_data_title {
  display: none !important;
}

#slb_viewer_wrap .slb_theme_slb_default .slb_group_status {
  font-size: 12px !important;
}

#slb_viewer_wrap .slb_theme_slb_default .slb_data_desc {
  margin-bottom: -6px;
}

/* Briefing List Status */
body.home .vbBriefingStatusBriefingList p,
body.archive .vbBriefingStatusBriefingList p,
body.search-results .vbBriefingStatusBriefingList p {
  font-style: italic !important;
}

.vbBriefingStatusBriefing {
  font-style: italic !important;
}

.vbBriefingStatusBriefing {
  display: block !important;
  margin-left: 0 !important;
  margin-top: -10px !important;
  margin-bottom: -20px !important;
}

.vbBriefingStatusBriefing:empty {
  margin-bottom: -30px !important;
}

.vbBriefingHeaderExcerptSection {
  margin-right: 200px !important;
  margin-bottom: 20px !important;
}

@media only screen and (max-width: 850px) {
  .vbBriefingHeaderExcerptSection {
    margin-right: 30px !important;
  }
}

/* overall adjust for mobile */
@media only screen and (max-width: 700px) {
  #vbTemplateSinglePost {
    margin-left: -14px !important;
    margin-right: -14px !important;
  }

  .vbSingleContent {
    /* or .entry-content? */
    margin-left: -4px !important;
    margin-right: -14px !important;
  }

  .vbSingleContent .vbGutterImage {
    /* 56 - margin-right above */
    margin-right: -42px !important;
  }
}

.vbNoSlides {
  margin-top: 25px !important;
}

/* show underline and scale up when hovering over site name to make it
more clear that it's a link */

.vbHeadingLeftColumn a:hover img {
  border-bottom: 1px solid black !important;
  transform: scale(1.05);
}

.vbBriefingExcerptBox p {
  margin-left: 10px !important;
  font-weight: 300 !important;
}

/* old footnotes plugin: remove after all footnotes
converted to wordpress native footnotes */
sup.footnote_plugin_tooltip_text {
  position: relative !important;
  top: 10px !important;
}