@font-face {
    font-family: "IRANSans";
    src: url("/static/unfold/fonts/IRANSans.67dff2e092f4.ttf") format("truetype");
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

:root {
    --warehouse-accent: rgb(147 51 234);
    --warehouse-accent-soft: rgba(147, 51, 234, 0.12);
    --warehouse-border: rgba(148, 163, 184, 0.3);
}

html[lang="fa"],
html[dir="rtl"],
body,
body * {
    font-family: IRANSans, Inter, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

.material-symbols-outlined {
    font-family: "Material Symbols Outlined" !important;
}

.material-symbols-rounded {
    font-family: "Material Symbols Outlined" !important;
}

.material-symbols-sharp {
    font-family: "Material Symbols Outlined" !important;
}

.material-symbols-outlined,
.material-symbols-rounded,
.material-symbols-sharp,
.material-icons,
.material-icons-outlined,
.material-icons-round,
.material-icons-sharp,
.material-icons-two-tone {
    font-style: normal;
    font-weight: 400;
    line-height: 1;
    letter-spacing: normal;
    text-transform: none;
    white-space: nowrap;
    word-wrap: normal;
    direction: ltr;
    font-feature-settings: "liga";
    -webkit-font-feature-settings: "liga";
    -webkit-font-smoothing: antialiased;
    font-variation-settings: "FILL" 0, "wght" 400, "GRAD" 0, "opsz" 24;
}

html[lang="fa"],
html[dir="rtl"] {
    direction: rtl;
}

body {
    text-align: right;
}

caption,
th,
td,
label,
.help,
.errorlist,
fieldset h2,
fieldset legend {
    text-align: right !important;
}

#site-name {
    margin-inline: 0.625rem;
}

#logout-form > button,
.submit-row,
.object-tools,
.breadcrumbs,
.datetimeshortcuts,
.calendarbox,
.clockbox {
    direction: rtl;
}

#lines-heading,
#receipt_form > div > fieldset > h2,
#shipment_form > div > fieldset > h2,
#dispatchorder_form > div > fieldset > h2,
#transferorder_form > div > fieldset > h2,
#yearconfig_form > div > fieldset > h2,
#user_form > div > fieldset > h2 {
    background-color: var(--warehouse-accent);
    color: #fff;
}

#id_is_staff,
#id_is_active,
#id_active,
#id_is_verified,
#id_is_registered,
#id_is_superuser {
    margin-inline: 0.625rem;
}

#id_mobile_phone,
#id_landline_phone,
#id_username,
#id_password,
#id_password1,
#id_password2,
input[type="email"],
input[type="url"],
input[data-ltr="true"] {
    direction: ltr;
    text-align: left;
}

#user_form input[type="text"],
#user_form input[type="password"],
#user_form input[type="tel"],
#user_form input[type="number"],
#user_form input[type="email"],
#user_form input[type="url"],
#user_form input[type="search"],
#auth_user_form input[type="text"],
#auth_user_form input[type="password"],
#auth_user_form input[type="tel"],
#auth_user_form input[type="number"],
#auth_user_form input[type="email"],
#auth_user_form input[type="url"],
#auth_user_form input[type="search"] {
    width: min(28rem, 100%);
    border: 1px solid rgba(148, 163, 184, 0.45);
    border-radius: 0.75rem;
    padding: 0.65rem 0.75rem;
    background-color: rgba(255, 255, 255, 0.95);
    transition: border-color 0.2s ease, box-shadow 0.2s ease, background-color 0.2s ease;
    font-weight: 400;
    font-size: 0.95rem;
}

#user_form input:focus,
#auth_user_form input:focus,
#user_form textarea:focus,
#auth_user_form textarea:focus,
#user_form select:focus,
#auth_user_form select:focus {
    border-color: rgba(147, 51, 234, 0.6);
    box-shadow: 0 0 0 3px rgba(147, 51, 234, 0.18);
    outline: none;
}

.dark #user_form input[type="text"],
.dark #user_form input[type="password"],
.dark #user_form input[type="tel"],
.dark #user_form input[type="number"],
.dark #user_form input[type="email"],
.dark #user_form input[type="url"],
.dark #user_form input[type="search"],
.dark #auth_user_form input[type="text"],
.dark #auth_user_form input[type="password"],
.dark #auth_user_form input[type="tel"],
.dark #auth_user_form input[type="number"],
.dark #auth_user_form input[type="email"],
.dark #auth_user_form input[type="url"],
.dark #auth_user_form input[type="search"] {
    background-color: rgba(15, 23, 42, 0.55);
    border-color: rgba(148, 163, 184, 0.35);
    color: #f8fafc;
}

.dark #user_form input:focus,
.dark #auth_user_form input:focus,
.dark #user_form textarea:focus,
.dark #auth_user_form textarea:focus,
.dark #user_form select:focus,
.dark #auth_user_form select:focus {
    background-color: rgba(30, 41, 59, 0.75);
}

#group_form .selector,
#user_form .selector {
    max-width: 100% !important;
}

#nav-sidebar-apps,
#nav-sidebar-inner [data-simplebar] {
    margin: 10px;
}

#nav-sidebar-inner [data-simplebar] .simplebar-content {
    padding: 0 !important;
}

.sidebar-groups {
    margin: 0;
    padding: 0;
    list-style: none;
}

.sidebar-group__details {
    border: 1px solid var(--warehouse-border);
    border-radius: 0.75rem;
    background-color: rgba(148, 163, 184, 0.08);
    padding: 0.35rem 0.6rem;
    transition: border-color 0.2s ease, background-color 0.2s ease;
}

.dark .sidebar-group__details {
    border-color: rgba(51, 65, 85, 0.9);
    background-color: rgba(30, 41, 59, 0.45);
}

.sidebar-group__details[open] {
    background-color: var(--warehouse-accent-soft);
    border-color: rgba(147, 51, 234, 0.4);
}

.sidebar-group__summary {
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: space-between;
    font-weight: 500;
    padding: 0.35rem 0;
    gap: 0.75rem;
}

.sidebar-group__summary-content {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.sidebar-group__summary-icon {
    font-size: 1.35rem;
    opacity: 0.75;
}

.sidebar-group__details[open] .sidebar-group__summary-icon {
    opacity: 1;
}

.sidebar-group__caret {
    font-size: 1.3rem;
    transition: transform 0.2s ease, opacity 0.2s ease;
    opacity: 0.6;
}

.sidebar-group__details[open] .sidebar-group__caret {
    transform: rotate(180deg);
    opacity: 1;
}

.sidebar-group__items {
    list-style: none;
    margin: 0.25rem 0 0;
    padding: 0;
}

.sidebar-group__item + .sidebar-group__item {
    margin-top: 0.25rem;
}

.sidebar-group__link {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-direction: row-reverse;
    padding: 0.45rem 0.5rem;
    border-radius: 0.5rem;
    text-decoration: none;
    color: inherit;
    transition: background-color 0.2s ease, color 0.2s ease;
    gap: 0.5rem;
    text-align: right;
}

.sidebar-group__link:hover {
    background-color: rgba(147, 51, 234, 0.15);
}

.sidebar-group__link-text {
    flex: 1;
}

.sidebar-group__link-icon {
    font-size: 1.2rem;
    opacity: 0.6;
}

.sidebar-group__link.is-active {
    background-color: rgba(147, 51, 234, 0.25);
    color: #4c1d95;
    font-weight: 600;
}

.dark .sidebar-group__link.is-active {
    color: #ede9fe;
}

.sidebar-group__link.is-active .sidebar-group__link-icon {
    opacity: 1;
}

/*
 * Unfold 0.108 positions the changelist action bar with an inline `left`
 * style bound to the sidebar width.  The sidebar is on the right in our RTL
 * admin, so custom.js adds this class and keeps the offset on the right.
 */
html[dir="rtl"] .warehouse-rtl-actionbar {
    left: 0 !important;
    right: var(--warehouse-sidebar-offset, 0px) !important;
}

/* Keep dark-mode controls consistent after Unfold upgrade. */
html.dark input:not([type="checkbox"]):not([type="radio"]):not([type="submit"]):not([type="button"]):not([type="file"]),
html.dark select,
html.dark textarea,
html.dark .related-widget-wrapper select,
html.dark .vTextField,
html.dark .vLargeTextField,
html.dark .vURLField,
html.dark .vIntegerField,
html.dark .vDecimalField,
html.dark .vDateField,
html.dark .vTimeField,
html.dark .vDateTimeField {
    background-color: #0b1220 !important;
    color: #e2e8f0 !important;
    border-color: rgba(148, 163, 184, 0.35) !important;
}

html.dark input::placeholder,
html.dark textarea::placeholder {
    color: #94a3b8 !important;
}

html.dark .ts-wrapper.single .ts-control,
html.dark .ts-wrapper.multi .ts-control,
html.dark .ts-dropdown {
    background-color: #0b1220 !important;
    color: #e2e8f0 !important;
    border-color: rgba(148, 163, 184, 0.35) !important;
}

[dir="rtl"] .unfold-sidebar,
[dir="rtl"] .breadcrumbs,
[dir="rtl"] .submit-row,
[dir="rtl"] .object-tools,
[dir="rtl"] .flex.items-center.gap-2,
[dir="rtl"] .flex.items-center.justify-between {
    direction: rtl;
}

[dir="rtl"] .text-left {
    text-align: right !important;
}

[dir="rtl"] .text-right {
    text-align: left !important;
}

[dir="rtl"] .ml-auto {
    margin-right: auto !important;
    margin-left: 0 !important;
}

[dir="rtl"] .mr-auto {
    margin-left: auto !important;
    margin-right: 0 !important;
}