﻿@import url('https://fonts.googleapis.com/css2?family=Open+Sans:wght@400;600;700&display=swap');
*{box-sizing:border-box;margin:0;padding:0}
body{font-family:'Open Sans',sans-serif;font-size:14px;color:#333;background:#f5f5f5}
a{color:inherit;text-decoration:none}
a:hover{color:#82ae00}
img{max-width:100%;height:auto}
ul{list-style:none}

/* â”€â”€ SOCIAL BAR â”€â”€ */
#tptnsocial{position:fixed;left:0;top:50%;transform:translateY(-50%);z-index:100;display:flex;flex-direction:column}
#tptnsocial li a{display:flex;align-items:center;justify-content:center;width:36px;height:36px;color:#fff;font-size:16px;transition:.2s}
#tptnsocial li.facebook a{background:#3b5998}
#tptnsocial li.twitter  a{background:#1dcaff}
#tptnsocial li.google   a{background:#dd4b39}
#tptnsocial li.youtube  a{background:#c00}
#tptnsocial li a:hover{width:44px}

/* â”€â”€ WRAPPER â”€â”€ */
#page{max-width:1200px;margin:0 auto;background:#fff}

/* â”€â”€ HEADER â”€â”€ */
#header{background:#fff;border-bottom:1px solid #e0e0e0;position:sticky;top:0;z-index:200;box-shadow:0 2px 6px rgba(0,0,0,.08)}
#header_top{background:#444;color:#fff;font-size:12px;padding:4px 16px;text-align:right}
#header_right{display:flex;align-items:center;flex-wrap:wrap;gap:10px;padding:10px 16px;background:#fff}
#header_logo img{height:52px;width:auto}
#tptnsearch{flex:1;min-width:200px}
#tptnsearch form{display:flex;border:2px solid #82ae00;border-radius:4px;overflow:hidden}
#tptnsearch input.search_query{flex:1;padding:8px 12px;border:none;outline:none;font-size:14px}
#tptnsearch button{background:#82ae00;color:#fff;border:none;padding:8px 14px;cursor:pointer;font-size:16px}
#tptnsearch button:hover{background:#6a9000}
#callphone{color:#333;font-weight:700;white-space:nowrap}
#callphone i{color:#25d366;margin-right:4px}
#shopping_cart a{background:#f65701;color:#fff;border-radius:4px;padding:8px 14px;font-weight:700;display:flex;align-items:center;gap:6px}
#shopping_cart a:hover{background:#d94b00}
#tptn_header_links .login{color:#82ae00;font-weight:600}

/* â”€â”€ TOP MENU â”€â”€ */
#tptntopmenu{background:#444}
#tptntopmenu ul.topmenu{display:flex;padding:0 16px}
#tptntopmenu li a{display:block;padding:10px 16px;color:#fff;font-weight:600;font-size:13px;transition:.2s}
#tptntopmenu li a:hover{background:#82ae00;color:#fff}

/* â”€â”€ TOP CATEG â”€â”€ */
#top-categ{background:#82ae00;padding:10px 16px;cursor:pointer;color:#fff;font-weight:700;font-size:13px}

/* â”€â”€ COLUMNS LAYOUT â”€â”€ */
#columns{display:flex;gap:0;align-items:flex-start}
#left_column{width:220px;flex-shrink:0;background:#fbffed;border-right:1px solid #d3e59a;min-height:600px}
#center_column{flex:1;padding:16px;min-width:0}

/* â”€â”€ SIDEBAR CATEGORIES â”€â”€ */
#categories_block_left{padding:0}
#categories_block_left .tptn-vertical-mega-menu{}
#categories_block_left ul.menu{padding:0}
#categories_block_left ul.menu > li > a{
  display:block;padding:10px 14px;font-weight:600;font-size:13px;
  border-bottom:1px solid #d3e59a;color:#444;transition:.15s;
  background:#fbffed
}
#categories_block_left ul.menu > li > a:hover,
#categories_block_left ul.menu > li:hover > a{background:#82ae00;color:#fff}
#categories_block_left ul.menu > li > ul{display:none;background:#fff;border-bottom:1px solid #d3e59a}
#categories_block_left ul.menu > li:hover > ul{display:block}
#categories_block_left ul.menu > li > ul > li > a{
  display:block;padding:7px 20px;font-size:12px;color:#555;
  border-bottom:1px solid #eee;transition:.15s
}
#categories_block_left ul.menu > li > ul > li > a:hover{color:#82ae00;padding-left:26px}

/* â”€â”€ BLOG BLOCKS â”€â”€ */
.blogModule{padding:12px;border-top:2px solid #82ae00;margin-top:8px}
.blogModule .title_block{font-size:13px;font-weight:700;color:#82ae00;margin-bottom:8px}
.blogModule ul li a{display:block;padding:5px 0;font-size:12px;color:#555;border-bottom:1px solid #eee}
.blogModule ul li a:hover{color:#82ae00}
#smartblogsearch form{display:flex;margin-top:6px}
#smartblogsearch input{flex:1;padding:6px;border:1px solid #d3e59a;border-radius:3px 0 0 3px;font-size:12px}
#smartblogsearch button{background:#82ae00;color:#fff;border:none;padding:6px 10px;border-radius:0 3px 3px 0;cursor:pointer}

/* â”€â”€ HERO SLIDER â”€â”€ */
#tptnhomeslider{margin-bottom:16px;border-radius:6px;overflow:hidden}
#tptnhomeslider img{width:100%;display:block;max-height:360px;object-fit:cover}

/* â”€â”€ SUBBANNER â”€â”€ */
#subbanner{margin-bottom:16px}
#subbanner ul{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
#subbanner ul li img{width:100%;border-radius:4px;display:block;transition:.2s}
#subbanner ul li img:hover{opacity:.88;transform:scale(1.02)}

/* â”€â”€ EDITORIAL â”€â”€ */
#editorial_block_center{background:#f0f7e0;border-left:4px solid #82ae00;padding:14px 16px;border-radius:4px;margin-bottom:20px}
#editorial_block_center h1{font-size:18px;font-weight:700;color:#444;margin-bottom:6px}
#editorial_block_center h2{font-size:13px;font-weight:600;color:#82ae00;margin-bottom:8px}
#editorial_block_center .rte p{font-size:13px;color:#555;line-height:1.6;margin-bottom:6px}

/* â”€â”€ PRODUCT CAROUSEL â”€â”€ */
.tptncarousel{margin-bottom:28px}
.tptncarousel h4{font-size:16px;font-weight:700;color:#444;padding:10px 0;border-bottom:2px solid #82ae00;margin-bottom:14px}
.prodlist{display:grid;grid-template-columns:repeat(auto-fill,minmax(145px,1fr));gap:14px}

/* â”€â”€ PRODUCT CARD â”€â”€ */
.ajax_block_product.item{
  background:#fff;border:1px solid #e0e0e0;border-radius:6px;
  padding:12px;text-align:center;transition:.2s;
  display:flex;flex-direction:column;gap:6px
}
.ajax_block_product.item:hover{box-shadow:0 4px 16px rgba(130,174,0,.18);border-color:#82ae00;transform:translateY(-2px)}
.ajax_block_product.item img{width:124px;height:124px;object-fit:contain;margin:0 auto;display:block}
.ajax_block_product.item h5 a{font-size:12px;font-weight:700;color:#333;line-height:1.3}
.ajax_block_product.item h5 a:hover{color:#82ae00}
.product_desc{font-size:11px;color:#888}
.price-content .price{font-size:14px;font-weight:700;color:#f65701}
.ajax_block_product.item > div:last-child{display:flex;gap:6px;justify-content:center;margin-top:4px}
a.button.ajax_add_to_cart_button,a.exclusive{
  background:#82ae00;color:#fff;border:none;border-radius:4px;
  padding:6px 10px;font-size:12px;cursor:pointer;transition:.2s;display:inline-flex;align-items:center;gap:4px
}
a.button.ajax_add_to_cart_button:hover{background:#6a9000}
a.button.lnk_view{background:#777;color:#fff;border-radius:4px;padding:6px 10px;font-size:12px;transition:.2s;display:inline-flex;align-items:center}
a.button.lnk_view:hover{background:#555}
span.exclusive i{color:#ccc;font-size:13px}

/* â”€â”€ FOOTER â”€â”€ */
footer#footer{background:#333;color:#ccc;margin-top:24px}
.footer_top{padding:30px 20px}
.footer_top .row{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:24px}
footer .block .title_block,footer .block span.title_block{
  display:block;color:#fff;font-size:14px;font-weight:700;
  border-bottom:2px solid #82ae00;padding-bottom:8px;margin-bottom:12px
}
footer .block ul li{padding:5px 0;border-bottom:1px solid #444;font-size:13px}
footer .block ul li a{color:#bbb;transition:.2s}
footer .block ul li a:hover{color:#82ae00}
footer .block ul li:last-child{border:none}
#tptncontact li{font-size:13px;padding:5px 0}
#newsletter_block_footer input.inputNew{padding:7px 10px;border-radius:4px 0 0 4px;border:none;width:150px;font-size:13px}
#newsletter_block_footer input.button_mini{background:#82ae00;color:#fff;border:none;padding:7px 12px;border-radius:0 4px 4px 0;cursor:pointer;font-size:13px}
#newsletter_block_footer input.button_mini:hover{background:#6a9000}
.footer_bottom{background:#222;padding:12px 20px;text-align:center;font-size:12px;color:#777}

/* â”€â”€ CART BLOCK â”€â”€ */
#cart_block{background:#fff;border:1px solid #d3e59a;border-radius:4px;margin:10px}
#cart_block h4{background:#82ae00;color:#fff;padding:8px 12px;font-size:13px;display:flex;justify-content:space-between}
#cart_block .block_content{padding:10px 12px;font-size:13px;color:#555}
#cart_block .price{font-weight:700;color:#f65701}
#cart-buttons a{display:block;background:#f65701;color:#fff;text-align:center;padding:8px;border-radius:4px;margin-top:8px;font-weight:600}
#cart-buttons a:hover{background:#d94b00}

/* â”€â”€ CART LAYER POP â”€â”€ */
#layer_cart{display:none;position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);z-index:9999;background:#fff;border-radius:8px;box-shadow:0 8px 40px rgba(0,0,0,.3);padding:24px;max-width:600px;width:90%}
.layer_cart_overlay{display:none;position:fixed;inset:0;background:rgba(0,0,0,.5);z-index:9998}

/* â”€â”€ MOBILE â”€â”€ */
#tptnmobilemenu{display:none}
@media(max-width:768px){
  #columns{flex-direction:column}
  #left_column{width:100%;border-right:none;border-bottom:1px solid #d3e59a}
  #tptnmobilemenu{display:block;padding:10px 16px;background:#fbffed;border-bottom:1px solid #d3e59a}
  .mobilemenu{display:none;background:#fff;border:1px solid #d3e59a;border-radius:4px;margin-top:8px}
  .mobilemenu.open{display:block}
  .mobilemenu li a{display:block;padding:8px 14px;font-size:13px;border-bottom:1px solid #eee}
  .mobilemenu li a:hover{color:#82ae00}
  .mobilemenu li ul{padding-left:14px;background:#f9f9f9}
  .blockresp-title{background:#82ae00;color:#fff;padding:8px 14px;font-weight:700;font-size:13px}
  .tglr{cursor:pointer}
  #subbanner ul{grid-template-columns:1fr}
  .prodlist{grid-template-columns:repeat(2,1fr)}
  #tptnsocial{display:none}
  #header_right{flex-wrap:wrap}
}
@media(max-width:480px){
  .prodlist{grid-template-columns:1fr 1fr}
}
/* â”€â”€ HIDE WM TOOLBAR â”€â”€ */
#wm-ipp-base,#wm-ipp-print{display:none!important}

/* ── PERFORMANCE OPTIMIZATIONS ── */
img { content-visibility: auto; }
*  { -webkit-font-smoothing: antialiased; }

/* Skeleton loader for missing images */
img[src$=".svg"].placeholder {
  background: linear-gradient(90deg,#f0f7e0 25%,#e8f5c0 50%,#f0f7e0 75%);
  background-size: 200% 100%;
  animation: shimmer 1.5s infinite;
}
@keyframes shimmer { 0%{background-position:200% 0} 100%{background-position:-200% 0} }

/* Smooth page transitions */
.ajax_block_product.item { will-change: transform; }

/* Prevent layout shift for images */
.ajax_block_product.item img { aspect-ratio: 1; object-fit: contain; }
#tptnhomeslider img { aspect-ratio: 16/6; }
