/* Frontend only; the primary family follows the document language. */
html { --kataa-font: "IBM Plex Sans", Arial, sans-serif; }
html:lang(ar) { --kataa-font: "IBM Plex Sans Arabic", Tahoma, Arial, sans-serif; }
body,
body :where(h1,h2,h3,h4,h5,h6,p,a,label,button,input,textarea,select,li,dt,dd,blockquote,figcaption,small,strong,b,em,table),
body .elementor :where(.elementor-widget-container,.elementor-heading-title,.elementor-button,.elementor-button-text),
body :where(.title,.title-span,.excerpt,.meta,.meta-item,.written-by,.rivax-navigation,.comment-form,.kataa-languages) {
    font-family: var(--kataa-font) !important;
}
/* Preserve icon fonts: text inherits Plex while icon-specific families stay intact. */
body .elementor :where(.title-text,.title-inner,.subtitle-text,.social-title,.social-subtitle) {
    font-family: var(--kataa-font) !important;
}
/* RTL block base direction keeps embedded Latin words in their natural order. */
html:lang(ar) body :where(.rivax-post-title,.post-title,.entry-title,.rivax-post-modern .title,.rivax-post-elastic .title,.rivax-post-kenzo .title,.single-hero-title .title,.single-hero-title-2 .title,.single-post-title,.archive-posts .title) {
    direction: rtl;
    text-align: right;
    unicode-bidi: plaintext;
}
html:lang(ar) body :where(.rivax-post-title,.post-title,.entry-title,.rivax-post-modern .title,.rivax-post-elastic .title,.rivax-post-kenzo .title,.single-hero-title .title,.single-hero-title-2 .title,.single-post-title,.archive-posts .title) :where(a,.title-span) {
    direction: inherit;
    unicode-bidi: normal;
    white-space: normal;
    word-break: normal;
    overflow-wrap: normal;
}
html:lang(ar) body .rivax-posts-container .title {
    direction: rtl;
    text-align: right;
    unicode-bidi: plaintext;
}
html:lang(ar) body .rivax-posts-container .title a {
    direction: inherit;
    unicode-bidi: normal;
    white-space: normal;
    word-break: normal;
    overflow-wrap: normal;
}
.kataa-languages { display: inline-flex; align-items: center; min-height: 44px; white-space: nowrap; direction: ltr; font-size: 14px; line-height: 1.2; }
.kataa-languages .kataa-language { display: inline-flex; align-items: center; justify-content: center; gap: 7px; min-height: 38px; padding: 0 12px; box-sizing: border-box; border: 1px solid rgba(90,95,103,.45); border-radius: 999px; background: transparent; color: inherit; font-weight: 500; text-decoration: none; }
.kataa-languages a:hover { border-color: currentColor; background: rgba(128,128,128,.06); text-decoration: none; }
.kataa-languages .kataa-language-globe { flex: none; width: 16px; height: 16px; }
.kataa-languages a:focus-visible { outline: 2px solid currentColor; outline-offset: 2px; }
.kataa-languages a:lang(ar) { font-family: "IBM Plex Sans Arabic", Tahoma, sans-serif !important; }
.kataa-languages a:lang(en) { font-family: "IBM Plex Sans", Arial, sans-serif !important; }
@media (max-width: 767px) { .kataa-languages { font-size: 13px; } .kataa-languages .kataa-language { min-height: 36px; padding: 0 10px; } }

/* KATAA Paper: palette only; existing fonts, direction and geometry stay intact. */
:root {
    --kataa-bg: #F4F3F0;
    --kataa-surface: #FFFFFF;
    --kataa-surface-soft: #ECEBE7;
    --kataa-text: #181818;
    --kataa-text-secondary: #626262;
    --kataa-border: #DEDDD8;
    --kataa-header-bg: #FAF9F7;
    /* Verified live Roxeen root, active navigation underline and category badge. */
    --kataa-accent: #FF376C;
    /* Preserve the intentionally dark existing footer and its copy contrast. */
    --kataa-footer-bg: #18191D;
    --kataa-footer-text: #A1A3AA;
    --kataa-footer-border: #25272B;
}
body.kataa-paper {
    background-color: var(--kataa-bg);
    color: var(--kataa-text);
    --accent-color: var(--kataa-accent);
    --second-color: var(--kataa-accent);
}
body.kataa-paper .elementor-364 .elementor-element.elementor-element-efd46c7,
body.kataa-paper .elementor-265 .elementor-element.elementor-element-00514d9 {
    background-color: var(--kataa-header-bg);
    border-color: var(--kataa-border);
    box-shadow: none;
}
/* The three existing sidebar cards; do not paint surrounding columns or media. */
body.kataa-paper .elementor-135 .elementor-element:is(.elementor-element-8b667cf,.elementor-element-11a5121,.elementor-element-ea88a69) {
    background-color: var(--kataa-surface-soft);
    border-color: var(--kataa-border);
    box-shadow: none;
}
body.kataa-paper .rivax-posts-container .title,
body.kataa-paper .single-hero-title-2 .title,
body.kataa-paper .single-content {
    color: var(--kataa-text);
}
body.kataa-paper .rivax-posts-container .excerpt,
body.kataa-paper .rivax-posts-container .meta-wrapper,
body.kataa-paper .rivax-posts-container .meta-wrapper :is(.author-meta,.views,.reading-time,.date),
body.kataa-paper .single-hero-title-2 .meta-item {
    color: var(--kataa-text-secondary);
}
/* Long-form reading stays on the canvas; preserve its width and padding. */
body.kataa-paper .single-content:not(.page) {
    background-color: transparent;
    border: none;
    box-shadow: none;
}
/* Secondary article utilities use the same soft surface as sidebar cards. */
body.kataa-paper :is(.single-share-box-container,.single-author-box-container,.comments-area) {
    background-color: var(--kataa-surface-soft);
    box-shadow: 0 0 0 1px var(--kataa-border);
}
body.kataa-paper .comments-container :is(input:not([type=submit]):not([type=checkbox]),textarea) {
    background-color: var(--kataa-surface);
    border-color: var(--kataa-border);
    color: var(--kataa-text);
}
/* Do not stretch the homepage content to fill a tall viewport above the footer. */
body.kataa-paper.home.blog .main-wrapper {
    flex-grow: 0;
}
body.kataa-paper .elementor-135 .rivax-read-more.style-default {
    background-color: var(--kataa-accent);
}
body.kataa-paper .kataa-languages .kataa-language {
    color: var(--kataa-text);
    border-color: var(--kataa-border);
}
body.kataa-paper .kataa-languages .kataa-language:hover {
    background-color: var(--kataa-surface-soft);
    border-color: var(--kataa-text-secondary);
}
body.kataa-paper .elementor-89 {
    color: var(--kataa-footer-text);
}
body.kataa-paper .elementor-89 .elementor-element.elementor-element-88e1468 {
    background-color: var(--kataa-footer-bg);
}
body.kataa-paper .elementor-89 .elementor-element.elementor-element-e576d32 {
    border-color: var(--kataa-footer-border);
}
/* Generated footer margins (-13px) exceeded its mobile padding (10px). */
@media (max-width: 767px) {
    body.kataa-paper .elementor-89 .elementor-element.elementor-element-82cfb81 .elementor-icon-list-items.elementor-inline-items {
        margin-inline: 0;
    }
}


/* KATAA console-style theme control; language pill geometry is preserved. */
.kataa-utilities { display: inline-flex; align-items: center; gap: 8px; }
.kataa-theme-toggle { display: none; flex: none; align-items: center; gap: 2px; width: 70px; height: 38px; padding: 3px; border: 1px solid var(--kataa-border); border-radius: 999px; background: transparent; color: var(--kataa-text-secondary); cursor: pointer; direction: ltr; box-shadow: none; transition: border-color 120ms ease; }
.kataa-theme-ready .kataa-theme-toggle { display: inline-flex; }
.kataa-theme-toggle span { display: grid; place-items: center; width: 30px; height: 28px; border-radius: 999px; transition: background-color 120ms ease, color 120ms ease; }
.kataa-theme-toggle svg { width: 16px; height: 16px; }
.kataa-theme-toggle .kataa-mode-light,
html[data-kataa-theme="dark"] .kataa-theme-toggle .kataa-mode-dark { color: var(--kataa-text); background: var(--kataa-surface-soft); box-shadow: inset 0 -2px 0 var(--kataa-accent); }
html[data-kataa-theme="dark"] .kataa-theme-toggle .kataa-mode-light { color: var(--kataa-text-secondary); background: transparent; box-shadow: none; }
.kataa-theme-toggle:hover { background: transparent; border-color: var(--kataa-text-secondary); color: var(--kataa-text); }
.kataa-theme-toggle:focus-visible, .kataa-profile-socials a:focus-visible { outline: 2px solid var(--kataa-accent); outline-offset: 3px; }
.kataa-profile-socials .icon svg { width: 1em; height: 1em; display: block; }
.kataa-profile-socials .tiktok { --social-color: var(--kataa-text); --social-color-alt: var(--kataa-text); }
body.kataa-paper .elementor-213 .elementor-element.elementor-element-4ae5586 .kataa-profile-socials { grid-template-columns: repeat(3, minmax(0, 1fr)); }
@media (max-width: 767px) {
    html.kataa-theme-ready .elementor-213 .kataa-utilities > .kataa-theme-toggle { display: inline-flex; height: 36px; }
}
@media (prefers-reduced-motion: reduce) { .kataa-theme-toggle, .kataa-theme-toggle span { transition: none; } }

/* Dark mode changes the same Paper tokens; media and footer tokens are untouched. */
html[data-kataa-theme="dark"] {
    --kataa-bg: #111214;
    --kataa-surface: #181A1D;
    --kataa-surface-soft: #202226;
    --kataa-text: #F2F1ED;
    --kataa-text-secondary: #A9A8A4;
    --kataa-border: #303338;
    --kataa-header-bg: #141517;
}
html[data-kataa-theme="dark"] body.kataa-paper :is(h1,h2,h3,h4,h5,h6) { color: var(--kataa-text); }
html[data-kataa-theme="dark"] body.kataa-paper :is(.single-content,.single-hero-title-2,.comments-area,.single-author-box-container,.single-share-box-container) :is(p,h1,h2,h3,h4,h5,h6,label,.title,.author-name,.written-by) { color: var(--kataa-text); }
html[data-kataa-theme="dark"] body.kataa-paper :is(.single-author-box-container,.single-share-box-container,.comments-area) { color: var(--kataa-text); }
html[data-kataa-theme="dark"] body.kataa-paper :is(.author-bio,.comment-notes,.logged-in-as,.comment-form-cookies-consent,.single-content blockquote) { color: var(--kataa-text-secondary); }
html[data-kataa-theme="dark"] body.kataa-paper .single-content a { color: var(--kataa-text); }
html[data-kataa-theme="dark"] body.kataa-paper .single-content a:hover { color: var(--kataa-accent); }
html[data-kataa-theme="dark"] body.kataa-paper .elementor :is(.rivax-header-nav,.rivax-header-v-nav) > li.menu-item > a { color: var(--kataa-text); }
html[data-kataa-theme="dark"] body.kataa-paper .elementor :is(.rivax-header-nav,.rivax-header-v-nav) > li.menu-item > a:hover { color: var(--kataa-accent); }
html[data-kataa-theme="dark"] body.kataa-paper .offcanvas-opener .hamburger span::before,
html[data-kataa-theme="dark"] body.kataa-paper .offcanvas-opener .hamburger span::after { background: var(--kataa-text); }
html[data-kataa-theme="dark"] body.kataa-paper .offcanvas-wrapper .offcanvas-container { background: var(--kataa-bg); color: var(--kataa-text); }
html[data-kataa-theme="dark"] body.kataa-paper .elementor-213 .elementor-element.elementor-element-986632d { background-color: var(--kataa-surface-soft); background-image: none; }
html[data-kataa-theme="dark"] body.kataa-paper .elementor-213 .elementor-shape-fill { fill: var(--kataa-bg); }
html[data-kataa-theme="dark"] body.kataa-paper .elementor-213 .rivax-divider-heading .title { color: var(--kataa-text); }
html[data-kataa-theme="dark"] body.kataa-paper :is(.elementor-135,.elementor-213,.elementor-142,.elementor-665) .kataa-profile-socials .social-item { background: var(--kataa-surface); border-color: var(--kataa-border); box-shadow: none; }
html[data-kataa-theme="dark"] body.kataa-paper :is(.elementor-135,.elementor-213,.elementor-142,.elementor-665) .kataa-profile-socials .social-item .icon { color: var(--kataa-text); }
html[data-kataa-theme="dark"] body.kataa-paper .single-share-box-container input { background: var(--kataa-surface); border-color: var(--kataa-border); color: var(--kataa-text-secondary); }
html[data-kataa-theme="dark"] body.kataa-paper .comments-container :is(input,textarea)::placeholder { color: var(--kataa-text-secondary); opacity: 1; }
html[data-kataa-theme="dark"] body.kataa-paper :is(.single-content blockquote,.single-content table,.single-content th,.single-content td) { border-color: var(--kataa-border); }
/* Active About cards and headings use existing tokens, preserving their copy/media. */
html[data-kataa-theme="dark"] body.kataa-paper :is(.elementor-142,.elementor-665) .elementor-element.elementor-element-2b68c5d { background: var(--kataa-surface-soft); border-color: var(--kataa-border); box-shadow: none; }
html[data-kataa-theme="dark"] body.kataa-paper :is(.elementor-142,.elementor-665) :is(.elementor-element-793b0b5,.elementor-element-6dfb67f) { background: transparent; }
html[data-kataa-theme="dark"] body.kataa-paper :is(.elementor-142,.elementor-665) .elementor-element.elementor-element-a1cf968 { background: var(--kataa-surface-soft); border: 1px solid var(--kataa-border); }
html[data-kataa-theme="dark"] body.kataa-paper :is(.elementor-142,.elementor-665) :is(.elementor-element-eaff6da,.elementor-element-a160acd) { background: transparent; }
html[data-kataa-theme="dark"] body.kataa-paper :is(.elementor-142,.elementor-665) .rivax-divider-heading .title { color: var(--kataa-text); }

/* Explicit link/shape colors override the active widgets' stored light colors. */
html[data-kataa-theme="dark"] body.kataa-paper .elementor-135 .rivax-posts-container .title a,
html[data-kataa-theme="dark"] body.kataa-paper .single-hero-title-2 .meta-item a { color: var(--kataa-text); }
html[data-kataa-theme="dark"] body.kataa-paper .elementor-213 .elementor-element.elementor-element-986632d .elementor-shape-bottom .elementor-shape-fill { fill: var(--kataa-bg); }
body.kataa-paper .kataa-theme-toggle:focus-visible,
body.kataa-paper .kataa-profile-socials a:focus-visible { outline: 2px solid var(--kataa-accent); outline-offset: 3px; }

html[data-kataa-theme="dark"] body.kataa-paper .single-hero-title-2 .author-name a { color: var(--kataa-text-secondary); }
html[data-kataa-theme="dark"] body.kataa-paper :is(.elementor-142,.elementor-665) .elementor-element.elementor-element-793b0b5 .rivax-divider-heading { --divider-color: var(--kataa-accent); }


html[data-kataa-theme="dark"] body.kataa-paper :is(.elementor-142,.elementor-665) .elementor-widget-text-editor blockquote { border-color: var(--kataa-border); }

/* The same 4:3 image box in both modes; the hidden image has no layout/AT presence. */
.kataa-header-logo img { object-fit: contain; }
.kataa-header-logo .kataa-logo-dark { display: none; }
html[data-kataa-theme="dark"] .kataa-header-logo .kataa-logo-light { display: none; }
html[data-kataa-theme="dark"] .kataa-header-logo .kataa-logo-dark { display: inline; }

/* Mobile headers need content-sized groups, rather than the stored 60/40 split. */
@media (max-width: 767px) {
    body.kataa-paper :is(.elementor-364 .elementor-element-efd46c7,.elementor-265 .elementor-element-00514d9) { padding-inline: 8px; }
    body.kataa-paper :is(.elementor-364 .elementor-element-efd46c7,.elementor-265 .elementor-element-00514d9) > .e-con-inner { flex-wrap: nowrap; justify-content: space-between; }
    body.kataa-paper :is(.elementor-364 .elementor-element-f350756,.elementor-265 .elementor-element-8e75884) {
        --width: 168px; width: 168px; flex: 0 0 168px; padding-inline: 0; gap: 8px; flex-wrap: nowrap;
    }
    body.kataa-paper :is(.elementor-364 .elementor-element-511efa0,.elementor-265 .elementor-element-6bf5047) { width: 130px; flex: 0 0 130px; }
    body.kataa-paper :is(.elementor-364 .elementor-element-b71c134,.elementor-265 .elementor-element-d9a304a) { width: 30px; flex: 0 0 30px; }
    body.kataa-paper :is(.elementor-364 .elementor-element-7a8766f,.elementor-265 .elementor-element-db4ef20) { --width: auto; width: auto; flex: 0 0 auto; padding-inline: 0; }
    :is(.elementor-364 .elementor-element-7a8766f,.elementor-265 .elementor-element-db4ef20) .kataa-utilities { gap: 4px; flex-wrap: nowrap; }
    :is(.elementor-364 .elementor-element-7a8766f,.elementor-265 .elementor-element-db4ef20) .kataa-utilities > .kataa-theme-toggle { width: 56px; height: 36px; padding: 2px; gap: 0; }
    :is(.elementor-364 .elementor-element-7a8766f,.elementor-265 .elementor-element-db4ef20) .kataa-theme-toggle span { width: 25px; height: 28px; }
}
@media (max-width: 360px) {
    :is(.elementor-364 .elementor-element-7a8766f,.elementor-265 .elementor-element-db4ef20) .kataa-utilities > .kataa-theme-toggle { width: 40px; }
    :is(.elementor-364 .elementor-element-7a8766f,.elementor-265 .elementor-element-db4ef20) .kataa-theme-toggle span { width: 17px; }
    :is(.elementor-364 .elementor-element-7a8766f,.elementor-265 .elementor-element-db4ef20) .kataa-theme-toggle svg { width: 13px; height: 13px; }
}

/* Footer direction belongs to the language container; stored text/order is intact. */
html:lang(ar) body.kataa-paper .elementor-89 { direction: rtl; text-align: right; }
html:lang(en) body.kataa-paper .elementor-89 { direction: ltr; }
html:lang(ar) body.kataa-paper .elementor-89 :is(.elementor-element-c980de0,.elementor-element-d862ee0,.content-wrapper,.rivax-tag-cloud) { direction: rtl; text-align: right; }
html:lang(ar) body.kataa-paper .elementor-89 :is(.rivax-divider-heading,.subtitle-text-wrap) { direction: rtl; text-align: right; justify-content: flex-start; }
html:lang(ar) body.kataa-paper .elementor-89 .elementor-element-a2882e3 .post-wrapper .content-wrapper { padding-inline-start: 15px; padding-inline-end: 0; }
html:lang(ar) body.kataa-paper .elementor-89 .elementor-element-d862ee0 { unicode-bidi: isolate; }
html:lang(ar) body.kataa-paper .elementor-89 .elementor-element-82cfb81 { direction: rtl; text-align: right; width: 100%; }
html:lang(ar) body.kataa-paper .elementor-89 .elementor-element-82cfb81 .elementor-icon-list-items { direction: rtl; flex-direction: row; justify-content: flex-start; }
html:lang(ar) body.kataa-paper .elementor-89 .elementor-element-82cfb81 .elementor-icon-list-item a { direction: inherit; text-align: inherit; }
/* Keep the sticky logo at its existing 160px size, including the narrowest phone. */
@media (max-width: 767px) {
    body.kataa-paper .elementor-265 .elementor-element-8e75884 { --width: 198px; width: 198px; flex-basis: 198px; }
    body.kataa-paper .elementor-265 .elementor-element-6bf5047 { width: 160px; flex-basis: 160px; }
}
@media (max-width: 360px) {
    body.kataa-paper .elementor-265 .elementor-element-00514d9 { padding-inline: 2px; }
    body.kataa-paper .elementor-265 .elementor-element-8e75884 { --width: 190px; width: 190px; flex-basis: 190px; gap: 0; }
    .elementor-265 .elementor-element-db4ef20 .kataa-utilities { gap: 2px; }
    .elementor-265 .elementor-element-db4ef20 .kataa-utilities > .kataa-theme-toggle { width: 34px; }
    .elementor-265 .elementor-element-db4ef20 .kataa-theme-toggle span { width: 14px; }
    .elementor-265 .elementor-element-db4ef20 .kataa-theme-toggle svg { width: 12px; height: 12px; }
}
