/* ============================================================
   browser-fixes.css — Scrollbars, footer, animations,
   cross-browser normalization, Safari-only fixes
   ============================================================ */

/* ── Gold scrollbar (shared utility class) ── */
.table-container-scroll { overflow-x: auto; }
.scrollbar-gold::-webkit-scrollbar { width: 14px; height: 14px; }
.scrollbar-gold::-webkit-scrollbar-track {
  background: var(--surface-1);
  border-radius: 8px;
  border: 1px solid var(--surface-2);
}
.scrollbar-gold::-webkit-scrollbar-thumb {
  background: rgba(250, 204, 21, 0.35);
  border-radius: 8px;
  border: 2px solid rgba(250, 204, 21, 0.1);
}
.scrollbar-gold::-webkit-scrollbar-thumb:hover {
  background: rgba(250, 204, 21, 0.65);
}
.scrollbar-gold::-webkit-scrollbar-corner { background: transparent; }

/* ── Footer ── */
footer {
  text-align: center;
  padding: 2rem 5%;
  color: var(--text-secondary);
  border-top: 1px solid var(--border-color);
  margin-top: auto;
  font-size: 0.9rem;
}

/* ── Animations ── */
@keyframes fadeIn {
  from { opacity: 0; transform: translateY(20px); }
  to   { opacity: 1; transform: translateY(0); }
}

/* ============================================================
   CROSS-BROWSER NORMALIZATION
   ============================================================ */

/* Font smoothing */
html, body {
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

/* Color scheme — tells browser which palette to use for native controls */
:root { color-scheme: dark; }
html[data-theme="light"] { color-scheme: light; }

/* Date/time inputs — reset Safari's native picker widget */
input[type="date"],
input[type="time"],
input[type="datetime-local"] {
  -webkit-appearance: none;
  appearance: none;
}

/* Number spinner arrows — hidden in Safari and Chrome */
input[type="number"]::-webkit-inner-spin-button,
input[type="number"]::-webkit-outer-spin-button {
  -webkit-appearance: none;
  margin: 0;
}
input[type="number"] { appearance: textfield; }

/* Button native appearance — Safari adds a system background without this */
button { -webkit-appearance: none; appearance: none; }

/* Tap highlight — removes grey flash on touch devices */
* { -webkit-tap-highlight-color: transparent; }

/* Focus ring — gold ring for keyboard navigation */
:focus-visible {
  outline: 2px solid rgba(250, 204, 21, 0.5);
  outline-offset: 2px;
}
a:focus-visible, button:focus-visible {
  outline: 2px solid rgba(250, 204, 21, 0.5);
  outline-offset: 3px;
  border-radius: 4px;
}
/* Form controls have their own focus ring — don't double-ring */
.form-control:focus,
.form-group input:focus,
.form-group textarea:focus,
.form-group select:focus { outline: none; }

/* ============================================================
   SAFARI-ONLY FIXES
   @supports (hanging-punctuation: first) is true ONLY in Safari
   ============================================================ */
@supports (hanging-punctuation: first) {

  /* Scrollbar — slim gold design to match sidebar */
  html {
    scrollbar-width: thin;
    scrollbar-color: rgba(250, 204, 21, 0.35) transparent;
  }
  html[data-theme="light"] {
    scrollbar-color: rgba(160, 120, 5, 0.35) transparent;
  }

  ::-webkit-scrollbar { width: 7px; height: 7px; }
  ::-webkit-scrollbar-track { background: transparent; }
  ::-webkit-scrollbar-thumb {
    background: rgba(250, 204, 21, 0.28);
    border-radius: 10px;
    border: 2px solid transparent;
    background-clip: padding-box;
  }
  ::-webkit-scrollbar-thumb:hover {
    background: rgba(250, 204, 21, 0.55);
    border: 2px solid transparent;
    background-clip: padding-box;
  }
  ::-webkit-scrollbar-corner { background: transparent; }

  html[data-theme="light"] ::-webkit-scrollbar-thumb {
    background: rgba(160, 120, 5, 0.28);
    border: 2px solid transparent;
    background-clip: padding-box;
  }
  html[data-theme="light"] ::-webkit-scrollbar-thumb:hover {
    background: rgba(160, 120, 5, 0.55);
    border: 2px solid transparent;
    background-clip: padding-box;
  }

  /* Sticky navbar prefix — for Safari < 13 */
  .navbar {
    position: -webkit-sticky;
    position: sticky;
  }

  /* Glass panel backdrop — re-assert to prevent white-flash on load */
  .sidebar { -webkit-backdrop-filter: blur(16px) !important; }
  .mobile-top-header { -webkit-backdrop-filter: blur(12px) !important; }

  /* Font smoothing — re-assert antialiased for all text in Safari */
  body, p, span, a, li, td, th, label, input, button, select, textarea, h1, h2, h3, h4, h5, h6 {
    -webkit-font-smoothing: antialiased;
  }

  /* Card depth — boost shadow vars in light mode (near-invisible on Safari compositor) */
  html[data-theme="light"] {
    --overlay-subtle:  rgba(0, 0, 0, 0.06);
    --overlay-light:   rgba(0, 0, 0, 0.10);
    --overlay-medium:  rgba(0, 0, 0, 0.14);
    --overlay-strong:  rgba(0, 0, 0, 0.18);
  }
}
