/* OfflineLiveLMS - front end. Logical properties so RTL (Arabic) works automatically. */
.oll { --oll-accent:#1d6fd8; --oll-accent-d:#1659ae; --oll-wa:#1fa855; --oll-border:#dcdfe4; --oll-muted:#5b6470; box-sizing:border-box; max-width:100%; }
.oll *, .oll *::before, .oll *::after { box-sizing:inherit; }
.oll [hidden] { display:none !important; }

.oll-btn { display:inline-block; padding:.65em 1.2em; border:0; border-radius:8px; background:var(--oll-accent); color:#fff !important; font:inherit; font-weight:600; line-height:1.2; text-decoration:none !important; cursor:pointer; transition:background .15s; }
.oll-btn:hover, .oll-btn:focus { background:var(--oll-accent-d); }
.oll-btn[disabled] { opacity:.6; cursor:wait; }
.oll-btn--wa { background:var(--oll-wa); } .oll-btn--wa:hover, .oll-btn--wa:focus { background:#168a45; }
.oll-btn--ghost { background:transparent; color:var(--oll-accent) !important; box-shadow:inset 0 0 0 1px var(--oll-accent); }
.oll-btn--ghost:hover { background:rgba(29,111,216,.08); }
.oll-btn--small { padding:.45em .9em; font-size:.9em; }

.oll-auth { max-width:440px; margin-inline:auto; padding:1.25rem; border:1px solid var(--oll-border); border-radius:12px; background:#fff; }
.oll-tabs { display:flex; gap:.25rem; margin-block-end:1rem; border-block-end:1px solid var(--oll-border); }
.oll-tab { flex:1; padding:.7em; border:0; border-block-end:3px solid transparent; background:none; font:inherit; font-weight:600; color:var(--oll-muted); cursor:pointer; }
.oll-tab.is-active { color:var(--oll-accent); border-block-end-color:var(--oll-accent); }
.oll-form p { margin:0 0 .9rem; }
.oll-form label { display:block; margin-block-end:.3rem; font-weight:600; font-size:.92em; }
.oll-form input[type=text], .oll-form input[type=email], .oll-form input[type=tel], .oll-form input[type=password] { width:100%; padding:.65em .8em; border:1px solid #b9bfc7; border-radius:8px; font:inherit; background:#fff; }
.oll-form input:focus { outline:2px solid var(--oll-accent); outline-offset:1px; }
.oll-inline { display:flex; justify-content:space-between; gap:1rem; flex-wrap:wrap; font-size:.9em; }
.oll-inline label { display:inline; font-weight:400; }
.oll-hp { position:absolute !important; inset-inline-start:-9999px; width:1px; height:1px; overflow:hidden; }

.oll-msg:empty { display:none; }
.oll-msg { padding:.6em .8em; border-radius:8px; font-size:.92em; background:#fdecea; color:#8a1f17; }
.oll-msg.is-ok { background:#e8f6ec; color:#17602d; }
.oll-actions .oll-msg { display:block; margin-block-start:.5rem; }

.oll-grid { display:grid; gap:1.25rem; grid-template-columns:repeat(auto-fill,minmax(260px,1fr)); }
.oll-cols-1 { grid-template-columns:1fr; }
.oll-cols-2 { grid-template-columns:repeat(auto-fill,minmax(300px,1fr)); }
@media (min-width:900px) { .oll-cols-2 { grid-template-columns:repeat(2,1fr); } .oll-cols-3 { grid-template-columns:repeat(3,1fr); } .oll-cols-4 { grid-template-columns:repeat(4,1fr); } }

.oll-card { display:flex; flex-direction:column; border:1px solid var(--oll-border); border-radius:12px; overflow:hidden; background:#fff; }
.oll-card__img img { display:block; width:100%; height:180px; object-fit:cover; }
.oll-card__body { display:flex; flex-direction:column; gap:.6rem; padding:1rem 1.1rem 1.2rem; flex:1; }
.oll-card__title { margin:0; font-size:1.15em; line-height:1.3; }
.oll-card__title a { color:inherit; text-decoration:none; }
.oll-card__excerpt { margin:0; color:var(--oll-muted); font-size:.95em; }
.oll-actions { margin-block-start:auto; padding-block-start:.4rem; }

.oll-tag { align-self:flex-start; padding:.15em .6em; border-radius:99px; font-size:.78em; font-weight:700; background:#eaf2fd; color:var(--oll-accent-d); }
.oll-tag--live_online { background:#f3eafd; color:#6a2fb0; }
.oll-tag--recorded { background:#fdf3e4; color:#9a5b00; }

.oll-meta { margin:0; display:grid; gap:.3rem; font-size:.92em; }
.oll-meta div { display:flex; gap:.5rem; }
.oll-meta dt { color:var(--oll-muted); min-width:7.5em; }
.oll-meta dd { margin:0; font-weight:600; }

.oll-detail { padding:.7rem .9rem; margin-block-start:.4rem; border-inline-start:4px solid var(--oll-accent); background:#f5f9ff; border-radius:6px; font-size:.94em; }
.oll-note { margin:.4rem 0; color:var(--oll-muted); font-size:.92em; }

.oll-badge { display:inline-block; padding:.25em .75em; border-radius:99px; font-size:.85em; font-weight:700; }
.oll-badge--active { background:#e8f6ec; color:#17602d; }
.oll-badge--pending { background:#fff4d6; color:#8a5a00; }
.oll-badge--rejected { background:#fdecea; color:#8a1f17; }

.oll-panel { margin-block-start:2rem; padding:1.25rem; border:1px solid var(--oll-border); border-radius:12px; }
.oll-dash-head { display:flex; justify-content:space-between; align-items:center; gap:1rem; flex-wrap:wrap; margin-block-end:1rem; }
.oll-dash-head h2 { margin:0; }
.oll-dashboard h3 { margin-block:1.8rem .8rem; }