/* ========================================================================
   MyBizMan UI Consistency Layer
   Baseline: PHASE 21 FINAL / VND + Chiphi integration
   Purpose: one visual/interaction rule for action bars, forms and dense UI.
   This layer is intentionally additive and does not change business logic.
   ======================================================================== */
:root {
    --ui-action-gap: 8px;
    --ui-action-radius: 8px;
    --ui-control-height: 40px;
    --ui-section-gap: 16px;
}

/* ---------- Form action bars: desktop = always right ---------- */
.ui-form-actions,
.card-footer.text-end,
.quote-bottom-actions-inner {
    display: flex !important;
    align-items: center !important;
    justify-content: flex-end !important;
    gap: var(--ui-action-gap) !important;
    flex-wrap: wrap !important;
}

.ui-form-actions .btn,
.card-footer.text-end .btn,
.quote-bottom-actions-inner .btn {
    min-height: 38px;
    border-radius: var(--ui-action-radius);
    font-weight: 600;
    white-space: nowrap;
}

/* Keep utility actions visually separate from commit actions in invoice forms. */
.invoice-actions.ui-form-actions {
    justify-content: flex-end !important;
    width: 100%;
}

.invoice-actions.ui-form-actions .ui-form-action-tools {
    display: flex;
    align-items: center;
    gap: var(--ui-action-gap);
    margin-right: auto;
    flex-wrap: wrap;
}

.invoice-actions.ui-form-actions .primary-actions {
    display: flex !important;
    align-items: center;
    justify-content: flex-end;
    gap: var(--ui-action-gap);
    flex-wrap: wrap;
    margin-left: auto;
}

/* Invoice inline action bars that have not adopted the wrapper yet. */
.invoice-actions:not(.ui-form-actions) {
    justify-content: flex-end !important;
}

.invoice-actions:not(.ui-form-actions) .primary-actions {
    margin-left: auto;
}

/* Consistent action toolbar placement across list/filter pages. */
.action-toolbar,
.report-filter-actions {
    display: flex !important;
    align-items: center;
    justify-content: flex-end !important;
    gap: var(--ui-action-gap) !important;
    flex-wrap: wrap;
}

.congno-filter-actions {
    justify-content: flex-end !important;
}

/* ---------- Controls: one density everywhere ---------- */
.form-label,
.col-form-label {
    font-size: 13px;
    line-height: 1.35;
    font-weight: 600;
}

.form-control,
.form-select,
.input-group > .form-control,
.input-group > .form-select {
    min-height: var(--ui-control-height);
}

.form-control:focus,
.form-select:focus {
    box-shadow: 0 0 0 .18rem rgba(37,99,235,.12) !important;
}

/* ---------- Page-level cards and tables ---------- */
.card {
    border-radius: 10px;
}

.card-header h1,
.card-header h2,
.card-header h3,
.card-header h4,
.card-header h5,
.card-header h6 {
    line-height: 1.3;
}

.table th,
.table td {
    vertical-align: middle;
}

/* Detail action footers: never left-align controls just because a page used
   the Bootstrap text-end helper differently. */
.card-footer.text-end {
    text-align: initial !important;
}

/* ---------- Mobile ---------- */
@media (max-width: 767.98px) {
    .ui-form-actions {
        display: grid !important;
        grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
        gap: 8px !important;
        width: 100%;
    }

    .ui-form-actions > .btn,
    .ui-form-actions > a.btn,
    .ui-form-actions > button.btn {
        width: 100%;
        min-width: 0;
        min-height: 42px;
    }

    .invoice-actions.ui-form-actions {
        display: grid !important;
        grid-template-columns: 1fr 1fr;
    }

    .invoice-actions.ui-form-actions .ui-form-action-tools {
        grid-column: 1 / -1;
        display: grid;
        grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
        width: 100%;
        margin-right: 0;
    }

    .invoice-actions.ui-form-actions .primary-actions {
        grid-column: 1 / -1;
        display: grid !important;
        grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
        width: 100%;
        margin-left: 0;
    }

    .invoice-actions.ui-form-actions .primary-actions .btn,
    .invoice-actions.ui-form-actions .ui-form-action-tools .btn {
        width: 100%;
        min-width: 0;
        min-height: 42px;
    }

    .invoice-actions.ui-form-actions .primary-actions .btn-outline-secondary {
        grid-column: 1 / -1;
    }

    .card-footer.text-end {
        justify-content: stretch !important;
    }

    .card-footer.text-end .btn {
        min-width: 0;
        min-height: 42px;
    }

    .action-toolbar,
    .report-filter-actions,
    .congno-filter-actions {
        width: 100%;
    }

    .action-toolbar .btn,
    .report-filter-actions .btn,
    .congno-filter-actions .btn {
        min-height: 42px;
    }
}

@media (max-width: 430px) {
    .ui-form-actions {
        grid-template-columns: 1fr;
    }

    .invoice-actions.ui-form-actions,
    .invoice-actions.ui-form-actions .ui-form-action-tools,
    .invoice-actions.ui-form-actions .primary-actions {
        grid-template-columns: 1fr;
    }

    .invoice-actions.ui-form-actions .primary-actions .btn-outline-secondary {
        grid-column: auto;
    }
}


/* Phase 21.18 – standardized list/filter pages */
.ui-list-filter-card .ui-filter-grid { row-gap: 12px; }
.ui-list-filter-card .ui-filter-actions { display:flex !important; align-items:center; justify-content:flex-end !important; gap:8px !important; flex-wrap:wrap; margin-top:4px; }
.ui-list-filter-card .ui-filter-actions .btn { min-height:40px; white-space:nowrap; }
.ui-list-filter-card .ui-filter-title { font-size:15px; font-weight:700; margin:0; }
.ui-list-filter-card .ui-filter-hint { font-size:12px; color:#6c757d; }
.ui-list-filter-card .form-label { margin-bottom:5px; }
.ui-list-filter-card .ui-filter-row + .ui-filter-row { margin-top:4px; }
@media (max-width:767.98px){
  .ui-list-filter-card .ui-filter-actions{display:grid !important;grid-template-columns:1fr 1fr;width:100%;}
  .ui-list-filter-card .ui-filter-actions .btn{width:100%;min-height:42px;}
}
@media (max-width:430px){.ui-list-filter-card .ui-filter-actions{grid-template-columns:1fr;}}