/* sitss core: shared by every portal (internal, client, helpdesk, project, crm, sign-in).
   portal files (portal-*.css, hi_v01.css, pm_v01.css, crm_v01.css, v03.css) load after this and only add their own identity.
   replaces inline style blocks and style="" attributes so the content security policy needs no 'unsafe-inline'. */

:root {
    --sitss-bg: #f8f9fa;
    --sitss-muted: #6c757d;
    --sitss-brand: #dc3545;
    --sitss-brand-green: #006400;
    --sitss-warning-soft: #ffeeba;
    --sitss-warning: #ffc107;
    --sitss-radius: .5rem;
}

html, body { min-height: 100%; }
body { background: var(--sitss-bg); }

/* page structure */
.page-header { margin-bottom: 1rem; }
.page-title { font-size: 1.5rem; font-weight: 700; margin-bottom: .15rem; }
.page-subtitle { font-size: .85rem; color: var(--sitss-muted); }
.app-footer, .client-footer { font-size: .8rem; color: var(--sitss-muted); }

/* utilities that replace former style="" attributes */
.pre-wrap { white-space: pre-wrap; }
.mw-280 { max-width: 280px; }
.mw-430 { max-width: 430px; }
.w-100px { width: 100px; }
.mh-500 { max-height: 500px; }
.z-toast { z-index: 9999; }
.text-center-input { text-align: center; }
.row-attention { background-color: var(--sitss-warning-soft); }
.row-attention > :first-child { border-left: 5px solid var(--sitss-warning); }

/* floating message box (appmsg.html) */
.alert-float-wrap { z-index: 1080; width: min(420px, 100%); }
.alert-float-progress { height: 3px; }

/* dashboard and payment form density (formerly in home.html and payment.html) */
.dashboard-detail, .dashboard-detail .list-group-item { font-size: .78rem; }
.dashboard-detail .small { font-size: .72rem !important; }
.payment-form .mb-3 { margin-bottom: .25rem !important; }

/* htmx indicators (htmx's own injected style is disabled for csp) */
.htmx-indicator { opacity: 0; }
.htmx-request .htmx-indicator, .htmx-request.htmx-indicator { opacity: 1; transition: opacity 200ms ease-in; }

/* buttons rendered as links inside small post forms (delete actions) */
form.d-inline .btn-link { vertical-align: baseline; }

@media (max-width: 767.98px) {
    .page-title { font-size: 1.25rem; }
}