/* 
Theme Name: Como Lighting DB
Description: Como Lighting DB theme
Author: Minuart
Author URI: https://minuart.it/
Template: hello-elementor
Version: 2.0.0
Text Domain: como-lighting-db
*/

:root {
  /* Dimensioni */
  --sidebar-width: 300px;
  --mobile-header-height: 60px;

  /* Colori */
  --sidebar-bg: #ffffff;
  --backdrop-color: rgba(0, 0, 0, 0.5);

  /* Animazioni */
  --transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

/* --- STILI DESKTOP (>= 1025px) --- */
@media (min-width: 1025px) {

  /* 1. Sidebar Fissa e Solida */
  .app-sidebar {
    position: fixed;
    top: 0;
    left: 0;
    width: var(--sidebar-width);
    height: 100vh;
    background: var(--sidebar-bg);
    border-right: 1px solid #eee;
    z-index: 100;
    overflow-y: auto;
    /* Scroll se il contenuto è alto */
  }

  /* 2. Spostamento del Body */
  /* Spostiamo tutto il contenuto del sito a destra */
  body:not(.page-id-75) {
    margin-left: var(--sidebar-width) !important;
    width: auto !important;
  }

  /* 3. Nascondi elementi Mobile nella sidebar */
  .mobile-close-btn {
    display: none !important;
  }
}

/* --- STILI MOBILE (< 1025px) --- */
@media (max-width: 1024px) {

  /* 1. Reset del Body */
  body {
    margin-left: 0 !important;
    padding-top: 0 !important;
    /* Gestito dallo sticky header di Elementor */
  }

  /* 2. Mobile Top Bar (Styling extra se serve) */
  .mobile-top-bar {
    background: #fff;
    border-bottom: 1px solid #eee;
    z-index: 90;
    /* Assicurati che in Elementor sia impostata altezza minima se serve */
  }
}

.download-file-button {
  display: flex;
  width: 100%;
  border: 1px solid #000;
  padding-block: 5px;
  padding-inline: 10px;
  color: var(--e-global-color-primary);
  justify-content: space-between;
  align-items: center;
  transition: all ease-in-out .3s;
}

.download-file-button:hover {
  background-color: var(--e-global-color-primary);
  color: #fff;
}

.download-file-button::after {
  content: "";
  width: 1.2em;
  height: 1.2em;
  display: inline-block;
  background-color: currentColor;

  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12.032 19a2.991 2.991 0 0 0 2.122-.878L18.073 14.2 16.659 12.79l-3.633 3.634L13 0 11 0l.026 16.408-3.62-3.62L5.992 14.2l3.919 3.919A2.992 2.992 0 0 0 12.032 19Z M22 16v5a1 1 0 0 1-1 1H3a1 1 0 0 1-1-1V16H0v5a3 3 0 0 0 3 3H21a3 3 0 0 0 3-3V16Z'/%3E%3C/svg%3E");
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12.032 19a2.991 2.991 0 0 0 2.122-.878L18.073 14.2 16.659 12.79l-3.633 3.634L13 0 11 0l.026 16.408-3.62-3.62L5.992 14.2l3.919 3.919A2.992 2.992 0 0 0 12.032 19Z M22 16v5a1 1 0 0 1-1 1H3a1 1 0 0 1-1-1V16H0v5a3 3 0 0 0 3 3H21a3 3 0 0 0 3-3V16Z'/%3E%3C/svg%3E");

  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-position: center;
  mask-position: center;
  -webkit-mask-size: contain;
  mask-size: contain;
}