/*
 * ===================================================================
 * TRICON CORPORATE CENTRE — ELEMENTOR CUSTOM CSS
 * Enhances Elementor widgets and sections to match the Tricon brand.
 * ===================================================================
 */

/* =====================================================================
   CSS Variables for Elementor Widgets
   ===================================================================== */
.elementor-section,
.elementor-container,
.elementor-widget-wrap {
  --color-primary:    #0D1B2A;
  --color-gold:       #C9A84C;
  --color-gold-light: #E8C97A;
  --color-dark:       #060D14;
  --color-light:      #F8F5F0;
  --color-white:      #FFFFFF;
  --color-text:       #2D3748;
  --color-muted:      #6B7280;
  --font-heading:     'Playfair Display', Georgia, serif;
  --font-body:        'Inter', sans-serif;
  --radius-md:        0.75rem;
  --radius-lg:        1.25rem;
  --shadow-md:        0 4px 24px rgba(13,27,42,0.10);
  --shadow-lg:        0 12px 48px rgba(13,27,42,0.18);
  --transition:       0.35s cubic-bezier(0.4, 0, 0.2, 1);
}

/* =====================================================================
   ELEMENTOR HEADINGS
   ===================================================================== */
.elementor-widget-heading h1,
.elementor-widget-heading h2,
.elementor-widget-heading h3 {
  font-family: 'Playfair Display', Georgia, serif !important;
}

.elementor-widget-heading h4,
.elementor-widget-heading h5,
.elementor-widget-heading h6 {
  font-family: 'Inter', sans-serif !important;
}

/* Gold underline for section headings */
.elementor-widget-heading.tricon-heading-gold .elementor-heading-title::after {
  content: '';
  display: block;
  width: 60px;
  height: 3px;
  background: #C9A84C;
  margin-top: 0.75rem;
  border-radius: 9999px;
}

.elementor-widget-heading.tricon-heading-gold.text-center .elementor-heading-title::after {
  margin-inline: auto;
}

/* =====================================================================
   ELEMENTOR BUTTONS
   ===================================================================== */
.elementor-widget-button .elementor-button {
  font-family: 'Inter', sans-serif !important;
  font-weight: 600 !important;
  letter-spacing: 0.02em !important;
  border-radius: 9999px !important;
  transition: all 0.35s cubic-bezier(0.4, 0, 0.2, 1) !important;
}

/* Gold button */
.elementor-widget-button .elementor-button.tricon-btn-gold {
  background: #C9A84C !important;
  color: #0D1B2A !important;
  border: 2px solid #C9A84C !important;
  box-shadow: 0 8px 32px rgba(201,168,76,0.28) !important;
}
.elementor-widget-button .elementor-button.tricon-btn-gold:hover {
  background: #A88830 !important;
  border-color: #A88830 !important;
  transform: translateY(-2px) !important;
  box-shadow: 0 12px 40px rgba(201,168,76,0.4) !important;
}

/* Navy button */
.elementor-widget-button .elementor-button.tricon-btn-navy {
  background: #0D1B2A !important;
  color: #FFFFFF !important;
  border: 2px solid #0D1B2A !important;
}
.elementor-widget-button .elementor-button.tricon-btn-navy:hover {
  background: #1a3250 !important;
  border-color: #1a3250 !important;
  transform: translateY(-2px) !important;
}

/* Outline button */
.elementor-widget-button .elementor-button.tricon-btn-outline {
  background: transparent !important;
  color: #0D1B2A !important;
  border: 2px solid #0D1B2A !important;
}
.elementor-widget-button .elementor-button.tricon-btn-outline:hover {
  background: #0D1B2A !important;
  color: #FFFFFF !important;
  transform: translateY(-2px) !important;
}

/* =====================================================================
   ELEMENTOR SECTIONS — PRESETS
   ===================================================================== */
/* Dark navy section */
.elementor-section.tricon-section-dark {
  background-color: #0D1B2A !important;
}

/* Gold accent section */
.elementor-section.tricon-section-gold {
  background-color: #C9A84C !important;
}

/* Light section */
.elementor-section.tricon-section-light {
  background-color: #F8F5F0 !important;
}

/* Glassmorphism section */
.elementor-section.tricon-glass {
  background: rgba(255,255,255,0.06) !important;
  backdrop-filter: blur(20px) !important;
  -webkit-backdrop-filter: blur(20px) !important;
}

/* =====================================================================
   ELEMENTOR ICON BOXES
   ===================================================================== */
.elementor-widget-icon-box .elementor-icon-box-icon .elementor-icon {
  transition: all 0.35s cubic-bezier(0.4, 0, 0.2, 1);
}

.elementor-widget-icon-box:hover .elementor-icon-box-icon .elementor-icon {
  transform: translateY(-4px);
}

.elementor-widget-icon-box.tricon-icon-gold .elementor-icon-box-icon .elementor-icon i,
.elementor-widget-icon-box.tricon-icon-gold .elementor-icon-box-icon .elementor-icon svg {
  color: #C9A84C !important;
  fill: #C9A84C !important;
}

/* =====================================================================
   ELEMENTOR IMAGE BOXES
   ===================================================================== */
.elementor-widget-image-box.tricon-card .elementor-image-box-wrapper {
  background: #FFFFFF;
  border: 1px solid #E5E7EB;
  border-radius: 1.25rem;
  padding: 2rem;
  transition: all 0.35s cubic-bezier(0.4, 0, 0.2, 1);
}

.elementor-widget-image-box.tricon-card:hover .elementor-image-box-wrapper {
  transform: translateY(-8px);
  box-shadow: 0 12px 48px rgba(13,27,42,0.18);
  border-color: #C9A84C;
}

/* =====================================================================
   ELEMENTOR ACCORDION / TOGGLE
   ===================================================================== */
.elementor-widget-accordion .elementor-tab-title,
.elementor-widget-toggle .elementor-tab-title {
  font-family: 'Inter', sans-serif !important;
  font-weight: 600 !important;
  color: #0D1B2A !important;
  border-radius: 0.75rem !important;
}

.elementor-widget-accordion .elementor-tab-title.elementor-active,
.elementor-widget-toggle .elementor-tab-title.elementor-active {
  background-color: rgba(201,168,76,0.1) !important;
  color: #0D1B2A !important;
}

/* =====================================================================
   ELEMENTOR TESTIMONIALS / REVIEWS
   ===================================================================== */
.elementor-widget-testimonial .elementor-testimonial-content {
  font-family: 'Cormorant Garamond', Georgia, serif !important;
  font-size: 1.125rem !important;
  line-height: 1.8 !important;
  font-style: italic !important;
  color: #2D3748 !important;
}

.elementor-widget-testimonial .elementor-testimonial-name {
  font-family: 'Inter', sans-serif !important;
  font-weight: 700 !important;
  color: #0D1B2A !important;
}

/* =====================================================================
   ELEMENTOR COUNTER
   ===================================================================== */
.elementor-widget-counter .elementor-counter-number-wrapper {
  font-family: 'Playfair Display', Georgia, serif !important;
  color: #C9A84C !important;
}

/* =====================================================================
   ELEMENTOR PROGRESS BAR
   ===================================================================== */
.elementor-widget-progress .elementor-progress-bar {
  background-color: #C9A84C !important;
  border-radius: 9999px !important;
}

/* =====================================================================
   ELEMENTOR TABS
   ===================================================================== */
.elementor-widget-tabs .elementor-tab-title {
  border-radius: 0.5rem !important;
  font-weight: 600 !important;
  transition: all 0.35s ease !important;
}

.elementor-widget-tabs .elementor-tab-title.elementor-active {
  background: #0D1B2A !important;
  color: #C9A84C !important;
}

/* =====================================================================
   ELEMENTOR DIVIDER — GOLD
   ===================================================================== */
.elementor-widget-divider.tricon-divider-gold .elementor-divider-separator {
  border-color: #C9A84C !important;
}

/* =====================================================================
   ELEMENTOR CALL TO ACTION
   ===================================================================== */
.elementor-widget-call-to-action.tricon-cta .elementor-cta {
  border-radius: 1.25rem !important;
  overflow: hidden !important;
  box-shadow: 0 12px 48px rgba(13,27,42,0.18) !important;
}

/* =====================================================================
   ELEMENTOR MEDIA CAROUSEL
   ===================================================================== */
.elementor-widget-media-carousel .swiper-slide-image {
  border-radius: 0.75rem !important;
}

/* =====================================================================
   ELEMENTOR POSTS / ARCHIVE POSTS
   ===================================================================== */
.elementor-widget-posts .elementor-post__card,
.elementor-widget-archive-posts .elementor-post__card {
  border-radius: 1.25rem !important;
  overflow: hidden !important;
  border: 1px solid #E5E7EB !important;
  transition: all 0.35s cubic-bezier(0.4, 0, 0.2, 1) !important;
}

.elementor-widget-posts .elementor-post__card:hover,
.elementor-widget-archive-posts .elementor-post__card:hover {
  transform: translateY(-6px) !important;
  box-shadow: 0 12px 48px rgba(13,27,42,0.18) !important;
  border-color: #C9A84C !important;
}

/* =====================================================================
   ELEMENTOR FULL-WIDTH / STRETCH SECTION FIX
   ===================================================================== */
.elementor-section.elementor-section-stretched {
  left: 0 !important;
  max-width: 100% !important;
}

/* =====================================================================
   ELEMENTOR EDITOR HELPERS
   ===================================================================== */
.elementor-editor-active .tricon-hide-in-editor { opacity: 0.3; }

/* =====================================================================
   ELEMENTOR LIGHTBOX OVERRIDES
   ===================================================================== */
.elementor-lightbox .dialog-close-button {
  background: #C9A84C !important;
  border-radius: 50% !important;
}

/* =====================================================================
   ELEMENTOR GLOBAL CLASSES
   ===================================================================== */
/* Gold text */
.e-gold { color: #C9A84C !important; }

/* Navy text */
.e-navy { color: #0D1B2A !important; }

/* White text */
.e-white { color: #FFFFFF !important; }

/* Gold background */
.e-bg-gold { background-color: #C9A84C !important; }

/* Navy background */
.e-bg-navy { background-color: #0D1B2A !important; }

/* Rounded */
.e-rounded { border-radius: 1.25rem !important; }

/* Shadow */
.e-shadow { box-shadow: 0 4px 24px rgba(13,27,42,0.10) !important; }
.e-shadow-lg { box-shadow: 0 12px 48px rgba(13,27,42,0.18) !important; }

/* Gold border */
.e-border-gold { border: 2px solid #C9A84C !important; }

/* Center text */
.e-center { text-align: center !important; }

/* Uppercase labels */
.e-label {
  font-size: 0.75rem !important;
  font-weight: 700 !important;
  letter-spacing: 0.15em !important;
  text-transform: uppercase !important;
  color: #C9A84C !important;
}

/* =====================================================================
   LIGHTBOX OVERLAY
   ===================================================================== */
#tricon-lightbox {
  position: fixed;
  inset: 0;
  z-index: 99999;
  display: flex;
  align-items: center;
  justify-content: center;
  opacity: 0;
  visibility: hidden;
  transition: all 0.3s ease;
}
#tricon-lightbox.open {
  opacity: 1;
  visibility: visible;
}
#tricon-lightbox .lb-overlay {
  position: absolute;
  inset: 0;
  background: rgba(6,13,20,0.92);
  backdrop-filter: blur(8px);
}
#tricon-lightbox .lb-container {
  position: relative;
  z-index: 1;
  max-width: 90vw;
  max-height: 90vh;
  display: flex;
  align-items: center;
  gap: 1rem;
}
#tricon-lightbox .lb-figure {
  max-width: 85vw;
  max-height: 85vh;
}
#tricon-lightbox .lb-img {
  max-width: 85vw;
  max-height: 80vh;
  object-fit: contain;
  border-radius: 0.75rem;
  box-shadow: 0 24px 80px rgba(0,0,0,0.5);
}
#tricon-lightbox .lb-caption {
  text-align: center;
  color: rgba(255,255,255,0.7);
  font-size: 0.875rem;
  margin-top: 0.75rem;
}
#tricon-lightbox .lb-close,
#tricon-lightbox .lb-prev,
#tricon-lightbox .lb-next {
  background: rgba(255,255,255,0.1);
  border: 1px solid rgba(255,255,255,0.2);
  color: #fff;
  border-radius: 50%;
  width: 48px;
  height: 48px;
  font-size: 1.5rem;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  transition: all 0.25s;
  flex-shrink: 0;
}
#tricon-lightbox .lb-close:hover,
#tricon-lightbox .lb-prev:hover,
#tricon-lightbox .lb-next:hover {
  background: #C9A84C;
  color: #0D1B2A;
  border-color: #C9A84C;
}
#tricon-lightbox .lb-close {
  position: absolute;
  top: -56px;
  right: 0;
}