:root {
    --qerp-primary: #00a59e;
    --qerp-primary-dark: #007b76;
    --qerp-navy: #022964;
    --qerp-surface: #ffffff;
    --qerp-background: #f4f6f9;
    --qerp-border: #dfe5ec;
    --qerp-text: #172033;
    --qerp-muted: #667085;
    --qerp-danger: #c43d53;
    --qerp-radius: 12px;
    --qerp-shadow: 0 8px 24px rgba(2, 41, 100, 0.08);
}

html,
body,
#app {
    min-height: 100%;
}

html {
    color-scheme: light;
    background: var(--qerp-background);
}

body.qerp-pos-body {
    margin: 0;
    min-width: 320px;
    overflow-x: hidden;
    background: var(--qerp-background);
    color: var(--qerp-text);
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
}

*,
*::before,
*::after {
    box-sizing: border-box;
}

img,
svg {
    max-width: 100%;
}

button,
input,
select,
textarea {
    font: inherit;
}

button:not(:disabled),
[role="button"]:not([aria-disabled="true"]) {
    cursor: pointer;
}

.btn-primary {
    --bs-btn-bg: var(--qerp-primary);
    --bs-btn-border-color: var(--qerp-primary);
    --bs-btn-hover-bg: var(--qerp-primary-dark);
    --bs-btn-hover-border-color: var(--qerp-primary-dark);
    --bs-btn-active-bg: var(--qerp-primary-dark);
    --bs-btn-active-border-color: var(--qerp-primary-dark);
}

.form-control:focus,
.form-select:focus,
.form-check-input:focus {
    border-color: rgba(0, 165, 158, 0.65);
    box-shadow: 0 0 0 0.2rem rgba(0, 165, 158, 0.15);
}

.card {
    border-color: var(--qerp-border);
    border-radius: var(--qerp-radius);
    box-shadow: var(--qerp-shadow);
}

[dir="rtl"] .me-1 { margin-right: 0 !important; margin-left: .25rem !important; }
[dir="rtl"] .me-2 { margin-right: 0 !important; margin-left: .5rem !important; }
[dir="rtl"] .me-3 { margin-right: 0 !important; margin-left: 1rem !important; }
[dir="rtl"] .ms-1 { margin-left: 0 !important; margin-right: .25rem !important; }
[dir="rtl"] .ms-2 { margin-left: 0 !important; margin-right: .5rem !important; }
[dir="rtl"] .ms-3 { margin-left: 0 !important; margin-right: 1rem !important; }

.pg-auth {
    min-height: 100vh;
    background:
        radial-gradient(circle at 15% 10%, rgba(0, 165, 158, .12), transparent 32rem),
        var(--qerp-background);
}

.mainloader-background {
    background: var(--qerp-navy);
}

.center-image {
    width: min(220px, 62vw);
    height: auto;
}

.lds-dual-ring::after {
    border-color: var(--qerp-primary) transparent var(--qerp-primary) transparent;
}

@media (max-width: 576px) {
    body.qerp-pos-body {
        font-size: 14px;
    }

    .card {
        border-radius: 10px;
    }
}

@media print {
    body.qerp-pos-body {
        background: #fff !important;
    }

    .no-print,
    .report-toolbar {
        display: none !important;
    }
}