/* Vanilla app additions. The original visual system is retained in style.css. */
.route-nav{display:flex;gap:8px;flex-wrap:wrap}.route-nav button{cursor:pointer}.inline-error{color:#b42318}.admin-layout{min-height:100vh;background:var(--canvas);padding:0}.admin-layout>.workspace-header{height:82px;padding:0 40px}.admin-layout>.workspace-header .brand{display:flex;align-items:center;gap:9px;margin:0;font-size:17px;white-space:nowrap}.admin-layout>.workspace-header .brand-logo{width:34px;height:34px;object-fit:contain}.admin-layout>.workspace-header>div{margin-right:auto;margin-left:24px}.admin-tabs{display:flex;align-items:center;gap:6px;flex-wrap:wrap;width:calc(100% - 80px);max-width:1360px;margin:24px auto 0;border-bottom:1px solid var(--line)}.admin-tabs button{padding:12px 17px;border:0;border-radius:8px 8px 0 0;background:transparent;color:var(--ink-secondary);cursor:pointer;font-weight:700}.admin-tabs button:hover{background:var(--primary-faint);color:var(--primary)}.admin-tabs button.active{background:var(--primary);color:#fff}#admin-content{width:100%;max-width:1360px;margin:0 auto;padding:24px 40px 56px}.admin-layout .workspace-stats{margin:0 0 22px}.admin-layout .workspace-panel{margin:0 0 20px;min-width:0}.admin-layout .workspace-panel h2{margin-top:0;color:var(--primary);font:700 20px 'Space Grotesk',sans-serif}.admin-layout .workspace-form-page{max-width:900px;margin:0 auto}.table-wrap{overflow:auto;border:1px solid var(--line);border-radius:10px}.data-table{width:100%;border-collapse:collapse;background:#fff;min-width:760px}.data-table th,.data-table td{padding:13px 14px;border-bottom:1px solid var(--line);text-align:left;vertical-align:top;font-size:13px}.data-table th{background:#f7f8fc;color:var(--ink-secondary);font-size:11px;text-transform:uppercase;letter-spacing:.04em;white-space:nowrap}.data-table td small{color:var(--muted)}.data-table tr:last-child td{border-bottom:0}.data-table select{padding:8px 28px 8px 10px;border:1px solid var(--line);border-radius:7px;background:#fff;color:var(--ink);max-width:180px}.admin-layout .user-order{padding:16px 0}.admin-layout .workspace-heading{margin-bottom:20px}.notice{padding:12px;border-radius:8px;background:#edf4ff}.map-hint{font-size:13px;color:#596174}@media(max-width:700px){.admin-layout>.workspace-header{height:auto;min-height:72px;padding:12px 16px;gap:10px;flex-wrap:wrap}.admin-layout>.workspace-header .brand{font-size:14px}.admin-layout>.workspace-header>div{margin-left:4px}.admin-layout>.workspace-header>div strong{font-size:14px}.admin-tabs{width:calc(100% - 32px);margin-top:16px;gap:2px;overflow-x:auto;flex-wrap:nowrap}.admin-tabs button{padding:10px 12px;white-space:nowrap}#admin-content{padding:20px 16px 36px}.admin-layout .workspace-stats{grid-template-columns:1fr 1fr}.admin-layout .workspace-stats>div{padding:16px}.admin-layout .workspace-stats>div:last-child{grid-column:1/-1}}@media(max-width:460px){.admin-layout>.workspace-header .brand span{display:none}.admin-layout .workspace-stats{grid-template-columns:1fr}.admin-layout .workspace-stats>div:last-child{grid-column:auto}}

/* Admin console details */
.admin-overview-heading {
  padding: 24px 28px;
  margin-bottom: 20px;
  border: 1px solid var(--line);
  border-radius: var(--radius-md);
  background: linear-gradient(115deg, #fff 55%, var(--primary-faint));
}
.admin-overview-heading h1 {
  margin: 5px 0;
  color: var(--primary);
  font: 700 28px 'Space Grotesk', sans-serif;
}
.admin-overview-heading p { margin: 0; color: var(--ink-secondary); font-size: 14px; }
.admin-layout .workspace-stats > div { border-top: 3px solid var(--accent); }
.admin-layout .workspace-stats strong { margin: 8px 0 3px; }
.admin-layout #admin-content > .workspace-panel { padding: 24px; }
.admin-layout #admin-content > .workspace-panel > h2 {
  padding-bottom: 16px;
  margin-bottom: 4px;
  border-bottom: 1px solid var(--line);
}
.admin-layout .panel-title { align-items: center; }
.admin-layout .panel-title .section-kicker { font-size: 10px; }
.admin-layout .admin-overview-heading .button { white-space: nowrap; }
.admin-layout .workspace-form { margin-top: 20px; }
.admin-layout .data-table tbody tr:hover { background: #fafbff; }
.admin-layout .data-table td { color: var(--ink); line-height: 1.5; }
.admin-layout .data-table td:nth-child(2) { min-width: 170px; }
.profile-chevron {
  width: 8px;
  height: 8px;
  margin: -4px 2px 0 0;
  border-right: 1.5px solid currentColor;
  border-bottom: 1.5px solid currentColor;
  transform: rotate(45deg);
}
.profile-trigger .profile-avatar {
  width: 32px;
  height: 32px;
  border: 1px solid var(--line);
  border-radius: 50%;
  background: #f4f5fb;
  color: var(--primary);
}
.profile-avatar svg {
  width: 17px;
  height: 17px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.7;
  stroke-linecap: round;
  stroke-linejoin: round;
}
@media (max-width: 560px) {
  .admin-overview-heading { align-items: flex-start; padding: 19px; }
  .admin-overview-heading h1 { font-size: 24px; }
  .admin-layout #admin-content > .workspace-panel { padding: 18px 15px; }
  .admin-layout .panel-title { flex-wrap: wrap; }
}

/* Make admin tables readable without sideways scrolling on phones. */
@media (max-width: 700px) {
  .admin-layout > .workspace-header { display: flex; align-items: center; }
  .admin-layout > .workspace-header > div { min-width: 0; flex: 1; }
  .admin-layout > .workspace-header > div strong { overflow-wrap: anywhere; }
  .admin-layout > .workspace-header > .button { min-height: 40px; padding: 9px 12px; }
  .admin-tabs { padding-bottom: 5px; }
  .admin-tabs button { min-height: 42px; }
  .admin-overview-heading { flex-direction: column; align-items: stretch; gap: 14px; }
  .admin-overview-heading .button { width: 100%; min-height: 46px; justify-content: center; }
  .admin-layout .workspace-stats { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .admin-layout .workspace-stats > div:last-child { grid-column: 1 / -1; }
  .admin-layout .workspace-stats > div { padding: 14px; }
  .admin-layout .workspace-stats strong { font-size: 25px; }
  .admin-layout #admin-content > .workspace-panel { padding: 17px 14px; }
  .admin-layout .table-wrap { overflow: visible; border: 0; border-radius: 0; }
  .admin-layout .data-table { display: block; min-width: 0; background: transparent; }
  .admin-layout .data-table thead { display: none; }
  .admin-layout .data-table tbody { display: grid; gap: 12px; }
  .admin-layout .data-table tr { display: block; padding: 9px 13px; border: 1px solid var(--line); border-radius: 10px; background: #fff; box-shadow: var(--shadow-sm); }
  .admin-layout .data-table td { display: grid; grid-template-columns: minmax(88px, .7fr) minmax(0, 1.3fr); gap: 10px; padding: 9px 0; border-bottom: 1px solid var(--line); overflow-wrap: anywhere; font-size: 12px; }
  .admin-layout .data-table td::before { color: var(--muted); font-size: 10px; font-weight: 800; line-height: 1.45; text-transform: uppercase; letter-spacing: .035em; }
  .admin-layout .orders-table td:nth-child(1)::before { content: "Order"; }
  .admin-layout .orders-table td:nth-child(2)::before { content: "Customer"; }
  .admin-layout .orders-table td:nth-child(3)::before { content: "Device / issue"; }
  .admin-layout .orders-table td:nth-child(4)::before { content: "Phone"; }
  .admin-layout .orders-table td:nth-child(5)::before { content: "Location / method"; }
  .admin-layout .orders-table td:nth-child(6)::before { content: "Status"; }
  .admin-layout .sales-table td:nth-child(1)::before { content: "Customer"; }
  .admin-layout .sales-table td:nth-child(2)::before { content: "Device"; }
  .admin-layout .sales-table td:nth-child(3)::before { content: "Condition"; }
  .admin-layout .sales-table td:nth-child(4)::before { content: "Intent"; }
  .admin-layout .sales-table td:nth-child(5)::before { content: "Phone"; }
  .admin-layout .sales-table td:nth-child(6)::before { content: "Status"; }
  .admin-layout .customers-table td:nth-child(1)::before { content: "Name"; }
  .admin-layout .customers-table td:nth-child(2)::before { content: "Email"; }
  .admin-layout .customers-table td:nth-child(3)::before { content: "Phone"; }
  .admin-layout .customers-table td:nth-child(4)::before { content: "Joined"; }
  .admin-layout .data-table td:last-child { border-bottom: 0; }
  .admin-layout .data-table td:nth-child(2) { min-width: 0; }
  .admin-layout .data-table select { width: 100%; max-width: none; min-height: 42px; font-size: 14px; }
  .admin-layout .data-table tr:only-child td:only-child { display: block; }
}
@media (max-width: 380px) {
  .admin-layout .workspace-stats { grid-template-columns: 1fr; }
  .admin-layout .workspace-stats > div:last-child { grid-column: auto; }
}
