*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }

html {
    font-size: 16px;
    -webkit-text-size-adjust: 100%;
    scroll-behavior: smooth;
    height: -webkit-fill-available;
}

body {
    font-family: var(--font-sans);
    font-size: var(--font-size-base);
    line-height: var(--line-height);
    color: var(--text);
    background: var(--bg);
    min-height: 100vh;
    min-height: -webkit-fill-available;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    overscroll-behavior-y: none;
}

/* RTL languages use Arabic-optimised font */
:lang(ar), :lang(kur), :lang(ckb) {
    font-family: 'Tajawal', 'Noto Sans Arabic', var(--font-sans);
}
body:lang(ar), body:lang(kur), body:lang(ckb) {
    font-size: calc(var(--font-size-base) * 1.05);
}
:lang(kmr) { font-family: 'Outfit', var(--font-sans); }

a { color: var(--primary); text-decoration: none; }
a:hover { text-decoration: underline; }

img { max-width: 100%; display: block; }

button { cursor: pointer; font-family: inherit; }

input, select, textarea { font-family: inherit; }

/* ── iOS / Touch resets ──────────────────────────────────────── */
input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="color"]),
select, textarea {
    -webkit-appearance: none;
    appearance: none;
    border-radius: 0;
}
input[type="search"] { -webkit-appearance: none; appearance: none; }
input[type="search"]::-webkit-search-cancel-button { -webkit-appearance: none; }

a, button, [role="button"], label, .nav-item, .tab-item, .dropdown-item, .pipeline-step {
    -webkit-tap-highlight-color: transparent;
    touch-action: manipulation;
}

/* ── Utility classes ────────────────────────────────────────── */
.text-muted      { color: var(--text-muted); }
.text-secondary  { color: var(--text-secondary); }
.text-primary    { color: var(--primary); }
.text-success    { color: var(--success); }
.text-warning    { color: var(--warning); }
.text-danger     { color: var(--danger); }
.text-info       { color: var(--info); }

.text-xs   { font-size: var(--font-size-xs); }
.text-sm   { font-size: var(--font-size-sm); }
.text-base { font-size: var(--font-size-base); }
.text-lg   { font-size: var(--font-size-lg); }
.text-xl   { font-size: var(--font-size-xl); }
.text-2xl  { font-size: var(--font-size-2xl); }
.text-3xl  { font-size: var(--font-size-3xl); }

.font-light    { font-weight: 300; }
.font-normal   { font-weight: 400; }
.font-medium   { font-weight: 500; }
.font-semibold { font-weight: 600; }
.font-bold     { font-weight: 700; }
.font-extrabold{ font-weight: 800; }

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

.truncate    { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.break-word  { word-break: break-word; }

.d-flex      { display: flex; }
.d-grid      { display: grid; }
.d-none      { display: none !important; }
.d-block     { display: block; }
.items-center{ align-items: center; }
.items-start { align-items: flex-start; }
.justify-between { justify-content: space-between; }
.justify-center  { justify-content: center; }
.justify-end     { justify-content: flex-end; }
.flex-1      { flex: 1; }
.flex-wrap   { flex-wrap: wrap; }
.gap-1       { gap: 0.25rem; }
.gap-2       { gap: 0.5rem; }
.gap-3       { gap: 0.75rem; }
.gap-4       { gap: 1rem; }
.gap-6       { gap: 1.5rem; }

.w-full  { width: 100%; }
.h-full  { height: 100%; }
.min-w-0 { min-width: 0; }

.mt-0 { margin-top: 0; }
.mt-1 { margin-top: 0.25rem; }
.mt-2 { margin-top: 0.5rem; }
.mt-3 { margin-top: 0.75rem; }
.mt-4 { margin-top: 1rem; }
.mb-0 { margin-bottom: 0; }
.mb-1 { margin-bottom: 0.25rem; }
.mb-2 { margin-bottom: 0.5rem; }
.mb-3 { margin-bottom: 0.75rem; }
.mb-4 { margin-bottom: 1rem; }
.ms-auto { margin-inline-start: auto; }
.me-1 { margin-inline-end: 0.25rem; }
.me-2 { margin-inline-end: 0.5rem; }

.p-0 { padding: 0; }
.p-2 { padding: 0.5rem; }
.p-3 { padding: 0.75rem; }
.p-4 { padding: 1rem; }
.p-6 { padding: 1.5rem; }
.px-3 { padding-inline: 0.75rem; }
.px-4 { padding-inline: 1rem; }
.py-2 { padding-block: 0.5rem; }
.py-3 { padding-block: 0.75rem; }

.rounded    { border-radius: var(--radius); }
.rounded-sm { border-radius: var(--radius-sm); }
.rounded-lg { border-radius: var(--radius-lg); }
.rounded-xl { border-radius: var(--radius-xl); }
.rounded-full { border-radius: var(--radius-full); }

.cursor-pointer { cursor: pointer; }
.select-none    { user-select: none; }
.overflow-hidden{ overflow: hidden; }
.relative { position: relative; }
.absolute { position: absolute; }

.opacity-50 { opacity: 0.5; }
.opacity-75 { opacity: 0.75; }

/* ── Scrollbar ───────────────────────────────────────────────── */
::-webkit-scrollbar       { width: 6px; height: 6px; }
::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb { background: var(--border); border-radius: 3px; }
::-webkit-scrollbar-thumb:hover { background: var(--text-muted); }

/* ── Page entry animation ────────────────────────────────────── */
@keyframes pageFadeIn {
    from { opacity: 0; transform: translateY(6px); }
    to   { opacity: 1; transform: translateY(0); }
}
.page-content > * { animation: pageFadeIn 0.18s ease both; }

/* ── Focus ring ──────────────────────────────────────────────── */
:focus-visible {
    outline: 2px solid var(--primary);
    outline-offset: 2px;
}