/* ==========================================================================
   Lugarinho — backoffice (complementa site.css)
   ========================================================================== */

body.admin {
  display: grid;
  grid-template-columns: 250px minmax(0, 1fr);
  min-height: 100vh;
  background: var(--cream);
}
/* Sem isto, uma tabela larga estica o grid do body inteiro. */
body.admin > * { min-width: 0; }

/* ---------- barra lateral -------------------------------------------------- */

.sidebar {
  position: sticky; top: 0; align-self: start;
  height: 100vh; display: flex; flex-direction: column;
  background: var(--cocoa); color: #d9cbb6; padding: 18px 12px;
}
.sidebrand { display: flex; align-items: center; gap: 11px; padding: 6px 8px 20px; }
.sidebrand img { height: 40px; width: auto; filter: brightness(0) invert(1); }
.sidebrand span { font: 700 .74rem/1 var(--font); letter-spacing: .14em; text-transform: uppercase; color: #fff; }

.sidenav { display: flex; flex-direction: column; gap: 2px; overflow-y: auto; flex: 1; }
.navlabel {
  font-size: .66rem; text-transform: uppercase; letter-spacing: .14em; font-weight: 700;
  color: #8a7862; padding: 18px 14px 7px;
}
.navitem {
  display: flex; align-items: center; justify-content: space-between; gap: 8px;
  padding: 9px 14px; border-radius: var(--radius); color: #d9cbb6;
  font-size: .9rem; font-weight: 500; transition: background .13s, color .13s;
}
.navitem:hover { background: rgba(255, 255, 255, .08); color: #fff; }
.navitem.is-active { background: var(--brick); color: #fff; }
.navitem em {
  font-style: normal; background: var(--brick-3); color: #fff;
  min-width: 20px; height: 20px; padding: 0 6px; border-radius: var(--radius);
  display: inline-flex; align-items: center; justify-content: center;
  font-size: .7rem; font-weight: 700;
}
.navitem.is-active em { background: rgba(255, 255, 255, .25); }

.sidefoot { border-top: 1px solid rgba(255, 255, 255, .12); padding-top: 12px; margin-top: 12px; }

/* ---------- área principal ------------------------------------------------- */

.adminmain { padding: 28px 32px 70px; max-width: 1400px; width: 100%; min-width: 0; }

.pagehead {
  display: flex; align-items: flex-end; justify-content: space-between;
  gap: 18px; flex-wrap: wrap; margin-bottom: 22px;
}
.pagehead h1 { font-size: 1.75rem; margin: 0; }
.pagehead .sub { color: var(--muted); font-size: .9rem; margin-top: 4px; }
.pagehead .actions { display: flex; gap: 8px; flex-wrap: wrap; }

.toolbar {
  display: flex; gap: 8px; flex-wrap: wrap; align-items: center;
  background: var(--card); border: 1px solid var(--line); border-radius: var(--radius);
  padding: 12px 14px; margin-bottom: 18px;
}
.toolbar input, .toolbar select { width: auto; min-width: 170px; }
.toolbar .spacer { margin-left: auto; }

.chips { display: flex; gap: 6px; flex-wrap: wrap; }
.chip {
  padding: 6px 13px; border-radius: var(--radius); border: 1px solid var(--line);
  background: var(--card); color: var(--muted); font-size: .82rem; font-weight: 600;
}
.chip:hover { border-color: var(--sand); color: var(--cocoa); }
.chip.is-active { background: var(--cocoa); border-color: var(--cocoa); color: #fff; }

.cols > *, .cols-even > * { min-width: 0; }
.cols { display: grid; grid-template-columns: minmax(0, 1.6fr) minmax(0, 1fr); gap: 20px; align-items: start; }
.cols-even { display: grid; grid-template-columns: repeat(auto-fit, minmax(320px, 1fr)); gap: 20px; align-items: start; }

.formgrid { display: grid; grid-template-columns: 1fr 1fr; gap: 0 18px; }
.formgrid .full { grid-column: 1 / -1; }

.formactions {
  display: flex; gap: 10px; align-items: center; flex-wrap: wrap;
  margin-top: 22px; padding-top: 20px; border-top: 1px solid var(--line);
}
.formactions .spacer { margin-left: auto; }

.imgpicker { display: flex; gap: 14px; align-items: flex-start; flex-wrap: wrap; }
.imgpicker input[type=file] { max-width: 100%; font-size: .85rem; }
.imgpicker img { width: 110px; height: 110px; object-fit: cover; border-radius: var(--radius); border: 1px solid var(--line); }

.money-input { text-align: right; font-variant-numeric: tabular-nums; }

.subhead td {
  background: var(--cream-2) !important; font-weight: 700; font-family: var(--serif);
  color: var(--cocoa); font-size: .95rem;
}

.kv { display: grid; grid-template-columns: auto 1fr; gap: 6px 18px; font-size: .9rem; }
.kv dt { color: var(--muted); }
.kv dd { margin: 0; font-weight: 500; }

body.admin.loginpage {
  grid-template-columns: 1fr !important; display: grid; place-items: center;
  min-height: 100vh; background: var(--cocoa);
}
body.admin.loginpage .panel { width: min(420px, calc(100% - 40px)); }
body.admin.loginpage .logo { height: 76px; margin: 0 auto 22px; filter: brightness(0) invert(1); }

@media (max-width: 900px) {
  body.admin { grid-template-columns: 1fr; }
  .sidebar {
    position: sticky; top: 0; z-index: 30; height: auto;
    flex-direction: row; flex-wrap: wrap; align-items: center; gap: 8px; padding: 10px 14px;
  }
  .sidebrand { padding: 0; margin-right: auto; }
  .sidebrand img { height: 32px; }
  .sidenav {
    flex-direction: row; flex-wrap: nowrap; flex: 1 0 100%; gap: 6px;
    overflow-x: auto; scrollbar-width: none; padding-bottom: 2px;
  }
  .sidenav::-webkit-scrollbar { display: none; }
  .navitem { white-space: nowrap; padding: 8px 12px; font-size: .85rem; }
  .navlabel { display: none; }
  .sidefoot { display: flex; gap: 6px; border-top: none; margin: 0; padding: 0; flex-wrap: wrap; }
  .sidefoot .tiny { display: none; }
  .sidefoot .navitem { padding: 6px 10px; font-size: .8rem; }
  .adminmain { padding: 18px 16px 60px; }
  .cols, .cols-even { grid-template-columns: 1fr; }
  .formgrid { grid-template-columns: 1fr; }
}

@media (max-width: 560px) {
  .pagehead { gap: 12px; margin-bottom: 16px; }
  .pagehead h1 { font-size: 1.4rem; }
  .pagehead .actions { width: 100%; }
  .pagehead .actions .btn { flex: 1 1 auto; }
  .toolbar { padding: 10px; gap: 8px; }
  .toolbar form { width: 100%; }
  .toolbar input, .toolbar select { min-width: 0; width: 100%; }
  .toolbar .spacer { margin-left: 0; width: 100%; }
  .chips { gap: 5px; }
  .chip { padding: 5px 10px; font-size: .78rem; }
  .panel { padding: 16px; }
  .formactions { flex-wrap: wrap; }
  .formactions .btn { flex: 1 1 auto; }
  .formactions .spacer { margin-left: 0; flex-basis: 100%; }
  .kv { grid-template-columns: 1fr; gap: 2px 0; }
  .kv dt { margin-top: 8px; }
}

@media print {
  .sidebar, .toolbar, .formactions, .pagehead .actions { display: none !important; }
  body.admin { grid-template-columns: 1fr; }
  .adminmain { padding: 0; }
}