/* =========================================================
   Konya Oto LPG — Ürünler + LPG Markaları A-Z eşit görünüm
   Bu dosya iki liste sayfasını ve iki detay sayfasını aynı temaya çeker.
   ========================================================= */
:root{
  --ufuk-blue:#004AAD;
  --ufuk-blue-dark:#003B7A;
  --ufuk-sky:#0EA5E9;
  --ufuk-ink:#0f172a;
  --ufuk-muted:#64748b;
  --ufuk-line:rgba(0,74,173,.14);
  --ufuk-soft:#f4f8ff;
  --ufuk-card:#ffffff;
  --primary:var(--ufuk-blue) !important;
}

body.ufuk-catalog-page,
body.ufuk-detail-page{
  --primary:var(--ufuk-blue) !important;
  --brand:var(--ufuk-blue) !important;
  --brand2:var(--ufuk-sky) !important;
  background:
    radial-gradient(1200px 520px at 50% -8%, rgba(0,74,173,.10), transparent 62%),
    linear-gradient(180deg,#ffffff 0%, #f6faff 46%, #ffffff 100%) !important;
}

.ufuk-catalog-page .container-xxl,
.ufuk-detail-page .container-xxl{
  max-width:1320px !important;
}

.ufuk-catalog-page main > .container-xxl,
.ufuk-catalog-page body > .container-xxl{
  padding-top:16px !important;
}

.ufuk-catalog-page .page-hero{
  border:1px solid var(--ufuk-line) !important;
  border-radius:22px !important;
  background:linear-gradient(135deg,rgba(255,255,255,.98),rgba(244,248,255,.94)) !important;
  box-shadow:0 16px 40px rgba(15,23,42,.055) !important;
  padding:22px 24px !important;
  margin:16px 0 20px !important;
}
.ufuk-catalog-page .page-hero h1{
  font-weight:950 !important;
  letter-spacing:-.035em;
  color:var(--ufuk-ink) !important;
  margin-bottom:.35rem !important;
}
.ufuk-catalog-page .page-hero p{
  color:var(--ufuk-muted) !important;
  margin-bottom:0 !important;
}

/* Ürünler ve LPG Markaları aynı yerleşim */
.ufuk-catalog-page .catalog-layout-row{
  align-items:flex-start !important;
}
.ufuk-catalog-page .catalog-aside-col{
  width:16.66666667% !important;
}
.ufuk-catalog-page .catalog-main-col{
  width:83.33333333% !important;
}

.ufuk-catalog-page .aside{
  position:sticky !important;
  top:88px !important;
}

.ufuk-catalog-page .card-soft,
.ufuk-detail-page .card-soft,
.ufuk-detail-page .gallery-card,
.ufuk-detail-page .buy-card,
.ufuk-detail-page .service-summary{
  border:1px solid var(--ufuk-line) !important;
  border-radius:20px !important;
  background:rgba(255,255,255,.96) !important;
  box-shadow:0 14px 34px rgba(15,23,42,.055) !important;
  overflow:hidden !important;
}

.ufuk-catalog-page .filter-bar{
  top:88px !important;
  border:1px solid var(--ufuk-line) !important;
  border-radius:18px !important;
  background:rgba(255,255,255,.94) !important;
  box-shadow:0 14px 34px rgba(15,23,42,.065) !important;
  backdrop-filter:blur(10px);
  padding:10px !important;
}

.ufuk-catalog-page .filter-bar .row{
  --bs-gutter-x:.55rem !important;
  --bs-gutter-y:.55rem !important;
}

.ufuk-catalog-page .form-control,
.ufuk-catalog-page .form-select{
  min-height:44px !important;
  border-color:rgba(0,74,173,.15) !important;
  border-radius:12px !important;
}
.ufuk-catalog-page .form-control:focus,
.ufuk-catalog-page .form-select:focus{
  border-color:rgba(0,74,173,.45) !important;
  box-shadow:0 0 0 .22rem rgba(0,74,173,.10) !important;
}

.ufuk-catalog-page .btn-danger,
.ufuk-detail-page .btn-danger,
.ufuk-catalog-page .btn-primary,
.ufuk-detail-page .btn-primary{
  --bs-btn-bg:var(--ufuk-blue) !important;
  --bs-btn-border-color:var(--ufuk-blue) !important;
  --bs-btn-hover-bg:#0066d6 !important;
  --bs-btn-hover-border-color:#0066d6 !important;
  --bs-btn-active-bg:var(--ufuk-blue-dark) !important;
  --bs-btn-active-border-color:var(--ufuk-blue-dark) !important;
  min-height:44px !important;
  border-radius:12px !important;
  font-weight:850 !important;
}
.ufuk-catalog-page .btn-outline-danger,
.ufuk-detail-page .btn-outline-danger{
  --bs-btn-color:var(--ufuk-blue) !important;
  --bs-btn-border-color:rgba(0,74,173,.45) !important;
  --bs-btn-hover-bg:var(--ufuk-blue) !important;
  --bs-btn-hover-border-color:var(--ufuk-blue) !important;
  --bs-btn-hover-color:#fff !important;
  border-radius:12px !important;
  font-weight:850 !important;
}
.ufuk-catalog-page .text-danger,
.ufuk-detail-page .text-danger{color:var(--ufuk-blue) !important;}

.ufuk-catalog-page .cat-link{
  display:flex !important;
  justify-content:space-between !important;
  align-items:center !important;
  gap:.55rem !important;
  padding:.58rem .72rem !important;
  border-radius:12px !important;
  color:#334155 !important;
  text-decoration:none !important;
  font-size:.88rem !important;
  line-height:1.25 !important;
}
.ufuk-catalog-page .cat-link:hover{background:var(--ufuk-soft) !important;color:var(--ufuk-blue) !important;}
.ufuk-catalog-page .cat-link.active,
.ufuk-catalog-page .fw-bold.text-danger{
  background:rgba(0,74,173,.08) !important;
  color:var(--ufuk-blue) !important;
  font-weight:850 !important;
}

/* Ürün ve LPG marka kartları birebir aynı */
.ufuk-catalog-page .products-grid,
.ufuk-catalog-page .service-grid{
  --bs-gutter-x:1rem !important;
  --bs-gutter-y:1rem !important;
}
.ufuk-catalog-page .product-card,
.ufuk-catalog-page .service-card{
  border-radius:18px !important;
  overflow:hidden !important;
  border:1px solid rgba(0,74,173,.12) !important;
  background:#fff !important;
  box-shadow:0 10px 24px rgba(15,23,42,.045) !important;
  height:100% !important;
  transition:transform .2s ease, box-shadow .2s ease, border-color .2s ease !important;
}
.ufuk-catalog-page .product-card:hover,
.ufuk-catalog-page .service-card:hover{
  transform:translateY(-5px) !important;
  box-shadow:0 18px 36px rgba(15,23,42,.10) !important;
  border-color:rgba(0,74,173,.22) !important;
}
.ufuk-catalog-page .imgbox,
.ufuk-catalog-page .service-thumb{
  height:178px !important;
  padding:16px !important;
  border-bottom:1px solid rgba(0,74,173,.09) !important;
  background:linear-gradient(180deg,#fff,#f8fbff) !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  position:relative !important;
}
.ufuk-catalog-page .imgbox img,
.ufuk-catalog-page .service-thumb img,
.ufuk-catalog-page .card-img-top{
  width:100% !important;
  height:100% !important;
  object-fit:contain !important;
  padding:0 !important;
  max-height:none !important;
  transition:transform .25s ease !important;
}
.ufuk-catalog-page .product-card:hover .imgbox img,
.ufuk-catalog-page .service-card:hover .service-thumb img{transform:scale(1.045) !important;}

.ufuk-catalog-page .product-card .card-body,
.ufuk-catalog-page .service-card .card-body{
  padding:14px !important;
}

.ufuk-catalog-page .title,
.ufuk-catalog-page .service-title{
  font-size:.94rem !important;
  font-weight:850 !important;
  color:var(--ufuk-ink) !important;
  line-height:1.35 !important;
  min-height:2.55em !important;
  display:-webkit-box !important;
  -webkit-line-clamp:2 !important;
  -webkit-box-orient:vertical !important;
  overflow:hidden !important;
  margin-bottom:7px !important;
}
.ufuk-catalog-page .desc,
.ufuk-catalog-page .service-desc{
  color:#64748b !important;
  font-size:.79rem !important;
  line-height:1.45 !important;
  min-height:2.3em !important;
  display:-webkit-box !important;
  -webkit-line-clamp:2 !important;
  -webkit-box-orient:vertical !important;
  overflow:hidden !important;
}
.ufuk-catalog-page .price{color:var(--ufuk-blue) !important;font-weight:950 !important;}
.ufuk-catalog-page .badge-new{
  position:absolute !important;
  top:10px !important;
  left:10px !important;
  z-index:2 !important;
  background:var(--ufuk-blue) !important;
  color:#fff !important;
  border-radius:10px !important;
  padding:.35rem .5rem !important;
  font-weight:850 !important;
  font-size:.75rem !important;
}
.ufuk-catalog-page .badge-brand{
  position:absolute !important;
  top:10px !important;
  right:10px !important;
  z-index:2 !important;
  background:#475569 !important;
  color:#fff !important;
  border-radius:10px !important;
  padding:.35rem .5rem !important;
  font-weight:850 !important;
  font-size:.72rem !important;
}

.ufuk-catalog-page .support-grid{
  display:grid !important;
  grid-template-columns:1fr 1fr !important;
  gap:16px !important;
  margin-top:18px !important;
}
.ufuk-catalog-page .support-grid .card-soft{height:100% !important;}
.ufuk-catalog-page .support-grid .aside{position:static !important;top:auto !important;}
.ufuk-catalog-page .support-grid .btn{border-radius:12px !important;font-weight:800 !important;}

/* Detay sayfaları ortak */
.ufuk-detail-page .gallery-main-wrap,
.ufuk-detail-page .gallery-main{border-radius:16px !important;}
.ufuk-detail-page .buy-card h1,
.ufuk-detail-page .service-summary h1{font-weight:950 !important;letter-spacing:-.025em;color:var(--ufuk-ink) !important;}
.ufuk-detail-page .price,
.ufuk-detail-page .service-summary [style*="color:var(--primary)"]{color:var(--ufuk-blue) !important;}
.ufuk-detail-page .chip{
  border:1px solid rgba(0,74,173,.13) !important;
  background:#f4f8ff !important;
  color:#17335c !important;
}
.ufuk-detail-page .svc-tabs .nav-link.active,
.ufuk-detail-page .nav-tabs .nav-link.active{
  color:var(--ufuk-blue) !important;
  border-color:rgba(0,74,173,.20) !important;
  background:#f4f8ff !important;
}

/* Floating butonları tüm sayfalarda tek standart + belirgin pulse efekti */
.ufuk-fab,
.floating-button{
  position:fixed !important;
  width:58px !important;
  height:58px !important;
  border-radius:50% !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  color:#fff !important;
  text-decoration:none !important;
  z-index:1035 !important;
  box-shadow:
    0 16px 30px rgba(15,23,42,.24),
    0 0 0 1px rgba(255,255,255,.38) inset !important;
  transition:transform .18s ease, box-shadow .18s ease, opacity .18s ease !important;
  animation:ufukFabBreath 2.6s ease-in-out infinite !important;
  transform:translateZ(0);
  isolation:isolate;
}

.ufuk-fab:hover,
.floating-button:hover{
  transform:translateY(-2px) scale(1.06) !important;
  box-shadow:
    0 22px 42px rgba(15,23,42,.30),
    0 0 0 1px rgba(255,255,255,.45) inset !important;
}

.ufuk-fab--wa,
.whatsapp-btn{
  right:18px !important;
  left:auto !important;
  bottom:18px !important;
  background:linear-gradient(135deg,#18b957,#22d66b) !important;
  --ufuk-fab-pulse:rgba(32,199,99,.38);
  --ufuk-fab-ring:rgba(32,199,99,.46);
}

.ufuk-fab--call,
.call-btn{
  left:18px !important;
  right:auto !important;
  bottom:18px !important;
  background:linear-gradient(135deg,var(--ufuk-blue-dark),#1683ff) !important;
  --ufuk-fab-pulse:rgba(0,74,173,.36);
  --ufuk-fab-ring:rgba(0,112,255,.44);
}

.ufuk-fab svg{
  width:27px !important;
  height:27px !important;
  display:block !important;
}

.ufuk-fab__ico{
  width:27px !important;
  height:27px !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  position:relative;
  z-index:2;
}

.ufuk-fab i,
.floating-button i{
  font-size:1.36rem !important;
  line-height:1 !important;
  position:relative;
  z-index:2;
}

/* Ürünler ve LPG Markaları sayfasında belirgin çift halka efekti */
.ufuk-fab::before,
.floating-button::before{
  content:"" !important;
  position:absolute !important;
  inset:-10px !important;
  border-radius:inherit !important;
  background:var(--ufuk-fab-pulse, rgba(0,74,173,.32)) !important;
  opacity:.38 !important;
  z-index:-1 !important;
  animation:ufukFabSoftAura 2.1s ease-in-out infinite !important;
  pointer-events:none !important;
}

.ufuk-fab::after,
.floating-button::after{
  content:"" !important;
  position:absolute !important;
  inset:-13px !important;
  border-radius:inherit !important;
  border:2px solid var(--ufuk-fab-ring, rgba(0,74,173,.38)) !important;
  opacity:0 !important;
  z-index:-2 !important;
  animation:ufukFabPulse 1.85s ease-out infinite !important;
  pointer-events:none !important;
}

@keyframes ufukFabPulse{
  0%   { transform:scale(.78); opacity:0; }
  22%  { opacity:.95; }
  72%  { opacity:.28; }
  100% { transform:scale(1.62); opacity:0; }
}

@keyframes ufukFabSoftAura{
  0%,100% { transform:scale(.92); opacity:.22; }
  50%     { transform:scale(1.14); opacity:.45; }
}

@keyframes ufukFabBreath{
  0%,100% { filter:brightness(1); }
  50%     { filter:brightness(1.08); }
}

/* Hareket azaltma tercihi olan cihazlarda efekt yumuşatılır */
@media (prefers-reduced-motion: reduce){
  .ufuk-fab,
  .floating-button,
  .ufuk-fab::before,
  .ufuk-fab::after,
  .floating-button::before,
  .floating-button::after{
    animation:none !important;
  }
}

/* offcanvas açıkken FAB görünmesin */
body.ufuk-offcanvas-open .ufuk-fab,
body.ufuk-menu-open .ufuk-fab,
body.ufuk-offcanvas-open .floating-button,
body.ufuk-menu-open .floating-button{
  opacity:0 !important;
  pointer-events:none !important;
}

@media (min-width:1200px){
  .ufuk-catalog-page .products-grid .product-col,
  .ufuk-catalog-page .service-grid .service-col{width:25% !important;}
}
@media (max-width:1199.98px) and (min-width:768px){
  .ufuk-catalog-page .products-grid .product-col,
  .ufuk-catalog-page .service-grid .service-col{width:33.333333% !important;}
}
@media (max-width:991.98px){
  .ufuk-catalog-page .catalog-aside-col,
  .ufuk-catalog-page .catalog-main-col{width:100% !important;}
  .ufuk-catalog-page .support-grid{grid-template-columns:1fr !important;}
  .ufuk-catalog-page .aside,
  .ufuk-catalog-page .filter-bar{position:static !important;top:auto !important;}
}
@media (max-width:575.98px){
  .ufuk-catalog-page .products-grid,
  .ufuk-catalog-page .service-grid{--bs-gutter-x:.7rem;--bs-gutter-y:.7rem;}
  .ufuk-catalog-page .imgbox,
  .ufuk-catalog-page .service-thumb{height:145px !important;}
  .ufuk-catalog-page .title,
  .ufuk-catalog-page .service-title{font-size:.84rem !important;min-height:2.5em !important;}
  .ufuk-catalog-page .desc,
  .ufuk-catalog-page .service-desc{font-size:.73rem !important;min-height:2.1em !important;}
  .ufuk-catalog-page .product-card .card-body,
  .ufuk-catalog-page .service-card .card-body{padding:11px !important;}
  .ufuk-catalog-page .product-actions{align-items:flex-start!important;flex-direction:column!important;gap:8px!important;}
  .ufuk-catalog-page .product-actions .btn{width:100%!important;}
}


/* Detay dosyaları için güvenlik: FAB ve footer ortak görünüm */
.ufuk-detail-page .ufuk-fab,
.ufuk-detail-page .floating-button{opacity:1;}
.ufuk-detail-page .ufuk-footer{font-family:"Plus Jakarta Sans",system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif !important;}