/* Flatsome Shortcode Compatibility */
/* These styles keep existing content pages readable after dequeuing flatsome.css */

/* Row/Col system */
.row { display: flex; flex-wrap: wrap; margin: 0 -15px; }
.col { padding: 0 15px; flex: 0 0 auto; }
.col-inner { padding: 15px 0; }

/* Common column widths */
.large-1 { width: 8.333%; }
.large-2 { width: 16.666%; }
.large-3 { width: 25%; }
.large-4 { width: 33.333%; }
.large-5 { width: 41.666%; }
.large-6 { width: 50%; }
.large-7 { width: 58.333%; }
.large-8 { width: 66.666%; }
.large-9 { width: 75%; }
.large-10 { width: 83.333%; }
.large-11 { width: 91.666%; }
.large-12 { width: 100%; }

@media (max-width: 849px) {
  .medium-12 { width: 100%; }
  .medium-6 { width: 50%; }
}
@media (max-width: 549px) {
  .small-12 { width: 100%; }
  .col { width: 100%; }
}

/* Section */
.section { padding: 30px 0; }
.section-content { max-width: var(--w); margin: 0 auto; padding: 0 var(--px); }
.section-bg { background-size: cover; background-position: center; }
.section-title { margin-bottom: 20px; }

/* Gap/Divider */
.gap { height: 30px; }
.gap-element { display: block; }
.divider { border: none; border-bottom: 1px solid var(--border); margin: 20px 0; }

/* Accordion */
.accordion { margin-bottom: 20px; }
.accordion-item { border: 1px solid var(--border); border-radius: var(--r); margin-bottom: 8px; overflow: hidden; }
.accordion-title { padding: 14px 18px; font-size: 14px; font-weight: 700; color: var(--ink); cursor: pointer; display: flex; align-items: center; justify-content: space-between; }
.accordion-title:hover { background: var(--bg); }
.accordion-inner { padding: 0 18px 14px; font-size: 13px; color: var(--ink-2); line-height: 1.7; }
.accordion-title.active { background: var(--blue-pale); color: var(--blue); }

/* Tabs */
.tabbed-content { margin-bottom: 20px; }
.tab-nav { display: flex; border-bottom: 2px solid var(--border); margin-bottom: 20px; }
.tab-nav li { list-style: none; }
.tab-nav a { display: block; padding: 10px 18px; font-size: 13px; font-weight: 700; color: var(--ink-3); border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all .15s; }
.tab-nav a.active, .tab-nav a:hover { color: var(--blue); border-bottom-color: var(--blue); }
.tab-panels .panel { display: none; }
.tab-panels .panel.active { display: block; }

/* Buttons */
.button { display: inline-flex; align-items: center; justify-content: center; height: 42px; padding: 0 20px; background: var(--ink); color: white; border-radius: var(--r); font-size: 13px; font-weight: 700; transition: background .15s; border: none; cursor: pointer; font-family: var(--font); }
.button:hover { background: var(--blue); }
.button.primary { background: var(--ink); }
.button.secondary { background: var(--blue); }
.button.white { background: var(--white); color: var(--ink); border: 1px solid var(--border-md); }
.button.is-outline { background: transparent; border: 1.5px solid var(--border-md); color: var(--ink); }
.button.is-outline:hover { border-color: var(--blue-hi); color: var(--blue); }

/* Banner */
.ux-banner { position: relative; overflow: hidden; border-radius: var(--r-lg); margin-bottom: 20px; }
.banner-inner { padding: 40px; }
.banner-bg { position: absolute; inset: 0; background-size: cover; background-position: center; }
.banner-layers { position: relative; z-index: 1; }

/* Images */
.ux-image-content { margin-bottom: 20px; }

/* Text */
.text-left { text-align: left; }
.text-center { text-align: center; }
.text-right { text-align: right; }

/* Icon list */
.icon-box { display: flex; align-items: flex-start; gap: 12px; margin-bottom: 16px; }
.icon-box-img { flex-shrink: 0; }

/* Slider */
.slider-wrapper { overflow: hidden; }

/* Hide any leftover Flatsome structural classes */
.header-wrapper { display: none; } /* Our header replaces this */
.page-wrapper { max-width: var(--w); margin: 0 auto; padding: 0 var(--px); }

/* Hide Flatsome mobile sidebar / overlays that render via wp_footer */
.mobile-sidebar,
.mfp-hide,
#main-menu.mobile-sidebar,
.ux-body-overlay { display: none !important; }

/* Disable Flatsome/WC lightboxes (Magnific Popup, PhotoSwipe) — Joopzy has its own */
.mfp-wrap, .mfp-bg, .mfp-container { display: none !important; visibility: hidden !important; }
.pswp { display: none !important; visibility: hidden !important; }
.woocommerce-product-gallery__trigger { display: none !important; }

/* Utility classes */
.is-small { font-size: 85%; }
.is-large { font-size: 115%; }
.hide-for-medium { }
@media (max-width: 849px) {
  .hide-for-medium { display: none !important; }
  .show-for-medium { display: block !important; }
}
@media (max-width: 549px) {
  .hide-for-small { display: none !important; }
  .show-for-small { display: block !important; }
}