/* Custom styles for the Support Portal */

/* Let daisyUI theme control text colors (important for dark theme) */
body { color: oklch(var(--bc, 0.2 0 0) / 1); }

/* Let daisyUI themes control semantic colors */

/* Smooth transitions */
a, button, .btn {
    transition: all 0.3s ease;
}

/* Global back button: nudge right slightly */
.global-back-btn-wrap { margin-left: 10px; }

/* Typography and base rhythm */
html { font-size: 16px; }
body { line-height: 1.5; }
h1, h2, h3, h4 { line-height: 1.25; }
p { margin-bottom: 0.75rem; }

/* Icon normalization & contrast */
:root {
    --icon-stroke: 1.9;
}
svg.icon,
.btn svg,
.link svg,
.menu svg,
nav svg,
#sidebar svg {
    stroke: currentColor;
    stroke-width: var(--icon-stroke);
}
.icon-contrast {
    color: var(--fallback-bc, #111111);
}

/* Dropdown/menu polish */
.dropdown .dropdown-content.menu {
    padding: 0.5rem;
    min-width: 11rem;
    background-color: oklch(var(--b1, var(--fallback-b1, 1 0 0)) / 1);
    color: oklch(var(--bc, var(--fallback-bc, 0.2 0 0)) / 1);
    border: 1px solid oklch(var(--bc, var(--fallback-bc, 0.2 0 0)) / 0.10);
    box-shadow: 0 10px 26px oklch(var(--bc, var(--fallback-bc, 0.2 0 0)) / 0.18);
    z-index: 40;
    margin-top: 0.35rem;
}
.dropdown .dropdown-content.menu li > a,
.dropdown .dropdown-content.menu li > button {
    border-radius: 0.375rem;
    padding: 0.5rem 0.625rem;
}
.dropdown .dropdown-content.menu li { margin: 0.125rem 0; }
.dropdown .dropdown-content.menu li > a:hover,
.dropdown .dropdown-content.menu li > button:hover {
    background-color: oklch(var(--bc, var(--fallback-bc, 0.2 0 0)) / 0.06);
}
.dropdown .dropdown-content.menu li > a.text-error { color: #ef4444; }
.dropdown .dropdown-content.menu li > a:focus-visible,
.dropdown .dropdown-content.menu li > button:focus-visible {
    outline: 2px solid var(--fallback-p, #2563eb);
    outline-offset: 2px;
}

/* Controls normalization */
.btn, .input, .select, .textarea {
    border-radius: 0.5rem;
}
.btn.btn-ghost { border-radius: 0.375rem; }

/* Primary top-left action (New Ticket / New Request) - keep identical sizing */
.primary-cta-btn {
    width: 10.5rem;            
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

/* Main list card (Tickets) - ensure consistent min height to reduce layout jump */
.main-list-card {
    min-height: 28rem;
}

/* Control size normalization */
.btn:not(.btn-circle):not(.btn-square) {
    min-height: 2.5rem;            /* match input height */
    height: 2.5rem;
    padding: 0.375rem 0.9rem;      /* tighten vertical padding for alignment */
    font-size: 0.9375rem;          /* 15px */
    line-height: 1.25;
}
.btn.btn-sm {
    min-height: 2rem;
    padding: 0.375rem 0.75rem;
    font-size: 0.875rem;            /* 14px */
}
.btn.btn-lg {
    min-height: 3rem;
    padding: 0.625rem 1rem;
    font-size: 1rem;                /* 16px */
}

.input, .select {
    height: 2.5rem;
    padding: 0.5rem 0.75rem;
    font-size: 0.9375rem;
    line-height: 1.25;
}
.input.input-sm, .select.select-sm {
    height: 2rem;
    padding: 0.375rem 0.625rem;
    font-size: 0.875rem;
}
.input.input-lg, .select.select-lg {
    height: 3rem;
    padding: 0.625rem 0.875rem;
    font-size: 1rem;
}

.textarea {
    min-height: 2.5rem;
    padding: 0.5rem 0.75rem;
    font-size: 0.9375rem;
    line-height: 1.4;
}

.rounded-field { border-radius: 0.5rem; }

/* Table density */
.table :where(thead th), .table :where(tbody td) {
    padding-top: 0.5rem;
    padding-bottom: 0.5rem;
}

/* Table status badges: never truncate/cut off */
.table td.status-cell { overflow: visible; }
.table td.status-cell .badge {
    max-width: none;
    overflow: visible;
    text-overflow: unset;
    white-space: nowrap;
    margin-right: 0.5rem; /* visual gap before Priority */
}

/* Icon crispness */
svg { shape-rendering: geometricPrecision; }

/* Custom scrollbar */
::-webkit-scrollbar {
    width: 8px;
}

::-webkit-scrollbar-track {
    background: #f1f1f1;
}

::-webkit-scrollbar-thumb {
    background: #888;
    border-radius: 4px;
}

::-webkit-scrollbar-thumb:hover {
    background: #555;
}


/* Profile card enhancements */
.avatar.placeholder .bg-neutral-focus {
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.1);
}

/* Form control focus effects */
.input:focus, .textarea:focus, .select:focus {
    box-shadow: 0 0 0 2px rgba(59, 130, 246, 0.3);
}

/* Priority: 4 vertical buttons (Low=green, Medium=yellow, High=orange, Urgent=red) */
.priority-buttons-wrapper {
    width: 100%;
}
.priority-buttons-wrapper .priority-buttons-native {
    position: absolute;
    width: 0;
    height: 0;
    opacity: 0;
    pointer-events: none;
}
.priority-buttons-stack {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    gap: 0.375rem;
}
.priority-buttons-stack .priority-btn {
    flex: 1 1 auto;
    min-width: 0;
    text-align: left;
    min-height: 2.5rem;
    border-left-width: 4px;
}
.priority-buttons-stack .priority-btn-dot {
    width: 0.5rem;
    height: 0.5rem;
    border-radius: 0.15rem;
    flex-shrink: 0;
}
.priority-buttons-stack .priority-btn.priority-btn-active {
    font-weight: 600;
    background-color: var(--priority-color) !important;
    border-color: var(--priority-color);
    color: #fff;
    box-shadow: 0 0 0 2px oklch(var(--bc, 0.2 0 0) / 0.25);
}
.priority-buttons-stack .priority-btn.priority-btn-active[data-value="2"] {
    color: #1c1917;
}
.priority-buttons-stack .priority-btn.priority-btn-active:hover {
    filter: brightness(1.05);
}

/* Priority badges (display only: green Low, yellow Medium, orange High, red Urgent) */
.priority-badge {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    font-size: 0.875rem;
    font-weight: 500;
}
.priority-badge .priority-dot {
    width: 0.5rem;
    height: 0.5rem;
    border-radius: 0.15rem;
}
.priority-badge.priority-1 .priority-dot { background-color: #22c55e; }
.priority-badge.priority-2 .priority-dot { background-color: #eab308; }
.priority-badge.priority-3 .priority-dot { background-color: #f97316; }
.priority-badge.priority-4 .priority-dot { background-color: #ef4444; }

.input, .select, .textarea {
    border-color: oklch(var(--bc, var(--fallback-bc, 0.2 0 0)) / 0.14);
    background-color: oklch(var(--b1, var(--fallback-b1, 1 0 0)) / 1);
}
.input:hover, .select:hover, .textarea:hover {
    border-color: oklch(var(--bc, var(--fallback-bc, 0.2 0 0)) / 0.22);
}
.input:disabled, .select:disabled, .textarea:disabled {
    background-color: oklch(var(--b2, var(--fallback-b2, 0.97 0 0)) / 1);
    color: oklch(var(--bc, var(--fallback-bc, 0.2 0 0)) / 0.55);
}

/* Card hover effects - disable movement to avoid distraction */
.card {
    transition: none !important;
}

.card:hover {
    transform: none !important;
    box-shadow: inherit !important;
}

/* Button hover enhancement */
.btn-primary:hover,
.btn-success:hover,
.btn-outline:hover,
.btn-ghost:hover {
    filter: brightness(1.1);
}
.btn:disabled, .btn.btn-disabled {
    opacity: 0.6;
    cursor: not-allowed;
    filter: none;
}
.btn-outline {
    border-color: oklch(var(--bc, var(--fallback-bc, 0.2 0 0)) / 0.18);
    color: oklch(var(--bc, var(--fallback-bc, 0.2 0 0)) / 1);
}
.btn-outline:disabled {
    border-color: oklch(var(--bc, var(--fallback-bc, 0.2 0 0)) / 0.10);
}
.btn-ghost {
    color: oklch(var(--bc, var(--fallback-bc, 0.2 0 0)) / 1);
}

/* Removed unused hero/footer/dark-mode overrides to reduce CSS size */

/* ------------------------------------------------------------------
   Sidebar pill toggle (collapse / expand)
   - Hamburger button centered under logo inside sidebar
------------------------------------------------------------------- */
.sidebar-toggle-wrapper {
    margin-top: 0.5rem;
    display: flex;
    justify-content: center;
}

.sidebar-toggle-check {
    position: absolute;
    opacity: 0;
    pointer-events: none;
}

.sidebar-toggle {
    cursor: pointer;
    position: relative;
    width: 32px;
    height: 32px;
    border-radius: 9999px;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: none;
    background: oklch(var(--p, var(--fallback-p, 0.82 0.12 150)) / 1);
}

.sidebar-toggle-icon {
    width: 0.9rem;
    height: 0.9rem;
    color: oklch(var(--pc, var(--fallback-pc, 0.16 0.02 150)) / 1);
    transition: transform 0.25s ease;
}

#sidebar-toggle-check:checked + .sidebar-toggle .sidebar-toggle-icon {
    transform: rotate(180deg);
}

/* Badge polish (keep it theme-aware) */
.badge { font-weight: 600; }

/* Status badges: white text on darker backgrounds for contrast in both themes */
.badge-info {
  background-color: #0284c7 !important; /* sky-600 */
  color: #fff !important;
  text-shadow: 0 1px 1px rgba(0, 0, 0, 0.15);
}
.badge-secondary {
  background-color: #475569 !important; /* slate-600 */
  color: #fff !important;
  text-shadow: 0 1px 1px rgba(0, 0, 0, 0.15);
}
.badge-warning {
  background-color: #d97706 !important; /* amber-600 */
  color: #fff !important;
  text-shadow: 0 1px 1px rgba(0, 0, 0, 0.15);
}
.badge-success {
  background-color: #059669 !important; /* emerald-600 */
  color: #fff !important;
  text-shadow: 0 1px 1px rgba(0, 0, 0, 0.15);
}
.badge-neutral {
  background-color: #4b5563 !important; /* gray-600 */
  color: #fff !important;
  text-shadow: 0 1px 1px rgba(0, 0, 0, 0.15);
}

/* Ticket header tags: status + priority aligned as same-size tags */
.ticket-tags {
    gap: 0.5rem;
}
.ticket-tag {
    padding: 0.4rem 0.75rem;
    font-size: 0.875rem;
    border-radius: 0.375rem;
    border: none;
}
.priority-tag.priority-tag-1 { background-color: #22c55e; color: #fff; }
.priority-tag.priority-tag-2 { background-color: #eab308; color: #fff; }
.priority-tag.priority-tag-3 { background-color: #f97316; color: #fff; }
.priority-tag.priority-tag-4 { background-color: #ef4444; color: #fff; }

/* Table polish */
.table thead th {
    border-bottom: 1px solid oklch(var(--bc, var(--fallback-bc, 0.2 0 0)) / 0.12);
}
.table tbody tr.hover:hover td {
    background-color: oklch(var(--bc, var(--fallback-bc, 0.2 0 0)) / 0.05);
}
.table tbody td {
    border-bottom: 1px solid oklch(var(--bc, var(--fallback-bc, 0.2 0 0)) / 0.08);
}
.table-container {
    border: 1px solid oklch(var(--bc, var(--fallback-bc, 0.2 0 0)) / 0.10);
    border-radius: 0.75rem;
}

/* Modal/dialog polish */
dialog::backdrop {
    background: rgba(0, 0, 0, 0.45);
}
.modal-box {
    border: 1px solid oklch(var(--bc, var(--fallback-bc, 0.2 0 0)) / 0.12);
    box-shadow: 0 16px 45px oklch(var(--bc, var(--fallback-bc, 0.2 0 0)) / 0.24);
}
.modal .btn-circle {
    background: rgba(0,0,0,0.04);
}

/* Alert/message polish */
.alert {
    border: 1px solid rgba(0,0,0,0.08);
    border-left-width: 3px;
    align-items: center;
}
.alert-success { border-left-color: var(--brand-success, #65c687); }
.alert-warning { border-left-color: #fbbf24; }
.alert-error { border-left-color: #ef4444; }
.alert-info { border-left-color: #60a5fa; }