/* My Joe Val — shared UI styles, following docs/joeval-wireframe.png.
   Everything is scoped under #mjv-root so the WordPress theme can't bleed in
   and we can't bleed out. Netlify and WP load this same file; edit here,
   never in an adapter's staged copy. */

#mjv-root{max-width:860px;margin:0 auto;font-family:inherit;line-height:1.45;color:#1a1a1a}

/* --- page title --------------------------------------------------------- */
:is(#mjv-root, #mjv-admin-root) .mjv-h1{margin:0 0 14px;font-size:1.9em;font-weight:700;text-align:center}

/* --- Member Profile band (teal, full width) ------------------------------ */
:is(#mjv-root, #mjv-admin-root) .mjv-profile{background:#b8ece9;padding:12px 18px;border-radius:6px;margin:0 0 16px}
:is(#mjv-root, #mjv-admin-root) .mjv-profile-h{margin:0 0 6px;font-size:1.15em;font-weight:700}
:is(#mjv-root, #mjv-admin-root) .mjv-profile-row{display:flex;flex-wrap:wrap;gap:8px 20px;justify-content:space-between}
:is(#mjv-root, #mjv-admin-root) .mjv-welcome{font-weight:700}
:is(#mjv-root, #mjv-admin-root) .mjv-memberstatus{font-weight:600}

/* --- bordered sections --------------------------------------------------- */
:is(#mjv-root, #mjv-admin-root) .mjv-section{border:1px solid #333;border-radius:10px;padding:14px 18px;margin:0 0 16px}
:is(#mjv-root, #mjv-admin-root) .mjv-section-h{margin:0 0 10px;font-size:1.15em;font-weight:700}
:is(#mjv-root, #mjv-admin-root) .mjv-line{margin:4px 0}
:is(#mjv-root, #mjv-admin-root) .mjv-k{font-weight:600}
:is(#mjv-root, #mjv-admin-root) .mjv-detail{margin:10px 0 0;font-size:.94em;color:#444}
:is(#mjv-root, #mjv-admin-root) .mjv-note{margin:0 0 10px;font-size:.9em;color:#555}

/* status tinting — subtle, the wireframe is mostly plain boxes */
:is(#mjv-root, #mjv-admin-root) .mjv-ok{background:#f2fbf4;border-color:#5d9c6e}
:is(#mjv-root, #mjv-admin-root) .mjv-wait{background:#fffaf0;border-color:#c09a44}
:is(#mjv-root, #mjv-admin-root) .mjv-info{background:#f6f9fd;border-color:#6b87ad}

/* fields with no data source yet */
:is(#mjv-root, #mjv-admin-root) .mjv-unknown .mjv-v{color:#8a8a8a}

/* --- Festival Registration: festival info + boxed fields ----------------- */
:is(#mjv-root, #mjv-admin-root) .mjv-reg{display:flex;flex-wrap:wrap;gap:16px;align-items:flex-start}
:is(#mjv-root, #mjv-admin-root) .mjv-fest{flex:1 1 220px;font-weight:600}
:is(#mjv-root, #mjv-admin-root) .mjv-regbox{flex:1 1 300px;border:1px solid #333;border-radius:10px;padding:12px 16px}

/* --- Resources/Links tiles ----------------------------------------------- */
:is(#mjv-root, #mjv-admin-root) .mjv-links{margin:0 0 16px}
:is(#mjv-root, #mjv-admin-root) .mjv-tiles{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:12px}
:is(#mjv-root, #mjv-admin-root) .mjv-tile{display:flex;align-items:center;justify-content:center;text-align:center;
  min-height:84px;padding:12px;border:1px solid #333;border-radius:10px;
  font-weight:700;text-decoration:none;color:#1a1a1a;background:#fff}
:is(#mjv-root, #mjv-admin-root) .mjv-tile:hover{background:#1c3a5e;color:#fff;border-color:#1c3a5e}
:is(#mjv-root, #mjv-admin-root) .mjv-tile-off{opacity:.45;cursor:not-allowed}
:is(#mjv-root, #mjv-admin-root) .mjv-tile-off:hover{background:#fff;color:#1a1a1a;border-color:#333}

/* --- buttons / sign out --------------------------------------------------- */
:is(#mjv-root, #mjv-admin-root) .mjv-btn{display:inline-block;background:#1c3a5e;color:#fff;text-decoration:none;
  padding:10px 18px;border-radius:8px;font-weight:600}
:is(#mjv-root, #mjv-admin-root) .mjv-signout{margin:4px 0 0;font-size:.9em}

#mjv-root .mjv-grouplist,#mjv-admin-root .mjv-grouplist{margin:8px 0 0;padding-left:20px}
#mjv-root .mjv-grouplist code,#mjv-admin-root .mjv-grouplist code{background:rgba(0,0,0,.05);
  padding:1px 5px;border-radius:4px}

/* ==========================================================================
   Admin page. Same visual language; the member view is rendered by the same
   code, so it must look identical inside .mjv-memberview.
   ========================================================================== */
#mjv-admin-root{max-width:860px;margin:0 auto;font-family:inherit;line-height:1.45;color:#1a1a1a}
#mjv-admin-root .mjv-admin-intro{margin:0 0 16px;color:#555}
#mjv-admin-root .mjv-demonote{font-size:.8em;color:#888;margin-top:8px}
#mjv-admin-root .mjv-muted{color:#777}
#mjv-admin-root .mjv-error{color:#a12a2a;font-weight:600}

#mjv-admin-root .mjv-searchrow{display:flex;gap:10px;flex-wrap:wrap}
#mjv-admin-root .mjv-searchrow input{flex:1 1 260px;font-size:1em;padding:9px 12px;
  border:1px solid #bbb;border-radius:8px}
#mjv-admin-root .mjv-btn{display:inline-block;background:#1c3a5e;color:#fff;border:0;
  text-decoration:none;padding:10px 18px;border-radius:8px;font-weight:600;
  font-size:1em;cursor:pointer}

#mjv-admin-root .mjv-resultlist{list-style:none;margin:12px 0 0;padding:0}
#mjv-admin-root .mjv-resultlist li{margin:0 0 6px}
#mjv-admin-root .mjv-resultbtn{display:block;width:100%;text-align:left;cursor:pointer;
  background:#fff;border:1px solid #ccc;border-radius:8px;padding:10px 12px;font:inherit}
#mjv-admin-root .mjv-resultbtn:hover{border-color:#1c3a5e;background:#f4f7fb}

#mjv-admin-root .mjv-viewbanner{background:#1c3a5e;color:#fff;border-radius:8px;
  padding:10px 16px;margin:22px 0 12px;font-size:.95em}
#mjv-admin-root .mjv-memberview{border:2px dashed #9bb0c7;border-radius:12px;padding:16px;
  background:#fff}

/* the "what if" extra: present, deliberately not prominent */
#mjv-admin-root .mjv-whatif{margin:30px 0 0;border-top:1px dashed #cfcfd6;padding-top:14px}
#mjv-admin-root .mjv-whatif > summary{cursor:pointer;color:#666;font-size:.9em}
#mjv-admin-root .mjv-whatif-body{margin-top:12px}
#mjv-admin-root .mjv-whatif select{font-size:1em;padding:6px 10px;border-radius:8px;border:1px solid #ccc}

/* --- Lottery Status redesign (docs/lottery-status-design.md): banner + facts ---
   Opt-in via statusPage opts.lottery; nothing here renders on the live page yet. */
:is(#mjv-root, #mjv-admin-root) .mjv-next{border-left:5px solid #6b87ad;background:#f6f9fd;border-radius:6px;padding:12px 16px;margin:0 0 14px}
:is(#mjv-root, #mjv-admin-root) .mjv-next-action{border-left-color:#1c3a5e;background:#eef3fb}
:is(#mjv-root, #mjv-admin-root) .mjv-next-ok{border-left-color:#3f8a55;background:#f2fbf4}
:is(#mjv-root, #mjv-admin-root) .mjv-next-wait{border-left-color:#c09a44;background:#fffaf0}
:is(#mjv-root, #mjv-admin-root) .mjv-next-attn{border-left-color:#a12a2a;background:#fdf3f3}
:is(#mjv-root, #mjv-admin-root) .mjv-next-info{border-left-color:#6b87ad;background:#f6f9fd}
:is(#mjv-root, #mjv-admin-root) .mjv-next-k{font-size:.72em;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:#555}
:is(#mjv-root, #mjv-admin-root) .mjv-next-h{margin:4px 0 0;font-size:1.15em;font-weight:700}
:is(#mjv-root, #mjv-admin-root) .mjv-next-d{margin:6px 0 0;font-size:.95em;color:#333}
:is(#mjv-root, #mjv-admin-root) .mjv-next-b{margin:10px 0 0}
:is(#mjv-root, #mjv-admin-root) .mjv-btn-tbd{background:#fff;color:#777;border:1px dashed #999;cursor:not-allowed}
:is(#mjv-root, #mjv-admin-root) .mjv-tbd{font-size:.8em;color:#888;margin-left:8px}
:is(#mjv-root, #mjv-admin-root) .mjv-facts{display:grid;gap:10px}
:is(#mjv-root, #mjv-admin-root) .mjv-fact{display:grid;grid-template-columns:110px 1fr;gap:4px 12px;align-items:start}
:is(#mjv-root, #mjv-admin-root) .mjv-fact-k{font-weight:600;padding-top:2px}
:is(#mjv-root, #mjv-admin-root) .mjv-fact-d{font-size:.88em;color:#555;margin-top:3px}
:is(#mjv-root, #mjv-admin-root) .mjv-chip{display:inline-block;padding:2px 10px;border-radius:999px;font-weight:600;font-size:.92em;border:1px solid transparent}
:is(#mjv-root, #mjv-admin-root) .mjv-chip-ok{background:#e3f3e8;border-color:#a9d4b6;color:#1f5d34}
:is(#mjv-root, #mjv-admin-root) .mjv-chip-pending{background:#eef3fb;border-color:#c3d2ea;color:#1c3a5e}
:is(#mjv-root, #mjv-admin-root) .mjv-chip-wait{background:#fff3d9;border-color:#e6cf93;color:#7a5a00}
:is(#mjv-root, #mjv-admin-root) .mjv-chip-attn{background:#fde8e8;border-color:#e3b3b3;color:#8a2020}
:is(#mjv-root, #mjv-admin-root) .mjv-chip-na{background:#f1f1f1;border-color:#d8d8d8;color:#666}
@media (max-width:520px){
  :is(#mjv-root, #mjv-admin-root) .mjv-fact{grid-template-columns:1fr}
}
@media (max-width:520px){
  :is(#mjv-root, #mjv-admin-root) .mjv-h1{font-size:1.5em}
  :is(#mjv-root, #mjv-admin-root) .mjv-profile-row{flex-direction:column}
}

#mjv-root .mjv-loading,#mjv-admin-root .mjv-loading{color:#666}
