@import "tailwindcss";
@source '../../vendor/laravel/framework/src/Illuminate/Pagination/resources/views/*.blade.php';
@source '../../storage/framework/views/*.php';
@source '../**/*.blade.php';
@source '../**/*.js';

/* Design Tokens (RK Steiermark) */

:root {
    --rk-red: #D71920;
    /* Primärrot */
    --rk-red-dark: #B5141A;
    --rk-charcoal: #111827;
    /* sehr dunkles Grau */
    --rk-slate: #334155;
    /* Text sekundär */
    --rk-bg: #F6F7F9;
    /* App Hintergrund */
    --rk-card: #FFFFFF;
    /* Cards */
    --rk-border: #E5E7EB;
    --rk-green: #16A34A;
    /* Erfolg / OK / Aktiv */
    --rk-green-dark: #15803D;
    /* Hover / Active */
}

button {
    cursor: pointer;
}

.ql-editor {
    min-height: 220px;
}


/* Semantische Utilities (kein tailwind.config nötig) */

@layer utilities {
    .bg-rk-red {
        background-color: var(--rk-red);
    }
    .bg-rk-red-dark {
        background-color: var(--rk-red-dark);
    }
    .text-rk-red {
        color: var(--rk-red);
    }
    .text-rk-charcoal {
        color: var(--rk-charcoal);
    }
    .text-rk-slate {
        color: var(--rk-slate);
    }
    .bg-rk-bg {
        background-color: var(--rk-bg);
    }
    .border-rk {
        border-color: var(--rk-border);
    }
    .ring-rk {
        --tw-ring-color: var(--rk-red);
    }
    /* Background */
    .bg-rk-green {
        background-color: var(--rk-green);
    }
    .bg-rk-green-dark {
        background-color: var(--rk-green-dark);
    }
    /* Text */
    .text-rk-green {
        color: var(--rk-green);
    }
    /* Border */
    .border-rk-green {
        border-color: var(--rk-green);
    }
    /* Ring */
    .ring-rk-green {
        --tw-ring-color: var(--rk-green);
    }
    /* -------- Green background hover -------- */
    .hover\:bg-rk-green:hover {
        background-color: var(--rk-green);
    }
    .hover\:bg-rk-green-dark:hover {
        background-color: var(--rk-green-dark);
    }
    /* Subtile Tints (Cards / Rows / Ghost Buttons) */
    .hover\:bg-rk-green-10:hover {
        background-color: color-mix(in srgb, var(--rk-green) 10%, white);
    }
    .hover\:bg-rk-green-6:hover {
        background-color: color-mix(in srgb, var(--rk-green) 6%, white);
    }
    /* -------- Green text hover -------- */
    .hover\:text-rk-green:hover {
        color: var(--rk-green);
    }
    /* -------- Green border hover -------- */
    .hover\:border-rk-green:hover {
        border-color: var(--rk-green);
    }
    /* -------- Green ring hover -------- */
    .hover\:ring-rk-green:hover {
        --tw-ring-color: var(--rk-green);
    }
    /* -------- Background hover -------- */
    .hover\:bg-rk-red:hover {
        background-color: var(--rk-red);
    }
    .hover\:bg-rk-red-dark:hover {
        background-color: var(--rk-red-dark);
    }
    .hover\:bg-rk-bg:hover {
        background-color: var(--rk-bg);
    }
    /* Subtile “tinted” hovers (für Cards / Ghost Buttons) */
    .hover\:bg-rk-red-10:hover {
        background-color: color-mix(in srgb, var(--rk-red) 10%, white);
    }
    .hover\:bg-rk-red-6:hover {
        background-color: color-mix(in srgb, var(--rk-red) 6%, white);
    }
    .hover\:bg-rk-charcoal-4:hover {
        background-color: color-mix(in srgb, var(--rk-charcoal) 4%, white);
    }
    /* -------- Text hover -------- */
    .hover\:text-rk-red:hover {
        color: var(--rk-red);
    }
    .hover\:text-rk-charcoal:hover {
        color: var(--rk-charcoal);
    }
    .hover\:text-rk-slate:hover {
        color: var(--rk-slate);
    }
    .hover\:text-white:hover {
        color: #fff;
    }
    /* -------- Border hover -------- */
    .hover\:border-rk:hover {
        border-color: var(--rk-border);
    }
    .hover\:border-rk-red:hover {
        border-color: var(--rk-red);
    }
    .hover\:border-rk-red-dark:hover {
        border-color: var(--rk-red-dark);
    }
    /* -------- Ring / Focus-like hover -------- */
    .hover\:ring-rk:hover {
        --tw-ring-color: var(--rk-red);
    }
    .hover\:ring-1:hover {
        --tw-ring-shadow: 0 0 0 1px var(--tw-ring-color);
        box-shadow: var(--tw-ring-shadow);
    }
    .hover\:ring-2:hover {
        --tw-ring-shadow: 0 0 0 2px var(--tw-ring-color);
        box-shadow: var(--tw-ring-shadow);
    }
    /* -------- Shadows (Cards / Buttons) -------- */
    .hover\:shadow-soft:hover {
        box-shadow: 0 10px 25px rgba(17, 24, 39, 0.08);
    }
    .hover\:shadow-card:hover {
        box-shadow: 0 6px 18px rgba(17, 24, 39, 0.10);
    }
    .hover\:shadow-button:hover {
        box-shadow: 0 5px 5px rgba(17, 24, 39, 0.10);
    }
    /* -------- Smooth transitions (empfohlen für alles was “hover” nutzt) -------- */
    .transition-rk {
        transition: background-color .15s ease, color .15s ease, border-color .15s ease, box-shadow .15s ease, transform .15s ease;
    }
}

@layer components {
    .btn-rk-soft {
        @apply rounded-2xl border bg-white px-4 py-2 text-xs font-semibold;
        @apply transition-all duration-200 ease-out;
        border-color: var(--rk-border);
        /* statt @apply border-rk */
    }
    .btn-rk-soft:hover {
        background-color: theme('colors.neutral.50');
        box-shadow: 0 6px 14px -6px rgba(0, 0, 0, 0.15);
    }
    .btn-rk-soft:active {
        transform: translateY(1px);
        box-shadow: 0 3px 8px -4px rgba(0, 0, 0, 0.18);
    }
    .btn-rk-soft:focus-visible {
        outline: none;
        box-shadow: 0 0 0 3px rgba(215, 25, 32, 0.25);
    }
    .btn-rk-soft-red {
        @apply rounded-2xl border bg-white px-4 py-2 text-xs font-semibold;
        @apply transition-all duration-200 ease-out;
        background-color: var(--rk-red);
        color: white;
    }
    .btn-rk-soft-red:hover {
        background-color: var(--rk-red-dark);
        box-shadow: 0 10px 18px -12px rgba(17, 24, 39, 0.25);
    }
    .btn-rk-soft-red:active {
        transform: translateY(1px);
        box-shadow: 0 6px 12px -10px rgba(17, 24, 39, 0.30);
    }
    .btn-rk-soft-red:focus-visible {
        outline: none;
        box-shadow: 0 0 0 3px rgba(215, 25, 32, 0.30);
    }
    .btn-rk-soft-green {
        @apply rounded-2xl border bg-white px-4 py-2 text-xs font-semibold;
        @apply transition-all duration-200 ease-out;
        background-color: var(--rk-green);
        color: white;
    }
    .btn-rk-soft-green:hover {
        background-color: var(--rk-green-dark);
        box-shadow: 0 10px 18px -12px rgba(17, 24, 39, 0.25);
    }
    .btn-rk-soft-green:active {
        transform: translateY(1px);
        box-shadow: 0 6px 12px -10px rgba(17, 24, 39, 0.30);
    }
    .btn-rk-soft-green:focus-visible {
        outline: none;
        box-shadow: 0 0 0 3px rgba(22, 163, 74, 0.30);
    }
    .btn-rk-soft-warning {
        @apply rounded-2xl border bg-white px-4 py-2 text-xs font-semibold;
        @apply transition-all duration-200 ease-out;
        background-color: #FFA500;
        color: white;
    }
    .btn-rk-soft-warning:hover {
        background-color: #DB9D00;
        box-shadow: 0 10px 18px -12px rgba(17, 24, 39, 0.25);
    }
    .btn-rk-soft-warning:active {
        transform: translateY(1px);
        box-shadow: 0 6px 12px -10px rgba(17, 24, 39, 0.30);
    }
    .btn-rk-soft-warning:focus-visible {
        outline: none;
        box-shadow: 0 0 0 3px rgba(255, 165, 0, 30);
    }
    /* Toast */
    .rk-swal-toast.swal2-popup {
        border-radius: 1.5rem;
        /* rounded-3xl */
        border: 1px solid var(--rk-border);
        background: #fff;
        color: var(--rk-charcoal);
        box-shadow: 0 10px 25px rgba(17, 24, 39, 0.10);
        padding: 14px 14px;
    }
    /* Modal */
    .rk-swal-modal.swal2-popup {
        border-radius: 1.5rem;
        border: 1px solid var(--rk-border);
        background: #fff;
        color: var(--rk-charcoal);
        box-shadow: 0 10px 30px rgba(17, 24, 39, 0.14);
        padding: 18px 18px;
    }
    .rk-swal-title.swal2-title {
        font-weight: 700;
        font-size: 1rem;
        color: var(--rk-charcoal);
        margin: 0;
    }
    .rk-swal-text.swal2-html-container {
        margin-top: 6px;
        font-size: 0.875rem;
        color: var(--rk-slate);
        line-height: 1.35rem;
    }
    .rk-swal-actions.swal2-actions {
        gap: 8px;
        margin-top: 14px;
    }
    .rk-swal-close.swal2-close {
        color: var(--rk-slate);
    }
    .rk-swal-close.swal2-close:hover {
        color: var(--rk-charcoal);
    }
    /* Progress bar (Toast) */
    .swal2-timer-progress-bar {
        background: color-mix(in srgb, var(--rk-charcoal) 20%, white);
    }
}


/* =========================
   Print Styles (global)
   ========================= */

@media print {
    /* Remove app chrome */
    .no-print {
        display: none !important;
    }
    aside,
    nav,
    header {
        display: none !important;
    }
    /* Page basics */
    html,
    body {
        background: #fff !important;
    }
    body {
        color: #111827 !important;
    }
    /* Layout: keep content full width */
    .print-container {
        max-width: 100% !important;
        padding: 0 !important;
        margin: 0 !important;
    }
    .print-card {
        border: 1px solid #E5E7EB !important;
        border-radius: 12px !important;
        box-shadow: none !important;
    }
    /* Better tables on paper */
    table {
        width: 100% !important;
        border-collapse: collapse !important;
    }
    th,
    td {
        border-bottom: 1px solid #E5E7EB !important;
        padding: 8px 10px !important;
    }
    thead {
        display: table-header-group;
    }
    /* repeat header on new page */
    tr {
        break-inside: avoid;
        page-break-inside: avoid;
    }
    /* Colors */
    .print-muted {
        color: #374151 !important;
    }
    .print-title {
        font-size: 18pt !important;
        font-weight: 700 !important;
    }
    .print-subtitle {
        font-size: 10pt !important;
        color: #374151 !important;
    }
    /* Links look clean */
    a {
        text-decoration: none !important;
        color: inherit !important;
    }
    /* Page margins */
    @page {
        margin: 14mm;
    }
}