/* Central tenant branding layer. Loaded after route CSS so one saved brand color is consistent everywhere. */
:root {
    --bs-primary: var(--crm-primary);
    --bs-primary-rgb: var(--crm-primary-rgb);
    --market-primary: var(--crm-primary);
    --market-primary-dark: var(--crm-primary-dark);
    --market-primary-soft: var(--crm-primary-soft);
}

.crm-logo--image {
    display: inline-grid !important;
    place-items: center;
    padding: 5px;
    overflow: hidden;
    background: var(--crm-primary-soft) !important;
    border: 1px solid rgba(var(--crm-primary-rgb), .14);
}

.crm-logo--image img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: contain;
    max-width: none;
}

.crm-sidebar-brand .crm-logo--image {
    flex: 0 0 auto;
    padding: 4px;
}

.crm-market-ui .crm-sidebar a.crm-nav-link:hover {
    color: var(--crm-primary) !important;
    background: var(--crm-primary-soft) !important;
}

.crm-market-ui .crm-sidebar a.crm-nav-link.active {
    color: var(--crm-primary-dark) !important;
    background: linear-gradient(90deg, var(--crm-primary-soft-strong), var(--crm-primary-soft)) !important;
    border-color: rgba(var(--crm-primary-rgb), .16) !important;
    box-shadow: inset -3px 0 0 var(--crm-primary) !important;
}

.crm-market-ui .crm-nav-link.active .crm-menu-icon {
    color: var(--crm-primary) !important;
    background: rgba(255, 255, 255, .82) !important;
}

/* Dashboard hero/banner surfaces were historically hard-coded indigo. */
.crm-market-ui .market-welcome,
.crm-market-ui .market-hero-pro {
    background:
        radial-gradient(circle at 13% 20%, rgba(255, 255, 255, .18), transparent 28%),
        linear-gradient(118deg, var(--crm-primary-darker) 0%, var(--crm-primary-dark) 55%, var(--crm-primary) 100%) !important;
    box-shadow: 0 20px 48px rgba(var(--crm-primary-rgb), .20) !important;
}

.crm-market-ui .market-action-icon,
.crm-market-ui .market-timeline-icon,
.crm-market-ui .market-reminder-icon,
.crm-market-ui .market-shortcut-grid-pro span {
    color: var(--crm-primary) !important;
    background: var(--crm-primary-soft) !important;
}

.crm-market-ui .market-hero-actions-pro a:hover,
.crm-market-ui .market-shortcut-grid-pro a:hover {
    color: var(--crm-primary-dark) !important;
    background: var(--crm-primary-soft) !important;
    border-color: rgba(var(--crm-primary-rgb), .22) !important;
}

.crm-market-ui .market-panel-head-pro > a,
.crm-market-ui .market-status-badge,
.crm-market-ui .market-status-dot {
    color: var(--crm-primary) !important;
}

.crm-market-ui .market-status-badge {
    background: var(--crm-primary-soft) !important;
}

.crm-market-ui .market-status-dot {
    background: var(--crm-primary) !important;
}

.crm-market-ui .market-kpi-pro.market-tone-violet {
    --tone: var(--crm-primary) !important;
    --tone-bg: var(--crm-primary-soft) !important;
}

.crm-market-ui .market-opportunity-list i::after,
.crm-market-ui .market-metric-track i {
    background: linear-gradient(90deg, var(--crm-primary), #16b7aa) !important;
}

.crm-market-ui .crm-btn:not(.crm-btn-light):not(.crm-btn-danger):not(.crm-btn-secondary),
.crm-market-ui .btn-primary,
.crm-market-ui input[type="submit"] {
    color: var(--crm-primary-contrast) !important;
    background: linear-gradient(135deg, var(--crm-primary), var(--crm-primary-dark)) !important;
    border-color: transparent !important;
    box-shadow: 0 8px 18px rgba(var(--crm-primary-rgb), .20) !important;
}

.crm-market-ui .crm-btn:not(.crm-btn-light):not(.crm-btn-danger):not(.crm-btn-secondary):hover,
.crm-market-ui .btn-primary:hover,
.crm-market-ui input[type="submit"]:hover {
    background: linear-gradient(135deg, var(--crm-primary-dark), var(--crm-primary-darker)) !important;
}

.crm-market-ui a:not(.crm-btn):not(.crm-nav-link):hover,
.crm-market-ui .text-primary,
.crm-market-ui .link-primary {
    color: var(--crm-primary) !important;
}

.crm-market-ui :focus-visible {
    outline: 3px solid var(--crm-focus-ring);
    outline-offset: 2px;
}

.settings-branding-upload {
    display: flex;
    align-items: center;
    gap: 16px;
    flex-wrap: wrap;
}

.settings-branding-logo {
    width: 76px;
    height: 76px;
    flex: 0 0 76px;
    padding: 7px;
    object-fit: contain;
    border: 1px solid var(--crm-border);
    border-radius: 16px;
    background: var(--crm-primary-soft);
}

.settings-branding-upload__controls {
    min-width: min(360px, 100%);
    flex: 1 1 280px;
}

.settings-branding-reset {
    display: flex;
    align-items: center;
    gap: 7px;
    margin-top: 9px;
    color: var(--crm-muted);
    font-size: 11px;
}

@media (max-width: 640px) {
    .settings-branding-upload {
        align-items: flex-start;
    }
}