/* assist-r1 (Nov 1, owner «ما هذا التعقيد والتصميم الغير متوافق»): one calm, theme-true assistant surface.
   Light page -> light surfaces, html.yd (the suite's dark switch) -> dark surfaces, never mixed. Loaded last on /assistant/. */
body[data-page=assistant]{--r1-bg:#f6f5fb;--r1-surf:#fff;--r1-soft:#f3f1fb;--r1-ink:#1b1930;--r1-mut:#55526b;--r1-line:#e4e1f1;--r1-brand:#4b3fb0;--r1-brand-ink:#3a2f9a;--r1-chip:#fff;--r1-chip-h:#f1eefc;--r1-user:#2a1f6e;--r1-user-ink:#fff;--r1-focus:#4b3fb0}
html.yd body[data-page=assistant]{--r1-bg:#100e20;--r1-surf:#1b1835;--r1-soft:#24203f;--r1-ink:#efedff;--r1-mut:#b4aed6;--r1-line:#2e2950;--r1-brand:#5240d6;--r1-brand-ink:#c9bfff;--r1-chip:#1f1b3b;--r1-chip-h:#2a2552;--r1-user:#5240d6;--r1-user-ink:#fff;--r1-focus:#a99cff}
/* the AI components follow the same switch (they used to read the device setting / html.dark and mixed navy cards into light pages) */
html.yd body[data-page=assistant]{--aip-ink:#efedff;--aip-mut:#b4aed6;--aip-line:#2e2950;--aip-card:#1f1b3b;--aip-soft:#24203f}
html:not(.yd) body[data-page=assistant]{--aip-ink:#1b1930;--aip-mut:#55526b;--aip-line:#e4e1f1;--aip-card:#fff;--aip-soft:#f3f1fb}

/* ---- frame: one surface, no box-in-a-box ---- */
body[data-page=assistant] .a-main{background:var(--r1-surf)!important;border:1px solid var(--r1-line);box-shadow:none}
body[data-page=assistant] .a-side{background:var(--r1-surf);border-color:var(--r1-line);color:var(--r1-ink)}
body[data-page=assistant] .a-side .t a{color:var(--r1-ink)}
body[data-page=assistant] .a-side .t a[aria-current=true],body[data-page=assistant] .a-side .t a:hover{background:var(--r1-soft)}
body[data-page=assistant] .a-head{border-color:var(--r1-line);color:var(--r1-ink)}
body[data-page=assistant] .a-head .a-tog{background:var(--r1-chip);color:var(--r1-ink);border-color:var(--r1-line)}
body[data-page=assistant] .a-log{background:transparent!important;background-image:none!important;box-shadow:none!important;
  padding-inline:max(16px,calc((100% - 760px) / 2));font-size:15.5px}
body[data-page=assistant] .a-comp{background:var(--r1-surf);border-top:0;box-shadow:none;padding:8px max(12px,calc((100% - 784px) / 2)) 14px;position:relative}

/* ---- empty state: greeting, the box, four suggestions, one link ---- */
body[data-page=assistant] .a-hero{margin:auto;max-width:720px;width:100%;padding:12px 4px;text-align:center}
body[data-page=assistant] .a-hero .a-hico{display:grid!important;width:52px;height:52px;margin:0 auto 14px;border-radius:16px;place-items:center}
body[data-page=assistant] .a-hero h2{font-size:28px;line-height:1.3;margin:0 0 6px;color:var(--r1-ink);font-weight:700}
body[data-page=assistant] .a-hero .y-sub{display:block!important;font-size:15.5px;color:var(--r1-mut);margin:0;white-space:normal}
body[data-page=assistant] .a-hero > .a-sug,body[data-page=assistant] .a-hero > .aip-gal{display:none!important}
body[data-page=assistant] .a-hero.ar1-open > .aip-gal{display:block!important}
.ar1-sug{display:flex;flex-wrap:wrap;justify-content:center;gap:10px;margin:22px 0 0}
.ar1-chip{display:inline-flex;align-items:center;gap:8px;min-height:44px;padding:0 16px;border-radius:999px;border:1px solid var(--r1-line);background:var(--r1-chip);color:var(--r1-ink);font-family:inherit;font-weight:600;font-size:14.5px;cursor:pointer;transition:background .15s,border-color .15s,transform .15s}
.ar1-chip svg{width:18px;height:18px;flex:none;color:var(--r1-brand-ink)}
.ar1-chip:hover{background:var(--r1-chip-h);border-color:color-mix(in srgb,var(--r1-brand) 40%,var(--r1-line))}
.ar1-chip:active{transform:scale(.98)}
.ar1-more{display:inline-flex;align-items:center;gap:6px;margin:14px auto 0;min-height:44px;padding:0 12px;border:0;background:none;color:var(--r1-brand-ink);font-family:inherit;font-weight:600;font-size:14.5px;cursor:pointer;border-radius:10px;text-decoration:underline;text-underline-offset:4px;text-decoration-thickness:1px}
.ar1-more:hover{text-decoration-thickness:2px}
.ar1-chip:focus-visible,.ar1-more:focus-visible,.ar1-tbtn:focus-visible,.ar1-tools button:focus-visible,.ar1-tools select:focus-visible{outline:2px solid var(--r1-focus);outline-offset:2px}

/* ---- the full examples list (behind the link): uniform cards, readable titles, no extra buttons ---- */
body[data-page=assistant] .a-hero .aip-gal{max-width:760px;margin:18px auto 0;text-align:start}
body[data-page=assistant] .aip-gh{margin:0 2px 10px}
body[data-page=assistant] .aip-gh b{font-size:16px;color:var(--r1-ink)}
body[data-page=assistant] .aip-gh span{display:none}
body[data-page=assistant] .aip-tabs{flex-wrap:wrap;overflow:visible;-webkit-mask-image:none!important;mask-image:none!important;padding:2px 0 10px}
body[data-page=assistant] .aip-tabs button{min-height:40px;height:auto;background:var(--r1-chip);border-color:var(--r1-line);color:var(--r1-ink);font-size:14px}
body[data-page=assistant] .aip-tabs button.on,body[data-page=assistant] .aip-tabs button[aria-selected=true]{background:var(--r1-brand)!important;border-color:var(--r1-brand)!important;color:#fff!important}
body[data-page=assistant] .aip-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
body[data-page=assistant] .aip-ex{background:var(--r1-chip)!important;border:1px solid var(--r1-line);border-radius:14px;min-height:84px;box-shadow:none}
body[data-page=assistant] .aip-ex:hover{transform:none;border-color:color-mix(in srgb,var(--r1-brand) 45%,var(--r1-line));background:var(--r1-chip-h)!important}
body[data-page=assistant] .aip-exb{background:transparent!important;color:var(--r1-ink);padding:14px;border-radius:14px}
body[data-page=assistant] .aip-ext b{color:var(--r1-ink);font-size:15px}
body[data-page=assistant] .aip-ext small{color:var(--r1-mut);font-size:13.5px}
body[data-page=assistant] .aip-exo{display:none!important}

/* ---- composer: one rounded box; tools and model live inside it ---- */
body[data-page=assistant] .a-row{align-items:flex-end;gap:6px;background:var(--r1-chip);border:1px solid var(--r1-line);border-radius:22px;padding:6px;box-shadow:0 1px 2px rgba(27,25,48,.04),0 8px 24px -14px rgba(42,31,110,.25)}
html.yd body[data-page=assistant] .a-row{box-shadow:none}
body[data-page=assistant] .a-row:focus-within{border-color:var(--r1-focus);box-shadow:0 0 0 3px color-mix(in srgb,var(--r1-focus) 22%,transparent)}
body[data-page=assistant] .a-row textarea{border:0!important;box-shadow:none!important;background:transparent!important;color:var(--r1-ink);font-size:16px;min-height:44px;padding:11px 6px}
body[data-page=assistant] .a-row textarea::placeholder{color:var(--r1-mut)}
body[data-page=assistant] .a-row .y-ib{width:44px;height:44px;min-width:44px;border-radius:14px;color:var(--r1-mut);background:transparent}
body[data-page=assistant] .a-row #a-send{border-radius:14px;background:var(--r1-brand)!important;color:#fff!important}
body[data-page=assistant] .a-row #a-send:disabled{opacity:.55}
.ar1-tbtn{position:relative;display:inline-grid;place-items:center;width:44px;height:44px;min-width:44px;border:0;border-radius:14px;background:transparent;color:var(--r1-mut);cursor:pointer}
.ar1-tbtn:hover,body[data-page=assistant] .a-row .y-ib:hover{background:var(--r1-chip-h);color:var(--r1-ink)}
.ar1-tbtn svg{width:22px;height:22px}
.ar1-tbtn[aria-expanded=true]{background:var(--r1-chip-h);color:var(--r1-brand-ink)}
.ar1-tbtn .dot{position:absolute;top:9px;inset-inline-end:9px;width:8px;height:8px;border-radius:50%;background:var(--r1-brand);display:none}
.ar1-tbtn.has .dot{display:block}
.ar1-tools{position:absolute;bottom:calc(100% - 2px);inset-inline-start:max(12px,calc((100% - 784px) / 2));z-index:30;width:min(360px,calc(100% - 24px));background:var(--r1-surf);color:var(--r1-ink);border:1px solid var(--r1-line);border-radius:16px;padding:14px;box-shadow:0 18px 44px -12px rgba(20,16,50,.35)}
.ar1-tools[hidden]{display:none}
.ar1-tools h3{margin:0 0 8px;font-size:13px;font-weight:700;color:var(--r1-mut)}
.ar1-tools .aix-top{display:block!important;margin:0!important;padding:0!important;border:0!important;background:none!important;position:static!important}
.ar1-tools .aix-ctx{display:flex!important;flex-direction:column;align-items:stretch;gap:6px;margin:0 0 14px!important;background:none!important;border:0!important;padding:0!important}
.ar1-tools .aix-ctxl{font-size:13px;font-weight:700;color:var(--r1-mut)}
.ar1-tools select{width:100%;min-height:44px;border-radius:12px;border:1px solid var(--r1-line);background:var(--r1-chip);color:var(--r1-ink);padding:0 10px;font-family:inherit;font-size:15px}
.ar1-tools .aix-chips{display:flex!important;flex-wrap:wrap;gap:8px;overflow:visible!important;-webkit-mask-image:none!important;mask-image:none!important;padding:0!important}
.ar1-tools .aix-chip{min-height:40px;padding:0 14px;border-radius:999px;border:1px solid var(--r1-line)!important;background:var(--r1-chip)!important;color:var(--r1-ink)!important;font-family:inherit;font-weight:600;font-size:14px;cursor:pointer}
.ar1-tools .aix-chip:hover{background:var(--r1-chip-h)!important}
body[data-page=assistant] .a-main > .aix-top{display:none!important}
/* model picker: one small line under the box */
body[data-page=assistant] .aip-mrow-a{margin:6px 6px 0!important;padding:0!important;border:0!important;background:none!important;font-size:13px!important;min-height:0!important;justify-content:flex-start}
body[data-page=assistant] .aip-mrow-a button{min-height:44px;height:44px;padding:0 12px;font-size:13px!important;border-radius:999px;background:transparent!important;border:1px solid var(--r1-line)!important;color:var(--r1-mut)!important}
body[data-page=assistant] .aip-mrow-a button:hover{color:var(--r1-ink)!important;background:var(--r1-chip-h)!important}

/* ---- conversation: one readable column, bubbles in theme ---- */
body[data-page=assistant] .a-msg{font-size:15.5px;line-height:1.75;max-width:min(88%,640px)}
body[data-page=assistant] .a-msg.u{background:var(--r1-user)!important;color:var(--r1-user-ink)!important}
body[data-page=assistant] .a-msg.a{background:var(--r1-soft)!important;color:var(--r1-ink)!important;border:0}
body[data-page=assistant] .a-act{background:var(--r1-surf);border-color:var(--r1-line);color:var(--r1-ink)}
body[data-page=assistant] .a-act .tx span{color:var(--r1-mut)}
/* progress: inline, in the theme, readable (was a white card on the dark page with tiny text) */
body[data-page=assistant] .a-msg.aiux-prog{background:var(--r1-soft)!important;border:1px solid var(--r1-line)!important;box-shadow:none!important;color:var(--r1-ink)!important;padding:14px 16px;min-width:min(320px,88%)}
body[data-page=assistant] .aiux-prog .aiux-steps{margin:0;padding:0;display:grid;gap:8px}
body[data-page=assistant] .aiux-prog .aiux-steps li{font-size:15px!important;color:var(--r1-mut)!important}
body[data-page=assistant] .aiux-prog .aiux-steps li.on{color:var(--r1-ink)!important;font-weight:700}
body[data-page=assistant] .aiux-prog .aiux-steps li.ok{color:var(--r1-ink)!important}
body[data-page=assistant] .aiux-prog .aiux-steps li i{border-color:var(--r1-line)!important}
body[data-page=assistant] .aiux-prog .aiux-bar{background:var(--r1-line)!important;margin-top:12px}
body[data-page=assistant] .aix-bar .aix-b{min-height:40px;background:var(--r1-chip);color:var(--r1-ink);border-color:var(--r1-line)}

/* ---- phones ---- */
@media (max-width:760px){
  body[data-page=assistant] .a-main{border:0;border-radius:0}
  body[data-page=assistant] .a-hero h2{font-size:24px}
  body[data-page=assistant] .a-hero .a-hico{width:46px;height:46px;margin-bottom:10px}
  .ar1-sug{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:18px}
  .ar1-chip{justify-content:center;border-radius:14px;padding:0 10px;font-size:14.5px;min-height:48px}
  body[data-page=assistant] .aip-grid{grid-template-columns:1fr}
  body[data-page=assistant] .a-msg{font-size:15.5px;max-width:92%}
  body[data-page=assistant] .a-comp{padding:8px 10px calc(10px + env(safe-area-inset-bottom,0px))}
  .ar1-tools{inset-inline:10px;width:auto}
}
@media (prefers-reduced-motion:reduce){.ar1-chip,.ar1-chip:active{transition:none;transform:none}}

/* desktop empty state: greeting + box together in the middle (the box drops to the bottom once a conversation starts) */
@media (min-width:761px){
  body[data-page=assistant] .a-main:has(#a-log > .a-hero:not(.ar1-open)){justify-content:center}
  body[data-page=assistant] .a-main:has(#a-log > .a-hero:not(.ar1-open)) .a-log{flex:0 0 auto;overflow:visible;padding-top:0}
  body[data-page=assistant] .a-main:has(#a-log > .a-hero:not(.ar1-open)) .a-head{position:absolute;top:0;inset-inline:0}
  body[data-page=assistant] .a-main{position:relative}
}

body[data-page=assistant] .a-hero{display:flex;flex-direction:column;align-items:center}
body[data-page=assistant] .a-hero > *{max-width:100%}
body[data-page=assistant] .a-hero .aip-gal{width:100%}
html[lang=ar] body[data-page=assistant] #a-ths:empty::after{content:"محادثاتك تُحفظ هنا."}
html[lang=en] body[data-page=assistant] #a-ths:empty::after{content:"Your conversations are saved here."}
body[data-page=assistant] #a-ths:empty::after{display:block;padding:10px 8px;color:var(--r1-mut);font-size:14px}

/* Arabic: the box starts from the right even before typing (dir=rtl set by assist-r1.js); each line still follows its own text */
body[data-page=assistant] #a-in{unicode-bidi:plaintext}

/* assist-r2: streamed answer — words appear as they arrive; a document being written shows live under the reply */
body[data-page=assistant] .a-msg.a-live .aix-body>:last-child:not(ul):not(ol):not(table)::after,body[data-page=assistant] .a-msg.a-live .aix-body>:is(ul,ol):last-child>li:last-child::after,body[data-page=assistant] .a-msg.a-live .aix-body:empty::after{content:"";display:inline-block;width:8px;height:1.05em;margin-inline-start:3px;vertical-align:-2px;background:currentColor;opacity:.55;border-radius:2px;animation:r2blink 1s steps(2,start) infinite}
body[data-page=assistant] .a-msg.a-live:has(.a-wr) .aix-body>:last-child::after{display:none}
@keyframes r2blink{to{visibility:hidden}}
body[data-page=assistant] .a-wr{margin-top:10px;border:1px solid var(--r1-line);border-radius:12px;background:var(--r1-surf);overflow:hidden;white-space:normal}
body[data-page=assistant] .a-wr-h{display:flex;align-items:center;gap:8px;padding:9px 12px;font-size:14.5px;font-weight:700;color:var(--r1-ink);border-bottom:1px solid var(--r1-line)}
body[data-page=assistant] .a-wr-h i{width:14px;height:14px;border-radius:50%;border:2px solid var(--r1-line);border-top-color:var(--r1-brand);animation:r2spin .8s linear infinite;flex:none}
@keyframes r2spin{to{transform:rotate(360deg)}}
body[data-page=assistant] .a-wr-t{max-height:220px;overflow:auto;padding:10px 12px;font-size:14.5px;line-height:1.75;color:var(--r1-ink);white-space:pre-wrap;opacity:.9}
@media (prefers-reduced-motion:reduce){body[data-page=assistant] .a-msg.a-live::after,body[data-page=assistant] .a-wr-h i{animation:none}}

/* nov9fix2: on phones the open tools panel covers «أمثلة أكثر»; hide that link while the panel is open */@media (max-width:700px){body:has(#ar1-tools:not([hidden])) .ar1-more{visibility:hidden}}
