:root {
  --brand-primary: #54301A;
  --brand-primary-dark: #3E2313;
  --brand-accent: #E9DED3;
  --brand-background: #F3EEE7;
  --brand-surface: #FFFFFF;
  --brand-heading-background: #EFE5DA;
  --brand-text: #24150C;
  --brand-nav-text: #F7F1EA;
  --brand-border: #D8C8B8;
  --brand-font-body: system-ui, -apple-system, "Segoe UI", sans-serif;
  --brand-font-heading: system-ui, -apple-system, "Segoe UI", sans-serif;
  --brand-login-background-image: none;
}
body { background: var(--brand-background); color: var(--brand-text); font-family: var(--brand-font-body); }
h1, h2, h3, h4, h5, h6, .navbar-brand, .card-header { font-family: var(--brand-font-heading); }
.navbar.bg-dark { background-color: var(--brand-primary) !important; }
.navbar .navbar-brand, .navbar .nav-link, .navbar .navbar-text { color: var(--brand-nav-text) !important; }
.navbar .nav-link:hover { color: var(--brand-accent) !important; }
.brand-logo { height: 38px; max-width: 150px; object-fit: contain; width: auto; }
.btn-primary { background-color: var(--brand-primary) !important; border-color: var(--brand-primary) !important; }
.btn-primary:hover, .btn-primary:focus { background-color: var(--brand-primary-dark) !important; border-color: var(--brand-primary-dark) !important; }
.btn-outline-primary { color: var(--brand-primary) !important; border-color: var(--brand-primary) !important; }
.btn-outline-primary:hover { background-color: var(--brand-primary) !important; border-color: var(--brand-primary) !important; color: #fff !important; }
a { color: var(--brand-primary); }
a:hover { color: var(--brand-primary-dark); }
.card { background-color: var(--brand-surface); border-color: var(--brand-border); box-shadow: 0 2px 10px rgba(0,0,0,.06); }
.card-header { background: var(--brand-heading-background); border-bottom: 1px solid var(--brand-border); }
.table thead th { background: var(--brand-heading-background); color: var(--brand-text); }
.table-hover tbody tr:hover { background: var(--brand-heading-background); }
.form-control:focus, .form-select:focus { border-color: var(--brand-primary); box-shadow: 0 0 0 .25rem color-mix(in srgb, var(--brand-primary) 20%, transparent); }
.alert { border-color: var(--brand-border); }
.badge.bg-primary { background-color: var(--brand-primary) !important; }
.navbar-toggler { border-color: rgba(255,255,255,.35); }
.form-select.border-success, .form-control.border-success { border-width: 2px; }
.small.text-success { display: block; }
.login-page {
  background-image: linear-gradient(rgba(243,238,231,.78), rgba(243,238,231,.78)), var(--brand-login-background-image);
  background-position: center; background-size: cover; min-height: 100vh;
}
.login-brand-logo { max-height: 110px; max-width: 260px; object-fit: contain; }
.login-card { margin: 0 auto; max-width: 520px; }
.dashboard-heading { max-width: 760px; }
.dashboard-panel { border: 0; border-top: 4px solid var(--brand-primary); overflow: hidden; }
.dashboard-panel .card-header { background: var(--brand-surface); padding: 1rem 1.25rem; }
.dashboard-panel .card-body { padding: 1.25rem; }
.dashboard-stat {
  background: color-mix(in srgb, var(--brand-background) 75%, var(--brand-surface));
  border: 1px solid var(--brand-border); border-radius: .75rem; height: 100%; padding: .85rem;
}
.dashboard-stat-value { color: var(--brand-primary-dark); display: block; font-size: 1.65rem; font-weight: 700; line-height: 1.1; }
.dashboard-stat-label { color: color-mix(in srgb, var(--brand-text) 70%, transparent); display: block; font-size: .78rem; margin-top: .3rem; }
.dashboard-summary-list { display: grid; gap: .55rem; }
.dashboard-summary-row {
  align-items: center; border-bottom: 1px solid var(--brand-border); display: flex;
  gap: .75rem; justify-content: space-between; padding-bottom: .55rem;
}
.dashboard-summary-row:last-child { border-bottom: 0; padding-bottom: 0; }
.dashboard-status-dot { border-radius: 50%; display: inline-block; height: .65rem; margin-right: .35rem; width: .65rem; }
.dashboard-status-dot.online { background: #198754; }
.dashboard-status-dot.offline { background: #dc3545; }
.dashboard-empty { color: color-mix(in srgb, var(--brand-text) 70%, transparent); font-size: .9rem; margin: 0; padding: .5rem 0; }
.branding-preview {
  background: var(--preview-background, #F3EEE7); border: 1px solid var(--preview-border, #D8C8B8);
  border-radius: .75rem; overflow: hidden;
}
.branding-preview-nav {
  background: var(--preview-primary, #54301A); color: var(--preview-nav-text, #F7F1EA);
  font-family: var(--preview-heading-font); padding: .85rem 1rem;
}
.branding-preview-body { color: var(--preview-text, #24150C); font-family: var(--preview-body-font); padding: 1rem; }
.branding-preview-card {
  background: var(--preview-surface, #FFFFFF); border: 1px solid var(--preview-border, #D8C8B8);
  border-radius: .5rem; overflow: hidden;
}
.branding-preview-card-header { background: var(--preview-heading, #EFE5DA); font-family: var(--preview-heading-font); padding: .65rem .85rem; }
.branding-preview-button {
  background: var(--preview-primary, #54301A); border: 0; border-radius: .375rem; color: #fff; padding: .45rem .85rem;
}
.branding-current-image, .branding-upload-preview { max-height: 120px; max-width: 100%; object-fit: contain; }