/* CCL EMS Platform v5 — base styles
   Colours come from css/themes.css (--ems-* tokens) so every brand/light-dark
   variant themes cleanly. Genuinely-semantic light chips (pastel status
   badges, error summary) keep fixed colours — they read fine on any surface. */

/* Cards */
.card { border: 1px solid var(--ems-border); border-radius: 8px; box-shadow: 0 1px 3px rgba(0,0,0,.06); }
.card-header { background: var(--ems-surface-alt); border-bottom: 1px solid var(--ems-border); color: var(--ems-text); font-weight: 600; }

/* Tables */
.table { font-size: .9rem; }
.table thead th {
    background: var(--ems-surface-alt); border-bottom: 2px solid var(--ems-border); color: var(--ems-text);
    font-weight: 600; font-size: .8rem; text-transform: uppercase; letter-spacing: .05em;
}

/* Gridview sorting arrows */
a.asc:after, a.desc:after {
    content: ''; left: 3px; display: inline-block;
    width: 0; height: 0; border: solid 5px transparent;
    margin: 4px 4px 2px 4px; background: transparent;
}
a.asc:after  { border-bottom: solid 7px var(--ems-text); border-top-width: 0; }
a.desc:after { border-top: solid 7px var(--ems-text); border-bottom-width: 0; }
.grid-view th { white-space: nowrap; }

/* Status badges — semantic pastels (intentionally fixed; readable on any surface) */
.badge-online  { background: #d1fae5; color: #065f46; }
.badge-offline { background: #fee2e2; color: #991b1b; }
.badge-warning { background: #fef3c7; color: #92400e; }

/* Stat cards */
.stat-card { text-align: center; padding: 1.25rem; }
.stat-card .stat-value { font-size: 2rem; font-weight: 700; color: var(--ems-primary); }
.stat-card .stat-label { font-size: .8rem; text-transform: uppercase; letter-spacing: .05em; color: var(--ems-text-muted); margin-top: .25rem; }

/* Zone status indicators */
.zone-status { width: 10px; height: 10px; border-radius: 50%; display: inline-block; }
.zone-status.on       { background: var(--ems-online); }
.zone-status.off      { background: var(--ems-text-muted); }
.zone-status.holiday  { background: var(--ems-warning); }
.zone-status.override { background: var(--ems-secondary); }
.zone-status.fault    { background: var(--ems-danger); }

/* Login page */
.login-card {
    background: var(--ems-surface); border-radius: 12px;
    box-shadow: 0 4px 24px rgba(0,0,0,.10); padding: 2.5rem;
}
.login-card .login-logo {
    text-align: center; margin-bottom: 1.5rem;
    font-size: 1.5rem; font-weight: 700; color: var(--ems-primary);
}

/* Form helpers */
.hint-block { display: block; margin-top: 5px; color: var(--ems-text-muted); }
.error-summary {
    color: #a94442; background: #fdf7f7;
    border-left: 3px solid #eed3d7; padding: 10px 20px; margin: 0 0 15px 0;
}
.form-group { margin-bottom: 1rem; }

/* Buttons */
.btn-primary { background: var(--ems-primary); border-color: var(--ems-primary); }
.btn-primary:hover { filter: brightness(90%); }