@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&display=swap');

/* =====================================================================
   MODERN 2026 TASARIM KATMANI
   Yalnizca gorsel: renk, tipografi, buton, kart, golge, hover.
   Yapi / duzen / PHP / icerik DEGISMEZ. Bu dosya en son yuklenir.
   ===================================================================== */

:root{
  --m-primary:#3f6076;
  --m-primary-2:#5a7e94;
  --m-primary-dark:#2f4a5c;
  --m-accent:#5a9b95;
  --m-ink:#2b3744;
  --m-muted:#6b7785;
  --m-bg:#f5f6f8;
  --m-surface:#ffffff;
  --m-border:#e7eaee;
  --m-radius:16px;
  --m-radius-sm:12px;
  --m-radius-pill:999px;
  --m-shadow-sm:0 2px 10px rgba(43,55,68,.05);
  --m-shadow:0 10px 28px rgba(43,55,68,.07);
  --m-shadow-lg:0 16px 36px rgba(63,96,118,.14);
  --m-grad:linear-gradient(135deg,#3f6076 0%,#557588 100%);
}

/* ---------- Temel tipografi & zemin ---------- */
body{
  font-family:'Inter',"Titillium Web",sans-serif !important;
  color:var(--m-ink);
  background:linear-gradient(180deg,#eef1f4 0%,#f5f6f8 300px) no-repeat var(--m-bg) !important;
  background-attachment:fixed !important;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
  letter-spacing:0;
}
h1,h2,h3,h4,h5,h6,
.section__heading--maintitle,.li-section-title,.product__details--info__title{
  font-family:'Inter',"Titillium Web",sans-serif !important;
  color:var(--m-ink);
  letter-spacing:-.2px;
  font-weight:700;
}
a{ transition:color .25s ease, opacity .25s ease; }
::selection{ background:var(--m-primary); color:#fff; }
html{ scroll-behavior:smooth; }

/* ince modern scrollbar */
*{ scrollbar-width:thin; scrollbar-color:var(--m-primary-2) transparent; }
*::-webkit-scrollbar{ width:10px; height:10px; }
*::-webkit-scrollbar-thumb{ background:var(--m-primary-2); border-radius:999px; border:3px solid var(--m-bg); }

/* ---------- Header ---------- */
.header-middle{ background:var(--m-surface) !important; }
/* Menu cubugu: beyaz DEGIL, modern gradyan (beyaz yazilar gorunur kalsin) */
.header-bottom{
  background:var(--m-grad) !important;
  box-shadow:0 6px 22px rgba(63,96,118,.14) !important;
  border-radius:0 0 var(--m-radius) var(--m-radius);
}
.header-sticky.sticky,.header-sticky.is-sticky{
  background:var(--m-grad) !important;
  box-shadow:0 6px 20px rgba(63,96,118,.22) !important;
  border-radius:0 0 var(--m-radius) var(--m-radius);
}
/* arama kutusu -> pill */
.hm-searchbox{
  border:1px solid var(--m-border) !important;
  border-radius:var(--m-radius-pill) !important;
  overflow:hidden;
  background:var(--m-surface);
  box-shadow:var(--m-shadow-sm);
  transition:box-shadow .25s ease,border-color .25s ease;
}
.hm-searchbox:focus-within{ border-color:var(--m-primary-2) !important; box-shadow:0 0 0 4px rgba(90,126,148,.18); }
.hm-searchbox input{ background:transparent !important; border:0 !important; }
.hm-searchbox .li-btn,.hm-searchbox button{
  background:var(--m-grad) !important; color:#fff !important;
  border-radius:var(--m-radius-pill) !important; margin:4px !important;
}

/* menu linkleri - animasyonlu alt cizgi */
/* menu linkleri - beyaz kalir, hover'da beyaz alt cizgi */
.hb-menu-2 nav>ul>li>a,.hb-menu nav>ul>li>a{ color:#fff !important; }
.hb-menu>nav>ul>li>a,.main-menu nav ul li a,.hb-menu ul li a{
  position:relative; font-weight:600; transition:opacity .25s ease;
}
.hb-menu>nav>ul>li>a:after,.main-menu nav ul li a:after{
  content:""; position:absolute; left:0; bottom:-2px; height:2px; width:0;
  background:#fff; border-radius:2px; transition:width .3s ease;
}
.hb-menu nav>ul>li:hover>a,.hb-menu nav>ul>li:hover>a::after{ color:#fff !important; opacity:.9; }
.hb-menu>nav>ul>li:hover>a:after,.main-menu nav ul li:hover>a:after{ width:100%; }
/* acilan alt menu beyaz zemin, koyu yazi */
.hb-menu nav ul>li>ul.hb-dropdown{ border-radius:var(--m-radius-sm) !important; box-shadow:var(--m-shadow) !important; border:1px solid var(--m-border); }
.hb-menu nav ul>li>ul.hb-dropdown>li>a{ color:var(--m-ink) !important; }
.hb-menu nav ul>li>ul.hb-dropdown>li>a:hover{ color:var(--m-primary) !important; }

/* ---------- Butonlar ---------- */
.li-btn,.li-btn-2,.li-btn-3,.btn,
button[type="submit"],input[type="submit"]{
  background:var(--m-grad) !important;
  color:#fff !important;
  border:0 !important;
  border-radius:var(--m-radius-pill) !important;
  font-weight:600 !important;
  letter-spacing:.2px;
  box-shadow:0 6px 18px rgba(63,96,118,.18);
  transition:transform .22s ease, box-shadow .22s ease, filter .22s ease !important;
}
.li-btn:hover,.li-btn-2:hover,.li-btn-3:hover,.btn:hover,
button[type="submit"]:hover,input[type="submit"]:hover{
  transform:translateY(-2px);
  box-shadow:var(--m-shadow-lg);
  filter:brightness(1.04);
  color:#fff !important;
}

/* ---------- Kategori menusu (KATEGORILER kutusu) ---------- */
.category-menu .category-heading{
  background:var(--m-grad) !important;
  border-radius:var(--m-radius-sm) var(--m-radius-sm) 0 0 !important;
  box-shadow:0 8px 22px rgba(63,96,118,.16);
}
.category-menu .category-menu-list{
  border:1px solid var(--m-border) !important;
  border-top:0 !important;
  border-radius:0 0 var(--m-radius-sm) var(--m-radius-sm) !important;
  box-shadow:var(--m-shadow-sm);
  overflow:hidden;
}
.category-menu .category-menu-list>ul>li{ transition:background .2s ease; }
.category-menu .category-menu-list>ul>li:hover{ background:#f3f5fd; }
.category-menu .category-menu-list>ul>li:hover>a{ color:var(--m-primary) !important; }

/* ---------- Beyazligi kiran zemin derinligi ---------- */
.slider-with-banner,.product-area,.li-static-banner,.featured-pro-with-banner{
  background:transparent;
}
/* Slider ve banner alanlarina yumusak cerceve */
.single-slide,.slider-active,.li-static-home-image{ border-radius:var(--m-radius); overflow:hidden; }
.section__heading--maintitle,.li-section-title h2,.li-section-title{
  position:relative; font-weight:800 !important;
}
.section__heading{ text-align:center; }
.section__heading--maintitle:after{
  content:""; display:block; width:64px; height:4px; margin:14px auto 0;
  background:var(--m-grad); border-radius:999px;
}

/* ---------- Urun kartlari ---------- */
.single-product-wrap{
  background:var(--m-surface) !important;
  border:1px solid var(--m-border) !important;
  border-radius:var(--m-radius) !important;
  padding:12px !important;
  box-shadow:var(--m-shadow-sm);
  transition:transform .3s cubic-bezier(.2,.7,.2,1), box-shadow .3s ease, border-color .3s ease;
  overflow:hidden;
}
.single-product-wrap:hover{
  transform:translateY(-6px);
  box-shadow:var(--m-shadow);
  border-color:#dfe4f2 !important;
}
.single-product-wrap .product-image{
  border-radius:var(--m-radius-sm); overflow:hidden; background:#f1f4fb;
}
.single-product-wrap .product-image img{
  border-radius:var(--m-radius-sm);
  transition:transform .5s cubic-bezier(.2,.7,.2,1);
}
.single-product-wrap:hover .product-image img{ transform:scale(1.06); }
.product_desc_info h4 a,.product_desc h4 a{
  color:var(--m-ink) !important; font-weight:600; transition:color .25s ease;
}
.single-product-wrap:hover .product_desc_info h4 a{ color:var(--m-primary) !important; }

/* ---------- Breadcrumb ---------- */
.breadcrumb-area{
  background:linear-gradient(135deg,#eef0ff 0%,#eafaff 100%) !important;
  border-radius:0 0 var(--m-radius) var(--m-radius);
  border-bottom:1px solid var(--m-border);
}
.breadcrumb-content ul li.active{ color:var(--m-primary) !important; font-weight:600; }
.breadcrumb-content ul li a{ color:var(--m-muted) !important; }
.breadcrumb-content ul li a:hover{ color:var(--m-primary) !important; }

/* ---------- Kategori SEO tanitim kutusu ---------- */
.kategori-seo-intro{
  background:var(--m-surface);
  border:1px solid var(--m-border);
  border-left:4px solid var(--m-primary);
  border-radius:var(--m-radius);
  padding:22px 26px !important;
  box-shadow:var(--m-shadow-sm);
}
.kategori-seo-intro h1{ color:var(--m-ink); }

/* ---------- Blog kartlari ---------- */
.li-blog-single-item{
  background:var(--m-surface);
  border:1px solid var(--m-border);
  border-radius:var(--m-radius);
  overflow:hidden;
  box-shadow:var(--m-shadow-sm);
  transition:transform .3s ease, box-shadow .3s ease;
}
.li-blog-single-item:hover{ transform:translateY(-6px); box-shadow:var(--m-shadow); }
.li-blog-banner img{
  border-radius:var(--m-radius) var(--m-radius) 0 0;
  transition:transform .5s ease; display:block; width:100%;
}
.li-blog-single-item:hover .li-blog-banner img{ transform:scale(1.04); }
.li-blog-content{ padding:6px 18px 20px; }
.li-blog-heading a{ color:var(--m-ink) !important; font-weight:700; }
.li-blog-single-item:hover .li-blog-heading a{ color:var(--m-primary) !important; }
.read-more{
  display:inline-block; margin-top:6px; color:var(--m-primary) !important;
  font-weight:600; transition:gap .2s ease;
}
.li-blog-details-page .li-blog-content{ font-size:16px; line-height:1.8; color:#334155; }
.li-blog-details-page .li-blog-content h2{ margin:26px 0 10px; font-size:21px; }
.li-recent-post{ border-radius:var(--m-radius-sm); transition:background .25s ease; padding:8px; }
.li-recent-post:hover{ background:#f3f5fd; }
.li-recent-post-des a{ color:var(--m-ink) !important; font-weight:600; }

/* ---------- Formlar / inputlar ---------- */
input[type="text"],input[type="email"],input[type="password"],
input[type="search"],textarea,select{
  border:1px solid var(--m-border) !important;
  border-radius:var(--m-radius-sm) !important;
  transition:border-color .2s ease, box-shadow .2s ease !important;
}
input[type="text"]:focus,input[type="email"]:focus,
input[type="password"]:focus,textarea:focus,select:focus{
  border-color:var(--m-primary-2) !important;
  box-shadow:0 0 0 4px rgba(90,126,148,.18) !important;
  outline:0 !important;
}

/* ---------- Shipping / ozellik kutulari ---------- */
.li-shipping-inner-box{
  background:var(--m-surface);
  border:1px solid var(--m-border);
  border-radius:var(--m-radius);
  padding:22px !important;
  box-shadow:var(--m-shadow-sm);
  transition:transform .3s ease, box-shadow .3s ease;
}
.li-shipping-inner-box:hover{ transform:translateY(-4px); box-shadow:var(--m-shadow); }
.li-shipping-inner-box .shipping-icon img{ transition:transform .3s ease; }
.li-shipping-inner-box:hover .shipping-icon img{ transform:scale(1.1) rotate(-4deg); }

/* ---------- Footer ---------- */
.footer,.footer-static-middle,.footer-static-bottom,.footer-static-top{
  background:#0f172a !important; color:#cbd5e1;
}
.footer a,.footer p,.footer li,.footer span{ color:#cbd5e1 !important; }
.footer-block-title,.footer h2,.footer h3,.footer h4{ color:#fff !important; font-weight:700; }
.footer a:hover{ color:#a5b4fc !important; }
.footer .social-link a{
  display:inline-flex; align-items:center; justify-content:center;
  width:40px; height:40px; border-radius:50%;
  background:rgba(255,255,255,.08); color:#fff !important; margin:3px;
  transition:transform .25s ease, background .25s ease;
}
.footer .social-link a:hover{ background:var(--m-grad); transform:translateY(-3px); }
.copyright,.footer-static-bottom .copyright{ color:#94a3b8 !important; }

/* ---------- Urun detay ---------- */
.product__details--info__title{ font-weight:800 !important; letter-spacing:-.5px; }
.product__details--info__desc{ color:#475569; line-height:1.8; }
.urunGaleri-main-img{ border-radius:var(--m-radius) !important; border:1px solid var(--m-border); }

/* ---------- Nice-select / dropdown yumusatma ---------- */
.nice-select{ border-radius:var(--m-radius-sm) !important; border:1px solid var(--m-border) !important; }
.nice-select:hover{ border-color:var(--m-primary-2) !important; }

/* ---------- Genel kart yuvarlatma & gecisler ---------- */
.li-static-banner img,.li-banner- img,.li-static-home img{ border-radius:var(--m-radius); }
img{ image-rendering:auto; }

/* scrollUp butonu */
#scrollUp{
  background:var(--m-grad) !important; color:#fff !important;
  border-radius:14px !important; box-shadow:var(--m-shadow-lg);
  border:0 !important;
}

/* WhatsApp siparis gorseli yumusak hover */
img[src*="whatsapp"]{ transition:transform .25s ease; border-radius:10px; }
img[src*="whatsapp"]:hover{ transform:scale(1.04); }
