/* Oznaczenia treści AI — bazowe style z motywu Reme (motyw może nadpisać). Klasy modyfikatorów na kontenerze (.usp-center-aibadge, -gen, -mod) nadaje filtr render_block_core/image; poniżej style widocznej etykiety. */ figure.usp-center-aibadge, figure.usp-center-aibadge-gen, figure.usp-center-aibadge-mod { position: relative; } .usp-center-aibadge__sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; } /* Odstęp od krawędzi kadru — modyfikatory (--hero, --section) zmieniają tylko tę zmienną, róg wybiera klasa pozycji z ustawień pluginu. */ .usp-center-aibadge__label { --usp-center-aibadge-offset: 12px; position: absolute; z-index: 2; top: auto; right: var(--usp-center-aibadge-offset); bottom: var(--usp-center-aibadge-offset); left: auto; max-width: calc(100% - 2 * var(--usp-center-aibadge-offset)); margin: 0; padding: 4px 10px; color: #000; font-size: 12px; line-height: 1.4; /* Półprzezroczysta podkładka — czarny tekst wprost na zdjęciu bywa nieczytelny na ciemnych kadrach. */ background-color: rgba(255, 255, 255, 0.75); border-radius: 4px; backdrop-filter: blur(2px); pointer-events: none; } /* Wariant kolorystyczny — ustawienie „Label style" albo „Wygląd etykiety AI" w karcie pliku. Bez klasy obowiązuje wygląd jasny (jak wyżej). */ .usp-center-aibadge__label--light { color: #000; background-color: rgba(255, 255, 255, 0.75); } .usp-center-aibadge__label--dark { color: #fff; background-color: rgba(0, 0, 0, 0.6); } .usp-center-aibadge__label--hero { --usp-center-aibadge-offset: 20px; } .usp-center-aibadge__label--section { --usp-center-aibadge-offset: 16px; } /* Pozycja etykiety — ustawienie „Label position" (USP.Center -> Settings -> AI Badge), domyślnie prawy dolny róg. */ .usp-center-aibadge__label--top-left { top: var(--usp-center-aibadge-offset); right: auto; bottom: auto; left: var(--usp-center-aibadge-offset); } .usp-center-aibadge__label--top-right { top: var(--usp-center-aibadge-offset); right: var(--usp-center-aibadge-offset); bottom: auto; left: auto; } .usp-center-aibadge__label--bottom-left { top: auto; right: auto; bottom: var(--usp-center-aibadge-offset); left: var(--usp-center-aibadge-offset); } .usp-center-aibadge__label--bottom-right { top: auto; right: var(--usp-center-aibadge-offset); bottom: var(--usp-center-aibadge-offset); left: auto; } /* Wideo: zawsze prawy górny róg — dół zajmuje pasek sterowania odtwarzacza; reguła stoi za klasami pozycji, więc nadpisuje ustawienie. */ .usp-center-aibadge__label--video { top: 24px; right: 24px; bottom: auto; left: auto; } @media (min-width: 1200px) { .usp-center-aibadge__label--video { top: 36px; right: 36px; } } /* Automatyczne etykiety (ai-badge-front.js): kontener w o zerowym rozmiarze, nakładki pozycjonowane po geometrii obrazu, etykieta wewnątrz jak w motywie. */ .usp-center-aibadge-overlays { position: absolute; top: 0; left: 0; width: 0; height: 0; overflow: visible; z-index: 1; } .usp-center-aibadge-overlay { position: absolute; pointer-events: none; } .usp-center-aibadge-overlay[hidden] { display: none; } /* Bloki core/image — overlay nie ma sensu, napis idzie pod obrazem. */ .usp-center-aibadge__label--block { position: static; max-width: none; margin-top: 8px; padding: 0; background: none; backdrop-filter: none; }