/* Generato da LM CSS Helper — https://dev.lulamerlo.it/css-helper */
:root{
	--lm-transition-speed: .25s;

	/* Tipografia */
	--lm-font-display: 'Kanit', sans-serif;
	--lm-font-heading: 'Kanit', sans-serif;
	--lm-font-body: 'Martel Sans', sans-serif;
	--lm-fw-regular: 400;
	--lm-fw-medium: 600;
	--lm-fw-bold: 700;
	--lm-lh-tight: 1.2;
	--lm-lh-normal: 1.5;
	--lm-lh-loose: 1.8;
	--lm-font-xxs: 8px;
	--lm-font-xs: 12px;
	--lm-font-sm: 14px;
	--lm-font-md: 17px;
	--lm-font-lg: 24px;
	--lm-font-xl: 48px;
	--lm-font-xxl: 64px;
	--lm-letter-spacing-wide: 0.06em;

	/* Spaziatura */
	--lm-space-xxs: 4px;
	--lm-space-xs: 8px;
	--lm-space-sm: 12px;
	--lm-space-md: 20px;
	--lm-space-lg: 32px;
	--lm-space-xl: 48px;
	--lm-space-xxl: 80px;

	/* Raggi */
	--lm-r-xxs: 2px;
	--lm-r-xs: 4px;
	--lm-r-sm: 8px;
	--lm-r-md: 12px;
	--lm-r-lg: 16px;
	--lm-r-xl: 24px;
	--lm-r-xxl: 36px;
	--lm-r-round: 999px;

	/* Ombre / layout / effetti */
	--lm-shadow-sm: 0 1px 2px rgba(10,6,32,.08);
	--lm-shadow-md: 0 4px 12px rgba(10,6,32,.12);
	--lm-shadow-lg: 0 12px 32px rgba(10,6,32,.18);
	--lm-container: 1200px;
	--lm-max-width-content: 65ch;
	--lm-aspect-card: 4/3;
	--lm-icon-sm: 16px;
	--lm-icon-md: 20px;
	--lm-icon-lg: 28px;
	--lm-backdrop-blur: 8px;
	--lm-gradient-overlay: linear-gradient(180deg, rgba(0,0,0,0) 0%, rgba(0,0,0,.6) 100%);
	--lm-easing-standard: cubic-bezier(.4,0,.2,1);
	--lm-z-dropdown: 100;
	--lm-z-modal: 1000;
	--lm-z-toast: 2000;
	--lm-text-on-light: #0A0620;
	--lm-text-on-dark: #FFFFFF;

	/* Semantici (fissi) */
	--lm-success: #1ECFAA;
	--lm-warning: #EAA020;
	--lm-danger: #F05070;
	--lm-info: #366AE2;
	--lm-outline-error: #F05070;

	/* Tema chiaro (default) */
	--lm-primary: #FF5A00;
	--lm-secondary: #271033;
	--lm-tertiary: #DBFF00;
	--lm-bg-base: #F6F4F2;
	--lm-success-bg: #E6F8F3;
	--lm-danger-bg: #FBEBED;
	--lm-bg-surface: #FCFCFB;
	--lm-text-primary: #140C08;
	--lm-text-secondary: #7D4B32;
	--lm-border: #E3DDD7;
	--lm-selection: #93351A;
	--lm-primary-hover: #C24400;
	--lm-secondary-hover: #030104;
	--lm-tertiary-hover: #A6C200;
	--lm-accent: #0053E6;
	--lm-accent-hover: #003DA9;
	--lm-over-primary: #FFFFFF;
	--lm-over-secondary: #FFFFFF;
	--lm-over-tertiary: #FFFFFF;
	--lm-over-accent: #FFFFFF;
	--lm-bg-elevated: #F7E6DC;
	--lm-bg-elevated-2: #F7DBCB;
	--lm-bg-overlay: rgba(102,36,0,0.5);
	--lm-cta-surface-neutral: #F7E6DC;
	--lm-cta-surface-light: #FAF0EB;
	--lm-cta-surface-dark: #EECBB7;
	--lm-text-muted: #C08162;
	--lm-text-disabled: #D4A993;
	--lm-link-visited: #CF5411;
	--lm-border-2: #D0C6BC;
	--lm-divider: #EDE9E5;
	--lm-focus-ring: #FF5A00;
	--lm-input-bg: #FCFCFB;
	--lm-input-border-focus: #FF5A00;
	--lm-placeholder: #C8A48F;
	--lm-tooltip-bg: #140C08;
	--lm-tooltip-text: #FFFFFF;
	--lm-skeleton: #F7DBCB;
	--lm-badge-neutral: #F7DBCB;
	--lm-code-bg: #FAF1EC;
	--lm-gradient: linear-gradient(17deg, #FF5A00 0%, #271033 56%, #DBFF00 100%);
}
html.dark-mode, html[data-theme="dark"]{
	--lm-primary: #FF9459;
	--lm-secondary: #5D207C;
	--lm-tertiary: #E8FF59;
	--lm-bg-base: #15110C;
	--lm-success-bg: #214031;
	--lm-danger-bg: #4B2626;
	--lm-bg-surface: #221C13;
	--lm-text-primary: #F4E9E3;
	--lm-text-secondary: #CC9A7E;
	--lm-border: #564631;
	--lm-selection: #AE5A6B;
	--lm-primary-hover: #FFB58C;
	--lm-secondary-hover: #7B2AA5;
	--lm-tertiary-hover: #EFFF8C;
	--lm-accent: #A6C6FF;
	--lm-accent-hover: #D9E7FF;
	--lm-over-primary: #F4E9E3;
	--lm-over-secondary: #FFFFFF;
	--lm-over-tertiary: #F4E9E3;
	--lm-over-accent: #F4E9E3;
	--lm-bg-elevated: #2A1D13;
	--lm-bg-elevated-2: #3A2618;
	--lm-bg-overlay: rgba(0,0,0,0.55);
	--lm-cta-surface-neutral: #2A1D13;
	--lm-cta-surface-light: #3D2A1C;
	--lm-cta-surface-dark: #0A0705;
	--lm-text-muted: #9F603E;
	--lm-text-disabled: #70442C;
	--lm-link-visited: #F8B08A;
	--lm-border-2: #7D6547;
	--lm-divider: #362C1F;
	--lm-focus-ring: #FF9459;
	--lm-input-bg: #241C13;
	--lm-input-border-focus: #FF9459;
	--lm-placeholder: #8E6343;
	--lm-tooltip-bg: #F4E9E3;
	--lm-tooltip-text: #0A0620;
	--lm-skeleton: #3A2618;
	--lm-badge-neutral: #3A2618;
	--lm-code-bg: #261D13;
	--lm-gradient: linear-gradient(17deg, #FF9459 0%, #5D207C 56%, #E8FF59 100%);
}

/* ===== CSS personalizzato ===== */
.lm-griglia {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
    gap: 1.5rem;
}
@media (max-width: 600px) {
    .lm-griglia { grid-template-columns: 1fr; }
}

/* ---- card ---- */
.lm-card {
    background: var(--lm-bg-surface);
    border-radius: var(--lm-r-md);
    padding: var(--lm-space-sm);
    display: flex;
    flex-direction: column;
    gap: .75rem;
    border: 2px solid var(--lm-border);
}
.lm-card.lm-nascosta {
    display: none;
}

/* ---- riga badge (durata + importanza affiancati) ---- */
.lm-card__badges {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: .4rem;
}

/* ---- badge base ---- */
.lm-badge {
    display: inline-block;
    font-size: var(--lm-font-xs);
    font-weight: var(--lm-fw-bold);
    padding: var(--lm-space-xxs);
    border-radius: var(--lm-r-xs);
    color: var(--lm-text-muted);
}
.lm-badge--durata { background: var(--lm-bg-elevated-2); color:var(--lm-primary)}

/* badge importanza — colore per livello */
.lm-badge--imp-1 { background: var(--lm-bg-elevated-2); }
.lm-badge--imp-2 { background: var(--lm-bg-elevated);}
.lm-badge--imp-3, .lm-badge--imp-4, .lm-badge--imp-5 { background: var(--lm-bg-surface); }

/* ---- testi ---- */
.lm-card__titolo {
    font-size: var(--lm-font-md);
    font-weight: var(--lm-fw-bold);
    color: var(--lm-text-primary);
    margin: 0;
	padding: var(--lm-space-xxs) 0;
}
.lm-card__sottotitolo {
    font-size: var(--lm-font-xs);
    color: var(--lm-text-secondary);
    margin: 0;
	padding: var(--lm-space-xxs) 0;
}
.lm-card__descrizione {
    font-size: var(--lm-font-sm);
    color: var(--lm-text-primary);
    margin: 0;
	padding: var(--lm-space-xxs) 0 var(--lm-space-sm) 0;
    flex-grow: 1;
}

/* ---- categorie ---- */
.lm-card__categorie {
    display: flex;
    flex-wrap: wrap;
    gap: .35rem;
	border-radius: var(--lm-r-xs)
}
.lm-tag {
    background: var(--lm-badge-neutral);
    color: var(--lm-primary);
    font-size: var(--lm-font-xs);
    font-weight: var(--lm-fw-bold);
    padding: var(--lm-space-xxs) var(--lm-space-xs);
    border-radius: var(--lm-r-xs);
	text-transform:uppercase;
}

/* ---- footer card: CTA primario + condividi ---- */
.lm-card__footer {
    display: flex;
    align-items: center;
    gap: .6rem;
    flex-wrap: wrap;
    margin-top: auto;
}

/* CTA primario */
.lm-cta {
    display: inline-block;
    background: var(--lm-primary);
    color: var(--lm-text-on-dark) !important;
    font-weight: var(--lm-fw-bold);
    font-size: var(--lm-font-md);
	text-transform:uppercase;
    padding: .55em 1.2em;
    border-radius: var(--lm-r-sm);
    text-decoration: none !important;
    transition: background .15s;
    white-space: nowrap;
}

.lm-cta:hover { background: var(--lm-link-visited); color: var(--lm-text-on-dark) !important; }

/* Pulsante condividi */
.lm-condividi {
    display: inline-flex;
    align-items: center;
    gap: .3em;
    background: transparent;
    border: 0;
    color: var(--lm-text-muted);
    font-size: var(--lm-font-xs);
    font-weight: var(--lm-fw-regular);
    padding: .45em .9em;
    border-radius: var(--lm-r-xxs);
    cursor: pointer;
    transition: border-color .15s, color .15s, background .15s;
    white-space: nowrap;
    line-height: 1;
}
.lm-condividi svg {
    width: 14px; height: 14px;
    flex-shrink: 0;
    stroke: currentColor;
    fill: none;
    stroke-width: 2;
    stroke-linecap: round;
    stroke-linejoin: round;
}
.lm-condividi:hover {
    border-color:var(--lm-bg-overlay);
    color: var(--lm-text-secondary);
}
.lm-condividi.copiato {
    border-color: var(--lm-success);
    color: var(--lm-success);
    background: var(--lm-bg-base);
}

/* ---- filtri ---- */
.lm-filtri {
    display: flex;
    flex-wrap: wrap;
    gap: var(--lm-space-sm);
    margin-bottom: var(--lm-space-sm);
}
.lm-filtri__btn {
    border: 1px solid var(--lm-primary);
    cursor: pointer;
    text-decoration: none!important;
    transition: background .15s, border-color .15s;
    display: inline-block;
	background: var(--lm-badge-neutral);
    font-size: var(--lm-font-xs);
    font-weight: var(--lm-fw-bold);
    padding: var(--lm-space-xxs) var(--lm-space-xs);
    border-radius: var(--lm-r-xs);
	text-transform:uppercase;
	color: var(--lm-primary);
	text-decoration:none;
}
.lm-filtri__btn:hover,
.lm-filtri__btn.attivo {
    background: var(--lm-primary);
    border-color: var(--lm-primary);
	color: var(--lm-text-on-dark)!important;
}


/* ---- intestazione griglia ---- */
.lm-griglia__titolo    { margin-bottom: .25rem; }
.lm-griglia__sottotitolo { margin-top: 0; color: var(--lm-text-primary); font-size: var(--lm-font-sm); }

/* messaggio nessun risultato (gestito da JS) */
.lm-nessun-risultato {
    display: none;
    grid-column: 1 / -1;
    text-align: center;
    padding: 2rem;
    color: var(--lm-text-disabled);
    font-size: var(--lm-font-sm);
}

/* ---- vista singola ---- */
.lm-card--single {
    max-width: 760px;
    padding: 2rem;
    gap: 1rem;
}
.lm-card--single .lm-card__titolo  { font-size: 1.5rem; }
.lm-card--single .lm-card__descrizione { font-size: 1rem; }

.lm-card__thumb { margin-bottom: .5rem; }
.lm-card__img   { width: 100%; height: auto; border-radius: var(--lm-r-sm); display: block; }