:root {
    --bg-body: #f5f5f7;
    --bg-card: #ffffff;
    --text-main: #1d1d1f;
    --text-muted: #86868b;
    --accent-blue: #0066cc;
    --border-color: #d2d2d7;
    --success: #34c759;
    --danger: #ff3b30;
}

* {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
    font-family: 'Cairo', sans-serif;
}

body {
    background-color: var(--bg-body);
    color: var(--text-main);
    min-height: 100vh;
    direction: rtl;
}

.navbar {
    background: rgba(255, 255, 255, 0.85);
    backdrop-filter: blur(20px);
    border-bottom: 1px solid var(--border-color);
    position: sticky;
    top: 0;
    z-index: 100;
    padding: 15px 0;
}

.nav-container {
    max-width: 1300px;
    margin: 0 auto;
    padding: 0 20px;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.brand {
    display: flex;
    align-items: center;
    gap: 10px;
    font-size: 18px;
}

.badge-stat {
    background: #e8e8ed;
    padding: 6px 14px;
    border-radius: 20px;
    font-size: 13px;
}

.nav-stats {
    flex-wrap: wrap;
    justify-content: flex-end;
}

.main-content {
    max-width: 1300px;
    margin: 25px auto;
    padding: 0 20px;
}

.admin-dashboard {
    max-width: 1100px;
}

.admin-welcome {
    margin-bottom: 22px;
    padding: 30px;
    border-radius: 18px;
    background: linear-gradient(135deg, #173b35, #24564c);
    color: #fff;
}

.admin-eyebrow {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 10px;
    color: #c5f3dc;
    font-size: 13px;
    font-weight: 700;
}

.admin-welcome h1 {
    margin-bottom: 4px;
    font-size: 28px;
}

.admin-welcome p {
    color: #e1eee9;
}

.admin-tools {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 310px), 1fr));
    gap: 14px;
}

.admin-tool-card {
    display: flex;
    align-items: center;
    gap: 15px;
    min-height: 116px;
    padding: 18px;
    border: 1px solid var(--border-color);
    border-radius: 14px;
    background: var(--bg-card);
    color: var(--text-main);
    text-decoration: none;
    box-shadow: 0 4px 14px rgba(29, 29, 31, .04);
}

a.admin-tool-card {
    transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}

a.admin-tool-card:hover {
    transform: translateY(-2px);
    border-color: #8ab9ac;
    box-shadow: 0 10px 24px rgba(23, 59, 53, .1);
}

.admin-tool-icon {
    display: grid;
    flex: 0 0 48px;
    width: 48px;
    height: 48px;
    place-items: center;
    border-radius: 13px;
    background: #e8f3ef;
    color: #205849;
    font-size: 20px;
}

.admin-tool-copy {
    display: grid;
    flex: 1;
    gap: 4px;
}

.admin-tool-copy strong {
    font-size: 16px;
}

.admin-tool-copy span {
    color: var(--text-muted);
    font-size: 13px;
    line-height: 1.7;
}

.admin-tool-arrow {
    color: #8b9691;
}

.admin-backup-card {
    cursor: default;
}

.admin-access-message {
    max-width: 1100px;
    margin: 30px auto;
    padding: 20px;
    text-align: center;
    color: var(--text-muted);
}

.admin-access-message[hidden] {
    display: none;
}

@media (max-width: 700px) {
    .admin-welcome {
        padding: 23px;
    }

    .admin-welcome h1 {
        font-size: 24px;
    }

    .admin-tool-card {
        min-height: 104px;
        padding: 15px;
    }
}

.pos-hero {
    margin-bottom: 25px;
}

.scanner-card-apple {
    background: linear-gradient(135deg, #1d1d1f 0%, #2c2c2e 100%);
    color: #fff;
    padding: 30px;
    border-radius: 20px;
    text-align: center;
    box-shadow: 0 10px 30px rgba(0,0,0,0.1);
}

.scanner-icon {
    font-size: 36px;
    color: var(--success);
    margin-bottom: 10px;
}

.scanner-card-apple h2 {
    font-size: 22px;
    margin-bottom: 5px;
}

.scanner-card-apple p {
    color: var(--text-muted);
    font-size: 13px;
    margin-bottom: 20px;
}

.barcode-input-wrapper {
    display: flex;
    gap: 10px;
    max-width: 700px;
    margin: 0 auto;
}

.barcode-input-wrapper input {
    flex: 1;
    background: rgba(255,255,255,0.1);
    border: 1px solid rgba(255,255,255,0.2);
    padding: 14px 20px;
    border-radius: 12px;
    font-size: 16px;
    color: #fff;
    outline: none;
    text-align: center;
    transition: 0.2s;
}

.barcode-input-wrapper input:focus {
    border-color: var(--success);
    background: rgba(255,255,255,0.15);
}

.scanner-card-apple .scanner-status {
    margin: 10px 0 0;
    color: #a8f0bd;
}

.scanner-card-apple .scanner-status-error {
    color: #ffb4ad;
}

.btn-checkout {
    background: var(--success);
    color: #fff;
    border: none;
    padding: 0 25px;
    border-radius: 12px;
    font-weight: 600;
    cursor: pointer;
    transition: 0.2s;
}
.btn-checkout:hover { opacity: 0.9; }

.pos-grid {
    display: grid;
    grid-template-columns: 2fr 1fr;
    gap: 20px;
}

@media(max-width: 900px) {
    .pos-grid { grid-template-columns: 1fr; }
}

.table-card, .cart-card {
    background: var(--bg-card);
    border: 1px solid var(--border-color);
    border-radius: 16px;
    padding: 20px;
    box-shadow: 0 4px 20px rgba(0,0,0,0.02);
}

.section-title {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 15px;
    padding-bottom: 10px;
    border-bottom: 1px solid var(--border-color);
}

.section-title h3 {
    font-size: 15px;
    display: flex;
    gap: 8px;
    align-items: center;
}

.tradeline-table {
    width: 100%;
    border-collapse: collapse;
    text-align: right;
}

.tradeline-table th, .tradeline-table td {
    padding: 12px 10px;
    border-bottom: 1px solid var(--border-color);
    font-size: 13px;
}

.tradeline-table th {
    color: var(--text-muted);
    font-weight: 600;
}

.btn-sm-sell {
    background: var(--accent-blue);
    color: #fff;
    border: none;
    padding: 5px 12px;
    border-radius: 6px;
    cursor: pointer;
    font-size: 12px;
}
.btn-sm-sell:hover { background: #0051a8; }

.cart-items-list {
    min-height: 200px;
    max-height: 300px;
    overflow-y: auto;
    margin-bottom: 15px;
}

.empty-cart {
    text-align: center;
    color: var(--text-muted);
    padding: 40px 0;
    font-size: 13px;
}

.cart-item-row {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 8px 0;
    border-bottom: 1px dashed var(--border-color);
    font-size: 13px;
}

.cart-summary {
    border-top: 1px solid var(--border-color);
    padding-top: 15px;
}

.payment-panel {
    max-width: 460px;
}

.payment-options {
    display: grid;
    gap: 10px;
    margin: 18px 0;
    padding: 0;
    border: 0;
}

.payment-options legend {
    margin-bottom: 9px;
    font-size: 13px;
    font-weight: 700;
}

.payment-option {
    display: flex;
    align-items: center;
    min-height: 52px;
    padding: 10px 13px;
    border: 1px solid var(--border-color);
    border-radius: 10px;
    cursor: pointer;
}

.payment-option:has(input:checked) {
    border-color: var(--accent-blue);
    background: #f0f7ff;
}

.payment-option input {
    margin-left: 10px;
    accent-color: var(--accent-blue);
}

.payment-option span {
    display: flex;
    align-items: center;
    gap: 9px;
    font-weight: 600;
}

.payment-actions {
    display: flex;
    gap: 10px;
}

.payment-actions button {
    flex: 1;
}

.payment-cancel-button {
    min-height: 44px;
    padding: 9px 16px;
    border: 1px solid var(--border-color);
    border-radius: 10px;
    background: #fff;
    color: var(--text-main);
    cursor: pointer;
}

.customer-details {
    display: grid;
    gap: 6px;
    margin: 14px 0;
    padding: 12px;
    border: 1px solid var(--border-color);
    border-radius: 10px;
}

.customer-details legend {
    padding: 0 5px;
    font-size: 13px;
    font-weight: 700;
}

.customer-details legend span {
    color: var(--text-muted);
    font-size: 11px;
    font-weight: 400;
}

.customer-details label {
    font-size: 12px;
    font-weight: 600;
}

.customer-details input {
    width: 100%;
    min-height: 38px;
    padding: 8px 10px;
    border: 1px solid var(--border-color);
    border-radius: 7px;
}

.customer-lookup-status {
    font-size: 12px;
    color: var(--text-muted);
    background: #f4f4f5;
    border-radius: 6px;
    padding: 6px 8px;
}

.customer-profile-card {
    border: 1px solid #d1e7dd;
    background: #f2fbf6;
    border-radius: 9px;
    padding: 10px;
    display: grid;
    gap: 8px;
}

.customer-profile-head {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 14px;
    color: var(--success);
}

.customer-profile-stats {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(90px, 1fr));
    gap: 8px;
}

.customer-profile-stat {
    display: grid;
    gap: 2px;
    background: #ffffff;
    border: 1px solid #e3efe9;
    border-radius: 7px;
    padding: 6px 8px;
}

.customer-profile-stat span {
    font-size: 11px;
    color: var(--text-muted);
}

.customer-profile-stat strong {
    font-size: 13px;
}

.summary-row {
    display: flex;
    justify-content: space-between;
    font-size: 16px;
    margin-bottom: 15px;
}

.btn-primary-apple {
    width: 100%;
    background: var(--accent-blue);
    color: #fff;
    border: none;
    padding: 12px;
    border-radius: 12px;
    font-weight: 600;
    cursor: pointer;
    transition: 0.2s;
}

.btn-primary-apple:disabled {
    background: var(--border-color);
    cursor: not-allowed;
}

.btn-text-danger {
    background: none;
    border: none;
    color: var(--danger);
    cursor: pointer;
    font-size: 12px;
}

.btn-returns {
    margin-top: 14px;
    padding: 9px 16px;
    border: 1px solid rgba(255,255,255,.3);
    border-radius: 10px;
    background: transparent;
    color: #fff;
    font-weight: 600;
    cursor: pointer;
}

.daily-report .section-title {
    align-items: center;
    flex-wrap: wrap;
    gap: 14px;
}

.daily-report .section-title h1 {
    font-size: 21px;
}

.report-date-form {
    display: flex;
    align-items: center;
    gap: 9px;
}

.report-date-form input {
    min-height: 40px;
    padding: 6px 10px;
    border: 1px solid var(--border-color);
    border-radius: 8px;
}

.report-date-form .btn-checkout {
    min-height: 40px;
}

.report-status {
    margin: 10px 0 18px;
    color: var(--text-muted);
}

.report-status.error {
    color: var(--danger);
}

.report-summary {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(145px, 1fr));
    gap: 12px;
    margin: 18px 0 28px;
}

.report-summary article {
    display: grid;
    gap: 6px;
    padding: 15px;
    border: 1px solid var(--border-color);
    border-radius: 12px;
    background: #fafafa;
}

.report-summary article span,
.report-record-meta {
    color: var(--text-muted);
    font-size: 13px;
}

.report-summary article strong {
    font-size: 18px;
}

.report-section-heading {
    margin: 24px 0 12px;
    font-size: 17px;
}

.report-records {
    display: grid;
    gap: 10px;
}

.report-record {
    padding: 14px 16px;
    border: 1px solid var(--border-color);
    border-radius: 10px;
}

.report-record h3 {
    overflow-wrap: anywhere;
    font-size: 15px;
}

.report-record-heading {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
}

.report-operation-type {
    flex: 0 0 auto;
    padding: 3px 11px;
    border-radius: 999px;
    font-size: 12px;
    font-weight: 700;
}

.report-operation-type.refund {
    color: #9a3412;
    background: #ffedd5;
}

.report-operation-type.exchange {
    color: #166534;
    background: #dcfce7;
}

.report-record-meta,
.report-record-items {
    margin-top: 6px;
}

.report-record-items {
    font-size: 13px;
    line-height: 1.8;
}

.report-record-total {
    display: block;
    margin-top: 8px;
}

.report-empty {
    padding: 14px;
    color: var(--text-muted);
    text-align: center;
}

.report-nav-link {
    padding: 8px 15px;
    background: #1d1d1f;
    text-decoration: none;
}

@media(max-width: 700px) {
    .report-date-form {
        width: 100%;
        flex-wrap: wrap;
    }

    .report-date-form input {
        flex: 1;
    }
}

.returns-overlay[hidden],
#returnSaleDetails[hidden],
#completeReturnForm[hidden] {
    display: none;
}

.returns-overlay {
    position: fixed;
    inset: 0;
    z-index: 1000;
    display: grid;
    place-items: center;
    padding: 18px;
    background: rgba(12,18,27,.72);
    overflow-y: auto;
}

.returns-panel {
    width: min(100%, 620px);
    max-height: calc(100vh - 36px);
    overflow-y: auto;
    padding: 22px;
    border-radius: 16px;
    background: var(--bg-card);
    box-shadow: 0 20px 60px rgba(0,0,0,.25);
}

.returns-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.returns-header h2 {
    font-size: 20px;
}

.returns-close {
    border: 0;
    background: none;
    color: var(--text-muted);
    font-size: 28px;
    cursor: pointer;
}

.returns-help,
.returns-status {
    margin: 8px 0 16px;
    color: var(--text-muted);
    font-size: 13px;
}

.returns-lookup label,
.returns-exchange label {
    display: block;
    margin: 10px 0 5px;
    font-size: 13px;
    font-weight: 600;
}

.returns-lookup > div {
    display: flex;
    gap: 8px;
}

.returns-lookup input,
.returns-exchange input,
.returns-exchange select {
    width: 100%;
    min-width: 0;
    padding: 10px 12px;
    border: 1px solid var(--border-color);
    border-radius: 8px;
    background: #fff;
    color: var(--text-main);
}

.customer-workbook-button {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    padding: 7px 11px;
    border: 1px solid #cbd9d5;
    border-radius: 9px;
    background: #f5faf8;
    color: #174f4b;
    font: inherit;
    font-size: 12px;
    font-weight: 700;
    cursor: pointer;
}

.customer-workbook-button:hover {
    background: #e8f3ef;
}

.customer-workbook-button:disabled {
    cursor: wait;
    opacity: .65;
}

.customer-workbook-status {
    width: min(1200px, calc(100% - 40px));
    margin: 10px auto 0;
    color: #475467;
    font-size: 12px;
}

.customer-workbook-status[data-state="connected"] {
    color: #176b52;
}

.customer-workbook-status[data-state="error"] {
    color: #b42318;
}

.returns-lookup .btn-checkout {
    min-height: 42px;
}

.returns-details {
    margin: 16px 0 8px;
    padding: 10px;
    border-radius: 8px;
    background: var(--bg-body);
    font-size: 13px;
    overflow-wrap: anywhere;
}

.returns-items {
    display: grid;
    gap: 8px;
    margin: 12px 0;
}

.return-item {
    display: grid;
    grid-template-columns: 1fr 100px;
    align-items: center;
    gap: 12px;
    padding: 10px 0;
    border-bottom: 1px solid var(--border-color);
    font-size: 13px;
}

.return-item input {
    width: 100%;
    padding: 8px;
    border: 1px solid var(--border-color);
    border-radius: 7px;
}

.returns-exchange {
    margin: 16px 0;
    padding: 14px;
    border: 1px solid var(--border-color);
    border-radius: 10px;
}

.returns-exchange h3 {
    font-size: 15px;
}

.returns-settlement {
    margin: 12px 0;
    font-weight: 700;
}

.returns-status:empty {
    display: none;
}

.maintenance-nav-links {
    display: flex;
    align-items: center;
    gap: 9px;
    flex-wrap: wrap;
}

.maintenance-nav-links a {
    padding: 8px 13px;
    background: #1d1d1f;
    text-decoration: none;
}

.maintenance-page {
    max-width: 1450px;
}

.maintenance-hero {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
    margin-bottom: 20px;
    padding: 28px 32px;
    border-radius: 18px;
    background: linear-gradient(125deg, #162f35, #1f5c58);
    color: #fff;
    box-shadow: 0 12px 30px rgba(20, 58, 56, .14);
}

.maintenance-hero h1 {
    margin: 5px 0;
    font-size: clamp(22px, 3vw, 30px);
}

.maintenance-hero p {
    color: #d9e7e5;
    font-size: 14px;
}

.maintenance-eyebrow {
    display: inline-block;
    color: #92d6bd;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 2px;
    direction: ltr;
}

.maintenance-local-note {
    flex: 0 0 auto;
    padding: 10px 13px;
    border: 1px solid rgba(255,255,255,.25);
    border-radius: 10px;
    color: #e2f2eb;
    font-size: 12px;
}

.maintenance-stats {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 12px;
    margin-bottom: 20px;
}

.maintenance-stats article {
    display: flex;
    flex-direction: column;
    gap: 4px;
    padding: 15px 18px;
    border: 1px solid var(--border-color);
    border-radius: 13px;
    background: #fff;
}

.maintenance-stats span {
    color: var(--text-muted);
    font-size: 12px;
}

.maintenance-stats strong {
    color: #174f4b;
    font-size: 23px;
}

.maintenance-layout {
    display: grid;
    grid-template-columns: minmax(0, 1.1fr) minmax(340px, .9fr);
    align-items: start;
    gap: 18px;
}

.maintenance-form,
.maintenance-list-card {
    min-width: 0;
}

.maintenance-form .section-title h2,
.maintenance-list-card .section-title h2 {
    display: flex;
    align-items: center;
    gap: 9px;
    font-size: 17px;
}

.maintenance-form-section {
    margin: 20px 0 12px;
    padding-bottom: 7px;
    border-bottom: 1px solid #e7e9ed;
    color: #245b57;
    font-size: 14px;
}

.maintenance-fields {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
}

.maintenance-fields label {
    display: flex;
    flex-direction: column;
    gap: 5px;
    color: #3d444b;
    font-size: 12px;
    font-weight: 600;
}

.maintenance-fields input,
.maintenance-fields select,
.maintenance-fields textarea,
.maintenance-filters input,
.maintenance-filters select,
.maintenance-record-controls select {
    width: 100%;
    min-height: 40px;
    padding: 8px 10px;
    border: 1px solid var(--border-color);
    border-radius: 8px;
    background: #fff;
    color: var(--text-main);
    font-size: 13px;
}

.maintenance-fields textarea {
    resize: vertical;
}

.maintenance-wide {
    grid-column: 1 / -1;
}

.maintenance-balance {
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 3px;
    padding: 8px 11px;
    border: 1px solid #cde6dc;
    border-radius: 8px;
    background: #f0faf5;
}

.maintenance-balance span {
    color: var(--text-muted);
    font-size: 11px;
}

.maintenance-balance strong {
    color: #176b52;
    font-size: 16px;
}

.maintenance-save {
    margin-top: 16px;
}

.maintenance-message {
    margin-top: 12px;
    padding: 10px 12px;
    border-radius: 8px;
    background: #fff1f0;
    color: #b42318;
    font-size: 13px;
}

.maintenance-message[hidden] {
    display: none;
}

.maintenance-filters {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 175px;
    gap: 9px;
    margin-bottom: 14px;
}

.maintenance-search {
    display: flex;
    align-items: center;
    gap: 8px;
    padding-inline: 10px;
    border: 1px solid var(--border-color);
    border-radius: 8px;
    color: var(--text-muted);
}

.maintenance-search input {
    border: 0;
    outline: 0;
}

.maintenance-records {
    display: grid;
    gap: 11px;
}

.maintenance-record {
    padding: 14px;
    border: 1px solid #e2e5e9;
    border-radius: 12px;
    background: #fcfcfd;
}

.maintenance-record-heading {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 10px;
    margin-bottom: 8px;
}

.maintenance-record h3 {
    margin-bottom: 5px;
    font-size: 15px;
}

.maintenance-record p {
    margin: 3px 0;
    color: #4f5863;
    font-size: 12px;
    overflow-wrap: anywhere;
}

.maintenance-record-meta {
    color: #176b52 !important;
    font-weight: 700;
}

.maintenance-status {
    padding: 4px 9px;
    border-radius: 999px;
    background: #edf2f7;
    color: #344054;
    font-size: 10px;
    white-space: nowrap;
}

.status-ready,
.status-delivered {
    background: #e7f7ed;
    color: #176b3a;
}

.status-awaiting_approval,
.status-awaiting_parts {
    background: #fff5df;
    color: #895b00;
}

.status-cancelled {
    background: #fff0ef;
    color: #b42318;
}

.maintenance-record-controls {
    display: grid;
    grid-template-columns: minmax(120px, 1fr) auto;
    gap: 7px;
    margin-top: 11px;
}

.maintenance-print-actions {
    display: grid;
    grid-column: 1 / -1;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 7px;
}

.maintenance-action {
    min-height: 38px;
    padding: 6px 10px;
    border: 1px solid #d6dcdf;
    border-radius: 8px;
    background: #fff;
    color: #1d4744;
    cursor: pointer;
    font-size: 11px;
    font-weight: 600;
}

.maintenance-action:hover {
    background: #eef7f4;
}

.maintenance-action:disabled {
    background: #f3f5f6;
    color: #88939a;
    cursor: not-allowed;
}

.maintenance-action:disabled:hover {
    background: #f3f5f6;
}

.maintenance-empty {
    padding: 25px 10px;
    color: var(--text-muted);
    text-align: center;
}

.maintenance-print {
    display: none;
}

/* تنسيق طباعة الفاتورة الحرارية */
.hidden-receipt {
    display: none;
}

@page daily-statement {
    size: A4 portrait;
    margin: 12mm;
}

@page maintenance-invoice {
    size: A4 portrait;
    margin: 12mm;
}

@media print {
    body * {
        visibility: hidden;
    }
    body.print-receipt #thermalReceipt,
    body.print-receipt #thermalReceipt * {
        visibility: visible;
    }
    body.print-statement #dailySalesPrint,
    body.print-statement #dailySalesPrint * {
        visibility: visible;
    }
    body.print-maintenance #maintenancePrint,
    body.print-maintenance #maintenancePrint * {
        visibility: visible;
    }
    body.print-receipt #thermalReceipt,
    body.print-statement #dailySalesPrint,
    body.print-maintenance #maintenancePrint {
        display: block !important;
    }
    #thermalReceipt {
        display: none;
        position: absolute;
        left: 0;
        top: 0;
        width: 80mm;
        padding: 5mm;
        background: #ffffff;
        color: #000000;
        direction: rtl;
        font-family: 'Cairo', sans-serif;
        font-size: 12px;
        line-height: 1.4;
    }
    #dailySalesPrint {
        display: none;
        position: absolute;
        inset: 0;
        width: 100%;
        min-height: 270mm;
        padding: 0;
        background: #ffffff;
        color: #17212b;
        direction: rtl;
        font-family: 'Cairo', sans-serif;
        font-size: 10pt;
        line-height: 1.6;
        page: daily-statement;
        -webkit-print-color-adjust: exact;
        print-color-adjust: exact;
    }
    #maintenancePrint {
        display: none;
        position: absolute;
        inset: 0;
        width: 100%;
        min-height: 270mm;
        padding: 8mm;
        background: #fff;
        color: #17212b;
        direction: rtl;
        font-family: 'Cairo', sans-serif;
        font-size: 10pt;
        line-height: 1.6;
        page: maintenance-invoice;
        -webkit-print-color-adjust: exact;
        print-color-adjust: exact;
    }
    .maintenance-invoice-header {
        display: flex;
        align-items: center;
        justify-content: center;
        gap: 4mm;
        padding-bottom: 4mm;
        border-bottom: 2px solid #1f5c58;
        color: #174f4b;
    }
    .maintenance-invoice-header > div {
        display: flex;
        flex-direction: column;
        text-align: center;
    }
    .maintenance-invoice-header strong {
        font-size: 18pt;
        letter-spacing: 2px;
    }
    .maintenance-invoice-mark {
        font-size: 25pt;
    }
    .maintenance-invoice-title {
        margin: 5mm 0 1mm;
        color: #17212b;
        text-align: center;
        font-size: 17pt;
    }
    .maintenance-invoice-ticket,
    .maintenance-invoice-date {
        margin: 1mm 0;
        color: #52616b;
        text-align: center;
        font-size: 9pt;
    }
    .maintenance-invoice-section {
        margin-top: 5mm;
        break-inside: avoid;
    }
    .maintenance-invoice-section h2,
    .maintenance-invoice-terms h2 {
        padding: 2mm 3mm;
        border-right: 3px solid #1f766c;
        background: #f0f6f5;
        color: #174f4b;
        font-size: 11pt;
    }
    .maintenance-invoice-section table {
        width: 100%;
        border-collapse: collapse;
    }
    .maintenance-invoice-section th,
    .maintenance-invoice-section td {
        padding: 2mm 3mm;
        border-bottom: 1px solid #e5eaee;
        text-align: right;
        vertical-align: top;
        font-size: 9pt;
        overflow-wrap: anywhere;
    }
    .maintenance-invoice-section th {
        width: 34%;
        color: #52616b;
    }
    .maintenance-invoice-terms {
        margin-top: 6mm;
        color: #52616b;
        font-size: 8pt;
    }
    .maintenance-invoice-terms p {
        margin-top: 2mm;
    }
    .maintenance-signatures {
        display: flex;
        flex: 1;
        justify-content: space-between;
        gap: 12mm;
        margin: 0;
        padding-top: 4mm;
        border-top: 1px dashed #9aa6ad;
        color: #344054;
        font-size: 9pt;
    }
    .maintenance-invoice-footer {
        display: flex;
        justify-content: space-between;
        align-items: flex-end;
        gap: 8mm;
        margin-top: 10mm;
        break-inside: avoid;
    }
    .maintenance-warranty-stamp {
        display: block;
        width: 40mm;
        height: 40mm;
        flex: 0 0 40mm;
        color: #0754a6;
        opacity: .88;
        transform: rotate(-7deg);
        -webkit-print-color-adjust: exact;
        print-color-adjust: exact;
    }
    .warranty-stamp-outer,
    .warranty-stamp-inner,
    .warranty-stamp-center-ring {
        fill: none;
        stroke: currentColor;
    }
    .warranty-stamp-outer { stroke: currentColor; stroke-width: 3.8; stroke-dasharray: 558 2 108 4; }
    .warranty-stamp-inner { stroke: currentColor; stroke-width: 1.7; }
    .warranty-stamp-center-ring { stroke: currentColor; stroke-width: 1.5; stroke-dasharray: 198 2 206 3; }
    .warranty-stamp-brand,
    .warranty-stamp-service,
    .warranty-stamp-approved,
    .warranty-stamp-subtitle,
    .warranty-stamp-center-brand,
    .warranty-stamp-star {
        fill: currentColor;
    }
    .warranty-stamp-brand { font: 700 12px Arial, sans-serif; letter-spacing: 1.2px; }
    .warranty-stamp-service { font: 700 12px Tahoma, Arial, sans-serif; }
    .warranty-stamp-center-brand { font: 700 18px Arial, sans-serif; letter-spacing: 2px; }
    .warranty-stamp-approved { font: 700 18px Tahoma, Arial, sans-serif; }
    .warranty-stamp-subtitle { font: 700 11px Tahoma, Arial, sans-serif; }
    .warranty-stamp-divider { fill: none; stroke: currentColor; stroke-width: 1.4; stroke-dasharray: 52 2 10 2; }
    .warranty-stamp-star { opacity: .86; }
    .receipt-header {
        text-align: center;
        margin-bottom: 5px;
    }
    .receipt-header h2 {
        font-size: 16px;
        font-weight: 700;
        margin: 2px 0;
    }
    .receipt-header p {
        font-size: 11px;
        color: #333;
        margin: 0;
    }
    .receipt-info-text {
        font-size: 10px !important;
    }
    .receipt-divider {
        text-align: center;
        font-family: monospace;
        font-size: 11px;
        letter-spacing: -1px;
        margin: 4px 0;
        color: #555;
    }
    .receipt-meta {
        font-size: 11px;
        margin-bottom: 4px;
    }
    .customer-details {
        display: none;
    }
    .receipt-operation-title {
        margin: 5px 0;
        padding: 4px;
        border: 1px dashed #000;
        text-align: center;
        font-size: 14px;
        font-weight: 700;
    }
    .receipt-settlement {
        margin-top: 5px;
        padding: 5px 3px;
        border-top: 1px dashed #000;
        border-bottom: 1px dashed #000;
        text-align: center;
        font-size: 12px;
        font-weight: 700;
    }
    .receipt-table {
        width: 100%;
        border-collapse: collapse;
        font-size: 11px;
        margin: 5px 0;
    }
    .receipt-table th {
        border-bottom: 1px solid #000;
        padding-bottom: 3px;
        font-weight: 600;
    }
    .receipt-table td {
        padding: 4px 0;
    }
    .receipt-totals {
        margin-top: 5px;
    }
    .total-row {
        display: flex;
        justify-content: space-between;
        font-size: 14px;
        font-weight: bold;
    }
    .receipt-footer {
        text-align: center;
        font-size: 11px;
        margin-top: 8px;
    }
    .receipt-footer p {
        margin: 2px 0;
    }
    .statement-header {
        display: grid;
        grid-template-columns: 1fr 1.5fr 1fr;
        align-items: center;
        gap: 12px;
        min-height: 38mm;
        padding: 8mm;
        border-radius: 5mm;
        background: #102a43;
        color: #fff;
    }
    .statement-brand {
        display: flex;
        align-items: center;
        gap: 9px;
        direction: ltr;
    }
    .statement-brand-mark {
        display: grid;
        width: 12mm;
        height: 12mm;
        place-items: center;
        border: 1px solid rgba(255,255,255,.55);
        border-radius: 50%;
        font-size: 20pt;
    }
    .statement-brand strong,
    .statement-brand span:not(.statement-brand-mark) {
        display: block;
        letter-spacing: 1.5px;
    }
    .statement-brand strong {
        font-size: 13pt;
    }
    .statement-brand span:not(.statement-brand-mark) {
        color: #a9d8d3;
        font-size: 8pt;
    }
    .statement-title {
        text-align: center;
    }
    .statement-title p {
        margin: 0;
        color: #a9d8d3;
        font-size: 9pt;
    }
    .statement-title h1 {
        margin: 2px 0;
        font-size: 19pt;
    }
    .statement-title span {
        color: #c7d5e0;
        direction: ltr;
        font-size: 7pt;
        letter-spacing: 1.2px;
    }
    .statement-date {
        display: grid;
        gap: 3px;
        justify-items: start;
        padding: 10px 12px;
        border: 1px solid rgba(255,255,255,.24);
        border-radius: 3mm;
        background: rgba(255,255,255,.08);
    }
    .statement-date span {
        color: #c7d5e0;
        font-size: 8pt;
    }
    .statement-date strong {
        font-size: 10pt;
    }
    .statement-meta {
        display: flex;
        justify-content: space-between;
        gap: 12px;
        margin: 5mm 0;
        padding-bottom: 3mm;
        border-bottom: 1px solid #dce4ea;
        color: #52616b;
        font-size: 8pt;
    }
    .statement-cards {
        display: grid;
        grid-template-columns: repeat(4, 1fr);
        gap: 3mm;
        margin: 4mm 0 7mm;
    }
    .statement-card {
        display: grid;
        gap: 2mm;
        min-height: 22mm;
        padding: 4mm;
        border: 1px solid #dce4ea;
        border-radius: 3mm;
    }
    .statement-card span {
        color: #52616b;
        font-size: 8pt;
    }
    .statement-card strong {
        font-size: 12pt;
    }
    .statement-card-positive {
        border-color: #b7e1d3;
        background: #effaf5;
        color: #176b52;
    }
    .statement-card-primary {
        border-color: #102a43;
        background: #eaf1f6;
        color: #102a43;
    }
    .statement-section-title {
        display: flex;
        align-items: center;
        justify-content: space-between;
        margin: 0 0 3mm;
    }
    .statement-section-title h2,
    .statement-settlement h2 {
        margin: 0;
        font-size: 12pt;
    }
    .statement-section-title span {
        color: #52616b;
        font-size: 8pt;
    }
    .statement-table {
        width: 100%;
        border-collapse: collapse;
        font-size: 8.5pt;
    }
    .statement-table thead {
        display: table-header-group;
    }
    .statement-table th {
        padding: 3mm 2.5mm;
        background: #eaf1f6;
        color: #102a43;
        text-align: right;
        font-size: 8pt;
    }
    .statement-table td {
        padding: 3mm 2.5mm;
        border-bottom: 1px solid #e5eaee;
        vertical-align: top;
    }
    .statement-table tr {
        break-inside: avoid;
    }
    .statement-index {
        width: 8mm;
        color: #72808b;
    }
    .statement-invoice-cell {
        min-width: 42mm;
        direction: ltr;
        text-align: right;
        overflow-wrap: anywhere;
    }
    .statement-invoice-cell strong,
    .statement-invoice-cell span {
        display: block;
    }
    .statement-invoice-cell span {
        margin-top: 1mm;
        color: #72808b;
        direction: rtl;
        font-size: 8pt;
    }
    .statement-invoice-cell .statement-customer {
        color: #176b52;
        overflow-wrap: anywhere;
    }
    .statement-items-cell {
        width: 52%;
    }
    .statement-item-line {
        display: flex;
        justify-content: space-between;
        gap: 5mm;
        padding: 1mm 0;
    }
    .statement-item-line + .statement-item-line {
        border-top: 1px dashed #e5eaee;
    }
    .statement-item-line small {
        flex: 0 0 auto;
        color: #52616b;
    }
    .statement-amount {
        white-space: nowrap;
        color: #102a43;
    }
    .statement-empty {
        padding: 12mm !important;
        color: #72808b;
        text-align: center;
    }
    .statement-settlement {
        width: 78mm;
        margin: 8mm 0 0 auto;
        padding: 4mm 5mm;
        border: 1px solid #dce4ea;
        border-radius: 3mm;
        background: #f7f9fb;
        break-inside: avoid;
    }
    .statement-settlement h2 {
        margin-bottom: 2mm;
    }
    .statement-settlement-row {
        display: flex;
        justify-content: space-between;
        gap: 8mm;
        padding: 1.5mm 0;
        font-size: 8.5pt;
    }
    .statement-net-row {
        margin-top: 2mm;
        padding-top: 3mm;
        border-top: 1px solid #c9d5de;
        color: #102a43;
        font-size: 11pt;
    }
    .statement-footer {
        display: flex;
        justify-content: space-between;
        margin-top: 10mm;
        padding-top: 3mm;
        border-top: 1px solid #dce4ea;
        color: #52616b;
        font-size: 8pt;
    }
    .statement-footer strong {
        color: #102a43;
        direction: ltr;
        letter-spacing: 1px;
    }
}

@media(max-width: 900px) {
    .maintenance-layout {
        grid-template-columns: 1fr;
    }
}

@media(max-width: 650px) {
    .maintenance-hero {
        align-items: flex-start;
        flex-direction: column;
        padding: 22px;
    }

    .maintenance-stats {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .maintenance-filters {
        grid-template-columns: 1fr;
    }

    .maintenance-record-controls {
        grid-template-columns: 1fr 1fr;
    }

    .maintenance-print-actions {
        grid-column: 1 / -1;
    }

    .maintenance-record-controls select {
        grid-column: 1 / -1;
    }

    .maintenance-nav .brand {
        margin-bottom: 10px;
    }

    .maintenance-nav {
        align-items: flex-start;
        flex-direction: column;
    }

    .maintenance-nav-links a {
        padding: 7px 9px;
        font-size: 11px;
    }
}