/* Rosy AI: the only page-specific CSS. Loaded after the site's tokens/base/components/layout, so it only
   adds what the site system does not already have (wizard, result cards, chat, tab bar glue). */

/* Hero photo: the site's own page-hero--art banner pattern; smaller crop on phones. */
.rosy-hero__media{background-image:url("img/rosy-hero-wide.webp");opacity:.55}
@media (max-width:720px){.rosy-hero__media{background-image:url("img/rosy-hero-560.webp")}}
/* "by La Rose Wellness Hub" is an English phrase: laid out LTR, but pinned to the RTL start edge. */
.rosy-by{display:flex;align-items:center;justify-content:flex-end;flex-wrap:wrap;gap:.6rem;margin-top:1.25rem;color:rgba(246,244,236,.82);font-size:var(--t-sm);max-width:40rem}
[dir="ltr"] .rosy-hero .rosy-by{justify-content:flex-start}
.rosy-by img{block-size:1.75rem;inline-size:auto}

.rosy-wrap{max-inline-size:45rem;margin-inline:auto}
.rosy-tabs{margin-bottom:1.5rem;justify-content:center}
.rosy-panel[hidden]{display:none}
.rosy-panel>*+*{margin-top:1.25rem}
.rosy-head{margin-bottom:.75rem}


/* wizard */
.rosy{padding:clamp(1.1rem,.8rem + 1.2vw,1.75rem)}
.rosy__bar{display:flex;align-items:center;justify-content:space-between;gap:.75rem;min-block-size:2.75rem;margin-bottom:1rem}
.rosy__back{min-block-size:2.75rem;min-inline-size:2.75rem}
.rosy__dots{display:flex;gap:.5rem;list-style:none;margin:0;padding:0;margin-inline-start:auto}
.rosy__dot{inline-size:.6rem;block-size:.6rem;border-radius:var(--r-pill);background:var(--paper-deep);transition:background .2s,inline-size .2s}
.rosy__dot.is-done{background:var(--olive-400,#9A9C72)}
.rosy__dot.is-current{background:var(--rose-600);inline-size:1.5rem}
.rosy__bubble{font-family:var(--font-head);font-size:var(--t-lg);color:var(--ink-strong);line-height:1.5;margin:0 0 1rem;outline:0}
.rosy__answers{display:flex;flex-wrap:wrap;gap:.4rem;margin:0 0 .85rem}
.rosy__answer{font-size:var(--t-xs);padding:.25rem .7rem;border-radius:var(--r-pill);background:var(--olive-050);color:var(--olive-900);border:1px solid var(--olive-100)}
.rosy__options{display:flex;flex-wrap:wrap;gap:.6rem}
.rosy .chip,.rosy-chips .chip{cursor:pointer;font:inherit;font-size:var(--t-sm);min-block-size:2.75rem;padding-inline:1.1rem;color:var(--ink)}
.rosy .chip:hover,.rosy-chips .chip:hover{border-color:var(--olive-400,#9A9C72)}
.rosy .chip[aria-pressed="true"],.rosy-chips .chip[aria-pressed="true"]{background:var(--olive-700);border-color:var(--olive-700);color:#fff}
.rosy__again{display:flex;flex-wrap:wrap;gap:.6rem;margin-top:1.25rem}
.rosy__again .btn{flex:1 1 9rem;min-block-size:2.75rem}

/* result and menu cards */
.rosy-results,.rosy-grid{display:grid;gap:1rem}
@media (min-width:900px){.rosy-panel[data-panel="menu"]{margin-inline:-6rem}.rosy-grid{grid-template-columns:repeat(2,1fr)}}
.rosy-card,.meal-card{overflow:visible}
.rosy-card:hover,.meal-card:hover{transform:none}
.rosy-card__top,.card-top{display:flex;align-items:flex-start;justify-content:space-between;gap:.5rem}
.rosy-card__branch,.branch{margin:0;font-size:var(--t-xs);color:var(--ink-faint);font-weight:600;overflow-wrap:anywhere}
.rosy-card__why{margin:0;padding:.55rem .8rem;border-radius:var(--r-md);background:var(--olive-050);color:var(--olive-900);font-size:var(--t-sm)}
.rosy-facts{display:grid;grid-template-columns:repeat(3,1fr);gap:.5rem;margin:0}
.rosy-facts>div{padding:.55rem .6rem;border-radius:var(--r-md);background:var(--paper-sunk);min-inline-size:0}
.rosy-facts dt{font-size:var(--t-xs);color:var(--ink-faint)}
.rosy-facts dd{margin:0;font-weight:700;color:var(--ink-strong);font-size:var(--t-sm);overflow-wrap:anywhere}
.rosy-source{margin:0;font-size:var(--t-xs);color:var(--ink-faint);line-height:1.6}
.protein-ratio{margin:0}
.tags{display:flex;flex-wrap:wrap;gap:.4rem}
.tags .chip{min-block-size:0;padding:.2rem .7rem;font-size:var(--t-xs);cursor:default}
.rosy-actions{display:flex;flex-wrap:wrap;gap:.5rem}
.card__foot.rosy-actions{padding:.25rem clamp(1.15rem,.8rem + 1vw,1.75rem) clamp(1.15rem,.8rem + 1vw,1.75rem)}
.rosy-actions>.btn{flex:1 1 7rem;min-block-size:2.75rem;justify-content:center}
.favorite{inline-size:2.75rem;block-size:2.75rem;min-inline-size:2.75rem;display:inline-grid;place-items:center;border:1px solid var(--olive-100);border-radius:var(--r-pill);background:var(--paper-raised);color:var(--rose-600);font-size:1.25rem;cursor:pointer;flex:none}
.favorite.saved{background:var(--rose-100);border-color:var(--rose-300)}
.rosy-note{margin:0 0 1rem}
.rosy-source bdi{white-space:nowrap}
/* a widened suggestion says why it is there */
.rosy-card__off{align-self:flex-start;margin:0;padding:.2rem .65rem;border-radius:999px;background:var(--rose-100);color:var(--rose-700);font-size:var(--t-xs);font-weight:600}
.rosy-empty{color:var(--ink-muted);padding:1rem 0}

/* chat */
.rosy-qty{display:inline-flex;gap:.4rem;flex:none}
.rosy-chat__show{align-self:flex-start;margin-block:.25rem}
/* assistant-style conversation: header with avatar, bubbles, typing dots, quick replies, pill composer */
.rosy-chat{overflow:hidden}
.rosy-chat__head{display:flex;align-items:center;gap:.75rem;padding:1rem 1.25rem;border-bottom:1px solid var(--olive-100);background:var(--paper-raised)}
.rosy-chat__name{margin:0;font-family:var(--font-head);font-size:var(--t-lg);line-height:1.3;color:var(--ink-strong)}
.rosy-chat__status{display:flex;align-items:center;gap:.4rem;margin:.15rem 0 0;font-size:var(--t-xs);color:var(--ink-muted)}
.rosy-chat__dot{inline-size:.5rem;block-size:.5rem;border-radius:50%;background:var(--olive-600);box-shadow:0 0 0 3px var(--olive-100)}
.rosy-avatar{flex:none;inline-size:2rem;block-size:2rem;border-radius:50%;overflow:hidden;background:var(--olive-500);box-shadow:0 0 0 2px var(--paper-raised)}
.rosy-avatar img{display:block;inline-size:100%;block-size:100%}
.rosy-avatar--lg{inline-size:2.75rem;block-size:2.75rem}
.rosy-messages{display:flex;flex-direction:column;gap:.85rem;min-block-size:17rem;max-block-size:28rem;overflow-y:auto;overscroll-behavior:contain;padding:1.25rem;background:var(--paper-sunk)}
/* chat-app sides: your messages sit at the start of the line (right in Arabic, left in English), Rosy's at the end with her avatar on the outer edge */
.rosy-msg{display:flex;flex-direction:row-reverse;align-items:flex-end;gap:.5rem;max-inline-size:min(88%,36rem);align-self:flex-end}
.rosy-msg--me{flex-direction:row;align-self:flex-start}
.rosy-msg__body{display:flex;flex-direction:column;align-items:flex-end;gap:.35rem;min-inline-size:0}
.rosy-msg--me .rosy-msg__body{align-items:flex-start}
.rosy-bubble{margin:0;padding:.65rem .95rem;border-radius:var(--r-xl);border-end-end-radius:var(--r-sm);background:var(--paper-raised);color:var(--ink);font-size:var(--t-sm);line-height:1.75;box-shadow:0 1px 2px rgba(35,36,26,.07);white-space:pre-line;overflow-wrap:anywhere}
.rosy-msg--me .rosy-bubble{background:var(--olive-700);color:var(--ink-on-dark);border-end-end-radius:var(--r-xl);border-end-start-radius:var(--r-sm)}
.rosy-typing .rosy-bubble{display:flex;gap:.3rem;padding-block:1rem}
.rosy-typing span{inline-size:.45rem;block-size:.45rem;border-radius:50%;background:var(--olive-400);animation:rosy-dot 1s infinite ease-in-out}
.rosy-typing span:nth-child(2){animation-delay:.15s}
.rosy-typing span:nth-child(3){animation-delay:.3s}
@keyframes rosy-dot{0%,80%,100%{opacity:.35;transform:none}40%{opacity:1;transform:translateY(-3px)}}
.rosy-msg{animation:rosy-in .25s ease-out both}
@keyframes rosy-in{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
.rosy-msg--me .rosy-bubble{background:linear-gradient(135deg,var(--olive-600),var(--olive-800))}
.rosy-reply{white-space:normal;display:flex;flex-direction:column;gap:.6rem;inline-size:100%;border:1px solid var(--olive-100)}
.rosy-msg:has(.rosy-reply){max-inline-size:min(94%,38rem)}
.rosy-reply p{margin:0}
.rosy-reply__head{font-weight:600;color:var(--ink-strong)}
.rosy-reply__label{margin-block-start:.25rem;font-size:var(--t-xs);font-weight:600;color:var(--olive-700)}
.rosy-reply__note{font-size:var(--t-xs);color:var(--ink-muted)}
.rosy-reply__note a{color:var(--olive-700);font-weight:600}
.rosy-dishes{display:flex;flex-direction:column;gap:.45rem;margin:0;padding:0;list-style:none;counter-reset:dish}
.rosy-dish{position:relative;display:flex;flex-direction:column;gap:.2rem;padding:.6rem .75rem;padding-inline-start:2.4rem;border-radius:var(--r-md,.75rem);background:var(--paper-sunk);counter-increment:dish}
.rosy-dish::before{content:counter(dish);position:absolute;inset-inline-start:.65rem;inset-block-start:.65rem;display:grid;place-items:center;inline-size:1.3rem;block-size:1.3rem;border-radius:50%;background:var(--olive-600);color:var(--ink-on-dark);font-size:.7rem;font-weight:700;line-height:1}
.rosy-dish__name{font-weight:600;color:var(--ink-strong);line-height:1.5}
.rosy-dish__place{font-size:var(--t-xs);color:var(--ink-muted)}
.rosy-dish__place::before{content:"📍 "}
.rosy-dish__facts{display:flex;flex-wrap:wrap;gap:.3rem;margin-block-start:.15rem}
.rosy-fact{padding:.05rem .55rem;border-radius:var(--r-pill);background:var(--paper-raised);border:1px solid var(--olive-100);font-size:.72rem;line-height:1.7;color:var(--ink)}
.rosy-fact--kcal{border-color:var(--olive-300);color:var(--olive-900)}
.rosy-fact--protein{background:var(--olive-050);border-color:var(--olive-400);color:var(--olive-900);font-weight:600}
.rosy-reply__try{display:flex;flex-wrap:wrap;gap:.35rem}
.rosy-reply__try button{padding:.3rem .8rem;border:1px solid var(--olive-300);border-radius:var(--r-pill);background:var(--paper-raised);color:var(--olive-900);font:inherit;font-size:var(--t-xs);cursor:pointer}
.rosy-reply__try button:hover{background:var(--olive-050);border-color:var(--olive-500)}
.rosy-reply__try button:focus-visible{outline:2px solid var(--olive-700);outline-offset:2px}
.rosy-suggest{display:flex;flex-wrap:wrap;gap:.5rem;padding-inline-start:2.5rem}
.rosy-suggest button{min-block-size:2.75rem;padding:.4rem 1rem;border:1px solid var(--olive-300);border-radius:var(--r-pill);background:var(--paper-raised);color:var(--olive-900);font:inherit;font-size:var(--t-sm);cursor:pointer}
.rosy-suggest button:hover{background:var(--olive-050);border-color:var(--olive-500)}
.rosy-composer{display:flex;align-items:center;gap:.5rem;margin:0;padding:.75rem 1rem;border-top:1px solid var(--olive-100);background:var(--paper-raised)}
.rosy-composer__input{flex:1;min-inline-size:0;min-block-size:2.9rem;padding:.55rem 1.1rem;border:1px solid var(--olive-200);border-radius:var(--r-pill);background:var(--paper);color:var(--ink);font:inherit;font-size:max(16px,var(--t-sm))}
.rosy-composer__input:focus{outline:2px solid var(--olive-500);outline-offset:1px}
.rosy-composer__icon,.rosy-composer__send{flex:none;display:grid;place-items:center;inline-size:2.9rem;block-size:2.9rem;padding:0;border:1px solid var(--olive-200);border-radius:50%;background:var(--paper-raised);color:var(--olive-700);cursor:pointer}
.rosy-composer__send{border-color:var(--olive-700);background:var(--olive-700);color:var(--ink-on-dark)}
.rosy-composer__send:hover{background:var(--olive-900);border-color:var(--olive-900)}
.rosy-composer svg{inline-size:1.3rem;block-size:1.3rem}
.rosy-composer__icon.is-listening{border-color:var(--rose-600);background:var(--rose-600);color:#fff;animation:rosy-pulse 1.4s infinite}
@keyframes rosy-pulse{0%{box-shadow:0 0 0 0 rgba(185,111,114,.45)}100%{box-shadow:0 0 0 12px rgba(185,111,114,0)}}
.rosy-composer button:focus-visible,.rosy-suggest button:focus-visible{outline:2px solid var(--olive-700);outline-offset:2px}
@media (prefers-reduced-motion:reduce){.rosy-typing span,.rosy-composer__icon.is-listening,.rosy-msg{animation:none}}
@media (max-width:480px){.rosy-messages{padding:1rem .85rem;max-block-size:24rem}.rosy-msg{max-inline-size:94%}.rosy-suggest{padding-inline-start:0}.rosy-composer{padding:.65rem .75rem}}

/* menu filters */
.rosy-filters{display:grid;gap:.75rem;margin-bottom:1rem}
@media (min-width:600px){.rosy-filters{grid-template-columns:repeat(3,1fr)}}
.rosy-chips{display:flex;flex-wrap:wrap;gap:.5rem;margin-bottom:1.25rem}
.rosy-orderable{margin-top:1.5rem}
.rosy-orderable__row{display:flex;flex-wrap:wrap;align-items:center;gap:.5rem;padding:.6rem 0;border-top:1px solid var(--olive-100)}
.rosy-orderable__row strong{flex:1 1 100%;font-size:var(--t-sm)}
.rosy-orderable__row span{flex:1 1 100%;font-size:var(--t-xs);color:var(--ink-faint)}
.rosy-orderable__row .btn{min-block-size:2.75rem}

/* current order (shown under the page once a meal is added) */
.rosy-order{margin-top:2rem;scroll-margin-top:6rem}
.rosy-line{display:flex;align-items:center;justify-content:space-between;gap:.5rem;margin:0}
.rosy-line .btn{min-inline-size:2.75rem;min-block-size:2.75rem;justify-content:center}
.rosy-basket .card__title{margin:0}

/* touch targets for the shared site chrome on phones (look unchanged, hit area grows) */
@media (max-width:900px){
 .site-footer a:not(.wordmark):not(.social a),.utility-bar a{display:inline-flex;align-items:center;min-block-size:44px;min-inline-size:44px}
 .site-header .lang-switch.lang-switch--header{min-block-size:44px}
 .site-footer .social a,.social a{min-inline-size:44px;min-block-size:44px;inline-size:44px;block-size:44px}
 .site-header .wordmark,.lang-switch--header{min-block-size:44px;min-inline-size:44px;display:inline-flex;align-items:center;justify-content:center}
}

@media (max-width:600px){
 .rosy-wrap{padding-inline:1rem}
 .rosy-facts{grid-template-columns:1fr 1fr 1fr;gap:.35rem}
 .rosy-facts>div{padding:.45rem}
 .rosy select,.rosy-filters select,.rosy-chips .chip,.rosy .chip,.rosy-actions>*{min-block-size:44px}
 .favorite{min-width:44px;min-height:44px}
 .rosy__bubble{font-size:var(--t-md)}
}