@import url('../branding.css.php');
body { background: var(--app-bg); color: var(--app-text); font-family: var(--app-font); min-height: 100vh; }
.app-navbar { background: var(--app-navbar-background); }
.card, .list-group-item { background-color: var(--app-surface); }
.card, .list-group, .form-control, .form-select, .btn { border-radius: var(--app-radius); }
.btn-primary { --bs-btn-bg: var(--app-navy); --bs-btn-border-color: var(--app-navy); --bs-btn-hover-bg: var(--app-navy-soft); --bs-btn-hover-border-color: var(--app-navy-soft); --bs-btn-active-bg: var(--app-navy-soft); --bs-btn-active-border-color: var(--app-navy-soft); }
.text-primary { color: var(--app-navy) !important; }
.app-brand { display: inline-flex; align-items: center; gap: .6rem; color: #fff; text-decoration: none; font-weight: 700; }
.app-brand img { width: 38px; height: 38px; border-radius: .55rem; }
.app-brand-label { display: inline-flex; align-items: center; flex-wrap: wrap; gap: .42rem .65rem; line-height: 1.15; }
.app-brand-label small { display: inline-flex; align-items: center; border: 1px solid color-mix(in srgb,var(--app-amber) 78%,#fff); border-radius: 999px; padding: .22rem .58rem; color: #fff; font-size: .7rem; font-weight: 650; letter-spacing: .015em; opacity: .92; white-space: nowrap; }
.navbar-actions { display: flex; align-items: center; gap: .4rem; flex-wrap: wrap; justify-content: flex-end; }
.install-button { border-color: var(--app-amber); color: #fff; }
.install-button:hover, .install-button:focus { background: var(--app-amber); border-color: var(--app-amber); color: #231f20; }
.pwa-status { border-left: .3rem solid var(--app-amber); }
.environment-banner { background: #d2a13a; color: #231f20; text-align: center; font-size: .78rem; font-weight: 800; letter-spacing: .06em; padding: .28rem .75rem; text-transform: uppercase; }
.auth-shell { max-width: 460px; }
.brand-horizontal { display: block; width: 100%; max-width: 405px; height: auto; margin: 0 auto; }
.demo-brand-lockup { display: inline-flex; align-items: center; gap: .8rem; padding: .7rem 1rem; border: 1px solid #d7e0e5; border-radius: var(--app-radius); background: var(--app-surface); text-align: left; }
.demo-brand-lockup img { width: 58px; height: 58px; object-fit: contain; }
.demo-brand-lockup strong, .demo-brand-lockup span { display: block; }
.demo-brand-lockup strong { color: var(--app-text); font-size: 1.15rem; }
.demo-brand-lockup span { color: var(--app-muted); font-size: .78rem; text-transform: uppercase; letter-spacing: .08em; }
.action-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .75rem; }
.action-grid .btn { min-height: 3.25rem; font-weight: 600; }
.action-grid .btn:last-child { grid-column: 1 / -1; }
.week-calendar { display: grid; grid-template-columns: repeat(6,minmax(0,1fr)); gap: .55rem; }
.week-day { border: 1px solid #d6d3d1; border-radius: .75rem; background: #fff; padding: .7rem .45rem; text-align: center; min-width: 0; }
.week-day { color: inherit; cursor: pointer; font: inherit; }
.week-day:hover, .week-day:focus-visible, .week-day.is-selected { border-color: var(--app-amber); box-shadow: 0 .2rem .65rem rgba(35,31,32,.12); outline: none; }
.week-day.is-future { cursor: default; }
.week-day.is-today { border: 2px solid var(--app-amber); box-shadow: 0 .25rem .8rem rgba(35,31,32,.12); }
.week-day.is-future { opacity: .48; }
.week-day .week-total { font-weight: 800; color: var(--app-navy); }
.week-day .week-label { font-size: .72rem; text-transform: uppercase; color: #78716c; }
.week-day .week-date { font-size: 1.1rem; font-weight: 700; }
.history-meta { font-size: .82rem; color: #64748b; }
.activity-timeline { border-left: 2px solid #e7e5e4; margin-left: .55rem; padding-left: 1rem; }
.timeline-event { position: relative; padding: 0 0 1rem .25rem; }
.timeline-event:last-child { padding-bottom: 0; }
.timeline-event::before { content: ''; position: absolute; width: .7rem; height: .7rem; border-radius: 50%; background: var(--app-amber); border: 2px solid #fff; box-shadow: 0 0 0 1px var(--app-amber); left: -1.44rem; top: .34rem; }
.report-bar { height: .42rem; border-radius: 999px; background: #e7e5e4; overflow: hidden; }
.report-bar span { display: block; height: 100%; border-radius: inherit; background: linear-gradient(90deg,var(--app-amber),#f3cf6a); }
.report-month + .report-month { margin-top: 1rem; }
.report-user { cursor: pointer; }
.report-user:hover { --bs-table-bg-state: rgba(210,161,58,.1); }
.duration-value { display: inline-flex; align-items: baseline; gap: .14em; white-space: nowrap; font-variant-numeric: tabular-nums; }
.duration-number { letter-spacing: -.035em; }
.duration-sign { margin-right: -.08em; }
.duration-unit { font-size: .58em; font-weight: 700; opacity: .72; text-transform: uppercase; }
.duration-minutes { margin-left: .18em; font-size: .7em; font-weight: 700; opacity: .82; }
.duration-minutes small { margin-left: .15em; font-size: .64em; text-transform: uppercase; }
.duration-equivalent { margin-top: .35rem; color: var(--app-muted); font-size: .75rem; line-height: 1.25; }
.report-duration-compact { white-space: nowrap; font-variant-numeric: tabular-nums; }
#report-summary .h3 { font-size: clamp(1.15rem,4.2vw,1.75rem); }
.metric-card { position: relative; overflow: hidden; }
.metric-card::before { content: ''; position: absolute; inset: 0 0 auto; height: .22rem; background: var(--app-amber); }
.metric-card-negative::before { background: var(--app-danger); }
.metric-card-warning::before { background: color-mix(in srgb,var(--app-amber) 72%,#fff); }
.daily-contexts { display: flex; flex-wrap: wrap; gap: .4rem; }
.daily-context { display: inline-flex; align-items: center; gap: .65rem; border: 1px solid #e2e8f0; background: color-mix(in srgb,var(--app-bg) 70%,#fff); border-radius: 999px; padding: .28rem .6rem; font-size: .78rem; }
.daily-context strong { white-space: nowrap; font-variant-numeric: tabular-nums; }
.admin-section-nav { position: sticky; top: 0; z-index: 20; background: var(--app-bg); padding: .55rem 0; }
.admin-tabs { gap: .35rem; overflow-x: auto; padding-bottom: .2rem; scrollbar-width: thin; }
.admin-tab { border: 1px solid #cbd5e1; background: #fff; color: var(--app-navy); border-radius: 999px; padding: .58rem .9rem; font-weight: 600; white-space: nowrap; }
.admin-tab.active { background: var(--app-navy); border-color: var(--app-navy); color: #fff; }
.admin-shortcut { color: inherit; min-height: 100%; transition: transform .15s ease, box-shadow .15s ease; }
.admin-shortcut:hover, .admin-shortcut:focus { transform: translateY(-2px); box-shadow: 0 .5rem 1rem rgba(8,47,85,.12) !important; }
.admin-panel[hidden] { display: none !important; }
.user-manage .text-primary { display: inline-flex; align-items: center; gap: .35rem; width: fit-content; border: 1px solid color-mix(in srgb,var(--app-amber) 70%,var(--app-navy)); border-radius: 999px; background: color-mix(in srgb,var(--app-amber) 16%,var(--app-surface)); color: var(--app-navy) !important; padding: .28rem .62rem; font-weight: 800; letter-spacing: .01em; transition: background-color .15s ease,color .15s ease,transform .15s ease; }
.user-manage:hover .text-primary, .user-manage:focus-visible .text-primary { background: var(--app-amber); color: var(--app-navy) !important; transform: translateX(.15rem); }
.map-picker[hidden] { display: none !important; }
.map-picker { position: fixed; inset: 0; z-index: 2000; background: rgba(15,23,42,.72); padding: min(3vh,1.5rem); }
.map-picker-dialog { width: min(1100px,100%); height: 94vh; margin: auto; background: #fff; border-radius: .9rem; overflow: hidden; display: grid; grid-template-rows: auto 1fr auto; }
.map-picker-header, .map-picker-footer { padding: .8rem 1rem; display: flex; align-items: center; justify-content: space-between; gap: .75rem; flex-wrap: wrap; }
.map-picker-header { border-bottom: 1px solid #e2e8f0; }
.map-picker-footer { border-top: 1px solid #e2e8f0; }
.map-picker-map { min-height: 320px; width: 100%; }
body.map-picker-open { overflow: hidden; }
.entity-editor[hidden] { display: none !important; }
.entity-editor { position: fixed; inset: 0; z-index: 2100; display: grid; justify-items: end; }
.entity-editor-backdrop { position: absolute; inset: 0; background: rgba(15,23,42,.68); }
.entity-editor-panel { position: relative; width: min(620px,100%); height: 100%; background: var(--app-surface); box-shadow: -.75rem 0 2rem rgba(15,23,42,.22); overflow: auto; }
.entity-editor-panel form { min-height: 100%; display: grid; grid-template-rows: auto 1fr auto; }
.entity-editor-header, .entity-editor-footer { position: sticky; z-index: 1; background: var(--app-surface); padding: 1rem 1.25rem; display: flex; align-items: center; justify-content: space-between; gap: 1rem; }
.entity-editor-header { top: 0; border-bottom: 1px solid #e2e8f0; }
.entity-editor-footer { bottom: 0; border-top: 1px solid #e2e8f0; justify-content: flex-end; }
.entity-editor-body { padding: 1.25rem; }
body.entity-editor-open { overflow: hidden; }
@media (max-width: 575.98px) {
  .week-calendar { grid-template-columns: repeat(3,minmax(0,1fr)); }
  .app-navbar .container { align-items: flex-start; }
  .app-brand-label { align-items: flex-start; flex-direction: column; gap: .22rem; }
  .app-brand-label small { padding: .16rem .46rem; font-size: .64rem; }
  .navbar-actions .btn { min-height: 2.4rem; }
  main.container { padding-left: .85rem; padding-right: .85rem; }
  .action-grid .btn { min-height: 3.75rem; }
  .admin-section-nav { top: -.1rem; }
  .admin-panel .card-body { padding: 1rem; }
  .admin-panel .btn { min-height: 2.65rem; }
  .map-picker { padding: 0; }
  .map-picker-dialog { height: 100dvh; border-radius: 0; }
  .map-picker-header, .map-picker-footer { padding: .7rem .8rem; }
  .map-picker-footer .btn { min-height: 2.8rem; }
  .entity-editor-panel { width: 100%; }
  .entity-editor-header, .entity-editor-footer, .entity-editor-body { padding: 1rem; }
  .entity-editor-footer .btn { flex: 1; min-height: 2.8rem; }
}
@media (min-width: 768px) { .action-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); } .action-grid .btn:last-child { grid-column: auto; } }