/* ============================================================
   Revive shared chrome — top nav + loading screen.
   ONE place to change the brand colour, logo, and loader image.
   Loaded by every app as:  <link rel="stylesheet" href="/chrome.css">
   ============================================================ */
:root{
  --rv-green:#16543f;      /* dark revive green — the nav bar colour */
  --rv-green-d:#0f3d2d;
}

/* ---------- TOP NAV BAR ---------- */
.rv-nav{
  background:var(--rv-green)!important;
  color:#fff;
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  display:flex;align-items:center;justify-content:space-between;
  gap:12px;padding:10px 18px;
  min-height:56px;box-sizing:border-box;flex-wrap:nowrap;
  position:sticky;top:0;z-index:50;
  box-shadow:0 1px 0 rgba(0,0,0,.12), 0 2px 8px rgba(0,0,0,.12);
  border-bottom:1px solid rgba(255,255,255,.10);
}
.rv-nav *{font-family:inherit}
.rv-nav .rv-left{display:flex;align-items:center;gap:10px;min-width:0}
.rv-nav .rv-right{display:flex;align-items:center;gap:8px;flex-wrap:wrap;justify-content:flex-end}
.rv-logo{height:32px;width:32px;object-fit:contain;display:block;flex:none}
.rv-appname{color:#fff;font-size:15px;font-weight:600;white-space:nowrap;opacity:.95}

.rv-btn{
  font-size:12.5px;font-weight:600;line-height:1;
  padding:7px 12px;border-radius:8px;cursor:pointer;
  background:transparent;color:#fff;border:1px solid rgba(255,255,255,.40);
  transition:background .15s,border-color .15s;
}
.rv-btn:hover{background:rgba(255,255,255,.12);border-color:rgba(255,255,255,.75)}
.rv-btn-primary{background:#fff;color:var(--rv-green);border-color:#fff}
.rv-btn-primary:hover{background:#eef3f0}

.rv-portal{
  display:inline-flex;align-items:center;gap:5px;white-space:nowrap;
  color:rgba(255,255,255,.85);font-size:13px;font-weight:500;text-decoration:none;
  padding:6px 8px;border-radius:8px;
}
.rv-portal:hover{color:#fff;background:rgba(255,255,255,.12)}
.rv-who{color:rgba(255,255,255,.8);font-size:12px;white-space:nowrap}

/* ---------- LOADING SCREEN ---------- */
.rv-load{
  position:fixed;inset:0;z-index:9999;
  display:flex;align-items:center;justify-content:center;text-align:center;
  background:var(--rv-green) url('/assets/cafe-loading.jpg') center/cover no-repeat;
}
.rv-load__scrim{position:absolute;inset:0;background:rgba(9,30,22,.58)}
.rv-load__box{position:relative;z-index:1;padding:0 24px}
.rv-load__logo{
  width:104px;height:104px;margin:0 auto 20px;display:block;
  filter:drop-shadow(0 4px 14px rgba(0,0,0,.45));
  animation:rv-pulse 2s ease-in-out infinite;
}
@keyframes rv-pulse{0%,100%{transform:scale(1)}50%{transform:scale(1.05)}}
.rv-load__text{
  color:#fff;font:600 15px/1.4 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif;
  letter-spacing:.02em;text-shadow:0 1px 6px rgba(0,0,0,.5);
}
.rv-load__text::after{content:'';display:inline-block;width:1.2em;text-align:left;animation:rv-dots 1.4s steps(1,end) infinite}
@keyframes rv-dots{0%{content:''}25%{content:'.'}50%{content:'..'}75%{content:'...'}}
.rv-load__bar{width:180px;height:4px;border-radius:4px;background:rgba(255,255,255,.25);overflow:hidden;margin:18px auto 0}
.rv-load__bar i{display:block;width:38%;height:100%;background:#fff;border-radius:4px;animation:rv-slide 1.25s ease-in-out infinite}
@keyframes rv-slide{0%{transform:translateX(-130%)}100%{transform:translateX(360%)}}

@media(max-width:640px){
  .rv-nav{padding:8px 12px;min-height:50px}
  .rv-appname{font-size:14px}
  .rv-logo{height:28px;width:28px}
  .rv-load__logo{width:84px;height:84px}
}