/* ═══════════════════════════════════════════════════════════════
   05-controls.css — Page Header & Shared Action Controls
   ─────────────────────────────────────────────────────────────
   Reusable top-of-page chrome: section-level page headers,
   breadcrumbs, and grouped action buttons (primary/secondary).

   Sections:
     • .zimam-page-header       (flex row: title + actions)
     • .zimam-page-header--large(stacked variant for settings)
     • .zimam-page-header__title-row / __actions
     • .zimam-breadcrumbs        (trail with separators)
     • .zimam-btn-primary / secondary / icon (action buttons)

   Depends on: 01-tokens.css (colours, spacing, radius).
   Consumers: CaseManagement, TaskManagement, Settings pages,
              Breadcrumb.razor.
   ═══════════════════════════════════════════════════════════════ */

.zimam-page-header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1rem;
    margin-bottom: 1.5rem;
}

.zimam-page-header--large {
    flex-direction: column;
}

.zimam-page-header__body {
    min-width: 0;
}

.zimam-page-header__title {
    margin: 0;
    font-size: 1.25rem;
    font-weight: var(--fw-bold);
    color: var(--color-text-strong);
    line-height: var(--lh-tight);
}

.zimam-page-header__title--large {
    font-size: 1.5rem;
    letter-spacing: -0.02em;
}

.zimam-page-header__description {
    margin: 0.5rem 0 0;
    max-width: 42rem;
    font-size: var(--text-sm);
    color: var(--color-text-muted);
    line-height: var(--lh-relaxed);
}

.zimam-page-header__actions {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    flex-wrap: wrap;
    flex-shrink: 0;
}

.zimam-primary-action-button,
.zimam-secondary-action-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    min-height: 2.5rem;
    padding-inline: 1rem;
    border-radius: var(--radius-xl);
    font-size: var(--text-sm);
    font-weight: var(--fw-medium);
    text-decoration: none;
    white-space: nowrap;
    transition: background-color var(--duration-fast) var(--ease-default),
                border-color var(--duration-fast) var(--ease-default),
                color var(--duration-fast) var(--ease-default),
                box-shadow var(--duration-fast) var(--ease-default);
}

.zimam-primary-action-button {
    background: var(--color-text-strong);
    color: var(--color-surface);
    border: 1px solid var(--color-text-strong);
    flex-shrink: 0;
}

.zimam-primary-action-button:hover:not(:disabled) {
    background: #1f2937;
    border-color: #1f2937;
}

.zimam-primary-action-button:focus-visible,
.zimam-secondary-action-button:focus-visible {
    outline: var(--focus-ring);
    outline-offset: var(--focus-offset);
}

.zimam-primary-action-button:disabled,
.zimam-secondary-action-button:disabled {
    opacity: 0.5;
    cursor: not-allowed;
}

.zimam-secondary-action-button {
    background: var(--color-surface);
    color: var(--color-text-secondary);
    border: 1px solid var(--color-border);
}

.zimam-secondary-action-button:hover:not(:disabled) {
    background: var(--color-bg-subtle);
    border-color: var(--color-border-strong);
    color: var(--color-text-strong);
    box-shadow: var(--shadow-sm);
}

.zimam-primary-action-button__icon,
.zimam-secondary-action-button__icon {
    flex-shrink: 0;
}

.zimam-secondary-action-button__icon {
    color: var(--color-text-faint);
}

.zimam-secondary-action-button:hover:not(:disabled) .zimam-secondary-action-button__icon {
    color: var(--color-text-secondary);
}

@media (min-width: 640px) {
    .zimam-page-header--large {
        flex-direction: row;
        align-items: flex-end;
        justify-content: space-between;
    }
}

@media (min-width: 1024px) {
    .zimam-page-header__description {
        font-size: var(--text-md);
    }
}