/* WordPress List Block
-------------------------------------------------------------- */
.wp-block-list:not([class*="is-style-magshow-list-"]){margin:0 0 1.5em 2em;padding:0;list-style-position:outside;}
ul.wp-block-list:not([class*="is-style-magshow-list-"]){list-style-type:disc;}
ol.wp-block-list:not([class*="is-style-magshow-list-"]){list-style-type:decimal;}
.wp-block-list:not([class*="is-style-magshow-list-"]) li{margin:0 0 .5em 0;padding:0;}
.wp-block-list:not([class*="is-style-magshow-list-"]) li:last-child{margin-bottom:0;}
.wp-block-list:not([class*="is-style-magshow-list-"]) ul,.wp-block-list:not([class*="is-style-magshow-list-"]) ol{margin:.5em 0 0 1.5em;padding:0;}
.wp-block-list:not([class*="is-style-magshow-list-"]) ul{list-style-type:circle;}
.wp-block-list:not([class*="is-style-magshow-list-"]) ol{list-style-type:decimal;}

/* Shared base reset */
.wp-block-list[class*="is-style-magshow-list-"],.wp-block-list[class*="is-style-magshow-list-"] ul,.wp-block-list[class*="is-style-magshow-list-"] ol{list-style:none;padding-left:0;}
.wp-block-list[class*="is-style-magshow-list-"]{margin:0 0 1.5em;}
.wp-block-list[class*="is-style-magshow-list-"] ul,.wp-block-list[class*="is-style-magshow-list-"] ol{margin:.75em 0 0 0;}
.wp-block-list[class*="is-style-magshow-list-"] li{font-size:1em;line-height:1.6;}

/* --- 1. Check List (Default) ---
   Green circle checkmark before each item.
   Ideal for feature lists, to-do items, and included benefits. */
.wp-block-list.is-style-magshow-list-checklist li{position:relative;padding:6px 0 6px 30px;border-bottom:1px solid #f3f4f6;}
.wp-block-list.is-style-magshow-list-checklist li:last-child{border-bottom:none;}
.wp-block-list.is-style-magshow-list-checklist li::before{content:'\2713';position:absolute;left:0;top:7px;width:18px;height:18px;background-color:#057a55;color:#ffffff;border-radius:50%;font-size:10px;font-weight:700;display:flex;align-items:center;justify-content:center;line-height:1;top:50%;transform:translateY(-50%);}

/* --- 2. Accent Dot ---
   Solid brand-color dot marker.
   Clean and professional for general content lists. */
.wp-block-list.is-style-magshow-list-accent-dot li{position:relative;padding:5px 0 5px 20px;}
.wp-block-list.is-style-magshow-list-accent-dot li::before{content:'';position:absolute;left:0;top:13px;width:7px;height:7px;background-color:#1a56db;border-radius:50%;top:50%;transform:translateY(-50%);}

/* --- 3. Numbered Badge ---
   Blue circle counter for each list item.
   Perfect for ranked lists, top 10s, and ordered steps. */
.wp-block-list.is-style-magshow-list-numbered-badge{counter-reset:magshow-badge;}
.wp-block-list.is-style-magshow-list-numbered-badge li{position:relative;padding:5px 0 5px 34px;counter-increment:magshow-badge;}
.wp-block-list.is-style-magshow-list-numbered-badge li::before{content:counter(magshow-badge);position:absolute;left:0;top:5px;width:22px;height:22px;background-color:#1a56db;color:#ffffff;border-radius:50%;font-size:11px;font-weight:700;display:flex;align-items:center;justify-content:center;line-height:1;top:50%;transform:translateY(-50%);}

/* --- 4. Card Rows ---
   Each list item is a bordered card with background.
   Great for feature highlights, pricing inclusions, and benefit lists. */
.wp-block-list.is-style-magshow-list-card-rows li{padding:9px 14px;border:1px solid #e5e7eb;border-radius:6px;margin-bottom:6px;background-color:#f9fafb;}
.wp-block-list.is-style-magshow-list-card-rows li:last-child{margin-bottom:0;}

/* --- 5. Left Accent Bar ---
   Brand-colored left border on each item.
   Effective for documentation, sidebars, and structured references. */
.wp-block-list.is-style-magshow-list-accent-bar li{padding:5px 0 5px 14px;border-left:3px solid #1a56db;margin-bottom:7px;}
.wp-block-list.is-style-magshow-list-accent-bar li:last-child{margin-bottom:0;}

/* --- 6. Arrow Icon ---
   Right-pointing arrow as the list marker.
   Works well for navigation links, CTAs, and action items. */
.wp-block-list.is-style-magshow-list-arrow li{position:relative;padding:5px 0 5px 24px;}
.wp-block-list.is-style-magshow-list-arrow li::before{content:'\2192';position:absolute;left:0;top:5px;color:#1a56db;font-weight:700;font-size:1em;line-height:1.6;top:50%;transform:translateY(-50%);}

/* --- 7. Dash Minimal ---
   Subtle em-dash marker in muted gray.
   Clean and understated for editorial and documentation content. */
.wp-block-list.is-style-magshow-list-dash li{position:relative;padding:5px 0 5px 20px;color:#374151;}
.wp-block-list.is-style-magshow-list-dash li::before{content:'\2014';position:absolute;left:0;top:5px;color:#9ca3af;font-size:0.9em;line-height:1.6;top:50%;transform:translateY(-50%);}

/* --- 8. Step List ---
   Outlined circle counter for process flows and tutorials.
   Ideal for installation guides, how-tos, and step-by-step instructions. */
.wp-block-list.is-style-magshow-list-steps{counter-reset:magshow-step;}
.wp-block-list.is-style-magshow-list-steps li{position:relative;padding:9px 12px 9px 46px;border-bottom:1px solid #f3f4f6;counter-increment:magshow-step;}
.wp-block-list.is-style-magshow-list-steps li:last-child{border-bottom:none;}
.wp-block-list.is-style-magshow-list-steps li::before{content:counter(magshow-step);position:absolute;left:8px;top:50%;transform:translateY(-50%);width:24px;height:24px;border:2px solid #1a56db;color:#1a56db;border-radius:50%;font-size:11px;font-weight:700;display:flex;align-items:center;justify-content:center;line-height:1;background-color:transparent;}

/* --- 9. Tag Pills ---
   Inline pill badges for each list item.
   Perfect for tags, categories, technologies, and keyword lists. */
.wp-block-list.is-style-magshow-list-tags{display:flex;flex-wrap:wrap;gap:7px;padding:0;}
.wp-block-list.is-style-magshow-list-tags li{padding:4px 14px;background-color:#eff6ff;color:#1e40af;border:1px solid #bfdbfe;border-radius:100px;font-size:1em;font-weight:500;line-height:1.6;display:inline-block;}
.wp-block-list.is-style-magshow-list-tags li::before{display:none;}

/* --- 10. Dark Accent Rows ---
   Dark background rows with a left brand border.
   Great for technical specs, server configs, and dark-section content. */
.wp-block-list.is-style-magshow-list-dark-rows li{padding:9px 14px;background-color:#1f2937;color:#f9fafb;border-left:3px solid #1a56db;border-radius:4px;margin-bottom:4px;font-size:1em;}
.wp-block-list.is-style-magshow-list-dark-rows li:last-child{margin-bottom:0;}

/* --- 11. Timeline ---
   Vertical timeline with dots and connecting line.
   Good for history, changelogs, milestones, and project progress. */
.wp-block-list.is-style-magshow-list-timeline{position:relative;padding-left:24px;}
.wp-block-list.is-style-magshow-list-timeline::before{content:'';position:absolute;left:7px;top:8px;bottom:8px;width:2px;background-color:#dbeafe;}
.wp-block-list.is-style-magshow-list-timeline li{position:relative;padding:4px 0 12px 20px;}
.wp-block-list.is-style-magshow-list-timeline li::before{content:'';position:absolute;left:-22px;top:10px;width:12px;height:12px;background-color:#1a56db;border:3px solid #ffffff;border-radius:50%;box-shadow:0 0 0 2px #bfdbfe;top:50%;transform:translateY(-50%);}

/* --- 12. Glow Check ---
   Soft glowing check markers.
   Useful for feature highlights, benefits, and landing page lists. */
.wp-block-list.is-style-magshow-list-glow-check li{position:relative;padding:7px 0 7px 34px;}
.wp-block-list.is-style-magshow-list-glow-check li::before{content:'\2713';position:absolute;left:0;top:7px;width:22px;height:22px;background-color:#10b981;color:#ffffff;border-radius:50%;font-size:11px;font-weight:700;display:flex;align-items:center;justify-content:center;line-height:1;box-shadow:0 0 0 5px rgba(16,185,129,.14);top:50%;transform:translateY(-50%);}

/* --- 13. Icon Box ---
   Small square icon marker before each item.
   Works well for tools, services, resources, and feature lists. */
.wp-block-list.is-style-magshow-list-icon-box li{position:relative;padding:8px 0 8px 40px;}
.wp-block-list.is-style-magshow-list-icon-box li::before{content:'+';position:absolute;left:0;top:7px;width:26px;height:26px;background-color:#eff6ff;color:#1a56db;border:1px solid #bfdbfe;border-radius:6px;font-size:15px;font-weight:700;display:flex;align-items:center;justify-content:center;line-height:1;top:50%;transform:translateY(-50%);}

/* --- 14. Soft Cards ---
   Rounded soft background cards.
   Good for simple feature groups and readable content sections. */
.wp-block-list.is-style-magshow-list-soft-cards li{position:relative;padding:10px 14px 10px 38px;margin-bottom:8px;background-color:#f8fafc;border-radius:10px;color:#1f2937;}
.wp-block-list.is-style-magshow-list-soft-cards li:last-child{margin-bottom:0;}
.wp-block-list.is-style-magshow-list-soft-cards li::before{content:'';position:absolute;left:14px;top:18px;width:8px;height:8px;background-color:#1a56db;border-radius:50%;top:50%;transform:translateY(-50%);}

/* --- 15. Border Split ---
   Top border separators with accent marker.
   Best for clean editorial lists and documentation sections. */
.wp-block-list.is-style-magshow-list-border-split li{position:relative;padding:10px 0 10px 28px;border-top:1px solid #e5e7eb;}
.wp-block-list.is-style-magshow-list-border-split li:last-child{border-bottom:1px solid #e5e7eb;}
.wp-block-list.is-style-magshow-list-border-split li::before{content:'';position:absolute;left:0;top:18px;width:12px;height:3px;background-color:#1a56db;border-radius:20px;top:50%;transform:translateY(-50%);}

/* --- 16. Gradient Rows ---
   Light gradient rows with subtle border.
   Useful for modern feature lists and product benefits. */
.wp-block-list.is-style-magshow-list-gradient-rows li{position:relative;padding:10px 14px 10px 42px;margin-bottom:7px;background:linear-gradient(90deg,#eff6ff 0%,#ffffff 100%);border:1px solid #dbeafe;border-radius:8px;}
.wp-block-list.is-style-magshow-list-gradient-rows li:last-child{margin-bottom:0;}
.wp-block-list.is-style-magshow-list-gradient-rows li::before{content:'\203A';position:absolute;left:15px;top:8px;color:#1a56db;font-size:22px;font-weight:700;line-height:1.3;top:50%;transform:translateY(-50%);}

/* --- 17. News Feed ---
   Compact feed style with date or update style marker.
   Good for updates, news lists, recent posts, and changelogs. */
.wp-block-list.is-style-magshow-list-news-feed li{position:relative;padding:9px 0 9px 34px;border-bottom:1px dashed #d1d5db;}
.wp-block-list.is-style-magshow-list-news-feed li:last-child{border-bottom:none;}
.wp-block-list.is-style-magshow-list-news-feed li::before{content:'';position:absolute;left:0;top:15px;width:18px;height:18px;background-color:#ffffff;border:5px solid #1a56db;border-radius:50%;box-shadow:0 0 0 1px #bfdbfe;top:50%;transform:translateY(-50%);}

/* --- 18. Circle Line ---
   Numbered circles connected by a vertical guide line.
   Good for process lists, tutorials, and ordered instructions. */
.wp-block-list.is-style-magshow-list-circle-line{counter-reset:magshow-circle-line;position:relative;padding-left:0;}
.wp-block-list.is-style-magshow-list-circle-line li{position:relative;padding:8px 0 12px 46px;counter-increment:magshow-circle-line;}
.wp-block-list.is-style-magshow-list-circle-line li::before{content:counter(magshow-circle-line);position:absolute;left:0;top:7px;width:28px;height:28px;background-color:#1a56db;color:#ffffff;border-radius:50%;font-size:12px;font-weight:700;display:flex;align-items:center;justify-content:center;line-height:1;z-index:2;top:50%;transform:translateY(-50%);}
.wp-block-list.is-style-magshow-list-circle-line li::after{content:'';position:absolute;left:13px;top:35px;bottom:-4px;width:2px;background-color:#dbeafe;}
.wp-block-list.is-style-magshow-list-circle-line li:last-child::after{display:none;}

/* --- 19. Quote Items ---
   Each item appears like a small quote or note.
   Useful for testimonials, key points, tips, and editorial highlights. */
.wp-block-list.is-style-magshow-list-quote-items li{position:relative;padding:10px 14px 10px 42px;margin-bottom:8px;background-color:#fffbeb;border-left:4px solid #f59e0b;border-radius:6px;color:#374151;}
.wp-block-list.is-style-magshow-list-quote-items li:last-child{margin-bottom:0;}
.wp-block-list.is-style-magshow-list-quote-items li::before{content:'\201C';position:absolute;left:14px;top:3px;color:#f59e0b;font-size:30px;font-weight:700;line-height:1;top:50%;transform:translateY(-50%);}

/* --- 20. Clean Table ---
   Table-like rows with alternating background.
   Good for specs, comparisons, resources, and structured lists. */
.wp-block-list.is-style-magshow-list-clean-table{border:1px solid #e5e7eb;border-radius:8px;overflow:hidden;}
.wp-block-list.is-style-magshow-list-clean-table li{position:relative;padding:10px 14px 10px 36px;border-bottom:1px solid #e5e7eb;background-color:#ffffff;}
.wp-block-list.is-style-magshow-list-clean-table li:nth-child(even){background-color:#f9fafb;}
.wp-block-list.is-style-magshow-list-clean-table li:last-child{border-bottom:none;}
.wp-block-list.is-style-magshow-list-clean-table li::before{content:'';position:absolute;left:14px;top:18px;width:7px;height:7px;background-color:#1a56db;border-radius:50%;top:50%;transform:translateY(-50%);}

/* --- 21. Alert List ---
   Red alert style rows.
   Good for warnings, restrictions, issues, and important notices. */
.wp-block-list.is-style-magshow-list-alert li{position:relative;padding:10px 14px 10px 42px;margin-bottom:7px;background-color:#fef2f2;color:#7f1d1d;border:1px solid #fecaca;border-radius:8px;}
.wp-block-list.is-style-magshow-list-alert li:last-child{margin-bottom:0;}
.wp-block-list.is-style-magshow-list-alert li::before{content:'!';position:absolute;left:14px;top:10px;width:20px;height:20px;background-color:#dc2626;color:#ffffff;border-radius:50%;font-size:12px;font-weight:700;display:flex;align-items:center;justify-content:center;line-height:1;top:50%;transform:translateY(-50%);}

/* --- 22. Success Box ---
   Green success list with check icon.
   Best for completed tasks, benefits, and positive points. */
.wp-block-list.is-style-magshow-list-success-box{padding:14px;background-color:#ecfdf5;border:1px solid #a7f3d0;border-radius:10px;}
.wp-block-list.is-style-magshow-list-success-box li{position:relative;padding:7px 0 7px 30px;color:#064e3b;}
.wp-block-list.is-style-magshow-list-success-box li::before{content:'\2713';position:absolute;left:0;top:7px;width:20px;height:20px;background-color:#059669;color:#ffffff;border-radius:50%;font-size:11px;font-weight:700;display:flex;align-items:center;justify-content:center;line-height:1;top:50%;transform:translateY(-50%);}

/* --- 23. Warning Box ---
   Yellow warning style list.
   Useful for notes, cautions, requirements, and reminders. */
.wp-block-list.is-style-magshow-list-warning-box{padding:14px;background-color:#fffbeb;border:1px solid #fde68a;border-radius:10px;}
.wp-block-list.is-style-magshow-list-warning-box li{position:relative;padding:7px 0 7px 32px;color:#78350f;}
.wp-block-list.is-style-magshow-list-warning-box li::before{content:'!';position:absolute;left:0;top:7px;width:20px;height:20px;background-color:#f59e0b;color:#ffffff;border-radius:5px;font-size:12px;font-weight:700;display:flex;align-items:center;justify-content:center;line-height:1;top:50%;transform:translateY(-50%);}

/* --- 24. Minimal Line ---
   Clean line marker with spacious text.
   Good for simple editorial lists and documentation. */
.wp-block-list.is-style-magshow-list-minimal-line li{position:relative;padding:6px 0 6px 30px;color:#374151;}
.wp-block-list.is-style-magshow-list-minimal-line li::before{content:'';position:absolute;left:0;top:18px;width:16px;height:2px;background-color:#1a56db;border-radius:10px;top:50%;transform:translateY(-50%);}

/* --- 25. Sidebar Menu ---
   Navigation style list with hover effect.
   Good for sidebar links, table of contents, and resource lists. */
.wp-block-list.is-style-magshow-list-sidebar-menu li{position:relative;padding:9px 12px 9px 36px;margin-bottom:4px;background-color:#ffffff;border:1px solid #e5e7eb;border-radius:6px;transition:background-color .2s ease,border-color .2s ease,transform .2s ease;}
.wp-block-list.is-style-magshow-list-sidebar-menu li:last-child{margin-bottom:0;}
.wp-block-list.is-style-magshow-list-sidebar-menu li::before{content:'\203A';position:absolute;left:14px;top:7px;color:#1a56db;font-size:20px;font-weight:700;line-height:1.4;top:50%;transform:translateY(-50%);}
.wp-block-list.is-style-magshow-list-sidebar-menu li:hover{background-color:#eff6ff;border-color:#bfdbfe;transform:translateX(3px);}

/* --- 26. Download List ---
   Download style icon marker.
   Useful for files, resources, attachments, and theme downloads. */
.wp-block-list.is-style-magshow-list-downloads li{position:relative;padding:10px 14px 10px 44px;margin-bottom:7px;background-color:#f8fafc;border:1px solid #e5e7eb;border-radius:8px;}
.wp-block-list.is-style-magshow-list-downloads li:last-child{margin-bottom:0;}
.wp-block-list.is-style-magshow-list-downloads li::before{content:'\2193';position:absolute;left:14px;top:10px;width:22px;height:22px;background-color:#1a56db;color:#ffffff;border-radius:50%;font-size:14px;font-weight:700;display:flex;align-items:center;justify-content:center;line-height:1;top:50%;transform:translateY(-50%);}

/* --- 27. Starred List ---
   Star icon marker.
   Good for featured points, highlights, ratings, and best picks. */
.wp-block-list.is-style-magshow-list-starred li{position:relative;padding:7px 0 7px 32px;}
.wp-block-list.is-style-magshow-list-starred li::before{content:'\2605';position:absolute;left:0;top:6px;color:#f59e0b;font-size:18px;line-height:1.4;top:50%;transform:translateY(-50%);}

/* --- 28. Pricing List ---
   Clean pricing feature rows.
   Useful for pricing tables, plan benefits, and product features. */
.wp-block-list.is-style-magshow-list-pricing{border:1px solid #dbeafe;border-radius:10px;overflow:hidden;background-color:#ffffff;}
.wp-block-list.is-style-magshow-list-pricing li{position:relative;padding:11px 16px 11px 42px;border-bottom:1px solid #e5e7eb;}
.wp-block-list.is-style-magshow-list-pricing li:last-child{border-bottom:none;}
.wp-block-list.is-style-magshow-list-pricing li::before{content:'\2713';position:absolute;left:15px;top:12px;width:18px;height:18px;background-color:#eff6ff;color:#1a56db;border:1px solid #bfdbfe;border-radius:50%;font-size:10px;font-weight:700;display:flex;align-items:center;justify-content:center;line-height:1;top:50%;transform:translateY(-50%);}

/* --- 29. Glass List ---
   Soft glass style list items.
   Good for modern sections, hero areas, and stylish landing pages. */
.wp-block-list.is-style-magshow-list-glass li{position:relative;padding:10px 14px 10px 40px;margin-bottom:8px;background-color:rgba(255,255,255,.72);border:1px solid rgba(191,219,254,.8);border-radius:10px;box-shadow:0 8px 24px rgba(15,23,42,.06);}
.wp-block-list.is-style-magshow-list-glass li:last-child{margin-bottom:0;}
.wp-block-list.is-style-magshow-list-glass li::before{content:'';position:absolute;left:15px;top:18px;width:9px;height:9px;background-color:#1a56db;border-radius:50%;box-shadow:0 0 0 5px rgba(26,86,219,.12);top:50%;transform:translateY(-50%);}

/* --- 30. Compact Meta ---
   Small compact meta style list.
   Useful for post meta, specs, author info, and compact details. */
.wp-block-list.is-style-magshow-list-compact-meta{display:flex;flex-wrap:wrap;gap:8px;}
.wp-block-list.is-style-magshow-list-compact-meta li{position:relative;padding:4px 10px 4px 24px;background-color:#f3f4f6;color:#4b5563;border-radius:6px;font-size:0.84em;line-height:1.5;}
.wp-block-list.is-style-magshow-list-compact-meta li::before{content:'';position:absolute;left:10px;top:11px;width:6px;height:6px;background-color:#6b7280;border-radius:50%;top:50%;transform:translateY(-50%);}

/* --- 31. Feature Strip ---
   Clean horizontal feature rows with a colored left block.
   Good for feature summaries, service lists, and product highlights. */
.wp-block-list.is-style-magshow-list-feature-strip > li{position:relative;padding:10px 14px 10px 48px;margin-bottom:8px;background-color:#ffffff;border:1px solid #e5e7eb;border-radius:8px;box-shadow:0 2px 8px rgba(15,23,42,.04);}
.wp-block-list.is-style-magshow-list-feature-strip > li:last-child{margin-bottom:0;}
.wp-block-list.is-style-magshow-list-feature-strip > li::before{content:'';position:absolute;left:0;top:0;bottom:0;width:34px;background-color:#1a56db;border-radius:8px 0 0 8px;}
.wp-block-list.is-style-magshow-list-feature-strip > li::after{content:'\2713';position:absolute;left:10px;top:50%;transform:translateY(-50%);color:#ffffff;font-size:13px;font-weight:700;line-height:1;}

/* --- 32. Neon Edge ---
   Dark rows with glowing accent marker.
   Useful for tech lists, gaming sections, and dark layouts. */
.wp-block-list.is-style-magshow-list-neon-edge > li{position:relative;padding:10px 14px 10px 42px;margin-bottom:7px;background-color:#111827;color:#f9fafb;border:1px solid #374151;border-radius:8px;box-shadow:0 0 0 1px rgba(26,86,219,.2);}
.wp-block-list.is-style-magshow-list-neon-edge > li:last-child{margin-bottom:0;}
.wp-block-list.is-style-magshow-list-neon-edge > li::before{content:'';position:absolute;left:15px;top:18px;width:8px;height:8px;background-color:#60a5fa;border-radius:50%;box-shadow:0 0 10px rgba(96,165,250,.9);top:50%;transform:translateY(-50%);}

/* --- 33. Checkbox Outline ---
   Outlined checkbox style markers.
   Good for task lists, requirements, and checkable feature lists. */
.wp-block-list.is-style-magshow-list-checkbox-outline > li{position:relative;padding:7px 0 7px 34px;}
.wp-block-list.is-style-magshow-list-checkbox-outline > li::before{content:'';position:absolute;left:0;top:9px;width:20px;height:20px;border:2px solid #1a56db;border-radius:5px;background-color:#ffffff;top:50%;transform:translateY(-50%);}
.wp-block-list.is-style-magshow-list-checkbox-outline > li::after{content:'\2713';position:absolute;left:5px;top:10px;color:#1a56db;font-size:12px;font-weight:700;line-height:1.4;top:50%;transform:translateY(-50%);}

/* --- 34. Number Cards ---
   Large number block for each list item.
   Best for ranked content, tutorials, and top list posts. */
.wp-block-list.is-style-magshow-list-number-cards{counter-reset:magshow-number-cards;}
.wp-block-list.is-style-magshow-list-number-cards > li{position:relative;min-height:48px;padding:12px 14px 12px 64px;margin-bottom:9px;background-color:#f8fafc;border:1px solid #e5e7eb;border-radius:10px;counter-increment:magshow-number-cards;}
.wp-block-list.is-style-magshow-list-number-cards > li:last-child{margin-bottom:0;}
.wp-block-list.is-style-magshow-list-number-cards > li::before{content:counter(magshow-number-cards);position:absolute;left:12px;top:6px;width:34px;height:34px;background-color:#1a56db;color:#ffffff;border-radius:8px;font-size:15px;font-weight:700;display:flex;align-items:center;justify-content:center;line-height:1;top:50%;transform:translateY(-50%);}

/* --- 35. Two Column Tiles ---
   Responsive two-column tile layout.
   Good for short benefits, category lists, and quick feature blocks. */
.wp-block-list.is-style-magshow-list-two-column-tiles{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;}
.wp-block-list.is-style-magshow-list-two-column-tiles > li{position:relative;padding:11px 14px 11px 38px;background-color:#f9fafb;border:1px solid #e5e7eb;border-radius:9px;}
.wp-block-list.is-style-magshow-list-two-column-tiles > li::before{content:'';position:absolute;left:14px;top:19px;width:8px;height:8px;background-color:#1a56db;border-radius:50%;top:50%;transform:translateY(-50%);}
@media only screen and (max-width:600px){
    .wp-block-list.is-style-magshow-list-two-column-tiles{grid-template-columns:1fr;}
}

/* --- 36. Ribbon List ---
   List items with a small ribbon marker.
   Useful for featured benefits, awards, and important points. */
.wp-block-list.is-style-magshow-list-ribbon > li{position:relative;padding:9px 14px 9px 44px;margin-bottom:7px;background-color:#ffffff;border:1px solid #e5e7eb;border-radius:7px;}
.wp-block-list.is-style-magshow-list-ribbon > li:last-child{margin-bottom:0;}
.wp-block-list.is-style-magshow-list-ribbon > li::before{content:'';position:absolute;left:14px;top:0;width:16px;height:28px;background-color:#1a56db;border-radius:0 0 4px 4px;}
.wp-block-list.is-style-magshow-list-ribbon > li::after{content:'';position:absolute;left:14px;top:22px;border-left:8px solid transparent;border-right:8px solid transparent;border-top:7px solid #1a56db;top:50%;transform:translateY(-50%);}

/* --- 37. Info List ---
   Information style rows with an info marker.
   Good for notes, help sections, and documentation blocks. */
.wp-block-list.is-style-magshow-list-info{padding:14px;background-color:#eff6ff;border:1px solid #bfdbfe;border-radius:10px;}
.wp-block-list.is-style-magshow-list-info > li{position:relative;padding:7px 0 7px 34px;color:#1e3a8a;}
.wp-block-list.is-style-magshow-list-info > li::before{content:'i';position:absolute;left:0;top:7px;width:20px;height:20px;background-color:#1a56db;color:#ffffff;border-radius:50%;font-size:12px;font-weight:700;font-style:italic;display:flex;align-items:center;justify-content:center;line-height:1;top:50%;transform:translateY(-50%);}

/* --- 38. Bookmark List ---
   Bookmark-shaped marker before each item.
   Useful for saved items, resources, reading lists, and links. */
.wp-block-list.is-style-magshow-list-bookmark > li{position:relative;padding:8px 0 8px 34px;border-bottom:1px solid #f3f4f6;}
.wp-block-list.is-style-magshow-list-bookmark > li:last-child{border-bottom:none;}
.wp-block-list.is-style-magshow-list-bookmark > li::before{content:'';position:absolute;left:0;top:8px;width:18px;height:24px;background-color:#1a56db;border-radius:3px 3px 0 0;top:50%;transform:translateY(-50%);}
.wp-block-list.is-style-magshow-list-bookmark > li::after{content:'';position:absolute;left:0;top:24px;border-left:9px solid #1a56db;border-right:9px solid #1a56db;border-bottom:6px solid transparent;}

/* --- 39. Split Accent ---
   Two-tone list rows with accent number marker.
   Good for modern editorial sections and product feature lists. */
.wp-block-list.is-style-magshow-list-split-accent{counter-reset:magshow-split-accent;}
.wp-block-list.is-style-magshow-list-split-accent > li{position:relative;padding:10px 14px 10px 54px;margin-bottom:8px;background-color:#ffffff;border:1px solid #e5e7eb;border-radius:8px;counter-increment:magshow-split-accent;overflow:hidden;}
.wp-block-list.is-style-magshow-list-split-accent > li:last-child{margin-bottom:0;}
.wp-block-list.is-style-magshow-list-split-accent > li::before{content:counter(magshow-split-accent);position:absolute;left:0;top:0;bottom:0;width:40px;background-color:#eff6ff;color:#1a56db;font-size:13px;font-weight:700;display:flex;align-items:center;justify-content:center;line-height:1;border-right:1px solid #bfdbfe;}

/* --- 40. Minimal Icons ---
   Small outlined circle icons with clean spacing.
   Good for simple articles, sidebar notes, and clean blog content. */
.wp-block-list.is-style-magshow-list-minimal-icons > li{position:relative;padding:7px 0 7px 30px;color:#374151;}
.wp-block-list.is-style-magshow-list-minimal-icons > li::before{content:'';position:absolute;left:0;top:11px;width:16px;height:16px;border:1px solid #1a56db;border-radius:50%;background-color:#ffffff;top:50%;transform:translateY(-50%);}
.wp-block-list.is-style-magshow-list-minimal-icons > li::after{content:'';position:absolute;left:6px;top:17px;width:4px;height:4px;background-color:#1a56db;border-radius:50%;top:50%;transform:translateY(-50%);}

/* --- 41. Hover Lift ---
   List cards lift softly on hover.
   Good for feature lists, service points, and benefit sections. */
.wp-block-list.is-style-magshow-list-hover-lift > li{position:relative;padding:10px 14px 10px 40px;margin-bottom:8px;background-color:#ffffff;border:1px solid #e5e7eb;border-radius:9px;box-shadow:0 2px 8px rgba(15,23,42,.04);transition:transform .22s ease,box-shadow .22s ease,border-color .22s ease;}
.wp-block-list.is-style-magshow-list-hover-lift > li:last-child{margin-bottom:0;}
.wp-block-list.is-style-magshow-list-hover-lift > li::before{content:'';position:absolute;left:15px;top:18px;width:8px;height:8px;background-color:#1a56db;border-radius:50%;transition:transform .22s ease;top:50%;transform:translateY(-50%);}
.wp-block-list.is-style-magshow-list-hover-lift > li:hover{transform:translateY(-3px);box-shadow:0 10px 24px rgba(15,23,42,.1);border-color:#bfdbfe;}
.wp-block-list.is-style-magshow-list-hover-lift > li:hover::before{transform:translateY(-50%) scale(1.35);}

/* --- 42. Slide Marker ---
   Marker slides in when hovering each item.
   Useful for navigation lists, resources, and action lists. */
.wp-block-list.is-style-magshow-list-slide-marker > li{position:relative;padding:8px 0 8px 20px;overflow:hidden;}
.wp-block-list.is-style-magshow-list-slide-marker > li::before{content:'\203A';position:absolute;left:0;top:7px;color:#1a56db;font-size:22px;font-weight:700;line-height:1.4;opacity:.55;transition:transform .22s ease,opacity .22s ease;top:50%;transform:translateY(-50%) translateX(0);}
.wp-block-list.is-style-magshow-list-slide-marker > li:hover::before{transform:translateY(-50%) translateX(6px);opacity:1;}

/* --- 43. Pulse Dot ---
   Dots pulse gently to draw attention.
   Good for active items, updates, news, and highlights. */
.wp-block-list.is-style-magshow-list-pulse-dot > li{position:relative;padding:8px 0 8px 34px;}
.wp-block-list.is-style-magshow-list-pulse-dot > li::before{content:'';position:absolute;left:4px;top:14px;width:9px;height:9px;background-color:#1a56db;border-radius:50%;box-shadow:0 0 0 0 rgba(26,86,219,.35);animation:magshow-list-pulse-dot 1.8s ease-out infinite;top:50%;transform:translateY(-50%);}
@keyframes magshow-list-pulse-dot{
    0%{box-shadow:0 0 0 0 rgba(26,86,219,.35);}
    70%{box-shadow:0 0 0 9px rgba(26,86,219,0);}
    100%{box-shadow:0 0 0 0 rgba(26,86,219,0);}
}

/* --- 44. Bounce Arrow ---
   Arrow marker bounces on hover.
   Good for CTAs, link lists, and next-step lists. */
.wp-block-list.is-style-magshow-list-bounce-arrow > li{position:relative;padding:8px 0 8px 34px;}
.wp-block-list.is-style-magshow-list-bounce-arrow > li::before{content:'\2192';position:absolute;left:0;top:50%;color:#1a56db;font-size:16px;font-weight:700;line-height:1;transition:transform .2s ease;transform:translateY(-50%);}
.wp-block-list.is-style-magshow-list-bounce-arrow > li:hover::before{animation:magshow-list-bounce-arrow .45s ease;}
@keyframes magshow-list-bounce-arrow{0%,100%{transform:translateY(-50%) translateX(0);}45%{transform:translateY(-50%) translateX(7px);}70%{transform:translateY(-50%) translateX(3px);}}

/* --- 45. Glow Row ---
   Rows glow softly on hover.
   Useful for modern feature lists and landing page sections. */
.wp-block-list.is-style-magshow-list-glow-row > li{position:relative;padding:10px 14px 10px 42px;margin-bottom:8px;background-color:#f8fafc;border:1px solid #e5e7eb;border-radius:9px;transition:background-color .22s ease,border-color .22s ease,box-shadow .22s ease;}
.wp-block-list.is-style-magshow-list-glow-row > li:last-child{margin-bottom:0;}
.wp-block-list.is-style-magshow-list-glow-row > li::before{content:'';position:absolute;left:15px;top:18px;width:9px;height:9px;background-color:#1a56db;border-radius:50%;box-shadow:0 0 0 5px rgba(26,86,219,.1);top:50%;transform:translateY(-50%);}
.wp-block-list.is-style-magshow-list-glow-row > li:hover{background-color:#ffffff;border-color:#bfdbfe;box-shadow:0 0 0 4px rgba(26,86,219,.08),0 10px 22px rgba(15,23,42,.08);}

/* --- 46. Sweep Line ---
   Accent line sweeps across each row on hover.
   Good for editorial lists, menus, and documentation links. */
.wp-block-list.is-style-magshow-list-sweep-line > li{position:relative;padding:10px 12px;margin-bottom:6px;background-color:#ffffff;border-bottom:1px solid #e5e7eb;overflow:hidden;}
.wp-block-list.is-style-magshow-list-sweep-line > li:last-child{margin-bottom:0;}
.wp-block-list.is-style-magshow-list-sweep-line > li::before{content:'';position:absolute;left:0;bottom:0;width:100%;height:2px;background-color:#1a56db;transform:scaleX(0);transform-origin:left center;transition:transform .28s ease;}
.wp-block-list.is-style-magshow-list-sweep-line > li:hover::before{transform:scaleX(1);}

/* --- 47. Pop Check ---
   Check icon pops on hover.
   Good for feature lists, completed items, and product benefits. */
.wp-block-list.is-style-magshow-list-pop-check > li{position:relative;padding:8px 0 8px 36px;}
.wp-block-list.is-style-magshow-list-pop-check > li::before{content:'\2713';position:absolute;left:0;top:8px;width:22px;height:22px;background-color:#057a55;color:#ffffff;border-radius:50%;font-size:11px;font-weight:700;display:flex;align-items:center;justify-content:center;line-height:1;transition:transform .2s ease,box-shadow .2s ease;top:50%;transform:translateY(-50%);}
.wp-block-list.is-style-magshow-list-pop-check > li:hover::before{transform:translateY(-50%) scale(1.18) rotate(8deg);box-shadow:0 0 0 6px rgba(5,122,85,.12);}

/* --- 48. Zoom Badge ---
   Number badges zoom on hover.
   Best for ranked lists, tutorials, and process steps. */
.wp-block-list.is-style-magshow-list-zoom-badge{counter-reset:magshow-zoom-badge;}
.wp-block-list.is-style-magshow-list-zoom-badge > li{position:relative;padding:9px 0 9px 42px;counter-increment:magshow-zoom-badge;}
.wp-block-list.is-style-magshow-list-zoom-badge > li::before{content:counter(magshow-zoom-badge);position:absolute;left:0;top:6px;width:26px;height:26px;background-color:#1a56db;color:#ffffff;border-radius:8px;font-size:12px;font-weight:700;display:flex;align-items:center;justify-content:center;line-height:1;transition:transform .22s ease,border-radius .22s ease;top:50%;transform:translateY(-50%);}
.wp-block-list.is-style-magshow-list-zoom-badge > li:hover::before{transform:translateY(-50%) scale(1.14);border-radius:50%;}

/* --- 49. Shine Card ---
   Card rows with a light shine effect on hover.
   Useful for premium lists, product features, and homepage sections. */
.wp-block-list.is-style-magshow-list-shine-card > li{position:relative;padding:11px 15px 11px 42px;margin-bottom:8px;background-color:#ffffff;border:1px solid #e5e7eb;border-radius:10px;overflow:hidden;box-shadow:0 2px 8px rgba(15,23,42,.04);}
.wp-block-list.is-style-magshow-list-shine-card > li:last-child{margin-bottom:0;}
.wp-block-list.is-style-magshow-list-shine-card > li::before{content:'';position:absolute;left:15px;top:19px;width:8px;height:8px;background-color:#1a56db;border-radius:50%;z-index:2;top:50%;transform:translateY(-50%);}
.wp-block-list.is-style-magshow-list-shine-card > li::after{content:'';position:absolute;top:0;left:-80px;width:60px;height:100%;background:linear-gradient(90deg,rgba(255,255,255,0),rgba(255,255,255,.75),rgba(255,255,255,0));transform:skewX(-18deg);transition:left .55s ease;}
.wp-block-list.is-style-magshow-list-shine-card > li:hover::after{left:120%;}

/* --- 50. Reveal Line ---
   Left accent line expands on hover.
   Good for clean modern lists, article points, and sidebar blocks. */
.wp-block-list.is-style-magshow-list-reveal-line > li{position:relative;padding:9px 12px 9px 22px;margin-bottom:6px;background-color:#f9fafb;border-radius:7px;transition:padding-left .22s ease,background-color .22s ease;}
.wp-block-list.is-style-magshow-list-reveal-line > li:last-child{margin-bottom:0;}
.wp-block-list.is-style-magshow-list-reveal-line > li::before{content:'';position:absolute;left:0;top:8px;bottom:8px;width:4px;background-color:#1a56db;border-radius:10px;transform:scaleY(.35);transform-origin:center;transition:transform .22s ease;top:50%;transform:translateY(-50%);}
.wp-block-list.is-style-magshow-list-reveal-line > li:hover{padding-left:30px;background-color:#eff6ff;}
.wp-block-list.is-style-magshow-list-reveal-line > li:hover::before{transform:translateY(-50%) scaleY(1);}

/* Reduced motion support */
@media (prefers-reduced-motion:reduce){
    .wp-block-list.is-style-magshow-list-hover-lift > li,
    .wp-block-list.is-style-magshow-list-hover-lift > li::before,
    .wp-block-list.is-style-magshow-list-slide-marker > li::before,
    .wp-block-list.is-style-magshow-list-bounce-arrow > li::before,
    .wp-block-list.is-style-magshow-list-glow-row > li,
    .wp-block-list.is-style-magshow-list-sweep-line > li::before,
    .wp-block-list.is-style-magshow-list-pop-check > li::before,
    .wp-block-list.is-style-magshow-list-zoom-badge > li::before,
    .wp-block-list.is-style-magshow-list-shine-card > li::after,
    .wp-block-list.is-style-magshow-list-reveal-line > li,
    .wp-block-list.is-style-magshow-list-reveal-line > li::before{transition:none;}

    .wp-block-list.is-style-magshow-list-pulse-dot > li::before,
    .wp-block-list.is-style-magshow-list-bounce-arrow > li:hover::before{animation:none;}
}