/* Player unico della webcam (tools/webcam/embed): riempie l'iframe, colori del sito tossignano.it */
:root { --primary: #1e40af; --primary-light: #3b82f6; --errore: #fecaca; }
* { box-sizing: border-box; }
html, body { margin: 0; height: 100%; background: #0b1220; font-family: system-ui, -apple-system, "Segoe UI", sans-serif; }
.player { position: relative; width: 100%; height: 100%; overflow: hidden; }
.video { display: block; width: 100%; height: 100%; object-fit: cover; background: #0b1220; }
.overlay { position: absolute; inset: 0; display: flex; flex-direction: column; align-items: center; justify-content: center;
           gap: .8rem; padding: 1rem; pointer-events: none; text-align: center; }
.status:empty { display: none; }
.status { max-width: 32rem; padding: .5rem 1rem; border-radius: .6rem; background: rgba(11, 18, 32, .72); color: #fff;
          font-weight: 600; font-size: clamp(.85rem, 2.6vw, 1.05rem); line-height: 1.35; }
.status.is-error { color: var(--errore); }
.refresh { pointer-events: auto; appearance: none; border: 0; cursor: pointer; padding: .65rem 1.5rem; border-radius: .6rem;
           background: linear-gradient(135deg, var(--primary), var(--primary-light)); color: #fff; font: inherit; font-weight: 600;
           box-shadow: 0 2px 10px rgba(0, 0, 0, .35); }
.refresh:hover { filter: brightness(1.08); }
.refresh:focus-visible { outline: 3px solid #fff; outline-offset: 2px; }
/* watermark: in basso a destra come nell'immagine per Windy (in basso a sinistra c'è il logo tapo); quando compaiono i
   controlli nativi del video (mouse sopra o tocco) sale, per non coprire il pulsante a schermo intero */
.watermark { position: absolute; right: 2.2%; bottom: 3%; transition: bottom .2s ease; color: #fff; opacity: .92; text-decoration: none; font-weight: 700;
             font-size: clamp(.8rem, 3.4vw, 1.7rem); letter-spacing: .01em; text-shadow: 0 1px 3px rgba(0, 0, 0, .85), 0 0 8px rgba(0, 0, 0, .5); }
.watermark:hover { opacity: 1; text-decoration: underline; }
.player:hover .watermark, .player:focus-within .watermark { bottom: 13%; }
