/* app/static/css/style.css */
body {
    font-family: 'Vazirmatn', Arial, sans-serif; /* Vazirmatn first */
    background-color: #f8f9fa;
    direction: rtl; /* Ensure RTL direction */
}

/* Navbar customizations */
.navbar-brand-custom {
    font-weight: bold;
    font-size: 1.5rem; /* Larger brand text */
}

/* Card customizations */
.card {
    border: 1px solid rgba(0,0,0,.125); /* Softer border */
    box-shadow: 0 0.125rem 0.25rem rgba(0,0,0,.075); /* Subtle shadow */
}

.card-header-custom {
    background-color: #343a40; /* Dark grey, consistent with Bootstrap dark theme */
    color: white;
    font-weight: 500;
}
.card-header-custom h1, .card-header-custom h2, .card-header-custom h3, .card-header-custom h4, .card-header-custom h5 {
    margin-bottom: 0; /* Remove default bottom margin for headings in card header */
}


/* List item styling */
.list-group-item {
    word-break: break-word; /* Prevent long item names from breaking layout */
}

.list-group-item.purchased {
    background-color: #e9ecef; /* Light grey for purchased items */
    color: #6c757d; /* Muted text color for purchased items */
}

.list-group-item.purchased .item-name {
    text-decoration: line-through;
}

.item-actions button {
    padding: 0.25rem 0.5rem; /* Smaller padding for action buttons */
}
.item-actions button i {
    vertical-align: middle;
}

/* Button customizations */
.btn-brand {
    background-color: #5850ec; /* A nice purple, for example */
    border-color: #5850ec;
    color: white;
}
.btn-brand:hover {
    background-color: #443cb9;
    border-color: #443cb9;
    color: white;
}

/* Form field error styling (Bootstrap default is often hidden until focus) */
.invalid-feedback.d-block {
    display: block !important; /* Ensure error messages are always visible */
    width: 100%;
    margin-top: .25rem;
    font-size: .875em;
    color: #dc3545; /* Bootstrap's danger color */
}

/* Ensure form elements respect RTL */
input[type="text"],
input[type="email"],
input[type="password"],
textarea {
    direction: rtl;
    text-align: right;
}

/* Placeholder text for RTL */
::placeholder { /* Chrome, Firefox, Opera, Safari 10.1+ */
  text-align: right;
  opacity: 1; /* Firefox */
}

:-ms-input-placeholder { /* Internet Explorer 10-11 */
  text-align: right;
}

::-ms-input-placeholder { /* Microsoft Edge */
  text-align: right;
}

/* Flash messages alignment */
.alert {
    text-align: right;
}
.alert .btn-close {
    margin-left: auto; /* Push close button to the left in RTL */
    margin-right: 0;
}

/* Vazirmatn font if local */
/*
@font-face {
    font-family: 'Vazirmatn';
    src: url('../fonts/Vazirmatn-Regular.woff2') format('woff2'),
         url('../fonts/Vazirmatn-Regular.woff') format('woff');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Vazirmatn';
    src: url('../fonts/Vazirmatn-Bold.woff2') format('woff2'),
         url('../fonts/Vazirmatn-Bold.woff') format('woff');
    font-weight: bold;
    font-style: normal;
    font-display: swap;
}
*/
.item-details {
    flex-grow: 1; /* اطمینان از اینکه جزئیات آیتم فضای لازم را می‌گیرند */
    word-break: break-word; /* برای شکستن کلمات طولانی در نام آیتم */
}

.item-name {
    font-weight: 500; /* کمی ضخیم‌تر کردن نام آیتم */
    font-size: 1.1rem; /* اندازه فونت نام آیتم */
}

.item-meta small {
    font-size: 0.78rem; /* کوچک‌تر کردن فونت اطلاعات فرعی */
    line-height: 1.5; /* فاصله خطوط برای خوانایی بهتر */
    color: #6c757d !important; /* رنگ متن برای اطلاعات فرعی */
}

.item-meta .fa-xs { /* آیکون‌های کوچک‌تر برای اطلاعات فرعی */
    font-size: 0.7em;
}

.list-group-item.purchased .item-name {
    /* کلاس text-decoration-line-through از بوت‌استرپ این کار را می‌کند */
    color: #6c757d; /* رنگ متن نام آیتم خریداری شده */
}

.list-group-item {
    /* align-items: flex-start; /* اگر می‌خواهید دکمه‌ها در بالای جزئیات آیتم قرار گیرند (اگر جزئیات چند خطی شود) */
    padding-top: 0.75rem;
    padding-bottom: 0.75rem;
}

.item-actions {
    white-space: nowrap; /* جلوگیری از شکستن دکمه‌ها به خط بعدی */
}
.item-actions form {
    display: inline-block; /* اطمینان از قرارگیری فرم‌ها در کنار هم */
    margin-right: 0.25rem; /* فاصله بین دکمه‌های عملیات (در RTL margin-left می‌شود) */
}
/* برای RTL، اولین دکمه از راست نباید margin-right داشته باشد */
html[dir="rtl"] .item-actions form:first-child {
    margin-right: 0;
}
html[dir="rtl"] .item-actions form {
    margin-left: 0.25rem;
    margin-right: 0;
}
html[dir="rtl"] .item-actions form:last-child { /* یا اولین از دیدگاه بصری راست */
    margin-left: 0;
}


/* بهبود ظاهر فرم افزودن آیتم */
#addItemForm .form-control-lg {
    font-size: 1.1rem; /* کمی بزرگتر کردن فونت ورودی */
}
#addItemForm .btn-lg {
    padding: 0.6rem 1.2rem; /* تنظیم پدینگ دکمه */
}