/**
 * CADMasters Global Layout System
 * Design tokens are injected via /theme.css from Theme Manager.
 */

/* ── Containers ── */
.container:not(.container-fluid) {
    max-width: var(--container-width);
    margin-left: auto;
    margin-right: auto;
    padding-left: var(--container-padding-x);
    padding-right: var(--container-padding-x);
}

.container-wide {
    max-width: var(--container-wide-width);
    margin-left: auto;
    margin-right: auto;
    padding-left: var(--container-padding-x);
    padding-right: var(--container-padding-x);
    width: 100%;
}

.hero-section .container,
.hero-section .container-wide {
    max-width: var(--container-wide-width);
}

/* ── Header height ── */
.header,
.site-header,
.site-nav,
.admin-topbar,
.portal-topbar {
    min-height: var(--header-height);
}

/* ── Section spacing ── */
.section-block {
    padding-top: var(--section-medium);
    padding-bottom: var(--section-medium);
}

.section-block--small {
    padding-top: var(--section-small);
    padding-bottom: var(--section-small);
}

.section-block--large,
.section-block--hero {
    padding-top: var(--section-large);
    padding-bottom: var(--section-large);
}

.section-spacing-sm { padding: var(--section-small) 0; }
.section-spacing-md { padding: var(--section-medium) 0; }
.section-spacing-lg { padding: var(--section-large) 0; }

/* ── Buttons (rounded, Manrope 600 via typography.css) ── */
.btn,
.btn-primary,
.btn-secondary,
.btn-outline-primary,
.btn-outline-secondary,
.btn-cta,
.btn-login {
    border-radius: var(--radius-md);
}

input.form-control,
textarea.form-control,
select.form-select {
    border-radius: var(--form-radius, var(--radius-sm));
}

.badge {
    border-radius: var(--radius-sm);
}

/* ── Cards (global tokens — see cards.css) ── */
.card,
.cm-card,
.admin-card,
.portal-card,
.portal-login-card {
    border-radius: var(--card-radius, var(--radius-md));
    box-shadow: var(--card-shadow, var(--shadow-soft));
}

.card .card-body,
.cm-card .card-body,
.admin-card .card-body {
    padding: var(--card-padding, var(--container-padding-x));
}

/* ── Minimal footer rhythm ── */
.site-footer,
footer.site-footer {
    padding-top: var(--section-medium);
    padding-bottom: var(--section-small);
}

/* ── Portal / admin content areas ── */
.admin-content,
.portal-main {
    padding: var(--section-small);
}

.admin-page-header {
    margin-bottom: var(--section-small);
}

@media (max-width: 767.98px) {
    .section-block,
    .section-block--large,
    .section-block--hero {
        padding-top: var(--section-medium);
        padding-bottom: var(--section-medium);
    }
}