/* ============================================================
LOTUS STAFF — Neon Dark (black + neon blue)
Inspired by the homepage AI staff mockup look.
Theme only — no fake KPI/table data.
Load last. Body should include class "dark-mode".
Brand accents: #4CC9F0 / #00E5FF on #050505.
============================================================ */
body.staff-concierge-app,
body.staff-concierge-app.dark-mode,
body.staff-concierge-app.light-mode {
color-scheme: dark;
--neon: #4CC9F0;
--neon-bright: #00E5FF;
--neon-dim: rgba(76, 201, 240, 0.14);
--neon-glow: rgba(76, 201, 240, 0.35);
--neon-glow-strong: rgba(0, 229, 255, 0.45);
--ac-bg: #050505;
--ac-bg-2: #0A0A0A;
--ac-bg-card: #141414;
--ac-bg-elevated: #1A1A1A;
--ac-cyan: var(--neon);
--ac-cyan-lo: var(--neon-dim);
--ac-glow: var(--neon-glow);
--ac-cobalt: #0B3A66;
--ac-text: #F4F7FA;
--ac-text-muted: rgba(244, 247, 250, 0.68);
--ac-text-dim: rgba(244, 247, 250, 0.45);
--ac-border: rgba(76, 201, 240, 0.12);
--ac-border-glow: rgba(76, 201, 240, 0.42);
--ac-shadow: 0 12px 40px rgba(0, 0, 0, 0.55);
--ac-accent-gold: var(--neon);
--ac-accent-gold-lo: var(--neon-dim);
--lotus-neon: var(--neon-bright);
--lotus-navy: #7DD3FC;
--lotus-primary: var(--neon);
--lotus-primary-dark: var(--neon-bright);
--lotus-primary-light: var(--neon-dim);
--lotus-primary-glow: var(--neon-glow);
--lotus-secondary: #1D75B3;
--lotus-bg: var(--ac-bg);
--lotus-bg-card: var(--ac-bg-card);
--lotus-bg-elevated: var(--ac-bg-elevated);
--lotus-text: var(--ac-text);
--lotus-text-muted: var(--ac-text-muted);
--lotus-text-faint: var(--ac-text-dim);
--lotus-border: var(--ac-border);
--lotus-border-gold: var(--ac-border-glow);
--lotus-shadow: var(--ac-shadow);
--stage-canvas: #050505;
--stage-float: #141414;
--stage-shadow: 0 10px 36px rgba(0, 0, 0, 0.55);
--stage-shadow-sm: 0 4px 18px rgba(0, 0, 0, 0.4);
--stage-radius: 14px;
--accent-orders: var(--neon);
--accent-orders-lo: var(--neon-dim);
--accent-orders-bar: linear-gradient(90deg, rgba(0, 229, 255, 0.95), rgba(76, 201, 240, 0.65));
--accent-bookings: #7DD3FC;
--accent-bookings-lo: rgba(125, 211, 252, 0.14);
--accent-bookings-bar: linear-gradient(90deg, rgba(125, 211, 252, 0.95), rgba(29, 117, 179, 0.7));
--accent-chats: var(--neon-bright);
--accent-chats-lo: rgba(0, 229, 255, 0.12);
--accent-chats-bar: linear-gradient(90deg, rgba(0, 229, 255, 0.95), rgba(76, 201, 240, 0.7));
--accent-guests: #5AD1FF;
--accent-guests-lo: rgba(90, 209, 255, 0.14);
--accent-guests-bar: linear-gradient(90deg, rgba(90, 209, 255, 0.95), rgba(76, 201, 240, 0.65));
--accent-staff: #3BA3D9;
--accent-staff-lo: rgba(59, 163, 217, 0.14);
--accent-staff-bar: linear-gradient(90deg, rgba(59, 163, 217, 0.95), rgba(29, 117, 179, 0.7));
--accent-insights: var(--neon);
--accent-insights-lo: var(--neon-dim);
--accent-insights-bar: var(--accent-orders-bar);
--accent-monitoring: var(--neon-bright);
--accent-monitoring-lo: rgba(0, 229, 255, 0.12);
--accent-monitoring-bar: var(--accent-chats-bar);
--accent-archive: #6B8FA8;
--accent-archive-lo: rgba(107, 143, 168, 0.14);
--accent-archive-bar: linear-gradient(90deg, rgba(107, 143, 168, 0.9), rgba(59, 163, 217, 0.55));
--ac-accent-bar: var(--accent-orders-bar);
--panel-accent: var(--accent-orders);
--panel-accent-lo: var(--accent-orders-lo);
--panel-accent-bar: var(--accent-orders-bar);
--ac-semantic-success: #2EE6A6;
--ac-semantic-success-lo: rgba(46, 230, 166, 0.14);
--ac-semantic-warning: #F5C84C;
--ac-semantic-warning-lo: rgba(245, 200, 76, 0.14);
--ac-semantic-danger: #FF6B6B;
--ac-semantic-danger-lo: rgba(255, 107, 107, 0.14);
--hijiffy-avatar-bg: linear-gradient(135deg, #10348D 0%, var(--neon) 100%);
--hijiffy-avatar-prearrival-bg: linear-gradient(135deg, #10348D 0%, #5B8DEF 100%);
background:
radial-gradient(ellipse 70% 50% at 12% -10%, rgba(76, 201, 240, 0.10), transparent 55%),
radial-gradient(ellipse 55% 40% at 100% 100%, rgba(0, 229, 255, 0.06), transparent 50%),
var(--ac-bg) !important;
color: var(--ac-text);
}
/* —— Shell —— */
body.staff-concierge-app,
body.staff-concierge-app[data-rail-view="home"] {
--home-v2-bg: #050505 !important;
--home-v2-ink: #F4F7FA !important;
--home-v2-muted: rgba(244, 247, 250, 0.55) !important;
--home-v2-line: rgba(76, 201, 240, 0.14) !important;
--home-v2-accent: #4CC9F0 !important;
}
body.staff-concierge-app .dashboard,
body.staff-concierge-app .concierge-main-wrap,
body.staff-concierge-app[data-rail-view="home"] .concierge-main-wrap,
body.staff-concierge-app[data-rail-view="home"] .dashboard,
body.staff-concierge-app[data-rail-view="home"] #view-home.hijiffy-dashboard:not([hidden]),
body.staff-concierge-app #view-home.hijiffy-dashboard:not([hidden]) {
background: #050505 !important;
}
/* Home surfaces — no grey cards/boxes; content sits on the black canvas */
body.staff-concierge-app #view-home .command-table-panel,
body.staff-concierge-app #view-home .home-graph-card,
body.staff-concierge-app #view-home .home-area-chart-card,
body.staff-concierge-app #view-home .home-orders-chart-card,
body.staff-concierge-app #view-home .home-bookings-chart-card,
body.staff-concierge-app #view-home .hijiffy-panel,
body.staff-concierge-app #view-home .home-queue-panel,
body.staff-concierge-app #view-home .home-queue-pane,
body.staff-concierge-app #view-home .hijiffy-orders-card,
body.staff-concierge-app #view-home .hijiffy-open-card,
body.staff-concierge-app #view-home .home-side-panel,
body.staff-concierge-app #view-home #home-pending-approvals,
body.staff-concierge-app #view-home .hijiffy-reply-card,
body.staff-concierge-app #view-home .hijiffy-panel:not(.hijiffy-panel-dark),
body.staff-concierge-app #view-home .home-kpi-card,
body.staff-concierge-app #view-home .insights-card,
body.staff-concierge-app #view-home .monitoring-chart-card,
body.staff-concierge-app #view-home .home-chart-card,
body.staff-concierge-app #view-home .home-area-chart-body,
body.staff-concierge-app #view-home .home-graph-body,
body.staff-concierge-app #view-home .home-area-chart-interactive,
body.staff-concierge-app #view-home .home-side-list,
body.staff-concierge-app #view-home .home-ops-column > *,
body.staff-concierge-app.dark-mode #view-home .command-table-panel,
body.staff-concierge-app.dark-mode #view-home .home-kpi-card,
body.staff-concierge-app.dark-mode #view-home .home-queue-panel,
body.staff-concierge-app.dark-mode #view-home .home-graph-card,
body.staff-concierge-app.dark-mode #view-home .home-area-chart-card,
body.staff-concierge-app.dark-mode #view-home .home-side-panel,
body.staff-concierge-app.dark-mode #view-home .insights-card,
body.staff-concierge-app.dark-mode #view-home #home-queue-panel,
body.staff-concierge-app.dark-mode #view-home #home-pending-approvals,
body.staff-concierge-app #view-home #home-queue-panel,
body.staff-concierge-app #view-home #home-pending-approvals,
body.staff-concierge-app #view-home #home-queue-panel.home-graph-card.insights-card.command-table-panel {
background: transparent !important;
background-color: transparent !important;
border: none !important;
border-radius: 0 !important;
box-shadow: none !important;
outline: none !important;
}
body.staff-concierge-app #view-home .home-graph-card::before,
body.staff-concierge-app #view-home .home-area-chart-card::before,
body.staff-concierge-app #view-home .command-table-panel::before,
body.staff-concierge-app #view-home .home-queue-panel::before,
body.staff-concierge-app #view-home .hijiffy-orders-card::before,
body.staff-concierge-app #view-home .hijiffy-open-card::before,
body.staff-concierge-app #view-home .home-side-panel::before,
body.staff-concierge-app #view-home #home-pending-approvals::before {
content: none !important;
display: none !important;
}
body.staff-concierge-app #view-home .home-graph-header,
body.staff-concierge-app #view-home .home-area-chart-header,
body.staff-concierge-app #view-home .home-side-panel-header,
body.staff-concierge-app #view-home .home-queue-head,
body.staff-concierge-app #view-home .command-table-head {
background: transparent !important;
border: none !important;
border-bottom: none !important;
box-shadow: none !important;
}
/* Home v2 flat KPIs sit on dark canvas — keep text readable */
body.staff-concierge-app #view-home .command-kpi-strip .home-kpi-card,
body.staff-concierge-app #view-home #home-metrics-row-1 .home-kpi-card {
background: transparent !important;
box-shadow: none !important;
border-color: transparent !important;
}
body.staff-concierge-app #view-home .insights-hero-value,
body.staff-concierge-app #view-home .command-kpi-strip .insights-hero-value,
body.staff-concierge-app #view-home #home-metrics-row-1 .kpi-active-now .insights-hero-value,
body.staff-concierge-app #view-home #home-metrics-row-1 .kpi-unread .insights-hero-value,
body.staff-concierge-app #view-home #home-metrics-row-1 .home-kpi-metric-body .insights-hero-value,
body.staff-concierge-app #view-home .home-kpi-volume-item-value,
body.staff-concierge-app #view-home .home-kpi-strip--primary .insights-hero-value {
color: #F4F7FA !important;
}
body.staff-concierge-app #view-home .home-kpi-live-tag {
background: rgba(76, 201, 240, 0.16) !important;
color: #4CC9F0 !important;
border: 1px solid rgba(76, 201, 240, 0.28) !important;
}
body.staff-concierge-app #view-home .home-kpi-trend-text,
body.staff-concierge-app #view-home .home-kpi-label,
body.staff-concierge-app #view-home .home-kpi-volume-item-label,
body.staff-concierge-app #view-home .command-kpi-strip .home-kpi-label {
color: rgba(244, 247, 250, 0.55) !important;
}
body.staff-concierge-app #view-home .insights-hero-label,
body.staff-concierge-app #view-home .home-kpi-strip--six .insights-hero-label,
body.staff-concierge-app #view-home .command-kpi-strip .insights-hero-label {
color: #F4F7FA !important;
}
body.staff-concierge-app #view-home .concierge-page-title,
body.staff-concierge-app #view-home h1,
body.staff-concierge-app #view-home h2,
body.staff-concierge-app #view-home h3,
body.staff-concierge-app #view-home h4 {
color: #F4F7FA !important;
}
body.staff-concierge-app #view-home .command-kpi-strip .home-kpi-card + .home-kpi-card {
border-left-color: rgba(76, 201, 240, 0.14) !important;
}
/* Kill leftover light-mode rail hover from editorial daylight block */
body.staff-concierge-app .concierge-rail-btn:hover {
background: rgba(255, 255, 255, 0.04) !important;
color: rgba(245, 247, 250, 0.88) !important;
}
body.staff-concierge-app .concierge-rail-btn.active,
body.staff-concierge-app .concierge-rail-btn[aria-current="page"] {
background: rgba(76, 201, 240, 0.08) !important;
color: #E8F9FF !important;
box-shadow: none !important;
}
body.staff-concierge-app .login-screen:not([hidden]) {
background:
radial-gradient(ellipse 60% 45% at 50% 0%, rgba(76, 201, 240, 0.12), transparent 60%),
#050505 !important;
}
body.staff-concierge-app .login-card {
background: #111111 !important;
border: 1px solid rgba(76, 201, 240, 0.18) !important;
border-radius: 16px !important;
box-shadow:
0 0 0 1px rgba(76, 201, 240, 0.06),
0 24px 60px rgba(0, 0, 0, 0.65),
0 0 48px rgba(76, 201, 240, 0.08) !important;
}
/* Login wordmark can keep a quiet neon; rail brand stays white (mockup). */
body.staff-concierge-app .login-brand .lotus-wordmark,
body.staff-concierge-app .login-brand .lotus-wordmark--gold {
color: var(--neon-bright) !important;
text-shadow: none;
}
/* —— Rail — clean black nav (mockup), neon only as thin active cue —— */
body.staff-concierge-app .concierge-rail,
body.staff-concierge-app.dark-mode .concierge-rail {
background: #080808 !important;
border-right: none !important;
box-shadow: none !important;
}
/* Collapsed (72px): center logo + icons — stretch left-aligns fixed-width buttons */
body.staff-concierge-app .concierge-rail:not(.is-expanded) {
align-items: center !important;
}
body.staff-concierge-app .concierge-rail:not(.is-expanded) .concierge-rail-logo {
width: 100% !important;
margin: 0 0 8px !important;
padding: 12px 0 4px !important;
min-height: 0 !important;
height: auto !important;
display: flex !important;
flex-direction: row !important;
align-items: center !important;
justify-content: center !important;
gap: 0 !important;
}
/* Brand wordmark must not occupy space when rail is minimized */
body.staff-concierge-app .concierge-rail:not(.is-expanded) .concierge-rail-brand {
display: none !important;
width: 0 !important;
height: 0 !important;
margin: 0 !important;
padding: 0 !important;
overflow: hidden !important;
opacity: 0 !important;
pointer-events: none !important;
}
body.staff-concierge-app .concierge-rail:not(.is-expanded) .concierge-rail-nav {
align-items: center !important;
justify-content: flex-start !important;
padding: 0 !important;
gap: 4px !important;
}
body.staff-concierge-app .concierge-rail:not(.is-expanded) .concierge-rail-btn,
body.staff-concierge-app .concierge-rail:not(.is-expanded) .concierge-rail-expand,
body.staff-concierge-app .concierge-rail:not(.is-expanded) #btn-rail-expand {
width: 48px !important;
margin-left: auto !important;
margin-right: auto !important;
justify-content: center !important;
padding: 0 !important;
}
body.staff-concierge-app .concierge-rail-logo {
overflow: visible !important;
margin-bottom: 12px !important;
height: auto !important;
min-height: 0 !important;
padding: 14px 0 8px !important;
align-items: center !important;
justify-content: center !important;
}
body.staff-concierge-app .concierge-rail-mark,
body.staff-concierge-app .concierge-rail-logo img {
width: 36px !important;
height: 36px !important;
margin-left: auto !important;
margin-right: auto !important;
border-radius: 10px !important;
object-fit: cover !important;
background: #111 !important;
filter: none !important;
box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.08);
}
body.staff-concierge-app .concierge-rail-brand {
display: none !important;
flex-direction: column;
gap: 2px;
min-width: 0;
}
body.staff-concierge-app .concierge-rail.is-expanded .concierge-rail-brand {
display: flex !important;
opacity: 1 !important;
}
body.staff-concierge-app .concierge-rail .concierge-wordmark {
color: #F5F7FA !important;
text-shadow: none !important;
font-size: 0.92rem !important;
font-weight: 650 !important;
letter-spacing: 0.02em !important;
text-transform: none !important;
line-height: 1.15 !important;
}
body.staff-concierge-app .concierge-rail-property {
color: rgba(245, 247, 250, 0.45) !important;
font-size: 0.72rem !important;
letter-spacing: 0.01em !important;
}
body.staff-concierge-app .concierge-rail-nav {
gap: 4px !important;
}
body.staff-concierge-app .concierge-rail-btn {
position: relative !important;
color: rgba(245, 247, 250, 0.55) !important;
background: transparent !important;
border: none !important;
border-radius: 10px !important;
box-shadow: none !important;
min-height: 42px !important;
justify-content: center !important;
}
body.staff-concierge-app .concierge-rail.is-expanded .concierge-rail-btn,
body.staff-concierge-app .concierge-rail.is-expanded .concierge-rail-expand,
body.staff-concierge-app .concierge-rail.is-expanded #btn-rail-expand {
justify-content: flex-start !important;
}
body.staff-concierge-app .concierge-rail-btn svg {
width: 20px !important;
height: 20px !important;
fill: none !important;
stroke: currentColor !important;
stroke-width: 1.6 !important;
stroke-linecap: round !important;
stroke-linejoin: round !important;
filter: none !important;
opacity: 0.9;
}
body.staff-concierge-app .concierge-rail-btn .concierge-rail-label {
color: inherit !important;
font-weight: 500 !important;
font-size: 0.9rem !important;
letter-spacing: 0 !important;
}
body.staff-concierge-app .concierge-rail-btn:hover {
background: rgba(255, 255, 255, 0.04) !important;
color: rgba(245, 247, 250, 0.88) !important;
box-shadow: none !important;
}
body.staff-concierge-app .concierge-rail-btn.active {
background: rgba(76, 201, 240, 0.08) !important;
color: #E8F9FF !important;
box-shadow: none !important;
text-shadow: none !important;
}
body.staff-concierge-app .concierge-rail-btn.active .concierge-rail-label {
background: transparent !important;
color: inherit !important;
box-shadow: none !important;
text-shadow: none !important;
}
body.staff-concierge-app .concierge-rail-btn.active svg {
stroke: var(--neon) !important;
fill: none !important;
filter: none !important;
opacity: 1 !important;
}
/* Thin neon rail accent — no bloom */
body.staff-concierge-app .concierge-rail-btn.active::before,
body.staff-concierge-app .concierge-rail.is-expanded .concierge-rail-btn.active::before {
content: '' !important;
position: absolute !important;
left: 0 !important;
top: 10px !important;
bottom: 10px !important;
width: 2px !important;
border-radius: 2px !important;
background: var(--neon) !important;
box-shadow: none !important;
}
body.staff-concierge-app .concierge-rail-badge {
background: var(--neon) !important;
color: #041018 !important;
box-shadow: none !important;
font-weight: 650 !important;
}
body.staff-concierge-app #btn-rail-expand {
color: rgba(245, 247, 250, 0.4) !important;
margin-top: auto !important;
}
body.staff-concierge-app #btn-rail-expand:hover {
color: rgba(245, 247, 250, 0.75) !important;
background: rgba(255, 255, 255, 0.04) !important;
}
/* —— Top bar / search —— */
body.staff-concierge-app .concierge-topbar,
body.staff-concierge-app .dash-header,
body.staff-concierge-app .concierge-topbar.topbar--compact,
body.staff-concierge-app.dark-mode .concierge-topbar,
body.staff-concierge-app.dark-mode .dash-header,
body.staff-concierge-app[data-rail-view="home"] .concierge-topbar,
body.staff-concierge-app[data-rail-view="home"] .concierge-topbar.topbar--compact {
background: #080808 !important;
border-bottom: 1px solid rgba(255, 255, 255, 0.06) !important;
backdrop-filter: none !important;
-webkit-backdrop-filter: none !important;
box-shadow: none !important;
}
/* Outer search pill only — do NOT border the inner (creates a ghost box) */
body.staff-concierge-app .concierge-search,
body.staff-concierge-app .concierge-search--compact,
body.staff-concierge-app[data-rail-view="home"] .concierge-search,
body.staff-concierge-app[data-rail-view="home"] .concierge-search--compact {
background: #141414 !important;
border: 1px solid rgba(76, 201, 240, 0.14) !important;
color: var(--ac-text) !important;
border-radius: 999px !important;
box-shadow: none !important;
}
body.staff-concierge-app .concierge-search input,
body.staff-concierge-app .concierge-search #dash-global-search,
body.staff-concierge-app #dash-global-search {
background: transparent !important;
border: none !important;
box-shadow: none !important;
outline: none !important;
color: var(--ac-text) !important;
}
body.staff-concierge-app .concierge-search:focus-within,
body.staff-concierge-app .concierge-search--compact:focus-within,
body.staff-concierge-app[data-rail-view="home"] .concierge-search:focus-within {
border-color: rgba(76, 201, 240, 0.45) !important;
box-shadow: 0 0 0 3px rgba(76, 201, 240, 0.12) !important;
}
/* Topbar page title + description — same on every view */
html body.staff-concierge-app .concierge-page-title,
html body.staff-concierge-app #dash-page-title,
html body.staff-concierge-app .dash-title {
color: #F4F7FA !important;
}
html body.staff-concierge-app .concierge-page-sub,
html body.staff-concierge-app #dash-page-sub {
color: rgba(244, 247, 250, 0.55) !important;
}
/* —— Cards / panels — other views keep dark tiles; home + guests + insights stay unboxed —— */
body.staff-concierge-app .orders-panel,
body.staff-concierge-app .completed-panel,
body.staff-concierge-app .order-panel,
body.staff-concierge-app .hijiffy-panel,
body.staff-concierge-app .monitoring-card,
body.staff-concierge-app .staff-panel,
body.staff-concierge-app .thread-panel {
background: #141414 !important;
border: 1px solid rgba(76, 201, 240, 0.10) !important;
border-radius: 14px !important;
box-shadow: 0 8px 28px rgba(0, 0, 0, 0.35) !important;
}
/* Guests desk — no grey panel cards */
body.staff-concierge-app #view-guests .guests-panel,
body.staff-concierge-app #view-guests .guests-pending-panel,
body.staff-concierge-app #view-guests .guests-active-panel,
body.staff-concierge-app.dark-mode #view-guests .guests-panel {
background: transparent !important;
background-color: transparent !important;
border: none !important;
border-radius: 0 !important;
box-shadow: none !important;
outline: none !important;
overflow: visible !important;
}
body.staff-concierge-app #view-guests .guests-panel::before,
body.staff-concierge-app #view-guests .guests-pending-panel::before,
body.staff-concierge-app #view-guests .guests-active-panel::before {
content: none !important;
display: none !important;
}
body.staff-concierge-app #view-guests .guests-panel-header {
background: transparent !important;
border: none !important;
border-bottom: 1px solid rgba(255, 255, 255, 0.06) !important;
padding-left: 0 !important;
padding-right: 0 !important;
box-shadow: none !important;
}
body.staff-concierge-app #view-guests #guests-pending-list,
body.staff-concierge-app #view-guests #guests-active-list {
background: transparent !important;
border: none !important;
box-shadow: none !important;
padding-left: 0 !important;
padding-right: 0 !important;
}
body.staff-concierge-app #view-home .home-kpi-card:hover,
body.staff-concierge-app #view-home .home-graph-card:hover,
body.staff-concierge-app #view-home .home-area-chart-card:hover,
body.staff-concierge-app #view-home .home-side-panel:hover,
body.staff-concierge-app #view-home .home-queue-panel:hover {
border: none !important;
box-shadow: none !important;
filter: none !important;
}
/* KPI icon chips → neon */
body.staff-concierge-app #view-home .home-kpi-card .home-kpi-icon,
body.staff-concierge-app #view-home .home-kpi-card [class*="kpi-icon"] {
color: var(--neon-bright) !important;
filter: drop-shadow(0 0 8px rgba(0, 229, 255, 0.35));
}
/* —— Primary actions —— */
body.staff-concierge-app .btn-primary,
body.staff-concierge-app button.btn-primary,
body.staff-concierge-app .home-pending-approve {
background: linear-gradient(135deg, #00E5FF 0%, #4CC9F0 55%, #1D75B3 100%) !important;
border: 1px solid rgba(0, 229, 255, 0.55) !important;
color: #041018 !important;
font-weight: 650 !important;
border-radius: 10px !important;
box-shadow: 0 0 18px rgba(76, 201, 240, 0.28) !important;
}
body.staff-concierge-app .btn-primary:hover:not(:disabled),
body.staff-concierge-app .home-pending-approve:hover:not(:disabled) {
filter: brightness(1.06);
box-shadow: 0 0 28px rgba(0, 229, 255, 0.4) !important;
}
body.staff-concierge-app .btn-outline,
body.staff-concierge-app button.btn-outline {
background: transparent !important;
border: 1px solid rgba(76, 201, 240, 0.35) !important;
color: var(--neon-bright) !important;
border-radius: 10px !important;
}
body.staff-concierge-app .btn-outline:hover:not(:disabled) {
background: rgba(76, 201, 240, 0.10) !important;
box-shadow: 0 0 16px rgba(76, 201, 240, 0.18);
}
/* —— Tabs / pills —— */
body.staff-concierge-app #view-home .command-tabs .home-queue-tab.is-active,
body.staff-concierge-app #view-home .home-queue-tab.is-active,
body.staff-concierge-app .home-queue-tab.is-active {
border-bottom: none !important;
border-bottom-color: transparent !important;
color: #F4F7FA !important;
text-shadow: none !important;
box-shadow: none !important;
}
body.staff-concierge-app #view-home .home-queue-tab.is-active::after,
body.staff-concierge-app #view-home .command-tabs .home-queue-tab.is-active::after,
body.staff-concierge-app #view-home .home-queue-tabs::after,
body.staff-concierge-app #view-home .command-tabs::after {
content: none !important;
display: none !important;
border: none !important;
background: none !important;
box-shadow: none !important;
}
body.staff-concierge-app .status-pill,
body.staff-concierge-app .hijiffy-row-meta,
body.staff-concierge-app .badge-live,
body.staff-concierge-app .guests-pending-count,
body.staff-concierge-app #guests-pending-count {
border-radius: 8px !important;
}
body.staff-concierge-app .status-pill.is-ok,
body.staff-concierge-app .status-pill.success,
body.staff-concierge-app [data-status="ok"] {
background: rgba(76, 201, 240, 0.14) !important;
color: var(--neon-bright) !important;
border: 1px solid rgba(76, 201, 240, 0.28) !important;
}
/* —— Lists / rows — flat on canvas, no grey cards —— */
body.staff-concierge-app .order-queue-item,
body.staff-concierge-app .hijiffy-conversation,
body.staff-concierge-app .guests-desk-row,
body.staff-concierge-app .home-pending-row {
background: transparent !important;
border: none !important;
border-bottom: 1px solid rgba(255, 255, 255, 0.06) !important;
border-radius: 0 !important;
box-shadow: none !important;
}
body.staff-concierge-app .order-queue-item:hover,
body.staff-concierge-app .order-queue-item.active,
body.staff-concierge-app .hijiffy-conversation:hover,
body.staff-concierge-app .guests-desk-row:hover,
body.staff-concierge-app .home-pending-row:hover {
background: rgba(76, 201, 240, 0.06) !important;
border-bottom-color: transparent !important;
border-radius: 10px !important;
box-shadow: none !important;
}
body.staff-concierge-app .hijiffy-avatar,
body.staff-concierge-app .guests-room-avatar,
body.staff-concierge-app .dash-user-avatar {
background: linear-gradient(135deg, #10348D 0%, var(--neon) 100%) !important;
color: #041018 !important;
box-shadow: none !important;
border: none !important;
}
/* Avatar menu trigger — circle only, no square ring (training mode used a hard border) */
body.staff-concierge-app .dash-user-trigger,
body.staff-concierge-app .dash-user-trigger[data-training="1"],
body.staff-concierge-app .dash-user-trigger:hover,
body.staff-concierge-app .dash-user-trigger[aria-expanded="true"],
body.staff-concierge-app .dash-user-trigger[data-training="1"]:hover,
body.staff-concierge-app .dash-user-trigger[data-training="1"][aria-expanded="true"] {
width: 40px !important;
height: 40px !important;
padding: 0 !important;
border: none !important;
border-radius: 50% !important;
outline: none !important;
background: transparent !important;
box-shadow: none !important;
overflow: visible !important;
}
body.staff-concierge-app .dash-user-trigger:focus,
body.staff-concierge-app .dash-user-trigger:focus-visible {
outline: none !important;
box-shadow: 0 0 0 2px rgba(76, 201, 240, 0.45) !important;
border-radius: 50% !important;
}
body.staff-concierge-app .dash-user-test-badge {
background: #4CC9F0 !important;
color: #041018 !important;
border: none !important;
box-shadow: 0 0 0 2px #050505 !important;
}
/* —— Forms —— */
body.staff-concierge-app input,
body.staff-concierge-app select,
body.staff-concierge-app textarea {
background: #121212 !important;
border-color: rgba(76, 201, 240, 0.16) !important;
color: var(--ac-text) !important;
}
body.staff-concierge-app input:focus,
body.staff-concierge-app select:focus,
body.staff-concierge-app textarea:focus {
border-color: rgba(76, 201, 240, 0.5) !important;
box-shadow: 0 0 0 3px rgba(76, 201, 240, 0.12) !important;
}
/* —— Empty / training —— */
body.staff-concierge-app .col-empty::before,
body.staff-concierge-app .hijiffy-empty::before,
body.staff-concierge-app .hijiffy-chart-empty::before,
body.staff-concierge-app .insights-empty::before,
body.staff-concierge-app .order-detail-empty::before,
body.staff-concierge-app .thread-empty::before {
border: 1px dashed rgba(76, 201, 240, 0.22) !important;
background: rgba(76, 201, 240, 0.04) !important;
}
body.staff-concierge-app #training-banner,
body.staff-concierge-app .training-banner {
background: #111111 !important;
border-bottom: 1px solid rgba(76, 201, 240, 0.18) !important;
color: #F4F7FA !important;
}
/* —— Charts / progress (neon stroke feel) —— */
body.staff-concierge-app .hijiffy-chart svg path,
body.staff-concierge-app .hijiffy-chart svg polyline,
body.staff-concierge-app .home-chart svg .line,
body.staff-concierge-app canvas {
filter: drop-shadow(0 0 4px rgba(76, 201, 240, 0.25));
}
body.staff-concierge-app .monitoring-status-pill.healthy,
body.staff-concierge-app #monitoring-status-pill.healthy {
border-color: rgba(76, 201, 240, 0.45) !important;
color: var(--neon-bright) !important;
box-shadow: 0 0 12px rgba(76, 201, 240, 0.2);
}
body.staff-concierge-app .monitoring-status-pill.degraded,
body.staff-concierge-app #monitoring-status-pill.degraded {
border-color: rgba(245, 200, 76, 0.45) !important;
}
/* —— User menu —— */
/* Wrapper around the avatar only — never paint panel chrome here (causes square ring) */
body.staff-concierge-app .dash-user-menu {
background: transparent !important;
border: none !important;
box-shadow: none !important;
outline: none !important;
padding: 0 !important;
}
body.staff-concierge-app .dash-custom-select-menu {
background: #141414 !important;
border: 1px solid rgba(76, 201, 240, 0.16) !important;
box-shadow: 0 16px 40px rgba(0, 0, 0, 0.55) !important;
}
/* User menu panel — force dark (editorial hardcodes #FFFFFF) */
body.staff-concierge-app .dash-menu-panel {
background: #141414 !important;
border: 1px solid rgba(76, 201, 240, 0.18) !important;
box-shadow: 0 18px 48px rgba(0, 0, 0, 0.65) !important;
color: #F4F7FA !important;
}
body.staff-concierge-app .dash-menu-identity strong {
color: #F4F7FA !important;
}
body.staff-concierge-app .dash-menu-role,
body.staff-concierge-app .dash-menu-property,
body.staff-concierge-app .dash-menu-item-value,
body.staff-concierge-app .monitoring-status-text,
body.staff-concierge-app .dash-menu-panel .monitoring-status-text {
color: rgba(244, 247, 250, 0.55) !important;
}
body.staff-concierge-app .dash-menu-test-pill {
background: rgba(76, 201, 240, 0.14) !important;
color: #4CC9F0 !important;
border: 1px solid rgba(76, 201, 240, 0.28) !important;
}
body.staff-concierge-app .dash-menu-divider {
background: rgba(76, 201, 240, 0.12) !important;
border: none !important;
}
body.staff-concierge-app .dash-menu-item,
body.staff-concierge-app .dash-menu-item-label {
color: #F4F7FA !important;
background: transparent !important;
}
body.staff-concierge-app .dash-menu-item:hover,
body.staff-concierge-app .dash-menu-item:focus {
background: rgba(76, 201, 240, 0.10) !important;
color: #E8F9FF !important;
}
body.staff-concierge-app .dash-menu-panel .monitoring-status-pill,
body.staff-concierge-app .dash-menu-monitor {
background: rgba(255, 255, 255, 0.04) !important;
border: 1px solid rgba(76, 201, 240, 0.16) !important;
color: rgba(244, 247, 250, 0.75) !important;
}
body.staff-concierge-app .dash-header-notify {
background: transparent !important;
border: none !important;
box-shadow: none !important;
}
body.staff-concierge-app .dash-header-notify .notify-bell-icon,
body.staff-concierge-app .dash-menu-item svg {
color: #4CC9F0 !important;
stroke: currentColor !important;
}
body.staff-concierge-app .dash-header-notify.is-off .notify-bell-icon {
color: rgba(244, 247, 250, 0.45) !important;
}
body.staff-concierge-app .dash-header-notify:hover,
body.staff-concierge-app .dash-header-notify:focus-visible {
background: rgba(76, 201, 240, 0.10) !important;
}
body.staff-concierge-app .dash-data-status {
color: rgba(244, 247, 250, 0.55) !important;
background: rgba(255, 255, 255, 0.04) !important;
border: 1px solid rgba(255, 255, 255, 0.08) !important;
}
body.staff-concierge-app .dash-data-status[data-kind="error"] {
color: #FF8E8E !important;
background: rgba(255, 142, 142, 0.1) !important;
border-color: rgba(255, 142, 142, 0.22) !important;
}
body.staff-concierge-app .dash-data-status[data-kind="loading"] {
color: rgba(76, 201, 240, 0.85) !important;
background: rgba(76, 201, 240, 0.08) !important;
border-color: rgba(76, 201, 240, 0.18) !important;
}
/* Final home unbox — beats dark-mode .command-table-panel / .insights-card fills */
body.staff-concierge-app.dark-mode #view-home #home-queue-panel,
body.staff-concierge-app.dark-mode #view-home #home-pending-approvals,
body.staff-concierge-app.dark-mode #view-home .home-ops-column > .home-queue-panel,
body.staff-concierge-app.dark-mode #view-home .home-ops-column > .home-side-panel,
body.staff-concierge-app.dark-mode #view-home .home-ops-column > .command-table-panel,
body.staff-concierge-app.dark-mode #view-home .home-graphs-row > .home-graph-card,
body.staff-concierge-app.dark-mode #view-home .home-graphs-row > .home-area-chart-card {
background: transparent !important;
background-color: transparent !important;
border: 0 !important;
border-radius: 0 !important;
box-shadow: none !important;
}
/* Guests desk — readable text, no grey cards */
body.staff-concierge-app #view-guests #guests-pending-list .home-pending-row,
body.staff-concierge-app #view-guests #guests-pending-list .home-pending-row.hijiffy-conversation,
body.staff-concierge-app #view-guests #guests-pending-list .guests-desk-row,
body.staff-concierge-app #view-guests #guests-pending-list .guests-approve-row,
body.staff-concierge-app #view-guests #guests-active-list .guests-active-row,
body.staff-concierge-app #view-guests #guests-active-list .guests-active-row.hijiffy-conversation,
body.staff-concierge-app #view-guests #guests-active-list .guests-desk-row,
body.staff-concierge-app.dark-mode #view-guests #guests-pending-list .home-pending-row,
body.staff-concierge-app.dark-mode #view-guests #guests-pending-list .home-pending-row.hijiffy-conversation,
body.staff-concierge-app.dark-mode #view-guests #guests-active-list .guests-active-row {
display: grid !important;
grid-template-columns: 40px minmax(0, 1fr) auto !important;
align-items: center !important;
gap: 12px !important;
color: #F4F7FA !important;
background: transparent !important;
border: none !important;
border-bottom: 1px solid rgba(255, 255, 255, 0.06) !important;
border-radius: 0 !important;
margin: 0 !important;
padding: 12px 4px !important;
min-height: 68px !important;
height: auto !important;
visibility: visible !important;
opacity: 1 !important;
position: relative !important;
z-index: 1 !important;
box-shadow: none !important;
}
body.staff-concierge-app #view-guests #guests-pending-list .home-pending-row[hidden],
body.staff-concierge-app #view-guests #guests-active-list .guests-active-row[hidden] {
display: none !important;
}
body.staff-concierge-app #view-guests #guests-pending-list .home-pending-row strong,
body.staff-concierge-app #view-guests #guests-pending-list .guests-room-label,
body.staff-concierge-app #view-guests #guests-pending-list .guests-guest-name,
body.staff-concierge-app #view-guests #guests-active-list .guests-active-row strong,
body.staff-concierge-app #view-guests #guests-active-list .guests-room-label,
body.staff-concierge-app #view-guests #guests-active-list .guests-guest-name,
body.staff-concierge-app.dark-mode #view-guests #guests-pending-list .home-pending-row strong,
body.staff-concierge-app.dark-mode #view-guests #guests-active-list .guests-active-row strong {
color: #F4F7FA !important;
}
body.staff-concierge-app #view-guests #guests-pending-list .home-pending-row small,
body.staff-concierge-app #view-guests #guests-pending-list .guests-stay-meta,
body.staff-concierge-app #view-guests #guests-active-list .guests-active-row small,
body.staff-concierge-app #view-guests #guests-active-list .guests-stay-meta {
color: rgba(244, 247, 250, 0.72) !important;
}
body.staff-concierge-app #view-guests #guests-pending-list .hijiffy-row-meta,
body.staff-concierge-app #view-guests #guests-active-list .hijiffy-row-meta {
color: #4CC9F0 !important;
background: rgba(76, 201, 240, 0.12) !important;
border-color: rgba(76, 201, 240, 0.28) !important;
}
body.staff-concierge-app #view-guests #guests-pending-list .guests-checkout-chip,
body.staff-concierge-app #view-guests #guests-active-list .guests-checkout-chip {
color: rgba(244, 247, 250, 0.65) !important;
background: rgba(76, 201, 240, 0.08) !important;
}
body.staff-concierge-app #view-guests #guests-pending-list .home-pending-approve,
body.staff-concierge-app #view-guests #guests-pending-list [data-pending-approve] {
display: inline-flex !important;
visibility: visible !important;
opacity: 1 !important;
}
body.staff-concierge-app #view-guests .guests-panel-header h3,
body.staff-concierge-app #view-guests .guests-panel-header p,
body.staff-concierge-app #view-guests .guests-desk-title,
body.staff-concierge-app #view-guests .guests-desk-sub {
color: #F4F7FA !important;
}
body.staff-concierge-app #view-guests .guests-desk-sub {
color: rgba(244, 247, 250, 0.55) !important;
}
/* Topbar page heading + guests subtitle (desk head removed as redundant) */
body.staff-concierge-app .concierge-page-heading {
display: flex !important;
flex-direction: column !important;
justify-content: center !important;
gap: 2px !important;
min-width: 0 !important;
}
body.staff-concierge-app #dash-page-sub:not([hidden]),
body.staff-concierge-app .concierge-page-sub:not([hidden]) {
display: block !important;
margin: 0 !important;
color: rgba(244, 247, 250, 0.55) !important;
font-size: 0.78rem !important;
font-weight: 500 !important;
line-height: 1.25 !important;
white-space: nowrap !important;
overflow: hidden !important;
text-overflow: ellipsis !important;
max-width: min(440px, 46vw) !important;
}
body.staff-concierge-app #view-guests .guests-desk-head {
display: none !important;
}
body.staff-concierge-app #view-guests .guests-desk {
padding-top: 0 !important;
}
body.staff-concierge-app #view-guests .guests-desk-grid {
margin-top: 0 !important;
column-gap: 0 !important;
row-gap: 14px !important;
}
/* Same vertical hairline as home ops | main */
body.staff-concierge-app #view-guests .guests-desk-grid > .guests-pending-panel {
border-right: 1px solid rgba(76, 201, 240, 0.14) !important;
padding-right: 20px !important;
}
body.staff-concierge-app #view-guests .guests-desk-grid > .guests-active-panel {
padding-left: 20px !important;
}
@media (max-width: 900px) {
body.staff-concierge-app #view-guests .guests-desk-grid > .guests-pending-panel {
border-right: none !important;
padding-right: 0 !important;
border-bottom: 1px solid rgba(76, 201, 240, 0.14) !important;
padding-bottom: 16px !important;
}
body.staff-concierge-app #view-guests .guests-desk-grid > .guests-active-panel {
padding-left: 0 !important;
padding-top: 16px !important;
}
}
/* Home pending approvals — flat rows, no grey cards */
body.staff-concierge-app #view-home #home-pending-list .home-pending-row,
body.staff-concierge-app #view-home #home-pending-list .guests-approve-row,
body.staff-concierge-app.dark-mode #view-home #home-pending-list .home-pending-row {
display: flex !important;
align-items: center !important;
justify-content: space-between !important;
gap: 10px !important;
color: #F4F7FA !important;
background: transparent !important;
border: none !important;
border-bottom: none !important;
border-radius: 0 !important;
min-height: 52px !important;
margin: 0 !important;
padding: 10px 2px !important;
visibility: visible !important;
opacity: 1 !important;
box-shadow: none !important;
}
body.staff-concierge-app #view-home #home-pending-list .home-pending-row strong,
body.staff-concierge-app.dark-mode #view-home #home-pending-list .home-pending-row strong {
color: #F4F7FA !important;
}
body.staff-concierge-app #view-home #home-pending-list .home-pending-row [style*="64748B"],
body.staff-concierge-app #view-home #home-pending-list .home-pending-row div {
color: rgba(244, 247, 250, 0.68) !important;
}
body.staff-concierge-app #view-home #home-pending-list .home-pending-approve,
body.staff-concierge-app #view-home #home-pending-list [data-pending-approve] {
display: inline-flex !important;
visibility: visible !important;
opacity: 1 !important;
}
body.staff-concierge-app #view-home #home-pending-approvals:has(#home-pending-list [data-room]) #home-pending-empty {
display: none !important;
}
body.staff-concierge-app #view-home #home-pending-approvals:has(#home-pending-list [data-room]) #home-pending-list {
display: flex !important;
flex-direction: column !important;
visibility: visible !important;
opacity: 1 !important;
height: auto !important;
min-height: 80px !important;
flex: 1 1 auto !important;
}
/* Home queue chrome — respect [hidden]; empty copy readable on neon */
body.staff-concierge-app #view-home .home-queue-tab-badge[hidden],
body.staff-concierge-app #view-home .home-queue-tab-badge.home-side-badge[hidden],
body.staff-concierge-app #view-home #home-queue-orders-count[hidden],
body.staff-concierge-app #view-home #home-queue-chats-count[hidden],
body.staff-concierge-app #view-home #home-orders-view-more[hidden],
body.staff-concierge-app #view-home #home-view-more[hidden],
body.staff-concierge-app #view-home .hijiffy-view-more[hidden] {
display: none !important;
}
body.staff-concierge-app #view-home #home-queue-orders-empty:not([hidden]),
body.staff-concierge-app #view-home #home-recent-empty:not([hidden]) {
display: flex !important;
color: rgba(244, 247, 250, 0.62) !important;
visibility: visible !important;
opacity: 1 !important;
}
body.staff-concierge-app #view-home #home-orders-list .hijiffy-conversation,
body.staff-concierge-app #view-home #home-orders-list button.hijiffy-conversation,
body.staff-concierge-app #view-home #home-orders-list .order-queue-item,
body.staff-concierge-app #view-home #home-orders-list button.order-queue-item,
body.staff-concierge-app #view-home #home-recent-list .hijiffy-conversation,
body.staff-concierge-app #view-home #home-recent-list button.hijiffy-conversation,
body.staff-concierge-app #view-home #home-orders-list > *,
body.staff-concierge-app #view-home #home-recent-list > *,
body.staff-concierge-app.dark-mode #view-home #home-orders-list .hijiffy-conversation,
body.staff-concierge-app.dark-mode #view-home #home-orders-list .order-queue-item {
color: #F4F7FA !important;
background: transparent !important;
background-color: transparent !important;
border: none !important;
border-bottom: none !important;
border-radius: 0 !important;
box-shadow: none !important;
outline: none !important;
visibility: visible !important;
opacity: 1 !important;
}
body.staff-concierge-app #view-home #home-orders-list .hijiffy-conversation::after,
body.staff-concierge-app #view-home #home-recent-list .hijiffy-conversation::after,
body.staff-concierge-app #view-home #home-orders-list .order-queue-item::after {
content: none !important;
display: none !important;
width: 0 !important;
height: 0 !important;
background: none !important;
}
body.staff-concierge-app #view-home #home-orders-list .hijiffy-conversation:hover,
body.staff-concierge-app #view-home #home-orders-list .order-queue-item:hover,
body.staff-concierge-app #view-home #home-recent-list .hijiffy-conversation:hover {
background: rgba(76, 201, 240, 0.06) !important;
background-color: rgba(76, 201, 240, 0.06) !important;
border-bottom-color: transparent !important;
border-radius: 10px !important;
box-shadow: none !important;
}
body.staff-concierge-app #view-home #home-orders-list .hijiffy-conversation strong,
body.staff-concierge-app #view-home #home-recent-list .hijiffy-conversation strong {
color: #F4F7FA !important;
}
body.staff-concierge-app #view-home #home-orders-list .hijiffy-conversation small,
body.staff-concierge-app #view-home #home-recent-list .hijiffy-conversation small,
body.staff-concierge-app #view-home #home-orders-list .hijiffy-conversation time,
body.staff-concierge-app #view-home #home-recent-list .hijiffy-conversation time {
color: rgba(244, 247, 250, 0.62) !important;
}
/* FINAL — home queue rows must stay unboxed (beats elevated / glow / active fills) */
body.staff-concierge-app #view-home #home-queue-panel,
body.staff-concierge-app #view-home #home-queue-pane-orders,
body.staff-concierge-app #view-home #home-queue-pane-chats,
body.staff-concierge-app #view-home #home-orders-list,
body.staff-concierge-app #view-home #home-recent-list {
--ac-bg-elevated: transparent !important;
--accent-orders-lo: transparent !important;
--accent-chats-lo: transparent !important;
background: transparent !important;
background-color: transparent !important;
box-shadow: none !important;
}
body.staff-concierge-app #view-home #home-orders-list > button,
body.staff-concierge-app #view-home #home-orders-list > .hijiffy-conversation,
body.staff-concierge-app #view-home #home-orders-list > .order-queue-item,
body.staff-concierge-app #view-home #home-recent-list > button,
body.staff-concierge-app #view-home #home-recent-list > .hijiffy-conversation,
body.staff-concierge-app #view-home #home-orders-list > button:hover,
body.staff-concierge-app #view-home #home-orders-list > button.active,
body.staff-concierge-app #view-home #home-orders-list > .order-queue-item:hover,
body.staff-concierge-app #view-home #home-orders-list > .order-queue-item.active,
body.staff-concierge-app #view-home #home-orders-list > .order-queue-item.order-glow,
body.staff-concierge-app #view-home #home-recent-list > button:hover,
body.staff-concierge-app.dark-mode #view-home #home-orders-list > button,
body.staff-concierge-app.dark-mode #view-home #home-orders-list > .order-queue-item {
background: transparent !important;
background-color: transparent !important;
background-image: none !important;
border: none !important;
border-bottom: none !important;
border-radius: 0 !important;
box-shadow: none !important;
filter: none !important;
backdrop-filter: none !important;
-webkit-backdrop-filter: none !important;
}
body.staff-concierge-app #view-home #home-orders-list > button:hover,
body.staff-concierge-app #view-home #home-recent-list > button:hover {
background: rgba(76, 201, 240, 0.05) !important;
background-color: rgba(76, 201, 240, 0.05) !important;
border-radius: 8px !important;
border-bottom-color: transparent !important;
}
/* ============================================================
HOME HIERARCHY — ops first, lean pulse KPIs, charts secondary
Backup: _backup-home-hierarchy-20260825-075325
============================================================ */
body.staff-concierge-app #view-home .home-dashboard-grid--command.home-dashboard-grid--ops-first {
display: grid !important;
grid-template-columns: clamp(360px, 42vw, 520px) minmax(0, 1fr) !important;
grid-template-rows: minmax(0, 1fr) !important;
gap: 0 !important;
column-gap: 0 !important;
align-items: stretch !important;
height: 100% !important;
min-height: 0 !important;
}
body.staff-concierge-app #view-home .home-dashboard-grid--ops-first > .home-ops-column {
order: 0 !important;
min-width: 0 !important;
border-right: 1px solid rgba(76, 201, 240, 0.14) !important;
padding-right: 20px !important;
}
body.staff-concierge-app #view-home .home-dashboard-grid--ops-first > .hijiffy-main {
order: 1 !important;
min-width: 0 !important;
padding-left: 20px !important;
}
body.staff-concierge-app #view-home .home-kpi-strip--pulse.command-kpi-strip,
body.staff-concierge-app #view-home #home-metrics-row-1.home-kpi-strip--pulse {
display: grid !important;
grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
gap: 0 !important;
flex: 0 0 auto !important;
height: auto !important;
min-height: 0 !important;
max-height: none !important;
align-items: start !important;
}
body.staff-concierge-app #view-home .home-kpi-strip--six.home-kpi-strip--pulse,
body.staff-concierge-app #view-home #home-metrics-row-1.home-kpi-strip--six {
display: grid !important;
grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
grid-auto-rows: auto !important;
gap: 0 !important;
row-gap: 4px !important;
flex: 1 1 auto !important;
width: 100% !important;
align-content: start !important;
}
body.staff-concierge-app #view-home .home-kpi-strip--six > .sr-only {
position: absolute !important;
}
body.staff-concierge-app #view-home .home-kpi-strip--six .home-kpi-card,
body.staff-concierge-app #view-home .home-kpi-strip--six button.home-kpi-card,
body.staff-concierge-app #view-home .home-kpi-strip--six article.home-kpi-card {
display: flex !important;
flex-direction: column !important;
align-items: flex-start !important;
justify-content: flex-start !important;
gap: 6px !important;
flex: 0 0 auto !important;
width: auto !important;
min-width: 0 !important;
height: auto !important;
min-height: 0 !important;
max-height: none !important;
margin: 0 !important;
padding: 12px 16px 12px 0 !important;
background: transparent !important;
border: none !important;
border-radius: 0 !important;
box-shadow: none !important;
text-align: left !important;
cursor: default !important;
color: inherit !important;
font: inherit !important;
overflow: visible !important;
transform: none !important;
}
body.staff-concierge-app #view-home .home-kpi-strip--six button.home-kpi-card {
cursor: pointer !important;
}
body.staff-concierge-app #view-home .home-kpi-strip--six .home-kpi-card:nth-child(odd) {
padding-right: 16px !important;
border-right: 1px solid rgba(76, 201, 240, 0.14) !important;
}
body.staff-concierge-app #view-home .home-kpi-strip--six .home-kpi-card:nth-child(even) {
padding-left: 16px !important;
}
body.staff-concierge-app #view-home .home-kpi-strip--six .home-kpi-card[hidden] {
display: none !important;
}
body.staff-concierge-app #view-home .home-kpi-strip--six .home-kpi-metric-body,
body.staff-concierge-app #view-home .home-kpi-strip--six .home-kpi-trend-slot,
body.staff-concierge-app #view-home .home-kpi-strip--six .home-kpi-trend-row {
width: 100% !important;
max-width: 100% !important;
height: auto !important;
min-height: 0 !important;
overflow: visible !important;
}
body.staff-concierge-app #view-home .home-kpi-strip--six .home-kpi-trend-row {
display: flex !important;
flex-wrap: wrap !important;
align-items: center !important;
gap: 4px !important;
margin-top: 2px !important;
}
body.staff-concierge-app #view-home .home-kpi-strip--six .home-kpi-trend-pill {
flex-shrink: 0 !important;
white-space: nowrap !important;
font-size: 0.72rem !important;
font-weight: 600 !important;
padding: 2px 7px !important;
border-radius: 999px !important;
background: rgba(255, 255, 255, 0.04) !important;
}
body.staff-concierge-app #view-home .home-kpi-strip--six .insights-trend--up {
color: #34D399 !important;
background: rgba(52, 211, 153, 0.12) !important;
}
body.staff-concierge-app #view-home .home-kpi-strip--six .insights-trend--down {
color: #F87171 !important;
background: rgba(248, 113, 113, 0.12) !important;
}
body.staff-concierge-app #view-home .home-kpi-strip--six .insights-trend--flat,
body.staff-concierge-app #view-home .home-kpi-strip--six .insights-trend--new {
color: rgba(244, 247, 250, 0.7) !important;
background: rgba(255, 255, 255, 0.05) !important;
}
body.staff-concierge-app #view-home .home-kpi-strip--pulse .home-kpi-card,
body.staff-concierge-app #view-home #home-metrics-row-1.home-kpi-strip--pulse .home-kpi-card {
flex: 0 0 auto !important;
height: auto !important;
min-height: 0 !important;
max-height: none !important;
}
body.staff-concierge-app #view-home .home-kpi-strip--six .insights-hero-label {
margin: 0 !important;
color: #F4F7FA !important;
font-size: 0.78rem !important;
font-weight: 600 !important;
padding-right: 0 !important;
overflow: visible !important;
white-space: nowrap !important;
text-overflow: clip !important;
}
body.staff-concierge-app #view-home .home-kpi-strip--six .insights-hero-value {
margin: 0 !important;
color: #F4F7FA !important;
font-size: 1.7rem !important;
font-weight: 700 !important;
letter-spacing: -0.02em !important;
line-height: 1.1 !important;
white-space: nowrap !important;
overflow: visible !important;
text-overflow: clip !important;
max-width: none !important;
font-variant-numeric: tabular-nums !important;
}
body.staff-concierge-app #view-home .home-kpi-strip--six .insights-hero-value.is-muted-value {
color: rgba(244, 247, 250, 0.4) !important;
font-weight: 600 !important;
}
body.staff-concierge-app #view-home .home-kpi-strip--six button.home-kpi-card:hover .insights-hero-value {
color: #4CC9F0 !important;
}
/* Live pill only when the queue has items */
body.staff-concierge-app #view-home .home-ops-block.is-empty .home-queue-live-tag {
display: none !important;
}
/* Sink volume to the bottom of the KPI stack — closes the gap above charts */
body.staff-concierge-app #view-home .home-kpi-stack {
display: flex !important;
flex-direction: column !important;
justify-content: flex-start !important;
gap: 12px !important;
}
body.staff-concierge-app #view-home .home-kpi-volume-block {
display: none !important;
}
body.staff-concierge-app #view-home .home-graphs-row--secondary {
flex: 1 1 0 !important;
min-height: 0 !important;
opacity: 0.95;
}
body.staff-concierge-app #view-home .home-queue-tab .home-queue-live-tag {
display: inline-flex !important;
align-items: center !important;
margin-left: 6px !important;
padding: 1px 7px !important;
border-radius: 999px !important;
font-size: 0.62rem !important;
font-weight: 600 !important;
letter-spacing: 0.04em !important;
text-transform: uppercase !important;
background: rgba(76, 201, 240, 0.12) !important;
color: #4CC9F0 !important;
line-height: 1.2 !important;
}
body.staff-concierge-app #view-home .home-queue-tab:not(.is-active) .home-queue-live-tag {
opacity: 0.55 !important;
}
@media (max-width: 1100px) {
body.staff-concierge-app #view-home .home-dashboard-grid--command.home-dashboard-grid--ops-first {
grid-template-columns: 1fr !important;
grid-template-rows: auto minmax(280px, 1fr) !important;
overflow: auto !important;
}
body.staff-concierge-app #view-home .home-dashboard-grid--ops-first > .home-ops-column {
min-height: 320px !important;
border-right: none !important;
border-bottom: 1px solid rgba(76, 201, 240, 0.14) !important;
padding-right: 0 !important;
padding-bottom: 16px !important;
}
body.staff-concierge-app #view-home .home-dashboard-grid--ops-first > .hijiffy-main {
padding-left: 0 !important;
padding-top: 16px !important;
}
}
/* Home ops — no nested scrollbars; preview rows + view more only */
body.staff-concierge-app #view-home .home-ops-column,
body.staff-concierge-app #view-home #home-pending-approvals,
body.staff-concierge-app #view-home #home-orders-panel,
body.staff-concierge-app #view-home #home-chats-panel,
body.staff-concierge-app #view-home #home-queue-panel,
body.staff-concierge-app #view-home .home-queue-pane,
body.staff-concierge-app #view-home #home-queue-pane-orders,
body.staff-concierge-app #view-home #home-queue-pane-chats,
body.staff-concierge-app #view-home #home-pending-list,
body.staff-concierge-app #view-home .home-side-list,
body.staff-concierge-app #view-home #home-orders-list,
body.staff-concierge-app #view-home #home-recent-list,
body.staff-concierge-app #view-home .hijiffy-conversation-list,
body.staff-concierge-app #view-home .command-table-body {
overflow: hidden !important;
overflow-x: hidden !important;
overflow-y: hidden !important;
scrollbar-width: none !important;
-ms-overflow-style: none !important;
}
body.staff-concierge-app #view-home #home-pending-list::-webkit-scrollbar,
body.staff-concierge-app #view-home .home-queue-pane::-webkit-scrollbar,
body.staff-concierge-app #view-home #home-orders-list::-webkit-scrollbar,
body.staff-concierge-app #view-home #home-recent-list::-webkit-scrollbar {
display: none !important;
width: 0 !important;
height: 0 !important;
}
body.staff-concierge-app #view-home #home-pending-approvals {
flex: 0 0 auto !important;
min-height: 0 !important;
max-height: none !important;
height: auto !important;
overflow: hidden !important;
}
body.staff-concierge-app #view-home #home-pending-list,
body.staff-concierge-app #view-home #home-pending-approvals:has(#home-pending-list [data-room]) #home-pending-list {
flex: 0 0 auto !important;
height: auto !important;
min-height: 0 !important;
max-height: none !important;
}
body.staff-concierge-app #view-home #home-queue-panel,
body.staff-concierge-app #view-home .home-ops-column > .home-queue-panel {
flex: 1 1 0 !important;
min-height: 0 !important;
overflow: hidden !important;
}
body.staff-concierge-app #view-home .home-queue-pane,
body.staff-concierge-app #view-home #home-queue-pane-orders,
body.staff-concierge-app #view-home #home-queue-pane-chats {
display: flex !important;
flex-direction: column !important;
flex: 1 1 auto !important;
min-height: 0 !important;
overflow: hidden !important;
}
body.staff-concierge-app #view-home #home-orders-list,
body.staff-concierge-app #view-home #home-recent-list {
flex: 0 0 auto !important;
height: auto !important;
max-height: none !important;
}
/* Three stacked ops blocks — equal share, 2-row previews, no tabs */
body.staff-concierge-app #view-home .home-ops-column--stack {
display: flex !important;
flex-direction: column !important;
gap: 14px !important;
min-height: 0 !important;
height: 100% !important;
overflow: hidden !important;
}
body.staff-concierge-app #view-home .home-ops-column--stack > .home-ops-block {
display: flex !important;
flex-direction: column !important;
flex: 0 0 auto !important;
min-height: 0 !important;
max-height: none !important;
height: auto !important;
margin: 0 !important;
padding: 0 !important;
background: transparent !important;
border: none !important;
border-radius: 0 !important;
box-shadow: none !important;
overflow: visible !important;
}
body.staff-concierge-app #view-home .home-ops-column--stack > .home-ops-block + .home-ops-block {
border-top: 1px solid rgba(255, 255, 255, 0.06) !important;
padding-top: 12px !important;
}
body.staff-concierge-app #view-home .home-ops-column--stack .home-side-panel-header,
body.staff-concierge-app #view-home .home-ops-column--stack #home-pending-approvals .home-side-panel-header,
body.staff-concierge-app #view-home .home-ops-column--stack #home-orders-panel .home-side-panel-header,
body.staff-concierge-app #view-home .home-ops-column--stack #home-chats-panel .home-side-panel-header {
display: flex !important;
align-items: center !important;
justify-content: space-between !important;
gap: 10px !important;
flex: 0 0 auto !important;
width: 100% !important;
box-sizing: border-box !important;
margin: 0 0 6px !important;
padding: 0 !important;
border: none !important;
border-bottom: none !important;
background: transparent !important;
}
body.staff-concierge-app #view-home .home-ops-column--stack .home-side-panel-header h4,
body.staff-concierge-app #view-home .home-ops-column--stack #home-pending-approvals .home-side-panel-header h4 {
display: inline-flex !important;
align-items: center !important;
flex-wrap: wrap !important;
flex: 1 1 auto !important;
min-width: 0 !important;
gap: 8px !important;
margin: 0 !important;
padding: 0 !important;
color: #F4F7FA !important;
font-size: 0.92rem !important;
font-weight: 650 !important;
}
body.staff-concierge-app #view-home .home-ops-column--stack .home-side-badge,
body.staff-concierge-app #view-home .home-ops-column--stack #home-pending-approvals .home-side-badge,
body.staff-concierge-app #view-home .home-ops-column--stack #home-queue-orders-count,
body.staff-concierge-app #view-home .home-ops-column--stack #home-queue-chats-count {
flex: 0 0 auto !important;
margin: 0 !important;
margin-left: auto !important;
align-self: center !important;
}
body.staff-concierge-app #view-home .home-ops-column--stack .home-queue-live-tag {
display: inline-flex !important;
margin-left: 0 !important;
}
body.staff-concierge-app #view-home .home-ops-column--stack .home-side-list,
body.staff-concierge-app #view-home .home-ops-column--stack .hijiffy-conversation-list {
flex: 0 0 auto !important;
min-height: 0 !important;
}
body.staff-concierge-app #view-home .home-ops-column--stack .hijiffy-view-more {
flex: 0 0 auto !important;
align-self: flex-start !important;
margin: 4px 0 0 !important;
padding: 6px 0 2px !important;
color: #4CC9F0 !important;
font-weight: 700 !important;
font-size: 0.8rem !important;
background: transparent !important;
border: none !important;
box-shadow: none !important;
cursor: pointer !important;
visibility: visible !important;
opacity: 1 !important;
z-index: 2 !important;
}
body.staff-concierge-app #view-home .home-ops-column--stack .hijiffy-view-more:not([hidden]) {
display: inline-flex !important;
}
body.staff-concierge-app #view-home .home-ops-column--stack #home-pending-view-more:not([hidden]),
body.staff-concierge-app #view-home .home-ops-column--stack #home-orders-view-more:not([hidden]),
body.staff-concierge-app #view-home .home-ops-column--stack #home-view-more:not([hidden]) {
display: inline-flex !important;
}
body.staff-concierge-app #view-home .home-ops-column--stack .hijiffy-empty:not([hidden]) {
flex: 1 1 auto !important;
display: flex !important;
align-items: center !important;
min-height: 48px !important;
}
body.staff-concierge-app #view-home .home-ops-column--stack .hijiffy-empty[hidden],
body.staff-concierge-app #view-home #home-recent-empty[hidden],
body.staff-concierge-app #view-home #home-queue-orders-empty[hidden],
body.staff-concierge-app #view-home #home-pending-empty[hidden] {
display: none !important;
visibility: hidden !important;
height: 0 !important;
min-height: 0 !important;
margin: 0 !important;
padding: 0 !important;
overflow: hidden !important;
pointer-events: none !important;
}
/* No row dividers in ops lists — section hairline only */
body.staff-concierge-app #view-home .home-ops-column--stack #home-pending-list > *,
body.staff-concierge-app #view-home .home-ops-column--stack #home-orders-list > *,
body.staff-concierge-app #view-home .home-ops-column--stack #home-recent-list > *,
body.staff-concierge-app #view-home .home-ops-column--stack .home-pending-row,
body.staff-concierge-app #view-home .home-ops-column--stack .hijiffy-conversation,
body.staff-concierge-app #view-home .home-ops-column--stack .order-queue-item {
border: none !important;
border-bottom: none !important;
box-shadow: none !important;
}
/* Chrome unify — rail + topbar share one surface */
body.staff-concierge-app .concierge-rail,
body.staff-concierge-app.dark-mode .concierge-rail,
body.staff-concierge-app .concierge-topbar,
body.staff-concierge-app .concierge-topbar.topbar--compact,
body.staff-concierge-app .dash-header,
body.staff-concierge-app.dark-mode .concierge-topbar,
body.staff-concierge-app.dark-mode .dash-header,
body.staff-concierge-app[data-rail-view] .concierge-topbar,
body.staff-concierge-app[data-rail-view] .concierge-topbar.topbar--compact {
background: #080808 !important;
background-color: #080808 !important;
}
body.staff-concierge-app .concierge-rail,
body.staff-concierge-app.dark-mode .concierge-rail {
border-right: none !important;
}
/* ============================================================
WORKSPACE DARK — Messages / Requests / Archive (force neon)
Editorial floating stage still paints white panels here.
============================================================ */
body.staff-concierge-app,
body.staff-concierge-app.dark-mode {
--stage-canvas: #050505 !important;
--stage-float: transparent !important;
--stage-shadow: none !important;
--stage-shadow-sm: none !important;
}
body.staff-concierge-app .concierge-main-wrap,
body.staff-concierge-app .dashboard,
body.staff-concierge-app .dash-shell,
body.staff-concierge-app .dash-main,
body.staff-concierge-app #view-workspace:not([hidden]),
body.staff-concierge-app #view-workspace .dash-body,
body.staff-concierge-app .dash-body-guest-chats,
body.staff-concierge-app .dash-body-archived-guests,
body.staff-concierge-app .dash-body-staff-inbox,
body.staff-concierge-app .dash-body-archived-staff,
body.staff-concierge-app .dash-body-orders,
body.staff-concierge-app .dash-body-archive-approvals,
body.staff-concierge-app .dash-body-completed {
background: #050505 !important;
background-color: #050505 !important;
color: #F4F7FA !important;
}
body.staff-concierge-app .orders-panel,
body.staff-concierge-app .completed-panel,
body.staff-concierge-app .archive-approvals-panel,
body.staff-concierge-app .rooms-panel,
body.staff-concierge-app #attention-panel,
body.staff-concierge-app #attention-panel.rooms-panel,
body.staff-concierge-app .staff-inbox-panel,
body.staff-concierge-app .thread-panel,
body.staff-concierge-app .order-panel,
body.staff-concierge-app .dash-col,
body.staff-concierge-app .dash-body-guest-chats .dash-col:first-child,
body.staff-concierge-app .dash-body-archived-guests .dash-col:first-child,
body.staff-concierge-app .dash-body-staff-inbox .dash-col:first-child,
body.staff-concierge-app .dash-body-archived-staff .dash-col:first-child {
background: transparent !important;
background-color: transparent !important;
border: none !important;
border-right: none !important;
border-radius: 0 !important;
box-shadow: none !important;
color: #F4F7FA !important;
}
body.staff-concierge-app .orders-panel::before,
body.staff-concierge-app .order-panel::before,
body.staff-concierge-app .completed-panel::before,
body.staff-concierge-app .rooms-panel::before,
body.staff-concierge-app #attention-panel.rooms-panel::before,
body.staff-concierge-app .staff-inbox-panel::before,
body.staff-concierge-app .thread-panel::before {
content: none !important;
display: none !important;
}
body.staff-concierge-app .col-toolbar,
body.staff-concierge-app .col-toolbar--filtered,
body.staff-concierge-app #attention-panel.rooms-panel .col-toolbar--filtered,
body.staff-concierge-app .orders-panel .col-toolbar--filtered,
body.staff-concierge-app .completed-panel .col-toolbar--filtered {
background: transparent !important;
border: none !important;
border-bottom: 1px solid rgba(255, 255, 255, 0.06) !important;
box-shadow: none !important;
color: #F4F7FA !important;
}
body.staff-concierge-app .col-toolbar h2,
body.staff-concierge-app .col-toolbar--filtered h2,
body.staff-concierge-app #attention-panel.rooms-panel .col-toolbar--filtered h2 {
color: #F4F7FA !important;
}
body.staff-concierge-app .workspace-subnav,
body.staff-concierge-app .workspace-subnav-btn {
background: transparent !important;
box-shadow: none !important;
}
body.staff-concierge-app .workspace-subnav-btn {
color: rgba(244, 247, 250, 0.55) !important;
}
body.staff-concierge-app .workspace-subnav-btn.is-active {
background: rgba(76, 201, 240, 0.12) !important;
color: #4CC9F0 !important;
box-shadow: none !important;
}
body.staff-concierge-app .guest-room-bubbles,
body.staff-concierge-app #guest-room-bubbles,
body.staff-concierge-app .dash-body-guest-chats .guest-room-bubbles {
background: transparent !important;
border: none !important;
box-shadow: none !important;
}
body.staff-concierge-app .guest-room-bubble-label {
color: rgba(244, 247, 250, 0.55) !important;
}
body.staff-concierge-app .guest-room-bubble.is-active .guest-room-bubble-label {
color: #F4F7FA !important;
}
body.staff-concierge-app .rooms-inbox-list,
body.staff-concierge-app #rooms-inbox-list,
body.staff-concierge-app .orders-queue-list,
body.staff-concierge-app .staff-inbox-list {
background: transparent !important;
color: #F4F7FA !important;
}
body.staff-concierge-app .rooms-inbox-list .room-inbox-item,
body.staff-concierge-app .rooms-inbox-list .inbox-queue-main,
body.staff-concierge-app .rooms-inbox-list .inbox-queue-copy,
body.staff-concierge-app .rooms-inbox-list .inbox-queue-copy strong,
body.staff-concierge-app .rooms-inbox-list .inbox-queue-copy small,
body.staff-concierge-app .rooms-inbox-list .hijiffy-conversation,
body.staff-concierge-app .rooms-inbox-list .hijiffy-conversation strong,
body.staff-concierge-app .rooms-inbox-list .hijiffy-conversation small,
body.staff-concierge-app .rooms-inbox-list time,
body.staff-concierge-app .order-queue-item,
body.staff-concierge-app .order-queue-item strong,
body.staff-concierge-app .order-queue-item small,
body.staff-concierge-app .order-queue-copy {
color: #F4F7FA !important;
background: transparent !important;
border-color: rgba(255, 255, 255, 0.06) !important;
}
body.staff-concierge-app .rooms-inbox-list .inbox-queue-copy small,
body.staff-concierge-app .rooms-inbox-list .hijiffy-conversation small,
body.staff-concierge-app .order-queue-item small,
body.staff-concierge-app .rooms-inbox-list time,
body.staff-concierge-app .order-queue-item time {
color: rgba(244, 247, 250, 0.62) !important;
}
/* Requests queue — editorial forces #0F172A on room labels (invisible on dark) */
body.staff-concierge-app .orders-queue-list .order-queue-room,
body.staff-concierge-app #orders-queue-list .order-queue-room,
body.staff-concierge-app .orders-panel .order-queue-room,
body.staff-concierge-app .completed-panel .order-queue-room,
body.staff-concierge-app .order-queue-room,
body.staff-concierge-app .inbox-item-room,
body.staff-concierge-app .orders-queue-list .order-queue-head,
body.staff-concierge-app #orders-queue-list .order-queue-head {
color: #F4F7FA !important;
}
body.staff-concierge-app .orders-queue-list .order-queue-summary,
body.staff-concierge-app #orders-queue-list .order-queue-summary,
body.staff-concierge-app .orders-queue-list .order-queue-time,
body.staff-concierge-app #orders-queue-list .order-queue-time,
body.staff-concierge-app .order-queue-summary,
body.staff-concierge-app .order-queue-time {
color: rgba(244, 247, 250, 0.62) !important;
}
body.staff-concierge-app .orders-queue-list .order-queue-unseen,
body.staff-concierge-app #orders-queue-list .order-queue-unseen {
background: #4CC9F0 !important;
}
/* Progress tree — editorial pending labels are rgba(10,10,10,*) (invisible on dark) */
body.staff-concierge-app .order-progress-label,
body.staff-concierge-app .order-progress-step.is-pending .order-progress-label {
color: rgba(244, 247, 250, 0.55) !important;
}
body.staff-concierge-app .order-progress-step.is-current .order-progress-label {
color: #F4F7FA !important;
}
body.staff-concierge-app .order-progress-step.is-done .order-progress-label {
color: #4CC9F0 !important;
}
body.staff-concierge-app .order-progress-step.status-tone-ordered.is-done .order-progress-label,
body.staff-concierge-app .order-progress-step.status-tone-ordered.is-current .order-progress-label {
color: #FBBF24 !important;
}
body.staff-concierge-app .order-progress-step.status-tone-confirmed.is-done .order-progress-label,
body.staff-concierge-app .order-progress-step.status-tone-confirmed.is-current .order-progress-label {
color: #4CC9F0 !important;
}
body.staff-concierge-app .order-progress-step.status-tone-delivered.is-done .order-progress-label,
body.staff-concierge-app .order-progress-step.status-tone-delivered.is-current .order-progress-label {
color: #60A5FA !important;
}
body.staff-concierge-app .order-progress-step.status-tone-completed.is-done .order-progress-label,
body.staff-concierge-app .order-progress-step.status-tone-completed.is-current .order-progress-label {
color: #34D399 !important;
}
body.staff-concierge-app .order-progress-step.is-pending .order-progress-dot {
border-color: rgba(76, 201, 240, 0.35) !important;
background: #121212 !important;
}
/* Request detail — kill white cards */
body.staff-concierge-app .order-detail-active,
body.staff-concierge-app .order-detail-body,
body.staff-concierge-app .order-detail-summary,
body.staff-concierge-app .order-detail-timeline-wrap,
body.staff-concierge-app .order-detail-timeline,
body.staff-concierge-app .order-detail-hint,
body.staff-concierge-app .order-detail-actions,
body.staff-concierge-app .order-detail-header,
body.staff-concierge-app .order-detail-empty,
body.staff-concierge-app .thread-panel .thread-compose,
body.staff-concierge-app .thread-panel .thread-messages {
background: transparent !important;
background-color: transparent !important;
border-color: rgba(255, 255, 255, 0.08) !important;
box-shadow: none !important;
color: #F4F7FA !important;
}
body.staff-concierge-app .order-detail-summary,
body.staff-concierge-app .order-detail-timeline-wrap,
body.staff-concierge-app .order-detail-hint,
body.staff-concierge-app .order-detail-actions {
border: 1px solid rgba(255, 255, 255, 0.08) !important;
border-radius: 12px !important;
background: rgba(255, 255, 255, 0.03) !important;
}
body.staff-concierge-app .order-detail-summary *,
body.staff-concierge-app .order-detail-timeline-wrap *,
body.staff-concierge-app .order-detail-hint,
body.staff-concierge-app .order-detail-room,
body.staff-concierge-app .order-detail-type,
body.staff-concierge-app .order-detail-order-no,
body.staff-concierge-app .order-detail-sub,
body.staff-concierge-app .order-detail-empty-lead,
body.staff-concierge-app .order-detail-empty-sub {
color: #F4F7FA !important;
}
body.staff-concierge-app .order-detail-order-no,
body.staff-concierge-app #order-detail-order-no {
margin: 4px 0 0 !important;
font-size: 0.95rem !important;
font-weight: 700 !important;
letter-spacing: 0.04em !important;
color: #4CC9F0 !important;
}
body.staff-concierge-app .order-detail-hint,
body.staff-concierge-app .order-detail-sub,
body.staff-concierge-app .order-detail-empty-sub {
color: rgba(244, 247, 250, 0.62) !important;
}
/* Order receipt — dark surface (editorial still forces white #FFFFFF) */
body.staff-concierge-app .order-receipt,
body.staff-concierge-app.dark-mode .order-receipt {
background: rgba(255, 255, 255, 0.04) !important;
border: 1px solid rgba(76, 201, 240, 0.16) !important;
color: #F4F7FA !important;
}
body.staff-concierge-app .order-receipt-table th,
body.staff-concierge-app.dark-mode .order-receipt-table th {
background: rgba(255, 255, 255, 0.05) !important;
color: rgba(244, 247, 250, 0.55) !important;
border-bottom: 1px solid rgba(255, 255, 255, 0.08) !important;
}
body.staff-concierge-app .order-receipt-table td,
body.staff-concierge-app.dark-mode .order-receipt-table td {
color: #F4F7FA !important;
border-bottom: 1px solid rgba(255, 255, 255, 0.06) !important;
}
body.staff-concierge-app .order-receipt-qty,
body.staff-concierge-app .order-receipt-name,
body.staff-concierge-app .order-receipt-amt,
body.staff-concierge-app.dark-mode .order-receipt-qty,
body.staff-concierge-app.dark-mode .order-receipt-name,
body.staff-concierge-app.dark-mode .order-receipt-amt {
color: #F4F7FA !important;
}
body.staff-concierge-app .order-guest-note,
body.staff-concierge-app.dark-mode .order-guest-note {
border-color: rgba(76, 201, 240, 0.28) !important;
background: rgba(76, 201, 240, 0.08) !important;
}
body.staff-concierge-app .order-guest-note-label,
body.staff-concierge-app.dark-mode .order-guest-note-label {
color: rgba(0, 229, 255, 0.8) !important;
}
body.staff-concierge-app .order-guest-note-text,
body.staff-concierge-app .order-detail-summary-text,
body.staff-concierge-app.dark-mode .order-guest-note-text,
body.staff-concierge-app.dark-mode .order-detail-summary-text {
color: #F4F7FA !important;
}
body.staff-concierge-app .order-receipt-note,
body.staff-concierge-app.dark-mode .order-receipt-note {
color: rgba(244, 247, 250, 0.55) !important;
}
body.staff-concierge-app .order-receipt-table tfoot td,
body.staff-concierge-app.dark-mode .order-receipt-table tfoot td {
background: rgba(76, 201, 240, 0.08) !important;
border-top: 1px solid rgba(255, 255, 255, 0.1) !important;
color: #F4F7FA !important;
}
body.staff-concierge-app .order-receipt-total-label,
body.staff-concierge-app .order-receipt-total-value,
body.staff-concierge-app.dark-mode .order-receipt-total-label,
body.staff-concierge-app.dark-mode .order-receipt-total-value {
color: #F4F7FA !important;
}
/* Guest messages — title + Guests/Room filters removed (topbar search + room bubbles cover this) */
body.staff-concierge-app #guest-inbox-toolbar,
body.staff-concierge-app .dash-body-guest-chats #attention-panel > .col-toolbar,
body.staff-concierge-app[data-rail-view="guest-inbox"] #attention-panel > .col-toolbar,
body.staff-concierge-app[data-rail-view="inbox"]:has(.dash-body-guest-chats) #attention-panel > .col-toolbar {
display: none !important;
}
/* Requests — Guests/Room dropdowns removed (search + order bubbles) */
body.staff-concierge-app #orders-inbox-toolbar,
body.staff-concierge-app .orders-panel > .col-toolbar,
body.staff-concierge-app[data-rail-view="active-orders"] .orders-panel > .col-toolbar {
display: none !important;
}
body.staff-concierge-app .dash-body-active-orders .orders-room-bubbles,
body.staff-concierge-app[data-rail-view="active-orders"] .orders-room-bubbles,
body.staff-concierge-app #orders-room-bubbles:not([hidden]) {
display: flex !important;
flex-wrap: nowrap;
gap: 0.75rem;
overflow-x: auto;
padding: 0.85rem 1rem 1rem;
background: transparent !important;
border: none !important;
border-bottom: 1px solid rgba(255, 255, 255, 0.06) !important;
box-shadow: none !important;
}
body.staff-concierge-app .dash-body-active-orders .guest-room-bubble-avatar,
body.staff-concierge-app[data-rail-view="active-orders"] .guest-room-bubble-avatar,
body.staff-concierge-app #orders-room-bubbles .guest-room-bubble-avatar {
box-shadow: 0 0 0 3px #050505, 0 0 0 5px rgba(76, 201, 240, 0.22) !important;
}
body.staff-concierge-app .dash-body-active-orders .guest-room-bubble.is-active .guest-room-bubble-avatar,
body.staff-concierge-app .dash-body-active-orders .guest-room-bubble.has-unread .guest-room-bubble-avatar,
body.staff-concierge-app[data-rail-view="active-orders"] .guest-room-bubble.is-active .guest-room-bubble-avatar,
body.staff-concierge-app[data-rail-view="active-orders"] .guest-room-bubble.has-unread .guest-room-bubble-avatar,
body.staff-concierge-app #orders-room-bubbles .guest-room-bubble.is-active .guest-room-bubble-avatar,
body.staff-concierge-app #orders-room-bubbles .guest-room-bubble.has-unread .guest-room-bubble-avatar {
box-shadow: 0 0 0 3px #050505, 0 0 0 5px #4CC9F0 !important;
}
body.staff-concierge-app #orders-room-bubbles .guest-room-bubble-unread {
border-color: #050505 !important;
}
body.staff-concierge-app .list-sort-bar,
body.staff-concierge-app .orders-sort-bar,
body.staff-concierge-app .messages-sort-bar {
display: flex !important;
align-items: center;
justify-content: space-between;
gap: 0.75rem;
padding: 0.15rem 1rem 0.55rem;
border-bottom: 1px solid rgba(255, 255, 255, 0.05);
}
body.staff-concierge-app .orders-sort-bar .orders-kbd-hint {
display: block !important;
margin: 0 !important;
flex: 1 1 auto;
min-width: 0;
}
body.staff-concierge-app .list-sort-label,
body.staff-concierge-app .orders-sort-label,
body.staff-concierge-app .messages-sort-label {
color: rgba(255, 255, 255, 0.45);
font-size: 0.65rem;
font-weight: 600;
letter-spacing: 0.06em;
text-transform: uppercase;
}
body.staff-concierge-app .list-sort-bar .dash-custom-select-trigger,
body.staff-concierge-app .list-sort-bar .list-sort-select,
body.staff-concierge-app .list-sort-bar .orders-sort-select,
body.staff-concierge-app .list-sort-bar .messages-sort-select {
background: transparent !important;
background-color: transparent !important;
border: none !important;
border-radius: 0 !important;
box-shadow: none !important;
padding: 0.1rem 0 !important;
min-height: 0 !important;
color: rgba(255, 255, 255, 0.88) !important;
font-size: 0.72rem !important;
width: auto !important;
max-width: min(16rem, 65vw);
}
body.staff-concierge-app .list-sort-bar .dash-custom-select.is-open .dash-custom-select-trigger,
body.staff-concierge-app .list-sort-bar .dash-custom-select-trigger:hover,
body.staff-concierge-app .list-sort-bar .dash-custom-select-trigger:focus-visible {
background: transparent !important;
background-color: transparent !important;
border: none !important;
box-shadow: none !important;
color: var(--ac-cyan) !important;
outline: none;
}
body.staff-concierge-app .list-sort-bar .dash-custom-select-chevron {
color: var(--ac-cyan);
opacity: 0.9;
}
body.staff-concierge-app .guest-room-bubble.is-prearrival-guest .guest-room-bubble-avatar {
background: var(--hijiffy-avatar-prearrival-bg) !important;
font-size: 0.72rem !important;
letter-spacing: 0.05em !important;
box-shadow: 0 0 0 3px #050505, 0 0 0 5px rgba(91, 141, 239, 0.38) !important;
}
body.staff-concierge-app .guest-room-bubble.is-prearrival-guest.is-active .guest-room-bubble-avatar,
body.staff-concierge-app .guest-room-bubble.is-prearrival-guest.has-unread .guest-room-bubble-avatar,
body.staff-concierge-app .guest-room-bubble.is-prearrival-guest.is-live .guest-room-bubble-avatar {
box-shadow: 0 0 0 3px #050505, 0 0 0 5px rgba(91, 141, 239, 0.62) !important;
}
body.staff-concierge-app .hijiffy-avatar.is-prearrival-guest,
body.staff-concierge-app .order-queue-avatar.is-prearrival-guest,
body.staff-concierge-app .inbox-queue-avatar.is-prearrival-guest {
background: var(--hijiffy-avatar-prearrival-bg) !important;
font-size: 0.78rem !important;
letter-spacing: 0.05em !important;
}
/* Guest Messages — editorial forces #FFFFFF surfaces (light text vanishes) */
body.staff-concierge-app[data-rail-view="guest-inbox"] .concierge-main-wrap,
body.staff-concierge-app[data-rail-view="guest-inbox"] .dashboard,
body.staff-concierge-app[data-rail-view="guest-inbox"] #view-workspace,
body.staff-concierge-app[data-rail-view="guest-inbox"] #view-workspace:not([hidden]),
body.staff-concierge-app[data-rail-view="guest-inbox"] #view-workspace .dash-body.dash-body-guest-chats,
body.staff-concierge-app[data-rail-view="guest-inbox"] .workspace-subnav,
body.staff-concierge-app[data-rail-view="inbox"]:has(.dash-body-guest-chats) .concierge-main-wrap,
body.staff-concierge-app[data-rail-view="inbox"]:has(.dash-body-guest-chats) .dashboard,
body.staff-concierge-app[data-rail-view="inbox"]:has(.dash-body-guest-chats) #view-workspace,
body.staff-concierge-app[data-rail-view="inbox"]:has(.dash-body-guest-chats) #view-workspace:not([hidden]),
body.staff-concierge-app[data-rail-view="inbox"]:has(.dash-body-guest-chats) .workspace-subnav,
body.staff-concierge-app #view-workspace .dash-body.dash-body-guest-chats,
body.staff-concierge-app .dash-body-guest-chats {
background: #050505 !important;
background-color: #050505 !important;
color: #F4F7FA !important;
}
body.staff-concierge-app[data-rail-view="guest-inbox"] .workspace-subnav-btn,
body.staff-concierge-app[data-rail-view="inbox"]:has(.dash-body-guest-chats) .workspace-subnav-btn {
color: rgba(244, 247, 250, 0.55) !important;
}
body.staff-concierge-app[data-rail-view="guest-inbox"] .workspace-subnav-btn.is-active,
body.staff-concierge-app[data-rail-view="inbox"]:has(.dash-body-guest-chats) .workspace-subnav-btn.is-active {
color: #4CC9F0 !important;
border-bottom-color: #4CC9F0 !important;
}
body.staff-concierge-app .dash-body-guest-chats #attention-panel.rooms-panel,
body.staff-concierge-app .dash-body-guest-chats .dash-col:first-child,
body.staff-concierge-app[data-rail-view="guest-inbox"] #attention-panel.rooms-panel {
border-right: 1px solid rgba(255, 255, 255, 0.06) !important;
background: transparent !important;
}
body.staff-concierge-app .dash-body-guest-chats .guest-room-bubbles,
body.staff-concierge-app[data-rail-view="guest-inbox"] .guest-room-bubbles {
background: transparent !important;
border-bottom: 1px solid rgba(255, 255, 255, 0.06) !important;
}
body.staff-concierge-app .dash-body-guest-chats .guest-room-bubble-avatar,
body.staff-concierge-app[data-rail-view="guest-inbox"] .guest-room-bubble-avatar {
box-shadow: 0 0 0 3px #050505, 0 0 0 5px rgba(76, 201, 240, 0.22) !important;
}
body.staff-concierge-app .dash-body-guest-chats .guest-room-bubble.is-live .guest-room-bubble-avatar,
body.staff-concierge-app .dash-body-guest-chats .guest-room-bubble.has-unread .guest-room-bubble-avatar,
body.staff-concierge-app[data-rail-view="guest-inbox"] .guest-room-bubble.is-live .guest-room-bubble-avatar,
body.staff-concierge-app[data-rail-view="guest-inbox"] .guest-room-bubble.has-unread .guest-room-bubble-avatar {
box-shadow: 0 0 0 3px #050505, 0 0 0 5px #4CC9F0 !important;
}
body.staff-concierge-app .dash-body-guest-chats .guest-room-bubble.is-active .guest-room-bubble-avatar,
body.staff-concierge-app[data-rail-view="guest-inbox"] .guest-room-bubble.is-active .guest-room-bubble-avatar {
box-shadow: 0 0 0 3px #050505, 0 0 0 5px #4CC9F0 !important;
}
body.staff-concierge-app .dash-body-guest-chats .guest-room-bubble-unread,
body.staff-concierge-app .dash-body-guest-chats .guest-room-bubble-live,
body.staff-concierge-app[data-rail-view="guest-inbox"] .guest-room-bubble-unread,
body.staff-concierge-app[data-rail-view="guest-inbox"] .guest-room-bubble-live {
border-color: #050505 !important;
}
body.staff-concierge-app .rooms-inbox-list .messenger-chat-row .inbox-item-room,
body.staff-concierge-app .rooms-inbox-list .messenger-chat-row .inbox-item-room *,
body.staff-concierge-app .rooms-inbox-list .inbox-item-room,
body.staff-concierge-app .rooms-inbox-list .inbox-queue-room {
color: #F4F7FA !important;
}
body.staff-concierge-app .rooms-inbox-list .messenger-chat-row .inbox-item-preview,
body.staff-concierge-app .rooms-inbox-list .messenger-chat-row .inbox-item-time,
body.staff-concierge-app .rooms-inbox-list .inbox-item-preview,
body.staff-concierge-app .rooms-inbox-list .inbox-item-time,
body.staff-concierge-app .rooms-inbox-empty-main,
body.staff-concierge-app .rooms-inbox-empty-hint,
body.staff-concierge-app .col-toolbar--filtered .col-toolbar-hint,
body.staff-concierge-app #attention-panel .col-toolbar p,
body.staff-concierge-app #attention-panel .col-toolbar .hint {
color: rgba(244, 247, 250, 0.62) !important;
}
body.staff-concierge-app .dash-body-guest-chats .rooms-inbox-list .room-inbox-wrap,
body.staff-concierge-app[data-rail-view="guest-inbox"] .rooms-inbox-list .room-inbox-wrap {
background: transparent !important;
border-bottom: 1px solid rgba(255, 255, 255, 0.06) !important;
}
body.staff-concierge-app .dash-body-guest-chats .rooms-inbox-list .room-inbox-wrap.active,
body.staff-concierge-app[data-rail-view="guest-inbox"] .rooms-inbox-list .room-inbox-wrap.active {
background: rgba(76, 201, 240, 0.08) !important;
box-shadow: inset 3px 0 0 #4CC9F0 !important;
}
body.staff-concierge-app .dash-body-guest-chats #thread-panel .thread-compose input,
body.staff-concierge-app[data-rail-view="guest-inbox"] #thread-panel .thread-compose input {
background: rgba(255, 255, 255, 0.06) !important;
color: #F4F7FA !important;
}
body.staff-concierge-app .dash-body-guest-chats #thread-panel .thread-compose input:focus,
body.staff-concierge-app[data-rail-view="guest-inbox"] #thread-panel .thread-compose input:focus {
background: rgba(255, 255, 255, 0.09) !important;
}
/* Home / main menu — no topbar search */
body.staff-concierge-app[data-rail-view="home"] .concierge-topbar-center,
body.staff-concierge-app[data-rail-view="home"] .concierge-search,
body.staff-concierge-app[data-rail-view="home"] .concierge-search-toggle,
body.staff-concierge-app .concierge-topbar.topbar-no-search .concierge-topbar-center,
body.staff-concierge-app .concierge-topbar.topbar-no-search .concierge-search,
body.staff-concierge-app .concierge-topbar.topbar-no-search .concierge-search-toggle {
display: none !important;
}
/* Team channels: same bubble strip as Guest messages */
body.staff-concierge-app #staff-inbox-toolbar,
body.staff-concierge-app #staff-dept-buttons {
display: none !important;
}
body.staff-concierge-app .dash-body-staff-inbox .staff-room-bubbles,
body.staff-concierge-app[data-rail-view="staff-inbox"] .staff-room-bubbles,
body.staff-concierge-app #staff-room-bubbles:not([hidden]) {
display: flex !important;
flex-wrap: nowrap;
gap: 0.75rem;
overflow-x: auto;
padding: 0.85rem 1rem 1rem;
background: transparent !important;
border: none !important;
border-bottom: 1px solid rgba(255, 255, 255, 0.06) !important;
box-shadow: none !important;
}
body.staff-concierge-app .dash-body-staff-inbox .guest-room-bubble-avatar,
body.staff-concierge-app[data-rail-view="staff-inbox"] .guest-room-bubble-avatar,
body.staff-concierge-app #staff-room-bubbles .guest-room-bubble-avatar {
box-shadow: 0 0 0 3px #050505, 0 0 0 5px rgba(76, 201, 240, 0.22) !important;
}
body.staff-concierge-app .dash-body-staff-inbox .guest-room-bubble.is-active .guest-room-bubble-avatar,
body.staff-concierge-app[data-rail-view="staff-inbox"] .guest-room-bubble.is-active .guest-room-bubble-avatar,
body.staff-concierge-app #staff-room-bubbles .guest-room-bubble.is-active .guest-room-bubble-avatar {
box-shadow: 0 0 0 3px #050505, 0 0 0 5px #4CC9F0 !important;
}
body.staff-concierge-app .dash-body-staff-inbox .staff-inbox-list .inbox-item-room,
body.staff-concierge-app[data-rail-view="staff-inbox"] .staff-inbox-list .inbox-item-room,
body.staff-concierge-app .staff-inbox-list .inbox-item-room {
color: #F4F7FA !important;
}
body.staff-concierge-app .dash-body-staff-inbox .staff-inbox-list .inbox-item-preview,
body.staff-concierge-app[data-rail-view="staff-inbox"] .staff-inbox-list .inbox-item-preview {
color: rgba(244, 247, 250, 0.55) !important;
}
/* ============================================================
Chat window — kill editorial white panel (Messenger stack)
Specificity must beat:
.dash-body-guest-chats.is-chat-open #thread-panel.thread-panel:not([hidden])
============================================================ */
body.staff-concierge-app .dash-body-guest-chats.is-chat-open #thread-panel.thread-panel:not([hidden]),
body.staff-concierge-app .dash-body-guest-chats.is-chat-open #thread-panel.thread-panel,
body.staff-concierge-app .dash-body-guest-chats #thread-panel.thread-panel,
body.staff-concierge-app .dash-body-staff-inbox #thread-panel.thread-panel,
body.staff-concierge-app .dash-body-archived-guests #thread-panel.thread-panel,
body.staff-concierge-app .dash-body-archived-staff #thread-panel.thread-panel,
body.staff-concierge-app[data-rail-view="inbox"] #thread-panel.thread-panel,
body.staff-concierge-app #thread-panel.thread-panel {
background: #050505 !important;
background-color: #050505 !important;
border: none !important;
border-radius: 0 !important;
box-shadow: none !important;
color: #F4F7FA !important;
}
body.staff-concierge-app .dash-body-guest-chats .thread-panel-toolbar,
body.staff-concierge-app .dash-body-guest-chats.is-chat-open .thread-panel-toolbar,
body.staff-concierge-app #thread-panel .thread-panel-toolbar {
background: #050505 !important;
border-bottom: 1px solid rgba(255, 255, 255, 0.06) !important;
color: #F4F7FA !important;
}
/* Keep ← Messages visible when a chat is open (editorial hides this toolbar) */
body.staff-concierge-app .dash-body-guest-chats.is-chat-open .thread-panel:has(#thread-active:not([hidden])) .thread-panel-toolbar,
body.staff-concierge-app .dash-body-guest-chats.is-chat-open #thread-panel .thread-panel-toolbar,
body.staff-concierge-app .dash-body-guest-chats.is-chat-open .thread-panel-toolbar {
display: flex !important;
align-items: center !important;
gap: 10px !important;
padding: 10px 16px !important;
flex-shrink: 0 !important;
}
body.staff-concierge-app .dash-body-guest-chats.is-chat-open #btn-thread-back:not([hidden]),
body.staff-concierge-app .dash-body-guest-chats.is-chat-open .thread-back-btn:not([hidden]) {
display: inline-flex !important;
align-items: center !important;
gap: 6px !important;
color: #4CC9F0 !important;
background: transparent !important;
border: none !important;
font-weight: 700 !important;
cursor: pointer !important;
padding: 6px 10px 6px 4px !important;
}
body.staff-concierge-app .dash-body-guest-chats.is-chat-open .thread-active:not([hidden]),
body.staff-concierge-app #thread-panel .thread-active,
body.staff-concierge-app #thread-panel .thread-messages,
body.staff-concierge-app #thread-panel .thread-header,
body.staff-concierge-app #thread-panel .thread-compose,
body.staff-concierge-app .dash-body-guest-chats.is-chat-open .thread-header,
body.staff-concierge-app .dash-body-guest-chats #thread-panel .thread-compose {
background: transparent !important;
background-color: transparent !important;
color: #F4F7FA !important;
border-color: rgba(255, 255, 255, 0.08) !important;
box-shadow: none !important;
}
body.staff-concierge-app #thread-panel .thread-header,
body.staff-concierge-app .dash-body-guest-chats.is-chat-open .thread-header {
border-bottom: 1px solid rgba(255, 255, 255, 0.08) !important;
}
body.staff-concierge-app #thread-panel .thread-compose,
body.staff-concierge-app .dash-body-guest-chats #thread-panel .thread-compose {
border-top: 1px solid rgba(255, 255, 255, 0.08) !important;
background: rgba(255, 255, 255, 0.02) !important;
}
body.staff-concierge-app #thread-panel #thread-title,
body.staff-concierge-app #thread-panel .thread-header h2,
body.staff-concierge-app #thread-panel-title,
body.staff-concierge-app #thread-panel .thread-sub,
body.staff-concierge-app #thread-panel .thread-context,
body.staff-concierge-app #thread-panel .thread-context dt,
body.staff-concierge-app #thread-panel .thread-context dd {
color: #F4F7FA !important;
}
body.staff-concierge-app #thread-panel .thread-sub,
body.staff-concierge-app #thread-panel .thread-context dt {
color: rgba(244, 247, 250, 0.62) !important;
}
body.staff-concierge-app #thread-panel .thread-compose input,
body.staff-concierge-app .dash-body-guest-chats #thread-panel .thread-compose input,
body.staff-concierge-app .dash-body-guest-chats.is-chat-open #thread-panel .thread-compose input,
body.staff-concierge-app[data-rail-view="guest-inbox"] #thread-panel .thread-compose input,
body.staff-concierge-app[data-rail-view="inbox"] #thread-panel .thread-compose input {
background: rgba(255, 255, 255, 0.06) !important;
color: #F4F7FA !important;
border: 1px solid rgba(255, 255, 255, 0.10) !important;
box-shadow: none !important;
}
body.staff-concierge-app #thread-panel .thread-compose input::placeholder {
color: rgba(244, 247, 250, 0.45) !important;
}
body.staff-concierge-app #thread-panel .thread-compose input:focus,
body.staff-concierge-app .dash-body-guest-chats #thread-panel .thread-compose input:focus,
body.staff-concierge-app .dash-body-guest-chats.is-chat-open #thread-panel .thread-compose input:focus {
background: rgba(255, 255, 255, 0.09) !important;
border-color: rgba(76, 201, 240, 0.45) !important;
box-shadow: 0 0 0 3px rgba(76, 201, 240, 0.12) !important;
}
body.staff-concierge-app #thread-panel .msg-bubble {
background: #141414 !important;
border: 1px solid rgba(255, 255, 255, 0.08) !important;
color: #F4F7FA !important;
}
body.staff-concierge-app #thread-panel .msg-bubble.msg-guest {
background: #1a1a1a !important;
}
body.staff-concierge-app #thread-panel .msg-bubble.msg-staff,
body.staff-concierge-app #thread-panel .msg-bubble.msg-ops-gr,
body.staff-concierge-app #thread-panel .msg-bubble.msg-ops-dept {
background: rgba(76, 201, 240, 0.12) !important;
border-color: rgba(76, 201, 240, 0.28) !important;
}
body.staff-concierge-app #thread-panel .msg-meta,
body.staff-concierge-app #thread-panel .msg-text {
color: #F4F7FA !important;
}
body.staff-concierge-app #thread-panel .msg-meta {
color: rgba(244, 247, 250, 0.55) !important;
}
body.staff-concierge-app #thread-panel .msg-meta .msg-from,
body.staff-concierge-app #thread-panel .msg-bubble .msg-from {
color: #4CC9F0 !important;
}
body.staff-concierge-app #thread-panel .thread-back-btn {
color: #4CC9F0 !important;
}
body.staff-concierge-app #thread-panel .thread-back-btn:hover {
background: rgba(76, 201, 240, 0.10) !important;
}
body.staff-concierge-app #thread-panel .thread-empty,
body.staff-concierge-app #thread-panel .thread-empty p {
background: transparent !important;
color: rgba(244, 247, 250, 0.62) !important;
}
/* ============================================================
Requests — Messenger stack (list OR detail, no empty sidebar)
============================================================ */
body.staff-concierge-app #view-workspace .dash-body.dash-body-orders,
body.staff-concierge-app #view-workspace .dash-body.dash-body-orders-gr,
body.staff-concierge-app #view-workspace .dash-body.dash-body-layout-dept,
body.staff-concierge-app #view-workspace .dash-body.dash-body-archive-approvals,
body.staff-concierge-app[data-rail-view="active-orders"] #view-workspace .dash-body {
grid-template-columns: minmax(0, 1fr) !important;
gap: 0 !important;
background: #050505 !important;
}
body.staff-concierge-app .dash-body-orders:not(.is-order-open) #orders-panel.orders-panel:not([hidden]),
body.staff-concierge-app .dash-body-orders:not(.is-order-open) #completed-panel.completed-panel:not([hidden]),
body.staff-concierge-app[data-rail-view="active-orders"] .dash-body:not(.is-order-open) #orders-panel:not([hidden]),
body.staff-concierge-app .dash-body-archive-approvals #archive-approvals-panel.archive-approvals-panel:not([hidden]) {
display: flex !important;
width: 100% !important;
max-width: none !important;
grid-column: 1 / -1 !important;
background: transparent !important;
border: none !important;
box-shadow: none !important;
}
body.staff-concierge-app .guests-active-actions {
display: inline-flex !important;
align-items: center !important;
gap: 8px !important;
flex-shrink: 0 !important;
}
body.staff-concierge-app .dash-body-orders:not(.is-order-open) #order-panel,
body.staff-concierge-app .dash-body-orders.is-order-open #orders-panel,
body.staff-concierge-app .dash-body-orders.is-order-open #completed-panel,
body.staff-concierge-app #order-detail-empty,
body.staff-concierge-app .dash-body-orders #order-detail-empty,
body.staff-concierge-app .order-panel-toolbar {
display: none !important;
}
body.staff-concierge-app .dash-body-orders.is-order-open #order-panel.order-panel:not([hidden]),
body.staff-concierge-app[data-rail-view="active-orders"] .dash-body.is-order-open #order-panel:not([hidden]) {
display: flex !important;
flex-direction: column !important;
width: 100% !important;
max-width: none !important;
grid-column: 1 / -1 !important;
min-height: 0 !important;
height: 100% !important;
background: #050505 !important;
border: none !important;
border-radius: 0 !important;
box-shadow: none !important;
color: #F4F7FA !important;
}
body.staff-concierge-app .dash-body-orders.is-order-open #order-detail-active:not([hidden]) {
display: flex !important;
flex-direction: column !important;
flex: 1 1 auto !important;
min-height: 0 !important;
height: 100% !important;
background: transparent !important;
}
body.staff-concierge-app .dash-body-orders.is-order-open .order-detail-back:not([hidden]),
body.staff-concierge-app #order-detail-back:not([hidden]) {
display: inline-flex !important;
align-items: center !important;
justify-content: flex-start !important;
width: auto !important;
min-height: 34px !important;
padding: 6px 12px 6px 4px !important;
margin: 0 0 8px !important;
border: none !important;
border-radius: 10px !important;
background: transparent !important;
color: #4CC9F0 !important;
font-size: 0.9rem !important;
font-weight: 700 !important;
cursor: pointer !important;
}
body.staff-concierge-app .dash-body-orders.is-order-open .order-detail-back:hover {
background: rgba(76, 201, 240, 0.10) !important;
}
body.staff-concierge-app .dash-body-orders.is-order-open .order-detail-header {
background: transparent !important;
border-bottom: 1px solid rgba(255, 255, 255, 0.08) !important;
}
/* ============================================================
Team channels — Messenger stack (list OR chat, no empty sidebar)
============================================================ */
body.staff-concierge-app #view-workspace .dash-body.dash-body-staff-inbox,
body.staff-concierge-app #view-workspace .dash-body.dash-body-archived-staff,
body.staff-concierge-app[data-rail-view="inbox"]:has(.dash-body-staff-inbox) #view-workspace .dash-body {
grid-template-columns: minmax(0, 1fr) !important;
gap: 0 !important;
background: #050505 !important;
}
body.staff-concierge-app .dash-body-staff-inbox:not(.is-staff-chat-open) #staff-inbox-panel:not([hidden]),
body.staff-concierge-app .dash-body-archived-staff:not(.is-staff-chat-open) #staff-inbox-panel:not([hidden]) {
display: flex !important;
width: 100% !important;
max-width: none !important;
grid-column: 1 / -1 !important;
background: transparent !important;
border: none !important;
box-shadow: none !important;
}
body.staff-concierge-app .dash-body-staff-inbox:not(.is-staff-chat-open) #thread-panel,
body.staff-concierge-app .dash-body-archived-staff:not(.is-staff-chat-open) #thread-panel,
body.staff-concierge-app .dash-body-staff-inbox.is-staff-chat-open #staff-inbox-panel,
body.staff-concierge-app .dash-body-archived-staff.is-staff-chat-open #staff-inbox-panel,
body.staff-concierge-app .dash-body-staff-inbox #thread-empty,
body.staff-concierge-app .dash-body-archived-staff #thread-empty {
display: none !important;
}
body.staff-concierge-app .dash-body-staff-inbox.is-staff-chat-open #thread-panel.thread-panel:not([hidden]),
body.staff-concierge-app .dash-body-archived-staff.is-staff-chat-open #thread-panel.thread-panel:not([hidden]) {
display: flex !important;
flex-direction: column !important;
width: 100% !important;
max-width: none !important;
grid-column: 1 / -1 !important;
min-height: 0 !important;
height: 100% !important;
background: #050505 !important;
border: none !important;
border-radius: 0 !important;
box-shadow: none !important;
color: #F4F7FA !important;
}
body.staff-concierge-app .dash-body-staff-inbox.is-staff-chat-open .thread-panel:has(#thread-active:not([hidden])) .thread-panel-toolbar,
body.staff-concierge-app .dash-body-archived-staff.is-staff-chat-open .thread-panel:has(#thread-active:not([hidden])) .thread-panel-toolbar,
body.staff-concierge-app .dash-body-staff-inbox.is-staff-chat-open #thread-panel .thread-panel-toolbar,
body.staff-concierge-app .dash-body-archived-staff.is-staff-chat-open #thread-panel .thread-panel-toolbar {
display: flex !important;
align-items: center !important;
gap: 10px !important;
padding: 10px 16px !important;
flex-shrink: 0 !important;
background: #050505 !important;
border-bottom: 1px solid rgba(255, 255, 255, 0.06) !important;
}
body.staff-concierge-app .dash-body-staff-inbox.is-staff-chat-open #btn-thread-back:not([hidden]),
body.staff-concierge-app .dash-body-archived-staff.is-staff-chat-open #btn-thread-back:not([hidden]) {
display: inline-flex !important;
color: #4CC9F0 !important;
}
body.staff-concierge-app .dash-body-staff-inbox.is-staff-chat-open #thread-panel-title,
body.staff-concierge-app .dash-body-archived-staff.is-staff-chat-open #thread-panel-title {
display: none !important;
}
/* ============================================================
Archive guest chats — same Messenger stack as Guest messages
============================================================ */
body.staff-concierge-app #view-workspace .dash-body.dash-body-archived-guests,
body.staff-concierge-app[data-rail-view="archive"]:has(.dash-body-archived-guests) #view-workspace .dash-body {
grid-template-columns: minmax(0, 1fr) !important;
gap: 0 !important;
background: #050505 !important;
}
body.staff-concierge-app .dash-body-archived-guests:not(.is-chat-open) #attention-panel:not([hidden]) {
display: flex !important;
width: 100% !important;
max-width: none !important;
grid-column: 1 / -1 !important;
background: transparent !important;
border: none !important;
box-shadow: none !important;
}
body.staff-concierge-app .dash-body-archived-guests:not(.is-chat-open) #thread-panel,
body.staff-concierge-app .dash-body-archived-guests.is-chat-open #attention-panel,
body.staff-concierge-app .dash-body-archived-guests #thread-empty {
display: none !important;
}
body.staff-concierge-app .dash-body-archived-guests.is-chat-open #thread-panel.thread-panel:not([hidden]) {
display: flex !important;
flex-direction: column !important;
width: 100% !important;
max-width: none !important;
grid-column: 1 / -1 !important;
min-height: 0 !important;
height: 100% !important;
background: #050505 !important;
border: none !important;
box-shadow: none !important;
}
body.staff-concierge-app .dash-body-archived-guests.is-chat-open .thread-panel:has(#thread-active:not([hidden])) .thread-panel-toolbar,
body.staff-concierge-app .dash-body-archived-guests.is-chat-open #thread-panel .thread-panel-toolbar {
display: flex !important;
align-items: center !important;
gap: 10px !important;
padding: 10px 16px !important;
flex-shrink: 0 !important;
background: #050505 !important;
border-bottom: 1px solid rgba(255, 255, 255, 0.06) !important;
}
body.staff-concierge-app .dash-body-archived-guests.is-chat-open #btn-thread-back:not([hidden]) {
display: inline-flex !important;
color: #4CC9F0 !important;
}
body.staff-concierge-app .dash-body-archived-guests.is-chat-open #thread-panel-title {
display: none !important;
}
/* Completed archive — same as Requests stack */
body.staff-concierge-app #completed-inbox-toolbar,
body.staff-concierge-app .completed-panel > .col-toolbar {
display: none !important;
}
body.staff-concierge-app .dash-body-orders #completed-room-bubbles:not([hidden]),
body.staff-concierge-app[data-rail-view="archive"]:has(.dash-body-orders) #completed-room-bubbles:not([hidden]) {
display: flex !important;
flex-wrap: nowrap;
gap: 0.75rem;
overflow-x: auto;
padding: 0.85rem 1rem 1rem;
background: transparent !important;
border: none !important;
border-bottom: 1px solid rgba(255, 255, 255, 0.06) !important;
}
body.staff-concierge-app .dash-body-orders:not(.is-order-open) #completed-panel.completed-panel:not([hidden]) {
display: flex !important;
width: 100% !important;
max-width: none !important;
grid-column: 1 / -1 !important;
}
/* ============================================================
Insights / Performance — match Home unboxed neon surface
============================================================ */
html body.staff-concierge-app.dark-mode #view-insights,
html body.staff-concierge-app #view-insights,
html body.staff-concierge-app #view-insights .insights-panel,
html body.staff-concierge-app #view-insights #insights-metrics {
background: #050505 !important;
background-color: #050505 !important;
color: #F4F7FA !important;
}
/* Kill editorial accent top bar — no other view uses this */
html body.staff-concierge-app #view-insights .insights-panel::before,
html body.staff-concierge-app #view-monitoring .monitoring-panel::before {
content: none !important;
display: none !important;
}
html body.staff-concierge-app #view-insights .insights-header {
border-bottom: none !important;
margin-bottom: 8px !important;
padding-bottom: 0 !important;
justify-content: flex-end !important;
}
html body.staff-concierge-app #view-monitoring .insights-header {
justify-content: flex-end !important;
margin-bottom: 8px !important;
}
/* Insights / Health loading — kill editorial white pill */
html body.staff-concierge-app #view-insights .insights-loading:not([hidden]),
html body.staff-concierge-app #view-monitoring .monitoring-loading:not([hidden]) {
margin: 0 0 10px !important;
padding: 6px 12px !important;
font-size: 0.78rem !important;
font-weight: 500 !important;
line-height: 1.3 !important;
color: rgba(76, 201, 240, 0.88) !important;
background: rgba(76, 201, 240, 0.08) !important;
border: 1px solid rgba(76, 201, 240, 0.18) !important;
border-radius: 999px !important;
text-align: center !important;
box-shadow: none !important;
}
html body.staff-concierge-app #view-insights .insights-hero-kpi,
html body.staff-concierge-app #view-insights .insights-hero-kpi.emerald,
html body.staff-concierge-app #view-insights .insights-hero-kpi.gold,
html body.staff-concierge-app #view-insights #insights-hero-grid .insights-hero-kpi,
html body.staff-concierge-app #view-insights .insights-secondary-kpi,
html body.staff-concierge-app #view-insights #insights-secondary-grid .insights-secondary-kpi,
html body.staff-concierge-app #view-insights .insights-volume-section .insights-secondary-kpi,
html body.staff-concierge-app #view-insights .insights-card,
html body.staff-concierge-app #view-insights .insights-trend-card,
html body.staff-concierge-app #view-insights .insights-volume-section,
html body.staff-concierge-app.dark-mode #view-insights .insights-hero-kpi,
html body.staff-concierge-app.dark-mode #view-insights .insights-secondary-kpi,
html body.staff-concierge-app.dark-mode #view-insights .insights-card {
background: transparent !important;
background-color: transparent !important;
border: none !important;
border-radius: 0 !important;
box-shadow: none !important;
outline: none !important;
color: #F4F7FA !important;
}
html body.staff-concierge-app #view-insights .insights-hero-kpi::before,
html body.staff-concierge-app #view-insights .insights-hero-kpi.emerald::before,
html body.staff-concierge-app #view-insights .insights-hero-kpi.gold::before,
html body.staff-concierge-app #view-insights .insights-card::before,
html body.staff-concierge-app #view-insights .insights-secondary-kpi::before,
html body.staff-concierge-app #view-insights .insights-trend-card::before {
content: none !important;
display: none !important;
}
/* Hero KPIs — hairline columns like Home pulse strip */
html body.staff-concierge-app #view-insights .insights-hero-grid,
html body.staff-concierge-app #view-insights #insights-hero-grid {
gap: 0 !important;
margin-bottom: 18px !important;
border-bottom: 1px solid rgba(255, 255, 255, 0.06) !important;
padding-bottom: 8px !important;
}
html body.staff-concierge-app #view-insights .insights-hero-kpi,
html body.staff-concierge-app #view-insights #insights-hero-grid .insights-hero-kpi {
padding: 12px 16px 14px !important;
min-height: 0 !important;
}
html body.staff-concierge-app #view-insights .insights-hero-kpi + .insights-hero-kpi,
html body.staff-concierge-app #view-insights #insights-hero-grid .insights-hero-kpi + .insights-hero-kpi {
border-left: 1px solid rgba(76, 201, 240, 0.14) !important;
}
html body.staff-concierge-app #view-insights .insights-hero-label,
html body.staff-concierge-app #view-insights #insights-hero-grid .insights-hero-label {
color: #F4F7FA !important;
}
html body.staff-concierge-app #view-insights .insights-hero-value,
html body.staff-concierge-app #view-insights .insights-hero-kpi.emerald .insights-hero-value,
html body.staff-concierge-app #view-insights .insights-hero-kpi.gold .insights-hero-value,
html body.staff-concierge-app #view-insights #insights-hero-grid .insights-hero-value {
color: #F4F7FA !important;
}
html body.staff-concierge-app #view-insights .insights-hero-note,
html body.staff-concierge-app #view-insights .insights-delta,
html body.staff-concierge-app #view-insights .insights-delta-label,
html body.staff-concierge-app #view-insights .insights-vs-prior {
color: rgba(244, 247, 250, 0.55) !important;
}
/* Chart / bar cards — flat sections with hairline dividers */
html body.staff-concierge-app #view-insights .insights-trend-charts-grid,
html body.staff-concierge-app #view-insights .insights-grid {
gap: 0 !important;
margin-bottom: 12px !important;
border-bottom: 1px solid rgba(255, 255, 255, 0.06) !important;
padding-bottom: 10px !important;
}
html body.staff-concierge-app #view-insights .insights-trend-card + .insights-trend-card,
html body.staff-concierge-app #view-insights .insights-grid .insights-card + .insights-card {
border-left: 1px solid rgba(76, 201, 240, 0.14) !important;
}
html body.staff-concierge-app #view-insights .insights-card,
html body.staff-concierge-app #view-insights .insights-trend-card {
padding: 12px 16px 14px !important;
}
html body.staff-concierge-app #view-insights .insights-card h3,
html body.staff-concierge-app #view-insights .insights-card-hint,
html body.staff-concierge-app #view-insights .insights-sub,
html body.staff-concierge-app #view-insights .insights-desk-sub {
color: rgba(244, 247, 250, 0.72) !important;
}
html body.staff-concierge-app #view-insights .insights-card h3 {
color: #F4F7FA !important;
}
/* Secondary KPIs — flat grid, hairlines */
html body.staff-concierge-app #view-insights .insights-secondary-grid,
html body.staff-concierge-app #view-insights #insights-secondary-grid {
gap: 0 !important;
}
html body.staff-concierge-app #view-insights .insights-secondary-kpi {
padding: 12px 14px !important;
min-height: 0 !important;
border-top: 1px solid rgba(255, 255, 255, 0.06) !important;
}
html body.staff-concierge-app #view-insights .insights-secondary-label {
color: rgba(244, 247, 250, 0.55) !important;
}
html body.staff-concierge-app #view-insights .insights-secondary-value {
color: #F4F7FA !important;
}
html body.staff-concierge-app #view-insights .insights-volume-section,
html body.staff-concierge-app #view-insights .insights-dept-breakdown,
html body.staff-concierge-app #view-insights .insights-updated {
background: transparent !important;
border: none !important;
box-shadow: none !important;
color: rgba(244, 247, 250, 0.62) !important;
padding-left: 0 !important;
padding-right: 0 !important;
}
html body.staff-concierge-app #view-insights .insights-bar-track {
background: rgba(255, 255, 255, 0.08) !important;
}
html body.staff-concierge-app #view-insights .insights-bar-fill {
background: linear-gradient(90deg, #00E5FF, #4CC9F0) !important;
}
html body.staff-concierge-app #view-insights .insights-bar-label,
html body.staff-concierge-app #view-insights .insights-bar-value {
color: rgba(244, 247, 250, 0.72) !important;
}
html body.staff-concierge-app #view-insights .insights-trend-axis,
html body.staff-concierge-app #view-insights .insights-trend-legend,
html body.staff-concierge-app #view-insights .insights-trend-empty {
color: rgba(244, 247, 250, 0.55) !important;
fill: rgba(244, 247, 250, 0.45) !important;
}
html body.staff-concierge-app #view-insights .insights-trend-grid {
stroke: rgba(255, 255, 255, 0.08) !important;
}
html body.staff-concierge-app #view-insights .insights-trend-bar--chats {
fill: rgba(76, 201, 240, 0.45) !important;
}
/* Insights trend pills — match Home neon (kill light-mode mint/blush fills) */
html body.staff-concierge-app #view-insights .home-kpi-trend-pill,
html body.staff-concierge-app #view-insights .insights-bar-trend-wrap .home-kpi-trend-pill {
color: rgba(244, 247, 250, 0.78) !important;
background: rgba(255, 255, 255, 0.04) !important;
border: 1px solid rgba(255, 255, 255, 0.08) !important;
}
html body.staff-concierge-app #view-insights .home-kpi-trend-pill svg {
color: inherit !important;
stroke: currentColor !important;
}
html body.staff-concierge-app #view-insights .insights-trend--up {
color: #34D399 !important;
background: rgba(52, 211, 153, 0.12) !important;
border-color: rgba(52, 211, 153, 0.28) !important;
}
html body.staff-concierge-app #view-insights .insights-trend--down {
color: #F87171 !important;
background: rgba(248, 113, 113, 0.12) !important;
border-color: rgba(248, 113, 113, 0.28) !important;
}
html body.staff-concierge-app #view-insights .insights-trend--flat,
html body.staff-concierge-app #view-insights .insights-trend--new {
color: rgba(244, 247, 250, 0.72) !important;
background: rgba(255, 255, 255, 0.05) !important;
border-color: rgba(255, 255, 255, 0.1) !important;
}
html body.staff-concierge-app #view-insights .home-kpi-trend-text {
color: rgba(244, 247, 250, 0.45) !important;
}
/* Home KPI info icons — neon dark */
html body.staff-concierge-app #view-home .home-kpi-strip--six .insights-hero-label {
display: inline-flex !important;
align-items: center !important;
gap: 6px !important;
}
html body.staff-concierge-app #view-home .metric-info {
width: 15px !important;
height: 15px !important;
background: rgba(76, 201, 240, 0.12) !important;
color: rgba(76, 201, 240, 0.9) !important;
border: 1px solid rgba(76, 201, 240, 0.22) !important;
}
html body.staff-concierge-app #view-home .metric-info:hover,
html body.staff-concierge-app #view-home .metric-info.is-tip-open {
background: rgba(76, 201, 240, 0.2) !important;
color: #4CC9F0 !important;
border-color: rgba(76, 201, 240, 0.4) !important;
}
html body.staff-concierge-app .metric-tip-layer {
background: #141414 !important;
color: #F4F7FA !important;
border: 1px solid rgba(76, 201, 240, 0.22) !important;
box-shadow: 0 12px 32px rgba(0, 0, 0, 0.55) !important;
}
@media (max-width: 900px) {
html body.staff-concierge-app #view-insights .insights-hero-kpi + .insights-hero-kpi,
html body.staff-concierge-app #view-insights .insights-trend-card + .insights-trend-card,
html body.staff-concierge-app #view-insights .insights-grid .insights-card + .insights-card {
border-left: none !important;
border-top: 1px solid rgba(255, 255, 255, 0.06) !important;
}
}
/* Support page — no grey cards; chat is framed by a cyan edge, not a fill */
html body.staff-concierge-app #view-support .support-card,
html body.staff-concierge-app.dark-mode #view-support .support-card {
background: transparent !important;
background-color: transparent !important;
box-shadow: none !important;
backdrop-filter: none !important;
-webkit-backdrop-filter: none !important;
}
html body.staff-concierge-app #view-support .support-chat-stage {
background: transparent !important;
border: 1px solid rgba(76, 201, 240, 0.18) !important;
border-left: 2px solid #4cc9f0 !important;
}
html body.staff-concierge-app #view-support .support-chat-log,
html body.staff-concierge-app #view-support .support-chat-compose {
background: transparent !important;
}
html body.staff-concierge-app #view-support .support-msg--bot {
background: rgba(255, 255, 255, 0.03) !important;
border: 1px solid rgba(255, 255, 255, 0.1) !important;
}
html body.staff-concierge-app #view-support .support-msg--user {
background: rgba(76, 201, 240, 0.12) !important;
border: 1px solid rgba(76, 201, 240, 0.28) !important;
}
html body.staff-concierge-app #view-support .support-chat-compose input,
html body.staff-concierge-app #view-support .support-chat-compose input:focus {
background: rgba(255, 255, 255, 0.04) !important;
border: 1px solid rgba(255, 255, 255, 0.1) !important;
border-radius: 10px !important;
box-shadow: none !important;
}
html body.staff-concierge-app #view-support .support-chat-compose input:focus {
border-color: rgba(76, 201, 240, 0.5) !important;
background: rgba(255, 255, 255, 0.06) !important;
}
/* —— Dialogs (all ) — beat editorial whites —— */
html body.staff-concierge-app dialog.export-dialog,
html body.staff-concierge-app .export-dialog,
html body.staff-concierge-app .order-confirm-dialog,
html body.staff-concierge-app dialog.order-confirm-dialog,
html body.staff-concierge-app #order-done-dialog,
html body.staff-concierge-app #order-confirm-dialog,
html body.staff-concierge-app #export-dialog,
html body.staff-concierge-app #lotus-support-dialog,
html body.staff-concierge-app #settings-dialog,
html body.staff-concierge-app #change-password-dialog,
html body.staff-concierge-app #staff-users-dialog,
html body.staff-concierge-app #plan-change-dialog {
background: #141414 !important;
background-color: #141414 !important;
color: #F4F7FA !important;
border: 1px solid rgba(76, 201, 240, 0.22) !important;
border-radius: 16px !important;
box-shadow:
0 0 0 1px rgba(0, 229, 255, 0.08),
0 24px 60px rgba(0, 0, 0, 0.65),
0 0 40px rgba(76, 201, 240, 0.12) !important;
color-scheme: dark;
}
html body.staff-concierge-app dialog.export-dialog::backdrop,
html body.staff-concierge-app .export-dialog::backdrop,
html body.staff-concierge-app .order-confirm-dialog::backdrop,
html body.staff-concierge-app #order-done-dialog::backdrop,
html body.staff-concierge-app #order-confirm-dialog::backdrop,
html body.staff-concierge-app #export-dialog::backdrop,
html body.staff-concierge-app #lotus-support-dialog::backdrop,
html body.staff-concierge-app #settings-dialog::backdrop,
html body.staff-concierge-app #change-password-dialog::backdrop,
html body.staff-concierge-app #staff-users-dialog::backdrop,
html body.staff-concierge-app #plan-change-dialog::backdrop {
background: rgba(0, 0, 0, 0.78) !important;
}
html body.staff-concierge-app dialog.export-dialog .export-dialog-inner,
html body.staff-concierge-app .export-dialog .export-dialog-inner,
html body.staff-concierge-app .order-confirm-dialog .export-dialog-inner {
background: transparent !important;
color: #F4F7FA !important;
}
html body.staff-concierge-app dialog.export-dialog .export-dialog-title,
html body.staff-concierge-app .export-dialog .export-dialog-title,
html body.staff-concierge-app .order-confirm-dialog .export-dialog-title,
html body.staff-concierge-app #order-done-title,
html body.staff-concierge-app #order-confirm-title,
html body.staff-concierge-app dialog.export-dialog h3,
html body.staff-concierge-app .export-dialog .settings-section-title,
html body.staff-concierge-app .export-dialog .staff-users-create h3 {
color: #F4F7FA !important;
}
html body.staff-concierge-app dialog.export-dialog .export-dialog-sub,
html body.staff-concierge-app .export-dialog .export-dialog-sub,
html body.staff-concierge-app .order-confirm-dialog .export-dialog-sub,
html body.staff-concierge-app #order-done-body,
html body.staff-concierge-app #order-confirm-body {
color: rgba(244, 247, 250, 0.72) !important;
}
html body.staff-concierge-app dialog.export-dialog .settings-hint,
html body.staff-concierge-app .export-dialog .settings-hint,
html body.staff-concierge-app .order-confirm-dialog .settings-hint,
html body.staff-concierge-app dialog.export-dialog .settings-field,
html body.staff-concierge-app .export-dialog .settings-field,
html body.staff-concierge-app .order-confirm-dialog .settings-field,
html body.staff-concierge-app .export-dialog .settings-plan-current,
html body.staff-concierge-app .export-dialog .settings-plan-card-meta,
html body.staff-concierge-app .export-dialog .export-check,
html body.staff-concierge-app .export-dialog .export-fieldset legend,
html body.staff-concierge-app .export-dialog .staff-user-meta span {
color: rgba(244, 247, 250, 0.68) !important;
}
html body.staff-concierge-app dialog.export-dialog .settings-field input,
html body.staff-concierge-app dialog.export-dialog .settings-field select,
html body.staff-concierge-app dialog.export-dialog .settings-field textarea,
html body.staff-concierge-app .export-dialog .settings-field input,
html body.staff-concierge-app .export-dialog .settings-field select,
html body.staff-concierge-app .export-dialog .settings-field textarea,
html body.staff-concierge-app .order-confirm-dialog .settings-field input,
html body.staff-concierge-app .order-confirm-dialog .settings-field select,
html body.staff-concierge-app .export-dialog textarea,
html body.staff-concierge-app #laundry-confirm-kg,
html body.staff-concierge-app #staff-prompt-input {
background: #0A0A0A !important;
border: 1px solid rgba(76, 201, 240, 0.28) !important;
color: #F4F7FA !important;
border-radius: 10px !important;
box-shadow: none !important;
color-scheme: dark;
}
html body.staff-concierge-app dialog.export-dialog .settings-field input:focus,
html body.staff-concierge-app dialog.export-dialog .settings-field select:focus,
html body.staff-concierge-app dialog.export-dialog .settings-field textarea:focus,
html body.staff-concierge-app .export-dialog .settings-field input:focus,
html body.staff-concierge-app .order-confirm-dialog .settings-field input:focus,
html body.staff-concierge-app #laundry-confirm-kg:focus,
html body.staff-concierge-app #staff-prompt-input:focus {
border-color: rgba(0, 229, 255, 0.55) !important;
outline: none !important;
box-shadow: 0 0 0 3px rgba(76, 201, 240, 0.16) !important;
}
html body.staff-concierge-app .export-dialog .export-fieldset,
html body.staff-concierge-app .export-dialog .settings-plan-block,
html body.staff-concierge-app .export-dialog .settings-plan-card,
html body.staff-concierge-app .export-dialog .staff-user-row,
html body.staff-concierge-app .export-dialog .staff-users-list-wrap {
background: rgba(255, 255, 255, 0.03) !important;
border-color: rgba(76, 201, 240, 0.16) !important;
color: #F4F7FA !important;
}
html body.staff-concierge-app .export-dialog .settings-plan-card.is-current {
border-color: rgba(0, 229, 255, 0.45) !important;
box-shadow: 0 0 0 1px rgba(76, 201, 240, 0.12) !important;
}
html body.staff-concierge-app .export-dialog .settings-plan-card-name,
html body.staff-concierge-app .export-dialog .staff-user-meta strong {
color: #F4F7FA !important;
}
html body.staff-concierge-app dialog.export-dialog .btn-primary,
html body.staff-concierge-app .export-dialog .btn-primary,
html body.staff-concierge-app .order-confirm-dialog .btn-primary,
html body.staff-concierge-app.dark-mode dialog.export-dialog .btn-primary,
html body.staff-concierge-app.dark-mode .export-dialog .btn-primary,
html body.staff-concierge-app.dark-mode .order-confirm-dialog .btn-primary,
html body.staff-concierge-app #order-done-ok,
html body.staff-concierge-app #order-confirm-ok:not(.is-danger),
html body.staff-concierge-app.dark-mode #order-done-ok,
html body.staff-concierge-app.dark-mode #order-confirm-ok:not(.is-danger),
html body.staff-concierge-app .export-dialog a.btn-primary {
background: linear-gradient(135deg, #00E5FF 0%, #4CC9F0 55%, #1D75B3 100%) !important;
border: 1px solid rgba(0, 229, 255, 0.55) !important;
color: #041018 !important;
box-shadow: 0 0 18px rgba(76, 201, 240, 0.28) !important;
}
html body.staff-concierge-app dialog.export-dialog .btn-outline,
html body.staff-concierge-app .export-dialog .btn-outline,
html body.staff-concierge-app .order-confirm-dialog .btn-outline,
html body.staff-concierge-app.dark-mode dialog.export-dialog .btn-outline,
html body.staff-concierge-app.dark-mode .export-dialog .btn-outline,
html body.staff-concierge-app.dark-mode .order-confirm-dialog .btn-outline,
html body.staff-concierge-app #order-confirm-cancel,
html body.staff-concierge-app .export-dialog a.btn-outline {
background: transparent !important;
border: 1px solid rgba(76, 201, 240, 0.35) !important;
color: #00E5FF !important;
box-shadow: none !important;
}
html body.staff-concierge-app .order-confirm-dialog #order-confirm-ok.is-danger,
html body.staff-concierge-app .order-confirm-dialog.is-danger #order-confirm-ok {
background: #B91C1C !important;
border-color: #B91C1C !important;
color: #FFFFFF !important;
box-shadow: none !important;
}
html body.staff-concierge-app #laundry-confirm-charge {
color: var(--neon-bright, #00E5FF) !important;
}
html body.staff-concierge-app #laundry-confirm-error:not([hidden]),
html body.staff-concierge-app #staff-prompt-error:not([hidden]),
html body.staff-concierge-app #change-password-error:not([hidden]),
html body.staff-concierge-app #staff-users-error:not([hidden]) {
color: #FF6B6B !important;
}
body.staff-concierge-app .order-staff-note-field,
body.staff-concierge-app.dark-mode .order-staff-note-field {
display: flex;
flex-direction: column;
gap: 6px;
margin: 0 0 12px;
width: 100%;
}
body.staff-concierge-app .order-staff-note-head,
body.staff-concierge-app.dark-mode .order-staff-note-head {
display: flex;
align-items: center;
justify-content: space-between;
gap: 12px;
}
body.staff-concierge-app .order-staff-note-label,
body.staff-concierge-app .order-staff-note--saved .order-staff-note-label,
body.staff-concierge-app.dark-mode .order-staff-note-label {
font-size: 0.72rem;
font-weight: 600;
letter-spacing: 0.04em;
text-transform: uppercase;
color: rgba(244, 247, 250, 0.55) !important;
}
body.staff-concierge-app .order-staff-note-save,
body.staff-concierge-app.dark-mode .order-staff-note-save {
appearance: none;
border: 0;
background: transparent;
padding: 0;
margin: 0;
font: inherit;
font-size: 0.78rem;
font-weight: 600;
letter-spacing: 0.02em;
color: #4CC9F0 !important;
cursor: pointer;
text-decoration: none;
}
body.staff-concierge-app .order-staff-note-save:hover,
body.staff-concierge-app.dark-mode .order-staff-note-save:hover {
color: #00E5FF !important;
text-decoration: underline;
}
body.staff-concierge-app .order-staff-note-save:disabled,
body.staff-concierge-app.dark-mode .order-staff-note-save:disabled {
opacity: 0.45;
cursor: default;
text-decoration: none;
}
body.staff-concierge-app .order-staff-note-input,
body.staff-concierge-app.dark-mode .order-staff-note-input {
width: 100%;
min-height: 64px;
resize: vertical;
box-sizing: border-box;
border-radius: 10px;
border: 1px solid rgba(76, 201, 240, 0.22) !important;
background: rgba(255, 255, 255, 0.04) !important;
color: #F4F7FA !important;
padding: 10px 12px;
font: inherit;
font-size: 0.88rem;
line-height: 1.4;
}
body.staff-concierge-app .order-staff-note-input:focus,
body.staff-concierge-app.dark-mode .order-staff-note-input:focus {
outline: none;
border-color: rgba(76, 201, 240, 0.55) !important;
}
body.staff-concierge-app .order-staff-note--saved,
body.staff-concierge-app.dark-mode .order-staff-note--saved {
margin: 10px 0 0;
padding: 10px 12px;
border-radius: 10px;
border: 1px solid rgba(76, 201, 240, 0.2);
background: rgba(76, 201, 240, 0.06);
}
body.staff-concierge-app .order-staff-note-text,
body.staff-concierge-app.dark-mode .order-staff-note-text {
margin: 4px 0 0;
color: #F4F7FA !important;
font-size: 0.9rem;
line-height: 1.4;
white-space: pre-wrap;
}