.login-brand .luma-logo { width: 150px; height: 64px; object-fit: contain; display: block; }
.login-page.light-theme .luma-on-dark, .login-page:not(.light-theme) .luma-on-light { display: none; }
.sidebar-brand { justify-content: center; }
.sidebar-brand .brand-copy { display: none !important; }
.sidebar-brand .brand-symbol { display: none; }
.sidebar-logo-expanded { display: block; width: 100%; max-width: 176px; height: 64px; object-fit: contain; }
html[data-theme="dark"] #sidebar-logo-light, html:not([data-theme="dark"]) #sidebar-logo-dark { display: none; }
.sidebar.collapsed:not(.hover-expanded) .sidebar-logo-expanded { display: none; }
.sidebar.collapsed:not(.hover-expanded) .brand-symbol { display: grid; width: 38px; height: 38px; }
#sidebar-business-logo { width: 100%; height: 100%; object-fit: contain; }
.brand-settings { grid-column: 1 / -1; padding: 24px; border: 1px solid var(--border-color); border-radius: 18px; background: var(--card-bg); }
.brand-settings-heading { display: flex; align-items: center; gap: 14px; padding-bottom: 20px; margin-bottom: 20px; border-bottom: 1px solid var(--border-color); }
.brand-settings-symbol { width: 42px; height: 42px; border-radius: 12px; display: grid; place-items: center; background: color-mix(in srgb, var(--primary-cyan) 12%, transparent); color: var(--primary-cyan); font-size: 20px; flex-shrink: 0; }
.brand-settings-heading h3 { font-size: 17px; color: var(--text-main); margin: 0 0 6px; }
.brand-settings-heading p { font-size: 12px; color: var(--text-muted); margin: 0; line-height: 1.5; }
.brand-settings-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
.brand-asset-card { min-width: 0; padding: 18px; border: 1px solid var(--border-color); border-radius: 14px; background: var(--bg-color); transition: border-color .2s, box-shadow .2s; }
.brand-asset-card:focus-within { border-color: var(--primary-cyan); box-shadow: 0 0 0 3px color-mix(in srgb, var(--primary-cyan) 10%, transparent); }
.brand-asset-heading { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; margin-bottom: 14px; }
.brand-asset-heading h4 { font-size: 14px; font-weight: 600; margin: 0; color: var(--text-main); }
.brand-asset-badge { display: inline-flex; gap: 6px; align-items: center; font-size: 10px; font-weight: 600; color: var(--primary-cyan); background: color-mix(in srgb, var(--primary-cyan) 10%, transparent); padding: 5px 8px; border-radius: 7px; }
.brand-asset-card > p { color: var(--text-muted); font-size: 12px; line-height: 1.6; min-height: 58px; margin: 0 0 15px; }
.brand-asset-preview { height: 112px; padding: 18px; border-radius: 10px; border: 1px dashed #a99cce; display: flex; justify-content: center; align-items: center; overflow: hidden; }
.brand-preview-dark { background: #282536; }
.brand-preview-light { background: #faf9fd; }
.brand-preview-icon { background: #eae3fa; }
.brand-asset-preview img { display: block; width: 100%; height: 100%; object-fit: contain; }
.brand-preview-icon img { width: 68px; height: 68px; }
.brand-asset-actions { display: flex; gap: 8px; margin-top: 14px; }
.brand-asset-actions button { display: inline-flex; justify-content: center; align-items: center; gap: 8px; min-height: 42px; padding: 9px 12px; font-size: 12px; }
.brand-asset-actions .brand-upload { flex: 1; }
.brand-asset-actions .brand-reset { flex-shrink: 0; width: 42px; padding: 9px; }
.brand-asset-status { display: block; min-height: 30px; margin-top: 9px; line-height: 1.5; font-size: 10px; color: var(--primary-cyan); }
.brand-asset-card.is-loading .brand-asset-preview { opacity: .55; }
.brand-settings-footer { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-top: 18px; }
.brand-settings-footer small { font-size: 11px; line-height: 1.6; color: var(--text-muted); max-width: 490px; }
.brand-reset-all { display: inline-flex; align-items: center; justify-content: center; gap: 8px; flex-shrink: 0; font-size: 12px; min-height: 40px; }
@media (max-width: 850px) {
    .brand-settings-grid { grid-template-columns: 1fr; }
    .brand-asset-heading { justify-content: space-between; }
    .brand-asset-card > p { min-height: 0; }
    .brand-settings-footer { align-items: stretch; flex-direction: column; }
}
@media (max-width: 600px) {
    #modal-body .config-grid { grid-template-columns: minmax(0, 1fr) !important; }
    .brand-settings { padding: 16px; }
    .brand-settings-heading { align-items: flex-start; }
    .brand-settings-heading h3 { font-size: 15px; }
}
@media (prefers-reduced-motion: reduce) { .brand-asset-card { transition: none; } }
