/* XiKey Support Portal - Custom Styles */

/* ========== RTL Support ========== */
html[dir="rtl"] .kt-sidebar {
    border-left: 1px solid var(--tw-border-opacity);
    border-right: none;
}

/* ========== Color Themes ========== */
[data-theme-color="purple"] {
    --primary: oklch(58.6% 0.25 292.717);
    --primary-foreground: #fff;
}
.dark[data-theme-color="purple"] {
    --primary: oklch(63% 0.23 292.717);
}

[data-theme-color="green"] {
    --primary: oklch(69.6% 0.17 162.48);
    --primary-foreground: #fff;
}
.dark[data-theme-color="green"] {
    --primary: oklch(72% 0.17 162.48);
}

[data-theme-color="red"] {
    --primary: oklch(57.7% 0.245 27.325);
    --primary-foreground: #fff;
}
.dark[data-theme-color="red"] {
    --primary: oklch(62% 0.22 27.325);
}

[data-theme-color="orange"] {
    --primary: oklch(70.2% 0.183 55.934);
    --primary-foreground: #fff;
}
.dark[data-theme-color="orange"] {
    --primary: oklch(73% 0.17 55.934);
}

[data-theme-color="teal"] {
    --primary: oklch(70.4% 0.14 182.503);
    --primary-foreground: #fff;
}
.dark[data-theme-color="teal"] {
    --primary: oklch(73% 0.14 182.503);
}

/* ========== Smooth transitions ========== */
.kt-card {
    transition: box-shadow 0.2s ease, border-color 0.2s ease;
}
.kt-card:hover {
    box-shadow: 0 1px 3px 0 rgb(0 0 0 / 0.05);
}

/* Stat cards clickable */
a.kt-card {
    text-decoration: none;
    color: inherit;
    cursor: pointer;
}

/* ========== Ticket row hover ========== */
tr.cursor-pointer:hover td {
    background-color: rgba(0, 0, 0, 0.02);
}
.dark tr.cursor-pointer:hover td {
    background-color: rgba(255, 255, 255, 0.03);
}

/* ========== Sidebar mobile overlay ========== */
@media (max-width: 1023px) {
    .kt-sidebar:not(.hidden) {
        position: fixed;
        display: flex !important;
        z-index: 50;
        box-shadow: 4px 0 24px rgba(0, 0, 0, 0.15);
    }
    .dark .kt-sidebar:not(.hidden) {
        box-shadow: 4px 0 24px rgba(0, 0, 0, 0.4);
    }
}

/* ========== Responsive table ========== */
@media (max-width: 640px) {
    .kt-table th, .kt-table td {
        padding-left: 12px;
        padding-right: 12px;
    }
}

/* ========== Textarea resize ========== */
textarea.kt-input {
    resize: vertical;
    min-height: 100px;
}

/* ========== Utilities ========== */
.line-clamp-1 {
    overflow: hidden;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 1;
}

.whitespace-pre-wrap {
    white-space: pre-wrap;
    word-wrap: break-word;
}

.avatar-circle {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 9999px;
    font-size: 0.75rem;
    font-weight: 700;
    color: white;
}

/* ========== Animations ========== */
@keyframes slideDown {
    from { opacity: 0; transform: translateY(-10px); }
    to { opacity: 1; transform: translateY(0); }
}
.kt-container-fixed > div:first-child {
    animation: slideDown 0.3s ease;
}

@keyframes fadeIn {
    from { opacity: 0; transform: translateY(-4px); }
    to { opacity: 1; transform: translateY(0); }
}
#themePanel:not(.hidden) {
    animation: fadeIn 0.15s ease;
}

/* ========== Dark mode scrollbar ========== */
.dark ::-webkit-scrollbar {
    width: 8px;
    height: 8px;
}
.dark ::-webkit-scrollbar-track {
    background: var(--color-zinc-900, #18181b);
}
.dark ::-webkit-scrollbar-thumb {
    background: var(--color-zinc-700, #3f3f46);
    border-radius: 4px;
}
.dark ::-webkit-scrollbar-thumb:hover {
    background: var(--color-zinc-600, #52525b);
}

/* ========== Print styles ========== */
@media print {
    .kt-sidebar, .kt-header, .kt-footer, form { display: none !important; }
    main { padding-top: 0 !important; }
}