/* 
 * LEDSTRIP v1.0.1 FIX - Real LED Display Effect
 * Google Fonts importato via CSS per evitare errori remote in PS
 */
@import url('https://fonts.googleapis.com/css2?family=VT323&family=Orbitron:wght@700;900&family=Share+Tech+Mono&family=Courier+Prime:wght@700&display=swap');

.ledstrip-wrapper {
    width: 100vw;
    max-width: 100vw;
    height: 45px;
    min-height: 40px;
    max-height: 50px;
    position: relative;
    left: 50%;
    right: 50%;
    margin-left: -50vw;
    margin-right: -50vw;
    background: var(--led-bg, #0a0a0a);
    overflow: hidden;
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 9998;
    box-sizing: border-box;
    border-top: 1px solid #1a1a1a;
    border-bottom: 1px solid #1a1a1a;
    box-shadow: inset 0 0 20px rgba(0,0,0,0.9), 0 2px 10px rgba(0,0,0,0.5);
    line-height: 1;
    user-select: none;
}

.ledstrip-inner {
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    overflow: hidden;
    position: relative;
    z-index: 1;
}

.ledstrip-track {
    display: flex;
    align-items: center;
    white-space: nowrap;
    will-change: transform;
}

.ledstrip-text {
    display: inline-block;
    white-space: nowrap;
    padding-right: 100px;
    color: var(--led-color, #00ffcc);
    font-family: var(--led-font-family, 'VT323', monospace);
    font-size: var(--led-font-size, 32px);
    font-weight: var(--led-font-weight, 700);
    letter-spacing: var(--led-letter-spacing, 2px);
    line-height: 1;
    text-shadow: 
        0 0 calc(var(--led-glow, 8px) * 0.5) currentColor,
        0 0 var(--led-glow, 8px) currentColor,
        0 0 calc(var(--led-glow, 8px) * 1.8) currentColor;
    -webkit-font-smoothing: none;
    -moz-osx-font-smoothing: grayscale;
    transform: translateZ(0);
}

.ledstrip-wrapper.dot-effect::after {
    content: "";
    position: absolute;
    inset: 0;
    background-image: radial-gradient(ellipse at center, rgba(0,0,0,0.85) 0.8px, transparent 1.2px);
    background-size: 3.2px 3.2px;
    pointer-events: none;
    z-index: 3;
    opacity: 0.55;
}

.ledstrip-scanlines {
    position: absolute;
    inset: 0;
    background: repeating-linear-gradient(0deg,rgba(0,0,0,0.15) 0px,rgba(0,0,0,0.15) 1px,transparent 1px,transparent 2px);
    pointer-events: none;
    z-index: 4;
    opacity: 0.6;
}

.ledstrip-vignette {
    position: absolute;
    inset: 0;
    background: radial-gradient(ellipse at center, transparent 60%, rgba(0,0,0,0.4) 100%);
    pointer-events: none;
    z-index: 2;
}

.ledstrip-wrapper.color-mode-supermarket .ledstrip-text span {
    text-shadow: 0 0 calc(var(--led-glow) * 0.5) currentColor, 0 0 var(--led-glow) currentColor, 0 0 calc(var(--led-glow) * 2) currentColor;
    display: inline-block;
}

.ledstrip-wrapper.color-mode-rainbow .ledstrip-text {
    background: linear-gradient(90deg,#ff0000,#ff7f00,#ffff00,#00ff00,#00ffff,#0000ff,#8b00ff,#ff0000);
    background-size: 200% 100%;
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    animation: rainbow-shift 3s linear infinite;
    filter: drop-shadow(0 0 6px rgba(255,255,255,0.3));
}

@keyframes rainbow-shift {0%{background-position:0% 50%}100%{background-position:200% 50%}}

.ledstrip-wrapper.color-mode-gradient .ledstrip-text {
    background: linear-gradient(90deg,#00f7ff,#ff00c8,#ffec00);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
}

.ledstrip-wrapper.animation-scroll-left .ledstrip-track {animation: marquee-left var(--led-speed,20s) linear infinite}
.ledstrip-wrapper.animation-scroll-right .ledstrip-track {animation: marquee-right var(--led-speed,20s) linear infinite}
.ledstrip-wrapper.animation-scroll-alternate .ledstrip-track {animation: marquee-alternate var(--led-speed,20s) ease-in-out infinite}
.ledstrip-wrapper.animation-static .ledstrip-inner {justify-content:center}
.ledstrip-wrapper.animation-static .ledstrip-track {animation:none;justify-content:center;width:100%}
.ledstrip-wrapper.animation-static .ledstrip-text {padding-right:0;text-align:center;width:100%}
.ledstrip-wrapper.animation-blink .ledstrip-text {animation: led-blink 1s step-end infinite}
.ledstrip-wrapper.animation-flicker .ledstrip-text {animation: led-flicker 0.15s infinite alternate}
.ledstrip-wrapper.animation-wave .ledstrip-text span {display:inline-block;animation: led-wave 1.2s ease-in-out infinite}

@keyframes marquee-left {0%{transform:translateX(100vw)}100%{transform:translateX(-100%)}}
@keyframes marquee-right {0%{transform:translateX(-100%)}100%{transform:translateX(100vw)}}
@keyframes marquee-alternate {0%{transform:translateX(100vw)}50%{transform:translateX(-100%)}100%{transform:translateX(100vw)}}
@keyframes led-blink {0%,49%{opacity:1}50%,100%{opacity:0.15}}
@keyframes led-flicker {0%{opacity:1}20%{opacity:0.85}40%{opacity:1}60%{opacity:0.9}80%{opacity:1}100%{opacity:0.95}}
@keyframes led-wave {0%,100%{transform:translateY(0)}50%{transform:translateY(-4px)}}

.ledstrip-close {
    position:absolute;right:8px;top:50%;transform:translateY(-50%);
    background:rgba(255,255,255,0.1);border:1px solid rgba(255,255,255,0.2);
    color:#fff;width:24px;height:24px;border-radius:50%;cursor:pointer;z-index:10;
    font-size:16px;line-height:1;display:flex;align-items:center;justify-content:center;transition:all 0.2s;
}
.ledstrip-close:hover{background:rgba(255,255,255,0.25)}
@media (max-width:768px){.ledstrip-text{font-size:22px !important}}
.ledstrip-wrapper.ledstrip-hidden{display:none !important}