/* ==========================================================================
   DORINA MELE — Mbivendosje për WordPress / WooCommerce
   --------------------------------------------------------------------------
   Ngarkohet PAS /css/style.css. Detyra e tij:
     1. fsheh header-in dhe footer-in e temës twentytwentyfour
     2. bën sfondin transparent që rrjeti nervor të duket
     3. lë hapësirë sipër për header-in tonë të pezullt
   ========================================================================== */

/* ==========================================================================
   1. FSHIH PJESËT E TEMËS
   ========================================================================== */

body.dm-themed > header.wp-block-template-part,
body.dm-themed > footer.wp-block-template-part,
body.dm-themed .wp-site-blocks > header.wp-block-template-part,
body.dm-themed .wp-site-blocks > footer.wp-block-template-part {
  display: none !important;
}

/* Titulli i madh "Shop" i temës — e zëvendësojmë me tonin */
body.dm-themed .wp-block-query-title,
body.dm-themed .woocommerce-products-header__title {
  font-family: "Poppins", sans-serif;
  font-size: 34px;
  font-weight: 700;
  color: var(--ink, #14201a);
  text-align: center;
  margin: 0 0 10px;
}

/* ==========================================================================
   2. SFONDI — që rrjeti nervor të duket
   ========================================================================== */

body.dm-themed,
body.dm-themed .wp-site-blocks,
body.dm-themed .is-layout-constrained,
body.dm-themed main,
body.dm-themed .woocommerce {
  background: transparent !important;
}

/* .site-bg është position:fixed me z-index:-1 — sigurohemi që s'e mbulon askush */
body.dm-themed .site-bg {
  z-index: -1 !important;
}

body.dm-themed .wp-site-blocks {
  position: relative;
  z-index: 1;
}

/* ==========================================================================
   3. HAPËSIRË PËR HEADER-IN E PEZULLT
   .site-nav është fixed me top:16px dhe ~76px lartësi
   ========================================================================== */

body.dm-themed .wp-site-blocks {
  padding-top: 128px;
}

@media (max-width: 991px) {
  body.dm-themed .wp-site-blocks { padding-top: 108px; }
}

@media (max-width: 575px) {
  body.dm-themed .wp-site-blocks { padding-top: 96px; }
}

/* ==========================================================================
   4. GJERËSIA E PËRMBAJTJES — njësohet me .container e faqes
   ========================================================================== */

body.dm-themed .wp-site-blocks > main,
body.dm-themed .wp-block-group.is-layout-constrained > :where(:not(.alignleft):not(.alignright):not(.alignfull)) {
  max-width: 1200px;
  margin-left: auto;
  margin-right: auto;
}

body.dm-themed main {
  padding-left: 20px;
  padding-right: 20px;
  padding-bottom: 70px;
}

/* ==========================================================================
   5. FOOTER-I YNË — hiq hapësirën e tepërt të temës
   ========================================================================== */

body.dm-themed .site-footer {
  margin-top: 0;
}

/* footer-i ynë vjen nga wp_footer, pas .wp-site-blocks */
body.dm-themed .site-footer,
body.dm-themed .back-to-top {
  position: relative;
  z-index: 2;
}

body.dm-themed .back-to-top {
  position: fixed;
  z-index: 90;
}

/* ==========================================================================
   6. TIPOGRAFIA — të mos e mbizotërojë tema
   ========================================================================== */

body.dm-themed {
  font-family: "Rubik", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  color: var(--body, #4a564f);
}

body.dm-themed .site-header *,
body.dm-themed .site-footer * {
  box-sizing: border-box;
}

/* Tema vendos font-size me clamp() te disa blloqe — i lëmë, por
   sigurojmë që linqet tona të mos trashëgojnë ngjyrën e temës. */
body.dm-themed .site-header a,
body.dm-themed .site-footer a {
  text-decoration: none;
}

/* ==========================================================================
   7. NJOFTIMET E WOOCOMMERCE (shto në shportë, gabime)
   ========================================================================== */

body.dm-themed .woocommerce-message,
body.dm-themed .woocommerce-info,
body.dm-themed .woocommerce-error,
body.dm-themed .wc-block-components-notice-banner {
  border-radius: 12px;
  border: 1px solid var(--line, #e6ebe4);
  background: #fff;
  font-family: "Rubik", sans-serif;
}

body.dm-themed .wc-block-components-notice-banner.is-success {
  border-left: 4px solid var(--accent, #5aa326);
}

/* ==========================================================================
   8. SHPORTA DHE CHECKOUT — lexueshmëri mbi sfond transparent
   ========================================================================== */

body.dm-themed .wc-block-cart,
body.dm-themed .wc-block-checkout,
body.dm-themed .woocommerce-cart-form,
body.dm-themed .cart_totals,
body.dm-themed .woocommerce-checkout {
  background: #fff;
  border: 1px solid var(--line, #e6ebe4);
  border-radius: 16px;
  padding: 28px;
  box-shadow: 0 10px 30px rgba(31, 31, 44, 0.05);
}

/* ==========================================================================
   9. FAQJA E PRODUKTIT
   ========================================================================== */

body.dm-themed.single-product .wp-site-blocks > main {
  background: #fff;
  border: 1px solid var(--line, #e6ebe4);
  border-radius: 16px;
  padding: 34px;
  margin-top: 10px;
  box-shadow: 0 10px 30px rgba(31, 31, 44, 0.05);
}

@media (max-width: 575px) {
  body.dm-themed.single-product .wp-site-blocks > main { padding: 20px; border-radius: 12px; }
  body.dm-themed .wc-block-cart,
  body.dm-themed .wc-block-checkout { padding: 18px; }
}

/* ==========================================================================
   10. RREGULLIME TË VOGLA
   ========================================================================== */

/* Tema shton skip-link që del mbi header-in tonë */
body.dm-themed .skip-link:focus {
  z-index: 1200;
}

/* Menuja fullscreen duhet të mbulojë gjithçka */
body.dm-themed .fullscreen-menu {
  z-index: 1300;
}

/* Kur menuja është hapur, mos lejo skrollim pas saj */
body.dm-themed.menu-open {
  overflow: hidden;
}

/* ==========================================================================
   11. BUTONI I SHPORTËS NË HEADER
   ========================================================================== */

body.dm-themed .nav-cta-cart {
  position: relative;
  background: transparent;
  color: var(--ink, #14201a);
  border: 1.5px solid rgba(20, 32, 26, 0.14);
  box-shadow: none;
  padding: 11.5px 20px;
  gap: 8px;
}

body.dm-themed .nav-cta-cart:hover {
  background: var(--ink, #14201a);
  border-color: var(--ink, #14201a);
  color: #fff;
  box-shadow: 0 10px 22px rgba(20, 32, 26, 0.2);
}

body.dm-themed .nav-cta-cart i { font-size: 14px; }

/* numri i artikujve */
body.dm-themed .dm-cart-count {
  display: inline-grid;
  place-items: center;
  min-width: 21px;
  height: 21px;
  padding: 0 6px;
  border-radius: 999px;
  background: var(--accent, #5aa326);
  color: #fff;
  font-family: "Poppins", sans-serif;
  font-size: 11.5px;
  font-weight: 700;
  line-height: 1;
}

body.dm-themed .dm-cart-count.is-empty {
  display: none;
}

/* në ekrane të mesme fshihet fjala, mbetet ikona + numri */
@media (max-width: 1199px) {
  body.dm-themed .nav-cta-cart-label { display: none; }
  body.dm-themed .nav-cta-cart { padding: 11.5px 16px; }
}

@media (max-width: 991px) {
  /* butoni "Dyqani" fshihet, shporta mbetet — është më e rëndësishme */
  body.dm-themed .nav-cta-shop { display: none; }
  body.dm-themed .nav-cta-cart { display: inline-flex; }
}

/* shporta te menuja fullscreen */
body.dm-themed .fs-nav .dm-cart-count {
  margin-left: 6px;
  vertical-align: middle;
}

/* ==========================================================================
   12. NJOFTIMI PAS SHTIMIT NË SHPORTË
   ========================================================================== */

body.dm-themed .woocommerce-message {
  display: flex;
  align-items: center;
  gap: 14px;
  flex-wrap: wrap;
  padding: 16px 20px;
  border-left: 4px solid var(--accent, #5aa326);
  font-family: "Rubik", sans-serif;
  font-size: 15px;
}

body.dm-themed .woocommerce-message .button {
  margin-left: auto;
  padding: 10px 22px !important;
  border-radius: 50px !important;
  background: var(--accent, #5aa326) !important;
  color: #fff !important;
  font-family: "Poppins", sans-serif !important;
  font-size: 13.5px !important;
  font-weight: 600 !important;
  text-decoration: none;
}

body.dm-themed .woocommerce-message .button:hover {
  background: var(--accent-strong, #48831e) !important;
}