:root {
    --pm-navy: #16324f;
    --pm-mid: #1f4e79;
    --pm-teal: #256d85;
    --pm-text: #1a2332;
    --pm-muted: #4b5b6b;
    --pm-icon: #5e6278;
    --pm-border: #e6ebf2;
    --pm-bg: #f5f8fa;
    --pm-active: #f1faff;
    --pm-active-bar: #009ef7;
    --pm-purple: #6941c6;
    --pm-red: #b42318;
    --pm-green: #067647;
    --pm-blue: #175cd3;
}

html, body, body.mm-app {
    font-family: "Cairo", "Segoe UI", Tahoma, "Microsoft YaHei", "Traditional Arabic", Arial, sans-serif;
    color: var(--pm-text);
    background: var(--pm-bg);
}

body.mm-app { margin: 0; min-height: 100vh; }

.pm-ajax-line {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    height: 3px;
    z-index: 80;
    overflow: hidden;
    pointer-events: none;
    background: rgba(22, 50, 79, 0.12);
}

.pm-ajax-line[hidden],
.pm-ajax-spin[hidden] { display: none !important; }

.pm-ajax-line:before {
    content: "";
    display: block;
    height: 100%;
    width: 100%;
    transform: scaleX(0);
    transform-origin: left center;
    background: linear-gradient(90deg, #16324f, #256d85 55%, #009ef7);
    animation: pm-ajax-line 0.8s ease-out forwards;
}

html[dir="rtl"] .pm-ajax-line:before { transform-origin: right center; }

.pm-ajax-spin {
    position: fixed;
    inset: 0;
    z-index: 70;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(245, 248, 250, 0.45);
    pointer-events: none;
}

.pm-spinner {
    display: block;
    box-sizing: border-box;
    width: 44px;
    height: 44px;
    flex: 0 0 44px;
    border-radius: 50%;
    border: 4px solid rgba(37, 109, 133, 0.18);
    border-top-color: #256d85;
    background: transparent;
    animation: pm-ajax-spin 0.75s linear infinite;
}

@keyframes pm-ajax-line {
    0% { transform: scaleX(0); }
    80% { transform: scaleX(0.72); }
    100% { transform: scaleX(0.9); }
}

@keyframes pm-ajax-spin {
    to { transform: rotate(360deg); }
}

.pm-lang {
    height: 36px;
    border: 1px solid var(--kt-gray-300, #e4e6ef);
    border-radius: 8px;
    padding: 0 8px;
    font-weight: 700;
    color: var(--kt-gray-800, #3f4254);
    background: #fff;
    max-width: 128px;
}

.pm-lang-form { margin: 0; }

#page-wrapper > .pm-content { padding: 0; }

.pm-page { color: var(--pm-text); padding-bottom: 28px; }

.pm-hero {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    background: linear-gradient(135deg, #16324f 0%, #1f4e79 62%, #256d85 100%);
    color: #fff;
    border-radius: 14px;
    padding: 18px 22px;
    margin-bottom: 18px;
    box-shadow: 0 10px 28px rgba(22, 50, 79, 0.22);
}

.pm-hero-main { display: flex; align-items: center; min-width: 0; }

.pm-hero-icon {
    width: 52px;
    height: 52px;
    border-radius: 12px;
    background: rgba(255, 255, 255, 0.12);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    margin-right: 16px;
}

.pm-hero-title {
    display: block;
    color: #fff;
    font-size: 22px;
    font-weight: 700;
    margin: 0;
    line-height: 1.2;
}

.pm-hero-sub { margin: 4px 0 0; color: rgba(255, 255, 255, 0.78); font-size: 13px; }

.pm-card {
    background: #fff;
    border: 1px solid var(--pm-border);
    border-radius: 12px;
    box-shadow: 0 6px 18px rgba(26, 35, 50, 0.06);
    margin-bottom: 16px;
}

.pm-card-head {
    padding: 12px 16px;
    border-bottom: 1px solid #eef2f7;
    font-weight: 700;
    color: var(--pm-navy);
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.pm-card-head span { display: flex; align-items: center; gap: 8px; }
.pm-card-head svg { color: var(--pm-teal); }
.pm-card-body { padding: 16px; }

.pm-label {
    display: block;
    font-size: 13px;
    font-weight: 700;
    color: var(--pm-muted);
    margin-bottom: 6px;
}

.pm-section {
    font-size: 12px;
    font-weight: 800;
    letter-spacing: 0.04em;
    color: var(--pm-teal);
    margin: 4px 0 12px;
}

.pm-kpi {
    background: #fff;
    border: 1px solid var(--pm-border);
    border-radius: 12px;
    padding: 12px 14px 10px 18px;
    margin-bottom: 14px;
    min-height: 96px;
    box-shadow: 0 6px 16px rgba(26, 35, 50, 0.05);
    position: relative;
    overflow: hidden;
}

.pm-kpi:before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 5px;
    height: 100%;
}

.pm-kpi-blue:before { background: var(--pm-blue); }
.pm-kpi-purple:before { background: var(--pm-purple); }
.pm-kpi-green:before { background: var(--pm-green); }
.pm-kpi-red:before { background: var(--pm-red); }

.pm-kpi-label { display: block; color: var(--pm-muted); font-size: 13px; font-weight: 700; }
.pm-kpi-value { display: block; margin-top: 6px; font-size: 26px; line-height: 1.1; color: var(--pm-navy); font-weight: 800; }

.pm-table-wrap { width: 100%; overflow-x: auto; -webkit-overflow-scrolling: touch; }

.pm-page .table { margin-bottom: 0; }
.pm-page .table th {
    background: var(--pm-navy);
    color: #fff;
    border: none;
    font-weight: 700;
    font-size: 13px;
    padding: 10px 8px;
    white-space: nowrap;
}
.pm-page .table td { padding: 8px; vertical-align: middle; border-color: #eef2f7; }
.pm-page .table tbody tr:hover { background: rgba(37, 109, 133, 0.04); }
.pm-page .table tfoot th { background: #f8fafc; color: var(--pm-navy); }

.pm-badge {
    display: inline-block;
    border-radius: 999px;
    padding: 3px 10px;
    font-size: 12px;
    font-weight: 700;
}
.pm-badge-Scheduled { background: #dbeafe; color: #1e40af; }
.pm-badge-InProgress { background: #fef3c7; color: #92400e; }
.pm-badge-Completed { background: #d1fae5; color: #065f46; }
.pm-badge-Cancelled { background: #fee2e2; color: #991b1b; }
.pm-badge-Admin, .pm-badge-Manager { background: #ede9fe; color: #5b21b6; }
.pm-person { display: flex; align-items: center; gap: 10px; }
.pm-photo { display: flex; align-items: center; gap: 12px; }
.pm-photo-frame { width: 64px; height: 64px; flex: 0 0 64px; }
.pm-photo-img, .pm-photo-empty {
    width: 40px; height: 40px; border-radius: 50%;
    object-fit: cover; display: inline-flex; align-items: center; justify-content: center;
    background: #e8eef3; color: #16324f; border: 1px solid #e2e8f0; overflow: hidden;
}
.pm-photo-frame .pm-photo-img, .pm-photo-frame .pm-photo-empty { width: 64px; height: 64px; font-size: 22px; }
.pm-badge-Staff { background: #dbeafe; color: #1e40af; }
.pm-badge-Outsource { background: #ffedd5; color: #9a3412; }
.pm-badge-Plumber { background: #dbeafe; color: #1e40af; }
.pm-badge-Receptionist { background: #e0f2fe; color: #075985; }
.pm-badge-on { background: #d1fae5; color: #065f46; }
.pm-badge-off { background: #f1f5f9; color: #475569; }
.pm-badge-Service { background: #dbeafe; color: #1e40af; }
.pm-badge-Item { background: #fef3c7; color: #92400e; }

.pm-actions { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
.pm-page .btn, .pm-hero .btn {
    border-radius: 8px;
    font-weight: 700;
    padding: 8px 14px;
}
.pm-page .btn-primary, .pm-hero .btn-primary {
    background: var(--pm-teal);
    border-color: var(--pm-teal);
}
.pm-page .btn-primary:hover, .pm-hero .btn-primary:hover {
    background: var(--pm-mid);
    border-color: var(--pm-mid);
}
.pm-page .btn-outline-primary {
    color: var(--pm-teal);
    border-color: var(--pm-teal);
}
.pm-page .btn-outline-primary:hover { background: var(--pm-teal); color: #fff; }
.pm-hero .btn-light,
.pm-hero .btn-outline-danger {
    background: #fff;
    color: var(--pm-navy);
    border: none;
}
.pm-hero .btn-outline-danger { color: var(--pm-red); }
.pm-hero form { margin: 0; }
.pm-page .btn-outline-secondary { color: var(--pm-navy); border-color: #c5d0dc; }
.pm-page .btn-outline-danger { color: var(--pm-red); border-color: #fecdca; }
.pm-page .btn-outline-danger:hover { background: var(--pm-red); border-color: var(--pm-red); color: #fff; }

.pm-page .form-control, .pm-page .form-select {
    border: 1px solid var(--pm-border);
    border-radius: 8px;
    min-height: 40px;
    color: var(--pm-text);
}
.pm-page .form-control:focus, .pm-page .form-select:focus {
    border-color: var(--pm-teal);
    box-shadow: 0 0 0 3px rgba(37, 109, 133, 0.16);
}

.pm-check { display: flex; align-items: center; gap: 8px; font-weight: 700; color: var(--pm-navy); }
.pm-muted { color: var(--pm-muted); }
.pm-empty { text-align: center; color: var(--pm-muted); padding: 28px 8px; }

.alert { border-radius: 12px; font-weight: 600; }
.alert-success { background: #ecfdf3; color: var(--pm-green); border-color: #abefc6; }
.alert-danger { background: #fef3f2; color: var(--pm-red); border-color: #fecdca; }

.cal-page .fc {
    --fc-border-color: #e6ebf2;
    --fc-page-bg-color: #fff;
    --fc-neutral-bg-color: #f8fafc;
    --fc-button-bg-color: #256d85;
    --fc-button-border-color: #256d85;
    --fc-button-hover-bg-color: #1f4e79;
    --fc-button-hover-border-color: #1f4e79;
    --fc-button-active-bg-color: #16324f;
    --fc-button-active-border-color: #16324f;
    --fc-today-bg-color: rgba(37, 109, 133, 0.08);
    --fc-event-bg-color: #175cd3;
    --fc-event-border-color: #16324f;
    --fc-now-indicator-color: #b42318;
}
.cal-page .fc .fc-toolbar-title { color: var(--pm-navy); font-size: 1.15rem; font-weight: 800; }
.cal-page .fc .fc-button { border-radius: 8px; font-weight: 700; text-transform: capitalize; }
.cal-page .fc .fc-col-header-cell-cushion,
.cal-page .fc .fc-col-header-cell-cushion:hover,
.cal-page .fc .fc-col-header-cell-cushion:focus {
    color: #fff !important;
    font-weight: 700;
}
.cal-page .fc .fc-timegrid-slot-label-cushion {
    color: var(--pm-muted);
    font-weight: 700;
    line-height: 1;
}
.cal-page .fc .fc-timegrid-slot {
    line-height: 1;
}

.pm-job-hover {
    position: fixed;
    z-index: 60;
    width: min(320px, calc(100vw - 16px));
    pointer-events: none;
    background: color-mix(in srgb, var(--erp-teal, var(--pm-teal)) 7%, var(--erp-card, #fff));
    border: 1px solid color-mix(in srgb, var(--erp-teal, var(--pm-teal)) 35%, #fff);
    border-radius: 14px;
    box-shadow: 0 16px 40px rgba(var(--erp-navy-rgb, 22, 50, 79), 0.28);
    overflow: hidden;
}

.pm-job-hover[hidden] { display: none !important; }

.pm-job-hover-head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 10px;
    padding: 12px 14px;
    background: var(--erp-hero, linear-gradient(135deg, var(--pm-navy) 0%, var(--pm-mid) 62%, var(--pm-teal) 100%));
    color: var(--erp-hero-text, #fff);
    border-bottom: 4px solid var(--pm-hover-accent, var(--erp-teal, var(--pm-teal)));
}

.pm-job-hover-titles { min-width: 0; }

.pm-job-hover-title {
    display: block;
    color: var(--erp-hero-text, #fff);
    font-size: 15px;
    font-weight: 800;
    line-height: 1.35;
}

.pm-job-hover-sub {
    display: block;
    margin-top: 2px;
    color: color-mix(in srgb, var(--erp-hero-text, #fff) 82%, transparent);
    font-size: 13px;
    font-weight: 700;
}

.pm-job-hover-head .pm-badge {
    flex: 0 0 auto;
    box-shadow: 0 0 0 2px color-mix(in srgb, var(--erp-hero-text, #fff) 45%, transparent);
}

.pm-job-hover-body {
    display: grid;
    gap: 6px;
    padding: 10px;
}

.pm-job-hover-row {
    display: grid;
    grid-template-columns: max-content minmax(0, 1fr);
    gap: 10px;
    align-items: start;
    padding: 6px 8px;
    border-radius: 8px;
    border-inline-start: 4px solid var(--erp-teal, var(--pm-teal));
    font-size: 13px;
}

.pm-job-hover-phone {
    background: color-mix(in srgb, var(--erp-teal, var(--pm-teal)) 28%, #fff);
    border-inline-start-color: var(--erp-teal, var(--pm-teal));
}
.pm-job-hover-phone .pm-job-hover-label { color: var(--erp-teal, var(--pm-teal)); }

.pm-job-hover-address {
    background: color-mix(in srgb, var(--erp-mid, var(--pm-mid)) 24%, #fff);
    border-inline-start-color: var(--erp-mid, var(--pm-mid));
}
.pm-job-hover-address .pm-job-hover-label { color: var(--erp-mid, var(--pm-mid)); }

.pm-job-hover-staff {
    background: color-mix(in srgb, var(--erp-navy, var(--pm-navy)) 16%, #fff);
    border-inline-start-color: var(--erp-navy, var(--pm-navy));
}
.pm-job-hover-staff .pm-job-hover-label { color: var(--erp-navy, var(--pm-navy)); }

.pm-job-hover-when {
    background: color-mix(in srgb, var(--pm-hover-accent, var(--erp-teal)) 26%, #fff);
    border-inline-start-color: var(--pm-hover-accent, var(--erp-teal));
}
.pm-job-hover-when .pm-job-hover-label { color: var(--pm-hover-accent, var(--erp-teal)); }

.pm-job-hover-total {
    background: color-mix(in srgb, var(--erp-teal, var(--pm-teal)) 34%, #fff);
    border-inline-start-color: var(--erp-teal, var(--pm-teal));
}
.pm-job-hover-total .pm-job-hover-label { color: var(--erp-teal, var(--pm-teal)); }
.pm-job-hover-total .pm-job-hover-value { color: var(--erp-navy, var(--pm-navy)); font-weight: 800; }

.pm-job-hover-label {
    color: var(--erp-teal, var(--pm-teal));
    font-weight: 700;
}

.pm-job-hover-value {
    color: var(--erp-navy, var(--pm-navy));
    font-weight: 600;
    overflow-wrap: anywhere;
}

.pm-job-hover-notes {
    display: grid;
    gap: 4px;
    margin: 0;
    padding: 8px 10px;
    border-radius: 8px;
    border-inline-start: 4px solid var(--erp-mid, var(--pm-mid));
    background: color-mix(in srgb, var(--erp-mid, var(--pm-mid)) 12%, #fff);
    color: var(--erp-navy, var(--pm-navy));
    font-size: 13px;
    font-weight: 600;
    white-space: pre-wrap;
    max-height: 6.5em;
    overflow: hidden;
}

.pm-job-hover-notes .pm-job-hover-label { color: var(--erp-mid, var(--pm-mid)); }

.pm-backdrop {
    display: none;
    position: fixed;
    inset: 0;
    background: rgba(22, 50, 79, 0.35);
    z-index: 25;
}

.pm-throw {
    position: fixed;
    inset: 0;
    z-index: 75;
    visibility: hidden;
    pointer-events: none;
}

.pm-throw.is-open {
    visibility: visible;
    pointer-events: auto;
}

.pm-throw.is-closing { pointer-events: none; }

body.pm-throw-lock { overflow: hidden; }

.pm-throw-backdrop {
    position: absolute;
    inset: 0;
    background: rgba(22, 50, 79, 0.46);
    opacity: 0;
    transition: opacity 0.28s ease;
}

.pm-throw.is-open .pm-throw-backdrop { opacity: 1; }
.pm-throw.is-closing .pm-throw-backdrop { opacity: 0; }

.pm-throw-sheet {
    position: absolute;
    top: 0;
    bottom: 0;
    right: 0;
    width: min(440px, 100%);
    background: #fff;
    display: flex;
    flex-direction: column;
    box-shadow: -18px 0 42px rgba(22, 50, 79, 0.24);
    transform: translateX(110%) rotate(6deg);
    transform-origin: right center;
}

.pm-throw.is-open .pm-throw-sheet {
    animation: pm-throw-in 0.55s cubic-bezier(0.18, 0.9, 0.24, 1.12) both;
}

.pm-throw.is-closing .pm-throw-sheet {
    animation: pm-throw-out 0.32s ease both;
}

@keyframes pm-throw-in {
    0% { transform: translateX(120%) rotate(7deg); }
    62% { transform: translateX(-16px) rotate(-1.2deg); }
    100% { transform: translateX(0) rotate(0); }
}

@keyframes pm-throw-out {
    0% { transform: translateX(0) rotate(0); }
    100% { transform: translateX(115%) rotate(6deg); }
}

.pm-throw-head {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    padding: 18px 18px 14px;
    background: linear-gradient(135deg, #16324f 0%, #1f4e79 62%, #256d85 100%);
    color: #fff;
}

.pm-throw-mark {
    width: 42px;
    height: 42px;
    border-radius: 12px;
    background: rgba(255, 255, 255, 0.14);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.pm-throw-heading { min-width: 0; flex: 1; }
.pm-throw-heading h2 {
    margin: 0;
    font-size: 18px;
    font-weight: 700;
    line-height: 1.25;
    color: #fff;
}
.pm-throw-heading p {
    margin: 4px 0 0;
    color: rgba(255, 255, 255, 0.78);
    font-size: 13px;
}

.pm-throw-x {
    width: 36px;
    height: 36px;
    border: 0;
    border-radius: 10px;
    background: rgba(255, 255, 255, 0.12);
    color: #fff;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}
.pm-throw-x:hover { background: rgba(255, 255, 255, 0.22); }

.pm-throw-body { flex: 1; overflow: auto; padding: 18px 18px 8px; }
.pm-throw-foot {
    display: flex;
    justify-content: flex-end;
    gap: 8px;
    padding: 14px 18px;
    border-top: 1px solid var(--pm-border);
    background: #fff;
}
.pm-throw-foot .btn { min-width: 108px; }

html[dir="rtl"] .pm-hero-icon { margin-right: 0; margin-left: 16px; }
html[dir="rtl"] .pm-kpi { padding: 12px 18px 10px 14px; }
html[dir="rtl"] .pm-kpi:before { left: auto; right: 0; }
html[dir="rtl"] .pm-throw-sheet {
    right: auto;
    left: 0;
    box-shadow: 18px 0 42px rgba(22, 50, 79, 0.24);
    transform: translateX(-110%) rotate(-6deg);
    transform-origin: left center;
}
html[dir="rtl"] .pm-throw.is-open .pm-throw-sheet { animation-name: pm-throw-in-rtl; }
html[dir="rtl"] .pm-throw.is-closing .pm-throw-sheet { animation-name: pm-throw-out-rtl; }

@keyframes pm-throw-in-rtl {
    0% { transform: translateX(-120%) rotate(-7deg); }
    62% { transform: translateX(16px) rotate(1.2deg); }
    100% { transform: translateX(0) rotate(0); }
}

@keyframes pm-throw-out-rtl {
    0% { transform: translateX(0) rotate(0); }
    100% { transform: translateX(-115%) rotate(-6deg); }
}

.pm-popup {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 24px 16px;
}

.pm-popup .pm-throw-sheet {
    position: relative;
    top: auto;
    right: auto;
    bottom: auto;
    left: auto;
    width: min(520px, 100%);
    height: auto;
    max-height: min(680px, calc(100vh - 48px));
    border-radius: 16px;
    overflow: hidden;
    transform: translateY(18px) scale(0.96);
    transform-origin: center center;
    box-shadow: 0 24px 60px rgba(22, 50, 79, 0.28);
}

.pm-popup.is-open .pm-throw-sheet {
    animation: pm-popup-in 0.38s cubic-bezier(0.18, 0.9, 0.24, 1.12) both;
}

.pm-popup.is-closing .pm-throw-sheet {
    animation: pm-popup-out 0.22s ease both;
}

.pm-popup .pm-throw-body { overflow: auto; }

html[dir="rtl"] .pm-popup .pm-throw-sheet {
    right: auto;
    left: auto;
    transform: translateY(18px) scale(0.96);
    transform-origin: center center;
    box-shadow: 0 24px 60px rgba(22, 50, 79, 0.28);
}

html[dir="rtl"] .pm-popup.is-open .pm-throw-sheet { animation: pm-popup-in 0.38s cubic-bezier(0.18, 0.9, 0.24, 1.12) both; }
html[dir="rtl"] .pm-popup.is-closing .pm-throw-sheet { animation: pm-popup-out 0.22s ease both; }

@keyframes pm-popup-in {
    0% { opacity: 0; transform: translateY(28px) scale(0.92); }
    70% { opacity: 1; transform: translateY(-4px) scale(1.02); }
    100% { opacity: 1; transform: none; }
}

@keyframes pm-popup-out {
    0% { opacity: 1; transform: none; }
    100% { opacity: 0; transform: translateY(16px) scale(0.96); }
}

body.pm-login {
    --pm-login-deep: var(--erp-navy, var(--pm-navy));
    --pm-login-mid: var(--erp-mid, var(--pm-mid));
    --pm-login-bright: var(--erp-teal, var(--pm-teal));
    --pm-login-ink: var(--erp-navy, var(--pm-navy));
    --pm-login-btn: var(--erp-teal, var(--pm-teal));
    --pm-bg: var(--erp-page-bg, #f5f8fa);
    --pm-text: var(--erp-text, #1a2332);
    margin: 0;
    min-height: 100%;
    background: var(--pm-login-deep);
}

.pm-login-shell {
    min-height: 100vh;
    display: flex;
    align-items: stretch;
}

.pm-login-aside {
    flex: 1.15;
    position: relative;
    overflow: hidden;
    display: flex;
    align-items: center;
    padding: 48px 56px;
    background: var(--erp-hero, linear-gradient(135deg, var(--pm-login-deep) 0%, var(--pm-login-mid) 62%, var(--pm-login-bright) 100%));
    color: #fff;
}

.pm-login-aside:before,
.pm-login-aside:after {
    content: "";
    position: absolute;
    border-radius: 50%;
}

.pm-login-aside:before {
    width: 420px;
    height: 420px;
    background: rgba(var(--erp-teal-rgb, 37, 109, 133), 0.35);
    left: -120px;
    bottom: -140px;
}

.pm-login-aside:after {
    width: 260px;
    height: 260px;
    border: 40px solid rgba(255, 255, 255, 0.06);
    top: -80px;
    right: -60px;
}

.pm-login-aside-inner {
    position: relative;
    z-index: 1;
    max-width: 460px;
}

.pm-login-mark {
    width: 64px;
    height: 64px;
    border-radius: 18px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(255, 255, 255, 0.12);
    border: 1px solid rgba(255, 255, 255, 0.18);
    margin-bottom: 22px;
}

.pm-login-company {
    margin: 0 0 8px;
    font-size: 32px;
    font-weight: 800;
    line-height: 1.35;
}

.pm-login-product {
    margin: 0 0 28px;
    font-size: 16px;
    font-weight: 600;
    color: rgba(255, 255, 255, 0.78);
}

.pm-login-points {
    list-style: none;
    margin: 0;
    padding: 0;
}

.pm-login-points li {
    display: flex;
    align-items: center;
    gap: 12px;
    margin: 0 0 12px;
    font-size: 15px;
    font-weight: 600;
    color: rgba(255, 255, 255, 0.9);
}

.pm-login-points svg { flex-shrink: 0; }

.pm-login-panel {
    flex: 0.85;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 32px 24px;
    background:
        radial-gradient(circle at 20% 10%, rgba(var(--erp-teal-rgb, 37, 109, 133), 0.14), transparent 42%),
        var(--pm-bg);
}

.pm-login-card {
    position: relative;
    width: 100%;
    max-width: 420px;
    background: #fff;
    border: 1px solid var(--pm-border);
    border-radius: 22px;
    box-shadow: 0 18px 50px rgba(var(--erp-navy-rgb, 22, 50, 79), 0.12);
    padding: 32px 28px 24px;
}

.pm-login-lang {
    position: absolute;
    top: 18px;
    inset-inline-end: 18px;
    margin: 0;
}

.pm-login-kicker {
    margin: 0 0 6px;
    color: var(--pm-login-mid);
    font-size: 13px;
    font-weight: 700;
}

.pm-login-card h1 {
    margin: 0 0 6px;
    font-size: 28px;
    font-weight: 800;
    color: var(--pm-login-ink);
}

.pm-login-lead {
    margin: 0 0 22px;
    color: var(--pm-muted);
    font-size: 14px;
    font-weight: 600;
}

.pm-login-error {
    display: block;
    margin: 0 0 14px;
    padding: 10px 12px;
    border-radius: 10px;
    background: #fdecec;
    color: #9b1c1c;
    font-size: 13px;
    font-weight: 700;
}

.pm-login-error ul { margin: 0; padding-inline-start: 18px; }

.pm-login-field { margin: 0 0 14px; }

.pm-login-field label {
    display: block;
    margin: 0 0 6px;
    color: var(--pm-muted);
    font-size: 13px;
    font-weight: 700;
}

.pm-login-input { position: relative; }

.pm-login-input > svg {
    position: absolute;
    top: 50%;
    inset-inline-start: 14px;
    transform: translateY(-50%);
    color: var(--pm-login-mid);
    pointer-events: none;
}

.pm-login-input input {
    width: 100%;
    height: 44px;
    box-sizing: border-box;
    padding-inline-start: 42px;
    padding-inline-end: 42px;
    border: 1.5px solid #6eade6;
    border-radius: 10px;
    background: #fff;
    color: var(--pm-login-ink);
    font-family: inherit;
    font-size: 15px;
    font-weight: 700;
    text-align: start;
}

.pm-login-input input:focus {
    outline: none;
    border-color: var(--pm-login-mid);
    box-shadow: 0 0 0 3px rgba(var(--erp-teal-rgb, 37, 109, 133), 0.16);
    background: #fff;
}

.pm-login-eye {
    position: absolute;
    top: 50%;
    inset-inline-end: 8px;
    transform: translateY(-50%);
    width: 32px;
    height: 32px;
    border: 0;
    border-radius: 8px;
    background: transparent;
    color: #5e6278;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
}

.pm-login-eye:hover {
    background: rgba(var(--erp-teal-rgb, 37, 109, 133), 0.1);
    color: var(--pm-login-mid);
}

.pm-login-remember {
    display: flex;
    align-items: center;
    gap: 8px;
    margin: 4px 0 18px;
    color: var(--pm-text);
    font-size: 14px;
    font-weight: 700;
}

.pm-login-remember input {
    width: 16px;
    height: 16px;
    margin: 0;
}

.pm-login-submit {
    width: 100%;
    height: 46px;
    border: 0;
    border-radius: 10px;
    background: var(--pm-login-btn);
    color: #fff;
    font-family: inherit;
    font-size: 16px;
    font-weight: 800;
    cursor: pointer;
}

.pm-login-submit:hover,
.pm-login-submit:focus { background: var(--pm-login-deep); }

.pm-login-foot {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    margin-top: 16px;
    color: var(--pm-muted);
    font-size: 12px;
    font-weight: 700;
}

.pm-login-foot svg { color: var(--pm-login-mid); }

@media (max-width: 900px) {
    .pm-login-shell {
        display: block;
        background: linear-gradient(160deg, var(--pm-login-deep) 0%, var(--pm-login-bright) 38%, var(--pm-bg) 38%);
    }

    .pm-login-aside { padding: 28px 22px 18px; }
    .pm-login-company { font-size: 24px; }
    .pm-login-points { display: none; }
    .pm-login-panel { background: transparent; padding: 8px 16px 28px; }
}

@media (max-width: 991px) {
    .pm-hero { align-items: stretch; flex-direction: column; }
    .pm-hero-title { font-size: 18px; }
    .pm-actions .btn, .pm-hero .btn { width: 100%; }
    .pm-throw-foot { flex-direction: column; }
    .pm-throw-foot .btn { width: 100%; }
}

@media (prefers-reduced-motion: reduce) {
    .pm-throw.is-open .pm-throw-sheet,
    .pm-throw.is-closing .pm-throw-sheet { animation-duration: 0.01ms; }
}

/* Shell fit: Bootstrap 5 plus the GBM menu. Arabic keeps the sidebar on the right. */
.mm-topbar.navbar {
    display: block;
    padding: 0;
}

.mm-topbar .navbar-brand { margin: 0; }

.mm-toolbar,
.mm-toolbar-item { overflow: visible; }

.mm-topbar .dropdown-toggle::after { display: none; }

.mm-topbar .dropdown-menu > li > a.dropdown-item,
.mm-topbar .dropdown-menu > li > button.dropdown-item {
    display: block;
    width: 100%;
    text-align: inherit;
    background: transparent;
    border: 0;
    border-radius: 0;
    font-weight: 600;
    color: var(--kt-gray-700, #5e6278);
    white-space: nowrap;
}

.mm-topbar .dropdown-menu > li > button.dropdown-item { cursor: pointer; }

.mm-logout-form { margin: 0; }

button.mm-logout-btn {
    border: 0;
    cursor: pointer;
    font-family: inherit;
}

.mm-sidebar #submenue.nav,
.mm-sidebar .nav-second-level.nav {
    display: block;
    flex-direction: column;
    flex-wrap: nowrap;
    padding: 0;
    margin: 0;
    list-style: none;
    width: 100%;
}

.mm-sidebar #submenue > li > ul.nav-second-level {
    display: none;
}

.mm-sidebar #submenue > li.mm-expanded > ul.nav-second-level {
    display: block;
}

.mm-sidebar #submenue > li,
.mm-sidebar .nav-second-level > li {
    display: block;
    float: none;
    clear: both;
    width: 100%;
    position: relative;
}

.mm-sidebar #submenue a,
.mm-sidebar-logout button {
    display: flex;
    align-items: center;
    gap: 10px;
    width: 100%;
    min-height: 42px;
    line-height: 1.4;
    box-sizing: border-box;
    text-decoration: none;
}

.mm-sidebar #submenue a > i,
.mm-sidebar-logout button > i {
    flex: 0 0 18px;
    width: 18px;
    margin: 0 !important;
    text-align: center;
    line-height: 1;
}

.mm-sidebar #submenue .arrow {
    float: none !important;
    margin: 0 0 0 auto;
    line-height: 1;
}

html[dir="rtl"] .mm-sidebar #submenue .arrow {
    margin: 0 auto 0 0;
}

.mm-sidebar-logout button {
    display: block;
    width: 100%;
    text-align: start;
    color: #b42318 !important;
    background: transparent !important;
    border: 0;
    border-radius: 8px;
    padding: 10px 12px !important;
    font-weight: 700;
    white-space: nowrap;
    overflow: hidden;
    cursor: pointer;
    font-family: inherit;
}

.mm-sidebar-logout button > i {
    width: 24px;
    font-size: 17px;
    margin-left: 8px;
    color: #b42318 !important;
}

.mm-sidebar-logout button:hover,
.mm-sidebar-logout button:focus {
    background: #fef3f2 !important;
    color: #b42318 !important;
}

body.mm-dark .pm-lang {
    background: #2b2b40;
    color: #fff;
    border-color: #3f3f5a;
}

body.mm-dark .mm-sidebar-logout button,
body.mm-dark .mm-sidebar-logout button > i {
    color: #fda29b !important;
}

body.mm-dark .mm-sidebar-logout button:hover,
body.mm-dark .mm-sidebar-logout button:focus {
    background: #3f1b1b !important;
}

html[dir="ltr"] .mm-toolbar { left: auto; right: 16px; }

html[dir="ltr"] .mm-brand i { margin-left: 0; margin-right: 8px; }

html[dir="ltr"] .mm-logout-btn i { margin-left: 0; margin-right: 6px; }

html[dir="ltr"] .mm-sidebar.navbar-default,
html[dir="ltr"] .mm-sidebar.sidebar {
    right: auto;
    left: 0;
    border-left: 0 !important;
    border-right: 1px solid var(--kt-gray-200, #eff2f5) !important;
}

html[dir="ltr"] body.mm-dark .mm-sidebar.navbar-default,
html[dir="ltr"] body.mm-dark .mm-sidebar.sidebar {
    border-right-color: #2b2b40 !important;
}

html[dir="ltr"] body.mm-app #page-wrapper {
    margin: var(--kt-header-h, 70px) 0 0 var(--kt-aside-w, 78px) !important;
}

html[dir="ltr"] body.mm-pinned #page-wrapper {
    margin-left: var(--kt-aside-w-open, 295px) !important;
    margin-right: 0 !important;
}

html[dir="ltr"] .mm-sidebar .arrow { float: right; }

html[dir="ltr"] .mm-dept > a .arrow:before { content: "\f105"; }
html[dir="ltr"] .mm-dept.mm-expanded > a .arrow:before { content: "\f107"; }

.mm-sidebar .nav-second-level li a i {
    width: 14px;
    text-align: center;
}

html[dir="ltr"] .mm-sidebar .nav-second-level li a {
    padding: 8px 12px 8px 36px !important;
}

html[dir="ltr"] .mm-sidebar .nav-second-level li a i {
    margin-left: 0;
    margin-right: 8px;
}

html[dir="ltr"] .mm-dept > a > i,
html[dir="ltr"] .mm-sidebar .nav > li > a > i,
html[dir="ltr"] .mm-sidebar-logout button > i {
    margin-left: 0;
    margin-right: 8px;
}

html[dir="ltr"] .mm-sidebar .nav-second-level li.mm-chosen > a,
html[dir="ltr"] .mm-sidebar .nav-second-level li a.active,
html[dir="ltr"] body.mm-dark .mm-sidebar .nav-second-level li.mm-chosen > a,
html[dir="ltr"] body.mm-dark .mm-sidebar .nav-second-level li a.active {
    box-shadow: inset 3px 0 0 #009EF7;
}

html[dir="ltr"] .mm-topbar .dropdown-menu { left: auto; right: 0; }

html[dir="ltr"] .erp-theme-panel {
    left: auto;
    right: 0;
    direction: ltr;
    text-align: left;
    transform: translateX(105%);
    box-shadow: -12px 0 40px rgba(22, 50, 79, 0.18);
}

html[dir="ltr"] .erp-theme-panel.is-open,
html[dir="ltr"] body.erp-theme-open .erp-theme-panel {
    transform: translateX(0);
}

/* Keep existing page fields. The theme file's field skin is for the color panel preview only. */
body.mm-app #page-wrapper .pm-page input,
body.mm-app #page-wrapper .pm-page select,
body.mm-app #page-wrapper .pm-page textarea,
body.mm-app #page-wrapper .fc input,
body.mm-app #page-wrapper .fc select {
    height: auto !important;
    min-height: 0;
    padding: 6px 12px !important;
    background-color: #fff !important;
    background-image: none !important;
    border: 1px solid var(--pm-border) !important;
    border-radius: 8px !important;
    box-shadow: none !important;
    color: var(--pm-text) !important;
    font-size: 14px !important;
    font-weight: 600 !important;
    text-align: start !important;
}

body.mm-app #page-wrapper .pm-page textarea {
    min-height: 96px;
}

body.mm-app #page-wrapper .pm-page .form-control:focus,
body.mm-app #page-wrapper .pm-page .form-select:focus {
    border-color: var(--pm-teal) !important;
    box-shadow: 0 0 0 3px rgba(37, 109, 133, 0.16) !important;
}

@media (max-width: 767px) {
    html[dir="ltr"] .mm-burger { right: auto; left: 12px; }
    html[dir="ltr"] .mm-brand { padding-left: 56px !important; padding-right: 12px !important; }
    html[dir="ltr"] body.mm-app #page-wrapper,
    html[dir="ltr"] body.mm-pinned #page-wrapper {
        margin: var(--kt-header-h, 70px) 0 0 0 !important;
    }
    html[dir="ltr"] .mm-sidebar.mm-open {
        box-shadow: 12px 0 30px rgba(24, 28, 50, 0.25);
    }
}

/* Night mode covers the page, not only the shell.
   html is height:100%, so a long page overflows the body box and the
   canvas would otherwise stay the light page color. */
html:has(body.mm-dark) {
    background: #151521 !important;
}

body.mm-dark,
body.mm-app.mm-dark {
    height: auto;
    min-height: 100%;
    background: #151521 !important;
    color: #e4e6ef !important;
    --bs-body-bg: #151521;
    --bs-body-color: #e4e6ef;
    --bs-secondary-color: #a1a5b7;
    --bs-border-color: #2b2b40;
    --bs-dropdown-bg: #1e1e2d;
    --bs-dropdown-color: #e4e6ef;
    --bs-dropdown-link-color: #e4e6ef;
    --bs-dropdown-link-hover-color: #fff;
    --bs-dropdown-link-hover-bg: #2b2b40;
    --bs-dropdown-border-color: #2b2b40;
}

body.mm-dark #wrapper,
body.mm-app.mm-dark #page-wrapper {
    background: #151521 !important;
}

body.mm-dark #page-wrapper,
body.mm-dark .pm-page {
    color: #e4e6ef;
}

body.mm-dark #mmTheme {
    color: #ffc700 !important;
    background: #2b2b40;
}

body.mm-dark .pm-card,
body.mm-dark .pm-kpi,
body.mm-dark .pm-throw-sheet,
body.mm-dark .pm-throw-foot,
body.mm-dark .mm-topbar .dropdown-menu {
    background: #1e1e2d;
    border-color: #2b2b40;
    color: #e4e6ef;
    box-shadow: none;
}

body.mm-dark .pm-card-head,
body.mm-dark .pm-kpi-value,
body.mm-dark .pm-check,
body.mm-dark [class$="-card-head"],
body.mm-dark [class*="-card-head "] {
    color: #f5f8fa !important;
    border-color: #2b2b40;
}

body.mm-dark .pm-card-head svg,
body.mm-dark [class$="-card-head"] i,
body.mm-dark [class*="-card-head "] i {
    color: #7dd3fc !important;
}

body.mm-dark .pm-label,
body.mm-dark .pm-kpi-label,
body.mm-dark .pm-muted,
body.mm-dark .pm-empty,
body.mm-dark .pm-page small {
    color: #a1a5b7;
}

body.mm-dark .pm-section { color: #7dd3fc; }

body.mm-dark .pm-page .table {
    --bs-table-bg: transparent;
    --bs-table-color: #e4e6ef;
    --bs-table-border-color: #2b2b40;
    --bs-table-hover-bg: #2b2b40;
    --bs-table-hover-color: #fff;
    color: #e4e6ef;
}

body.mm-dark .pm-page .table td {
    color: #e4e6ef;
    border-color: #2b2b40;
    background: transparent;
}

body.mm-app.mm-dark .pm-page .table tr:hover td,
body.mm-app.mm-dark [class*="-page"] .table tr:hover td {
    background-color: #2b2b40 !important;
    color: #fff !important;
}

body.mm-dark .pm-page .table a,
body.mm-dark .pm-page .table a:hover {
    color: #7dd3fc !important;
}

body.mm-dark .pm-page .table tfoot th {
    background: #151521;
    color: #e4e6ef;
}

body.mm-dark .pm-page .btn-outline-secondary,
body.mm-dark .pm-throw .btn-outline-secondary {
    color: #e4e6ef;
    border-color: #3f3f5a;
}

body.mm-dark .pm-page .btn-outline-secondary:hover,
body.mm-dark .pm-throw .btn-outline-secondary:hover {
    background: #2b2b40;
    color: #fff;
}

body.mm-dark.mm-app #page-wrapper .pm-page input,
body.mm-dark.mm-app #page-wrapper .pm-page select,
body.mm-dark.mm-app #page-wrapper .pm-page textarea,
body.mm-dark.mm-app #page-wrapper .pm-throw input,
body.mm-dark.mm-app #page-wrapper .pm-throw select,
body.mm-dark.mm-app #page-wrapper .pm-throw textarea,
body.mm-dark.mm-app #page-wrapper .fc input,
body.mm-dark.mm-app #page-wrapper .fc select,
body.mm-dark.mm-app #page-wrapper input[type="text"],
body.mm-dark.mm-app #page-wrapper input[type="password"],
body.mm-dark.mm-app #page-wrapper input[type="number"],
body.mm-dark.mm-app #page-wrapper input[type="email"],
body.mm-dark.mm-app #page-wrapper input[type="tel"],
body.mm-dark.mm-app #page-wrapper input[type="search"],
body.mm-dark.mm-app #page-wrapper input[type="url"],
body.mm-dark.mm-app #page-wrapper input[type="date"],
body.mm-dark.mm-app #page-wrapper input[type="datetime-local"],
body.mm-dark.mm-app #page-wrapper input[type="time"],
body.mm-dark.mm-app #page-wrapper input[type="month"],
body.mm-dark.mm-app #page-wrapper textarea,
body.mm-dark.mm-app #page-wrapper select:not([multiple]):not([size]) {
    background-color: #151521 !important;
    border-color: #3f3f5a !important;
    color: #e4e6ef !important;
}

body.mm-dark.mm-app #page-wrapper .pm-page .form-control:focus,
body.mm-dark.mm-app #page-wrapper .pm-page .form-select:focus,
body.mm-dark.mm-app #page-wrapper .pm-throw .form-control:focus,
body.mm-dark.mm-app #page-wrapper .pm-throw .form-select:focus,
body.mm-dark.mm-app #page-wrapper input:focus,
body.mm-dark.mm-app #page-wrapper textarea:focus,
body.mm-dark.mm-app #page-wrapper select:focus {
    background-color: #151521 !important;
    border-color: #009ef7 !important;
    box-shadow: 0 0 0 3px rgba(0, 158, 247, 0.22) !important;
    color: #fff !important;
}

body.mm-dark.mm-app #page-wrapper select option {
    background: #1e1e2d;
    color: #e4e6ef;
}

body.mm-dark .mm-topbar .dropdown-menu > li > a,
body.mm-dark .mm-topbar .dropdown-menu > li > a.dropdown-item,
body.mm-dark .mm-topbar .dropdown-menu > li > button.dropdown-item {
    color: #e4e6ef !important;
}

body.mm-dark .mm-topbar .dropdown-menu > li > a:hover,
body.mm-dark .mm-topbar .dropdown-menu > li > a.dropdown-item:hover,
body.mm-dark .mm-topbar .dropdown-menu > li > button.dropdown-item:hover {
    background: #2b2b40 !important;
    color: #fff !important;
}

body.mm-dark .dropdown-divider { border-color: #2b2b40; }

body.mm-dark .cal-page .fc {
    --fc-border-color: #3f3f5a;
    --fc-page-bg-color: #1e1e2d;
    --fc-neutral-bg-color: #151521;
    --fc-neutral-text-color: #a1a5b7;
    --fc-today-bg-color: rgba(0, 158, 247, 0.16);
    --fc-highlight-color: rgba(0, 158, 247, 0.22);
    --fc-non-business-color: rgba(0, 0, 0, 0.25);
    --fc-list-event-hover-bg-color: #2b2b40;
    color: #e4e6ef;
}

body.mm-dark .cal-page .fc .fc-toolbar-title,
body.mm-dark .cal-page .fc .fc-timegrid-slot-label-cushion,
body.mm-dark .cal-page .fc .fc-timegrid-axis-cushion,
body.mm-dark .cal-page .fc .fc-daygrid-day-number,
body.mm-dark .cal-page .fc .fc-daygrid-day-number:hover {
    color: #e4e6ef;
}

body.mm-dark .cal-page .fc-theme-standard td,
body.mm-dark .cal-page .fc .fc-scrollgrid,
body.mm-dark .cal-page .fc .fc-timegrid-slot,
body.mm-dark .cal-page .fc .fc-timegrid-col,
body.mm-dark .cal-page .fc .fc-daygrid-day,
body.mm-dark .cal-page .fc .fc-timegrid-axis {
    background-color: #1e1e2d;
}

body.mm-dark .cal-page .fc .fc-timegrid-slot-lane {
    background-color: transparent;
}

body.mm-dark .cal-page .fc .fc-day-today,
body.mm-dark .cal-page .fc .fc-timegrid-col.fc-day-today,
body.mm-dark .cal-page .fc .fc-daygrid-day.pm-has-jobs,
body.mm-dark .cal-page .fc .fc-timegrid-col.pm-has-jobs,
body.mm-dark .cal-page .fc .fc-timegrid-col.pm-has-jobs .fc-timegrid-col-frame,
body.mm-dark .cal-page .fc .fc-timegrid-col.fc-day-today .fc-timegrid-col-frame {
    background-color: #243044;
}

body.mm-dark .cal-page .fc .fc-timegrid-col.pm-has-jobs .fc-timegrid-col-frame,
body.mm-dark .cal-page .fc .fc-timegrid-col.fc-day-today .fc-timegrid-col-frame {
    min-height: 100%;
}

body.mm-dark .cal-page .fc .fc-col-header-cell-cushion,
body.mm-dark .cal-page .fc .fc-col-header-cell-cushion:hover,
body.mm-dark .cal-page .fc .fc-col-header-cell-cushion:focus {
    color: #fff !important;
}

body.mm-dark .pm-job-hover {
    background: #1b2433;
    border-color: color-mix(in srgb, var(--erp-teal, var(--pm-teal)) 45%, #1b2433);
    box-shadow: 0 16px 40px rgba(0, 0, 0, 0.45);
}

body.mm-dark .pm-job-hover-title,
body.mm-dark .pm-job-hover-sub {
    color: var(--erp-hero-text, #fff);
}

body.mm-dark .pm-job-hover-sub {
    color: color-mix(in srgb, var(--erp-hero-text, #fff) 82%, transparent);
}

body.mm-dark .pm-job-hover-phone,
body.mm-dark .pm-job-hover-address,
body.mm-dark .pm-job-hover-staff,
body.mm-dark .pm-job-hover-when,
body.mm-dark .pm-job-hover-total,
body.mm-dark .pm-job-hover-notes {
    background: color-mix(in srgb, var(--erp-teal, var(--pm-teal)) 18%, #1b2433);
}

body.mm-dark .pm-job-hover-address { background: color-mix(in srgb, var(--erp-mid, var(--pm-mid)) 28%, #1b2433); }
body.mm-dark .pm-job-hover-staff { background: color-mix(in srgb, var(--erp-navy, var(--pm-navy)) 55%, #151521); }
body.mm-dark .pm-job-hover-when { background: color-mix(in srgb, var(--pm-hover-accent, var(--erp-teal)) 28%, #1b2433); }

body.mm-dark .pm-job-hover-value,
body.mm-dark .pm-job-hover-notes {
    color: #e4e6ef;
}

body.mm-dark .pm-job-hover-total .pm-job-hover-value { color: #fff; }

/* Searchable dropdowns. The native select stays for form posts. */
.pm-ss {
    position: relative;
    display: block;
    width: 100%;
    min-width: 0;
}

.pm-ss-lang {
    width: auto;
    max-width: 160px;
}

.pm-ss-btn {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    width: 100%;
    min-height: 40px;
    margin: 0;
    padding: 6px 12px;
    border: 1px solid var(--pm-border);
    border-radius: 8px;
    background: #fff;
    color: var(--pm-text);
    font: 600 14px/1.3 "Cairo", "Segoe UI", Tahoma, "Traditional Arabic", Arial, sans-serif;
    text-align: start;
    cursor: pointer;
    box-sizing: border-box;
}

.pm-ss-lang .pm-ss-btn {
    min-height: 36px;
    height: 36px;
    max-width: 148px;
    padding: 0 8px;
    font-weight: 700;
}

.pm-ss-btn:hover,
.pm-ss-btn[aria-expanded="true"] {
    border-color: var(--pm-teal);
    box-shadow: 0 0 0 3px rgba(37, 109, 133, 0.16);
}

.pm-ss-btn:disabled {
    cursor: not-allowed;
    opacity: 0.7;
}

.pm-ss-btn.is-invalid {
    border-color: var(--pm-red);
}

.pm-ss-label {
    flex: 1 1 auto;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.pm-ss-caret {
    flex: 0 0 14px;
    width: 14px;
    height: 14px;
    background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 14 14'%3E%3Cpath fill='none' stroke='%231565c0' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round' d='M3 5.2l4 4 4-4'/%3E%3C/svg%3E") center / 14px 14px no-repeat;
}

.pm-ss-panel {
    position: fixed;
    z-index: 90;
    display: flex;
    flex-direction: column;
    gap: 6px;
    max-height: 280px;
    padding: 8px;
    border: 1px solid #d5deea;
    border-radius: 10px;
    background: #fff;
    box-shadow: 0 12px 32px rgba(22, 50, 79, 0.18);
    box-sizing: border-box;
}

.pm-ss-panel[hidden] { display: none !important; }

.pm-ss-search,
body.mm-app #page-wrapper input.pm-ss-search[type="search"],
body.pm-login input.pm-ss-search[type="search"] {
    width: 100% !important;
    height: 36px !important;
    min-height: 0 !important;
    margin: 0;
    padding: 0 10px !important;
    border: 1.5px solid #6eade6 !important;
    border-radius: 8px !important;
    background: #fff !important;
    background-image: none !important;
    color: #1565c0 !important;
    font: 700 14px/1.3 "Cairo", "Segoe UI", Tahoma, "Traditional Arabic", Arial, sans-serif !important;
    text-align: start !important;
    box-shadow: none !important;
    box-sizing: border-box;
}

.pm-ss-search:focus {
    outline: none;
    border-color: #1f4e79;
    box-shadow: 0 0 0 3px rgba(37, 109, 133, 0.16);
}

.pm-ss-list {
    list-style: none;
    margin: 0;
    padding: 0;
    overflow: auto;
    max-height: 210px;
}

.pm-ss-group {
    padding: 6px 10px 2px;
    color: var(--pm-muted);
    font-size: 12px;
    font-weight: 800;
}

.pm-ss-opt {
    padding: 7px 10px;
    border-radius: 6px;
    color: #16324f;
    font-weight: 700;
    cursor: pointer;
}

.pm-ss-opt.is-active,
.pm-ss-opt:hover {
    background: #f1faff;
    color: #1f4e79;
}

.pm-ss-opt.is-chosen {
    background: #e8f4ff;
}

.pm-ss-opt.is-disabled {
    color: #98a2b3;
    cursor: default;
}

.pm-ss-empty {
    padding: 8px;
    color: var(--pm-muted);
    font-weight: 700;
    text-align: center;
}

body.mm-app #page-wrapper .pm-page select.pm-ss-native,
body.mm-app #page-wrapper .pm-throw select.pm-ss-native,
body.mm-app #page-wrapper select.pm-ss-native,
body.pm-login select.pm-ss-native,
.pm-lang-form select.pm-ss-native {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    min-height: 0 !important;
    max-height: 1px !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: hidden !important;
    border: 0 !important;
    opacity: 0 !important;
    pointer-events: none !important;
    appearance: none !important;
    background: transparent !important;
    background-image: none !important;
    box-shadow: none !important;
    clip: rect(0, 0, 0, 0) !important;
}

body.mm-dark .pm-ss-btn,
body.mm-dark .pm-ss-search,
body.mm-dark.mm-app #page-wrapper input.pm-ss-search[type="search"] {
    background: #151521 !important;
    border-color: #3f3f5a !important;
    color: #e4e6ef !important;
}

body.mm-dark .pm-ss-btn[aria-expanded="true"],
body.mm-dark .pm-ss-search:focus {
    border-color: #009ef7;
    box-shadow: 0 0 0 3px rgba(0, 158, 247, 0.22);
}

body.mm-dark .pm-ss-caret {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 14 14'%3E%3Cpath fill='none' stroke='%23e4e6ef' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round' d='M3 5.2l4 4 4-4'/%3E%3C/svg%3E");
}

body.mm-dark .pm-ss-panel {
    background: #1e1e2d;
    border-color: #2b2b40;
    box-shadow: 0 12px 32px rgba(0, 0, 0, 0.35);
}

body.mm-dark .pm-ss-opt {
    color: #e4e6ef;
}

body.mm-dark .pm-ss-opt.is-active,
body.mm-dark .pm-ss-opt:hover,
body.mm-dark .pm-ss-opt.is-chosen {
    background: #2b2b40;
    color: #fff;
}

body.mm-dark .pm-ss-group,
body.mm-dark .pm-ss-empty {
    color: #a1a5b7;
}

.pm-table-search { width: min(280px, 46vw); }

.pm-customer-actions { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 12px; }

.pm-customer-chip {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    margin-bottom: 12px;
    padding: 8px 12px;
    border-radius: 10px;
    background: rgba(37, 109, 133, 0.1);
    color: var(--pm-navy, #16324f);
    font-weight: 700;
}

.pm-customer-chip[hidden] { display: none !important; }

.pm-map-tools { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 8px; }

.pm-map {
    height: 280px;
    border-radius: 12px;
    border: 1px solid var(--pm-border, #d8e0e8);
    background: #e7eef4;
    overflow: hidden;
    position: relative;
    z-index: 0;
}

.pm-map iframe { width: 100%; height: 100%; border: 0; display: block; }

.pm-map-note { margin: 8px 0 0; color: var(--pm-muted); font-size: 13px; }

.pm-pick-list {
    max-height: 380px;
    overflow: auto;
    border: 1px solid var(--pm-border, #e4e7ec);
    border-radius: 12px;
    background: #fff;
}

.pm-pick-row {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 2px;
    width: 100%;
    text-align: start;
    border: 0;
    border-bottom: 1px solid var(--pm-border, #e4e7ec);
    background: #fff;
    padding: 10px 12px;
    cursor: pointer;
}

.pm-pick-row strong { font-weight: 700; }
.pm-pick-row small { color: var(--pm-muted); }
.pm-pick-row:hover,
.pm-pick-row:focus { background: #f3f8fb; }

.pm-pick-row[hidden],
tr[hidden] { display: none !important; }

.pm-popup-wide .pm-throw-sheet {
    width: min(820px, 100%);
    max-height: min(920px, calc(100vh - 32px));
}

.pm-popup-list .pm-throw-sheet { width: min(640px, 100%); }

.pac-container { z-index: 3000 !important; }

body.mm-dark .pm-pick-list,
body.mm-dark .pm-pick-row {
    background: #1e1e2d;
    color: #e4e6ef;
    border-color: #2b2b40;
}

body.mm-dark .pm-pick-row:hover,
body.mm-dark .pm-pick-row:focus { background: #2b2b40; color: #fff; }

body.mm-dark .pm-customer-chip {
    background: rgba(0, 158, 247, 0.16);
    color: #e4e6ef;
}

body.mm-dark .pm-map { background: #151521; border-color: #3f3f5a; }

@media (max-width: 768px) {
    .pm-map { height: 220px; }
    .pm-table-search { width: min(220px, 42vw); }
}