/*! SD38 Local Stylesheets
 * Senate Democratic Caucus
 * Flex One Sub Theme Styling

   Last updated: ST

 */

 /* Table of Contents
*************************
 ** Global
 ** Typography
 ** Small Buttons
 ** Large Buttons
 ** Navigation
 ** General Page
 ** Home Page
 *  - Flexslider
 *  - Biography Block
 *  - Row: Latest News
 ** - Page: Newsletters
 ** - Page: Issues
 ** - Page: Community Champions
 ** - Contact Page
 ** - Webform
 ** Pagination
 ** Footer
 *  - Copyright
 * Misc
   -- Social Media
   -- Scroll Button
*/


/* Global 
*************************/
@media (min-width: 992px) and (max-width: 1199px) {
  .featured-bottom {
    padding: 60px 4% 0px !important;

    #block-sub-flex-one-theme-introblock-2 {
      padding-bottom: 60px !important;
    }
  }
}

@media (max-width: 991px) {

:root {
  --lg: linear-gradient(0deg,#0B2645, transparent);
}  
h1 {
  font-size: 5.4rem !important;
}
h2 {
  font-size: 3.4rem !important;
}
h3 {
  font-size: 2.2rem !important;
}
h4  {
  font-size: 2.2rem !important;
}
h5 {
  font-size: 1.4rem !important;
} 
h6 {
  font-size: 1.2rem;
}
p {
  font-size: 1.4rem !important;
  &:has(.btn-primary, .btn-secondary) {
    margin-bottom: 0px;
  }
}

.row > * {
  padding-left: 0px !important;
  padding-right: 0px !important;
}
.featured-bottom {
  padding: 60px 4% 0px !important;
  /* .contextual-region {
    padding-bottom: 60px;
  } */
 #block-sub-flex-one-theme-introblock-2 {
    padding-bottom: 60px !important;
 }
  .region-featured-bottom-first, .region-featured-bottom-second {
    padding-bottom: 60px !important;
  }
}
}

/* Typography 
*************************/
@media (min-width: 992px) and (max-width: 1199px) {

}

@media (max-width: 991px) {

}

/* Small Buttons
*************************/
@media (min-width: 992px) and (max-width: 1199px) {

}

@media (max-width: 991px) {

}

/* Large Buttons
*************************/
@media (min-width: 992px) and (max-width: 1199px) {

}

@media (max-width: 991px) {

}

/* Navigation
*************************/

@media (min-width: 992px) and (max-width: 1199px) {
  .menuBtn {
    /* position: relative; */
    padding-left: 20px; /* space between line and icon */
    margin-left: 15px;  /* space from logo */
}

.menuBtn::before {
    content: "";
    position: absolute;
    left: -20px;
    top: 50%;
    transform: translateY(-50%);
    height: 28px; /* adjust height as needed */
    width: 1px;
    background-color: #ffffff; /* change color if needed */
}
  .navbar-toggler {
    background-color: transparent !important;
    border: none;
    top: 20px;

    .lines {
      /* height: 2px !important; */
    }
  }

  ul.nav li.dropdown:hover>ul.dropdown-menu {
    background: var(--accent-color);
  }

  .dropdown {
    flex-direction: column !important;
  }

    /** Translation Icon **/
  .main-google-translator {
        /* position: absolute;
        right: 144px; */
  }

      /** Translation Icon **/
  .main-google-translator {
    position: absolute;
    width: auto !important;
    height: auto !important;
    border: none;
    z-index: 10;
    top: 80px !important;
    right: -68px;
    background-color: var(--dark-color);
    color: #000000;
    padding: 10px 10px 10px 30px;
  }
  #google_translator_element {
    div {
      /* display: flex;
      flex-direction: column-reverse; */
    }
    img {
    display: none !important;
  }
  .goog-te-gadget span {
    display: none;
  }
  }
#google_translator_element::before {
  content: "";
  display: inline-block;
  position: absolute;
  width: 27px;
  height: 17px;
  background-image: url('/sites/sd38.senate.ca.gov/files/website/buttons/google-logo.png');
  background-size: contain; /* Scales the image to fit */
  background-repeat: no-repeat;
  top: 15px;
  left:15px;
}
  .google-translator-switch {
    background-color: var(--dark-color);
    position: absolute;
    padding: 10px 20px;
    right: 68px;
    top: 0px;
  }
}

@media (max-width: 991px) {
    .menuBtn {
    /* position: relative; */
    padding-left: 20px; /* space between line and icon */
    margin-left: 15px;  /* space from logo */
}

.menuBtn::before {
    content: "";
    position: absolute;
    left: -20px;
    top: 50%;
    transform: translateY(-50%);
    height: 28px; /* adjust height as needed */
    width: 1px;
    background-color: #ffffff; /* change color if needed */
}

  .navbar-toggler {
  background-color: transparent !important;
  border: none;
  top: 10px;
}

  #navbar-main::after {
    content: "";
    position: absolute;
    left: 0;
    bottom: -40px;
    /* how far gradient extends below header */
    width: 100%;
    height: 40px;
    /* height of gradient */
    pointer-events: none;
    background: linear-gradient(180deg,
        rgba(0, 0, 0, 0.15) 0%,
        rgba(0, 0, 0, 0.00) 100%);
  }

  .btn-nav-blk {
    .btn-nav:last-of-type {
      margin-bottom: 0px;
    }
  }

    .navbar-expand-xl {
    & .navbar-brand {
      img {
        max-height: 60px;
      }
    }
  }

    /** Translation Icon **/
  .main-google-translator {
    position: absolute;
    width: auto !important;
    height: auto !important;
    border: none;
    z-index: 10;
    top: 63px !important;
    right: -68px;
    background-color: var(--dark-color);
    color: #000000;
    padding: 10px 10px 10px 30px;
  }
  #google_translator_element {
    div {
      /* display: flex;
      flex-direction: column-reverse; */
    }
    img {
    display: none !important;
  }
  .goog-te-gadget span {
    display: none;
  }
  }
#google_translator_element::before {
  content: "";
  display: inline-block;
  position: absolute;
  width: 27px;
  height: 17px;
  background-image: url('/sites/sd38.senate.ca.gov/files/website/buttons/google-logo.png');
  background-size: contain; /* Scales the image to fit */
  background-repeat: no-repeat;
  top: 15px;
  left:15px;
}
  .google-translator-switch {
    background-color: var(--dark-color);
    position: absolute;
    padding: 10px 20px;
    right: 68px;
    top:0;
  }
  

}

/* General Page
*************************/
@media (min-width: 992px) and (max-width: 1199px) {
  /* Annual Reports Page */
  .view-annual-reports-feature {
    .view-content {
      .views-row {
        .row {
          >div {
            margin-bottom: 60px !important;
          }
        }
      }
    }
  }

  .view-annual-reports {
    .view-content {
      .views-row {
        margin-bottom: 60px !important;
      }
    }
  }
}

@media (max-width: 991px) {

  #main-wrapper {
    padding: 80px 4% 0;
  }

  /* Annual Reports Page */
  .view-annual-reports-feature {
    .view-content {
      .views-row {
        .row {
          >div {
            margin-bottom: 60px !important;
          }
        }
      }
    }
  }

  .view-annual-reports {
    .view-content {
      .views-row {
        margin-bottom: 60px !important;
      }
    }
  }
}



/* Home Page
*************************/
/* Flexslider */
@media (min-width: 992px) and (max-width: 1199px) {
    .banner-header {
      top: 30% !important;
      width: 50% !important;
    }
}

@media (max-width: 991px) {
  .featured-top {
    .flexslider {
      height: 435px;
      li {
        height: 435px;
        img {
          height: 100% !important;
          object-fit: cover;
          object-position: right;
        }
      }
    }
    .banner-header {
      top: 70% !important;
      width: 100% !important;
      padding: 0 4% !important;
    }
    .btn-highlight {
      position: relative;
      width: 100% ;
      padding: 0px !important;
    }
  }
}

/* Biography Block */
@media (min-width: 992px) {
  .mobile-sidenav-bio {
    display: none;
  }
    .bio-image-mobile {
    display: none;
  } 
}

@media (min-width: 992px) and (max-width: 1199px) {
  /* .senator-blk {
    margin-bottom: 60px !important;
  } */

}

@media (max-width: 991px) {
.biography {
    & .ca-row {
      & .ca-item {
        & .img-wrapper {
          img {
            max-width: 450px !important;
          }

          &:after {
            max-width: 450px !important;
          }
        }
      }
    }
  }
.senator-blk {
  .senator-info {
    p {
      &:has(img) {
        margin-bottom: 0;
      }
      img {
        margin-bottom: 24px;
      }
    }
  }
}
.bio-image-mobile {
  width: 100%;
  height: 418px;
  overflow: hidden;
  margin-bottom: 20px;
}
.mobile-sidenav-bio {
  display: block;
  background: var(--dark-color);
        border-top: 6px solid var(--accent-color);
        .mobile-sidenav-container {
          padding: 20px 40px;
        p {
          color: #fff;
        }
        }
}
}

/* Row: Latest News */
@media (min-width: 992px) and (max-width: 1199px) {

}

@media (max-width: 991px) {
  .featured-bottom {
      .view-newsroom {
        padding-bottom: 0px;
      }
    }
  .latest-news {
      .view-header {
        text-align: left !important;
        h5 {
          margin-bottom: 10px;
        }
        h2 {
          margin-bottom: 24px;
        }
      }
  
      .view-content {
        >div {
            &::after {
              content: "";
              display: block;
              width: 100%;
              height: 1px;
              background: #ddd;
              margin: 20px 0;
            }
          }
        .teaser-wrapper {
          text-align: left !important
        }
        .views-field-field-front-image {
          margin-bottom: 16px;
        }
      }
      .view-footer {
        text-align: left;
      }
  }
}

/* Page: Newsletters
*************************/
@media (min-width: 992px) and (max-width: 1199px) {

}

@media (max-width: 991px) {
.path-newsroom {
    .teaser-wrapper {
        display: flex;
        flex-direction: column;
    }
}
}

/* Page: Issues
*************************/
@media (min-width: 992px) and (max-width: 1199px) {
  .select-issues {
    display: none;
  }

    .issues-view {
    padding-bottom: 40px !important;
  }
    .views-field-title {
    padding-top: 10px;
  }
}

@media (max-width: 991px) {
  .issues-row {
    &>*:last-child {
      padding: 40px !important;
    }
  }

  .issues-view {
    padding-bottom: 40px !important;
  }

  .views-field-title {
    padding-top: 10px;
  }

  #block-sub-flex-one-theme-sidebarcausesistandfor {
    display: none;
  }

  .select-issues {
    display: block;
  }
}

/* Page: Community Champions
*************************/
@media (min-width: 992px) and (max-width: 1199px) {

}

@media (max-width: 991px) {
.node--type-champion, .path-community-champion, .community-champion-form {
    & .img-wrapper {
        img {
          height: 400px !important;
          object-position: center;
        }
      }
    }
}

/* Contact Page
*************************/
@media (min-width: 992px) and (max-width: 1199px) {

}

@media (max-width: 991px) {

/* LCMS form */
.contact-form {
  height: 1000px;
}

}


/* Webform
*************************/
@media (min-width: 992px) and (max-width: 1199px) {
.mobile-inquiries {
  padding: 20px;
}
}

@media (max-width: 991px) {
.mobile-inquiries {
  padding: 20px;
}
}


/* Webform
*************************/

#edit-community-champion-container {
    > legend:first-of-type {
    display: none;
  }
}

@media (min-width: 992px) and (max-width: 1199px) {

}

@media (max-width: 991px) {
#edit-community-champion-container {
  padding: 0 !important;
}

.contact {
    & .request-form {
        .webform-header-section {
            padding: 40px 0%;
            border: none;
            border-radius: 0px;
        }
    }
}
}

/* Pagination
*************************/
@media (min-width: 992px) and (max-width: 1199px) {

}

@media (max-width: 991px) {

}

/* Footer
*************************/
@media (min-width: 992px) and (max-width: 1199px) {

}

@media (max-width: 991px) {
  .site-footer {
    .block {
      margin: 0px;
      padding: 0px;
    }

    .footer-left {
      padding: 60px 4% !important;
    }

    .footer-right {
      padding: 60px 4% !important;

.region-footer-right {
  .row {
    > div {
      &::after {
        content: "";
        display: block;
        width: 100%;
        height: 1px;
        background: #ddd;
        margin-top: 20px;
      }
    }
  }
}
    }
  }
}

/* Copyright */
@media (min-width: 992px) and (max-width: 1199px) {

}

@media (max-width: 991px) {

}


/* Misc
*************************/
@media (min-width: 992px) and (max-width: 1199px) {

}
@media (min-width: 992px) {
  .social-label {
    display: none;
  }

  .select-issues {
    display: none;
  }

}


@media (max-width: 991px) {
.social-media-bar {
  position: fixed;
  top: 75%;
  right: 0;
  z-index: 100;

  & .icon-bar {
  height: 52px;
  width: 100%;
  position: fixed;
  /* top: 50%; */
  left: 0px;
  bottom: 0px;
  /* transform: translateY(-50%); */
  display: flex;
  align-items: center;
  z-index: 101;
   background: linear-gradient(
    to right,
    rgba(255,255,255,0.05),
    rgba(255,255,255,0.35),
    rgba(255,255,255,0.05)
  );

  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);

  border-top: 1px solid rgba(255,255,255,0.35);
  border-bottom: 1px solid rgba(0,0,0,0.08);
  }
  
  & .icon-wrapper {
    display: flex !important;
    background: none !important;
    padding: 2px 12px;
    a {
      margin: 6px 4px;
    }
  }
}



/* Scroll to top button */
.scroll-btn a {
  display: flex;
  flex-direction: row-reverse;
  align-items: center;
  gap: 8px; /* space between icon and text */
  text-decoration: none;
}

.scroll-btn p {
  margin: 0;
}

.scroll-btn .mouse {
  margin: 0;
}

/* Select Option Styling */
.select-wrapper {
  display: flex;
  width: 100%;
  position: relative;
  margin: 32px auto 79px;

  select {
    width: 100%;
    padding: 14px 60px 14px 16px;
    font-size: 16px;
    border: 2px solid #222;
    background: #fff;
    appearance: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    cursor: pointer;
  }

  button {
    width: 50px;
    background: var(--accent-color); /* yellow */
    border: 2px solid #000;
    border-left: 0px;
    cursor: pointer;
    font-size: 20px;
  }
}




/* Yellow button area */
.select-wrapper::after {
  /* content: "↓";
  position: absolute;
  right: 0;
  top: 0;
  width: 50px;
  height: 100%;
  background: #f0b323;
  color: #000;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 20px;
  border: 2px solid #222;
  pointer-events: none; */
}

/* Issues Sidebar is hidden in mobile while select option is present */



}