/* mail-calm28.css — nov9r28 density round (owner, 9 Nov 2026: «أشعر أن كثافة العناصر مزعجة»). A calmer Mail screen; every function stays reachable within one extra tap. */
/* 1. toolbar: primary actions only, icons + tooltips; the rest in «المزيد» */
.ymm-rib.ymm-dk{display:flex;align-items:center;gap:4px;position:relative;flex-wrap:nowrap}
.ymm-rib.ymm-dk .ymm-row{display:flex;align-items:center;gap:2px;flex-wrap:nowrap}
.ymm-rib.ymm-dk .ymm-row .ymm-rb:not(.pri) span,.ymm-rib.ymm-dk .ymm-mb span{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.ymm-rib.ymm-dk .ymm-row .ymm-rb:not(.pri),.ymm-rib.ymm-dk .ymm-mb{min-width:44px;min-height:44px;padding:0;justify-content:center;border-radius:12px}
.ymm-rib.ymm-dk .ymm-more{position:absolute;top:calc(100% + 6px);inset-inline-end:0;z-index:60;min-width:220px;display:flex;flex-direction:column;gap:2px;padding:6px;background:var(--card,#fff);color:inherit;border:1px solid var(--line,#ddd);border-radius:14px;box-shadow:0 12px 32px rgba(20,16,50,.18)}
.ymm-rib.ymm-dk .ymm-more[hidden]{display:none}
.ymm-rib.ymm-dk .ymm-more .ymm-rb{justify-content:flex-start;width:100%;min-height:44px;padding:0 12px;gap:10px}
.ymm-rib.ymm-dk .ymm-more .ymm-rb span{position:static;width:auto;height:auto;clip:auto}
html.dark .ymm-rib.ymm-dk .ymm-more{background:#1d1b2a;border-color:#3a3650}
.ymm-rib.ymm-inhdr{margin-inline-start:12px;margin-inline-end:auto;padding:0;border:0;background:none;box-shadow:none;min-height:0}
body.ymm-rib-hdr #view > .ymm-rib{display:none}
/* the rail's own «رسالة جديدة» duplicates the toolbar's on a wide screen */
@media (min-width:821px){ body.ymm-rib-hdr #rail > [data-compose]{display:none} }
/* the reading pane's icon row repeats archive / delete / move / unread from the toolbar */
@media (min-width:821px){ body.ymm-rib-hdr #read .rtool [data-a=archive],body.ymm-rib-hdr #read .rtool [data-a=delete],body.ymm-rib-hdr #read .rtool [data-a=move],body.ymm-rib-hdr #read .rtool [data-a=unread]{display:none} }
/* 3. header: one row; theme, language and balance are in the account menu */
@media (min-width:821px){
  #hdr #yo-thm26,#hdr #yo-mot,#hdr #acct .yo-lang120,#hdr #acct [data-wal]{display:none!important}
  #hdr #ymm-sw > span:not(.ic):not(svg){position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
  #hdr #ymm-sw{min-width:44px;min-height:44px;justify-content:center}
}
/* 4. message list: more air, one line of preview, one label */
#items .it{padding-block:12px}
#items .it .r3{display:flex;align-items:center;gap:8px;min-width:0}
#items .it .r3 .sn{display:block;flex:1 1 auto;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;-webkit-line-clamp:unset}
#items .it .r3 .chip.ok{display:none}
#items .it .r3 .chip ~ .chip{display:none}
/* 5. folders: secondary folders and labels fold away; more spacing */
#rail .folders .fi{min-height:44px}
#rail .folders{gap:2px}
#rail [data-c28h]{display:none!important}
#rail .c28-more{display:flex;align-items:center;gap:8px;width:100%;min-height:44px;padding:0 12px;border:0;border-radius:12px;background:transparent;color:inherit;font:inherit;cursor:pointer;text-align:start}
#rail .c28-more:hover{background:rgba(127,127,127,.12)}
#rail .c28-more:focus-visible{outline:3px solid #5b3fd0;outline-offset:2px}
#rail .c28-more .c28-chev{transition:transform .15s;display:inline-block}
#rail .c28-more[aria-expanded=true] .c28-chev{transform:rotate(180deg)}

/* nov9r28: with the toolbar in the header there is no second row to reserve */
body.ymm-rib-hdr #view{padding-top:0!important}
body.ymm-rib-hdr.ymm-outlook .mail{height:calc(100dvh - 58px)!important}
.ymm-rib.ymm-inhdr{height:auto!important;align-self:center;overflow:visible!important}
.ymm-rib.ymm-inhdr .ymm-rb.pri{flex-direction:row!important;gap:6px;padding:0 16px!important;min-height:40px;height:40px;border-radius:20px;font-size:14px!important;white-space:nowrap}
.ymm-rib.ymm-inhdr .ymm-rb.pri span{font-size:14px!important}
.ymm-rib.ymm-inhdr .ymm-row{gap:4px}

/* nov9r28 v3: one line of subject and one line of preview, whatever earlier layers set */
#items .it .r2 .sub{display:block!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important;-webkit-line-clamp:none!important}
#items .it .r3 .sn{display:block!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important;-webkit-line-clamp:none!important;max-height:none!important}
#items .it .r2,#items .it .r3{min-width:0;max-width:100%}
#items .it .ib{min-width:0}
