/* Certifas Studio: mobile/PWA operations console. */
.mobile-admin {
  --ma-primary: #6559e8;
  --ma-mint: #42cbb4;
  --ma-muted: var(--muted, #68728d);
  --ma-line: color-mix(in srgb, var(--border, #dbe2f0) 78%, transparent);
  --ma-surface: color-mix(in srgb, var(--surface, #fff) 94%, #edf2ff);
  max-width: 1580px;
  margin: 0 auto;
  padding-bottom: 70px;
}
.mobile-admin-kicker {
  display: block;
  margin-bottom: 7px;
  color: var(--ma-primary);
  font-size: .7rem;
  font-weight: 850;
  letter-spacing: .12em;
  text-transform: uppercase;
}
.mobile-admin-hero {
  position: relative;
  overflow: hidden;
  display: grid;
  grid-template-columns: minmax(0, 1fr) 240px;
  gap: 38px;
  align-items: center;
  min-height: 310px;
  padding: clamp(32px, 5vw, 62px);
  border-radius: 31px;
  background:
    radial-gradient(circle at 92% 16%, rgba(95, 244, 214, .22), transparent 30%),
    linear-gradient(137deg, #18213f, #2e3a72 57%, #185866);
  color: #fff;
  box-shadow: 0 26px 70px rgba(25, 34, 75, .23);
}
.mobile-admin-hero h1 {
  max-width: 900px;
  margin: 4px 0 15px;
  font-size: clamp(2.3rem, 4.8vw, 4.8rem);
  line-height: .98;
  letter-spacing: -.055em;
}
.mobile-admin-hero p { max-width: 790px; margin: 0; color: rgba(255, 255, 255, .72); font-size: 1.04rem; line-height: 1.6; }
.mobile-admin-hero .mobile-admin-kicker { color: #82efdb; }
.mobile-admin-hero-art {
  position: relative;
  display: grid;
  place-items: center;
  width: 210px;
  height: 210px;
  margin: auto;
  border: 1px solid rgba(255, 255, 255, .16);
  border-radius: 50%;
  background: rgba(255, 255, 255, .07);
  box-shadow: inset 0 0 0 35px rgba(255, 255, 255, .025), 0 20px 60px rgba(5, 13, 42, .22);
}
.mobile-admin-hero-art svg { width: 74px; height: 74px; color: #92f2df; }
.mobile-admin-hero-art i { position: absolute; width: 18px; height: 18px; border: 4px solid rgba(255, 255, 255, .8); border-radius: 50%; background: #7b70ff; animation: ma-orbit 8s ease-in-out infinite alternate; }
.mobile-admin-hero-art i:last-child { background: #53d6bc; animation-duration: 11s; animation-direction: alternate-reverse; }
@keyframes ma-orbit { from { transform: translate(-80px, -55px); } to { transform: translate(78px, 62px) scale(.75); } }
.mobile-admin-metrics {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 14px;
  margin: 20px 0;
}
.mobile-admin-metrics article {
  display: flex;
  gap: 13px;
  align-items: center;
  min-height: 96px;
  padding: 18px;
  border: 1px solid var(--ma-line);
  border-radius: 20px;
  background: var(--surface, #fff);
  box-shadow: 0 12px 36px rgba(35, 46, 88, .07);
}
.mobile-admin-metrics article > span { display: grid; place-items: center; width: 47px; height: 47px; border-radius: 15px; background: #eeebff; color: var(--ma-primary); }
html[data-theme="dark"] .mobile-admin-metrics article > span { background: #2c2c58; }
.mobile-admin-metrics svg { width: 23px; }
.mobile-admin-metrics article > div { display: flex; flex-direction: column; gap: 3px; }
.mobile-admin-metrics strong { font-size: 1.65rem; line-height: 1; }
.mobile-admin-metrics small { color: var(--ma-muted); }
.mobile-admin-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 17px; margin: 17px 0; }
.mobile-admin-card {
  padding: 24px;
  border: 1px solid var(--ma-line);
  border-radius: 23px;
  background: var(--surface, #fff);
  box-shadow: 0 12px 38px rgba(35, 46, 88, .06);
}
.mobile-admin-card > header { display: flex; justify-content: space-between; gap: 20px; align-items: flex-start; margin-bottom: 20px; }
.mobile-admin-card h2 { margin: 0; font-size: clamp(1.3rem, 2vw, 2rem); letter-spacing: -.035em; }
.mobile-admin-card header p { max-width: 760px; margin: 8px 0 0; color: var(--ma-muted); line-height: 1.5; }
.mobile-admin-pill { border: 1px solid color-mix(in srgb, var(--ma-primary) 20%, var(--ma-line)); border-radius: 999px; padding: 6px 10px; background: #f0edff; color: var(--ma-primary); font-size: .67rem; font-weight: 800; white-space: nowrap; }
html[data-theme="dark"] .mobile-admin-pill { background: #2f2e5c; }
.mobile-platforms { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
.mobile-platforms > div { display: grid; place-items: center; padding: 17px; border: 1px solid var(--ma-line); border-radius: 18px; background: var(--ma-surface); text-align: center; }
.mobile-platforms i { --share: 0; display: grid; width: 74px; height: 74px; margin-bottom: 12px; border-radius: 50%; background: conic-gradient(var(--ma-primary) calc(min(var(--share), 100) * 1%), color-mix(in srgb, var(--ma-primary) 10%, var(--ma-line)) 0); box-shadow: inset 0 0 0 12px var(--surface, #fff); }
.mobile-platforms strong { font-size: 1.5rem; }
.mobile-platforms span { color: var(--ma-muted); font-size: .72rem; }
.mobile-provider-list { display: grid; gap: 10px; }
.mobile-provider-list article { display: grid; grid-template-columns: 43px 1fr auto; gap: 12px; align-items: center; padding: 13px; border: 1px solid var(--ma-line); border-radius: 15px; background: var(--ma-surface); }
.mobile-provider-list article > span { display: grid; place-items: center; width: 43px; height: 43px; border-radius: 14px; background: #ffefdc; color: #a86419; }
.mobile-provider-list article.ready > span { background: #e3f8ee; color: #237857; }
html[data-theme="dark"] .mobile-provider-list article.waiting > span { background: #49341f; color: #ffc27b; }
html[data-theme="dark"] .mobile-provider-list article.ready > span { background: #173d32; color: #75e7c2; }
.mobile-provider-list svg { width: 22px; }
.mobile-provider-list article > div { display: flex; flex-direction: column; gap: 3px; }
.mobile-provider-list small { color: var(--ma-muted); }
.mobile-provider-list b { border-radius: 999px; padding: 6px 9px; background: #fff0de; color: #9a5b17; font-size: .64rem; }
.mobile-provider-list article.ready b { background: #def7ea; color: #1f7653; }
.mobile-admin-events { margin: 17px 0; }
.mobile-event-chart { display: grid; gap: 9px; }
.mobile-event-chart article { display: grid; grid-template-columns: minmax(150px, .5fr) minmax(120px, 1fr) 70px; gap: 12px; align-items: center; }
.mobile-event-chart article > span { overflow: hidden; color: var(--ma-muted); font-size: .75rem; text-overflow: ellipsis; white-space: nowrap; }
.mobile-event-chart article > div { overflow: hidden; height: 10px; border-radius: 999px; background: color-mix(in srgb, var(--ma-primary) 10%, var(--ma-line)); }
.mobile-event-chart i { display: block; height: 100%; border-radius: inherit; background: linear-gradient(90deg, var(--ma-primary), var(--ma-mint)); }
.mobile-event-chart strong { text-align: right; }
.mobile-admin-empty { padding: 24px; border: 1px dashed var(--ma-line); border-radius: 16px; background: var(--ma-surface); }
.mobile-admin-empty p { margin: 6px 0 0; color: var(--ma-muted); }
.mobile-admin form { display: grid; gap: 13px; }
.mobile-admin label { display: flex; flex-direction: column; gap: 7px; color: var(--ma-muted); font-size: .73rem; font-weight: 750; }
.mobile-admin input,
.mobile-admin select,
.mobile-admin textarea {
  width: 100%;
  box-sizing: border-box;
  border: 1px solid var(--ma-line);
  border-radius: 12px;
  padding: 11px 12px;
  background: var(--ma-surface);
  color: var(--text, #17203d);
  font: inherit;
}
.mobile-admin textarea { min-height: 98px; resize: vertical; }
.mobile-admin-reason { margin-top: 3px; }
.mobile-admin-actions { display: flex; justify-content: flex-end; gap: 9px; }
.mobile-admin-switch { flex-direction: row!important; align-items: center; padding: 12px; border: 1px solid var(--ma-line); border-radius: 14px; background: var(--ma-surface); }
.mobile-admin-switch input { width: auto; accent-color: var(--ma-primary); }
.mobile-push-preview { display: flex; gap: 12px; align-items: flex-start; padding: 14px; border: 1px solid var(--ma-line); border-radius: 16px; background: var(--ma-surface); }
.mobile-push-preview > span { display: grid; place-items: center; width: 40px; height: 40px; border-radius: 13px; background: var(--ma-primary); color: #fff; }
.mobile-push-preview svg { width: 20px; }
.mobile-push-preview p { margin: 5px 0; color: var(--ma-muted); line-height: 1.4; }
.mobile-push-preview small { color: var(--ma-primary); font-weight: 750; }
.mobile-admin-table { overflow: auto; border: 1px solid var(--ma-line); border-radius: 16px; }
.mobile-admin-table table { width: 100%; border-collapse: collapse; min-width: 720px; }
.mobile-admin-table th,
.mobile-admin-table td { padding: 13px; border-bottom: 1px solid var(--ma-line); text-align: left; vertical-align: top; }
.mobile-admin-table th { background: var(--ma-surface); color: var(--ma-muted); font-size: .69rem; letter-spacing: .07em; text-transform: uppercase; }
.mobile-admin-table td strong,
.mobile-admin-table td small { display: block; }
.mobile-admin-table td small { max-width: 520px; margin-top: 4px; color: var(--ma-muted); }
.mobile-status { display: inline-flex; border-radius: 999px; padding: 5px 8px; background: #eeeaff; color: var(--ma-primary); font-size: .64rem; font-weight: 850; }
.mobile-status.sent { background: #e0f8ec; color: #217654; }.mobile-status.failed { background: #ffeaed; color: #a93c50; }
.mobile-admin-audit { display: grid; gap: 5px; }
.mobile-admin-audit article { display: grid; grid-template-columns: 190px 1fr auto; gap: 13px; padding: 11px; border-bottom: 1px solid var(--ma-line); }
.mobile-admin-audit span,
.mobile-admin-audit time { color: var(--ma-muted); }
.mobile-admin-toast-region { position: fixed; right: 18px; bottom: 18px; z-index: 10000; display: grid; gap: 8px; width: min(390px, calc(100vw - 36px)); }
.mobile-admin-toast { padding: 13px 15px; border: 1px solid var(--ma-line); border-left: 4px solid var(--ma-primary); border-radius: 14px; background: var(--surface, #fff); box-shadow: 0 18px 48px rgba(22, 30, 65, .22); }
.mobile-admin-toast.success { border-left-color: #31a171; }.mobile-admin-toast.error { border-left-color: #d24d63; }
@media (max-width: 1050px) {
  .mobile-admin-hero { grid-template-columns: 1fr; }
  .mobile-admin-hero-art { display: none; }
  .mobile-admin-metrics { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .mobile-admin-grid { grid-template-columns: 1fr; }
}
@media (max-width: 640px) {
  .mobile-admin-hero { min-height: auto; padding: 28px 20px; border-radius: 24px; }
  .mobile-admin-hero h1 { font-size: clamp(2rem, 11vw, 3.25rem); }
  .mobile-admin-metrics { grid-template-columns: 1fr; }
  .mobile-admin-card { padding: 19px; }
  .mobile-admin-card > header { flex-direction: column; }
  .mobile-platforms { grid-template-columns: 1fr; }
  .mobile-platforms > div { grid-template-columns: 70px 1fr auto; text-align: left; }
  .mobile-platforms i { grid-row: 1/3; width: 58px; height: 58px; margin: 0; box-shadow: inset 0 0 0 10px var(--surface, #fff); }
  .mobile-event-chart article { grid-template-columns: 1fr 60px; }
  .mobile-event-chart article > div { grid-column: 1/-1; }
  .mobile-admin-actions { flex-direction: column; }
  .mobile-admin-actions .button { width: 100%; }
  .mobile-admin-audit article { grid-template-columns: 1fr; }
}
@media (prefers-reduced-motion: reduce) { .mobile-admin-hero-art i { animation: none!important; } }
html[data-motion="off"] .mobile-admin-hero-art i { animation: none!important; }
@media (forced-colors: active) {
  .mobile-admin-hero,
  .mobile-admin-card,
  .mobile-admin-metrics article,
  .mobile-provider-list article { border: 1px solid CanvasText; background: Canvas; color: CanvasText; }
}

.mobile-admin fieldset { display: grid; gap: 13px; margin: 0; padding: 0; border: 0; }
.mobile-admin-row-actions { display: flex; flex-wrap: wrap; gap: 5px; }
.mobile-admin-row-actions .button { min-height: 34px; padding: 6px 9px; }
.mobile-admin-muted { color: var(--ma-muted); font-size: .72rem; }
.mobile-status.cancelled { background: #eef0f4; color: #5e6679; }
.mobile-status.queued,
.mobile-status.processing { background: #fff0da; color: #955a12; }
.mobile-admin-dialog {
  width: min(560px, calc(100vw - 28px));
  max-height: calc(100dvh - 32px);
  overflow: auto;
  border: 1px solid var(--ma-line);
  border-radius: 24px;
  padding: 0;
  background: var(--surface, #fff);
  color: var(--text, #17203d);
  box-shadow: 0 32px 90px rgba(18, 25, 59, .32);
}
.mobile-admin-dialog::backdrop { background: rgba(12, 17, 38, .62); backdrop-filter: blur(6px); }
.mobile-admin-dialog form { padding: 25px; }
.mobile-admin-dialog header { display: grid; grid-template-columns: 48px 1fr 42px; gap: 13px; align-items: center; }
.mobile-admin-dialog header > span { display: grid; place-items: center; width: 48px; height: 48px; border-radius: 15px; background: #eeebff; color: var(--ma-primary); }
.mobile-admin-dialog header svg { width: 24px; }
.mobile-admin-dialog h2 { margin: 0; font-size: 1.35rem; }
.mobile-admin-dialog p { margin: 16px 0 5px; color: var(--ma-muted); line-height: 1.55; }
.mobile-admin-dialog-close { display: grid; place-items: center; width: 42px; height: 42px; border: 0; border-radius: 13px; background: var(--ma-surface); color: inherit; cursor: pointer; }
@media (max-width: 640px) {
  .mobile-admin-dialog { width: 100%; max-width: none; margin: auto 0 0; border-radius: 25px 25px 0 0; }
  .mobile-admin-dialog form { padding: 22px 18px calc(22px + env(safe-area-inset-bottom)); }
}

/* Studio mobile operations contrast floor. */
.mobile-admin-pill { color: #5d50d8; }
html[data-theme="dark"] .mobile-admin-pill { color: #c8c2ff; }