/* Generated by tailwindcss-rails, rewritten by Kaktus to inline engine.css and avoid an absolute-path @import that would 404 when served by Propshaft. */

/* Kaktus engine — tells Tailwind to scan engine views for utility classes */
@source "/usr/local/bundle/ruby/3.4.0/bundler/gems/kaktus-e1fa42937550/app/views";

/* Alert classes used dynamically in toast_controller.js — not in any template, so must be safelisted */
@source inline("alert-success alert-warning");

@layer components {
    .kaktus-toast-container {
        @apply fixed top-2 z-50 space-y-2 left-1/2 -translate-x-1/2 md:top-18 md:left-auto md:translate-x-0 md:right-2;
    }
}

/* ─── Kaktus UI primitives ──────────────────────────────────────────────
   Tokens with neutral defaults; consumer apps override in their own theme.
   No literal color/font values in the classes themselves — values resolve
   through these tokens or through Tailwind utilities applied via @apply. */
@layer components {
    :root {
        --kx-page-narrow-max-width:   48rem;
        --kx-page-form-max-width:     36rem;
        --kx-page-settings-max-width: 42rem;

        --kx-card-bg:      var(--color-base-100);
        --kx-card-border:  1px solid var(--color-base-300);
        --kx-card-radius:  0.75rem;
        --kx-card-padding: 1.5rem;

        --kx-actions-gap: 0.5rem;
    }

    /* Page shell */
    .kx-page          { @apply mx-auto; }
    .kx-page-wide     { /* no max-width; layout's container governs */ }
    .kx-page-narrow   { max-width: var(--kx-page-narrow-max-width); }
    .kx-page-form     { max-width: var(--kx-page-form-max-width); }
    .kx-page-settings { max-width: var(--kx-page-settings-max-width); }
    .kx-page-header   { @apply flex items-center justify-between gap-3 mb-6; }
    .kx-page-title    { @apply text-2xl font-bold; }
    .kx-page-heading  { @apply mt-4 mb-6; }

    /* Card surface */
    .kx-card {
        background: var(--kx-card-bg);
        border: var(--kx-card-border);
        border-radius: var(--kx-card-radius);
        padding: var(--kx-card-padding);
    }
    .kx-card-header { @apply flex items-center justify-between gap-3 mb-4; }
    .kx-card-title  { @apply text-xl font-bold; }
    .kx-card-body   { /* no extra styles by default */ }

    /* Action cluster */
    .kx-actions {
        @apply flex items-center shrink-0;
        gap: var(--kx-actions-gap);
    }

    /* Version-history diff highlights (Kaktus::HtmlDiff output) */
    .ins-block {
        @apply bg-success/20 px-0.5 rounded-sm;
        text-decoration: none;
    }
    .del-block {
        @apply bg-error/20 line-through px-0.5 rounded-sm;
    }
    /* Line-through doesn't render on images. Use a visible outline + tint instead. */
    .ins-block > img {
        @apply outline outline-2 outline-success rounded-sm;
    }
    .del-block > img {
        @apply outline outline-2 outline-error rounded-sm opacity-60 grayscale;
    }
}