/* ============================================
   RTL/LTR Utility Classes
   Auto-adjust based on html[dir] attribute
   ============================================ */

/* Text Alignment */
.text-start {
    text-align: start;
}

.text-end {
    text-align: end;
}

.text-center {
    text-align: center;
}

/* Margins - Using CSS Logical Properties */
.margin-start-xs { margin-inline-start: 0.25rem; }
.margin-start-sm { margin-inline-start: 0.5rem; }
.margin-start-md { margin-inline-start: 1rem; }
.margin-start-lg { margin-inline-start: 1.5rem; }
.margin-start-xl { margin-inline-start: 2rem; }
.margin-start-2xl { margin-inline-start: 3rem; }

.margin-end-xs { margin-inline-end: 0.25rem; }
.margin-end-sm { margin-inline-end: 0.5rem; }
.margin-end-md { margin-inline-end: 1rem; }
.margin-end-lg { margin-inline-end: 1.5rem; }
.margin-end-xl { margin-inline-end: 2rem; }
.margin-end-2xl { margin-inline-end: 3rem; }

/* Padding - Using CSS Logical Properties */
.padding-start-xs { padding-inline-start: 0.25rem; }
.padding-start-sm { padding-inline-start: 0.5rem; }
.padding-start-md { padding-inline-start: 1rem; }
.padding-start-lg { padding-inline-start: 1.5rem; }
.padding-start-xl { padding-inline-start: 2rem; }
.padding-start-2xl { padding-inline-start: 3rem; }

.padding-end-xs { padding-inline-end: 0.25rem; }
.padding-end-sm { padding-inline-end: 0.5rem; }
.padding-end-md { padding-inline-end: 1rem; }
.padding-end-lg { padding-inline-end: 1.5rem; }
.padding-end-xl { padding-inline-end: 2rem; }
.padding-end-2xl { padding-inline-end: 3rem; }

/* Borders - Using CSS Logical Properties */
.border-start {
    border-inline-start: 1px solid var(--border, #e5e7eb);
}

.border-end {
    border-inline-end: 1px solid var(--border, #e5e7eb);
}

.border-start-thick {
    border-inline-start: 2px solid var(--border, #e5e7eb);
}

.border-end-thick {
    border-inline-end: 2px solid var(--border, #e5e7eb);
}

.border-start-primary {
    border-inline-start: 4px solid var(--primary, #6366f1);
}

.border-end-primary {
    border-inline-end: 4px solid var(--primary, #6366f1);
}

/* Icon Positioning */
.icon-start {
    margin-inline-start: 0.5rem;
}

.icon-end {
    margin-inline-end: 0.5rem;
}

.icon-start-sm {
    margin-inline-start: 0.25rem;
}

.icon-end-sm {
    margin-inline-end: 0.25rem;
}

.icon-start-lg {
    margin-inline-start: 0.75rem;
}

.icon-end-lg {
    margin-inline-end: 0.75rem;
}

/* Float - Using CSS Logical Properties */
.float-start {
    float: inline-start;
}

.float-end {
    float: inline-end;
}

/* Position - Using CSS Logical Properties */
.inset-start-0 {
    inset-inline-start: 0;
}

.inset-end-0 {
    inset-inline-end: 0;
}

/* Flexbox Alignment */
.flex-start {
    justify-content: flex-start;
}

.flex-end {
    justify-content: flex-end;
}

.items-start {
    align-items: flex-start;
}

.items-end {
    align-items: flex-end;
}

/* Gap - Using CSS Logical Properties */
.gap-start-xs { gap-inline-start: 0.25rem; }
.gap-start-sm { gap-inline-start: 0.5rem; }
.gap-start-md { gap-inline-start: 1rem; }
.gap-start-lg { gap-inline-start: 1.5rem; }

.gap-end-xs { gap-inline-end: 0.25rem; }
.gap-end-sm { gap-inline-end: 0.5rem; }
.gap-end-md { gap-inline-end: 1rem; }
.gap-end-lg { gap-inline-end: 1.5rem; }

/* Display utilities */
.display-block { display: block; }
.display-inline { display: inline; }
.display-inline-block { display: inline-block; }
.display-flex { display: flex; }
.display-none { display: none; }

/* Margin top/bottom (not directional) */
.margin-top-xs { margin-top: 0.25rem; }
.margin-top-sm { margin-top: 0.5rem; }
.margin-top-md { margin-top: 1rem; }
.margin-top-lg { margin-top: 1.5rem; }
.margin-top-xl { margin-top: 2rem; }

.margin-bottom-xs { margin-bottom: 0.25rem; }
.margin-bottom-sm { margin-bottom: 0.5rem; }
.margin-bottom-md { margin-bottom: 1rem; }
.margin-bottom-lg { margin-bottom: 1.5rem; }
.margin-bottom-xl { margin-bottom: 2rem; }

/* Border Radius - Logical Properties */
.rounded-start {
    border-start-start-radius: 0.5rem;
    border-end-start-radius: 0.5rem;
}

.rounded-end {
    border-start-end-radius: 0.5rem;
    border-end-end-radius: 0.5rem;
}

/* Transform Origin */
.origin-start {
    transform-origin: left;
}

[dir="rtl"] .origin-start {
    transform-origin: right;
}

.origin-end {
    transform-origin: right;
}

[dir="rtl"] .origin-end {
    transform-origin: left;
}