/*
 * Pharmacy App - Global RTL Polish (Phase 4 / Task 4.04)
 * =======================================================
 *
 * Maps common LTR-only border/padding rules used in 32 admin templates to
 * logical properties so they automatically flip in RTL contexts.
 * Loaded globally via base.html.
 */

/* Card detail accent borders - use logical inline-start instead of left */
[dir="rtl"] .detail-card,
[dir="rtl"] .pharmacy-detail-card {
    border-left: none !important;
    border-right: 4px solid var(--accent-dark, #9c27b0) !important;
}

/* Status timeline arrows / dots */
[dir="rtl"] .status-timeline {
    padding-left: 0;
    padding-right: 30px;
}
[dir="rtl"] .status-timeline::before {
    left: auto;
    right: 10px;
}
[dir="rtl"] .status-item::before {
    left: auto;
    right: -24px;
}

/* Card-header colored border swap */
[dir="rtl"] .card-header-purple,
[dir="rtl"] .card-header-green,
[dir="rtl"] .card-header-blue,
[dir="rtl"] .card-header-cyan {
    border-left: none !important;
    border-right: 4px solid var(--accent-dark, #9c27b0) !important;
}

/* Common Bootstrap utility flips that aren't covered by Bootstrap RTL */
[dir="rtl"] .me-1, [dir="rtl"] .me-2, [dir="rtl"] .me-3 {
    margin-right: 0 !important;
}
[dir="rtl"] .me-1 { margin-left: 0.25rem !important; }
[dir="rtl"] .me-2 { margin-left: 0.5rem !important; }
[dir="rtl"] .me-3 { margin-left: 1rem !important; }

[dir="rtl"] .ms-1, [dir="rtl"] .ms-2, [dir="rtl"] .ms-3 {
    margin-left: 0 !important;
}
[dir="rtl"] .ms-1 { margin-right: 0.25rem !important; }
[dir="rtl"] .ms-2 { margin-right: 0.5rem !important; }
[dir="rtl"] .ms-3 { margin-right: 1rem !important; }

/* Workboard board card border - already uses LANGUAGE_BIDI but reinforce */
[dir="rtl"] .board-card {
    border-left: none !important;
    border-right: 4px solid currentColor;
}

/* Tag-input widget for JSON fields */
.tag-input-wrapper {
    border: 1px solid #ced4da;
    border-radius: 0.375rem;
    padding: 0.375rem 0.5rem;
    min-height: 38px;
    display: flex;
    flex-wrap: wrap;
    gap: 4px;
    align-items: center;
    background: #fff;
}
.tag-input-wrapper:focus-within {
    border-color: #86b7fe;
    box-shadow: 0 0 0 0.25rem rgba(13, 110, 253, 0.25);
}
.tag-chip {
    background: #e7f1ff;
    color: #0a58ca;
    border-radius: 12px;
    padding: 2px 10px;
    font-size: 0.85rem;
    display: inline-flex;
    align-items: center;
    gap: 4px;
}
.tag-chip .remove {
    cursor: pointer;
    font-weight: bold;
    color: #6c757d;
}
.tag-chip .remove:hover { color: #dc3545; }
.tag-input-wrapper input.tag-input {
    border: none;
    outline: none;
    flex: 1;
    min-width: 100px;
    padding: 4px;
}