/* Braket tenant base theme — light, whitish-neon. Loaded INSTEAD of the herd
   theme for non-default tenants; reuses the same component CSS via @import and
   re-tokenizes it. Tenant theme settings (validated colors) are injected after
   this file and override these tokens. */
@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@500;600;700;800&display=swap');
@import url('/static/styles.css');

:root {
  /* surfaces */
  --dark-green: #f7faff;
  --wood-bg: #f7faff;
  --panel: #ffffff;
  --panel2: #e3eaf6;
  --gray-bg: #eef3fb;
  --black-herd: #dbe4f2;
  /* text */
  --text: #0d1b3d;
  --muted: #5a6b8cd9;
  /* accents (braket neon) */
  --green: #10c8d6;
  --blue: #155fea;
  --violet: #7b61ff;
  --brown: #1424b8;
  --orange: #155fea;
  --amber: #1424b8;
  --yellow: #d99e00;
  --err: #c22a3e;
  --pill-border-1: #c9d6ec;
  --pill-border-2: #e3eaf6;
  --radius: 12px;
  /* type */
  --font-head: Poppins, system-ui, sans-serif;
  --font-display: Poppins, system-ui, sans-serif;
  --font-body: Poppins, system-ui, sans-serif;
}

body {
  background-color: var(--dark-green);
  background-image:
    radial-gradient(900px 480px at 10% -8%, #155fea12, transparent 60%),
    radial-gradient(800px 420px at 95% 4%, #10c8d616, transparent 55%);
}

/* Light theme: no dark text shadows, no italic shouting */
h1, h2, h3 { text-shadow: none; font-style: normal; text-transform: none; letter-spacing: -0.01em; }
h2 { border-bottom-color: var(--panel2); }
.brand, .navlinks a, .navuser, .chip { text-shadow: none; }

.topbar {
  background-color: #ffffffd9;
  background-image: none;
  border-bottom: 1px solid var(--panel2);
  backdrop-filter: blur(8px);
}
.navlinks a, .navuser { color: var(--text); }
.brandname { color: var(--text); }

.btn { background: #ffffff; border-color: #ccd8ec; color: var(--text); border-radius: 10px; }
.btn-ok {
  background-image: linear-gradient(100deg, var(--brown), var(--blue) 55%, var(--green));
  border: 0; color: #fff; text-shadow: none; text-transform: none;
  box-shadow: 0 8px 22px #155fea33;
}
.btn-warn { background: transparent; border-color: var(--err); color: var(--err); }

.card, .match, .group section, .share {
  background: var(--panel);
  border-color: var(--panel2);
  box-shadow: 0 6px 22px #0d1b3d0d;
}
.card:hover { background: #fbfdff; }

.flash-ok { background: #e9fbf3; color: #0e7a4d; border-color: #bfead6; }
.flash-err { background: #fdeef0; color: var(--err); border-color: #f5c6cd; }

input, select, textarea { background: #fbfdff; color: var(--text); border: 1.5px solid var(--panel2); border-radius: 8px; }
input:focus, select:focus, textarea:focus { outline: 2px solid var(--blue); }

footer { border-top: 1px solid var(--panel2); }

/* Text "logo" for tenants that haven't uploaded a brand image */
.text-logo {
  display: inline-block;
  font-family: var(--font-head);
  font-weight: 800;
  font-size: 3.2rem;
  line-height: 1;
  letter-spacing: -0.02em;
  padding: 0.2rem 0.1rem;
  background: linear-gradient(100deg, var(--brown), var(--blue) 55%, var(--green));
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}

/* Language picker: readable on the light tenant theme (was navy-on-navy) */
.langpick > summary { color: var(--ink); border-color: var(--panel2); }
.langpick > summary:hover, .langpick[open] > summary { border-color: var(--blue); color: var(--blue); }
.langpick > form { background: #fff; border-color: var(--panel2); box-shadow: 0 6px 18px #0d1b3d1f; }
.langpick .langopt { color: var(--ink); }
.langpick .langopt:hover:not(:disabled) { background: #eef3fb; color: var(--blue); }
.langpick .langopt.current { color: var(--blue); font-weight: 700; }