/* =========================================================
   MINUTICS — UI RESTYLE OVERRIDE
   Purpose: reskin colors/fonts/radius/shadows to match the
   Journal / Life Hub / Activity / Home reference designs
   WITHOUT touching app logic. Bottom nav bar is left as-is
   on purpose (explicitly requested to keep it unchanged).
   ========================================================= */

/* ---- 1. Design tokens (purple palette, soft light bg) ---- */
:root {
  --background: 228 45% 98%;
  --foreground: 215 28% 17%;
  --card: 0 0% 100%;
  --card-foreground: 215 28% 17%;
  --border: 229 31% 93%;
  --input: 229 31% 93%;
  --ring: 247 62% 60%;
  --primary: 247 62% 60%;
  --primary-foreground: 0 0% 100%;
  --secondary: 246 100% 96%;
  --secondary-foreground: 245 58% 51%;
  --muted: 244 100% 97%;
  --muted-foreground: 221 16% 53%;
  --accent: 246 100% 96%;
  --accent-foreground: 246 52% 52%;
  --app-font-sans: "Inter", "Segoe UI", Roboto, Arial, sans-serif;
}

/* ---- 2. Font everywhere ---- */
html, body, #root, * {
  font-family: "Inter", "Segoe UI", Roboto, Arial, sans-serif !important;
}

body, #root {
  background: hsl(var(--background)) !important;
}

/* ---- 3. Soft rounded corners (Tailwind radius utils are
   baked to 0 at build time, so we restore them by hand) ---- */
.rounded-none { border-radius: 0 !important; }
.rounded-sm   { border-radius: 8px !important; }
.rounded      { border-radius: 10px !important; }
.rounded-md   { border-radius: 12px !important; }
.rounded-lg   { border-radius: 14px !important; }
.rounded-xl   { border-radius: 18px !important; }
.rounded-2xl  { border-radius: 22px !important; }
.rounded-3xl  { border-radius: 26px !important; }
.rounded-full { border-radius: 9999px !important; }
.rounded-t-lg, .rounded-t-xl, .rounded-t-2xl { border-radius: 18px 18px 0 0 !important; }
.rounded-b-lg, .rounded-b-xl, .rounded-b-2xl { border-radius: 0 0 18px 18px !important; }

/* ---- 4. Soft card shadows, like the reference UIs ---- */
.bg-white,
.bg-card {
  box-shadow: 0 6px 18px rgba(53, 66, 100, 0.06);
}

/* ---- 5. Hide the black top nav bar on every tab.
   This targets the single, unique LTTopNav element by its
   exact class combination — nothing else in the app uses
   this combo, so this is a safe, precise match. Layout
   spacing collapses cleanly since it's a flex child. ---- */
div.flex.items-center.justify-between.px-4.py-3.sticky.top-0 {
  display: none !important;
}

/* ---- 6. Bottom nav — intentionally left untouched. ---- */

/* ---- 7. Settings & Journal header band — restyle the
   solid dark header into the soft purple gradient header
   used across the reference UIs. Both pages share this
   exact class combination for their top header block. ---- */
div.bg-primary.text-white.px-5.pt-10.pb-6 {
  background: linear-gradient(135deg, #6658d8 0%, #5144c4 100%) !important;
  border-radius: 0 0 22px 22px;
}

/* ---- 8. General card / list-row polish ---- */
.border {
  border-color: hsl(var(--border)) !important;
}

/* ---- 9. Buttons / accents pick up the purple palette
   automatically via the token overrides above (anything
   using bg-primary, text-primary, bg-accent, ring, etc). */