
/* W2C Classic (v3.1) — tidy Hall links + clearer chat input box */

:root{
  --w2c-orange: #e28a38;
  --w2c-orange-dark: #cc7627;
  --w2c-cream-2: #ffe9d6;
  --w2c-text: #333;
  --w2c-muted: #666;
}

*{ box-sizing: border-box; }

/* Page shell (same as v3) */
body.app-container{
  background: #ffffff;
  color: var(--w2c-text);
  font-family: Verdana, Geneva, Tahoma, Arial, sans-serif;
  line-height: 1.45;
  font-size: 15px;
  padding-bottom: 56px;
  position: relative;
  min-height: 100vh;
}
body.app-container::after{
  content: ""; position: fixed; left:0; right:0; bottom:0; height:56px;
  background: var(--w2c-cream-2);
  border-top: 3px solid var(--w2c-orange-dark);
  border-bottom: 3px solid var(--w2c-orange-dark);
  pointer-events:none; z-index:5;
}

/* Header strip */
.navbar{
  background: var(--w2c-cream-2);
  border-top: 3px solid var(--w2c-orange-dark);
  border-bottom: 3px solid var(--w2c-orange-dark);
  position: sticky; top: 0; z-index: 6;
}
.nav-container{ max-width: 1000px; margin: 0 auto; padding: 8px 12px; display:flex; align-items:center; justify-content:center; position:relative; }
.logo img{ height: 36px; }
.navbar .user-info{ position:absolute; right:12px; top:8px; display:flex; gap:8px; }
.navbar .btn{ background:#fff; border:1px solid var(--w2c-orange-dark); color: var(--w2c-text); border-radius:6px; padding:6px 10px; font-weight:700; }
.navbar .btn:hover{ background:#fff8f0; }

/* Main card */
.main-content{ max-width: 1000px; margin: 12px auto; padding: 0 12px; }
.card{
  background:#fff; border:2px solid var(--w2c-orange-dark); border-left:none; border-right:none;
  border-radius:0; padding: 14px 12px; box-shadow:none; text-align:center;
}
.card h1, .card h2, .card h3, .card h4{ color: var(--w2c-orange-dark); margin: 10px 0 8px; font-weight:700; }
.card h2{ font-size:22px; } .card h3{ font-size:18px; }

/* LINKS — cleaner: no underline by default, underline on hover only */
a{ color:#0b5bd3; text-decoration: none; }
a:hover{ text-decoration: underline; }

/* Room list rows */
.list{ width: 720px; max-width:100%; margin: 12px auto; }
.list-item{ display:flex; align-items:center; justify-content:space-between; gap:8px;
  padding:10px 6px; border-bottom:1px dotted var(--w2c-orange-dark); }
.list-item:last-child{ border-bottom:none; }
.list-item .title{ font-weight:700; font-size:16px; }
.badge{ background:#fff8f0; border:1px solid var(--w2c-orange-dark); padding:4px 10px; border-radius:12px; font-size:13px; color:#333; white-space:nowrap; }

/* Notice */
.notice{ background:#fff; border:1px dashed var(--w2c-orange-dark); padding:8px 10px; display:inline-block; margin:6px 0 10px; }
.notice strong{ color:#000; }

/* Chat (line mode) */
.messages{ background:#fff; border-top:2px solid var(--w2c-orange-dark); border-bottom:2px solid var(--w2c-orange-dark); padding:10px; text-align:left; }
.msg-line{ padding:6px 0; border-bottom:1px dotted #d9a778; }
.msg-line:last-child{ border-bottom:none; }
.msg-line .name{ font-weight:700; }
.msg-line .time{ color: var(--w2c-muted); margin: 0 4px; }

/* INPUT BAR — clearer typing box */
/* Chat input: always show border */
.input-bar form { display: flex; gap: 10px; }

.input-bar input[type="text"],
.input-bar input[type="search"],
.input-bar textarea {
  flex: 1;
  background: #fff;
  color: #222;
  border: 2px solid var(--w2c-orange-dark) !important; /* <- always visible */
  border-radius: 6px;
  padding: 10px 12px;
  font-size: 16px;
  line-height: 1.35;
  box-shadow: none; /* remove faint default shadows */
}

.input-bar input[type="text"]::placeholder,
.input-bar input[type="search"]::placeholder {
  color: #8a8a8a;
}

.input-bar input[type="text"]:focus,
.input-bar input[type="search"]:focus,
.input-bar textarea:focus {
  outline: none;
  border-color: var(--w2c-orange-dark);
  box-shadow: 0 0 0 3px rgba(204,118,39,.18); /* subtle glow on focus */
}

.input-bar button,
.input-bar .btn-primary {
  background: var(--w2c-orange);
  color: #fff;
  border: 1px solid var(--w2c-orange-dark);
  border-radius: 6px;
  padding: 10px 14px;
  font-weight: 700;
}

/* Mobile tweaks */
@media (max-width: 640px){
  body.app-container{ font-size: 16px; padding-bottom: 64px; }
  .card{ padding: 12px 8px; }
  .list{ width:100%; }
}


/* === Global logo sizing overrides === */
:root{
  --logo-height-desktop: 92px;   /* bump this up/down to taste */
  --logo-height-mobile:  76px;
}

/* Navbar logos on all pages */
.navbar .logo img{
  height: var(--logo-height-desktop);
  width: auto;
  display: block;
}

/* Make sure the navbar can fit the taller logo */
.nav-container{
  min-height: calc(var(--logo-height-desktop) + 16px);
  align-items: center;
}

/* Login/Register card logo (if used) */
.top-logo{
  height: var(--logo-height-desktop) !important;
  width: auto;
  display: block;
  margin: 8px auto 14px;
}

/* Mobile */
@media (max-width: 640px){
  .navbar .logo img{ height: var(--logo-height-mobile); }
  .top-logo{ height: var(--logo-height-mobile) !important; }
  .nav-container{ min-height: calc(var(--logo-height-mobile) + 16px); }
}

