/**
 * Advanced Shadow System — Inset Shadows
 *
 * Recessed/well effect presets.
 */

/* ==========================================================================
   Inset
   ========================================================================== */

.shadow-fx-inset {
    box-shadow:
        inset 0 calc(2px * var(--shadow-fx-scale, 1)) calc(4px * var(--shadow-fx-scale, 1)) color-mix(in oklch, var(--color-base-content) 10%, transparent),
        inset 0 calc(-1px * var(--shadow-fx-scale, 1)) calc(2px * var(--shadow-fx-scale, 1)) color-mix(in oklch, var(--color-base-content) 5%, transparent);
}

.shadow-fx-sm.shadow-fx-inset {
    box-shadow:
        inset 0 calc(1px * var(--shadow-fx-scale, 1)) calc(2px * var(--shadow-fx-scale, 1)) color-mix(in oklch, var(--color-base-content) 8%, transparent);
}

.shadow-fx-lg.shadow-fx-inset {
    box-shadow:
        inset 0 calc(3px * var(--shadow-fx-scale, 1)) calc(6px * var(--shadow-fx-scale, 1)) color-mix(in oklch, var(--color-base-content) 12%, transparent),
        inset 0 calc(-1px * var(--shadow-fx-scale, 1)) calc(3px * var(--shadow-fx-scale, 1)) color-mix(in oklch, var(--color-base-content) 6%, transparent);
}

/* ==========================================================================
   Inset Deep
   ========================================================================== */

.shadow-fx-inset-deep {
    box-shadow:
        inset 0 calc(4px * var(--shadow-fx-scale, 1)) calc(8px * var(--shadow-fx-scale, 1)) color-mix(in oklch, var(--color-base-content) 15%, transparent),
        inset 0 calc(-2px * var(--shadow-fx-scale, 1)) calc(4px * var(--shadow-fx-scale, 1)) color-mix(in oklch, var(--color-base-content) 8%, transparent),
        inset 0 0 0 calc(1px * var(--shadow-fx-scale, 1)) color-mix(in oklch, var(--color-base-content) 5%, transparent);
}

.shadow-fx-sm.shadow-fx-inset-deep {
    box-shadow:
        inset 0 calc(2px * var(--shadow-fx-scale, 1)) calc(4px * var(--shadow-fx-scale, 1)) color-mix(in oklch, var(--color-base-content) 12%, transparent),
        inset 0 calc(-1px * var(--shadow-fx-scale, 1)) calc(2px * var(--shadow-fx-scale, 1)) color-mix(in oklch, var(--color-base-content) 6%, transparent);
}

.shadow-fx-lg.shadow-fx-inset-deep {
    box-shadow:
        inset 0 calc(6px * var(--shadow-fx-scale, 1)) calc(12px * var(--shadow-fx-scale, 1)) color-mix(in oklch, var(--color-base-content) 18%, transparent),
        inset 0 calc(-3px * var(--shadow-fx-scale, 1)) calc(6px * var(--shadow-fx-scale, 1)) color-mix(in oklch, var(--color-base-content) 10%, transparent),
        inset 0 0 0 calc(1px * var(--shadow-fx-scale, 1)) color-mix(in oklch, var(--color-base-content) 8%, transparent);
}

/* ==========================================================================
   Dark Mode Adjustments
   ========================================================================== */

[data-theme*="-dark"] .shadow-fx-inset,
[data-theme*="-dark"].shadow-fx-inset {
    box-shadow:
        inset 0 calc(2px * var(--shadow-fx-scale, 1)) calc(4px * var(--shadow-fx-scale, 1)) oklch(0 0 0 / 0.3),
        inset 0 calc(-1px * var(--shadow-fx-scale, 1)) calc(2px * var(--shadow-fx-scale, 1)) oklch(0 0 0 / 0.15);
}

[data-theme*="-dark"] .shadow-fx-inset-deep,
[data-theme*="-dark"].shadow-fx-inset-deep {
    box-shadow:
        inset 0 calc(4px * var(--shadow-fx-scale, 1)) calc(8px * var(--shadow-fx-scale, 1)) oklch(0 0 0 / 0.4),
        inset 0 calc(-2px * var(--shadow-fx-scale, 1)) calc(4px * var(--shadow-fx-scale, 1)) oklch(0 0 0 / 0.2),
        inset 0 0 0 calc(1px * var(--shadow-fx-scale, 1)) oklch(0 0 0 / 0.15);
}