/* The AskMyPages admin page. Loaded only on that page. */
.amp-admin { max-width: 1100px; }
.amp-admin .amp-head { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; margin: 8px 0 4px; }
.amp-admin .amp-head h1 { margin: 0; padding: 0; line-height: 0; }
.amp-admin .amp-logo img { height: 40px; width: auto; display: block; }
.amp-pill { display: inline-flex; align-items: center; gap: 6px; padding: 2px 10px; border-radius: 999px; font-size: 12px; font-weight: 600; line-height: 20px; background: #f0f0f1; color: #3c434a; }
.amp-pill::before { content: ""; width: 7px; height: 7px; border-radius: 50%; background: currentColor; }
.amp-pill.is-ok { background: #edfaef; color: #00701a; }
.amp-pill.is-off { background: #f0f0f1; color: #646970; }
.amp-pill.is-warn { background: #fcf9e8; color: #8a6100; }
.amp-pill.is-plan::before { display: none; }
.amp-admin .nav-tab-wrapper { margin: 16px 0 20px; }
.amp-grid { display: grid; gap: 16px; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); margin-bottom: 20px; }
.amp-card { background: #fff; border: 1px solid #dcdcde; border-radius: 8px; padding: 18px 20px; }
.amp-card h2 { margin: 0 0 6px; font-size: 15px; display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.amp-card p { margin: 6px 0; color: #50575e; }
.amp-card .amp-big { font-size: 26px; font-weight: 600; color: #1d2327; line-height: 1.2; margin: 8px 0 2px; }
.amp-card .amp-actions { margin-top: 14px; display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
.amp-card .amp-actions form { margin: 0; }
.amp-card.amp-upgrade { border-color: #2271b1; background: #f6fafd; }
.amp-roles-box { display: grid; gap: 2px; margin: 4px 0 6px 20px; }
.amp-admin .amp-head .button-small { margin-left: 2px; }
.amp-meter { height: 6px; border-radius: 3px; background: #f0f0f1; overflow: hidden; margin: 10px 0 4px; }
.amp-meter span { display: block; height: 100%; background: #2271b1; border-radius: 3px; }
.amp-meter.is-warn span { background: #dba617; }
.amp-meter.is-full span { background: #d63638; }
.amp-stats { display: grid; grid-template-columns: repeat(auto-fit, minmax(110px, 1fr)); gap: 8px; margin: 10px 0 0; }
.amp-stats div { background: #f6f7f7; border-radius: 6px; padding: 8px 10px; }
.amp-stats strong { display: block; font-size: 18px; color: #1d2327; }
.amp-stats span { font-size: 12px; color: #646970; }
.amp-attention { margin: 0 0 20px; }
.amp-attention .notice { margin: 0 0 8px; }
.amp-section { background: #fff; border: 1px solid #dcdcde; border-radius: 8px; padding: 4px 20px 8px; margin-bottom: 16px; }
.amp-section > h2 { font-size: 15px; margin: 16px 0 0; display: flex; align-items: center; gap: 8px; }
.amp-section > p.description { margin: 4px 0 0; }
.amp-section .form-table th { width: 200px; }
.amp-paid { text-decoration: none; display: inline-block; margin-left: 6px; padding: 0 8px; border-radius: 999px; background: #f0f6fc; color: #2271b1; font-size: 11px; font-weight: 600; line-height: 18px; vertical-align: middle; }
.amp-admin label.amp-choice, .amp-admin .form-table td fieldset label.amp-choice { display: block; margin: 0 0 8px !important; }
.amp-roles { margin: 4px 0 0 24px; display: flex; flex-wrap: wrap; gap: 4px 16px; }
.amp-list { margin: 8px 0 0 18px; list-style: disc; }
.amp-welcome { max-width: 640px; }
.amp-welcome ol { margin: 12px 0 18px 20px; }
.amp-welcome li { margin: 6px 0; }
.amp-foot { margin-top: 24px; max-width: 720px; }
@media (max-width: 782px) { .amp-section .form-table th { width: auto; } }
.amp-paid .dashicons { font-size: 12px; width: 12px; height: 12px; line-height: 18px; margin-right: 3px; vertical-align: top; }
.amp-section > h2 .amp-paid { margin-left: 2px; }
.amp-paid:hover, .amp-paid:focus { background: #dcebfa; color: #135e96; }
.amp-admin .amp-stats { max-width: 560px; }
.amp-admin .button.amp-danger { color: #b32d2e; border-color: #b32d2e; }
.amp-admin .button.amp-danger:hover { background: #fcf0f1; color: #8a2424; border-color: #8a2424; }
.amp-try { display: flex; gap: 8px; margin: 12px 0 4px; max-width: 760px; }
.amp-try input { flex: 1; }
.amp-try-turn { border-top: 1px solid #f0f0f1; padding: 12px 0 4px; max-width: 760px; }
.amp-try-turn:first-child { border-top: 0; }
.amp-try-q { font-weight: 600; margin: 0 0 6px; color: #1d2327; }
.amp-try-turn ol { margin: 4px 0 8px 20px; }
.amp-health ul { margin: 12px 0; max-width: 820px; }
.amp-health li { display: flex; gap: 10px; align-items: flex-start; padding: 10px 0; border-top: 1px solid #f0f0f1; margin: 0; }
.amp-health li:first-child { border-top: 0; }
.amp-health .dashicons { flex: none; margin-top: 2px; }
.amp-setup { margin-bottom: 20px; max-width: 820px; }
.amp-setup ol { list-style: none; margin: 10px 0 12px; padding: 0; }
.amp-setup li { display: flex; gap: 10px; align-items: flex-start; padding: 9px 0; border-top: 1px solid #f0f0f1; margin: 0; }
.amp-setup li:first-child { border-top: 0; }
.amp-setup li .dashicons { flex: none; color: #8c8f94; margin-top: 2px; }
.amp-setup li.is-done .dashicons { color: #00a32a; }
.amp-setup li.is-done strong { color: #50575e; }
.amp-setup li a { margin-left: 4px; }
.amp-warn-tag { display: inline-block; margin-left: 6px; padding: 0 8px; border-radius: 999px; background: #fcf9e8; color: #8a6100; font-size: 11px; font-weight: 600; line-height: 18px; vertical-align: middle; }
.amp-filter a { text-decoration: none; }
.amp-filter a.current { font-weight: 600; color: #1d2327; }
.amp-items td { vertical-align: middle; }
.amp-items td .description { display: inline-block; margin-top: 4px; }
.amp-items form { margin: 0; }
.amp-pager { margin-top: 12px; }

.amp-admin .amp-avatar-mini, .amp-admin .amp-avatar-preview { vertical-align: middle; border-radius: 50%; object-fit: cover; margin: 0 6px; background: #f0f0f1; }
.amp-admin .amp-avatar-preview { width: 40px; height: 40px; }
.amp-admin .amp-review { margin: 0 0 16px; }
.amp-admin .amp-review form { margin-left: 8px; }