/* ============================================================================
   admin.css — the masjid console's own layer.

   Everything shared with the business console lives in console.css, which is
   a verbatim copy of the marketing site's and must stay that way. This file
   is what is genuinely particular to a seven-tab masjid panel, plus a few
   compatibility aliases. It is never copied anywhere.
   ========================================================================= */

/* ---- Compatibility aliases ------------------------------------------------
   admin.js toggles `hide` in roughly fifty places. Renaming every one of them
   to `c-hide` would be a large, purely mechanical diff through the one file
   that most needs to stay readable across a branch merge, for no behavioural
   gain — so the old name is simply aliased to the new one. Markup written
   from here on uses c-hide; the two are interchangeable.
   ------------------------------------------------------------------------ */
.hide{display:none!important}

/* ---- Topbar and login signature ---------------------------------------- */
/* The masjid leads; Ikhaa signs. This is the second of the two places the
   Ikhaa mark appears (the footer is the other) — deliberately quiet, and
   deliberately present, so a committee member always knows whose tool this
   is and who to contact. */
.admin-signature{
  display:flex;align-items:center;justify-content:center;gap:var(--c-s2);
  color:var(--c-muted);font-size:var(--c-text-sm);
  margin:0 0 var(--c-s6);
}
.admin-signature img{opacity:.85}

/* ---- Cards -------------------------------------------------------------- */
/* Sub-heading inside a card — the per-business offers block. */
.sub{
  margin:var(--c-s5) 0 var(--c-s3);padding-top:var(--c-s4);
  border-top:1px solid var(--c-line-subtle);
}

/* The demo-import buttons delete a whole collection behind a single
   confirm(), with no undo, and sit directly above the real content list.
   They are kept (both masjids may still be seeding) but deliberately not
   made attractive — secondary, small, and pushed to the right of the
   heading rather than sitting above the list like a primary action. */
.demo-btn{margin-left:auto}

/* ---- Prayer times ------------------------------------------------------- */
.pt-check{width:44px}
/* The AM/PM select and the Apply button should not stretch to a third of the
   bar the way the two text fields do. */
.applybar-narrow{flex:0 0 auto!important;min-width:100px}
.c-applybar .applybar-narrow .c-btn{margin-top:22px}
@media (max-width:640px){
  .c-applybar .applybar-narrow .c-btn{margin-top:0;width:100%}
  .applybar-narrow{flex:1 1 100%!important}
}

/* ---- Row metadata ------------------------------------------------------- */
/* The business-account line under a listed business ("login: a@b.co.uk"). */
.acct{display:block;color:var(--c-subtle);font-size:var(--c-text-caption);margin-top:2px}

/* The view counter on a post. Tabular so a list of counts reads as a column
   rather than a ragged edge. */
.views{font-variant-numeric:tabular-nums;white-space:nowrap}

/* ---- Approvals ---------------------------------------------------------- */
/* The rejection-reason box shown inline on a submission. */
.reject-box{margin-top:var(--c-s2)}
.reject-box .c-control{margin-bottom:var(--c-s2)}

/* ---- Inline mini-forms -------------------------------------------------- */
/* Replaces prompt() for the two places that asked for real data: a business
   login's email address, and a new password for an admin. prompt() cannot be
   labelled, validated, styled or made to explain itself. */
.mini-form{margin-top:var(--c-s2);width:100%}
.mini-form .c-field{margin-bottom:var(--c-s2)}

/* ---- Wide screens ------------------------------------------------------- */
/* Above 900px the nav is a rail and the drawer machinery is inert, so the
   console can use the width it has. Every tab was previously locked to a
   760px column behind a hamburger even at 1440px. */
@media (min-width:900px){
  .c-wrap--wide{padding-top:var(--c-s5)}
}
