/* === Salesforce-based Bootstrap Color Classes === */

:root {
    --sfdc-primary: #0176d3;
    --sfdc-action: #005fb2;
    --sfdc-hover: #014486;
    --sfdc-dark: #032d60;
    --sfdc-light: #eaf5fe;
    --sfdc-success: #2e844a;
    --sfdc-warning: #f2cf5b;
    --sfdc-error: #ba0517;
    --sfdc-neutral: #706e6b;
    --sfdc-bg: #f3f2f2;
}

body {
    font-family: 'Salesforce Sans', system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, 'Noto Sans', sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol', 'Noto Color Emoji'
}

/* Text Colors */

.text-sfdc-primary {
    color: var(--sfdc-primary) !important;
}

.text-sfdc-action {
    color: var(--sfdc-action) !important;
}

.text-sfdc-hover {
    color: var(--sfdc-hover) !important;
}

.text-sfdc-dark {
    color: var(--sfdc-dark) !important;
}

.text-sfdc-light {
    color: var(--sfdc-light) !important;
}

.text-sfdc-success {
    color: var(--sfdc-success) !important;
}

.text-sfdc-warning {
    color: var(--sfdc-warning) !important;
}

.text-sfdc-error {
    color: var(--sfdc-error) !important;
}

.text-sfdc-neutral {
    color: var(--sfdc-neutral) !important;
}

/* Background Colors */

.bg-sfdc-primary {
    background-color: var(--sfdc-primary) !important;
    color: #fff;
}

.bg-sfdc-action {
    background-color: var(--sfdc-action) !important;
    color: #fff;
}

.bg-sfdc-hover {
    background-color: var(--sfdc-hover) !important;
    color: #fff;
}

.bg-sfdc-dark {
    background-color: var(--sfdc-dark) !important;
    color: #fff;
}

.bg-sfdc-light {
    background-color: var(--sfdc-light) !important;
}

.bg-sfdc-success {
    background-color: var(--sfdc-success) !important;
    color: #fff;
}

.bg-sfdc-warning {
    background-color: var(--sfdc-warning) !important;
    color: #000;
}

.bg-sfdc-error {
    background-color: var(--sfdc-error) !important;
    color: #fff;
}

.bg-sfdc-neutral {
    background-color: var(--sfdc-neutral) !important;
    color: #fff;
}

.bg-sfdc-bg {
    background-color: var(--sfdc-bg) !important;
}

/* Border Colors */

.border-sfdc-primary {
    border-color: var(--sfdc-primary) !important;
}

.border-sfdc-success {
    border-color: var(--sfdc-success) !important;
}

.border-sfdc-error {
    border-color: var(--sfdc-error) !important;
}


.logo {
    width: 68px;
    height: 48px;
}

.app-title {
    padding-left: 30px;
}

.countdown {
    font-weight: bold;
    color: #0d6efd;
}

#logOutput {
    height: 300px;
    overflow-y: auto;
    background: #f8f9fa;
    border: 1px solid #ced4da;
    padding: 1rem;
    font-family: monospace;
    white-space: pre-wrap;
}

.vertical-progress {
    width: auto !important;
    height: 200px;
    display: flex;
    flex-direction: column-reverse;
}

.vertical-progress .progress-bar {
    width: 100%;
    transition: height 0.6s ease;
}

h2  {
    font-size: 1.5em !important;
}

h4  {
    font-size: 1.2em !important;
}

footer {
    margin-top: 2em !important;
}