/* ================================================================
   Webboll Page Builder v2 ? Frontend CSS
================================================================ */

/* ?? RESPONSIVE GRID ???????????????????????????????????????? */
.wpb-columns-grid {
  display: grid;
  box-sizing: border-box;
}

@media (max-width: 1024px) {
  .wpb-columns-grid[data-col-tablet="1"] { grid-template-columns: 1fr !important; }
  .wpb-columns-grid[data-col-tablet="2"] { grid-template-columns: repeat(2,1fr) !important; }
  .wpb-columns-grid[data-col-tablet="3"] { grid-template-columns: repeat(3,1fr) !important; }
  .wpb-columns-grid[data-col-tablet="4"] { grid-template-columns: repeat(4,1fr) !important; }
  .wpb-gallery[data-col-tablet="1"] { grid-template-columns: 1fr !important; }
  .wpb-gallery[data-col-tablet="2"] { grid-template-columns: repeat(2,1fr) !important; }
  .wpb-gallery[data-col-tablet="3"] { grid-template-columns: repeat(3,1fr) !important; }
  .wpb-woo-products[data-col-tablet="2"] { grid-template-columns: repeat(2,1fr) !important; }
  .wpb-woo-products[data-col-tablet="3"] { grid-template-columns: repeat(3,1fr) !important; }
  .wpb-woo-cats[data-col-tablet="2"] { grid-template-columns: repeat(2,1fr) !important; }
  .wpb-woo-cats[data-col-tablet="3"] { grid-template-columns: repeat(3,1fr) !important; }
}

@media (max-width: 640px) {
  .wpb-columns-grid[data-col-mobile="1"] { grid-template-columns: 1fr !important; }
  .wpb-columns-grid[data-col-mobile="2"] { grid-template-columns: repeat(2,1fr) !important; }
  .wpb-gallery[data-col-mobile="1"] { grid-template-columns: 1fr !important; }
  .wpb-gallery[data-col-mobile="2"] { grid-template-columns: repeat(2,1fr) !important; }
  .wpb-woo-products[data-col-mobile="1"] { grid-template-columns: 1fr !important; }
  .wpb-woo-products[data-col-mobile="2"] { grid-template-columns: repeat(2,1fr) !important; }
  .wpb-woo-cats[data-col-mobile="1"] { grid-template-columns: 1fr !important; }
  .wpb-woo-cats[data-col-mobile="2"] { grid-template-columns: repeat(2,1fr) !important; }
  .wpb-posts[data-col-mobile="1"] { grid-template-columns: 1fr !important; }
  .wpb-section-inner { padding: 0 12px !important; }
}

/* ?? RESPONSIVE VISIBILITY ?????????????????????????????????? */
@media (min-width: 1025px) { .wpb-hide-desktop { display: none !important; } }
@media (min-width: 641px) and (max-width: 1024px) { .wpb-hide-tablet { display: none !important; } }
@media (max-width: 640px)  { .wpb-hide-mobile  { display: none !important; } }

/* ?? STICKY / FIXED ????????????????????????????????????????? */
.wpb-sticky { position: sticky; top: 0; z-index: 100; }
.wpb-fixed  { position: fixed; z-index: 999; }

/* ?? SECTION ???????????????????????????????????????????????? */
.wpb-section { box-sizing: border-box; }
.wpb-section--full .wpb-section-inner { max-width: 100% !important; }
.wpb-section-inner { box-sizing: border-box; }

/* ?? HOVER EFFECTS ?????????????????????????????????????????? */
.wpb-img-zoom img,
.wpb-img-zoom { transition: transform .35s ease; }
.wpb-img-zoom:hover img,
.wpb-img-zoom:hover { transform: scale(1.05); }

.wpb-card-hover { transition: box-shadow .25s, transform .25s; }
.wpb-card-hover:hover { box-shadow: 0 8px 32px rgba(0,0,0,.18) !important; transform: translateY(-3px); }

/* Gallery hover effects */
.wpb-gallery-item.wpb-hover-zoom img { transition: transform .35s; }
.wpb-gallery-item.wpb-hover-zoom:hover img { transform: scale(1.08); }
.wpb-gallery-item.wpb-hover-overlay { position: relative; }
.wpb-gallery-item.wpb-hover-overlay::after {
  content: ''; position: absolute; inset: 0; background: rgba(0,0,0,.35);
  opacity: 0; transition: opacity .3s;
}
.wpb-gallery-item.wpb-hover-overlay:hover::after { opacity: 1; }
.wpb-gallery-item.wpb-hover-fade img { transition: opacity .3s; }
.wpb-gallery-item.wpb-hover-fade:hover img { opacity: .75; }

/* ?? ANIMATIONS ????????????????????????????????????????????? */
[data-wpb-anim] { opacity: 0; transition: opacity .6s ease, transform .6s ease; }
[data-wpb-anim].wpb-animated { opacity: 1; transform: none !important; }
[data-wpb-anim="fadeIn"]    { opacity: 0; }
[data-wpb-anim="slideUp"]   { transform: translateY(40px); }
[data-wpb-anim="slideLeft"] { transform: translateX(40px); }
[data-wpb-anim="slideRight"]{ transform: translateX(-40px); }
[data-wpb-anim="zoomIn"]    { transform: scale(.9); }

/* Keyframe animations for icons/buttons */
@keyframes wpb-pulse   { 0%,100%{transform:scale(1)} 50%{transform:scale(1.06)} }
@keyframes wpb-bounce  { 0%,100%{transform:translateY(0)} 40%{transform:translateY(-10px)} 60%{transform:translateY(-5px)} }
@keyframes wpb-shake   { 0%,100%{transform:rotate(0)} 25%{transform:rotate(-5deg)} 75%{transform:rotate(5deg)} }
@keyframes wpb-spin    { from{transform:rotate(0)} to{transform:rotate(360deg)} }

[data-wpb-anim="pulse"]  { animation: wpb-pulse 1.5s infinite; opacity:1; }
[data-wpb-anim="bounce"] { animation: wpb-bounce 1.2s infinite; opacity:1; }
[data-wpb-anim="shake"]  { animation: wpb-shake .5s infinite; opacity:1; }
[data-wpb-anim="spin"]   { animation: wpb-spin 2s linear infinite; opacity:1; }

/* ?? SLIDER ????????????????????????????????????????????????? */
.wpb-slider { user-select: none; }
.wpb-slider img { pointer-events: none; }
.wpb-slider .wpbs-arrow { outline: none; }
.wpb-slider .wpbs-arrow:focus-visible { outline: 2px solid #fff; }
@media (max-width: 640px) {
  .wpb-slider .wpbs-content { padding: 20px 20px !important; }
  .wpb-slider .wpbs-arrow { width: 34px !important; height: 34px !important; font-size: 18px !important; }
}

/* ?? TABS ??????????????????????????????????????????????????? */
.wpb-tabs { border: 1px solid #e5e7eb; border-radius: 6px; overflow: hidden; }
.wpb-tab-pane { line-height: 1.7; font-size: 15px; }
.wpb-tab-pane p { margin: 0 0 12px; }

/* ?? ACCORDION ?????????????????????????????????????????????? */
.wpb-accordion { }
.wpb-acc-trigger { font-family: inherit; line-height: 1.4; }
.wpb-acc-body { overflow: hidden; }

/* ?? PROGRESS BARS ?????????????????????????????????????????? */
.wpb-progress-bars { }
.wpb-progress-fill { transition: width 1.2s cubic-bezier(.4,0,.2,1); }

/* ?? COUNTER ???????????????????????????????????????????????? */
.wpb-counter { }
.wpb-count-val { display: inline; }

/* ?? CONTACT FORM ??????????????????????????????????????????? */
.wpb-cf input, .wpb-cf textarea, .wpb-cf select { font-family: inherit; }
.wpb-cf input:focus, .wpb-cf textarea:focus { outline: 2px solid #0073aa; outline-offset: 1px; }
.wpb-cf-msg { border-radius: 4px; padding: 10px 14px; font-size: 14px; }
.wpb-cf-msg.ok  { background: #d1fae5; color: #065f46; }
.wpb-cf-msg.err { background: #fee2e2; color: #991b1b; }
.wpb-cf button[disabled] { opacity: .6; cursor: not-allowed; }

/* ?? LIGHTBOX ??????????????????????????????????????????????? */
.wpb-lightbox-overlay {
  position: fixed; inset: 0; background: rgba(0,0,0,.92); z-index: 99999;
  display: flex; align-items: center; justify-content: center;
  opacity: 0; animation: wpb-lb-in .25s ease forwards;
}
@keyframes wpb-lb-in { to { opacity: 1; } }
.wpb-lightbox-img {
  max-width: 90vw; max-height: 88vh; object-fit: contain;
  border-radius: 4px; box-shadow: 0 8px 48px rgba(0,0,0,.5);
  animation: wpb-lb-img .25s ease;
}
@keyframes wpb-lb-img { from { transform: scale(.9); } to { transform: scale(1); } }
.wpb-lightbox-close {
  position: absolute; top: 14px; right: 18px; color: #fff; background: none;
  border: none; font-size: 36px; cursor: pointer; line-height: 1; z-index: 10;
  opacity: .8; transition: opacity .2s;
}
.wpb-lightbox-close:hover { opacity: 1; }
.wpb-lightbox-prev, .wpb-lightbox-next {
  position: absolute; top: 50%; transform: translateY(-50%); background: rgba(255,255,255,.15);
  color: #fff; border: none; cursor: pointer; font-size: 28px; padding: 12px 16px;
  border-radius: 4px; transition: background .2s;
}
.wpb-lightbox-prev:hover, .wpb-lightbox-next:hover { background: rgba(255,255,255,.3); }
.wpb-lightbox-prev { left: 14px; }
.wpb-lightbox-next { right: 14px; }

/* ?? WOO ???????????????????????????????????????????????????? */
.wpb-price del { opacity: .5; font-size: .85em; }
.wpb-price ins { text-decoration: none; }
.wpb-add-to-cart { transition: opacity .2s, transform .1s; }
.wpb-add-to-cart:hover { opacity: .88; transform: translateY(-1px); }
.wpb-add-to-cart.loading { opacity: .6; pointer-events: none; }

/* ?? MARQUEE ???????????????????????????????????????????????? */
.wpb-marquee, .wpb-marquee-images { overflow: hidden; }

/* ?? GENERAL UTILITIES ?????????????????????????????????????? */
.wpb-block { box-sizing: border-box; }
.wpb-column { box-sizing: border-box; }

/* ================================================================
   SLIDER LAYER ANIMASYONLARI
================================================================ */
@keyframes wpba-fadeIn    { from{opacity:0}           to{opacity:1} }
@keyframes wpba-fadeOut   { from{opacity:1}           to{opacity:0} }
@keyframes wpba-slideInLeft  { from{opacity:0;transform:translateX(-60px)} to{opacity:1;transform:translateX(0)} }
@keyframes wpba-slideInRight { from{opacity:0;transform:translateX(60px)}  to{opacity:1;transform:translateX(0)} }
@keyframes wpba-slideInUp    { from{opacity:0;transform:translateY(60px)}  to{opacity:1;transform:translateY(0)} }
@keyframes wpba-slideInDown  { from{opacity:0;transform:translateY(-60px)} to{opacity:1;transform:translateY(0)} }
@keyframes wpba-zoomIn    { from{opacity:0;transform:scale(.7)} to{opacity:1;transform:scale(1)} }
@keyframes wpba-scaleIn   { from{opacity:0;transform:scale(1.3)} to{opacity:1;transform:scale(1)} }
@keyframes wpba-flipIn    { from{opacity:0;transform:perspective(600px) rotateY(90deg)} to{opacity:1;transform:perspective(600px) rotateY(0)} }
@keyframes wpba-flipOut   { from{opacity:1;transform:perspective(600px) rotateY(0)} to{opacity:0;transform:perspective(600px) rotateY(-90deg)} }

/* Gelismis slider */
.wpb-slider-adv { user-select:none; }
.wpb-slider-adv .sl-slide { display:none; }
.wpb-slider-adv .sl-slide.sl-active { display:block; }
.wpb-slider-adv .sl-layer { box-sizing:border-box; }
.wpb-slider-adv .sl-layer.sl-hidden { opacity:0!important; pointer-events:none; }
