/* Production Hardening 06 — localization, direction, and shared component finish */
:root {
    --ui-radius-sm: 8px;
    --ui-radius-md: 12px;
    --ui-radius-lg: 18px;
    --ui-shadow-sm: 0 4px 14px rgba(15, 23, 42, .07);
    --ui-shadow-md: 0 14px 36px rgba(15, 23, 42, .11);
    --ui-focus: 0 0 0 3px color-mix(in srgb, var(--app-accent, #d99a22) 28%, transparent);
}

html[lang="ar"],
html[lang="ar"] body {
    font-family: "Cairo", "Noto Sans Arabic", "Segoe UI", Tahoma, sans-serif;
}

html[lang="en"],
html[lang="en"] body {
    font-family: Inter, "Segoe UI", Arial, sans-serif;
}

body {
    overflow-x: clip;
    text-align: start;
}

:where(p, span, strong, small, label, th, td, dt, dd, button, a, li, h1, h2, h3, h4, h5, h6) {
    overflow-wrap: anywhere;
}

:where(.btn, button, .form-control, .form-select, input, select, textarea) {
    min-height: 42px;
    border-radius: var(--ui-radius-sm);
}

:where(.btn, button):focus-visible,
:where(.form-control, .form-select, input, select, textarea):focus-visible {
    outline: 0;
    box-shadow: var(--ui-focus);
}

:where(.app-card, .admin-panel, .detail-tile, .property-search-panel, .market-card, .docs-card) {
    border-radius: var(--ui-radius-md);
    box-shadow: var(--ui-shadow-sm);
}

:where(.dropdown-menu, .popover, .modal-content, .offcanvas, .s7-layer-panel) {
    border-radius: var(--ui-radius-md);
    box-shadow: var(--ui-shadow-md);
}

:where(.table, table) {
    text-align: start;
}

:where(.table, table) :where(th, td) {
    text-align: start;
    vertical-align: middle;
}

.text-start { text-align: start !important; }
.text-end { text-align: end !important; }

[dir="rtl"] :where(.pagination, .breadcrumb, .form-form-actions, .wizard-actions) {
    direction: rtl;
}

[dir="rtl"] :where(
    [data-directional-icon],
    .pagination .ui-icon,
    .breadcrumb .ui-icon,
    [data-wizard-previous] .ui-icon,
    [data-wizard-next] .ui-icon
) {
    transform: scaleX(-1);
}

[dir="rtl"] :where(.input-group > :not(:first-child), .btn-group > :not(:first-child)) {
    margin-left: 0;
}

:where(input[type="email"], input[type="url"], input[type="tel"], [data-ltr], .bidi-ltr) {
    direction: ltr;
    text-align: start;
    unicode-bidi: plaintext;
}

:where([data-bidi-auto], .bidi-auto, td, dd, .toast-body, .alert) {
    unicode-bidi: plaintext;
}

.pagination {
    flex-wrap: wrap;
    gap: .25rem;
}

.pagination .page-link {
    display: inline-grid;
    min-width: 40px;
    min-height: 40px;
    place-items: center;
    border-radius: var(--ui-radius-sm) !important;
}

.badge,
.status-pill,
.admin-badge {
    border-radius: 999px;
    line-height: 1.25;
}

[data-bs-theme="dark"] {
    --ui-shadow-sm: 0 4px 16px rgba(0, 0, 0, .28);
    --ui-shadow-md: 0 18px 44px rgba(0, 0, 0, .38);
}

[data-bs-theme="dark"] :where(
    .text-secondary,
    .form-text,
    .section-kicker,
    .card-heading p,
    .metric-label,
    small
) {
    color: color-mix(in srgb, var(--app-text, #f8fafc) 74%, transparent) !important;
}

[data-bs-theme="dark"] :where(.form-control, .form-select, input, select, textarea) {
    color: var(--app-text, #f8fafc);
    background-color: color-mix(in srgb, var(--app-surface, #111827) 92%, #fff);
    border-color: color-mix(in srgb, var(--app-text, #f8fafc) 24%, transparent);
}

[data-bs-theme="dark"] :where(.form-control, input, textarea)::placeholder {
    color: color-mix(in srgb, var(--app-text, #f8fafc) 58%, transparent);
    opacity: 1;
}

[data-bs-theme="dark"] .btn-outline-secondary {
    color: color-mix(in srgb, var(--app-text, #f8fafc) 90%, transparent);
    border-color: color-mix(in srgb, var(--app-text, #f8fafc) 42%, transparent);
}

[data-bs-theme="dark"] .btn-warning {
    color: #17120a;
}

@media (max-width: 991.98px) {
    :where(.admin-filterbar, .search-filter-grid, .form-grid) {
        min-width: 0;
    }

    :where(.admin-table-wrap, .table-responsive) {
        max-width: 100%;
        overflow-x: auto;
        overscroll-behavior-inline: contain;
        -webkit-overflow-scrolling: touch;
    }
}

@media (max-width: 575.98px) {
    :where(.btn, button) {
        max-width: 100%;
        white-space: normal;
    }

    :where(.admin-card-action, .search-hero-actions, .wizard-actions, .form-form-actions) {
        display: flex;
        width: 100%;
        flex-wrap: wrap;
        gap: .5rem;
    }

    :where(.admin-card-action, .search-hero-actions, .wizard-actions, .form-form-actions) > * {
        flex: 1 1 140px;
    }
}

@media (prefers-reduced-motion: reduce) {
    *,
    *::before,
    *::after {
        scroll-behavior: auto !important;
        transition-duration: .01ms !important;
        animation-duration: .01ms !important;
        animation-iteration-count: 1 !important;
    }
}