/* 
-- nom: sign.css - signe o rètol - unió d'imatge i significat --
-- framework: loT --
-- grup: Components --
-- autor: A.Moseguí / TT22 --
-- versió: 26.1.0 --
-- descripció: Composició de 2 o 3 items (icona i/o títol) en línia. Variants de mida del contenidor. --
-- dependència: init.css --
*/

:root {
    --sign-size-l: 90%;
    --sign-size-m: 80%; /* default */
    --sign-size-s: 70%;
    --sign-size-6v: clamp(2.5rem, 6vw, 4rem);
    --sign-size-4v: clamp(2rem, 4vw, 3rem);
    --sign-size-3v: clamp(1.5rem, 3vw, 2rem);

    --sign-icon-size: 90%;
}

/* 👉 BASE */
.sign {
    display: flex;
    align-items: center;
    gap: var(--sp-lg);
    height: var(--sign-size-m);
    width: 100%;
    overflow: hidden;
}

/* 👉 VARIANTS DE MIDA DEL CONTENIDOR */
.sign--size-l  { height: var(--sign-size-l); }
.sign--size-m  { height: var(--sign-size-m); }
.sign--size-s  { height: var(--sign-size-s); }
.sign--size-6v { height: var(--sign-size-6v); }
.sign--size-4v { height: var(--sign-size-4v); }
.sign--size-3v { height: var(--sign-size-3v); }

/* 👉 SLOT ICONA */
.sign__icon {
    display: grid;
    place-items: center;
    block-size: var(--sign-icon-size);
    aspect-ratio: 1;
    flex-shrink: 0;
}

/* 👉 SLOT TEXT */
.sign__text {
    flex: 1;
    min-width: 0;
}