/* Doors — page reorganization (Donald's Oct 22, 2026).
   The "summary + door" grammar: on a parent page a system gets one
   line — icon · name · status/count · › — and lives on its own page.
   House language throughout: Mist cream ground, Inter, soft house
   shadows, small + organized. Loaded after app.css. */

/* ——— door rows ——— */
.door-row {
  display: flex; align-items: center; gap: 11px;
  background: #fff; border: 1px solid #E7E2D9; border-radius: 12px;
  padding: 11px 14px; margin: 7px 0;
  text-decoration: none; color: inherit;
  box-shadow: 0 2px 6px rgba(38,35,30,.07);
  transition: transform 120ms ease, box-shadow 120ms ease;
}
.door-row:active { transform: scale(.99); }
/* A door that opens a flow instead of navigating (e.g. the
 * suggestions door in Settings) is a <button> wearing the row's
 * clothes — reset the button chrome so it reads identically. */
button.door-row { width: 100%; font: inherit; text-align: left; cursor: pointer; }
/* The current door in a door-nav (e.g. the group page's sections). */
.door-row.door-row-active { border-color: #023A50; box-shadow: inset 3px 0 0 #023A50, 0 2px 6px rgba(38,35,30,.07); }
/* Remembered accordion (Doors.accordion): a door-styled head with a
 * collapsible body under it. The body eases in on the shared panel
 * timing; the chevron rotates to match. */
.acc { margin: 7px 0; }
.acc-head {
  display: flex; align-items: center; gap: 11px; width: 100%;
  background: #fff; border: 1px solid #E7E2D9; border-radius: 12px;
  padding: 11px 14px; font: inherit; text-align: left; cursor: pointer; color: inherit;
  box-shadow: 0 2px 6px rgba(38,35,30,.07);
}
.acc-head .acc-chev { transition: transform 200ms ease; }
.acc-head[aria-expanded="true"] .acc-chev { transform: rotate(90deg); }
.acc-body { padding-top: 7px; animation: tnAccIn 220ms ease; }
@keyframes tnAccIn { from { opacity: 0; transform: translateY(-4px); } to { opacity: 1; transform: none; } }
@media (prefers-reduced-motion: reduce) { .acc-body { animation: none; } .acc-head .acc-chev { transition: none; } }
.door-row:focus-visible { outline: 2px solid #023A50; outline-offset: 2px; }
.door-ic { font-size: 18px; line-height: 1; flex: none; width: 22px; text-align: center; }
.door-main { flex: 1 1 auto; min-width: 0; display: flex; flex-direction: column; gap: 1px; }
.door-name { font-size: 14px; font-weight: 700; color: #22303C; }
.door-sum { font-size: 12px; color: #6B7684; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.door-sum:empty { display: none; }
.door-chev { font-size: 20px; font-weight: 700; color: #023A50; flex: none; line-height: 1; }

/* A door row that sits inside a card (the rail storefront line):
   no card chrome of its own. */
.door-row-flat { border: none; box-shadow: none; border-radius: 8px; padding: 6px 2px; margin: 0; }
.door-row-flat:active { transform: none; }

/* ——— door groups ——— */
.door-group { margin-top: 18px; }
.door-group-label {
  font-size: 11px; font-weight: 800; letter-spacing: .6px;
  text-transform: uppercase; color: #023A50; margin: 0 2px 2px;
}
.door-group .door-row { position: relative; }

/* The Quick doors unit (the folded Welcome card): four compact
   doors in one reorderable unit. */
.door-quick { display: grid; grid-template-columns: 1fr 1fr; gap: 7px; margin: 7px 0; }
.door-quick .door-row { margin: 0; padding: 9px 11px; }
.door-quick .door-ic { width: 18px; font-size: 15px; }
.door-quick .door-name { font-size: 13px; }
@media (max-width: 480px) { .door-quick { grid-template-columns: 1fr; } }

/* Reorder mode: door interiors go inert like card interiors;
   only the grip stays live (app.css covers [data-ov-card] children;
   the quick-doors unit's rows need the same treatment). */
.ov-reordering .door-quick .door-row { pointer-events: none; }
.ov-reordering .door-quick { position: relative; }

/* ——— Profile Overview layer-2 pieces ——— */
/* Numbers strip: Quick stats slimmed to its summary line. */
.ov-strip {
  display: flex; align-items: center; justify-content: center; gap: 8px; flex-wrap: wrap;
  background: #fff; border: 1px solid #E7E2D9; border-radius: 12px;
  padding: 10px 14px; margin: 7px 0; box-shadow: 0 2px 6px rgba(38,35,30,.07);
  font-size: 13px; color: #22303C; text-align: center;
}
.ov-strip strong { font-size: 15px; color: #023A50; }
.ov-strip .ov-strip-dot { color: #B9B2A4; }

/* Happening today, empty: one calm line instead of a full card
   (Donald's call, Oct 22, 2026 design §8.2). */
.ov-today-line {
  display: flex; align-items: center; gap: 11px;
  padding: 9px 14px; margin: 7px 0;
  font-size: 13px; color: #6B7684;
}
.ov-today-line .door-ic { color: #22303C; }
