/*
Theme Name:     Fullscreen Artists Child
Theme URI:      http://fullscreenart.wpengine.com
Author:         the DesignThemes team
Author URI:     http://themeforest.net/user/designthemes
Description:    Child theme for Fullscreen Artists — Elementor + WPBakery coexistence
Template:       fullscreen-artists
Version:        2.3
*/

/* =============================================================================
   GLOBAL FONT FAMILY
   ============================================================================= */
html {
   scroll-behavior: smooth;
}

body,
h1,
h1 a,
h2,
h2 a,
h3,
h3 a,
h4,
h4 a,
h5,
h5 a,
h6,
h6 a,
p,
p a,
a,
li,
li a,
blockquote,
input,
button,
textarea,
select,
.elementor-widget-heading .elementor-heading-title,
.elementor-widget-text-editor,
.rev_slider .tp-caption {
   font-family: 'Aldrich', sans-serif !important;
}

/* =============================================================================
   ELEMENTOR GENERAL COMPATIBILITY
   ============================================================================= */

.elementor-section .elementor-container {
   max-width: 100%;
}
.elementor-section.elementor-section-stretched {
   position: relative;
   left: 0 !important;
   width: 100% !important;
   max-width: 100% !important;
}
.elementor-column,
.elementor-col-100,
.elementor-col-50,
.elementor-col-33,
.elementor-col-25 {
   float: none !important;
}
.elementor-widget-heading .elementor-heading-title {
   line-height: 1.3;
}
.elementor-widget-image img {
   max-width: 100%;
   height: auto;
}
.elementor-button-wrapper .elementor-button {
   display: inline-block;
}
.elementor-popup-modal {
   z-index: 9999;
}
#primary .elementor {
   width: 100%;
}

/* =============================================================================
   GLOBAL BOTTOM NAVBAR  (fixed, 80px, always on top)
   ============================================================================= */

#global-bottom-navbar {
   position: fixed;
   bottom: 0;
   left: 0;
   right: 0;
   z-index: 99990;
   height: 80px;
   background: #111111;
   box-sizing: border-box;
}

#global-bottom-navbar::before {
   content: '';
   position: absolute;
   top: 0;
   left: 0;
   width: 40px;
   height: 3px;
   background: #cc0000;
}

.global-navbar-inner {
   display: flex;
   align-items: center;
   justify-content: flex-start;
   height: 100%;
   /* left padding = cookie icon left(15px) + icon width(50px) + gap(15px) */
   padding: 0 40px 0 80px;
   box-sizing: border-box;
   gap: 40px;
}

.global-navbar-brand a {
   color: #ffffff;
   text-decoration: none;
   font-size: 16px;
   font-weight: 700;
   letter-spacing: 2px;
   text-transform: uppercase;
   white-space: nowrap;
}
.global-navbar-brand a:hover {
   color: rgba(255, 255, 255, 0.8);
}

.global-bottom-nav {
   display: flex;
   align-items: center;
   flex-wrap: wrap;
}

.global-bottom-nav a {
   color: rgba(255, 255, 255, 0.65);
   text-decoration: none;
   font-size: 11px;
   letter-spacing: 1.5px;
   text-transform: uppercase;
   padding: 6px 14px;
   transition: color 0.2s ease;
   white-space: nowrap;
}
.global-bottom-nav a:hover {
   color: #ffffff;
}

.global-bottom-nav a.current,
.global-bottom-nav a[aria-current='page'] {
   color: #ffffff;
   position: relative;
}
.global-bottom-nav a.current::after {
   content: '';
   position: absolute;
   bottom: -2px;
   left: 14px;
   right: 14px;
   height: 1px;
   background: #cc0000;
}

/* Hide top header globally on all pages */
#header-wrapper {
   display: none !important;
}

.global-mobile-toggle {
   display: none;
}

/* =============================================================================
   CANVAS TEMPLATE  (elementor_canvas — used by all 6 primary pages)
   ============================================================================= */

/* Hide theme header / footer chrome */
body.elementor-template-canvas #header-wrapper,
body.elementor-template-canvas #header,
body.elementor-template-canvas .main-header-wrapper,
body.elementor-template-canvas #main-header-wrapper,
body.elementor-template-canvas #main-header,
body.elementor-template-canvas footer,
body.elementor-template-canvas #footer,
body.elementor-template-canvas .footer-wrapper,
body.elementor-template-canvas .main-title-section-wrapper,
body.elementor-template-canvas .loader {
   display: none !important;
}

/* All canvas pages: scrollable, dark background */
body.elementor-template-canvas {
   background: #fff;
   overflow-x: hidden;
   overflow-y: auto;
}

/* Elementor renders into .elementor-section-wrap on canvas.
   Add 80px bottom padding so the last section is never hidden
   behind the fixed navbar. */
body.elementor-template-canvas .elementor-section-wrap {
   padding-bottom: 80px !important;
}

/* =============================================================================
   HOME PAGE  (fullscreen Revolution Slider — no scroll)
   ============================================================================= */

body.home.elementor-template-canvas {
   background: #000000;
   overflow: hidden; /* lock scroll — slider fills viewport */
}

body.home.elementor-template-canvas .elementor-section-wrap {
   padding-bottom: 0 !important;
}

/* Slider section: fixed, fills space above navbar */
.home-revslider-section {
   position: fixed !important;
   top: 0 !important;
   left: 0 !important;
   right: 0 !important;
   bottom: 80px !important;
   z-index: 1 !important;
   overflow: hidden;
}

.home-revslider-section .elementor-widget-shortcode,
.home-revslider-section .elementor-widget-container,
.home-revslider-section .rev_slider_wrapper,
.home-revslider-section .rev_slider,
.home-revslider-section .tp-banner-container,
.home-revslider-section .tp-banner {
   width: 100% !important;
   height: 100% !important;
}
.home-revslider-section .rev_slider_wrapper {
   max-width: 100% !important;
   overflow: hidden;
}

/* =============================================================================
   ABOUT US  (ID: 7519)
   ============================================================================= */

/* Section must grow with content — not locked to 100vh */
.page-id-7519 .elementor-section {
   height: auto !important;
   min-height: calc(100vh - 80px);
}

/* Columns must not clip content */
.page-id-7519 .elementor-column,
.page-id-7519 .elementor-column-wrap,
.page-id-7519 .elementor-widget-wrap {
   height: auto !important;
   overflow: visible !important;
}

/* =============================================================================
   GALLERY  (ID: 14033)
   ============================================================================= */

.portfolio-grid-section .elementor-widget-image {
   margin-bottom: 4px;
   overflow: hidden; /* For scale effect */
}
.portfolio-grid-section .elementor-widget-image img {
   display: block;
   width: 100%;
   transition:
      transform 1.5s cubic-bezier(0.165, 0.84, 0.44, 1),
      opacity 1.5s cubic-bezier(0.165, 0.84, 0.44, 1);
}
.portfolio-grid-section .elementor-widget-image:hover img {
   opacity: 0.75;
   transform: scale(1.03);
}

/* =============================================================================
   CONTACT US  (ID: 14940)
   ============================================================================= */

.page-id-14940 .elementor-icon-box-title {
   color: #ffffff !important;
}
.page-id-14940 .elementor-icon-box-description {
   color: rgba(255, 255, 255, 0.8) !important;
}
.page-id-14940 .elementor-icon i {
   color: #cc0000 !important;
}

.page-id-14940 .wpcf7 input:not([type='submit']),
.page-id-14940 .wpcf7 textarea {
   background: rgba(255, 255, 255, 0.08) !important;
   border: 1px solid rgba(255, 255, 255, 0.3) !important;
   color: #ffffff !important;
   width: 100% !important;
   padding: 10px 14px !important;
   margin-bottom: 12px !important;
   border-radius: 0 !important;
}
.page-id-14940 .wpcf7 input[type='submit'] {
   background: transparent !important;
   border: 2px solid #ffffff !important;
   color: #ffffff !important;
   padding: 10px 30px !important;
   letter-spacing: 2px !important;
   text-transform: uppercase !important;
   cursor: pointer !important;
   transition: all 0.2s !important;
}
.page-id-14940 .wpcf7 input[type='submit']:hover {
   background: #ffffff !important;
   color: #000000 !important;
}

/* =============================================================================
   EVENT (14961) & WORKSHOP (14963)
   ============================================================================= */

.page-id-14961 .elementor-icon-box-wrapper,
.page-id-14963 .elementor-icon-box-wrapper {
   padding: 30px 20px;
   border: 1px solid rgba(255, 255, 255, 0.08);
   transition: border-color 0.3s;
}
.page-id-14961 .elementor-icon-box-wrapper:hover,
.page-id-14963 .elementor-icon-box-wrapper:hover {
   border-color: rgba(204, 0, 0, 0.4);
}

/* =============================================================================
   WPBAKERY PAGES  (portfolio detail & blog posts)
   ============================================================================= */

.page-built-with-wpbakery .wpb_wrapper,
.single-dt_portfolios .wpb_wrapper {
   width: 100%;
}

/* Non-canvas pages: push content above fixed navbar */
body:not(.elementor-template-canvas) #page-wrapper,
body:not(.elementor-template-canvas) #main-content-wrapper {
   padding-bottom: 80px;
}

/* =============================================================================
   RESPONSIVE
   ============================================================================= */

@media (max-width: 1024px) {
   .global-navbar-inner {
      padding: 0 20px 0 80px;
   }
   .global-bottom-nav a {
      padding: 6px 10px;
      font-size: 10px;
   }
}

@media (max-width: 767px) {
   .elementor-column {
      width: 100% !important;
   }

   #global-bottom-navbar {
      height: auto;
      min-height: 70px;
   }

   .global-navbar-inner {
      flex-direction: row;
      justify-content: space-between;
      padding: 0 20px 0 80px;
      align-items: center;
      height: 70px;
   }
   .global-navbar-brand a {
      font-size: 14px;
   }

   .global-mobile-toggle {
      display: flex;
      flex-direction: column;
      justify-content: space-between;
      width: 24px;
      height: 18px;
      cursor: pointer;
   }
   .global-mobile-toggle span {
      display: block;
      height: 2px;
      width: 100%;
      background-color: #fff;
      transition: all 0.3s ease;
   }
   .global-mobile-toggle.active span:nth-child(1) {
      transform: translateY(8px) rotate(45deg);
   }
   .global-mobile-toggle.active span:nth-child(2) {
      opacity: 0;
   }
   .global-mobile-toggle.active span:nth-child(3) {
      transform: translateY(-8px) rotate(-45deg);
   }

   .global-bottom-nav {
      display: none; /* hidden by default on mobile */
      position: absolute;
      bottom: 100%; /* pop up above the navbar */
      left: 0;
      right: 0;
      background: #111;
      flex-direction: column;
      width: 100%;
      padding: 10px 0;
      box-sizing: border-box;
      border-top: 1px solid #333;
      opacity: 0;
      transform: translateY(20px);
      transition: all 0.4s cubic-bezier(0.25, 0.8, 0.25, 1);
   }
   .global-bottom-nav.active {
      display: flex;
      opacity: 1;
      transform: translateY(0);
   }

   .global-bottom-nav a {
      padding: 15px 20px;
      font-size: 13px;
      width: 100%;
      text-align: center;
      border-bottom: 1px solid rgba(255, 255, 255, 0.05);
   }

   .global-bottom-nav a.current::after {
      display: none;
   }
   .global-bottom-nav a.current {
      background-color: rgba(204, 0, 0, 0.1);
      color: #cc0000;
   }

   /* Taller navbar on mobile — increase clearance */
   body.elementor-template-canvas .elementor-section-wrap {
      padding-bottom: 120px !important;
   }
   body.home.elementor-template-canvas .elementor-section-wrap {
      padding-bottom: 0 !important;
   }
   body:not(.elementor-template-canvas) #page-wrapper,
   body:not(.elementor-template-canvas) #main-content-wrapper {
      padding-bottom: 120px;
   }

   .home-revslider-section {
      bottom: 120px !important;
   }

   .page-id-7519 .elementor-section {
      min-height: auto;
   }
}

/* =============================================================================
   CUSTOM EVENTS PAGE TEMPLATE (/events)
   ============================================================================= */

.custom-events-page-wrapper {
   background: #ffffff;
   min-height: 100vh;
}

.custom-events-header-bar {
   background-color: #1a1a1a;
   padding: 40px 0;
   margin-bottom: 50px;
}

.custom-events-header-bar .container {
   max-width: 1200px;
   margin: 0 auto;
   padding: 0 20px;
}

.custom-events-header-bar h1 {
   color: #ffffff;
   margin: 0;
   font-size: 32px;
   font-weight: 700;
   letter-spacing: 1px;
}

.custom-events-content-area.container {
   max-width: 1200px;
   margin: 0 auto;
   padding: 0 20px 80px;
}

.events-section-title {
   font-size: 22px;
   font-weight: 600;
   color: #333333;
   margin-bottom: 30px;
   text-transform: uppercase;
   letter-spacing: 1px;
}

.events-section-title.ended-title {
   margin-top: 60px;
}

.events-coming-soon {
   color: #999999;
   font-size: 15px;
   font-style: italic;
   letter-spacing: 1px;
   margin: 20px 0 40px;
}

.events-grid {
   display: grid;
   grid-template-columns: repeat(3, 1fr);
   gap: 30px;
}

.event-card {
   background-color: #fbfbfb;
   transition:
      transform 0.8s cubic-bezier(0.165, 0.84, 0.44, 1),
      box-shadow 0.8s cubic-bezier(0.165, 0.84, 0.44, 1);
   border-radius: 4px;
   overflow: hidden;
}

.event-card:hover {
   transform: translateY(-4px);
   box-shadow: 0 15px 35px rgba(0, 0, 0, 0.06);
}

.event-card-image {
   overflow: hidden;
}

.event-card-image img {
   width: 100%;
   height: auto;
   display: block;
   object-fit: cover;
   aspect-ratio: 16/10;
   transition: transform 1.5s cubic-bezier(0.165, 0.84, 0.44, 1);
}

.event-card:hover .event-card-image img {
   transform: scale(1.04);
}

.event-card-content {
   padding: 25px 20px;
}

.event-card-title {
   color: #d6a45e; /* Exact matching orange */
   font-size: 22px;
   font-weight: 700;
   margin-top: 0;
   margin-bottom: 8px; /* Reduced margin to close the gap */
   line-height: 1.3;
}

.event-card-meta {
   color: #1b2733; /* Darker blue/gray */
   font-size: 15px;
   margin-bottom: 12px; /* Reduced margin */
}

.event-card-excerpt {
   color: #666666;
   font-size: 15px; /* Adjusted size */
   line-height: 1.6;
   margin-bottom: 20px; /* Adjusted margin before button */
   display: -webkit-box;
   -webkit-line-clamp: 5;
   -webkit-box-orient: vertical;
   overflow: hidden;
   text-overflow: ellipsis;
}

.event-card-button {
   display: inline-block;
   background-color: #d6a45e; /* Exact matching orange */
   color: #ffffff;
   padding: 12px 24px;
   font-size: 16px;
   font-weight: 600;
   text-decoration: none;
   transition: all 0.6s cubic-bezier(0.165, 0.84, 0.44, 1);
   border-radius: 2px;
}

.event-card-button:hover {
   background-color: #111111;
   color: #ffffff;
   transform: translateY(0);
   box-shadow: 0 8px 20px rgba(0, 0, 0, 0.15);
}

.events-pagination {
   margin-top: 40px;
   text-align: center;
}

.events-pagination a,
.events-pagination span {
   display: inline-block;
   padding: 8px 16px;
   margin: 0 4px;
   background: #f0f0f0;
   color: #333;
   text-decoration: none;
   border-radius: 3px;
}

.events-pagination span.current {
   background: #d6a45e;
   color: #fff;
}

.events-pagination a:hover {
   background: #e0e0e0;
}

@media (max-width: 992px) {
   .events-grid {
      grid-template-columns: repeat(2, 1fr);
   }
}

@media (max-width: 768px) {
   .events-grid {
      grid-template-columns: 1fr;
   }
}

/* =============================================================================
   SINGLE EVENT PAGE (single-event.php)
   ============================================================================= */

.single-event-header-bar {
   background-color: #000000;
   padding: 40px 0;
   margin-bottom: 50px;
}

.single-event-header-bar .container {
   max-width: 1200px;
   margin: 0 auto;
   padding: 0 20px;
}

.single-event-header-bar h1 {
   color: #ffffff;
   margin: 0 0 10px 0;
   font-size: 28px;
   font-weight: 700;
}

.single-event-breadcrumbs {
   color: #999999;
   font-size: 13px;
}

.single-event-breadcrumbs a {
   color: #cccccc;
   text-decoration: none;
}

.single-event-breadcrumbs a:hover {
   color: #ffffff;
}

.single-event-content-area {
   max-width: 1000px; /* Expand if needed, but 1000px is good for 2 cols */
   margin: 0 auto;
   padding: 40px 20px 150px;
}

.single-event-row {
   display: flex;
   flex-wrap: wrap;
   gap: 40px;
}

.single-event-sidebar {
   width: 25%;
}

.single-event-main {
   width: calc(75% - 40px);
}

.single-event-sidebar-widget {
   margin-bottom: 40px;
}

.single-event-sidebar-title {
   font-size: 18px;
   font-weight: 600;
   margin-top: 0;
   margin-bottom: 15px;
   padding-bottom: 10px;
   border-bottom: 2px solid #eeeeee;
   color: #333;
}

.single-event-sidebar-list {
   list-style: none;
   padding: 0;
   margin: 0;
}

.single-event-sidebar-list li {
   margin-bottom: 10px;
   padding-bottom: 10px;
   border-bottom: 1px dashed #eeeeee;
}

.single-event-sidebar-list li:last-child {
   border-bottom: none;
}

.single-event-sidebar-list a {
   color: #666;
   text-decoration: none;
   font-size: 15px;
   transition: color 0.3s;
   display: block;
   line-height: 1.4;
}

.single-event-sidebar-list a:hover {
   color: #d6a45e;
}

@media (max-width: 768px) {
   .single-event-sidebar {
      width: 100%;
      order: 2; /* Move sidebar below main content on mobile */
      margin-top: 40px;
   }
   .single-event-main {
      width: 100%;
      order: 1;
   }
}

.single-event-featured-image {
   margin-bottom: 30px;
}

.single-event-featured-image img {
   width: 100%;
   height: auto;
   display: block;
}

.single-event-meta {
   color: #666666;
   font-size: 14px;
   margin-bottom: 30px;
   border-bottom: 1px solid #eeeeee;
   padding-bottom: 15px;
}

.single-event-meta .meta-icon {
   color: #999;
   font-size: 12px;
}

/* Dropcap styling for the first letter of the first paragraph */
.single-event-body p:first-of-type::first-letter {
   color: #ffffff;
   background-color: #000000;
   float: left;
   font-size: 24px;
   font-weight: 700;
   line-height: 1;
   margin: 5px 15px 5px 0;
   padding: 10px 15px;
}

.single-event-body p {
   color: #555555;
   line-height: 1.8;
   margin-bottom: 20px;
}

/* Buy Tickets Block */
.single-event-tickets-block {
   background-color: #ffffff !important;
   border: 1px solid #e0e0e0 !important;
   padding: 40px !important;
   margin-top: 60px !important;
   box-shadow: 0 5px 25px rgba(0, 0, 0, 0.05) !important;
   max-width: 800px;
   margin-left: auto;
   margin-right: auto;
}

.single-event-tickets-block .ticket-row {
   display: flex;
   justify-content: space-between;
   border-bottom: 1px solid #eeeeee !important;
   padding: 20px 0 !important;
   font-size: 15px;
   font-weight: 600;
   color: #333333;
}

.single-event-tickets-block .ticket-label {
   color: #888888;
   letter-spacing: 1px;
}

.single-event-tickets-block .ticket-value {
   color: #111111;
   font-weight: 700;
}

.single-event-tickets-block .ticket-action {
   margin-top: 35px;
}

.single-event-tickets-block .buy-tickets-btn {
   display: block;
   width: 100%;
   background-color: #000000 !important;
   color: #ffffff !important;
   text-align: center;
   padding: 20px !important;
   font-size: 18px !important;
   font-weight: 700 !important;
   text-decoration: none !important;
   transition: background-color 0.3s ease !important;
   border: none !important;
   cursor: pointer;
}

.single-event-tickets-block .buy-tickets-btn:hover {
   background-color: #333333 !important;
}

/* =============================================================================
   WORKSHOPS PAGE (page-workshops.php)
   ============================================================================= */

/* The grid inherits from .events-grid. Add styles for pagination. */

.workshops-pagination {
   margin-top: 50px;
   text-align: center;
}

.workshops-pagination ul {
   list-style: none;
   padding: 0;
   margin: 0;
   display: inline-flex;
   gap: 10px;
}

.workshops-pagination li {
   display: inline-block;
}

.workshops-pagination a,
.workshops-pagination span.current {
   display: inline-block;
   padding: 10px 20px;
   background-color: #f5f5f5;
   color: #333333;
   text-decoration: none;
   font-weight: 600;
   border-radius: 3px;
   transition: all 0.3s ease;
}

.workshops-pagination a:hover {
   background-color: #e0e0e0;
}

.workshops-pagination span.current {
   background-color: #000000;
   color: #ffffff;
}

/* =============================================================================
   GALLERY DETAIL (PORTFOLIO) LIGHTBOX
   ============================================================================= */
.pfd-lb-close {
   display: none !important;
}

/* Hide "Impressed with our Folios?" CTA section on portfolio pages */
.pfd-cta-section {
   display: none !important;
}
