| @@ -8,64 +8,10 @@ | ||
| 8 | 8 | * @subpackage Metasync/admin/css |
| 9 | 9 | */ |
| 10 | 10 | |
| 11 | 11 | /* ========================================================================== |
| 12 | - Analytics Consent Prototype | |
| 12 | + Wizard Container | |
| 13 | 13 | ========================================================================== */ |
| 14 | - | |
| 15 | -.wizard-consent-card, | |
| 16 | -.metasync-analytics-consent-card { | |
| 17 | - display: flex; | |
| 18 | - align-items: flex-start; | |
| 19 | - gap: 22px; | |
| 20 | - margin: 28px auto 0; | |
| 21 | - padding: 26px 30px; | |
| 22 | - max-width: 820px; | |
| 23 | - background: var(--dashboard-card-bg, #ffffff); | |
| 24 | - border: 2px solid rgba(102, 126, 234, 0.35); | |
| 25 | - border-radius: 16px; | |
| 26 | - box-shadow: 0 8px 24px rgba(42, 48, 82, 0.08); | |
| 27 | -} | |
| 28 | - | |
| 29 | -.wizard-consent-icon { | |
| 30 | - display: grid; | |
| 31 | - place-items: center; | |
| 32 | - flex: 0 0 46px; | |
| 33 | - width: 46px; | |
| 34 | - height: 46px; | |
| 35 | - color: #fff; | |
| 36 | - background: linear-gradient(135deg, #667eea, #764ba2); | |
| 37 | - border-radius: 12px; | |
| 38 | -} | |
| 39 | - | |
| 40 | -.wizard-consent-icon .dashicons { font-size: 24px; width: 24px; height: 24px; } | |
| 41 | -.wizard-consent-copy { flex: 1; } | |
| 42 | -.wizard-consent-copy h3, | |
| 43 | -.metasync-analytics-consent-copy h3 { margin: 0 0 8px; color: var(--dashboard-text-primary, #1a202c); font-size: 1.25rem; } | |
| 44 | -.wizard-consent-copy p, | |
| 45 | -.metasync-analytics-consent-copy p { margin: 0 0 10px; color: var(--dashboard-text-secondary, #4a5568); line-height: 1.55; } | |
| 46 | -.wizard-consent-copy ul { margin: 12px 0; padding-left: 18px; color: var(--dashboard-text-secondary, #4a5568); } | |
| 47 | -.wizard-consent-copy li { margin: 5px 0; } | |
| 48 | -.wizard-consent-eyebrow { display: inline-block; margin-bottom: 6px; color: #667eea; font-size: .75rem; font-weight: 700; text-transform: uppercase; letter-spacing: .08em; } | |
| 49 | -.wizard-consent-note { font-size: .875rem; } | |
| 50 | -.wizard-consent-switch, | |
| 51 | -.metasync-consent-switch { position: relative; display: inline-flex; flex: 0 0 auto; align-items: center; cursor: pointer; } | |
| 52 | -.wizard-consent-switch input, | |
| 53 | -.metasync-consent-switch input { position: absolute; opacity: 0; } | |
| 54 | -.wizard-consent-slider, | |
| 55 | -.metasync-consent-slider { width: 52px; height: 30px; background: #cbd5e1; border-radius: 999px; transition: .2s; } | |
| 56 | -.wizard-consent-slider::after, | |
| 57 | -.metasync-consent-slider::after { content: ''; display: block; width: 24px; height: 24px; margin: 3px; background: #fff; border-radius: 50%; transition: .2s; box-shadow: 0 1px 3px rgba(0,0,0,.2); } | |
| 58 | -.wizard-consent-switch input:checked + .wizard-consent-slider, | |
| 59 | -.metasync-consent-switch input:checked + .metasync-consent-slider { background: #667eea; } | |
| 60 | -.wizard-consent-switch input:checked + .wizard-consent-slider::after, | |
| 61 | -.metasync-consent-switch input:checked + .metasync-consent-slider::after { transform: translateX(22px); } | |
| 62 | -.wizard-consent-state, | |
| 63 | -.metasync-consent-status { margin-left: 8px; color: var(--dashboard-text-secondary, #4a5568); font-size: .875rem; font-weight: 600; } | |
| 64 | -.metasync-analytics-consent-card { max-width: none; margin: 0; } | |
| 65 | -.metasync-analytics-consent-copy { flex: 1; } | |
| 66 | - | |
| 67 | - | |
| 68 | 14 | |
| 69 | 15 | /* Override WordPress admin wrapper backgrounds */ |
| 70 | 16 | /* Target any page with setup-wizard in the body class */ |
| 71 | 17 | body[class*="setup-wizard"] { |