/*
-- nom: state.css --
-- llibreria: loT --
-- grup: Engine --
-- autor: A.Moseguí / TT22 --
-- versió: 26.1.0 --
-- descripció: Punt únic per als states. --
-- dependència: init.css + th-core.css + th-plt.css --
*/

/* TOKENS */
:root {
    /* DISABLED */
    --state-disabled-opacity: var(--OpacityMedium);
    /* FOCUS VISIBLE */
    --state-focus-width: var(--bw-sm);
    --state-focus-offset: var(--sp-sm);
    --state-focus-color: var(--cl-focus-ring);
    /* BUSY */
    --state-busy-opacity: var(--OpacityHigh);
    --state-busy-cursor: progress;
    /* HOVER — RELIEF */
    --state-hover-relief-border-w: var(--bw-sm);
    --state-hover-relief-transform: scale(1.02);
    /* HOVER — BLOOM */
    --state-hover-bloom-transform: scale(1.2);
    /* ACTIVE — RELIEF */
    --state-active-relief-border-w: var(--bw-md);
    --state-active-relief-transform: scale(0.98);
    /* PRESSED — MARKED */
    --state-pressed-marked-border-w: var(--bw-md);
}

/* TOKENS DE TEMA (ombres)
   Deriven de --shadow-*, que varia per tema. Es declaren a :root i també a
   cada element amb [data-theme] perquè es tornin a resoldre allà on el tema
   canvia localment (inversió amb color--invert). Si només visquessin al :root,
   quedarien congelats amb el valor del tema global. */
:root,
[data-theme] {
    /* HOVER — RELIEF */
    --state-hover-relief-shadow: var(--shadow-sm);
    /* ACTIVE — RELIEF */
    --state-active-relief-shadow: var(--shadow-md);
    /* PRESSED — MARKED */
    --state-pressed-marked-shadow: var(--shadow-md);
}

/* DISABLED */
:disabled,
[aria-disabled="true"] {
    cursor: not-allowed;
    pointer-events: none;
    user-select: none;
    opacity: var(--state-disabled-opacity);
}
/* FOCUS VISIBLE */
:focus-visible {
    outline: var(--state-focus-width) solid var(--state-focus-color);
    outline-offset: var(--state-focus-offset);
}
/* HIDDEN */
[hidden] {
    display: none;
}
/* CURRENT */
[aria-current]:not([aria-current="false"]) {
    cursor: default;
}
/* BUSY */
[aria-busy="true"] {
    cursor: var(--state-busy-cursor);
    opacity: var(--state-busy-opacity);
}
/* HOVER */
/* es consumeixen variables del :root directament des dels components */
/* ACTIVE */
/* es consumeixen variables del :root directament des dels components */
/* SELECTED */
[aria-selected="true"] {
    cursor: default;
}