/* Ejaaba Groups shares base.html, nav, footer, profile and original site fonts. */
.groups-shell{direction:rtl;max-width:1120px;margin:0 auto;padding:20px 12px 54px;display:grid;gap:17px;min-width:0}
.groups-shell *{box-sizing:border-box}
.groups-breadcrumb{font-size:13px;color:#607281;display:flex;gap:9px;align-items:center}
.groups-breadcrumb a{color:#325e72;text-decoration:none}
.groups-hero{display:flex;justify-content:space-between;align-items:center;gap:16px;border:1px solid #25475c;background:linear-gradient(118deg,#0e293c 0%,#164454 58%,#1b4750 100%);border-radius:19px;padding:28px;color:#fff;overflow:hidden}
.groups-eyebrow{font-size:11px;letter-spacing:.1em;color:#dfcf9e;font-weight:700}
.groups-hero h1{font-size:clamp(27px,5vw,41px);color:#fff;margin:8px 0}
.groups-hero h1 em{font-style:normal;color:#e7d39a}.groups-hero p{max-width:610px;color:#deeaf0;font-size:14px;line-height:1.9;margin:0}
.groups-hero-symbol{font-size:78px;color:#e2c78d;opacity:.85}
.groups-nav{display:flex;gap:6px;flex-wrap:wrap;padding:6px;border-radius:13px;background:var(--ej-surface,#f1f5f8);border:1px solid #d7e2e9}
.groups-nav a{flex:1 0 auto;text-align:center;border-radius:9px;padding:11px 14px;text-decoration:none;color:#29576b;font-size:13px;font-weight:700}
.groups-nav a[aria-current=page],.groups-nav a:hover{background:#143d53;color:white}
.groups-panel{background:var(--ej-card-bg,#fff);color:var(--ej-ink,#263a45);border:1px solid #d9e4e9;border-radius:16px;padding:20px;min-width:0;box-shadow:0 3px 12px #08283d0b}
.groups-panel h2,.groups-panel h3{margin:0;color:inherit}
.groups-heading{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:15px}
.groups-heading h2{font-size:21px;margin-top:5px}.groups-heading span,.groups-mini{font-size:12px;color:#438097}.groups-heading>strong{font-size:13px;color:#446879}
.groups-cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,265px),1fr));gap:12px}
.groups-card{border:1px solid #dae4e9;background:#fff;border-radius:14px;padding:17px;display:flex;flex-direction:column;gap:10px;min-width:0}
.groups-card h3{font-size:17px;color:#153c50}.groups-card a,.groups-topic>a{color:#155b75;font-weight:700;text-decoration:none}
.groups-card p,.groups-lead,.groups-topic p{line-height:1.85;color:#566977;font-size:13px;margin:0;overflow-wrap:anywhere}
.groups-card-symbol{display:grid;place-items:center;width:43px;height:43px;border-radius:12px;background:#eaf3f6;color:#22617c;font-size:24px}
.groups-card-bottom{margin-top:auto;display:flex;justify-content:space-between;align-items:center;font-size:12px;gap:12px}
.groups-card-bottom span,.groups-chip{background:#edf7f5;color:#23695c;border-radius:30px;padding:6px 11px;font-size:12px}
.groups-search{display:grid;gap:7px;margin-bottom:14px}.groups-search label,.groups-form label{font-size:13px;color:#355368;font-weight:700}
.groups-search>div{display:flex;gap:8px}.groups-search input,.groups-form input,.groups-form textarea,.groups-form select{width:100%;border:1px solid #cedce3;background:#fff;border-radius:10px;padding:11px;font:inherit;color:#1c3c4e}
.groups-search button,.groups-primary{border:0;background:linear-gradient(110deg,#12607a,#157b79);color:white;border-radius:10px;padding:11px 17px;font:inherit;font-weight:800;cursor:pointer;white-space:nowrap}
.groups-form{display:grid;gap:14px}.groups-form label{display:grid;gap:7px}.groups-form textarea{resize:vertical}
.groups-info,.groups-mini,.groups-empty,.groups-end{font-size:13px;color:#667c88;line-height:1.85}
.groups-empty{grid-column:1/-1;background:#f3f7f9;border:1px dashed #cbdde5;border-radius:12px;padding:21px;text-align:center}
.groups-empty strong{color:#22475b;font-size:17px}
.groups-columns{display:grid;grid-template-columns:minmax(0,2fr) minmax(240px,1fr);gap:14px;align-items:start}
.groups-main,.groups-side{display:grid;gap:14px;min-width:0}
.groups-topic,.groups-reply{padding:16px 0;border-bottom:1px solid #dfe8ed}
.groups-topic>a{font-size:16px;display:block;margin-bottom:6px}.groups-topic small,.groups-reply small{font-size:11px;color:#718792}
.groups-editor{margin-top:17px;padding:14px;border:1px solid #d6e6e9;border-radius:12px;background:#f7fafb}.groups-editor summary{cursor:pointer;color:#1b6177;font-weight:750}.groups-editor form{margin-top:14px}
.groups-actions{display:flex;gap:8px;flex-wrap:wrap;align-items:center;margin-top:12px}.groups-actions form{display:inline-flex}
.groups-subtle,.groups-request button{border:1px solid #cddfe7;border-radius:8px;background:#f6f9fa;color:#315d6c;padding:8px 12px;cursor:pointer}
.groups-member,.groups-request{display:flex;justify-content:space-between;align-items:center;gap:10px;border-bottom:1px solid #e5ebef;padding:10px 0;font-size:13px}
.groups-member small{font-size:11px;color:#748a95}.groups-request form{display:flex;gap:5px}
.groups-topic-body,.groups-reply p{white-space:pre-wrap;overflow-wrap:anywhere;line-height:2;margin:18px 0;color:#263e49}
.groups-event-summary{display:flex;gap:8px;flex-wrap:wrap;margin-top:15px}.groups-event-summary span{background:#e9f3f6;border-radius:8px;padding:9px 13px;color:#286078}
.groups-alert{border:1px solid #a9d2c4;border-radius:10px;background:#e9f7ef;color:#266448;padding:10px 14px}
.groups-end{display:flex;justify-content:center;gap:16px;flex-wrap:wrap}.groups-end a{color:#296a82}
.groups-shell a:focus-visible,.groups-shell button:focus-visible,.groups-shell input:focus-visible,.groups-shell textarea:focus-visible{outline:3px solid #438eaa;outline-offset:2px}
@media(max-width:760px){.groups-shell{padding:12px 8px 35px}.groups-columns{grid-template-columns:1fr}.groups-hero{padding:20px}.groups-hero-symbol{font-size:44px}.groups-panel{padding:15px}.groups-nav a{font-size:12px;padding:9px 8px}}
@media(max-width:390px){.groups-hero-symbol{display:none}.groups-nav{gap:4px}.groups-nav a{flex:1 1 29%;font-size:11px}.groups-heading h2{font-size:18px}}

.groups-recent{display:grid;gap:8px;margin:0 0 18px}.groups-recent h3{font-size:16px;margin:4px 0}.groups-recent a{display:flex;gap:12px;justify-content:space-between;flex-wrap:wrap;text-decoration:none;background:#f3f8fa;border:1px solid #dce8ec;border-radius:9px;padding:10px 13px;color:#185e75}.groups-recent small{color:#63808d}