/* استایل‌های فشرده‌شده شورت‌کد تب‌های شگفت‌انگیز محصولات تخفیف‌دار (طرح دیجی‌کالا) - برای وردپرس/ووکامرس */
:root{--az-blue:#0071e3;--az-light-blue:#eef6ff}.az-dg-container{direction:rtl;background-color:var(--az-blue);padding:15px;border-radius:12px;display:flex;gap:12px;align-items:stretch;position:relative;margin:20px 0;font-family:inherit}.az-dg-sidebar{flex:0 0 160px;display:flex;flex-direction:column;align-items:center;justify-content:center;color:#fff;text-align:center}.az-dg-sidebar .title{font-size:18px;font-weight:800;margin-bottom:12px;line-height:1.4}.az-dg-view-all{background:rgba(255,255,255,.2);color:#fff;padding:8px 16px;border-radius:8px;text-decoration:none!important;font-size:12px;margin-top:15px;border:1px solid rgba(255,255,255,.4);transition:.3s}.az-dg-view-all:hover{background:#fff;color:var(--az-blue)}.az-countdown{display:flex;gap:4px;direction:ltr;align-items:center}.az-countdown span{background:#fff;color:#333;padding:3px 6px;border-radius:4px;font-weight:bold;min-width:28px;font-size:13px;display:inline-block}.az-countdown b{color:#fff;font-size:14px}.az-dg-main{flex:1;min-width:0}.az-dg-panel{display:none}.az-dg-panel.active{display:block}.az-dg-panel .product{background:#fff!important;border-radius:10px!important;padding:10px!important;height:100%;border:none!important;transition:.3s}.az-dg-panel .product:hover{transform:translateY(-3px)}.az-dg-container .product-title,.az-dg-container h3.wd-entities-title{font-size:13px!important;line-height:1.6!important;height:42px;overflow:hidden;margin-top:10px!important;font-weight:500!important}.az-dg-container .price{font-size:14px!important;font-weight:700!important;color:#333!important}.az-dg-container .price del{font-size:11px!important;opacity:.5}.az-dg-container .price ins{text-decoration:none;color:var(--az-blue)!important}.az-dg-tabs-row{display:flex;gap:10px;margin-bottom:8px;overflow-x:auto;scrollbar-width:none;-ms-overflow-style:none}.az-dg-tabs-row::-webkit-scrollbar{display:none}.az-dg-tab-btn{background:none;border:none;color:#555;padding:6px 12px;cursor:pointer;font-size:13px;white-space:nowrap;font-family:inherit;border-radius:20px;transition:.3s}.az-dg-tab-btn.active{background:var(--az-blue);color:#fff;font-weight:bold}@media (max-width:768px){.az-dg-container{flex-direction:column;padding:10px;gap:8px}.az-dg-sidebar{flex-direction:row;justify-content:space-between;width:100%;flex:none;padding:5px;align-items:center}.az-dg-sidebar .title{font-size:15px;margin:0}.az-dg-view-all{display:none}.az-mobile-header-link{display:inline-block!important;color:#fff;text-decoration:none;font-size:11px}.az-dg-container .product-title,.az-dg-container h3.wd-entities-title{font-size:11px!important;height:38px}.az-dg-container .price{font-size:12px!important}.az-countdown span{font-size:11px;min-width:22px;padding:2px 4px}}




 * این کد استایل دسته‌بندی‌های دایره‌ای شبیه دیجی‌کالا و اسلایدر Swiper.js را برای شورت‌کد [dk_circular_categories] فراهم می‌کند
 */
/* Outer container for the slider */
.dk-cats-outer{position:relative;width:100%;margin-bottom:16px;/* Add some spacing below the slider */}
/* Swiper container itself */
.dk-cats-outer .swiper{width:100%;padding:8px 0;/* Vertical padding for spacing */position:relative;overflow:hidden;/* Ensure no overflow issues */}
/* Individual category item link */
.dk-cat-item{display:flex;flex-direction:column;align-items:center;gap:10px;/* Space between image ring and title */text-decoration:none;transition:opacity 0.2s ease;/* Smooth hover effect */}
/* Hover effect for category items */
.dk-cat-item:hover{opacity:0.85;/* Slight fade on hover */}
/* The ring around the circular image */
.dk-cat-img-ring{width:128px;height:128px;border-radius:50%;background:linear-gradient(45deg,#1a73e8,#4285f4);/* Example gradient */padding:3px;/* Padding for the inner white circle */display:flex;align-items:center;justify-content:center;box-shadow:0 4px 12px rgba(0,0,0,0.1);/* Subtle shadow */}
/* Inner container for the image, creating the white background effect */
.dk-cat-img-inner{width:100%;height:100%;border-radius:50%;background:#fff;/* White background */display:flex;align-items:center;justify-content:center;overflow:hidden;/* Keep image within the circle */transition:transform .2s ease-in-out;/* Smooth scaling effect */}
/* The actual category image */
.dk-cat-img-inner img{width:90%;/* Image takes 90% of inner container */height:90%;object-fit:contain;/* Ensure image is contained and aspect-ratio is preserved */border-radius:50%;/* Make sure image itself is circular */}
/* Hover effect on the inner image container */
.dk-cat-item:hover .dk-cat-img-inner{transform:scale(0.94);/* Slightly shrink the image on hover */}
/* Category title styling */
.dk-cat-title{font-size:13px;color:#222;/* Dark text color */text-align:center;font-weight:600;padding:0 5px;/* Add slight padding to titles */}
/* Swiper Navigation Arrows (positioned inside) */
.dk-swiper-btn{position:absolute;top:50%;transform:translateY(-60%);/* Vertically center the button */width:36px;height:36px;border-radius:50%;background:#fff;/* White background */box-shadow:0 2px 8px rgba(0,0,0,.18);/* Shadow for depth */display:flex;align-items:center;justify-content:center;cursor:pointer;z-index:10;/* Ensure buttons are above slider content */transition:box-shadow 0.2s ease;}
.dk-swiper-btn:hover{box-shadow:0 4px 16px rgba(0,0,0,.25);/* Deeper shadow on hover */}
/* SVG icon inside the button */
.dk-swiper-btn svg{width:20px;height:20px;stroke:#333;/* Dark gray stroke */stroke-width:2;fill:none;/* No fill */}
/* Arrow positioning: RTL requires specific placement */
/* Right arrow (Next) */
.dk-cats-outer .dk-swiper-prev{/* In RTL, 'prev' button moves left */right:4px;}
/* Left arrow (Prev) */
.dk-cats-outer .dk-swiper-next{/* In RTL, 'next' button moves right */left:4px;}
/* Responsive Adjustments for smaller screens */
@media (max-width: 768px){/* Hide navigation buttons on smaller screens if they overlap or are not needed */.dk-swiper-btn{display:none;}/* Adjust size for smaller screens */.dk-cat-img-ring{width:86px;height:86px;}.dk-cat-title{font-size:11px;/* Smaller font for titles */font-weight:500;}/* Adjust Swiper padding on smaller screens */.dk-cats-outer .swiper{padding:8px 12px;/* Add horizontal padding to avoid edge cutoff */}}