/*
Theme Name: Template Ka Bazaar
Theme URI: https://buzzcomments.com
Author: Template Ka Bazaar
Description: A clean digital marketplace theme for selling PowerPoint & presentation templates, fully compatible with Easy Digital Downloads.
Version: 1.0.0
License: GNU General Public License v2 or later
Text Domain: tkb
*/

/* =============================================
   CSS VARIABLES — Dark Gray / White Premium Palette
============================================= */
:root {
  --blue: #374151;
  --blue-dark: #111827;
  --blue-light: #4b5563;
  --blue-nav: #1f2937;
  --orange: #374151;
  --orange-light: #4b5563;
  --white: #ffffff;
  --gray-50: #f9fafb;
  --gray-100: #f3f4f6;
  --gray-200: #e5e7eb;
  --gray-300: #d1d5db;
  --gray-500: #9ca3af;
  --gray-700: #6b7280;
  --gray-900: #111827;
  --text: #1f2937;
  --text-light: #6b7280;
  --border: #e5e7eb;
  --shadow: 0 1px 6px rgba(0,0,0,0.07);
  --shadow-hover: 0 8px 24px rgba(0,0,0,0.13);
  --radius: 8px;
  --font: 'Inter', 'Segoe UI', sans-serif;
}

/* =============================================
   RESET & BASE
============================================= */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; }
body {
  font-family: var(--font);
  color: var(--text);
  background: var(--white);
  font-size: 15px;
  line-height: 1.6;
}
a { text-decoration: none; color: inherit; }
img { max-width: 100%; height: auto; display: block; }
ul { list-style: none; }
input, button, select { font-family: inherit; }

/* =============================================
   HEADER / TOP BAR
============================================= */
.tkb-topbar {
  background: var(--blue-dark);
  color: rgba(255,255,255,0.85);
  font-size: 12px;
  padding: 6px 0;
  text-align: center;
}
.tkb-header {
  background: #111827;
  position: sticky;
  top: 0;
  z-index: 999;
  box-shadow: 0 2px 12px rgba(0,0,0,0.35);
  border-bottom: 1px solid rgba(255,255,255,0.06);
}
.tkb-header-inner {
  max-width: 1280px;
  margin: 0 auto;
  padding: 0 20px;
  display: flex;
  align-items: center;
  gap: 20px;
  height: 64px;
}
.tkb-logo {
  display: flex;
  align-items: center;
  gap: 10px;
  color: var(--white);
  font-size: 22px;
  font-weight: 700;
  letter-spacing: -0.5px;
  white-space: nowrap;
}
.tkb-logo span {
  background: var(--orange);
  color: white;
  padding: 2px 8px;
  border-radius: 4px;
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 0;
}
.tkb-search-wrap {
  flex: 1;
  max-width: 520px;
  display: flex;
}
.tkb-search-wrap input {
  flex: 1;
  padding: 10px 16px;
  border: none;
  border-radius: 6px 0 0 6px;
  font-size: 14px;
  outline: none;
  background: white;
  color: var(--text);
}
.tkb-search-wrap input::placeholder { color: #aaa; }
.tkb-search-wrap button { background: #374151; border: none; padding: 10px 18px; border-radius: 0 6px 6px 0; cursor: pointer; color: white; font-size: 16px; transition: background 0.2s; }
.tkb-search-wrap button:hover { background: #1f2937; }
.tkb-header-actions {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-left: auto;
}
.tkb-header-actions a {
  color: rgba(255,255,255,0.9);
  font-size: 14px;
  font-weight: 500;
  padding: 6px 12px;
  border-radius: 5px;
  transition: background 0.2s;
}
.tkb-header-actions a:hover { background: rgba(255,255,255,0.08); }
.tkb-header-actions .btn-upgrade {
  background: white;
  color: #111827;
  border-radius: 6px;
  font-weight: 700;
}
.tkb-header-actions .btn-upgrade:hover {  }

/* NAV */
.tkb-nav { display: none !important; } .tkb-nav-DISABLED {
  background: #1f2937;
  border-top: 1px solid rgba(255,255,255,0.06);
}
.tkb-nav-inner {
  max-width: 1280px;
  margin: 0 auto;
  padding: 0 20px;
  display: flex;
  gap: 0;
}
.tkb-nav a {
  color: rgba(255,255,255,0.9);
  font-size: 13px;
  font-weight: 500;
  padding: 12px 18px;
  display: block;
  text-transform: uppercase;
  letter-spacing: 0.3px;
  transition: background 0.2s;
}
.tkb-nav a:hover, .tkb-nav a.active {
  background: rgba(255,255,255,0.08);
  color: white;
}

/* =============================================
   BREADCRUMB
============================================= */
.tkb-breadcrumb {
  background: var(--gray-100);
  border-bottom: 1px solid var(--border);
  padding: 10px 0;
}
.tkb-breadcrumb-inner {
  max-width: 1280px;
  margin: 0 auto;
  padding: 0 20px;
  display: flex;
  gap: 6px;
  align-items: center;
  font-size: 13px;
  color: var(--gray-700);
}
.tkb-breadcrumb a { color: var(--blue); }
.tkb-breadcrumb a:hover { text-decoration: underline; }
.tkb-breadcrumb .sep { color: var(--gray-500); }
.tkb-breadcrumb .current { color: var(--blue); font-weight: 500; }

/* =============================================
   CONTAINER
============================================= */
.tkb-container {
  max-width: 1280px;
  margin: 0 auto;
  padding: 0 20px;
}

/* =============================================
   HERO SECTION
============================================= */
.tkb-hero {
  background: linear-gradient(160deg, #111827 0%, #1f2937 60%, #374151 100%);
  padding: 60px 20px;
  text-align: center;
  color: white;
  position: relative;
  overflow: hidden;
}
.tkb-hero::before {
  content: '';
  position: absolute;
  inset: 0;
  background: url("data:image/svg+xml,%3Csvg width='60' height='60' viewBox='0 0 60 60' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' fill-rule='evenodd'%3E%3Cg fill='%23ffffff' fill-opacity='0.025'%3E%3Ccircle cx='30' cy='30' r='2'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
}
.tkb-hero-content { position: relative; z-index: 1; }
.tkb-hero h1 {
  font-size: 36px;
  font-weight: 800;
  margin-bottom: 12px;
  line-height: 1.2;
}
.tkb-hero p {
  font-size: 17px;
  opacity: 0.9;
  margin-bottom: 28px;
  max-width: 600px;
  margin-left: auto;
  margin-right: auto;
}
.tkb-hero-search {
  display: flex;
  max-width: 60%!important;
  margin: 0 auto 24px; 
  background: white;
  border-radius: 8px;
  overflow: hidden;
  box-shadow: 0 4px 20px rgba(0,0,0,0.2);
}
.tkb-hero-search input {
  flex: 1;
  padding: 14px 20px;
  border: none;
  font-size: 15px;
  outline: none;
  color: var(--text);
}
.tkb-hero-search button {
  background: #374151;
  border: none;
  padding: 14px 24px;
  cursor: pointer;
  color: white;
  font-size: 15px;
  font-weight: 600;
  transition: background 0.2s;
}
.tkb-hero-search button:hover { background: #1f2937; }
.tkb-hero-tags {
  display: flex;
  gap: 8px;
  justify-content: center;
  flex-wrap: wrap;
}
.tkb-hero-tags a {
  background: rgba(255,255,255,0.08);
  color: rgba(255,255,255,0.8);
  padding: 5px 14px;
  border-radius: 20px;
  font-size: 13px;
  border: 1px solid rgba(255,255,255,0.15);
  transition: background 0.2s;
}
.tkb-hero-tags a:hover { background: rgba(255,255,255,0.15); }

/* =============================================
   CATEGORY CHIPS
============================================= */
.tkb-categories-bar {
  background: white;
  border-bottom: 2px solid var(--border);
  padding: 16px 0;
}
.tkb-categories-bar-inner {
  max-width: 1280px;
  margin: 0 auto;
  padding: 0 20px;
  display: flex;
  gap: 10px;
  overflow-x: auto;
  scrollbar-width: none;
}
.tkb-categories-bar-inner::-webkit-scrollbar { display: none; }
.tkb-cat-chip {
  flex-shrink: 0;
  padding: 7px 16px;
  border-radius: 20px;
  border: 1.5px solid var(--border);
  font-size: 13px;
  color: var(--gray-700);
  cursor: pointer;
  transition: all 0.2s;
  white-space: nowrap;
  background: white;
}
.tkb-cat-chip:hover, .tkb-cat-chip.active {
  border-color: #374151;
  background: #374151;
  color: white;
}

/* =============================================
   SECTION TITLE
============================================= */
.tkb-section-title {
  font-size: 26px;
  font-weight: 700;
  color: var(--gray-900);
  margin-bottom: 4px;
}
.tkb-section-sub {
  font-size: 14px;
  color: var(--text-light);
  margin-bottom: 24px;
}
.tkb-section-header {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  margin-bottom: 20px;
}
.tkb-section-header .view-all {
  color: var(--blue);
  font-size: 14px;
  font-weight: 500;
}
.tkb-section-header .view-all:hover { text-decoration: underline; }

/* =============================================
   PRODUCT CARD
============================================= */
.tkb-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 20px;
}
.tkb-grid-3 { grid-template-columns: repeat(4, 1fr); }

.tkb-card {
  background: white;
  border: 1.5px solid var(--border);
  border-radius: var(--radius);
  overflow: hidden;
  transition: all 0.25s;
  cursor: pointer;
}
.tkb-card:hover {
  box-shadow: var(--shadow-hover);
  transform: translateY(-3px);
  border-color: var(--blue);
}
/* ═══════════════════════════════════════════════
   SKELETON SHIMMER LOADER
   ═══════════════════════════════════════════════ */
@keyframes tkb-shimmer {
  0%   { background-position: -800px 0; }
  100% { background-position:  800px 0; }
}

/* Shimmer — jab tak tkb-sk-done nahi lagti */
.tkb-card-thumb:not(.tkb-sk-done) {
  background: linear-gradient(90deg, #e0e0e0 0px, #f0f0f0 40px, #e0e0e0 80px) !important;
  background-size: 800px 100% !important;
  animation: tkb-shimmer 1.4s ease-in-out infinite !important;
}

/* Image load hone ke baad — shimmer band */
.tkb-card-thumb.tkb-sk-done {
  background: none !important;
  animation: none !important;
}

/* Base thumb styles */
.tkb-card-thumb {
  position: relative;
  aspect-ratio: 16/9;
  overflow: hidden;
  display: block;
}

/* Image — pehle hidden, load hone par fade-in */
.tkb-card-thumb img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  opacity: 0;
  transition: transform 0.28s ease, opacity 0.3s ease;
  position: relative;
  z-index: 1;
}
.tkb-card-thumb.tkb-sk-done img {
  opacity: 1;
}
.tkb-card:hover .tkb-card-thumb img { transform: scale(1.03); }
.tkb-card-badge { position: absolute; top: 10px; left: 10px; background: #374151; color: white; font-size: 10px; font-weight: 700; padding: 3px 8px; border-radius: 3px; text-transform: uppercase; letter-spacing: 0.5px; }
.tkb-card-badge.free { background: #1f2937; }
.tkb-card-badge.popular { background: #4b5563; }
.tkb-card-info {
  padding: 10px 12px 12px;
}
.tkb-card-title {
  font-size: 13px;
  font-weight: 700;
  color: var(--gray-900);
  margin-bottom: 3px;
  line-height: 1.35;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.tkb-card-meta {
  display: none;
  align-items: center;
  justify-content: space-between;
  margin-top: 8px;
}
.tkb-card-cat {
  font-size: 11px;
  color: var(--text-light);
  display: flex;
  align-items: center;
  gap: 4px;
}
.tkb-card-cat svg { width: 12px; height: 12px; }
.tkb-card-price {
  font-size: 14px;
  font-weight: 700;
  color: #111827;
}
.tkb-card-price.free-price { color: #4b5563; }
.tkb-card-rating {
  display: flex;
  align-items: center;
  gap: 4px;
  font-size: 12px;
  color: var(--gray-700);
  margin-top: 6px;
}
.tkb-card-rating .stars { color: #9ca3af; font-size: 11px; }

/* =============================================
   FEATURED SECTION
============================================= */
.tkb-section {
  padding: 40px 0;
}
.tkb-section.bg-gray { background: var(--gray-50); }

/* =============================================
   STATS BAR
============================================= */
.tkb-stats {
  background: #111827;
  padding: 30px 0;
  color: white;
}
.tkb-stats-inner {
  max-width: 1280px;
  margin: 0 auto;
  padding: 0 20px;
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 20px;
  text-align: center;
}
.tkb-stat-num {
  font-size: 32px;
  font-weight: 800;
  color: #ffffff;
}
.tkb-stat-label {
    color:#bbb!important;
  font-size: 13px;
  opacity: 1;
  margin-top: 4px;
}

/* =============================================
   ARCHIVE / LISTING PAGE
============================================= */
.tkb-archive-wrap {
  max-width: 1280px;
  margin: 0 auto;
  padding: 30px 20px;
  display: block;
}
/* Sidebar */
.tkb-sidebar {
  background: white;
  border: 1.5px solid var(--border);
  border-radius: var(--radius);
  overflow: hidden;
}
.tkb-sidebar-section {
  border-bottom: 1px solid var(--border);
  padding: 16px 18px;
}
.tkb-sidebar-section:last-child { border-bottom: none; }
.tkb-sidebar-title {
  font-size: 13px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  color: var(--gray-900);
  margin-bottom: 12px;
}
.tkb-sidebar-section ul li {
  margin-bottom: 8px;
}
.tkb-sidebar-section ul li a {
  font-size: 13px;
  color: var(--gray-700);
  display: flex;
  justify-content: space-between;
  transition: color 0.2s;
}
.tkb-sidebar-section ul li a:hover { color: var(--blue); }
.tkb-sidebar-section ul li a span {
  background: var(--gray-100);
  padding: 1px 7px;
  border-radius: 10px;
  font-size: 11px;
  color: var(--gray-500);
}
.tkb-sidebar-section ul li a.active-cat {
  color: var(--blue);
  font-weight: 600;
}
/* Price filter */
.tkb-price-options label {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 13px;
  color: var(--gray-700);
  margin-bottom: 8px;
  cursor: pointer;
}
.tkb-price-options input[type="checkbox"] { accent-color: var(--blue); }
/* Sort bar */
.tkb-archive-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 20px;
  padding-bottom: 16px;
  border-bottom: 1.5px solid var(--border);
}
.tkb-archive-count {
  font-size: 14px;
  color: var(--gray-700);
}
.tkb-archive-count strong { color: var(--gray-900); }
.tkb-sort-wrap {
  display: flex;
  align-items: center;
  gap: 10px;
  font-size: 13px;
  color: var(--gray-700);
}
.tkb-sort-wrap select {
  padding: 7px 12px;
  border: 1.5px solid var(--border);
  border-radius: 6px;
  font-size: 13px;
  cursor: pointer;
  outline: none;
  background: white;
}
.tkb-view-toggle {
  display: flex;
  gap: 4px;
}
.tkb-view-btn {
  padding: 7px 10px;
  border: 1.5px solid var(--border);
  background: white;
  border-radius: 5px;
  cursor: pointer;
  color: var(--gray-500);
  transition: all 0.2s;
  font-size: 14px;
}
.tkb-view-btn.active, .tkb-view-btn:hover {
  border-color: #374151;
  color: #111827;
  
}

/* =============================================
   SINGLE PRODUCT PAGE
============================================= */
.tkb-single-wrap {
  max-width: 1280px;
  margin: 0 auto;
  padding: 14px 20px 30px;
  display: grid;
  grid-template-columns: 1fr 320px;
  gap: 28px;
  align-items: start;
}
.tkb-single-title {
  font-size: 20px;
  font-weight: 800;
  color: var(--gray-900);
  margin-bottom: 8px;
  line-height: 1.3;
}
.tkb-product-preview {
  border: 1.5px solid var(--border);
  border-radius: var(--radius);
  overflow: hidden;
  margin-bottom: 16px;
  background: var(--gray-100);
  aspect-ratio: 16/9;
  position: relative;
}
.tkb-product-preview img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.tkb-preview-nav {
  display: flex;
  gap: 8px;
  margin-bottom: 20px;
}
.tkb-preview-thumb {
  width: 80px;
  height: 50px;
  border: 2px solid var(--border);
  border-radius: 5px;
  overflow: hidden;
  cursor: pointer;
  transition: border-color 0.2s;
}
.tkb-preview-thumb.active { border-color: var(--blue); }
.tkb-preview-thumb img { width: 100%; height: 100%; object-fit: cover; }
/* Sidebar purchase box */
.tkb-purchase-box {
  background: white;
  border: 1.5px solid var(--border);
  border-radius: var(--radius);
  overflow: hidden;
  position: sticky;
  top: 80px;
}
.tkb-purchase-box-inner { padding: 20px; }
.tkb-price-tag {
  font-size: 30px;
  font-weight: 800;
  color: #111827;
  margin-bottom: 4px;
}
.tkb-price-note {
  font-size: 12px;
  color: var(--text-light);
  margin-bottom: 16px;
}
.tkb-btn-download {
  display: block;
  width: 100%;
  background: #1f2937;
  color: white;
  border: none;
  padding: 14px 20px;
  font-size: 16px;
  font-weight: 700;
  border-radius: 7px;
  cursor: pointer;
  text-align: center;
  transition: background 0.2s;
  margin-bottom: 10px;
}
.tkb-btn-download:hover { background: #111827; }
.tkb-btn-preview {
  display: block;
  width: 100%;
  background: white;
  color: #374151;
  border: 1.5px solid #d1d5db;
  padding: 12px 20px;
  font-size: 14px;
  font-weight: 600;
  border-radius: 7px;
  cursor: pointer;
  text-align: center;
  transition: all 0.2s;
  margin-bottom: 16px;
}
.tkb-btn-preview:hover {  border-color: #9ca3af; }
.tkb-product-meta {
  border-top: 1px solid var(--border);
  padding-top: 16px;
}
.tkb-meta-row {
  display: flex;
  justify-content: space-between;
  font-size: 13px;
  padding: 6px 0;
  border-bottom: 1px solid var(--gray-100);
}
.tkb-meta-row:last-child { border-bottom: none; }
.tkb-meta-label { color: var(--text-light); }
.tkb-meta-value { color: var(--gray-900); font-weight: 500; }
.tkb-product-desc {
  font-size: 14px;
  color: var(--gray-700);
  line-height: 1.7;
  margin-bottom: 20px;
}
.tkb-product-desc h3 {
  font-size: 17px;
  color: var(--gray-900);
  margin: 20px 0 8px;
}
.tkb-product-desc ul {
  list-style: disc;
  padding-left: 20px;
}
.tkb-product-desc ul li { margin-bottom: 6px; }
/* Tags */
.tkb-tags {
  display: flex;
  gap: 6px;
  flex-wrap: wrap;
  margin-top: 16px;
}
.tkb-tag {
  background: var(--gray-100);
  border: 1px solid var(--border);
  color: var(--gray-700);
  padding: 4px 12px;
  border-radius: 4px;
  font-size: 12px;
  transition: all 0.2s;
}
.tkb-tag:hover { background: #374151; color: white; border-color: #374151; }
/* Rating stars in single */
.tkb-rating-bar {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 16px;
}
.tkb-rating-bar .stars { color: #9ca3af; font-size: 16px; letter-spacing: 1px; }
.tkb-rating-bar span { font-size: 13px; color: var(--text-light); }

/* =============================================
   RELATED PRODUCTS
============================================= */
.tkb-related {
  padding: 40px 0;
  background: var(--gray-50);
  border-top: 1px solid var(--border);
}

/* =============================================
   PAGINATION
============================================= */
.tkb-pagination {
  display: flex;
  gap: 6px;
  justify-content: center;
  padding: 30px 0;
}
.tkb-pagination a, .tkb-pagination span {
  width: 38px;
  height: 38px;
  display: flex;
  align-items: center;
  justify-content: center;
  border: 1.5px solid var(--border);
  border-radius: 6px;
  font-size: 13px;
  color: var(--gray-700);
  transition: all 0.2s;
}
.tkb-pagination a:hover, .tkb-pagination .current {
  background: #1f2937;
  color: white;
  border-color: #1f2937;
}

/* =============================================
   FOOTER
============================================= */
.tkb-footer {
  background: var(--gray-900);
  color: rgba(255,255,255,0.75);
  padding: 50px 0 0;
}
.tkb-footer-grid {
  max-width: 1280px;
  margin: 0 auto;
  padding: 0 20px 40px;
  display: grid;
  grid-template-columns: 2fr 1fr 1fr 1fr;
  gap: 40px;
}
.tkb-footer h4 {
  color: white;
  font-size: 14px;
  font-weight: 700;
  margin-bottom: 16px;
  text-transform: uppercase;
  letter-spacing: 0.5px;
}
.tkb-footer ul li { margin-bottom: 8px; }
.tkb-footer ul li a {
  color: rgba(255,255,255,0.65);
  font-size: 13px;
  transition: color 0.2s;
}
.tkb-footer ul li a:hover { color: white; }
.tkb-footer-desc {
  font-size: 13px;
  line-height: 1.7;
  margin-top: 8px;
  color: rgba(255,255,255,0.55);
}
.tkb-footer-bottom {
  border-top: 1px solid rgba(255,255,255,0.1);
  padding: 16px 20px;
  text-align: center;
  font-size: 12px;
  color: rgba(255,255,255,0.4);
} 
 
/* =============================================
   RESPONSIVE
============================================= */
@media (max-width: 1024px) {
  .tkb-grid { grid-template-columns: repeat(3, 1fr); }
  .tkb-archive-wrap { display: block; }
  .tkb-single-wrap { grid-template-columns: 1fr 300px; }
  .tkb-footer-grid { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 768px) {
  .tkb-grid { grid-template-columns: repeat(2, 1fr); }
  .tkb-archive-wrap { display: block; }
  .tkb-single-wrap { grid-template-columns: 1fr; }
  .tkb-hero h1 { font-size: 24px; }
  .tkb-stats-inner { grid-template-columns: repeat(2, 1fr); }
  .tkb-footer-grid { grid-template-columns: 1fr; gap: 24px; }
  .tkb-header-inner { gap: 12px; }
  .tkb-header-actions .hide-mobile { display: none; }
}
@media (max-width: 480px) {
  .tkb-grid { grid-template-columns: 1fr; }
  .tkb-search-wrap { display: none; }
}
/* ── EDD Cart Icon ── */
.tkb-cart-icon {
    position: relative;
    display: inline-flex;
    align-items: center;
    color: inherit;
    text-decoration: none;
    padding: 4px;
}
.tkb-cart-icon svg {
    display: block;
}
.tkb-cart-count {
    position: absolute;
    top: -6px;
    right: -8px;
    background: #374151;
    color: #fff;
    font-size: 10px;
    font-weight: 700;
    line-height: 1;
    min-width: 16px;
    height: 16px;
    border-radius: 8px;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0 3px;
    pointer-events: none;
}

/* ═══════════════════════════════════════════════════
   EDD BUTTON OVERRIDE — Force dark theme on all EDD buttons
   Overrides edd.min.css blue (#428bca) completely
════════════════════════════════════════════════════ */

/* All EDD submit/checkout buttons */
.edd-submit,
.edd-submit.button,
.edd-submit.button.blue,
.button.edd-submit,
a.edd_go_to_checkout,
a.edd_go_to_checkout.button,
.edd-add-to-cart,
.edd-add-to-cart.button,
#edd_purchase_submit .edd-submit,
.edd_purchase_submit_wrapper .edd-submit,
input[type="submit"].edd-submit {
    background: #1f2937 !important;
    background-color: #1f2937 !important;
    border-color: #1f2937 !important;
    color: #ffffff !important;
    border-radius: 7px !important;
    font-weight: 700 !important;
    font-family: var(--font) !important;
    font-size: 15px !important;
    transition: background 0.2s !important;
    box-shadow: none !important;
    text-shadow: none !important;
}

.edd-submit:hover,
.edd-submit.button:hover,
.edd-submit.button.blue:hover,
a.edd_go_to_checkout:hover,
a.edd_go_to_checkout.button:hover,
.edd-add-to-cart:hover,
#edd_purchase_submit .edd-submit:hover,
input[type="submit"].edd-submit:hover {
    background: #111827 !important;
    background-color: #111827 !important;
    border-color: #111827 !important;
    color: #ffffff !important;
}

/* EDD checkout form fields */
#edd_checkout_form_wrap input[type="text"],
#edd_checkout_form_wrap input[type="email"],
#edd_checkout_form_wrap input[type="tel"],
#edd_checkout_form_wrap select,
#edd_checkout_form_wrap textarea {
    border: 1.5px solid #d1d5db !important;
    border-radius: 6px !important;
    font-family: var(--font) !important;
    color: #1f2937 !important;
}

#edd_checkout_form_wrap input:focus,
#edd_checkout_form_wrap select:focus {
    border-color: #374151 !important;
    outline: none !important;
    box-shadow: 0 0 0 3px rgba(55,65,81,0.1) !important;
}

/* EDD links — replace blue links */
.edd-cart-ajax-alert,
#edd_checkout_form_wrap a,
.edd_purchase_receipt a {
    color: #374151 !important;
}

/* EDD checkout total/price text */
#edd_checkout_cart .edd_cart_item_price,
#edd_checkout_cart tfoot td,
.edd_cart_amount {
    color: #111827 !important;
    font-weight: 700 !important;
}

/* ═══════════════════════════════════════════════════
   LOGIN / REGISTER PAGE — Dark header override
   For custom page-login.php and page-register.php
════════════════════════════════════════════════════ */

/* The blue header on login/register pages */
.tkb-auth-header {
    background: #111827 !important;
}

/* Auth card header section */
.tkb-auth-card-header {
    background: #1f2937 !important;
    color: white !important;
}

/* Primary auth button — Create Account / Login */
.tkb-auth-btn-primary,
.tkb-register-btn,
.tkb-login-btn,
#registerform input[type="submit"],
#loginform input[type="submit"] {
    background: #1f2937 !important;
    color: white !important;
    border: none !important;
    border-radius: 7px !important;
    font-weight: 700 !important;
    width: 100% !important;
    padding: 14px !important;
    font-size: 15px !important;
    cursor: pointer !important;
    transition: background 0.2s !important;
}

.tkb-auth-btn-primary:hover,
.tkb-register-btn:hover,
.tkb-login-btn:hover,
#registerform input[type="submit"]:hover,
#loginform input[type="submit"]:hover {
    background: #111827 !important;
}

/* Auth page links */
.tkb-auth-card a {
    color: #374151 !important;
    font-weight: 600 !important;
}

.tkb-auth-card a:hover {
    color: #111827 !important;
}

/* Auth checkbox accent */
.tkb-auth-card input[type="checkbox"]:checked {
    accent-color: #374151 !important;
}

/* Auth page background */
body.page-template-page-login,
body.page-template-page-register {
    background: #f9fafb !important;
}




/* ═══════════════════════════════════════════════════
   EDD CHECKOUT — 2 Column Layout
   Left: Cart Items | Right: Payment + Personal Info
════════════════════════════════════════════════════ */

/* Wrapper — page.php ka content area */
.tkb-page-wrap {
    max-width: 1100px;
    margin: 0 auto;
    padding: 40px 20px;
}

/* Main checkout form — 2 column grid */
.tkb-checkout-left  { width: 63%; }
.tkb-checkout-right { width: 34%; }
.tkb-checkout-wrap  {
    display: flex;
    gap: 28px;
    align-items: flex-start;
    max-width: 1100px;
    margin: 0 auto;
    padding: 40px 20px;
}
@media(max-width:768px){
    .tkb-checkout-wrap { flex-direction: column; }
    .tkb-checkout-left, .tkb-checkout-right { width: 100%; }
}

/* Personal info form fields */
#edd_checkout_form_wrap .edd-input,
#edd_checkout_form_wrap input[type="text"],
#edd_checkout_form_wrap input[type="email"],
#edd_checkout_form_wrap input[type="tel"],
#edd_checkout_form_wrap select {
    width: 100%;
    padding: 10px 13px;
    border: 1.5px solid #e5e7eb;
    border-radius: 7px;
    font-size: 14px;
    color: #1f2937;
    margin-bottom: 12px;
    box-sizing: border-box;
    font-family: var(--font);
    outline: none;
    transition: border-color 0.2s;
}

#edd_checkout_form_wrap .edd-input:focus,
#edd_checkout_form_wrap input[type="text"]:focus,
#edd_checkout_form_wrap input[type="email"]:focus,
#edd_checkout_form_wrap input[type="tel"]:focus {
    border-color: #374151;
    box-shadow: 0 0 0 3px rgba(55,65,81,0.08);
}

#edd_checkout_form_wrap label {
    display: block;
    font-size: 13px;
    font-weight: 600;
    color: #374151;
    margin-bottom: 5px;
}

/* Purchase total + Place Order box */
#edd_purchase_submit {
    background: #f9fafb;
    text-align: center;
}

#edd_purchase_submit .edd_cart_amount {
    font-size: 22px;
    font-weight: 800;
    color: #111827;
    display: block;
    margin-bottom: 14px;
}

/* Place Order button */
#edd_purchase_submit .edd-submit,
#edd_purchase_submit input[type="submit"] {
    width: 100% !important;
    padding: 15px !important;
    font-size: 16px !important;
    font-weight: 700 !important;
    background: #1f2937 !important;
    color: white !important;
    border: none !important;
    border-radius: 8px !important;
    cursor: pointer !important;
    transition: background 0.2s !important;
}

#edd_purchase_submit .edd-submit:hover,
#edd_purchase_submit input[type="submit"]:hover {
    background: #111827 !important;
}

/* Payment icons row */
.edd-payment-icons {
    display: flex;
    gap: 8px;
    margin-bottom: 14px;
    flex-wrap: wrap;
}

.edd-payment-icons img {
    height: 28px;
    border-radius: 4px;
    border: 1px solid #e5e7eb;
}

/* ── RESPONSIVE: Stack on mobile ── */
@media (max-width: 768px) {
    #edd_checkout_form_wrap {
        grid-template-columns: 1fr;
    }

    #edd_checkout_cart_form { order: 1; }
    #edd_payment_mode_select,
    #edd_checkout_form_wrap fieldset,
    #edd_purchase_submit { order: 2; }
}
/* Search bar fix */
.tkb-hero-search {
    max-width: 540px !important;
    margin: 0 auto 24px !important;
}
.tkb-hero-search form {
    display: flex !important;
    flex-wrap: nowrap !important;
    width: 100% !important;
    background: #ffffff !important;
    border-radius: 8px !important;
    overflow: hidden !important;
    box-shadow: 0 4px 20px rgba(0,0,0,0.20) !important;
    padding: 0 !important;
    gap: 0 !important;
}
.tkb-hero-search input[type="hidden"] {
    display: none !important;
    width: 0 !important;
    padding: 0 !important;
}
.tkb-hero-search input[type="text"] {
    flex: 1 !important;
    min-width: 0 !important;
    border: none !important;
    outline: none !important;
    padding: 16px 20px !important;
    font-size: 15px !important;
    color: #1e293b !important;
    background: transparent !important;
    box-shadow: none !important;
}
.tkb-hero-search button[type="submit"],
.tkb-hero-search button {
    flex-shrink: 0 !important;
    border: none !important;
    border-radius: 0 !important;
    /*background: #4f46e5 !important;*/
    color: #fff !important;
    font-weight: 700 !important;
    font-size: 15px !important;
    padding: 16px 28px !important;
    cursor: pointer !important;
    white-space: nowrap !important;
    width: auto !important;
    display: block !important;
}
.tkb-hero-search button:hover {
    background: #4338ca !important;
}
/* ══ CARD ALIGNMENT FIX ══ */
.tkb-grid .tkb-card { display: flex; flex-direction: column; height: 100%; }
.tkb-grid .tkb-card > a { display: flex; flex-direction: column; flex: 1; text-decoration: none; color: inherit; }
.tkb-grid .tkb-card .tkb-card-thumb { flex-shrink: 0; aspect-ratio: 16/9; overflow: hidden; }
.tkb-grid .tkb-card .tkb-card-thumb img { width: 100%; height: 100%; object-fit: cover; display: block; opacity: 0; transition: transform 0.28s ease, opacity 0.3s ease; }
.tkb-grid .tkb-card .tkb-card-thumb.tkb-sk-done img { opacity: 1 !important; }
.tkb-grid .tkb-card .tkb-card-info { display: flex; flex-direction: column; flex: 1; padding: 10px 12px 12px; }
.tkb-grid .tkb-card .tkb-card-title { font-size: 13px; font-weight: 700; line-height: 1.35; margin-bottom: 3px; }
.tkb-grid .tkb-card .tkb-card-colors { margin-top: auto; }
.tkb-grid .tkb-card .tkb-card-meta { margin-top: 6px; }

/* ══ FREE BADGE — green pill ══ */
.tkb-card-badge.free,
span.free-price,
.tkb-card-price.free-price { background: #dcfce7 !important; color: #15803d !important; font-size: 11px !important; font-weight: 700 !important; padding: 3px 10px !important; border-radius: 20px !important; display: inline-block !important; letter-spacing: 0.04em !important; border: none !important; }




/* ══ FREE BADGE — golden ribbon, curl visible ══ */
/* ══ FREE BADGE — golden ribbon curl, card level ══ */
.tkb-card {
    position: relative !important;
    overflow: visible !important;
}
.tkb-card > a {
    position: relative !important;
    overflow: visible !important;
}
.tkb-card-thumb {
    position: relative !important;
    overflow: hidden !important;
}
.tkb-card-badge.free {
    position: absolute !important;
    top: 0 !important;
    left: -12px !important;
    width: 78px !important;
    height: 30px !important;
    background-image: url("data:image/svg+xml,%3Csvg%20width%3D%22200%22%20height%3D%2272%22%20viewBox%3D%220%200%20284%20111%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20fill-rule%3D%22evenodd%22%20clip-rule%3D%22evenodd%22%20d%3D%22M0.0931602%2011.4521L0.362581%2012.5401C2.28161%2016.3693%2010.6671%2019.5471%2022.0136%2021.0144L32.2322%2021.6442V21.3507H247.632C267.589%2021.3507%20283.77%2041.3842%20283.77%2066.0986C283.77%2090.8129%20267.589%20110.846%20247.632%20110.846H34.296V110.939L32.827%20110.846H32.2322V110.811L22.5081%20110.217C12.7839%20108.957%205.23255%20106.445%202.06523%20103.338L0.619843%20100.425L0%20100.432L0.0931602%2011.4521Z%22%20fill%3D%22url(%23g1)%22%2F%3E%3Cpath%20fill-rule%3D%22evenodd%22%20clip-rule%3D%22evenodd%22%20d%3D%22M42.9936%200V21.9015V22.1878L28.2749%2021.4506C14.1007%2019.9547%203.63135%2016.7124%201.23435%2012.8045L0.898277%2011.6951L0.714844%2011.0939C0.714844%206.44162%2012.0799%202.44784%2028.2749%200.737229L42.9936%200Z%22%20fill%3D%22%237a5c0a%22%2F%3E%3Ctext%20x%3D%2258%22%20y%3D%2274%22%20font-family%3D%22Arial%2Csans-serif%22%20font-size%3D%2244%22%20font-weight%3D%22900%22%20fill%3D%22white%22%20letter-spacing%3D%222%22%3EFree%3C%2Ftext%3E%3Cdefs%3E%3ClinearGradient%20id%3D%22g1%22%20x1%3D%22283.77%22%20y1%3D%2261.1958%22%20x2%3D%220%22%20y2%3D%2261.1958%22%20gradientUnits%3D%22userSpaceOnUse%22%3E%3Cstop%20stop-color%3D%22%23b8860b%22%2F%3E%3Cstop%20offset%3D%220.45%22%20stop-color%3D%22%23d4a017%22%2F%3E%3Cstop%20offset%3D%221%22%20stop-color%3D%22%23e8c04a%22%2F%3E%3C%2FlinearGradient%3E%3C%2Fdefs%3E%3C%2Fsvg%3E") !important;
    background-size: 100% 100% !important;
    background-repeat: no-repeat !important;
    background-color: transparent !important;
    border: none !important;
    padding: 0 !important;
    border-radius: 0 !important;
    text-indent: -9999px !important;
    z-index: 10 !important;
    overflow: visible !important;
    pointer-events: none !important;
}
.tkb-card-price.free-price,
span.free-price {
    display: none !important;
}
/* ════════════════════════════════════════════════════════════
   SSDD v2 — SlideSwift Deck Dropdown
   Prefix: ssdd-  |  No conflict with tkb- classes
   Updated: July 2026 — all 11 issues fixed
════════════════════════════════════════════════════════════ */

/* Trigger */
.ssdd-trigger{background:transparent;border:none;cursor:pointer;display:inline-flex;align-items:center;gap:4px;font-family:inherit;}
.ssdd-arr{font-size:10px;color:rgba(255,255,255,0.45);transition:transform .2s ease;display:inline-block;}
.ssdd-open .ssdd-arr{transform:rotate(180deg);}

/* FIX #9: Overlay blocks background scroll */
.ssdd-overlay{display:none;position:fixed;inset:0;background:rgba(0,0,0,0.3);z-index:1000;backdrop-filter:blur(1px);-webkit-backdrop-filter:blur(1px);}
.ssdd-overlay.ssdd-overlay-show{display:block;}

/* Dropdown — full viewport width */
.ssdd-dropdown{
    display:none;
    position:fixed;
    left:0;right:0;
    top:127px; /* overridden by JS */
    background:#fff;
    border-top:3px solid #2563eb;
    border-bottom:1px solid #e2e8f0;
    box-shadow:0 16px 48px rgba(0,0,0,0.14),0 2px 8px rgba(0,0,0,0.07);
    z-index:1001;
}
.ssdd-open .ssdd-dropdown{display:block;}

.ssdd-inner{
    max-width:1280px;
    margin:0 auto;
    padding:0 20px;
    display:grid;
    grid-template-columns:220px 1fr 196px;
}

/* ── LEFT ── */
.ssdd-left{
    border-right:1px solid #f1f5f9;
    padding:14px 0 0;
    height:400px;
    display:flex;
    flex-direction:column;
}
.ssdd-left-lbl{font-size:9px;font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:#94a3b8;padding:0 14px 10px;flex-shrink:0;}

/* FIX #7: Slim 3px scrollbar */
.ssdd-cat-list{
    flex:1;overflow-y:auto;overflow-x:hidden;
    scrollbar-width:thin;scrollbar-color:#e2e8f0 transparent;
}
.ssdd-cat-list::-webkit-scrollbar{width:3px;}
.ssdd-cat-list::-webkit-scrollbar-track{background:transparent;}
.ssdd-cat-list::-webkit-scrollbar-thumb{background:#e2e8f0;border-radius:3px;}
.ssdd-cat-list::-webkit-scrollbar-thumb:hover{background:#cbd5e1;}

.ssdd-cat{display:flex;align-items:center;gap:9px;padding:7px 14px;cursor:pointer;border-left:3px solid transparent;transition:background .12s,border-color .12s;text-decoration:none;color:inherit;}
.ssdd-cat:hover{background:#f8f9ff;border-left-color:#bfdbfe;}
.ssdd-cat-active{background:#eff6ff;border-left-color:#2563eb;}
.ssdd-cat-active .ssdd-cat-name{color:#2563eb;font-weight:700;}
.ssdd-cat-active .ssdd-cat-n{color:#93c5fd;}
.ssdd-cat-icon{width:26px;height:26px;border-radius:6px;display:flex;align-items:center;justify-content:center;font-size:13px;flex-shrink:0;transition:transform .15s;}
.ssdd-cat:hover .ssdd-cat-icon,.ssdd-cat-active .ssdd-cat-icon{transform:scale(1.1);}
.ssdd-cat-name{font-size:12.5px;color:#374151;font-weight:500;flex:1;}
.ssdd-cat-n{font-size:10px;color:#d1d5db;font-weight:600;}

.ssdd-cat-divider{height:1px;background:#f1f5f9;margin:5px 14px;}
.ssdd-more-lbl{font-size:9px;font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:#94a3b8;padding:6px 14px 4px;}
.ssdd-extra-cats{display:none;}
.ssdd-extra-cats.ssdd-extra-visible{display:block;}

.ssdd-showall-btn{
    flex-shrink:0;display:flex;align-items:center;gap:6px;
    padding:9px 14px;border:none;border-top:1px solid #f1f5f9;
    background:transparent;cursor:pointer;font-size:12px;font-weight:600;
    color:#2563eb;font-family:inherit;transition:background .12s;width:100%;text-align:left;
}
.ssdd-showall-btn:hover{background:#f8f9ff;}
.ssdd-showall-icon{font-size:11px;transition:transform .2s;margin-left:auto;}
.ssdd-showall-btn.ssdd-showall-expanded .ssdd-showall-icon{transform:rotate(180deg);}

/* ── MIDDLE ── FIX #8: no scrollbar in middle */
.ssdd-mid{
    background:#fafbfc;
    padding:16px 20px 14px;
    border-right:1px solid #f1f5f9;
    height:400px;
    overflow:hidden; /* FIX #8 */
    display:flex;
    flex-direction:column;
}
.ssdd-mid-header{display:flex;align-items:flex-start;justify-content:space-between;margin-bottom:12px;flex-shrink:0;}
.ssdd-mid-title{font-size:15px;font-weight:800;color:#0f172a;margin-bottom:3px;}
.ssdd-mid-sub{font-size:11px;color:#6b7280;}
.ssdd-price-badge{background:#dcfce7;color:#15803d;font-size:10px;font-weight:800;padding:3px 10px;border-radius:20px;white-space:nowrap;margin-top:2px;flex-shrink:0;}

/* FIX #2: Better card design — taller image, cleaner body */
.ssdd-preview-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-bottom:12px;flex-shrink:0;}
.ssdd-pcard{background:#fff;border:1.5px solid #e5e7eb;border-radius:10px;overflow:hidden;cursor:pointer;transition:border-color .15s,box-shadow .15s,transform .15s;text-decoration:none;display:block;color:inherit;}
.ssdd-pcard:hover{border-color:#2563eb;box-shadow:0 4px 14px rgba(37,99,235,.10);transform:translateY(-2px);}
.ssdd-pcard-img-wrap{position:relative;width:100%;aspect-ratio:16/9;overflow:hidden;background:#e2e8f0;}
.ssdd-pcard-img{position:absolute;top:0;left:0;width:100%;height:100%;object-fit:cover;transition:opacity .35s ease;}
.ssdd-dark-img{opacity:1;}
.ssdd-light-img{opacity:0;}
.ssdd-pcard.ssdd-show-light .ssdd-dark-img{opacity:0;}
.ssdd-pcard.ssdd-show-light .ssdd-light-img{opacity:1;}
.ssdd-img-placeholder{background:#e2e8f0;}
.ssdd-pcard-body{padding:6px 8px 8px;background:#fff;}
.ssdd-pcard-name{font-size:11px;font-weight:700;color:#0f172a;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;line-height:1.3;}
.ssdd-pcard-meta{font-size:10px;color:#9ca3af;margin-top:1px;}

/* Skeleton */
.ssdd-skeleton .ssdd-pcard-img-wrap{background:linear-gradient(90deg,#f0f0f0 25%,#e0e0e0 50%,#f0f0f0 75%);background-size:200% 100%;animation:ssdd-shimmer 1.4s infinite;}
@keyframes ssdd-shimmer{0%{background-position:200% 0}100%{background-position:-200% 0}}
.ssdd-sk-line{height:8px;background:#e9ecf0;border-radius:4px;margin-bottom:5px;animation:ssdd-shimmer 1.4s infinite;background-size:200% 100%;}
.ssdd-sk-w80{width:80%;}
.ssdd-sk-w50{width:50%;}

.ssdd-divider{height:1px;background:#e9ecf0;margin:10px 0;flex-shrink:0;}
.ssdd-row-lbl{font-size:10px;font-weight:700;color:#9ca3af;text-transform:uppercase;letter-spacing:.07em;margin-bottom:7px;flex-shrink:0;}

/* Theme buttons */
.ssdd-themes{display:flex;gap:7px;margin-bottom:11px;flex-shrink:0;}
.ssdd-theme{flex:1;background:#fff;border:1.5px solid #e5e7eb;border-radius:8px;padding:7px 10px;display:flex;align-items:center;gap:8px;cursor:pointer;transition:border-color .15s,background .15s;font-family:inherit;}
.ssdd-theme:hover{border-color:#2563eb;background:#f8f9ff;color:inherit;}
.ssdd-theme-active{border-color:#2563eb;background:#eff6ff;}
.ssdd-theme-circle{width:18px;height:18px;border-radius:50%;flex-shrink:0;}
.ssdd-theme-dark-circle{background:#0f172a;border:2px solid #334155;}
.ssdd-theme-light-circle{background:#fff;border:2px solid #e2e8f0;}
.ssdd-theme-name{font-size:12px;font-weight:700;color:#374151;display:block;}
.ssdd-theme-desc{font-size:10px;color:#9ca3af;display:block;}

/* FIX #3: Colors included label */
.ssdd-colors-row{display:flex;align-items:center;gap:6px;margin-bottom:13px;flex-wrap:wrap;flex-shrink:0;}
.ssdd-cdot{width:15px;height:15px;border-radius:50%;cursor:default;box-shadow:0 0 0 1px rgba(0,0,0,.10);flex-shrink:0;display:inline-block;}
.ssdd-all-pill{margin-left:auto;background:#dcfce7;color:#15803d;font-size:10px;font-weight:800;padding:2px 8px;border-radius:20px;}

/* FIX #1: Only browse btn, full width */
.ssdd-btns{display:flex;gap:8px;flex-shrink:0;}
.ssdd-btn-p{background:#2563eb;color:#fff;border:none;border-radius:8px;padding:10px 14px;font-size:12px;font-weight:700;cursor:pointer;text-align:center;text-decoration:none;display:block;transition:background .15s;white-space:nowrap;}
.ssdd-btn-p:hover{background:#1d4ed8 !important;color:#fff !important;}
.ssdd-btn-full{flex:1;}

/* ── RIGHT ── */
.ssdd-right{background:#fff;padding:14px;display:flex;flex-direction:column;gap:2px;height:400px;}
.ssdd-right-title{font-size:9px;font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:#94a3b8;margin-bottom:8px;flex-shrink:0;}
.ssdd-qlink{display:flex;align-items:center;gap:10px;padding:7px 8px;border-radius:8px;cursor:pointer;text-decoration:none;color:inherit;transition:background .12s;}
.ssdd-qlink:hover{background:#f1f5f9;}
.ssdd-qlink-icon{width:28px;height:28px;border-radius:7px;display:flex;align-items:center;justify-content:center;font-size:13px;flex-shrink:0;}
.ssdd-qlink-name{font-size:12px;font-weight:600;color:#374151;display:block;}
.ssdd-qlink-sub{font-size:10px;color:#9ca3af;display:block;}

/* FIX #7: Promo with $99 badge (not white button) */
.ssdd-promo{margin-top:auto;background:#1e3a8a;border-radius:10px;padding:12px;position:relative;overflow:hidden;flex-shrink:0;}
.ssdd-promo::before{content:'';position:absolute;top:-25px;right:-25px;width:90px;height:90px;border-radius:50%;background:rgba(255,255,255,.05);}
.ssdd-promo-lbl{font-size:9px;color:#93c5fd;font-weight:800;letter-spacing:.08em;text-transform:uppercase;margin-bottom:3px;}
.ssdd-promo-title{font-size:13px;color:#fff;font-weight:800;margin-bottom:2px;}
.ssdd-promo-sub{font-size:10px;color:#93c5fd;margin-bottom:9px;}
.ssdd-promo-btn{display:flex;align-items:center;justify-content:space-between;gap:8px;width:100%;background:rgba(255,255,255,0.12);color:#fff;border:1.5px solid rgba(255,255,255,0.25);border-radius:7px;padding:8px 10px;font-size:11px;font-weight:700;cursor:pointer;text-align:left;text-decoration:none;transition:background .15s;}
.ssdd-promo-btn:hover{background:rgba(255,255,255,0.2);color:#fff;}
.ssdd-right-divider{height:1px;background:#f1f5f9;margin:8px 0;}
.ssdd-right-divider{height:1px;background:#f1f5f9;margin:8px 0;}
.ssdd-promo-price-tag{background:#d6b370;color:#0f172a;font-size:11px;font-weight:800;padding:2px 8px;border-radius:5px;flex-shrink:0;}

/* Mobile: hide on small screens */
@media(max-width:768px){.ssdd-dropdown{display:none!important}.ssdd-arr{display:none}}

/* ════════════════════════════════════════════════════════════
   END SSDD v2
════════════════════════════════════════════════════════════ */
/* ════════════════════════════════════════════════════
   SSDD v3 — Mega Dropdown | All fixes applied
════════════════════════════════════════════════════ */

.ssdd-trigger{background:transparent;border:none;cursor:pointer;display:inline-flex;align-items:center;gap:4px;font-family:inherit;}
.ssdd-arr{font-size:10px;color:rgba(255,255,255,.45);transition:transform .2s;display:inline-block;}
.ssdd-open .ssdd-arr{transform:rotate(180deg);}

/* Overlay — blocks bg scroll */
.ssdd-overlay{display:none;position:fixed;inset:0;background:rgba(0,0,0,.32);z-index:1000;backdrop-filter:blur(1px);-webkit-backdrop-filter:blur(1px);}
.ssdd-overlay.ssdd-overlay-show{display:block;}

/* Dropdown */
.ssdd-dropdown{display:none;position:fixed;left:0;right:0;top:130px;background:#fff;border-top:3px solid #2563eb;border-bottom:1px solid #e2e8f0;box-shadow:0 16px 48px rgba(0,0,0,.14),0 2px 8px rgba(0,0,0,.07);z-index:1001;}
.ssdd-open .ssdd-dropdown{display:block;}
.ssdd-inner{max-width:1280px;margin:0 auto;padding:0 20px;display:grid;grid-template-columns:220px 1fr 196px;}

/* LEFT */
.ssdd-left{border-right:1px solid #f1f5f9;padding:14px 0 0;height:420px;display:flex;flex-direction:column;}
.ssdd-left-lbl{font-size:9px;font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:#94a3b8;padding:0 14px 10px;flex-shrink:0;}
/* slim scrollbar */
.ssdd-cat-list{flex:1;overflow-y:auto;overflow-x:hidden;scrollbar-width:thin;scrollbar-color:#e2e8f0 transparent;}
.ssdd-cat-list::-webkit-scrollbar{width:3px;}
.ssdd-cat-list::-webkit-scrollbar-track{background:transparent;}
.ssdd-cat-list::-webkit-scrollbar-thumb{background:#e2e8f0;border-radius:3px;}
.ssdd-cat-list::-webkit-scrollbar-thumb:hover{background:#cbd5e1;}

.ssdd-cat{display:flex;align-items:center;gap:9px;padding:7px 14px;cursor:pointer;border-left:3px solid transparent;transition:background .12s,border-color .12s;text-decoration:none;color:inherit;}
.ssdd-cat:hover{background:#f8f9ff;border-left-color:#bfdbfe;}
.ssdd-cat-active{background:#eff6ff;border-left-color:#2563eb;}
.ssdd-cat-active .ssdd-cat-name{color:#2563eb;font-weight:700;}
.ssdd-cat-active .ssdd-cat-n{color:#93c5fd;}
.ssdd-cat-icon{width:26px;height:26px;border-radius:6px;display:flex;align-items:center;justify-content:center;font-size:13px;flex-shrink:0;transition:transform .15s;}
.ssdd-cat:hover .ssdd-cat-icon,.ssdd-cat-active .ssdd-cat-icon{transform:scale(1.1);}
.ssdd-cat-name{font-size:12.5px;color:#374151;font-weight:500;flex:1;}
.ssdd-cat-n{font-size:10px;color:#d1d5db;font-weight:600;}
.ssdd-cat-divider{height:1px;background:#f1f5f9;margin:5px 14px;}
.ssdd-more-lbl{font-size:9px;font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:#94a3b8;padding:6px 14px 4px;}
.ssdd-extra-cats{display:none;}
.ssdd-extra-cats.ssdd-extra-visible{display:block;}
.ssdd-showall-btn{flex-shrink:0;display:flex;align-items:center;gap:6px;padding:9px 14px;border:none;border-top:1px solid #f1f5f9;background:transparent;cursor:pointer;font-size:12px;font-weight:600;color:#2563eb;font-family:inherit;transition:background .12s;width:100%;text-align:left;}
.ssdd-showall-btn:hover{background:#f8f9ff;}
.ssdd-showall-icon{font-size:11px;transition:transform .2s;margin-left:auto;}
.ssdd-showall-btn.ssdd-showall-expanded .ssdd-showall-icon{transform:rotate(180deg);}

/* MIDDLE — no overflow */
.ssdd-mid{background:#fafbfc;padding:14px 18px 12px;border-right:1px solid #f1f5f9;height:420px;overflow:hidden;display:flex;flex-direction:column;}
.ssdd-mid-top{flex-shrink:0;}
.ssdd-mid-header{display:flex;align-items:flex-start;justify-content:space-between;margin-bottom:8px;}
.ssdd-mid-title{font-size:15px;font-weight:800;color:#0f172a;margin-bottom:2px;}
.ssdd-mid-sub{font-size:11px;color:#6b7280;}
.ssdd-price-badge{background:#dcfce7;color:#15803d;font-size:10px;font-weight:800;padding:3px 10px;border-radius:20px;white-space:nowrap;margin-top:2px;flex-shrink:0;}

/* FIX #4+5: Bundle badge — same as single-download.php */
.ssdd-bundle-badge{display:none;width:100%;align-items:center;gap:10px;background:#1a1f36;border:1.5px solid rgba(255,255,255,0.12);color:#fff!important;text-decoration:none!important;padding:8px 14px;border-radius:10px;margin-bottom:10px;position:relative;overflow:hidden;transition:transform .2s,box-shadow .2s;box-shadow:0 2px 12px rgba(0,0,0,.18);flex-shrink:0;}
.ssdd-bundle-badge::before{content:'';position:absolute;top:0;left:-75%;width:50%;height:100%;background:linear-gradient(90deg,transparent 0%,rgba(255,255,255,.18) 50%,transparent 100%);transform:skewX(-15deg);animation:ssdd-flash 2.8s ease-in-out infinite;}
@keyframes ssdd-flash{0%{left:-75%;opacity:0}10%{opacity:1}40%{left:130%;opacity:1}41%{opacity:0}100%{left:130%;opacity:0}}
.ssdd-bundle-badge:hover{transform:translateY(-2px);box-shadow:0 6px 20px rgba(0,0,0,.28);color:#fff!important;background:#252b4a!important;text-decoration:none!important;}
.ssdd-badge-icon{font-size:16px;flex-shrink:0;}
.ssdd-badge-text{display:flex;flex-direction:column;gap:1px;}
.ssdd-badge-top{font-size:9px;font-weight:600;letter-spacing:.5px;opacity:.75;white-space:nowrap;text-transform:uppercase;}
.ssdd-badge-price{font-size:13px;font-weight:800;line-height:1;white-space:nowrap;}
.ssdd-badge-arrow{font-size:14px;opacity:.7;flex-shrink:0;transition:transform .2s;}
.ssdd-bundle-badge:hover .ssdd-badge-arrow{transform:translateX(3px);opacity:1;}

/* Preview cards */
.ssdd-preview-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-bottom:10px;flex-shrink:0;}
.ssdd-pcard{background:#fff;border:1.5px solid #e5e7eb;border-radius:10px;overflow:hidden;cursor:pointer;transition:border-color .15s,box-shadow .15s,transform .15s;text-decoration:none;display:block;color:inherit;}
.ssdd-pcard:hover{border-color:#2563eb;box-shadow:0 4px 14px rgba(37,99,235,.10);transform:translateY(-2px);}
.ssdd-pcard-img-wrap{position:relative;width:100%;aspect-ratio:16/9;overflow:hidden;background:#e2e8f0;}
.ssdd-pcard-img{position:absolute;top:0;left:0;width:100%;height:100%;object-fit:cover;transition:opacity .35s ease;}
.ssdd-dark-img{opacity:1;}
.ssdd-light-img{opacity:0;}
.ssdd-pcard.ssdd-show-light .ssdd-dark-img{opacity:0;}
.ssdd-pcard.ssdd-show-light .ssdd-light-img{opacity:1;}
.ssdd-pcard-body{padding:6px 8px 8px;}
.ssdd-pcard-name{font-size:11px;font-weight:700;color:#0f172a;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.ssdd-pcard-meta{font-size:10px;color:#9ca3af;margin-top:1px;}
.ssdd-no-preview{grid-column:1/-1;font-size:12px;color:#9ca3af;padding:20px 0;text-align:center;}
/* Skeleton */
.ssdd-skeleton .ssdd-pcard-img-wrap{background:linear-gradient(90deg,#f0f0f0 25%,#e0e0e0 50%,#f0f0f0 75%);background-size:200% 100%;animation:ssdd-shimmer 1.4s infinite;}
@keyframes ssdd-shimmer{0%{background-position:200% 0}100%{background-position:-200% 0}}
.ssdd-sk-line{height:8px;background:#e9ecf0;border-radius:4px;margin-bottom:5px;}
.ssdd-sk-w80{width:80%;}
.ssdd-sk-w50{width:50%;}

.ssdd-divider{height:1px;background:#e9ecf0;margin:8px 0;flex-shrink:0;}
.ssdd-row-lbl{font-size:10px;font-weight:700;color:#9ca3af;text-transform:uppercase;letter-spacing:.07em;margin-bottom:7px;flex-shrink:0;}

/* Themes */
.ssdd-themes{display:flex;gap:7px;margin-bottom:10px;flex-shrink:0;}
.ssdd-theme{flex:1;background:#fff;border:1.5px solid #e5e7eb;border-radius:8px;padding:7px 10px;display:flex;align-items:center;gap:8px;cursor:pointer;transition:border-color .15s,background .15s;font-family:inherit;}
.ssdd-theme:hover{border-color:#2563eb;background:#f8f9ff;}
.ssdd-theme-active{border-color:#2563eb;background:#eff6ff;}
.ssdd-theme-circle{width:18px;height:18px;border-radius:50%;flex-shrink:0;}
.ssdd-theme-dark-circle{background:#0f172a;border:2px solid #334155;}
.ssdd-theme-light-circle{background:#fff;border:2px solid #e2e8f0;}
.ssdd-theme-name{font-size:12px;font-weight:700;color:#374151;display:block;}
.ssdd-theme-desc{font-size:10px;color:#9ca3af;display:block;}

/* Colors — FIX #7: correct label */
.ssdd-colors-row{display:flex;align-items:center;gap:6px;margin-bottom:12px;flex-shrink:0;}
.ssdd-cdot{width:14px;height:14px;border-radius:50%;box-shadow:0 0 0 1px rgba(0,0,0,.10);flex-shrink:0;display:inline-block;}
.ssdd-all-pill{margin-left:auto;background:#eff6ff;color:#2563eb;font-size:10px;font-weight:800;padding:2px 8px;border-radius:20px;}

/* Browse btn */
.ssdd-btns{flex-shrink:0;}
.ssdd-btn-p{background:#2563eb;color:#fff;border:none;border-radius:8px;padding:10px 14px;font-size:12px;font-weight:700;cursor:pointer;text-align:center;text-decoration:none;display:block;transition:background .15s;white-space:nowrap;}
.ssdd-btn-p:hover{background:#1d4ed8;color:#fff;}
.ssdd-btn-full{width:100%;}

/* RIGHT */
.ssdd-right{background:#fff;padding:14px;display:flex;flex-direction:column;gap:2px;height:420px;}
.ssdd-right-title{font-size:9px;font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:#94a3b8;margin-bottom:8px;}
.ssdd-qlink{display:flex;align-items:center;gap:10px;padding:7px 8px;border-radius:8px;cursor:pointer;text-decoration:none;color:inherit;transition:background .12s;}
.ssdd-qlink:hover{background:#f1f5f9;}
.ssdd-qlink-icon{width:28px;height:28px;border-radius:7px;display:flex;align-items:center;justify-content:center;font-size:13px;flex-shrink:0;}
.ssdd-qlink-name{font-size:12px;font-weight:600;color:#374151;display:block;}
.ssdd-qlink-sub{font-size:10px;color:#9ca3af;display:block;}
/* FIX #7: Promo with $99 gold tag */
.ssdd-promo{margin-top:auto;background:#1e3a8a;border-radius:10px;padding:12px;position:relative;overflow:hidden;flex-shrink:0;}
.ssdd-promo::before{content:'';position:absolute;top:-25px;right:-25px;width:90px;height:90px;border-radius:50%;background:rgba(255,255,255,.05);}
.ssdd-promo-lbl{font-size:9px;color:#93c5fd;font-weight:800;letter-spacing:.08em;text-transform:uppercase;margin-bottom:3px;}
.ssdd-promo-title{font-size:13px;color:#fff;font-weight:800;margin-bottom:2px;}
.ssdd-promo-sub{font-size:10px;color:#93c5fd;margin-bottom:8px;}
.ssdd-promo-btn{display:flex;align-items:center;justify-content:space-between;gap:8px;width:100%;background:rgba(255,255,255,.12);color:#fff;border:1.5px solid rgba(255,255,255,.25);border-radius:7px;padding:7px 10px;font-size:11px;font-weight:700;cursor:pointer;text-decoration:none;transition:background .15s;}
.ssdd-promo-btn:hover{background:rgba(255,255,255,.2);color:#fff;}
.ssdd-right-divider{height:1px;background:#f1f5f9;margin:8px 0;}
.ssdd-promo-price-tag{background:#d6b370;color:#0f172a;font-size:11px;font-weight:800;padding:2px 7px;border-radius:4px;flex-shrink:0;}

@media(max-width:768px){.ssdd-dropdown{display:none!important}.ssdd-arr{display:none}}

/* ════════════════════════════════════════════════════
   END SSDD v3
════════════════════════════════════════════════════ */
/* ════════════════════════════════════════════════════
   SSDD v4 — Final fixes
════════════════════════════════════════════════════ */

.ssdd-trigger{background:transparent;border:none;cursor:pointer;display:inline-flex;align-items:center;gap:4px;font-family:inherit;}
.ssdd-arr{font-size:10px;color:rgba(255,255,255,.45);transition:transform .2s;display:inline-block;}
.ssdd-open .ssdd-arr{transform:rotate(180deg);}

.ssdd-overlay{display:none;position:fixed;inset:0;background:rgba(0,0,0,.32);z-index:1000;backdrop-filter:blur(1px);-webkit-backdrop-filter:blur(1px);}
.ssdd-overlay.ssdd-overlay-show{display:block;}

.ssdd-dropdown{display:none;position:fixed;left:0;right:0;top:130px;background:#fff;border-top:3px solid #2563eb;border-bottom:1px solid #e2e8f0;box-shadow:0 16px 48px rgba(0,0,0,.14),0 2px 8px rgba(0,0,0,.07);z-index:1001;}
.ssdd-open .ssdd-dropdown{display:block;}
.ssdd-inner{max-width:1280px;margin:0 auto;padding:0 20px;display:grid;grid-template-columns:220px 1fr 196px;}

/* LEFT */
.ssdd-left{border-right:1px solid #f1f5f9;padding:14px 0 0;min-height:380px;display:flex;flex-direction:column;}
.ssdd-left-lbl{font-size:9px;font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:#94a3b8;padding:0 14px 10px;flex-shrink:0;}
.ssdd-cat-list{flex:1;overflow-y:auto;overflow-x:hidden;scrollbar-width:thin;scrollbar-color:#e2e8f0 transparent;}
.ssdd-cat-list::-webkit-scrollbar{width:3px;}
.ssdd-cat-list::-webkit-scrollbar-track{background:transparent;}
.ssdd-cat-list::-webkit-scrollbar-thumb{background:#e2e8f0;border-radius:3px;}
.ssdd-cat-list::-webkit-scrollbar-thumb:hover{background:#cbd5e1;}
.ssdd-cat{display:flex;align-items:center;gap:9px;padding:7px 14px;cursor:pointer;border-left:3px solid transparent;transition:background .12s,border-color .12s;text-decoration:none;color:inherit;}
.ssdd-cat:hover{background:#f8f9ff;border-left-color:#bfdbfe;}
.ssdd-cat-active{background:#eff6ff;border-left-color:#2563eb;}
.ssdd-cat-active .ssdd-cat-name{color:#2563eb;font-weight:700;}
.ssdd-cat-active .ssdd-cat-n{color:#93c5fd;}
.ssdd-cat-icon{width:26px;height:26px;border-radius:6px;display:flex;align-items:center;justify-content:center;font-size:13px;flex-shrink:0;transition:transform .15s;}
.ssdd-cat:hover .ssdd-cat-icon,.ssdd-cat-active .ssdd-cat-icon{transform:scale(1.1);}
.ssdd-cat-name{font-size:12.5px;color:#374151;font-weight:500;flex:1;}
.ssdd-cat-n{font-size:10px;color:#d1d5db;font-weight:600;}
.ssdd-cat-divider{height:1px;background:#f1f5f9;margin:5px 14px;}
.ssdd-more-lbl{font-size:9px;font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:#94a3b8;padding:6px 14px 4px;}
.ssdd-extra-cats{display:none;}
.ssdd-extra-cats.ssdd-extra-visible{display:block;}
.ssdd-showall-btn{flex-shrink:0;display:flex;align-items:center;gap:6px;padding:8px 14px;border:none;border-top:1px solid #f1f5f9;background:transparent;cursor:pointer;font-size:12px;font-weight:600;color:#2563eb;font-family:inherit;transition:background .12s;width:100%;text-align:left;}
.ssdd-showall-btn:hover{background:#f8f9ff;}
.ssdd-showall-icon{font-size:11px;transition:transform .2s;margin-left:auto;}
.ssdd-showall-btn.ssdd-showall-expanded .ssdd-showall-icon{transform:rotate(180deg);}

/* FIX #2: MIDDLE — use auto height, no overflow:hidden, all content visible */
.ssdd-mid{
    background:#fafbfc;
    padding:14px 18px 14px;
    border-right:1px solid #f1f5f9;
    min-height:380px;
    height:auto;
    display:flex;
    flex-direction:column;
    overflow:visible;
}
.ssdd-mid-header{display:flex;align-items:flex-start;justify-content:space-between;margin-bottom:10px;flex-shrink:0;}
.ssdd-mid-title{font-size:14px;font-weight:800;color:#0f172a;margin-bottom:2px;}
.ssdd-mid-sub{font-size:11px;color:#6b7280;}
.ssdd-price-badge{background:#dcfce7;color:#15803d;font-size:10px;font-weight:800;padding:3px 10px;border-radius:20px;white-space:nowrap;margin-top:2px;flex-shrink:0;}

/* Preview cards */
.ssdd-preview-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-bottom:10px;flex-shrink:0;}
.ssdd-pcard{background:#fff;border:1.5px solid #e5e7eb;border-radius:10px;overflow:hidden;cursor:pointer;transition:border-color .15s,box-shadow .15s,transform .15s;text-decoration:none;display:block;color:inherit;}
.ssdd-pcard:hover{border-color:#2563eb;box-shadow:0 4px 14px rgba(37,99,235,.10);transform:translateY(-2px);}
.ssdd-pcard-img-wrap{position:relative;width:100%;aspect-ratio:16/9;overflow:hidden;background:#e2e8f0;}
.ssdd-pcard-img{position:absolute;top:0;left:0;width:100%;height:100%;object-fit:cover;transition:opacity .35s ease;}
.ssdd-dark-img{opacity:1;}
.ssdd-light-img{opacity:0;}
.ssdd-pcard.ssdd-show-light .ssdd-dark-img{opacity:0;}
.ssdd-pcard.ssdd-show-light .ssdd-light-img{opacity:1;}
.ssdd-pcard-body{padding:5px 8px 7px;}
.ssdd-pcard-name{font-size:11px;font-weight:700;color:#0f172a;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.ssdd-pcard-meta{font-size:10px;color:#9ca3af;margin-top:1px;}
.ssdd-no-preview{grid-column:1/-1;font-size:12px;color:#9ca3af;padding:16px 0;text-align:center;}
/* Skeleton */
.ssdd-skeleton .ssdd-pcard-img-wrap{background:linear-gradient(90deg,#f0f0f0 25%,#e0e0e0 50%,#f0f0f0 75%);background-size:200% 100%;animation:ssdd-shimmer 1.4s infinite;}
@keyframes ssdd-shimmer{0%{background-position:200% 0}100%{background-position:-200% 0}}
.ssdd-sk-line{height:7px;background:#e9ecf0;border-radius:4px;margin-bottom:4px;}
.ssdd-sk-w80{width:80%;}
.ssdd-sk-w50{width:50%;}

.ssdd-divider{height:1px;background:#e9ecf0;margin:8px 0;flex-shrink:0;}
.ssdd-row-lbl{font-size:10px;font-weight:700;color:#9ca3af;text-transform:uppercase;letter-spacing:.07em;margin-bottom:6px;flex-shrink:0;}

/* Themes */
.ssdd-themes{display:flex;gap:6px;margin-bottom:8px;flex-shrink:0;}
.ssdd-theme{flex:1;background:#fff;border:1.5px solid #e5e7eb;border-radius:8px;padding:6px 10px;display:flex;align-items:center;gap:8px;cursor:pointer;transition:border-color .15s,background .15s;font-family:inherit;}
.ssdd-theme:hover{border-color:#2563eb;background:#f8f9ff;}
.ssdd-theme-active{border-color:#2563eb;background:#eff6ff;}
.ssdd-theme-circle{width:16px;height:16px;border-radius:50%;flex-shrink:0;}
.ssdd-theme-dark-circle{background:#0f172a;border:2px solid #334155;}
.ssdd-theme-light-circle{background:#fff;border:2px solid #e2e8f0;}
.ssdd-theme-name{font-size:12px;font-weight:700;color:#374151;display:block;}
.ssdd-theme-desc{font-size:10px;color:#9ca3af;display:block;}

/* Colors */
.ssdd-colors-row{display:flex;align-items:center;gap:5px;margin-bottom:10px;flex-shrink:0;}
.ssdd-cdot{width:13px;height:13px;border-radius:50%;box-shadow:0 0 0 1px rgba(0,0,0,.10);flex-shrink:0;display:inline-block;}
.ssdd-all-pill{margin-left:auto;background:#eff6ff;color:#2563eb;font-size:10px;font-weight:800;padding:2px 8px;border-radius:20px;}

/* Browse btn */
.ssdd-btns{flex-shrink:0;margin-top:auto;}
.ssdd-btn-p{background:#2563eb;color:#fff;border:none;border-radius:8px;padding:10px 14px;font-size:12px;font-weight:700;cursor:pointer;text-align:center;text-decoration:none;display:block;transition:background .15s;}
.ssdd-btn-p:hover{background:#1d4ed8;color:#fff;}
.ssdd-btn-full{width:100%;}

/* RIGHT */
.ssdd-right{background:#fff;padding:14px;display:flex;flex-direction:column;gap:2px;min-height:380px;height:auto;}
.ssdd-right-title{font-size:9px;font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:#94a3b8;margin-bottom:8px;}
.ssdd-qlink{display:flex;align-items:center;gap:10px;padding:7px 8px;border-radius:8px;cursor:pointer;text-decoration:none;color:inherit;transition:background .12s;}
.ssdd-qlink:hover{background:#f1f5f9;}
.ssdd-qlink-icon{width:28px;height:28px;border-radius:7px;display:flex;align-items:center;justify-content:center;font-size:13px;flex-shrink:0;}
.ssdd-qlink-name{font-size:12px;font-weight:600;color:#374151;display:block;}
.ssdd-qlink-sub{font-size:10px;color:#9ca3af;display:block;}
.ssdd-right-divider{height:1px;background:#f1f5f9;margin:8px 0;flex-shrink:0;}

/* FIX #1: $30 bundle badge — full width, replaces mega bundle, same flash anim as single-download.php */
.ssdd-bundle-badge{
    display:none; /* shown by JS */
    width:100%;
    align-items:center;
    gap:10px;
    background:#1a1f36;
    border:1.5px solid rgba(255,255,255,0.12);
    color:#fff!important;
    text-decoration:none!important;
    padding:10px 14px;
    border-radius:10px;
    position:relative;
    overflow:hidden;
    transition:transform .2s,box-shadow .2s;
    box-shadow:0 2px 12px rgba(0,0,0,.18);
    margin-top:auto;
}
.ssdd-bundle-badge::before{content:'';position:absolute;top:0;left:-75%;width:50%;height:100%;background:linear-gradient(90deg,transparent 0%,rgba(255,255,255,.18) 50%,transparent 100%);transform:skewX(-15deg);animation:ssdd-flash 2.8s ease-in-out infinite;}
@keyframes ssdd-flash{0%{left:-75%;opacity:0}10%{opacity:1}40%{left:130%;opacity:1}41%{opacity:0}100%{left:130%;opacity:0}}
.ssdd-bundle-badge:hover{transform:translateY(-2px);box-shadow:0 6px 20px rgba(0,0,0,.28);color:#fff!important;}
.ssdd-badge-icon{font-size:16px;flex-shrink:0;}
.ssdd-badge-text{display:flex;flex-direction:column;gap:1px;flex:1;}
.ssdd-badge-top{font-size:9px;font-weight:600;letter-spacing:.5px;opacity:.75;white-space:nowrap;text-transform:uppercase;}
.ssdd-badge-price{font-size:13px;font-weight:800;line-height:1;white-space:nowrap;}
.ssdd-badge-arrow{font-size:14px;opacity:.7;flex-shrink:0;transition:transform .2s;}
.ssdd-bundle-badge:hover .ssdd-badge-arrow{transform:translateX(3px);opacity:1;}

@media(max-width:768px){.ssdd-dropdown{display:none!important}.ssdd-arr{display:none}}


/* Hide old category nav — replaced by Decks mega dropdown */
.tkb-nav { display: none !important; }

.tkb-card-desc{font-size:12px;color:#6b7280;margin:0 0 6px;line-height:1.45;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;}

/* ════════════════════════════════════════════════════
   END SSDD v4
════════════════════════════════════════════════════ */

/* ── Floating Categories Button ── */
.tkb-float-cats {
    position: fixed;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    z-index: 997;
    background: #1a1f36;
    color: #fff;
    border: none;
    border-radius: 0 10px 10px 0;
    padding: 14px 10px;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 8px;
    cursor: pointer;
    box-shadow: 2px 2px 16px rgba(0,0,0,0.22);
    transition: background 0.15s, transform 0.2s, box-shadow 0.2s;
    font-family: inherit;
}
.tkb-float-cats:hover {
    background: #2563eb;
    transform: translateY(-50%) translateX(2px);
    box-shadow: 4px 4px 20px rgba(37,99,235,0.3);
}
.tkb-float-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    opacity: 0.9;
}
.tkb-float-label {
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.5px;
    text-transform: uppercase;
    writing-mode: vertical-rl;
    text-orientation: mixed;
    transform: rotate(180deg);
    opacity: 0.85;
    line-height: 1;
}
@keyframes tkb-float-pulse {
    0%   { box-shadow: 2px 2px 16px rgba(0,0,0,0.22); }
    40%  { box-shadow: 4px 2px 24px rgba(37,99,235,0.5); background: #2563eb; }
    100% { box-shadow: 2px 2px 16px rgba(0,0,0,0.22); }
}
.tkb-float-cats { animation: tkb-float-pulse 1.2s ease-out 1s 1 forwards; }
@media (max-width: 768px) { .tkb-float-cats { display: none; } }

/* Close button — top right of dropdown */
.ssdd-close-btn {
    position: absolute;
    top: 10px;
    right: 14px;
    display: inline-flex;
    align-items: center;
    gap: 5px;
    background: #f1f5f9;
    border: 1.5px solid #e2e8f0;
    border-radius: 7px;
    padding: 5px 10px;
    font-size: 12px;
    font-weight: 600;
    color: #374151;
    cursor: pointer;
    font-family: inherit;
    transition: background 0.15s, border-color 0.15s;
    z-index: 10;
}
.ssdd-close-btn:hover {
    background: #fee2e2;
    border-color: #fca5a5;
    color: #dc2626;
}
.ssdd-dropdown { position: fixed; } /* ensure absolute child works */