/* ============================================
   Glitz HQ — CSS Reset
   ============================================ */

*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }

html { scroll-behavior: smooth; -webkit-text-size-adjust: 100%; }

body {
    font-family: var(--font-family);
    background-color: var(--black);
    color: var(--text-primary);
    line-height: 1.6;
    min-height: 100vh;
    overflow-x: hidden;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    -webkit-tap-highlight-color: transparent;
    font-feature-settings: 'cv02', 'cv03', 'cv04', 'cv11';
}

a { color: inherit; text-decoration: none; }
button { font-family: inherit; border: none; background: none; cursor: pointer; user-select: none; }
input, textarea, select { font-family: inherit; outline: none; }
img { display: block; max-width: 100%; }
ul, ol { list-style: none; }
table { border-collapse: collapse; }

/* ── Dark Color Scheme for Native Controls ── */
input, textarea, select {
    color-scheme: dark;
}

/* ── Native Date Picker Fix ── */
input[type="date"],
input[type="time"],
input[type="datetime-local"],
input[type="month"],
input[type="week"] {
    color-scheme: dark;
    -webkit-appearance: none;
    appearance: none;
    position: relative;
}

input[type="date"]::-webkit-calendar-picker-indicator,
input[type="time"]::-webkit-calendar-picker-indicator,
input[type="datetime-local"]::-webkit-calendar-picker-indicator,
input[type="month"]::-webkit-calendar-picker-indicator,
input[type="week"]::-webkit-calendar-picker-indicator {
    cursor: pointer;
    filter: invert(0.5) sepia(1) saturate(5) hue-rotate(300deg);
    opacity: 0.7;
    transition: opacity 0.15s ease;
    padding: 2px;
}

input[type="date"]::-webkit-calendar-picker-indicator:hover,
input[type="time"]::-webkit-calendar-picker-indicator:hover,
input[type="datetime-local"]::-webkit-calendar-picker-indicator:hover {
    opacity: 1;
}

/* ── Native Select Fix ── */
select option {
    background-color: #1a1a1a;
    color: #ffffff;
    padding: 8px 12px;
}

select optgroup {
    background-color: #141414;
    color: #aaaaaa;
    font-weight: 600;
}

/* ── Scrollbar ── */
::-webkit-scrollbar { width: 5px; height: 5px; }
::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb { background: rgba(255, 45, 120, 0.2); border-radius: 3px; }
::-webkit-scrollbar-thumb:hover { background: rgba(255, 45, 120, 0.5); }

/* Firefox scrollbar */
* {
    scrollbar-width: thin;
    scrollbar-color: rgba(255, 45, 120, 0.2) transparent;
}

/* ── Selection ── */
::selection { background: rgba(255, 45, 120, 0.3); color: #fff; }

/* ── Focus visible ── */
:focus-visible { outline: 2px solid var(--pink); outline-offset: 2px; }

/* ── Number input arrows ── */
input[type="number"]::-webkit-inner-spin-button,
input[type="number"]::-webkit-outer-spin-button {
    filter: invert(0.5) sepia(1) saturate(5) hue-rotate(300deg);
    opacity: 0.6;
}