﻿/* ==========================================================
   MASTER HEADER
========================================================== */

.master-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    min-height: 52px;
    padding: 8px 16px;
    margin-bottom: 12px;
    background: linear-gradient( 180deg, #2F5E91 0%, #254C75 100% );
    color: #FFFFFF;
    border-radius: 6px 6px 0 0;
}

    .master-header h2 {
        margin: 0;
        padding: 0;
        font-size: 1.15rem;
        font-weight: 600;
        line-height: 1;
    }

/* ==========================================================
   MASTER TOOLBAR
========================================================== */

.master-toolbar {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
}

    .master-toolbar .btn,
    .master-toolbar .form-control,
    .master-toolbar .form-select {
        min-height: 34px;
        padding: 4px 10px;
        font-size: .90rem;
    }

    .master-toolbar .search-box {
        flex: 1;
        min-width: 320px;
    }

        .master-toolbar .search-box input {
            width: 100%;
        }

    .master-toolbar .page-size {
        width: 90px;
    }

    .master-toolbar .view-buttons {
        display: flex;
        gap: 6px;
        margin-left: auto;
    }

/* ==========================================================
   MOBILE
========================================================== */

@media (max-width:768px) {

    .master-header {
        flex-direction: column;
        align-items: stretch;
        gap: 10px;
    }

    .master-toolbar {
        flex-direction: column;
        align-items: stretch;
    }

        .master-toolbar .btn,
        .master-toolbar .search-box,
        .master-toolbar .page-size,
        .master-toolbar .view-buttons {
            width: 100%;
        }

        .master-toolbar .view-buttons {
            margin-left: 0;
        }

            .master-toolbar .view-buttons .btn {
                flex: 1;
            }
}
