/* My Works library v1 («أعمالي»). Logical properties only, so Arabic mirrors itself.
   Phone breakpoint: 700px (mena_design.css). */
.myWorks{max-width:1180px;margin:18px auto 40px;padding:0;color:var(--mena-text,#f6f8fc)}
.myWorks[hidden]{display:none!important}
.myWorksHead h2{margin:0 0 4px;font-size:26px}
.myWorksHead p{margin:0 0 16px;color:var(--mena-muted,#9eabc6)}
.myWorksVisuallyHidden{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.myWorksTools{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:var(--mena-space-3,12px);align-items:center}
.myWorksSearch input{width:100%;min-height:44px;margin:0;padding:10px 14px;border-radius:var(--mena-radius-m,12px);border:1px solid var(--mena-border,#29395c);background:var(--mena-surface-2,#0c162b);color:inherit;box-sizing:border-box}
.myWorksSelects{display:flex;gap:var(--mena-space-2,8px);flex-wrap:wrap}
.myWorksSelect[hidden]{display:none!important}
.myWorksSelect.isCampaign{max-width:220px;min-width:0}
.myWorksSelect.isCampaign select{width:100%;max-width:220px;text-overflow:ellipsis}
.myWorksSelect select{min-height:44px;margin:0;padding:8px 12px;border-radius:var(--mena-radius-m,12px);border:1px solid var(--mena-border,#29395c);background:var(--mena-surface-2,#0c162b);color:inherit}
.myWorksChips{display:flex;gap:var(--mena-space-2,8px);flex-wrap:wrap;margin:var(--mena-space-4,16px) 0 var(--mena-space-2,8px)}
.myWorksChip{width:auto;min-height:40px;margin:0;padding:8px 14px;border-radius:var(--mena-radius-pill,999px);border:1px solid var(--mena-border,#29395c);background:var(--mena-surface,#111a31);color:inherit;font-size:13px;cursor:pointer}
.myWorksChip.active,.myWorksChip[aria-pressed="true"]{background:var(--mena-accent,#745cff);border-color:var(--mena-accent,#745cff);color:#fff}
.myWorksChip[hidden]{display:none}
.myWorksStatus{margin:var(--mena-space-2,8px) 0;color:var(--mena-muted,#9eabc6)}
.myWorksNote{margin:0 0 var(--mena-space-3,12px);padding:10px 14px;border-radius:var(--mena-radius-m,12px);border:1px solid #5a4a2a;background:#2a2112;color:#f3d9a8}
.myWorksNote[hidden]{display:none}
.myWorksGrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:var(--mena-space-4,16px)}
.myWorksCard{display:flex;flex-direction:column;min-width:0;border:1px solid var(--mena-border,#29395c);border-radius:var(--mena-radius-l,16px);background:var(--mena-surface,#111a31);overflow:hidden}
.myWorksThumb{position:relative;aspect-ratio:4/5;background:#0a1324;display:flex;align-items:center;justify-content:center;overflow:hidden}
.myWorksThumb img,.myWorksThumb video{width:100%;height:100%;object-fit:cover;display:block;background:#000}
.myWorksThumb.isText{align-items:flex-start;padding:48px 18px 18px;box-sizing:border-box;background:linear-gradient(160deg,#16244a,#0c162b)}
.myWorksTextThumb{margin:0;font-size:15px;line-height:1.6;display:-webkit-box;-webkit-line-clamp:9;-webkit-box-orient:vertical;overflow:hidden;overflow-wrap:anywhere}
.myWorksTypeChip{position:absolute;inset-block-start:10px;inset-inline-start:10px;padding:4px 10px;border-radius:var(--mena-radius-pill,999px);background:rgba(7,16,31,.86);border:1px solid rgba(255,255,255,.18);font-size:12px;font-weight:600;pointer-events:none}
.myWorksBody{display:flex;flex-direction:column;gap:6px;padding:12px 14px 14px;min-width:0}
.myWorksCardTitle{font-size:15px;line-height:1.45;overflow-wrap:anywhere;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.myWorksMeta{display:flex;flex-wrap:wrap;gap:4px 10px;color:var(--mena-muted,#9eabc6)}
.myWorksPublished{color:var(--mena-success,#45d6ad)}
.myWorksFailed{color:var(--mena-danger,#ff8a8a);font-weight:600}
.myWorksCaption{margin:0;color:#cfd7ea;font-size:13px;line-height:1.55;overflow-wrap:anywhere;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.myWorksActions{display:flex;flex-wrap:wrap;gap:6px;margin-top:4px}
.myWorksAction{display:inline-flex;align-items:center;justify-content:center;width:auto;min-height:44px;margin:0;padding:8px 12px;border-radius:var(--mena-radius-m,12px);border:1px solid #34496e;background:#16233e;color:#fff;font-size:13px;text-decoration:none;cursor:pointer}
.myWorksAction:hover{border-color:var(--mena-accent,#745cff)}
.myWorksSlides{display:grid;grid-template-columns:repeat(auto-fill,minmax(120px,1fr));gap:8px;margin:0;padding:0 14px 14px;list-style:none}
.myWorksSlides li{display:flex;flex-direction:column;gap:6px;min-width:0}
.myWorksSlides img{width:100%;height:auto;border-radius:var(--mena-radius-s,8px)}
.myWorksEmpty{grid-column:1/-1;display:flex;flex-direction:column;align-items:center;gap:10px;padding:40px 16px;border:1px dashed var(--mena-border,#29395c);border-radius:var(--mena-radius-l,16px);text-align:center}
.myWorksEmpty small{color:var(--mena-muted,#9eabc6)}
.myWorksEmptyIcon{font-size:26px;color:var(--mena-accent,#745cff)}
.myWorksMore{display:flex;justify-content:center;margin-top:var(--mena-space-4,16px)}
@media(max-width:700px){
 .myWorks{margin-top:10px}
 .myWorksHead h2{font-size:22px}
 .myWorksTools{grid-template-columns:1fr}
 .myWorksSelects{display:grid;grid-template-columns:repeat(2,minmax(0,1fr))}
 .myWorksSelect.isCampaign{grid-column:1/-1;max-width:none}
 .myWorksSelect.isCampaign select{max-width:none}
 .myWorksSelect select{width:100%;padding-inline:8px;font-size:13px}
 .myWorksChips{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;padding-bottom:4px}
 .myWorksChips::-webkit-scrollbar{display:none}
 .myWorksChip{flex:none}
 .myWorksGrid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
 .myWorksBody{padding:10px}
 .myWorksCaption{display:none}
 .myWorksAction{flex:1 1 calc(50% - 3px);min-width:0;font-size:12px;padding-inline:4px}
}
@media(max-width:380px){.myWorksGrid{grid-template-columns:1fr}}
@media(prefers-reduced-motion:reduce){.myWorks *{transition:none!important;animation:none!important}}