/*
Theme Name: Electric Cinema
Author: Superwire
Author URI: https://electriccinema.co.uk
Theme URI:
Description: A full site editing theme.
Tags: full-site-editing, block-patterns
Text Domain: electric-cinema
Requires at least: 6.4
Requires PHP: 7.4
Tested up to: 6.4
Version: 100.0

*/

/* Styles intended only for the front.*/
html {
	scroll-behavior: smooth;
}

html.has-modal {
    /* disable underlying scrollbars when modal is open without hiding, kindof */
    overflow-y: scroll;
    position: fixed;
    width: 100%;
}

@media screen and (prefers-reduced-motion: reduce) {

	html {
		scroll-behavior: auto;
	}
}

body {
	-moz-osx-font-smoothing: grayscale;
	-webkit-font-smoothing: antialiased;
}


:host :where(h1, h2, h3, h4, h5, h6) {
    margin: unset;
}

.wp-block-navigation a:where(:not(.wp-element-button)) {
	text-decoration: none;
}

 
.sw__2-column-image {
	width: 100%;
	object-fit: cover;
}
.sw__2-column-image img {
	width: 100%;
	aspect-ratio: 4 / 3;
	object-fit: cover;
}



.sw__expand-child {
	flex: 1 1 auto;
}

.sw__full-height {
	height: 100%;
}

:root :where(.wp-site-blocks) > * {
	margin-block-start: 0;
}



/* Header & Main Navigation styles */

.wp-block-site-logo img.custom-logo {
  max-width: 142px;
  margin-right: 40px;    
}

@media (max-width: 781px) {
    .wp-block-site-logo img.custom-logo {
      max-width: 92px;
    }

}

.site-header.is-sticky {
  position: sticky;
  top: var(--wp-admin--admin-bar--height,0);
  z-index: 2;
  background: var(--wp--preset--color--custom-linen);
  box-shadow: 2px 2px 4px rgba(0,0,0,0.2);
 }


.site-header .wp-block-navigation .wp-block-navigation-item__content.wp-block-navigation-item__content:hover {
    color: var(--wp--preset--color--custom-putty-dark);
    transition: 0.2s ease;
}



@media (max-width: 781px) {
    .site-header .wp-block-group > :nth-child(2) {
      order: 3;

    }
}
 

.site-header .wp-block-navigation {
  column-gap: 40px;
}
.site-header .wp-block-navigation-item__content span {
  /* font-weight: 300; */
}

 

/* Top Navigation  */

 
/* change breakpoints - CSS variables cannot be used in media selectors :( */
@media (max-width:1260px) {
    /* these are hardcoded as 600px in WP */
    div.wp-block-navigation__responsive-container-open:not(.always-shown) {
        display: none;
    }
   div.wp-block-navigation__responsive-container:not(.hidden-by-default):not(.is-menu-open) {
       display: none;
   }
   button.wp-block-navigation__responsive-container-open:not(.always-shown) {
        display: flex;
   }
}
@media (max-width:1260px) {
    .site-header .wp-block-group > :nth-child(2) {
        order: 3;
        flex: 0;
    }
    /* expand middle column */
    .site-header .wp-block-group > :nth-child(3) {
        flex: 1;
    }
    /* move icons to right of middle column */
    .site-header .wp-block-group > :nth-child(3) > * {
        flex: 1;
        justify-content: flex-end;
        margin-right: 1rem;
        line-height: 0; /* avoid vertical align problem */
    }
}


/* main navigation close button position */

 .wp-block-navigation__responsive-container-close {
      right: 10px;
      top: 26px;
    } 

@media (max-width: 600px) {
    .wp-block-navigation__responsive-container-close {
      right: 0px;
      top: 18px;
    } 
}    


/* Mobile menu open */

@media (max-width: 1260px) {
    .wp-block-navigation__responsive-dialog {
      padding: 1.5rem;
    }
}

.wp-block-navigation__responsive-container.is-menu-open {
    background: var(--wp--preset--color--custom-linen) !important ;
    padding: 1rem;
    padding-left: 0;
 
}

 .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content {
      padding-top: 0;
      .wp-block-navigation-item__content {
            font-size: 20px !important;
             &:hover {
                   color: var(--wp--preset--color--custom-putty-dark);
             }
        }
}
  

/* navigation  icons */

.wp-block-navigation-item.custom-icon span {
   display:none;
}

.wp-block-navigation-item.custom-icon a::before {
    font-style: normal;
    font-weight: normal;
    font-variant: discretionary-ligatures;
    text-transform: none;
    line-height: 1;
    letter-spacing: 0px;
    font-feature-settings: "liga";
    -webkit-font-smoothing: antialiased;
    font-family: Phosphor !important;
    font-size: 1.33em;
}


.wp-block-navigation-item.icon-myaccount.wp-block-navigation-link a::before {
  content: "\E4C2";
}


.wp-block-navigation-item.icon-quickbook.wp-block-navigation-link a::before {
  content: "\E30C";
}
 


/* General content styles */

.page-content p a {
    color: #262420;
    text-decoration: underline;
}

.page-content p + h3.wp-block-heading {
    margin-top: 2rem;
}

.page-content p strong {
     font-weight: 500;   
}

@media (max-width: 600px) {
    .page-content  > .wp-block-spacer {
         height: 10px !important;
    }
}


/* General block image styles  */


.wp-block-columns .wp-block-image img {
 width: 100%;
 margin-bottom: 15px;
}

 .wp-block-image img {
  border-radius: 3px;
}



/* Homepage Carousel */

:root { --swiper-navigation-color: #FFF; }

.carousel-slide {
    width:80%
}
.carousel-image {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display:block;
    border-radius: 3px;
}
.carousel-container {
    height:55vh;
    width:100%;
}

@media (max-width: 600px) {
    .carousel-container {
        height:40vh;
        width:100%;
    }
}

.swiper-button-next, .swiper-button-prev {
    color: var(--sl-color-gray-50) !important;
}


/* Screening Type Panel */

@media (max-width: 780px) {
    .screening-type-panel {
        flex-direction:   column-reverse;
        &.line-above {
            border: 0;
        }
        .wp-block-spacer {
            display: none;
        }
    }
    
}

 
/* Book Tickets */

.select-wrapper {
    position: relative;
}

select-pure {
    --border-color: var(--wp--preset--color--border);
    --disabled-background-color: #bdc3c7;
    --disabled-color: #ecf0f1;
    --background-color: #fff;
    --color: #000;
    --hover-background-color: #e3e3e3;
    --hover-color: #000;
    --selected-background-color: #e3e3e3;
    --selected-color: #000;
    --dropdown-gap: 0;
    --font-size: 14px;
    --font-family: inherit;
    --font-weight: 400;
    --select-outline: 2px solid #e3e3e3;
    --dropdown-items: 8;
}
 

/* misc global settings */

.align-items-start {
   align-items: flex-start !important;
}

.align-items-center {
   align-items: center !important;
}

.align-items-end {
   align-items: flex-end !important;
}

.fit-visible {
  max-height: calc(100vh - 111px);
  width: 100%;
}

.background-putty {
    background-color: #F0EBDB;
}

.background-tallow {
    background-color: #E9E1CE;
}

@media (max-width: 599px) {
    .hidden-xs {
         display:none !important;
    }
}
 
@media (min-width: 600px) {
    .hidden-sm {
        display:none !important;
    }
}

@media (min-width: 780px) {
    .hidden-md {
          display:none !important;
    }
}

@media (min-width: 1000px) {
    .hidden-lg {
          display:none !important;
    }
}

@media (max-width: 780px) {
    .hidden-xs-sm {
         display:none !important;
    }
}

.line-above {
    border-top: 1px solid #C1AC8D;
}

.line-below {
    border-bottom: 1px solid #C1AC8D;
}


/* element positioning */


.outer-padding {
    padding-left: 25px;
    padding-right: 25px;
    box-sizing: content-box;
}


@media (max-width: 600px) {
    .outer-padding {
        padding-left: 15px;
        padding-right: 15px;
    }
}

.vertical-padding {
    padding-top: 30px;
    padding-bottom: 30px;
}

.no-top-margin {
    margin-top: 0;
}

.no-bottom-margin {
      margin-bottom: 0;
}



/* Venue Covers  */

.venue-cover h1 {
    line-height: normal;
}

.linear-gradient-dark .wp-block-cover__inner-container {
     background: linear-gradient(transparent 30%, rgb(0, 0, 0) 100%);
}
 
 @media (min-width: 1200px) {
    .wp-block-cover.alignfull.has-aspect-ratio, .wp-block-cover.alignfull.has-aspect-ratio img {
            max-height: 66vh;
            width: 100%;
        }
}



/* Buttons & hovers */

 


.wp-block-button.is-style-outline .wp-element-button:hover {
  border-color: rgb(68, 68, 68);
  background: rgba(0, 0, 0, 0.03);
  transition: 0.3s;
}

@media (min-width: 780px) { }


    .wp-block-button.is-style-outline .wp-element-button, .wp-block-button.is-style-inverted .wp-element-button {
            font-size: 90% !important;
    }


.wp-block-button.is-style-inverted .wp-element-button {
    background: none transparent;
    border-radius: 25px;
    border-color: currentcolor;
    border-width: 1px;
    border-style: solid;
    color: currentcolor;
    padding: 0.4em 1.66em;
    font-weight: 500;
}

.wp-block-button.is-style-inverted .wp-element-button:hover {
    border-color: currentColor !important;
    background: rgba(255,255,255, 0.15) !important;
    transition: 0.3s ease all;
}
 

/* Page Intro pattern */

 @media (min-width: 780px) {

    .page-intro .wp-block-heading    {
      align-items: center;
      display:flex;
      width: 100%;
      white-space: nowrap;
    }

    .page-intro .wp-block-heading::after {
       display: block;
      height: 1px;
      content: "";
      background-color: rgb(193, 172, 141);
      margin-left: 1em;
      width: 100%;
    }
     
}

 @media (max-width: 767px) {
     .page-intro .wp-block-heading {
        line-height: 1.15em;
     }
}

.page-intro .wp-block-heading span br {
  display: none;
}

.page-intro p {
  font-weight: 300;
}



/* Text with image pattern */

@media (max-width: 780px) {
    .text-with-image {
         flex-direction: column-reverse;
         padding-top: 0 !important;
         .wp-block-image img { 
            border-radius: 0 !important;
        }
        .wp-block-column:first-child {
            padding-right: var(--wp--preset--spacing--40) !important;
            padding-left: var(--wp--preset--spacing--40) !important;
        }
    }
}    

@media (max-width: 1000px) {
         .text-with-image > div {
             flex-basis: 50% !important;
    }
    
    .text-with-image .wp-block-image img {
              aspect-ratio: 4/3 !important;
    }
}

@media (min-width: 780px) {
.wp-block-image {
        margin-right: 25px !important;
    }
}
 


/* Log in */

 
.extra-narrow-content {
    max-width: 600px;
}
 

/* Journal */

.wp-block-query .wp-block-post-title a {
    font-size: inherit;
    line-height: normal;
}

.wp-block-query .wp-block-post-title a:hover {
    color: var(--wp--preset--color--custom-putty-dark);
}
 

.wp-block-post img {
    border-radius: 3px;
}

.wp-block-post .wp-block-post-featured-image:hover {
    opacity: 0.9;
    transition: 0.2s ease;
}


@media   (min-width:601px) and (max-width: 980px) {
  .wp-block-post-template-is-layout-grid.wp-block-post-template-is-layout-grid.wp-block-post-template-is-layout-grid.wp-block-post-template-is-layout-grid {
    grid-template-columns: 1fr 1fr;
  }
}





/* single post */


main .wp-block-pullquote  {
  font-family: "Cormorant Garamond", serif;
  font-size: 48px;
  font-weight: 100;
  line-height: normal;
  padding: 1.5em 0px;
}
@media  (max-width: 600px) {
    main .wp-block-pullquote  {
        font-size: 24px;
        padding: 1em 0px;
        text-align: left;
    }
}

main .wp-block-post-excerpt {
  font-family: "Cormorant Garamond", serif;
  font-size: 36px;
  font-weight: 100;
  line-height: normal;
  margin-bottom: 2rem;
}

main .journal-meta {
   justify-content: center;
}
 

main .wp-block-post-featured-image, .wp-block-post-featured-image img {
    max-height: 66vh;
    width: 100%;
}


main .wp-block-image {
     margin-top: 3rem;
     margin-bottom: 3rem;
    img {
        width: 100%;
    }
}

.sw-back-to-top .caret-up {
    font-size: 30px;
}

.sw-back-to-top a  {
     color: var(--wp--preset--color--custom-putty-dark);
     transition: 0.2s ease;
}

.sw-back-to-top a:hover  {
     color: currentColor;
}


.is-layout-flex.flex-gap-small {
    gap: 0.5rem;
}

.wp-block-post-navigation-link a, .wp-block-list li a {
    color: currentColor;
    font-weight: normal;
    text-decoration: underline;
}

.is-content-justification-space-between {
    justify-content: space-between;
}




/* Nav menu items */

.wp-block-navigation__container li.current-menu-item {
    text-decoration: underline;
    text-decoration-color: var(--wp--preset--color--active-underline);
    text-underline-offset: 0.5rem;
    text-decoration-thickness: 0.1rem;
}



.site-footer > div  {
    margin-bottom: 0;
}



* {
    box-sizing: border-box;
}


/* Film info page */


dialog::backdrop {
  background-color: rgba(255, 255, 2555, 0.9);
  transition: background-color 0.5s;
}

.film-info__buttons {
     display: flex;
    gap: 20px;
}





/* Film Ratings  */

.cert.rating-18::after {
    content: '18';
}

.cert.rating-15::after {
    content: '15';
}

.cert.rating-12A::after {
    content: '12A';
}
.cert.rating-U::after {
    content: 'U';
    font-size: 120%;
}

.cert.rating-PG::after {
    content: 'PG';
}

.cert.rating-TBC::after {
    content: 'TBC';
    font-size: 85%;
}


h1 .cert {
    font-size:   var(--wp--preset--font-size--small);
    width: 50px;
}
h2 .cert {
    font-size:   var(--wp--preset--font-size--small);
    width: 42px;
}
h3 .cert {
    font-size: var(--wp--preset--font-size--normal);
    width: 40px;
}
 

/* Booking info pricing tables */



.wp-block-table.pricing-table .has-fixed-layout {
    table-layout: auto;

}

.wp-block-table.pricing-table.is-style-stripes {
        border-bottom: 0;
}

.wp-block-table.pricing-table.is-style-stripes tbody tr:nth-child(2n+1) {
  background-color: var(--wp--preset--color--primary);
}

.wp-block-table .wp-element-caption {
    font-size: 90%;
}



.wp-block-table.pricing-table .has-fixed-layout th {
    text-align: left;
    word-break: normal;
    width: auto;
}

@media (max-width: 600px) {
     
    
    .wp-block-table.pricing-table .has-fixed-layout th {
        word-break: break-word;

    }
    
    .wp-block-table.pricing-table .has-fixed-layout th:first-child {
        min-width: 50%;
    }


    .wp-block-table.pricing-table .has-fixed-layout td:not(:first-child) {
        white-space: nowrap;
    }
}





/* legals - cookies table */


.cookies-table {
      border: 1px solid var(--wp--preset--color--primary);
      margin-bottom: 50px;
    td, th {
        padding: 5px 10px;
    }
    th {
        background-color: var(--wp--preset--color--primary);
        text-align: left;
        word-break: normal;
    }
    td {
      vertical-align: top;    
      border-bottom: 1px solid var(--wp--preset--color--primary);
        a {
            color: var(--wp--preset--color--contrast);
            text-decoration: underline;
        }
    }
    tr:last-child td {
        border-bottom: 0;
    }
 
}

@media (max-width: 600px) {
    
  .cookies-table td, .cookies-table th, .cookies-table tr {
    display: inline-block;
    border: 0px;
    background: transparent;
   padding: 0;
  }
    
.cookies-table {
      border: 0;
        th {
            display: none;
        }
    }
    
}


/* a title or button surrounded by lines */


@media (min-width: 600px) {

    .lines-around {
        width: 100%;
        display: flex !important;
        justify-content: space-around;
        flex: 0 0 auto;
        white-space: nowrap;
    }

    .lines-around::before, .lines-around::after {
            content: '';
            flex: 1 1 auto;
            border-bottom: 1px solid var(--wp--preset--color--border,#000);
            transform: translateY(-50%);
    }
    .lines-around::before {
        margin-right: 1rem;
    }

    .lines-around::after {
        margin-left: 1rem;
    }
    

}    


/* admissions table prices */


@media (min-width: 600px) {
    .pricing-table td:first-child {
        min-width: 50%;
    }
}

@media (max-width: 780px) {
    .toggle-nav.wp-block-navigation.items-justified-right  {
         justify-content:flex-start;
    }
}

.wp-block-table.pricing-table .has-fixed-layout th {
    line-height: normal;
}

.toggle-nav .wp-block-navigation-item__label  {
         line-height: 0;
          opacity: 0.5;
}

.toggle-nav .selected .wp-block-navigation-item__label {
      opacity: 1;
}


.toggle-nav li:first-child a.selected span::after,
.toggle-nav li:last-child a.selected span::before{
    font-family: Phosphor !important;
    display: inline-block;
    margin: 0 10px;
    font-size: 1.3em;
    vertical-align: middle;
}

.toggle-nav li:first-child a.selected span::after {
    content: '\E674';
}

.toggle-nav li:last-child a.selected span::before {
    content: '\E676';
}

/* wide line */

.wp-block-separator.is-style-wide {
    border-width: 1px;
    border-color: var(--wp--preset--color--border, #000);
}


/* Gallery captions */

.wp-element-caption {
    font-style: italic;
}

/* Contact us */


@media (max-width: 600px) {
    .contact-us .wp-block-column  {
        order: 2;
    }
    .contact-us .wp-block-column:last-child {
        order: 1;
    }
}


/* Form styles */

sl-input::part(form-control) { 
  margin-bottom: var(--sl-spacing-x-small);
}

 

/* Google map */

 @media (min-width: 601px) {
    .map {
        padding-bottom: 30px;
    }
}
 
@media (max-width: 600px) {
    .map {
        height: 33vh;
        width: 100%;
    }
}

.map-marker::after {
    position: relative;
    transform: translate(-50%,-50%);
    content: 'test';
}



hr.wp-block-separator {
    border-width: 1px;
}


/* Select Tickets */

@media (max-width: 600px) {
  .tickets__table li span {
    padding: 0.5rem 0.15rem;
  }
}



/* My Account */

.my-account-header .wp-block-heading {
    line-height: normal;
}

.my-account-header p {
    white-space: nowrap;
}

   .my-account-header .wp-block-column.is-vertically-aligned-bottom {
      align-self: baseline;
    }

.my-account-header .ph-sign-out {
   color: currentColor;
   margin-right: -5px;
}

@media (max-width: 800px) {
    .my-account-header .has-text-align-right {
        text-align: left;
    }
    
}
 

 


/* Footer */

.site-footer .wp-block-navigation {
  column-gap: 30px;
}

 

    
     .site-footer .copyright {
                flex: 0 0 auto;
            }
    
    .site-footer  .footer-navigation {
              flex: 1 1 auto;
          }
   
     .site-footer p,      .site-footer .wp-block-navigation-item__content {
             font-weight: 300;
             font-size: 90%;
        }


    .site-footer .wp-block-navigation .wp-block-navigation-item__label:hover {
        text-decoration: underline;
    }

.site-footer .letterboxd  a {
        display: flex;
        align-items: center;
}
    
@media (max-width: 980px) {
    .site-footer  {
     
             .footer-navigation {
                  order:1;
                }

             .copyright {
                 order:3;
                 font-size: 95%;
                 flex-basis: 100%;
            }

            .social-navigation,  .letterboxd {
                  order:2;
                  justify-content: flex-start !important;      
                  margin-top: 10px;
            }
         
        
             .wp-block-group {
                  justify-content: initial !important;
            }

             .wp-block-navigation  .wp-block-navigation-item {
                       flex-basis: 45%;
             }
          

            .has-extra-small-font-size {
                font-size: inherit !important;
            }
    }    

}


 


@media (min-width: 600px) {
    .wp-block-electric-map {
        margin-left: 30px;
    }
}
 

/* OneTrust icon */

#ot-sdk-btn-floating {
    display: none;
}    

 #onetrust-pc-sdk .ot-pc-header .ot-pc-logo {
  justify-content: flex-start !important;
}

#onetrust-pc-sdk .ot-pc-header {
    border-bottom: 1px solid #999 !important;
}

#onetrust-pc-sdk .ot-close-icon {
    border: 0  !important;
    outline:0 !important;
}
           

/* System messages - no matches etc */

.system-msg {
    opacity: 0.8;
   font-weight: 300;
}