/* ّFont */
@import url('https://cdn.jsdelivr.net/gh/rastikerdar/vazir-font@v30.1.0/dist/font-face.css');

body,
input,
select,
textarea,
.module h2,
.module caption,
.breadcrumbs,
.dashboard #content {
    font-family: 'Vazir', Tahoma, Arial, sans-serif !important;
}

input {
    text-align: left !important;
    direction: ltr !important;
}

/* input elements */
select,
textarea,
input[type="text"],
input[type="email"],
input[type="password"],
input[type="number"],
input[type="search"] {
    /* Classic-modern base styling */
    font-family: 'Vazir', Tahoma, Arial, sans-serif !important;
    font-size: 14px !important;
    color: #34495e !important;
    /* Dark gray for readability */
    background-color: #ffffff !important;
    /* White background */
    border: 1px solid #bdc3c7 !important;
    /* Light gray border for a classic look */
    border-radius: 4px !important;
    /* Modern rounded corners */
    padding: 8px 12px !important;
    /* Comfortable padding */
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05) !important;
    /* Subtle modern shadow */
    transition: border-color 0.3s ease, box-shadow 0.3s ease !important;
    /* Smooth modern transitions */
    height: 60px !important;
    box-sizing: border-box !important;
    /* Include padding and border in width calculation */
    vertical-align: middle !important;
    /* margin: 8px 12px !important; */
}

select,
textarea,
input[type="text"]:focus,
input[type="email"]:focus,
input[type="password"]:focus,
input[type="number"]:focus,
input[type="search"]:focus {
    outline: none !important;
    /* Remove default outline */
    border-color: #3498db !important;
    /* Blue focus ring for brand consistency */
    box-shadow: 0 2px 6px rgba(52, 152, 219, 0.2) !important;
    /* Enhanced shadow on focus */
}

select,
textarea,
input[type="text"]:hover,
input[type="email"]:hover,
input[type="password"]:hover,
input[type="number"]:hover,
input[type="search"]:hover {
    border-color: #95a5a6 !important;
    /* Slightly darker gray on hover */
}

select:disabled,
textarea:disabled,
input[type="text"]:disabled,
input[type="email"]:disabled,
input[type="password"]:disabled,
input[type="number"]:disabled,
input[type="search"]:disabled {
    background-color: #ecf0f1 !important;
    /* Light gray for disabled */
    color: #7f8c8d !important;
    /* Muted text color */
    cursor: not-allowed !important;
}

select::placeholder,
textarea::placeholder,
input[type="text"]::placeholder,
input[type="email"]::placeholder,
input[type="password"]::placeholder,
input[type="number"]::placeholder,
input[type="search"]::placeholder {
    color: #bdc3c7 !important;
    /* Light gray placeholder */
    font-style: italic !important;
    /* Classic touch */
}

.errors select,
.errors textarea,
.errors input[type="text"],
.errors input[type="email"],
.errors input[type="password"],
.errors input[type="number"],
.errors input[type="search"] {
    border-color: #BA2121 !important;
    /* Red border for errors */
}

/* Hide labels and errors lists */
.flex-container label,
.errornote {
    display: none !important;
}

/* inputs width size */
.colM {

    input,
    select,
    textarea {
        width: 100% !important;
    }

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

    .clearable-file-input {
        label {
            display: contents !important;
        }

        input {
            width: 20px !important;
        }
    }
}

/* Textarea height size */
textarea {
    min-height: 120px !important;
    /* Taller textareas for better usability */
    resize: vertical !important;
    /* Allow vertical resizing */
    width: 100% !important;
}

body {
    background: url('/static/admin/img/building-sketch.png'),
        radial-gradient(circle at top left, #ff9a9e, #fad0c4, #fad0c4, #fbc2eb, #a18cd1);
    background-repeat: no-repeat, repeat-x;
    background-position: bottom, top;
    background-size: contain;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-start;
}

.login #header {
    background: linear-gradient(135deg, #4a148c, #2ecc71);
    height: auto;
    padding: 15px 16px;
    justify-content: center;
}

.login #container header h1 {
    font-size: 15px;
    font-weight: bold;
    color: #2d3748;
    margin: 10px !important;
    background: linear-gradient(135deg, #002eff, #6e36a8);
    background-clip: border-box;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    direction: rtl;
}

.login #header h1 a {
    color: var(--header-link-color);
}

.login #content {
    padding: 20px;
}

.login #container {
    background: var(--body-bg);
    border: 1px solid var(--hairline-color);
    border-radius: 10px;
    overflow: auto;
    min-width: 480px;
    height: fit-content;
    width: fit-content;
}

.login #container header img {
    justify-content: center !important;
    width: 60px !important;
    height: 60px !important;
    border-radius: 50% !important;
    box-shadow: 0 10px 20px rgba(0, 0, 0, 0.78);
}

.login .form-row {
    padding: 4px 0;
}

.login .form-row label {
    display: block;
    line-height: 2em;
}

.login .form-row #id_username,
.login .form-row #id_password {
    padding: 8px;
    width: 100%;
    box-sizing: border-box;
}

.login .submit-row {
    padding: 1em 0 0 0;
    margin: 0;
    text-align: center;
}

.login .password-reset-link {
    text-align: center;
}

.login-or {
    position: relative;
    color: #aaa;
    margin-top: 10px;
    margin-bottom: 10px;
    padding-top: 10px;
    padding-bottom: 10px;
}

.span-or {
    display: block;
    position: absolute;
    left: 50%;
    top: -2px;
    margin-left: -25px;
    background-color: #fff;
    width: 50px;
    text-align: center;
}

.hr-or {
    height: 1px;
    margin-top: 0px !important;
    margin-bottom: 0px !important;
}

button,
input[type="submit"],
input[type="button"] {
    font-family: 'Vazir', Tahoma, Arial, sans-serif !important;
    font-size: 14px !important;
    font-weight: 400 !important;
    /* Standard weight for classic look */
    background: linear-gradient(135deg, #26865f, #26865f) !important;
    /* Green gradient for a modern touch */
    color: #fff !important;
    font-size: 15px !important;
    font-weight: bold !important;
    padding: 10px 20px !important;
    border: none !important;
    border-radius: 10px !important;
    /* More pronounced rounded corners */
    cursor: pointer !important;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2) !important;
    /* Slightly stronger shadow */
    transition: all 0.3s ease-in-out !important;
    /* Smooth transitions */
    margin: 0px !important;
    height: 2.5rem !important;
    width: 100% !important;
    line-height: 0 !important;
    text-align: center !important;
}

.g-recaptcha, .captcha small{
    text-align: center;
    text-align: center !important;
    text-align: -moz-center !important;
    text-align: -webkit-center !important;
    display: block;
}

.messagelist{
    text-align: center;
    text-align: center !important;
    text-align: -moz-center !important;
    text-align: -webkit-center !important;
    display: block;
}
.messagelist li{
    width: 380px;
}