/**
 * Custom Schema SCHEMAFY - Minimal Professional Admin Styles v2
 * Clean, minimal interface with professional aesthetics
 */

/* ================================
   VARIABLES & RESET
   ================================ */
:root {
    /* Brand Blue — aligned with schemafy.net */
    --schemafy-primary: #4F6EF5;        /* Blue-indigo — matches website CTA */
    --schemafy-primary-hover: #3D5CE3;  /* Darker on hover */
    --schemafy-primary-light: #7B93F8;  /* Light variant for icons/accents */
    --schemafy-primary-dark: #0F172A;   /* Dark navy — matches website dark sections/headers */

    /* Blue Tints for Backgrounds */
    --schemafy-blue-50: #EEF2FE;        /* Lightest blue background */
    --schemafy-blue-100: #DCE4FD;       /* Very light blue */
    --schemafy-blue-200: #B9C8FB;       /* Light blue */
    --schemafy-blue-300: #96ADF9;       /* Medium light blue */
    --schemafy-blue-400: #7B93F8;       /* Medium blue */

    /* Semantic Colors */
    --schemafy-success: #16A34A;        /* Green — matches website checkmarks */
    --schemafy-success-light: #22C55E;  /* Light green */
    --schemafy-info: #7B93F8;           /* Info blue */
    --schemafy-warning: #f59e0b;        /* Warning amber (unchanged) */

    /* Neutral Grays — Apple system palette (cleaner, lighter) */
    --schemafy-white: #ffffff;
    --schemafy-gray-50: #fbfbfd;        /* Apple off-white page background */
    --schemafy-gray-100: #f5f5f7;       /* Apple light gray — hover/active surfaces */
    --schemafy-gray-200: #e8e8ed;       /* Apple separator — soft hairline borders */
    --schemafy-gray-300: #d2d2d7;       /* Apple medium-light gray */
    --schemafy-gray-400: #a1a1aa;       /* Medium gray */
    --schemafy-gray-500: #71717a;       /* Neutral gray */
    --schemafy-gray-600: #52525b;       /* Medium dark gray */
    --schemafy-gray-700: #3f3f46;       /* Dark gray */
    --schemafy-gray-800: #27272a;       /* Very dark gray */
    --schemafy-gray-900: #18181b;       /* Almost black */
    --schemafy-black: #000000;

    /* Success extended */
    --schemafy-success-dark:    #15803D;  /* Green-700 — dark success text */
    --schemafy-success-bg:      #dcfce7;  /* Green-100 — success background */

    /* Warning extended */
    --schemafy-warning-light:   #fbbf24;  /* Amber-400 — light warning */
    --schemafy-warning-dark:    #d97706;  /* Amber-600 — dark warning */
    --schemafy-warning-bg:      #fef3c7;  /* Amber-100 — warning background */

    /* Danger (Subtle) */
    --schemafy-danger: #dc2626;           /* Red-600 — danger actions */
    --schemafy-danger-light: #ef4444;     /* Red-500 — light danger */
    --schemafy-danger-lighter: #f87171;   /* Red-400 — gradient end */
    --schemafy-danger-bg:      #fee2e2;   /* Red-100 — danger background */

    /* Code editor dark theme */
    --schemafy-code-bg:     #1e293b;  /* Slate-800 — dark editor background */
    --schemafy-code-border: #334155;  /* Slate-700 — dark editor border */
    --schemafy-code-text:   #e2e8f0;  /* Slate-200 — text on dark background */

    /* Border Radius — Apple-style, softly rounded */
    --schemafy-radius-sm: 7px;
    --schemafy-radius: 10px;
    --schemafy-radius-lg: 14px;
    --schemafy-radius-xl: 18px;

    /* Shadows — near-invisible elevation; the UI leans on hairline borders */
    --schemafy-shadow: 0 1px 2px rgba(0, 0, 0, 0.03);
    --schemafy-shadow-md: 0 1px 3px rgba(0, 0, 0, 0.04), 0 4px 12px rgba(0, 0, 0, 0.04);
    --schemafy-shadow-lg: 0 2px 6px rgba(0, 0, 0, 0.05), 0 8px 24px rgba(0, 0, 0, 0.05);
    --schemafy-shadow-xl: 0 8px 32px rgba(0, 0, 0, 0.08);

    /* Borders - More prominent than shadows */
    --schemafy-border: 1px solid var(--schemafy-gray-200);
    --schemafy-border-hover: 1px solid var(--schemafy-gray-300);
    --schemafy-border-focus: 1px solid var(--schemafy-primary);

    /* Transitions - Snappy */
    --schemafy-transition: all 0.15s ease;
    --schemafy-transition-fast: all 0.1s ease;

    /* ── Typography tokens ──────────────────────────── */

    /* Font families */
    --schemafy-font-sans: -apple-system, BlinkMacSystemFont, 'Inter', 'Segoe UI',
                       Roboto, Oxygen, sans-serif;
    --schemafy-font-mono: 'SF Mono', 'SFMono-Regular', 'Monaco', 'Menlo',
                       'Consolas', 'Liberation Mono', monospace;

    /* Type scale — 9 levels covering the full admin UI */
    --schemafy-text-xs:   11px;  /* badges, micro labels          */
    --schemafy-text-sm:   12px;  /* helper text, timestamps       */
    --schemafy-text-base: 13px;  /* body, table rows (WP default) */
    --schemafy-text-md:   14px;  /* form labels, descriptions     */
    --schemafy-text-lg:   15px;  /* emphasized body, buttons      */
    --schemafy-text-xl:   17px;  /* section subheadings           */
    --schemafy-text-2xl:  20px;  /* card titles                   */
    --schemafy-text-3xl:  24px;  /* section headings              */
    --schemafy-text-4xl:  32px;  /* display numbers               */

    /* Font weights */
    --schemafy-font-normal:   400;
    --schemafy-font-medium:   500;
    --schemafy-font-semibold: 600;
    --schemafy-font-bold:     700;

    /* Line heights */
    --schemafy-leading-none:    1;     /* single-line number displays  */
    --schemafy-leading-tight:   1.25;  /* headlines, compact text      */
    --schemafy-leading-snug:    1.4;   /* tab labels, badges           */
    --schemafy-leading-normal:  1.55;  /* body text, descriptions      */
    --schemafy-leading-relaxed: 1.65;  /* long-form, recommendations   */

    /* Letter spacing */
    --schemafy-tracking-tight:  -0.02em; /* headlines, display numbers   */
    --schemafy-tracking-normal:  0em;    /* default body                 */
    --schemafy-tracking-wide:    0.05em; /* labels, uppercase caps       */
}

/* ================================
   WORDPRESS ADMIN MENU STYLES
   ================================ */
/* Style the SCHEMAFY menu items in WordPress sidebar */
#adminmenu .toplevel_page_schemafy-custom-schema .wp-submenu a {
    display: flex;
    align-items: center;
    gap: 6px;
}

#adminmenu .toplevel_page_schemafy-custom-schema .wp-submenu li a:hover,
#adminmenu .toplevel_page_schemafy-custom-schema .wp-submenu li.current a {
    color: var(--schemafy-primary);
}

/* Emoji sizing in menu */
#adminmenu .toplevel_page_schemafy-custom-schema .wp-submenu a {
    font-size: 13px;
}

/* ================================
   MAIN WRAPPER
   ================================ */
.schemafy-admin-wrap-v2 {
    margin: 20px 0 20px 20px;
    background: var(--schemafy-white);
    min-height: calc(100vh - 60px);
    overflow-x: hidden;
    font-family: var(--schemafy-font-sans);
    font-size: var(--schemafy-text-base);
    line-height: var(--schemafy-leading-normal);
    color: var(--schemafy-gray-900);
    /* Crisp SF Pro rendering — the single biggest "Apple feel" win on macOS */
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    text-rendering: optimizeLegibility;
}

/* ================================
   BASE ELEMENT STYLES
   Cascade from wrapper — establishes plugin-wide
   typography and form baseline. Specific component
   styles override these as needed.
   ================================ */

/* Heading hierarchy — matches schemafy.net scale */
.schemafy-admin-wrap-v2 h1 {
    font-size: var(--schemafy-text-3xl);
    font-weight: var(--schemafy-font-bold);
    line-height: var(--schemafy-leading-tight);
    letter-spacing: var(--schemafy-tracking-tight);
    color: var(--schemafy-gray-900);
    margin: 0;
}
.schemafy-admin-wrap-v2 h2 {
    font-size: var(--schemafy-text-2xl);
    font-weight: var(--schemafy-font-semibold);
    line-height: var(--schemafy-leading-tight);
    letter-spacing: var(--schemafy-tracking-tight);
    color: var(--schemafy-gray-900);
    margin: 0;
}
.schemafy-admin-wrap-v2 h3 {
    font-size: var(--schemafy-text-xl);
    font-weight: var(--schemafy-font-semibold);
    line-height: var(--schemafy-leading-snug);
    color: var(--schemafy-gray-900);
    margin: 0;
}
.schemafy-admin-wrap-v2 h4 {
    font-size: var(--schemafy-text-lg);
    font-weight: var(--schemafy-font-semibold);
    line-height: var(--schemafy-leading-snug);
    color: var(--schemafy-gray-800);
    margin: 0;
}

/* All text inputs, selects and textareas */
.schemafy-admin-wrap-v2 input:not([type="checkbox"]):not([type="radio"]):not([type="submit"]):not([type="button"]):not([type="range"]),
.schemafy-admin-wrap-v2 select,
.schemafy-admin-wrap-v2 textarea {
    font-family: var(--schemafy-font-sans);
    font-size: var(--schemafy-text-base);
    color: var(--schemafy-gray-900);
    background: var(--schemafy-white);
    border: var(--schemafy-border);
    border-radius: var(--schemafy-radius);
    line-height: var(--schemafy-leading-normal);
    transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

.schemafy-admin-wrap-v2 input:not([type="checkbox"]):not([type="radio"]):not([type="submit"]):not([type="button"]):not([type="range"]):focus,
.schemafy-admin-wrap-v2 select:focus,
.schemafy-admin-wrap-v2 textarea:focus {
    outline: none;
    border-color: var(--schemafy-primary);
    box-shadow: 0 0 0 3px rgba(79, 110, 245, 0.12);
}

/* All buttons inherit the brand font */
.schemafy-admin-wrap-v2 button,
.schemafy-admin-wrap-v2 input[type="submit"],
.schemafy-admin-wrap-v2 input[type="button"] {
    font-family: var(--schemafy-font-sans);
}

/* Labels */
.schemafy-admin-wrap-v2 label {
    font-family: var(--schemafy-font-sans);
    font-size: var(--schemafy-text-md);
    font-weight: var(--schemafy-font-medium);
    color: var(--schemafy-gray-800);
    line-height: var(--schemafy-leading-snug);
}

/* Paragraphs and inline text */
.schemafy-admin-wrap-v2 p {
    font-size: var(--schemafy-text-base);
    line-height: var(--schemafy-leading-normal);
    color: var(--schemafy-gray-700);
    margin: 0;
}

.schemafy-logo {
    display: flex;
    align-items: center;
    gap: 10px;
}

.schemafy-logo .dashicons {
    width: 36px;
    height: 36px;
    font-size: 36px;
    color: var(--schemafy-primary);
}

.schemafy-logo h1 {
    margin: 0;
    font-size: 20px;
    font-weight: 600;
    color: var(--schemafy-gray-900);
    line-height: 1.2;
    letter-spacing: -0.02em;
}

.schemafy-version {
    margin: 0;
    font-size: 11px;
    color: var(--schemafy-gray-400);
    font-weight: 500;
}

.schemafy-btn-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    padding: 0;
    background: var(--schemafy-white);
    border: var(--schemafy-border);
    border-radius: var(--schemafy-radius-sm);
    cursor: pointer;
    transition: all 0.15s ease;
    color: var(--schemafy-gray-500);
    flex-shrink: 0;
}

.schemafy-btn-icon:hover {
    background: var(--schemafy-gray-50);
    border-color: var(--schemafy-primary);
    color: var(--schemafy-primary);
}

.schemafy-btn-icon .dashicons {
    width: 16px;
    height: 16px;
    font-size: 16px;
}


.schemafy-btn-secondary {
    background: var(--schemafy-white);
    color: var(--schemafy-gray-600);
    border: var(--schemafy-border);
    padding: 7px 14px;
    border-radius: var(--schemafy-radius);
    text-decoration: none;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: 13px;
    font-weight: 500;
    transition: var(--schemafy-transition);
    cursor: pointer;
}

.schemafy-btn-secondary:hover {
    background: var(--schemafy-gray-50);
    border-color: var(--schemafy-gray-300);
    color: var(--schemafy-gray-800);
}

.schemafy-btn-secondary .dashicons {
    width: 15px;
    height: 15px;
    font-size: 15px;
}

.schemafy-btn-icon {
    padding: 0;
    width: 32px;
    height: 32px;
    justify-content: center;
    flex-shrink: 0;
}

.schemafy-btn-icon .dashicons {
    margin: 0;
}

.schemafy-tab-btn-v2 {
    background: transparent;
    border: none;
    border-bottom: 2px solid transparent;
    padding: 11px 14px;
    margin-bottom: -1px;
    color: var(--schemafy-gray-500);
    font-size: 13px;
    font-weight: 500;
    cursor: pointer;
    transition: color 0.15s ease, border-color 0.15s ease;
    display: flex;
    align-items: center;
    gap: 6px;
    white-space: nowrap;
}

.schemafy-tab-btn-v2 .dashicons {
    width: 15px;
    height: 15px;
    font-size: 15px;
    opacity: 0.7;
}

.schemafy-tab-btn-v2:hover {
    color: var(--schemafy-gray-800);
    background: transparent;
}

.schemafy-tab-btn-v2.active {
    color: var(--schemafy-gray-900);
    border-bottom-color: var(--schemafy-gray-900);
    background: transparent;
    font-weight: 600;
}

.schemafy-tab-btn-v2.active .dashicons {
    opacity: 1;
}

.schemafy-tab-btn-v2.active:hover {
    background: transparent;
}

/* ================================
   TAB CONTENT
   ================================ */
.schemafy-tab-content-v2 {
    display: none;
    animation: fadeIn 0.3s ease-in-out;
    overflow-x: hidden;
}

.schemafy-tab-content-v2.active {
    display: block;
    overflow-x: hidden;
}

@keyframes fadeIn {
    from {
        opacity: 0;
        transform: translateY(10px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* ================================
   STANDARDIZED TAB HEADER
   ================================ */
.schemafy-tab-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 18px 24px;
    background: var(--schemafy-primary-dark);
    border-bottom: 1px solid rgba(255, 255, 255, 0.07);
    margin: 0 0 24px 0;
}

.schemafy-tab-header-content {
    display: flex;
    align-items: center;
    gap: 12px;
    flex: 1;
}

.schemafy-tab-header-icon {
    width: 34px;
    height: 34px;
    background: rgba(255, 255, 255, 0.1);
    border-radius: var(--schemafy-radius);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.schemafy-tab-header-icon .dashicons {
    font-size: 17px;
    width: 17px;
    height: 17px;
    color: rgba(255, 255, 255, 0.75);
}

.schemafy-tab-header-text {
    flex: 1;
}

.schemafy-tab-header-text h2 {
    margin: 0 0 2px 0;
    font-size: 15px;
    font-weight: 600;
    color: #ffffff;
    line-height: 1.3;
    letter-spacing: -0.1px;
}

.schemafy-tab-header-text p {
    margin: 0;
    font-size: var(--schemafy-text-sm);
    color: rgba(255, 255, 255, 0.55);
    line-height: 1.4;
}

.schemafy-tab-header-actions {
    display: flex;
    gap: 8px;
    align-items: center;
    flex-shrink: 0;
}

.schemafy-tab-header-badge {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 4px 10px;
    background: rgba(255, 255, 255, 0.1);
    color: rgba(255, 255, 255, 0.7);
    border-radius: 20px;
    font-size: var(--schemafy-text-xs);
    font-weight: 500;
}

.schemafy-tab-header-badge .dashicons {
    font-size: 13px;
    width: 13px;
    height: 13px;
    color: rgba(255, 255, 255, 0.7);
}

.schemafy-tab-header .schemafy-btn-secondary {
    background: rgba(255, 255, 255, 0.08);
    border-color: rgba(255, 255, 255, 0.14);
    color: rgba(255, 255, 255, 0.85);
}

.schemafy-tab-header .schemafy-btn-secondary:hover {
    background: rgba(255, 255, 255, 0.14);
    border-color: rgba(255, 255, 255, 0.22);
    color: #ffffff;
}

.schemafy-tab-header .schemafy-btn-secondary .dashicons {
    color: rgba(255, 255, 255, 0.75);
}

/* Compact tab header variant — same as default now */
.schemafy-tab-header.schemafy-tab-header-compact {
    padding: 14px 24px;
}

.schemafy-tab-header.schemafy-tab-header-compact .schemafy-tab-header-icon {
    width: 30px;
    height: 30px;
}

.schemafy-tab-header.schemafy-tab-header-compact .schemafy-tab-header-icon .dashicons {
    font-size: 15px;
    width: 15px;
    height: 15px;
}

.schemafy-tab-header.schemafy-tab-header-compact .schemafy-tab-header-text h2 {
    font-size: 14px;
}

.schemafy-tab-header.schemafy-tab-header-compact .schemafy-tab-header-text p {
    font-size: 12px;
}

/* Tab header inside card — no margin, top radius matches card */
.schemafy-card-v2 > .schemafy-tab-header {
    margin: 0;
    border-radius: var(--schemafy-radius) var(--schemafy-radius) 0 0;
}

/* Tab header standalone — rounded all sides, subtle shadow */
.schemafy-tab-content-v2 > .schemafy-tab-header {
    border: none;
    border-radius: var(--schemafy-radius);
    margin-bottom: 24px;
    box-shadow: var(--schemafy-shadow-md);
}

/* Responsive tab header */
@media (max-width: 768px) {
    .schemafy-tab-header {
        flex-direction: column;
        gap: 12px;
        align-items: stretch;
    }

    .schemafy-tab-header-actions {
        justify-content: flex-start;
        flex-wrap: wrap;
    }
}

/* ================================
   KPI ROW (Dashboard Stats)
   ================================ */
.schemafy-kpi-row {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 16px;
    margin: 24px 24px 24px;
}

.schemafy-kpi-card {
    background: var(--schemafy-white);
    border: var(--schemafy-border);
    border-radius: var(--schemafy-radius);
    padding: 20px 24px;
}

.schemafy-kpi-value {
    font-size: 36px;
    font-weight: 700;
    color: var(--schemafy-gray-900);
    line-height: 1;
    letter-spacing: -0.03em;
    margin: 0 0 6px;
}

.schemafy-kpi-muted {
    color: var(--schemafy-gray-400);
}

.schemafy-kpi-label {
    font-size: 11px;
    color: var(--schemafy-gray-400);
    font-weight: 500;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    margin: 0;
}

@media (max-width: 1024px) {
    .schemafy-kpi-row { grid-template-columns: repeat(2, 1fr); }
}

@media (max-width: 600px) {
    .schemafy-kpi-row { grid-template-columns: 1fr; }
}

/* ================================
   CARDS
   ================================ */
.schemafy-card-v2 {
    background: var(--schemafy-white);
    border: var(--schemafy-border);
    border-radius: var(--schemafy-radius);
    margin: 0 24px 24px;
    overflow: hidden;
}

.schemafy-card-header-v2 {
    padding: 15px 20px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.07);
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    gap: 10px;
    background: var(--schemafy-primary-dark);
}

.schemafy-card-header-v2 h2 {
    margin: 0;
    font-size: 14px;
    font-weight: 600;
    color: #ffffff;
    display: flex;
    align-items: center;
    gap: 7px;
}

.schemafy-card-header-v2 h2 .dashicons {
    width: 16px;
    height: 16px;
    font-size: 16px;
    color: rgba(255, 255, 255, 0.5);
}

/* Buttons on dark card header */
.schemafy-card-header-v2 .schemafy-btn-secondary {
    background: rgba(255, 255, 255, 0.08);
    border-color: rgba(255, 255, 255, 0.14);
    color: rgba(255, 255, 255, 0.85);
}

.schemafy-card-header-v2 .schemafy-btn-secondary:hover {
    background: rgba(255, 255, 255, 0.14);
    border-color: rgba(255, 255, 255, 0.22);
    color: #ffffff;
}

.schemafy-card-header-v2 .schemafy-btn-secondary .dashicons {
    color: rgba(255, 255, 255, 0.75);
}

/* Search input on dark card header */
.schemafy-card-header-v2 .schemafy-search-input-v2 {
    background: rgba(255, 255, 255, 0.08);
    border-color: rgba(255, 255, 255, 0.14);
    color: rgba(255, 255, 255, 0.9);
}

.schemafy-card-header-v2 .schemafy-search-input-v2::placeholder {
    color: rgba(255, 255, 255, 0.4);
}

.schemafy-card-header-v2 .schemafy-search-input-v2:focus {
    background: rgba(255, 255, 255, 0.12);
    border-color: rgba(255, 255, 255, 0.3);
    box-shadow: none;
    outline: none;
}

/* Select on dark card header */
.schemafy-card-header-v2 .schemafy-select-v2 {
    background: rgba(255, 255, 255, 0.08);
    border-color: rgba(255, 255, 255, 0.14);
    color: rgba(255, 255, 255, 0.9);
}

.schemafy-card-actions {
    display: flex;
    gap: 8px;
    align-items: center;
    flex-wrap: wrap;
    margin-left: auto;
}

.schemafy-card-body-v2 {
    padding: 20px;
    min-width: 0;
    overflow: hidden;
}

/* ================================
   FILTER BAR (Crawler Logs & other lists)
   ================================ */
.schemafy-filter-bar-card {
    margin-bottom: 16px !important;
}

.schemafy-filter-bar {
    display: flex;
    align-items: center;
    gap: 12px;
    flex-wrap: wrap;
    padding: 12px 20px !important;
}

.schemafy-filter-group {
    display: flex;
    align-items: center;
    gap: 8px;
}

.schemafy-filter-label {
    font-size: var(--schemafy-text-sm);
    font-weight: 600;
    color: var(--schemafy-gray-500);
    white-space: nowrap;
}

.schemafy-filter-search {
    flex: 1;
    min-width: 200px;
}

.schemafy-filter-search .schemafy-search-input-v2 {
    width: 100%;
    min-width: 0;
    box-sizing: border-box;
}

/* ================================
   SEARCH & SELECT INPUTS
   ================================ */
.schemafy-search-input-v2 {
    padding: 7px 12px 7px 36px;
    border: var(--schemafy-border);
    border-radius: var(--schemafy-radius);
    font-size: 13px;
    background-color: var(--schemafy-white);
    background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="%23a1a1aa" stroke-width="2"><circle cx="11" cy="11" r="8"/><path d="m21 21-4.35-4.35"/></svg>');
    background-repeat: no-repeat;
    background-position: 10px center;
    background-size: 15px 15px;
    min-width: 180px;
    transition: var(--schemafy-transition);
}

.schemafy-search-input-v2:focus {
    outline: none;
    border-color: var(--schemafy-gray-400);
    background-color: var(--schemafy-white);
}

/* Meta Tags page-search input: no icon, normal padding */
#schemafy-meta-page-search {
    padding: 7px 12px;
    background-image: none;
}

.schemafy-select-v2 {
    padding: 7px 30px 7px 12px;
    border: var(--schemafy-border);
    border-radius: var(--schemafy-radius);
    font-size: 13px;
    background-color: var(--schemafy-white);
    background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="12" height="12" viewBox="0 0 12 12"><path fill="%23a1a1aa" d="M6 9L1 4h10z"/></svg>');
    background-repeat: no-repeat;
    background-position: right 10px center;
    cursor: pointer;
    transition: var(--schemafy-transition);
    -webkit-appearance: none;
    appearance: none;
}

.schemafy-select-v2:focus {
    outline: none;
    border-color: var(--schemafy-gray-400);
}

/* Compact Search Input */
.schemafy-search-input-v2[style*="padding: 6px"] {
    background-position: 8px center;
    background-size: 14px 14px;
    min-width: auto;
}

/* Compact Header Buttons */
.schemafy-card-header-v2 .schemafy-btn-secondary[style*="padding: 6px"] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 4px;
    height: 32px;
    border-radius: var(--schemafy-radius-sm);
}

.schemafy-card-header-v2 .schemafy-btn-secondary[style*="padding: 6px"]:hover {
    background: rgba(255, 255, 255, 0.18);
    border-color: rgba(255, 255, 255, 0.28);
    color: #ffffff;
}

.schemafy-card-header-v2 .schemafy-btn-secondary[style*="padding: 6px"] .dashicons {
    line-height: 1;
}

/* ================================
   LOADING STATES
   ================================ */
.schemafy-loading-v2 {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 48px 20px;
    gap: 12px;
}

.schemafy-spinner-v2 {
    width: 32px;
    height: 32px;
    border: 2px solid var(--schemafy-gray-200);
    border-top-color: var(--schemafy-gray-600);
    border-radius: 50%;
    animation: spin 0.6s linear infinite;
}

@keyframes spin {
    to { transform: rotate(360deg); }
}

.schemafy-loading-v2 p {
    margin: 0;
    color: var(--schemafy-gray-500);
    font-size: 13px;
}

/* ================================
   URL COMBOBOX (Smart Builder)
   ================================ */
.schemafy-url-combobox-wrap {
    position: relative;
    display: flex;
    align-items: center;
}
.schemafy-url-combobox-icon {
    position: absolute;
    left: 11px;
    color: var(--schemafy-gray-400);
    font-size: 16px;
    width: 16px;
    height: 16px;
    pointer-events: none;
}
.schemafy-url-combobox {
    width: 100%;
    box-sizing: border-box;
    padding: 10px 12px 10px 34px;
    border: 1px solid var(--schemafy-gray-300);
    border-radius: var(--schemafy-radius);
    font-size: 14px;
    color: var(--schemafy-gray-900);
    background: var(--schemafy-white);
    outline: none;
    transition: border-color 0.15s, box-shadow 0.15s;
    font-family: inherit;
}
.schemafy-url-combobox:focus {
    border-color: var(--schemafy-primary);
    box-shadow: 0 0 0 3px rgba(79, 110, 245, 0.15);
}
.schemafy-url-combobox::placeholder {
    color: var(--schemafy-gray-400);
}
.schemafy-url-results {
    display: none;
    position: absolute;
    top: calc(100% + 4px);
    left: 0;
    right: 0;
    background: var(--schemafy-white);
    border: 1px solid var(--schemafy-gray-200);
    border-radius: var(--schemafy-radius);
    box-shadow: 0 8px 24px rgba(0,0,0,0.12);
    z-index: 9999;
    max-height: 280px;
    overflow-y: auto;
}
.schemafy-url-result-group {
    padding: 6px 12px 4px;
    font-size: 10px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: var(--schemafy-gray-400);
    background: var(--schemafy-gray-50);
    border-bottom: 1px solid var(--schemafy-gray-100);
}
.schemafy-url-result {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 9px 12px;
    cursor: pointer;
    border-bottom: 1px solid var(--schemafy-gray-100);
    transition: background 0.1s;
}
.schemafy-url-result:last-child { border-bottom: none; }
.schemafy-url-result:hover { background: var(--schemafy-gray-50); }
.schemafy-url-result .dashicons {
    font-size: 16px;
    width: 16px;
    height: 16px;
    flex-shrink: 0;
    color: var(--schemafy-gray-400);
}
.schemafy-url-result-paste .dashicons { color: var(--schemafy-primary); }
.schemafy-url-result-body {
    display: flex;
    flex-direction: column;
    min-width: 0;
}
.schemafy-url-result-title {
    font-size: 13px;
    font-weight: 500;
    color: var(--schemafy-gray-900);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.schemafy-url-result-url {
    font-size: 11px;
    color: var(--schemafy-gray-400);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.schemafy-url-result-empty {
    padding: 14px 12px;
    font-size: 13px;
    color: var(--schemafy-gray-400);
    text-align: center;
}
/* Keep container position:relative so results panel anchors correctly */
.schemafy-url-dropdown-container { position: relative; }

/* ================================
   URL MAP
   ================================ */
/* ── URL Map Grid ─────────────────────────────────────────────────────── */
.schemafy-url-map-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(290px, 1fr));
    gap: 10px;
    padding: 2px;
}

/* ── URL Card ─────────────────────────────────────────────────────────── */
.schemafy-url-card {
    background: var(--schemafy-white);
    border: 1px solid var(--schemafy-gray-200);
    border-left: 3px solid var(--schemafy-gray-200); /* overridden by data-accent */
    border-radius: var(--schemafy-radius-lg);
    padding: 14px 14px 0 13px;
    cursor: pointer;
    display: flex;
    flex-direction: column;
    position: relative;
    overflow: hidden;
    transition: box-shadow 0.15s ease, border-color 0.15s ease, transform 0.15s ease;
}

/* Uniform left accent — primary for all schema-tagged cards */
.schemafy-url-card[data-accent] { border-left-color: var(--schemafy-primary); }

.schemafy-url-card:hover {
    box-shadow: 0 4px 14px rgba(0, 0, 0, 0.08);
    transform: translateY(-1px);
    border-color: var(--schemafy-gray-300);
    z-index: 1;
}

.schemafy-url-card:focus-visible {
    outline: 2px solid var(--schemafy-primary);
    outline-offset: 2px;
}

/* ── Card Header ──────────────────────────────────────────────────────── */
.schemafy-url-card-header {
    display: flex;
    align-items: flex-start;
    gap: 8px;
    margin-bottom: 10px;
}

.schemafy-url-card-meta {
    flex: 1;
    min-width: 0;
}

.schemafy-url-card-path {
    font-size: 13px;
    font-weight: 600;
    color: var(--schemafy-gray-900);
    line-height: 1.3;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    margin-bottom: 1px;
    font-family: var(--schemafy-font-mono);
    letter-spacing: -0.2px;
}

.schemafy-url-card-domain {
    font-size: 11px;
    color: var(--schemafy-gray-400);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    font-family: var(--schemafy-font-sans);
}

/* Count badge */
.schemafy-url-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 20px;
    height: 20px;
    padding: 0 6px;
    background: var(--schemafy-gray-100);
    color: var(--schemafy-gray-600);
    border-radius: 10px;
    font-size: 11px;
    font-weight: 700;
    flex-shrink: 0;
    line-height: 1;
    transition: background 0.15s ease, color 0.15s ease;
}

.schemafy-url-card:hover .schemafy-url-badge {
    background: var(--schemafy-blue-50);
    color: var(--schemafy-primary);
}

/* ── Schema chips ─────────────────────────────────────────────────────── */
.schemafy-url-card-schemas {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;   /* prevents stretch bug */
    gap: 4px;
    padding-bottom: 12px;
    min-height: 0;
}

.schemafy-schema-chip {
    display: inline-flex;
    align-items: center;
    flex-shrink: 0;             /* never stretch */
    gap: 4px;
    padding: 0 8px;
    height: 22px;               /* fixed height = consistent pills */
    border-radius: 11px;
    font-size: 11px;
    font-weight: 500;
    white-space: nowrap;
    border: 1px solid transparent;
    line-height: 1;
}

/* Inactive */
.schemafy-schema-chip-inactive {
    background: var(--schemafy-gray-100);
    color: var(--schemafy-gray-400);
    border-color: var(--schemafy-gray-200);
}

/* Unified active chip — all categories same neutral style */
.schemafy-chip-structural,
.schemafy-chip-article,
.schemafy-chip-business,
.schemafy-chip-content,
.schemafy-chip-commerce,
.schemafy-chip-education {
    background: var(--schemafy-gray-100);
    color: var(--schemafy-gray-700);
    border-color: var(--schemafy-gray-200);
}

/* "+N more" overflow badge */
.schemafy-chip-overflow {
    background: var(--schemafy-gray-100);
    color: var(--schemafy-gray-500);
    border-color: var(--schemafy-gray-200);
    font-weight: 600;
}

/* Active dot — single primary color for all categories */
.schemafy-chip-dot {
    width: 6px;
    height: 6px;
    border-radius: 50%;
    flex-shrink: 0;
    background: var(--schemafy-primary);
}

/* ── Hover action bar ─────────────────────────────────────────────────── */
.schemafy-url-card-actions {
    display: flex;
    border-top: 1px solid var(--schemafy-gray-100);
    margin: auto -14px 0;  /* stick to bottom */
    opacity: 0;
    max-height: 0;
    overflow: hidden;
    transition: opacity 0.15s ease, max-height 0.15s ease;
    pointer-events: none;
}

.schemafy-url-card:hover .schemafy-url-card-actions {
    opacity: 1;
    max-height: 34px;
    pointer-events: all;
}

.schemafy-url-card-action {
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 4px;
    padding: 7px 4px;
    background: transparent;
    border: none;
    font-size: 11px;
    font-weight: 600;
    color: var(--schemafy-gray-400);
    cursor: pointer;
    transition: background 0.1s ease, color 0.1s ease;
    white-space: nowrap;
    font-family: var(--schemafy-font-sans);
}

.schemafy-url-card-action:hover {
    background: var(--schemafy-gray-50);
    color: var(--schemafy-primary);
}

.schemafy-url-card-action + .schemafy-url-card-action {
    border-left: 1px solid var(--schemafy-gray-100);
}

.schemafy-url-card-action .dashicons {
    font-size: 12px;
    width: 12px;
    height: 12px;
}

/* ================================
   SCHEMA TYPES LIST (Dashboard)
   ================================ */
.schemafy-types-list {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
    gap: 2px;
}

.schemafy-type-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 10px 12px;
    border-radius: var(--schemafy-radius);
    transition: background 0.12s ease;
}

.schemafy-type-row:hover {
    background: var(--schemafy-gray-50);
}

.schemafy-type-name {
    font-size: var(--schemafy-text-base);
    color: var(--schemafy-gray-700);
    font-weight: 500;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.schemafy-type-count {
    font-size: var(--schemafy-text-sm);
    font-weight: 700;
    color: var(--schemafy-gray-500);
    background: var(--schemafy-gray-100);
    border: 1px solid var(--schemafy-gray-200);
    border-radius: 20px;
    padding: 1px 10px;
    flex-shrink: 0;
    line-height: 1.6;
}

/* ================================
   BUILDER LAYOUT
   ================================ */
/* ================================
   SMART BUILDER LAYOUT
   ================================ */
.schemafy-builder-container {
    display: grid;
    grid-template-columns: 270px 1fr 300px;
    gap: 1px;
    background: var(--schemafy-gray-200);
    min-height: 600px;
    border: var(--schemafy-border);
    border-radius: var(--schemafy-radius-lg);
    overflow: hidden;
    margin: 24px;
    box-shadow: var(--schemafy-shadow-md);
}

@media (max-width: 1400px) {
    .schemafy-builder-container {
        grid-template-columns: 1fr;
    }
    .schemafy-builder-sidebar { order: 1; }
    .schemafy-builder-main    { order: 2; }
    .schemafy-builder-preview { order: 3; }
}

.schemafy-builder-sidebar,
.schemafy-builder-main,
.schemafy-builder-preview {
    background: var(--schemafy-white);
}

/* ── Sidebar ──────────────────────────────────────────────────── */
.schemafy-builder-sidebar {
    padding: 0;
    display: flex;
    flex-direction: column;
    overflow: hidden;
}

.schemafy-builder-sidebar-header {
    padding: 16px 16px 12px;
    border-bottom: 1px solid var(--schemafy-gray-100);
    background: var(--schemafy-primary-dark);
}

.schemafy-builder-sidebar-title {
    font-size: 13px;
    font-weight: 600;
    color: #ffffff;
    margin: 0 0 2px;
    display: block;
}

.schemafy-builder-sidebar-sub {
    font-size: 11px;
    color: rgba(255,255,255,0.5);
    display: block;
}

.schemafy-schema-types-grid {
    display: flex;
    flex-direction: column;
    gap: 2px;
    padding: 10px;
    overflow-y: auto;
    flex: 1;
}

/* ── Schema type cards ────────────────────────────────────────── */
.schemafy-schema-type-card {
    background: transparent;
    border: none;
    padding: 8px 10px;
    border-radius: var(--schemafy-radius);
    display: flex;
    align-items: center;
    gap: 10px;
    cursor: pointer;
    transition: background 0.12s ease;
    text-align: left;
    width: 100%;
    position: relative;
}

.schemafy-schema-type-card:hover {
    background: var(--schemafy-gray-50);
}

.schemafy-schema-type-card:hover .schemafy-type-icon-box {
    background: var(--schemafy-blue-50);
}

.schemafy-schema-type-card:hover .schemafy-type-name {
    color: var(--schemafy-primary);
}

.schemafy-schema-type-card.active {
    background: var(--schemafy-blue-50);
}

.schemafy-schema-type-card.active .schemafy-type-icon-box {
    background: var(--schemafy-primary);
}

.schemafy-schema-type-card.active .schemafy-type-name {
    color: var(--schemafy-primary);
    font-weight: 700;
}

.schemafy-schema-type-card.active .schemafy-type-desc {
    color: var(--schemafy-primary);
    opacity: 0.65;
}

.schemafy-type-icon-box {
    width: 34px;
    height: 34px;
    background: var(--schemafy-gray-100);
    border-radius: var(--schemafy-radius-sm);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 16px;
    flex-shrink: 0;
    transition: background 0.12s ease;
}

.schemafy-type-info {
    display: flex;
    flex-direction: column;
    gap: 1px;
    min-width: 0;
}

.schemafy-type-name {
    font-size: 12px;
    font-weight: 600;
    color: var(--schemafy-gray-700);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    transition: color 0.12s ease;
}

.schemafy-type-desc {
    font-size: 10px;
    color: var(--schemafy-gray-400);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    line-height: 1.3;
}

/* Legacy — hidden when icon-box is used */
.schemafy-type-icon { display: none; }

/* ── Center form ──────────────────────────────────────────────── */
.schemafy-builder-main {
    padding: 28px;
    min-width: 0;
    overflow: hidden;
    background: var(--schemafy-white);
}

/* ── Placeholder (empty state) ────────────────────────────────── */
.schemafy-builder-placeholder {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 56px 32px;
    text-align: center;
    height: 100%;
}

.schemafy-builder-placeholder-emoji {
    font-size: 40px;
    margin-bottom: 16px;
    display: block;
    line-height: 1;
}

.schemafy-builder-placeholder h3 {
    margin: 0 0 6px;
    font-size: 16px;
    font-weight: 700;
    color: var(--schemafy-gray-800);
    letter-spacing: -0.02em;
}

.schemafy-builder-placeholder > p {
    margin: 0 0 28px;
    font-size: 13px;
    color: var(--schemafy-gray-400);
    max-width: 300px;
}

/* 3-step guide */
.schemafy-builder-steps {
    display: flex;
    align-items: flex-start;
    gap: 6px;
    margin-top: 4px;
}

.schemafy-builder-step {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 8px;
    width: 88px;
}

.schemafy-step-num {
    width: 30px;
    height: 30px;
    background: var(--schemafy-primary);
    color: #fff;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 12px;
    font-weight: 700;
    flex-shrink: 0;
}

.schemafy-step-text {
    font-size: 11px;
    color: var(--schemafy-gray-500);
    font-weight: 500;
    line-height: 1.4;
    text-align: center;
}

.schemafy-step-arrow {
    color: var(--schemafy-gray-300);
    font-size: 18px;
    margin-top: 6px;
    flex-shrink: 0;
}

/* ── Preview panel ────────────────────────────────────────────── */
.schemafy-builder-preview {
    display: flex;
    flex-direction: column;
    background: var(--schemafy-gray-50);
}

.schemafy-preview-header {
    padding: 14px 16px;
    border-bottom: 1px solid rgba(255,255,255,0.07);
    display: flex;
    justify-content: space-between;
    align-items: center;
    background: var(--schemafy-primary-dark);
}

.schemafy-preview-header h3 {
    margin: 0;
    font-size: 12px;
    font-weight: 600;
    color: #ffffff;
    letter-spacing: 0;
}

.schemafy-preview-header .schemafy-btn-icon {
    background: rgba(255,255,255,0.18);
    border: 1px solid rgba(255,255,255,0.45);
    color: #ffffff;
}

.schemafy-preview-header .schemafy-btn-icon:hover {
    background: rgba(255,255,255,0.3);
    color: #fff;
}

.schemafy-preview-header .schemafy-btn-icon .dashicons {
    color: #ffffff;
}

.schemafy-preview-body {
    flex: 1;
    padding: 14px;
    overflow-y: auto;
    max-height: 460px;
}

.schemafy-preview-body pre {
    margin: 0;
    background: var(--schemafy-code-bg);
    padding: 14px;
    border-radius: var(--schemafy-radius);
    font-size: 11px;
    line-height: 1.6;
    overflow-x: auto;
    border: 1px solid var(--schemafy-code-border);
}

.schemafy-preview-body code {
    color: #a6e22e !important;
    font-family: var(--schemafy-font-mono);
    white-space: pre-wrap;
    word-break: break-word;
}

.schemafy-preview-footer {
    padding: 14px 16px;
    border-top: 1px solid var(--schemafy-gray-100);
    background: var(--schemafy-white);
}

/* ================================
   MANUAL JSON EDITOR LAYOUT
   ================================ */
.schemafy-manual-layout {
    display: grid;
    grid-template-columns: 320px 1fr;
    gap: 1px;
    background: var(--schemafy-gray-200);
    min-height: 580px;
    border-radius: 0 0 var(--schemafy-radius) var(--schemafy-radius);
    overflow: hidden;
}

/* ── Left sidebar ─────────────────────────────────────────────── */
.schemafy-manual-sidebar {
    background: var(--schemafy-white);
    display: flex;
    flex-direction: column;
    overflow: hidden;
}

.schemafy-manual-sidebar-header {
    background: var(--schemafy-primary-dark);
    padding: 16px;
    border-bottom: 1px solid rgba(255,255,255,0.07);
    flex-shrink: 0;
}

.schemafy-manual-sidebar-title {
    font-size: 13px;
    font-weight: 600;
    color: #ffffff;
    display: block;
    margin-bottom: 2px;
}

.schemafy-manual-sidebar-sub {
    font-size: 11px;
    color: rgba(255,255,255,0.5);
    display: block;
}

.schemafy-manual-fields {
    padding: 16px;
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 18px;
    overflow-y: auto;
}

.schemafy-manual-step-field {
    display: flex;
    gap: 10px;
    align-items: flex-start;
}

.schemafy-manual-step-badge {
    width: 22px;
    height: 22px;
    background: var(--schemafy-primary);
    color: #fff;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 10px;
    font-weight: 700;
    flex-shrink: 0;
    margin-top: 1px;
}

.schemafy-manual-step-content {
    flex: 1;
    min-width: 0;
}

.schemafy-manual-step-label {
    display: block;
    font-size: 11px;
    font-weight: 700;
    color: var(--schemafy-gray-600);
    text-transform: uppercase;
    letter-spacing: 0.05em;
    margin-bottom: 6px;
}

.schemafy-manual-step-hint {
    font-size: 10px;
    color: var(--schemafy-gray-400);
    margin: 5px 0 0;
    line-height: 1.4;
}

.schemafy-manual-save-row {
    padding: 14px 16px;
    border-top: 1px solid var(--schemafy-gray-100);
    background: var(--schemafy-gray-50);
    flex-shrink: 0;
}

/* ── Right editor panel ───────────────────────────────────────── */
.schemafy-manual-editor-panel {
    background: var(--schemafy-white);
    display: flex;
    flex-direction: column;
    min-width: 0;
}

.schemafy-manual-editor-header {
    background: var(--schemafy-gray-50);
    border-bottom: 1px solid var(--schemafy-gray-100);
    padding: 10px 16px;
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 11px;
    font-weight: 600;
    color: var(--schemafy-gray-500);
    text-transform: uppercase;
    letter-spacing: 0.05em;
    flex-shrink: 0;
}

.schemafy-manual-editor-step {
    width: 18px;
    height: 18px;
    background: var(--schemafy-primary);
    color: #fff;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 9px;
    font-weight: 700;
    flex-shrink: 0;
}

.schemafy-manual-editor-panel .schemafy-json-editor-wrapper-enhanced {
    flex: 1;
    display: flex;
    flex-direction: column;
}

/* Override URL row constraints inside the narrow sidebar */
.schemafy-manual-sidebar .schemafy-url-add-row {
    gap: 6px;
}

.schemafy-manual-sidebar .schemafy-url-add-row .schemafy-select-enhanced,
.schemafy-manual-sidebar .schemafy-url-add-row .schemafy-input-enhanced {
    min-width: 0;
    flex: 1;
}

.schemafy-manual-sidebar .schemafy-input-enhanced,
.schemafy-manual-sidebar .schemafy-select-enhanced {
    font-size: 12px;
    padding: 7px 10px;
    height: 34px;
}

@media (max-width: 1200px) {
    .schemafy-manual-layout {
        grid-template-columns: 1fr;
    }
}

/* ================================
   FORMS
   ================================ */
.schemafy-form-v2 {
    max-width: 100%;
}

.schemafy-form-row {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
    gap: 16px;
    margin-bottom: 16px;
}

.schemafy-form-group-v2 {
    margin-bottom: 16px;
}

.schemafy-form-group-section {
    margin-top: 32px;
    padding-top: 24px;
    border-top: 1px solid var(--schemafy-gray-100);
}

.schemafy-form-group-v2 label {
    display: block;
    margin-bottom: 6px;
    font-size: 12px;
    font-weight: 500;
    color: var(--schemafy-gray-600);
}

.schemafy-required {
    color: var(--schemafy-danger);
}

/* Base Input Styles - All Input Types */
.schemafy-form-group-v2 input[type="text"],
.schemafy-form-group-v2 input[type="url"],
.schemafy-form-group-v2 input[type="email"],
.schemafy-form-group-v2 input[type="number"],
.schemafy-form-group-v2 input[type="tel"],
.schemafy-form-group-v2 input[type="password"],
.schemafy-form-group-v2 input[type="search"],
.schemafy-form-group-v2 select,
.schemafy-form-group-v2 textarea {
    width: 100%;
    max-width: 100%;
    box-sizing: border-box;
    padding: 9px 12px;
    border: var(--schemafy-border);
    border-radius: var(--schemafy-radius);
    font-size: 13px;
    line-height: 1.5;
    transition: var(--schemafy-transition);
    font-family: inherit;
    background-color: var(--schemafy-white);
    color: var(--schemafy-gray-900);
}

/* Focus States - All Input Types */
.schemafy-form-group-v2 input[type="text"]:focus,
.schemafy-form-group-v2 input[type="url"]:focus,
.schemafy-form-group-v2 input[type="email"]:focus,
.schemafy-form-group-v2 input[type="number"]:focus,
.schemafy-form-group-v2 input[type="tel"]:focus,
.schemafy-form-group-v2 input[type="password"]:focus,
.schemafy-form-group-v2 input[type="search"]:focus,
.schemafy-form-group-v2 select:focus,
.schemafy-form-group-v2 textarea:focus {
    outline: none;
    border-color: var(--schemafy-gray-400);
}

/* Hover States - All Input Types */
.schemafy-form-group-v2 input[type="text"]:hover,
.schemafy-form-group-v2 input[type="url"]:hover,
.schemafy-form-group-v2 input[type="email"]:hover,
.schemafy-form-group-v2 input[type="number"]:hover,
.schemafy-form-group-v2 input[type="tel"]:hover,
.schemafy-form-group-v2 input[type="password"]:hover,
.schemafy-form-group-v2 input[type="search"]:hover,
.schemafy-form-group-v2 select:hover,
.schemafy-form-group-v2 textarea:hover {
    border-color: var(--schemafy-gray-300);
}

/* Placeholder Styles */
.schemafy-form-group-v2 input::placeholder,
.schemafy-form-group-v2 textarea::placeholder {
    color: var(--schemafy-gray-400);
    opacity: 1;
}

/* Disabled States */
.schemafy-form-group-v2 input:disabled,
.schemafy-form-group-v2 select:disabled,
.schemafy-form-group-v2 textarea:disabled {
    background-color: var(--schemafy-gray-100);
    color: var(--schemafy-gray-500);
    cursor: not-allowed;
}

/* Read-only States */
.schemafy-form-group-v2 input:read-only:not([type="date"]):not([type="datetime-local"]):not([type="time"]),
.schemafy-form-group-v2 textarea:read-only {
    background-color: var(--schemafy-gray-50);
    cursor: default;
}

/* Number Input - Remove Spinners */
.schemafy-form-group-v2 input[type="number"] {
    -moz-appearance: textfield;
}

.schemafy-form-group-v2 input[type="number"]::-webkit-outer-spin-button,
.schemafy-form-group-v2 input[type="number"]::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

/* Select Dropdown Styles */
.schemafy-form-group-v2 select {
    cursor: pointer;
    appearance: none;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 24 24' stroke='%23a1a1aa'%3E%3Cpath stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M19 9l-7 7-7-7'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right 10px center;
    background-size: 14px;
    padding-right: 32px;
}

.schemafy-form-group-v2 textarea {
    resize: vertical;
    min-height: 90px;
}

/* Date Picker Fields */
.schemafy-form-group-v2 input[type="date"],
.schemafy-form-group-v2 input[type="datetime-local"],
.schemafy-form-group-v2 input[type="time"] {
    width: 100%;
    padding: 10px 12px;
    border: 1px solid var(--schemafy-gray-300);
    border-radius: var(--schemafy-radius);
    font-size: 14px;
    line-height: 1.5;
    transition: var(--schemafy-transition);
    font-family: inherit;
    cursor: pointer;
    background-color: var(--schemafy-white);
    color: var(--schemafy-gray-900);
}

.schemafy-form-group-v2 input[type="date"]:hover,
.schemafy-form-group-v2 input[type="datetime-local"]:hover,
.schemafy-form-group-v2 input[type="time"]:hover {
    border-color: var(--schemafy-gray-400);
}

.schemafy-form-group-v2 input[type="date"]:focus,
.schemafy-form-group-v2 input[type="datetime-local"]:focus,
.schemafy-form-group-v2 input[type="time"]:focus {
    outline: none;
    border-color: var(--schemafy-primary);
    box-shadow: 0 0 0 3px rgba(79, 110, 245, 0.15);
}

/* Date picker with calendar icon */
.schemafy-date-picker-only {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 24 24' stroke='%236b7280'%3E%3Cpath stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M8 7V3m8 4V3m-9 8h10M5 21h14a2 2 0 002-2V7a2 2 0 00-2-2H5a2 2 0 00-2 2v12a2 2 0 002 2z'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right 10px center;
    background-size: 20px;
    padding-right: 40px;
}

.schemafy-date-picker-only:focus {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 24 24' stroke='%232563eb'%3E%3Cpath stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M8 7V3m8 4V3m-9 8h10M5 21h14a2 2 0 002-2V7a2 2 0 00-2-2H5a2 2 0 00-2 2v12a2 2 0 002 2z'/%3E%3C/svg%3E");
}

/* Select dropdown arrow color on focus */
.schemafy-form-group-v2 select:focus {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 24 24' stroke='%232563eb'%3E%3Cpath stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M19 9l-7 7-7-7'/%3E%3C/svg%3E");
}

/* Image Field Wrapper */
.schemafy-image-field-wrapper {
    display: flex;
    gap: 8px;
    align-items: flex-start;
}

.schemafy-image-url-field {
    flex: 1;
    min-width: 0;
    background-color: var(--schemafy-gray-50) !important;
}

.schemafy-image-url-text {
    display: block;
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: 12px;
    color: var(--schemafy-gray-500);
    padding: 4px 0;
}

.schemafy-image-preview {
    margin-top: 8px;
    padding: 12px;
    background: var(--schemafy-gray-50);
    border: 1px solid var(--schemafy-gray-200);
    border-radius: var(--schemafy-radius);
    display: flex;
    align-items: center;
    gap: 12px;
}

.schemafy-image-preview img {
    max-width: 200px;
    max-height: 150px;
    border-radius: 4px;
    border: 1px solid var(--schemafy-gray-300);
    object-fit: cover;
}

.schemafy-remove-image {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 6px 10px;
    background: var(--schemafy-white);
    border: 1px solid var(--schemafy-gray-300);
    border-radius: var(--schemafy-radius-sm);
    color: var(--schemafy-danger);
    font-size: 13px;
    cursor: pointer;
    transition: var(--schemafy-transition);
}

.schemafy-remove-image:hover {
    background: #fef2f2;
    border-color: var(--schemafy-danger);
}

.schemafy-select-media {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 10px 16px;
    background: var(--schemafy-primary);
    color: var(--schemafy-white);
    border: none;
    border-radius: var(--schemafy-radius);
    font-size: 14px;
    font-weight: 500;
    cursor: pointer;
    transition: var(--schemafy-transition);
    white-space: nowrap;
}

.schemafy-select-media:hover {
    background: var(--schemafy-primary-hover);
}

.schemafy-select-media .dashicons {
    font-size: 18px;
    width: 18px;
    height: 18px;
}

.schemafy-help-text-v2 {
    margin: 8px 0 0 0;
    font-size: 13px;
    color: var(--schemafy-gray-600);
}

.schemafy-char-counter-v2 {
    display: block;
    margin-top: 6px;
    font-size: 12px;
    color: var(--schemafy-gray-500);
    text-align: right;
}

/* ================================
   JSON EDITOR
   ================================ */
.schemafy-json-editor-wrapper {
    position: relative;
}

.schemafy-editor-toolbar-v2 {
    background: var(--schemafy-gray-100);
    border: 1px solid var(--schemafy-gray-300);
    border-bottom: none;
    border-radius: var(--schemafy-radius) var(--schemafy-radius) 0 0;
    padding: 8px 12px;
    display: flex;
    gap: 8px;
    align-items: center;
    flex-wrap: wrap;
}

.schemafy-btn-mini {
    background: #fff;
    border: 1px solid var(--schemafy-gray-300);
    padding: 6px 12px;
    border-radius: var(--schemafy-radius-sm);
    font-size: 12px;
    cursor: pointer;
    transition: var(--schemafy-transition);
    display: inline-flex;
    align-items: center;
    gap: 4px;
    color: var(--schemafy-gray-700);
    font-weight: 500;
}

.schemafy-btn-mini:hover {
    background: var(--schemafy-gray-50);
    border-color: var(--schemafy-gray-400);
}

.schemafy-btn-mini .dashicons {
    width: 14px;
    height: 14px;
    font-size: 14px;
}

.schemafy-validation-indicator {
    margin-left: auto;
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 12px;
    padding: 4px 10px;
    border-radius: var(--schemafy-radius-sm);
    font-weight: 500;
}

.schemafy-validation-indicator .dashicons {
    width: 16px;
    height: 16px;
    font-size: 16px;
}

.schemafy-validation-indicator.valid {
    background: rgba(0, 163, 42, 0.1);
    color: var(--schemafy-success);
}

.schemafy-validation-indicator.invalid {
    background: rgba(214, 54, 56, 0.1);
    color: var(--schemafy-danger);
}

.schemafy-json-editor-wrapper textarea {
    border-radius: 0 0 var(--schemafy-radius) var(--schemafy-radius);
    font-family: var(--schemafy-font-mono);
    font-size: 13px;
    line-height: 1.6;
}

/* ================================
   AI PASTE INSTRUCTIONS
   ================================ */
.schemafy-ai-card {
    max-width: 1200px;
    margin: 0 auto;
}

/* ================================
   BUTTONS
   ================================ */
.schemafy-btn-primary {
    background: var(--schemafy-primary);
    color: var(--schemafy-white);
    border: none;
    padding: 8px 16px;
    border-radius: var(--schemafy-radius);
    font-size: var(--schemafy-text-base);
    font-weight: var(--schemafy-font-semibold);
    cursor: pointer;
    transition: var(--schemafy-transition);
    display: inline-flex;
    align-items: center;
    gap: 6px;
    text-decoration: none;
}

.schemafy-btn-primary:hover {
    background: var(--schemafy-primary-hover);
    transform: translateY(-1px);
    box-shadow: 0 4px 12px rgba(79, 110, 245, 0.25);
}

.schemafy-btn-primary .dashicons {
    width: 16px;
    height: 16px;
    font-size: 16px;
}

.schemafy-btn-lg {
    padding: 10px 20px;
    font-size: 14px;
}

.schemafy-btn-block {
    width: 100%;
    justify-content: center;
}

.schemafy-form-actions-v2 {
    display: flex;
    gap: 12px;
    justify-content: flex-end;
    flex-wrap: wrap;
    margin-top: 24px;
    padding-top: 20px;
    border-top: var(--schemafy-border);
}

/* ================================
   FOOTER
   ================================ */
.schemafy-footer-v2 {
    text-align: center;
    padding: 32px 20px;
    color: var(--schemafy-gray-600);
    font-size: 14px;
}

.schemafy-footer-v2 p {
    margin: 0;
}

.schemafy-footer-v2 a {
    color: var(--schemafy-primary);
    text-decoration: none;
    font-weight: 600;
}

.schemafy-footer-v2 a:hover {
    text-decoration: underline;
}

/* ================================
   RESPONSIVE
   ================================ */
@media (max-width: 768px) {
    .schemafy-stats-grid {
        grid-template-columns: 1fr;
    }

    .schemafy-card-header-v2 {
        flex-direction: column;
        align-items: flex-start;
    }

    .schemafy-card-actions {
        width: 100%;
    }

    .schemafy-search-input-v2,
    .schemafy-select-v2 {
        width: 100%;
    }
}

/* ================================
   UTILITIES
   ================================ */
.schemafy-hidden {
    display: none !important;
}

.schemafy-metadata-selector {
    margin-bottom: 24px;
}

.schemafy-meta-search-wrapper {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.schemafy-meta-search-wrapper select {
    min-height: 200px;
}

.schemafy-meta-editor {
    margin-top: 32px;
}

.schemafy-meta-page-url {
    font-family: var(--schemafy-font-mono);
    font-size: 13px;
    color: var(--schemafy-primary);
    flex: 1;
    word-break: break-all;
}

.schemafy-seo-plugin-badge {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 6px 12px;
    background: var(--schemafy-gray-200);
    border-radius: 4px;
    font-size: 13px;
    color: var(--schemafy-gray-700);
}

.schemafy-meta-value-item label {
    display: block;
    font-size: 13px;
    font-weight: 600;
    color: var(--schemafy-gray-700);
    margin-bottom: 6px;
}

.schemafy-meta-value-content {
    background: #fff;
    padding: 12px;
    border-radius: 4px;
    border: 1px solid var(--schemafy-gray-300);
    font-size: 14px;
    color: var(--schemafy-gray-900);
    min-height: 40px;
}

.schemafy-meta-empty {
    color: var(--schemafy-gray-500);
    font-style: italic;
}

.schemafy-optional-badge {
    font-size: 12px;
    font-weight: normal;
    color: var(--schemafy-gray-500);
    background: var(--schemafy-gray-100);
    padding: 2px 8px;
    border-radius: 3px;
    margin-left: 8px;
}

.schemafy-seo-indicator {
    display: flex;
    align-items: center;
    gap: 4px;
    font-size: 13px;
    font-weight: 500;
}

.schemafy-seo-indicator.schemafy-seo-good {
    color: var(--schemafy-success);
}

.schemafy-seo-indicator.schemafy-seo-warning {
    color: var(--schemafy-warning);
}

.schemafy-seo-indicator.schemafy-seo-bad {
    color: var(--schemafy-danger);
}

.schemafy-seo-indicator .dashicons {
    width: 16px;
    height: 16px;
    font-size: 16px;
}

.schemafy-google-preview {
    background: #fff;
    padding: 16px;
    border-radius: 4px;
    border: 1px solid var(--schemafy-gray-300);
}

.schemafy-google-title {
    font-size: 20px;
    color: #1a0dab;
    font-weight: 400;
    margin-bottom: 4px;
    line-height: 1.3;
}

.schemafy-google-url {
    font-size: 14px;
    color: #006621;
    margin-bottom: 4px;
}

.schemafy-google-description {
    font-size: 14px;
    color: #545454;
    line-height: 1.4;
}

/* SOCIAL MEDIA MANAGER (Open Graph & Twitter Cards) */
/* ================================
   URL DETAIL VIEW
   ================================ */
#schemafy-url-detail-view {
    position: relative;
    z-index: 10;
}

#schemafy-url-detail-view .schemafy-card-v2 {
    margin-bottom: 24px;
    background: #fff;
    border-radius: var(--schemafy-radius);
    box-shadow: var(--schemafy-shadow);
}

/* ── Detail header ────────────────────────────────────────────────────── */
.schemafy-url-detail-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 16px 20px;
    border-bottom: 1px solid var(--schemafy-gray-100);
    background: var(--schemafy-white);
    gap: 16px;
}

.schemafy-detail-header-left {
    display: flex;
    gap: 12px;
    align-items: center;
    flex: 1;
    min-width: 0;
}

.schemafy-detail-header-left .schemafy-btn-icon {
    background: var(--schemafy-gray-100);
    color: var(--schemafy-gray-700);
    border: none;
    flex-shrink: 0;
    transition: background 0.15s ease, transform 0.15s ease;
}

.schemafy-detail-header-left .schemafy-btn-icon:hover {
    background: var(--schemafy-gray-200);
    transform: translateX(-3px);
}

.schemafy-detail-header-info {
    min-width: 0;
    flex: 1;
}

.schemafy-detail-header-info h2 {
    margin: 0 0 4px 0;
    font-size: 16px;
    font-weight: 700;
    color: var(--schemafy-gray-900);
    display: flex;
    align-items: center;
    gap: 8px;
    letter-spacing: -0.2px;
}

.schemafy-detail-header-info h2 .dashicons {
    font-size: 16px;
    width: 16px;
    height: 16px;
    color: var(--schemafy-primary);
}

.schemafy-url-display {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 4px 10px;
    background: var(--schemafy-gray-50);
    border: 1px solid var(--schemafy-gray-200);
    border-radius: 20px;
    font-size: 12px;
    max-width: 480px;
    overflow: hidden;
}

.schemafy-url-display .dashicons {
    font-size: 13px;
    width: 13px;
    height: 13px;
    color: var(--schemafy-gray-400);
    flex-shrink: 0;
}

.schemafy-url-link {
    color: var(--schemafy-gray-600);
    text-decoration: none;
    font-weight: 400;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    font-family: var(--schemafy-font-mono);
    font-size: 11px;
    transition: color 0.12s ease;
}

.schemafy-url-link:hover { color: var(--schemafy-primary); }

.schemafy-detail-header-right {
    display: flex;
    gap: 8px;
    align-items: center;
    flex-shrink: 0;
}

/* Count badge — informational, not a CTA */
.schemafy-schema-count-badge {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 6px 12px;
    background: var(--schemafy-gray-100);
    color: var(--schemafy-gray-600);
    border-radius: 20px;
    font-weight: 600;
    font-size: 12px;
}

.schemafy-schema-count-badge .dashicons {
    font-size: 14px;
    width: 14px;
    height: 14px;
}

/* ── Schema list grid ─────────────────────────────────────────────────── */
.schemafy-url-schemas-list {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(360px, 1fr));
    gap: 16px;
    padding: 20px;
}

/* ── Schema card ──────────────────────────────────────────────────────── */
.schemafy-schema-card-v2 {
    background: var(--schemafy-white);
    border: 1px solid var(--schemafy-gray-200);
    border-radius: var(--schemafy-radius-lg);
    overflow: hidden;
    display: flex;
    flex-direction: column;
    transition: box-shadow 0.15s ease, border-color 0.15s ease, transform 0.15s ease;
    box-shadow: var(--schemafy-shadow);
}

.schemafy-schema-card-v2:hover {
    box-shadow: var(--schemafy-shadow-md);
    transform: translateY(-1px);
}

/* ── Card header ──────────────────────────────────────────────────────── */
.schemafy-schema-card-v2 .schemafy-schema-card-header {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    padding: 14px 16px;
    background: var(--schemafy-gray-50);
    border-bottom: 1px solid var(--schemafy-gray-100);
}

/* Icon box — category color */
.schemafy-schema-type-icon-box {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    border-radius: 9px;
    flex-shrink: 0;
    font-size: 18px;
    line-height: 1;
    background: var(--schemafy-gray-100);
}

/* Category-colored icon boxes */
.schemafy-schema-card-v2[data-category="article"]   .schemafy-schema-type-icon-box { background: #EEF2FE; }
.schemafy-schema-card-v2[data-category="business"]  .schemafy-schema-type-icon-box { background: #f0fdf4; }
.schemafy-schema-card-v2[data-category="content"]   .schemafy-schema-type-icon-box { background: #fffbeb; }
.schemafy-schema-card-v2[data-category="commerce"]  .schemafy-schema-type-icon-box { background: #faf5ff; }
.schemafy-schema-card-v2[data-category="education"] .schemafy-schema-type-icon-box { background: #f0fdfa; }

.schemafy-schema-card-v2 .schemafy-schema-card-info {
    flex: 1;
    min-width: 0;
}

.schemafy-schema-card-v2 .schemafy-schema-card-info h4 {
    margin: 0 0 5px 0;
    font-size: 14px;
    font-weight: 600;
    color: var(--schemafy-gray-900);
    line-height: 1.35;
    /* Allow name to wrap to 2 lines max */
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.schemafy-schema-card-info-row {
    display: flex;
    align-items: center;
    gap: 6px;
}

/* @type pill */
.schemafy-schema-type-badge {
    display: inline-flex;
    align-items: center;
    height: 18px;
    padding: 0 7px;
    border-radius: 9px;
    font-size: 10px;
    font-weight: 600;
    background: var(--schemafy-gray-200);
    color: var(--schemafy-gray-600);
    letter-spacing: 0.2px;
    white-space: nowrap;
}

/* Status — dot indicator */
.schemafy-schema-status {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    font-size: 11px;
    font-weight: 500;
}

.schemafy-schema-status::before {
    content: '';
    display: inline-block;
    width: 6px;
    height: 6px;
    border-radius: 50%;
}

.schemafy-schema-status.schemafy-status-active {
    color: var(--schemafy-success);
}

.schemafy-schema-status.schemafy-status-active::before {
    background: var(--schemafy-success);
    box-shadow: 0 0 0 2px rgba(22, 163, 74, 0.18);
}

.schemafy-schema-status.schemafy-status-inactive {
    color: var(--schemafy-gray-400);
}

.schemafy-schema-status.schemafy-status-inactive::before {
    background: var(--schemafy-gray-400);
}

/* ── JSON preview ─────────────────────────────────────────────────────── */
.schemafy-schema-card-preview {
    position: relative;
    flex: 1;
}

.schemafy-schema-card-preview pre {
    margin: 0;
    padding: 14px 16px;
    background: #0f172a;
    max-height: 160px;
    overflow: hidden;
    font-size: 11px;
    line-height: 1.55;
    font-family: var(--schemafy-font-mono);
}

.schemafy-schema-card-preview code {
    color: #94a3b8;
    white-space: pre;
    word-break: normal;
    overflow-wrap: normal;
}

/* Syntax colour tokens */
.schemafy-json-key   { color: #7dd3fc; }   /* sky-300  — keys   */
.schemafy-json-str   { color: #86efac; }   /* green-300 — strings */
.schemafy-json-num   { color: #fda4af; }   /* rose-300 — numbers */
.schemafy-json-bool  { color: #fbbf24; }   /* amber — booleans */
.schemafy-json-null  { color: #94a3b8; }   /* slate — null */
.schemafy-json-punct { color: #475569; }   /* slate-600 — punctuation */

/* Fade mask at bottom */
.schemafy-schema-card-preview::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    height: 40px;
    background: linear-gradient(transparent, #0f172a);
    pointer-events: none;
}

/* Copy button */
.schemafy-preview-copy-btn {
    position: absolute;
    top: 8px;
    right: 8px;
    display: flex;
    align-items: center;
    gap: 4px;
    padding: 4px 8px;
    background: rgba(255, 255, 255, 0.08);
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-radius: 6px;
    color: rgba(255, 255, 255, 0.5);
    font-size: 11px;
    font-weight: 500;
    cursor: pointer;
    transition: background 0.12s ease, color 0.12s ease;
    font-family: var(--schemafy-font-sans);
    z-index: 1;
}

.schemafy-preview-copy-btn:hover {
    background: rgba(255, 255, 255, 0.15);
    color: rgba(255, 255, 255, 0.9);
}

.schemafy-preview-copy-btn .dashicons {
    font-size: 12px;
    width: 12px;
    height: 12px;
}

/* ── Action bar ───────────────────────────────────────────────────────── */
.schemafy-schema-card-v2 .schemafy-schema-card-actions {
    display: flex;
    align-items: stretch;
    border-top: 1px solid var(--schemafy-gray-100);
    background: var(--schemafy-white);
}

/* Primary actions */
.schemafy-schema-card-v2 .schemafy-schema-action-btn {
    flex: 1;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 5px;
    padding: 10px 6px;
    background: transparent;
    border: none;
    font-size: 12px;
    font-weight: 500;
    color: var(--schemafy-gray-500);
    cursor: pointer;
    transition: background 0.12s ease, color 0.12s ease;
    white-space: nowrap;
    font-family: var(--schemafy-font-sans);
}

.schemafy-schema-card-v2 .schemafy-schema-action-btn:hover {
    background: var(--schemafy-gray-50);
    color: var(--schemafy-primary);
}

.schemafy-schema-card-v2 .schemafy-schema-action-btn .dashicons {
    font-size: 13px;
    width: 13px;
    height: 13px;
}

/* Separator before delete */
.schemafy-action-separator {
    width: 1px;
    background: var(--schemafy-gray-100);
    flex-shrink: 0;
    align-self: stretch;
    margin: 6px 0;
}

/* Delete — danger */
.schemafy-schema-card-v2 .schemafy-schema-action-btn.schemafy-action-delete {
    flex: 0 0 44px;
    color: var(--schemafy-gray-400);
}

.schemafy-schema-card-v2 .schemafy-schema-action-btn.schemafy-action-delete:hover {
    background: #fff5f5;
    color: var(--schemafy-danger);
}

/* Add action borders between primary buttons */
.schemafy-schema-card-v2 .schemafy-schema-action-btn + .schemafy-schema-action-btn:not(.schemafy-action-delete) {
    border-left: 1px solid var(--schemafy-gray-100);
}

/* Responsive */
@media (max-width: 768px) {
    .schemafy-url-schemas-list {
        grid-template-columns: 1fr;
        padding: 16px;
    }

    .schemafy-schema-card-v2 .schemafy-schema-card-actions {
        flex-direction: column;
    }

    .schemafy-schema-card-v2 .schemafy-schema-card-actions button {
        width: 100%;
    }
}


#schemafy-url-detail-container-bulk .schemafy-add-snippet-btn,
#schemafy-url-detail-view .schemafy-add-snippet-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 12px 24px;
    background: var(--schemafy-primary);
    border: none;
    border-radius: var(--schemafy-radius-sm);
    font-size: 14px;
    font-weight: 600;
    color: white;
    cursor: pointer;
    transition: var(--schemafy-transition);
    box-shadow: var(--schemafy-shadow-sm);
}

#schemafy-url-detail-container-bulk .schemafy-add-snippet-btn:hover,
#schemafy-url-detail-view .schemafy-add-snippet-btn:hover {
    background: var(--schemafy-primary-hover);
    transform: translateY(-2px);
    box-shadow: var(--schemafy-shadow-md);
}

#schemafy-url-detail-container-bulk .schemafy-add-snippet-btn .dashicons,
#schemafy-url-detail-view .schemafy-add-snippet-btn .dashicons {
    font-size: 18px;
    width: 18px;
    height: 18px;
}

.schemafy-schema-card {
    background: white;
    border: 1px solid var(--schemafy-gray-200);
    border-radius: var(--schemafy-radius);
    overflow: hidden;
    transition: var(--schemafy-transition);
    box-shadow: var(--schemafy-shadow);
}

.schemafy-schema-card:hover {
    box-shadow: var(--schemafy-shadow-md);
    transform: translateY(-1px);
    border-color: var(--schemafy-primary);
}

.schemafy-schema-card-header {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    padding: 16px 20px;
    background: var(--schemafy-gray-50);
    border-bottom: 1px solid var(--schemafy-gray-200);
}

.schemafy-schema-type-icon {
    font-size: 28px;
    line-height: 1;
    flex-shrink: 0;
}

.schemafy-schema-card-actions {
    padding: 14px 20px;
    background: var(--schemafy-gray-50);
    border-top: 1px solid var(--schemafy-gray-200);
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
}

.schemafy-schema-card-actions button {
    flex: 1;
    min-width: 70px;
    padding: 8px 12px;
    border-radius: var(--schemafy-radius-sm);
    font-size: 12px;
    font-weight: 500;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    cursor: pointer;
    transition: var(--schemafy-transition);
    border: 1px solid var(--schemafy-gray-300);
    background: white;
    color: var(--schemafy-gray-700);
}

.schemafy-schema-card-actions button:hover {
    border-color: var(--schemafy-gray-400);
    background: var(--schemafy-gray-50);
}

.schemafy-schema-card-actions button .dashicons {
    font-size: 16px;
    width: 16px;
    height: 16px;
}

.schemafy-schema-card-actions .schemafy-btn-primary {
    background: var(--schemafy-primary);
    color: white;
    border-color: var(--schemafy-primary);
}

.schemafy-schema-card-actions .schemafy-btn-primary:hover {
    background: var(--schemafy-primary-hover);
    border-color: var(--schemafy-primary-hover);
}

.schemafy-btn-danger {
    background: white;
    color: var(--schemafy-danger);
    border-color: rgba(214, 54, 56, 0.3);
}

.schemafy-btn-danger:hover {
    background: var(--schemafy-danger);
    color: white;
    border-color: var(--schemafy-danger);
}

/* Responsive Design for URL Detail View */
@media (max-width: 1024px) {
    .schemafy-url-detail-header {
        flex-direction: column;
        gap: 16px;
    }

    .schemafy-detail-header-right {
        width: 100%;
        justify-content: flex-start;
    }

    .schemafy-schema-card-actions {
        flex-direction: column;
    }

    .schemafy-schema-card-actions button {
        width: 100%;
    }
}

@media (max-width: 768px) {
    .schemafy-schema-card-header {
        flex-direction: column;
        gap: 12px;
    }

    .schemafy-url-display {
        font-size: 12px;
    }
}

@keyframes slideDown {
    from {
        opacity: 0;
        transform: translateY(-10px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.schemafy-checkbox {
    width: 18px;
    height: 18px;
    cursor: pointer;
    accent-color: var(--schemafy-primary);
}

.schemafy-checkbox:hover {
    transform: scale(1.1);
}


/* AI Generator form actions: centered */
#schemafy-ai-generator-form .schemafy-form-actions-v2 {
    justify-content: center;
}

/* Form label large (AI Generator section labels) */
.schemafy-form-label-lg {
    font-size: 14px !important;
    font-weight: 600 !important;
    margin-bottom: 10px !important;
    display: block !important;
    color: var(--schemafy-gray-800);
}
.schemafy-form-label-lg .dashicons {
    color: var(--schemafy-primary);
    vertical-align: middle;
}

/* ── AI Result: Status Hero ──────────────────────────────────── */
.schemafy-ai-result-info {
    border-radius: var(--schemafy-radius);
    padding: 20px 24px;
    margin-bottom: 24px;
    background: #f0fdf4;
    border: 1.5px solid #86efac;
}
.schemafy-ai-result-info:has(.schemafy-ai-result-incomplete) {
    background: #fffbeb;
    border-color: #fcd34d;
}
.schemafy-ai-result-header {
    display: flex;
    align-items: center;
    gap: 14px;
}
.schemafy-ai-result-title {
    margin: 0;
    font-size: 17px;
    font-weight: 700;
    color: var(--schemafy-gray-900);
}
.schemafy-ai-result-subtitle {
    margin: 3px 0 0 0;
    font-size: 13px;
    color: var(--schemafy-gray-500);
}

/* Missing fields banner */
.schemafy-ai-missing-banner {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    margin-top: 14px;
    padding: 12px 16px;
    background: #fffbeb;
    border: 1px solid #fcd34d;
    border-radius: var(--schemafy-radius-sm);
}
.schemafy-ai-missing-banner .dashicons {
    color: #d97706;
    font-size: 18px;
    width: 18px;
    height: 18px;
    flex-shrink: 0;
    margin-top: 2px;
}
.schemafy-ai-missing-banner strong {
    font-size: 13px;
    color: #92400e;
    display: block;
}
.schemafy-ai-missing-banner p {
    margin: 3px 0 0 0;
    font-size: 12px;
    color: #92400e;
}

/* AI Visual Preview box */
.schemafy-ai-visual-preview {
    border-radius: var(--schemafy-radius);
    overflow: hidden;
    box-shadow: 0 2px 8px rgba(0,0,0,0.08);
}

/* Advanced toggle button */
.schemafy-ai-advanced-toggle {
    margin-top: 20px;
}
.schemafy-ai-advanced-btn {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 8px 16px;
    background: none;
    border: 1px solid var(--schemafy-gray-300);
    border-radius: var(--schemafy-radius-sm);
    font-size: 13px;
    font-weight: 500;
    color: var(--schemafy-gray-600);
    cursor: pointer;
    transition: all 0.15s;
}
.schemafy-ai-advanced-btn:hover {
    border-color: var(--schemafy-gray-400);
    color: var(--schemafy-gray-800);
    background: var(--schemafy-gray-50);
}
.schemafy-ai-advanced-btn .dashicons { font-size: 16px; width: 16px; height: 16px; }
.schemafy-ai-toggle-arrow { font-size: 13px !important; width: 13px !important; height: 13px !important; color: var(--schemafy-gray-400); }

.schemafy-ai-advanced-panel {
    margin-top: 16px;
    border: 1px solid var(--schemafy-gray-200);
    border-radius: var(--schemafy-radius);
    overflow: hidden;
}
.schemafy-ai-advanced-panel .schemafy-ai-preview-columns {
    padding: 20px;
}

/* Result action buttons */
.schemafy-ai-result-actions {
    display: flex;
    gap: 12px;
    margin-top: 24px;
    padding-top: 20px;
    border-top: 1px solid var(--schemafy-gray-200);
}

/* Loading State */
.schemafy-ai-loading {
    text-align: center;
    padding: 48px 40px;
    background: linear-gradient(135deg, #f8f9ff 0%, #eef0ff 100%);
    border-radius: var(--schemafy-radius);
    margin-top: 24px;
    border: 1px solid var(--schemafy-blue-200);
}
.schemafy-ai-loader-ring {
    width: 44px;
    height: 44px;
    border: 4px solid rgba(79,110,245,0.15);
    border-top-color: var(--schemafy-primary);
    border-radius: 50%;
    animation: schemafy-ring-spin 0.8s linear infinite;
    margin: 0 auto 20px;
}
@keyframes schemafy-ring-spin {
    to { transform: rotate(360deg); }
}
.schemafy-ai-loading h3 {
    margin: 0 0 8px 0;
    color: var(--schemafy-primary-dark);
    font-size: 18px;
    font-weight: 700;
}
.schemafy-ai-loading > p {
    margin: 0;
    color: var(--schemafy-primary);
    font-size: 14px;
}
.schemafy-loading-subtext {
    margin: 10px 0 0 0 !important;
    color: var(--schemafy-gray-400) !important;
    font-size: 12px !important;
    font-weight: 400 !important;
}

/* AI Status Panel */
.schemafy-ai-status-panel {
    background: var(--schemafy-blue-50);
    border: 2px solid var(--schemafy-blue-200);
    border-radius: var(--schemafy-radius);
    padding: 16px;
    text-align: center;
}
.schemafy-ai-status-panel .dashicons {
    color: var(--schemafy-primary);
    font-size: 28px;
    width: 28px;
    height: 28px;
}
.schemafy-ai-status-panel-body {
    margin-top: 8px;
}
.schemafy-ai-status-panel-body strong {
    color: var(--schemafy-primary-dark);
    font-size: 15px;
    display: block;
}
.schemafy-ai-status-panel-body p {
    margin: 4px 0 0 0;
    color: var(--schemafy-primary);
    font-size: 13px;
}

/* API Settings Notice */
.schemafy-ai-settings-notice {
    margin-top: 32px;
    padding: 16px 20px;
    background: var(--schemafy-gray-50);
    border: 1px solid var(--schemafy-gray-200);
    border-radius: 8px;
}

.schemafy-ai-settings-notice p {
    margin: 0;
    font-size: 13px;
    color: var(--schemafy-gray-500);
}

.schemafy-ai-settings-notice .dashicons {
    vertical-align: middle;
    color: var(--schemafy-gray-400);
    margin-right: 4px;
}

.schemafy-ai-settings-notice a {
    color: var(--schemafy-primary);
    text-decoration: none;
    font-weight: 600;
}

.schemafy-ai-settings-notice a:hover {
    color: var(--schemafy-primary-hover);
    text-decoration: underline;
}

/* AI Preview Section */
.schemafy-ai-preview-section {
    margin-top: 32px;
    padding-top: 32px;
    border-top: 2px solid var(--schemafy-gray-200);
}

/* AI Generator Two-Column Layout */
.schemafy-ai-preview-columns {
    display: grid;
    grid-template-columns: 1fr 280px;
    gap: 24px;
    align-items: start;
}

.schemafy-ai-preview-left {
    min-width: 0;
}

.schemafy-ai-preview-right {
    position: sticky;
    top: 32px;
}

.schemafy-ai-vars-panel {
    background: var(--schemafy-gray-50);
    border: var(--schemafy-border);
    border-radius: var(--schemafy-radius);
    overflow: hidden;
}

.schemafy-ai-vars-header {
    background: var(--schemafy-primary);
    color: #fff;
    padding: 12px 14px;
}

.schemafy-ai-vars-header strong {
    font-size: 13px;
    color: #fff;
}

.schemafy-ai-vars-body {
    padding: 12px;
    max-height: 520px;
    overflow-y: auto;
}

.schemafy-ai-var-group-title {
    font-size: 11px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: .5px;
    color: var(--schemafy-gray-500);
    padding: 4px 0 6px;
    display: flex;
    align-items: center;
    gap: 4px;
}

.schemafy-ai-var-btn {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    padding: 7px 10px;
    margin-bottom: 4px;
    background: #fff;
    border: 1px solid var(--schemafy-gray-200);
    border-radius: 5px;
    cursor: pointer;
    text-align: left;
    transition: border-color .15s, background .15s;
}

.schemafy-ai-var-btn:hover {
    background: var(--schemafy-blue-50, #eff6ff);
    border-color: var(--schemafy-primary);
}

.schemafy-ai-var-btn code {
    font-size: 11px;
    color: var(--schemafy-primary-dark, #1d4ed8);
    font-family: var(--schemafy-font-mono);
    white-space: nowrap;
}

.schemafy-ai-var-btn span {
    font-size: 11px;
    color: var(--schemafy-gray-500);
    margin-left: 6px;
    white-space: nowrap;
}

@media (max-width: 900px) {
    .schemafy-ai-preview-columns {
        grid-template-columns: 1fr;
    }
    .schemafy-ai-preview-right {
        position: static;
    }
}

/* API Configuration Modal */
.schemafy-modal-overlay-v2 {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(0, 0, 0, 0.6);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 100000;
    backdrop-filter: blur(4px);
}

.schemafy-modal-v2 {
    background: white;
    border-radius: 16px;
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.3);
    max-width: 560px;
    width: 90%;
    max-height: 90vh;
    overflow: hidden;
    display: flex;
    flex-direction: column;
}

.schemafy-modal-header-v2 {
    padding: 24px 28px;
    border-bottom: 1px solid var(--schemafy-gray-200);
    display: flex;
    align-items: center;
    justify-content: space-between;
    background: linear-gradient(135deg, var(--schemafy-gray-50) 0%, #ffffff 100%);
}

.schemafy-modal-header-v2 h3 {
    margin: 0;
    font-size: 20px;
    font-weight: 700;
    color: var(--schemafy-gray-900);
}

.schemafy-modal-close-v2 {
    background: none;
    border: none;
    padding: 4px;
    cursor: pointer;
    color: var(--schemafy-gray-500);
    transition: all 0.2s;
    border-radius: 4px;
}

.schemafy-modal-close-v2:hover {
    background: var(--schemafy-gray-100);
    color: var(--schemafy-gray-900);
}

.schemafy-modal-close-v2 .dashicons {
    font-size: 24px;
    width: 24px;
    height: 24px;
}

.schemafy-modal-body-v2 {
    padding: 28px;
    overflow-y: auto;
}

.schemafy-modal-footer-v2 {
    padding: 20px 28px;
    border-top: 1px solid var(--schemafy-gray-200);
    display: flex;
    gap: 12px;
    justify-content: flex-end;
    background: var(--schemafy-gray-50);
}

/* Form Elements for Modal */
.schemafy-input-v2 {
    width: 100%;
    padding: 10px 14px;
    border: var(--schemafy-border);
    border-radius: var(--schemafy-radius);
    font-size: var(--schemafy-text-md);
    font-family: var(--schemafy-font-sans);
    color: var(--schemafy-gray-900);
    transition: var(--schemafy-transition);
}

.schemafy-input-v2:focus {
    outline: none;
    border-color: var(--schemafy-primary);
    box-shadow: 0 0 0 3px rgba(79, 110, 245, 0.12);
}

.schemafy-select-v2 {
    width: 100%;
    padding: 10px 14px;
    border: var(--schemafy-border);
    border-radius: var(--schemafy-radius);
    font-size: var(--schemafy-text-md);
    font-family: var(--schemafy-font-sans);
    background: var(--schemafy-white);
    color: var(--schemafy-gray-900);
    cursor: pointer;
    transition: var(--schemafy-transition);
}

.schemafy-select-v2:focus {
    outline: none;
    border-color: var(--schemafy-primary);
    box-shadow: 0 0 0 3px rgba(79, 110, 245, 0.1);
}

/* Sparkles icon for Generate button */
.dashicons-sparkles::before {
    content: "✨";
    font-family: inherit;
}

/* ==========================================
   AI USAGE DISPLAY STYLES
   ========================================== */

.schemafy-ai-usage-info {
    padding: 16px;
    border-radius: 8px;
    background: var(--schemafy-gray-50);
    border: 1px solid var(--schemafy-gray-200);
}

.schemafy-spin {
    animation: spin 1s linear infinite;
}

/* Unlimited Plan */
.schemafy-ai-usage-unlimited {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 8px;
    padding: 12px;
    text-align: center;
}

.schemafy-ai-usage-unlimited .dashicons {
    font-size: 32px;
    width: 32px;
    height: 32px;
    color: var(--schemafy-success-light);
}

.schemafy-ai-usage-unlimited strong {
    font-size: 15px;
    color: var(--schemafy-success);
}

.schemafy-ai-usage-unlimited p {
    margin: 0;
    font-size: 13px;
    color: var(--schemafy-gray-500);
}

/* Upgrade Required */
.schemafy-ai-usage-upgrade {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 8px;
    padding: 12px;
    text-align: center;
}

.schemafy-ai-usage-upgrade .dashicons {
    font-size: 32px;
    width: 32px;
    height: 32px;
    color: var(--schemafy-gray-500);
}

.schemafy-ai-usage-upgrade strong {
    font-size: 15px;
    color: var(--schemafy-gray-900);
}

.schemafy-ai-usage-upgrade p {
    margin: 0;
    font-size: 13px;
    color: var(--schemafy-gray-500);
    line-height: 1.5;
}

.schemafy-btn-upgrade {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 8px 16px;
    background: linear-gradient(135deg, var(--schemafy-primary-light) 0%, var(--schemafy-primary) 100%);
    color: white;
    border-radius: var(--schemafy-radius-sm);
    text-decoration: none;
    font-size: 13px;
    font-weight: 600;
    margin-top: 8px;
    transition: all 0.2s;
}

.schemafy-btn-upgrade:hover {
    background: linear-gradient(135deg, var(--schemafy-primary) 0%, var(--schemafy-primary-hover) 100%);
    box-shadow: 0 4px 12px rgba(79, 110, 245, 0.3);
    color: white;
}

/* ================================
   ARRAY FIELDS (Dynamic FAQ, Steps, etc.)
   ================================ */
.schemafy-field-array {
    margin-top: 16px;
}

.schemafy-array-items {
    margin-bottom: 12px;
}

.schemafy-array-item {
    position: relative;
    background: var(--schemafy-gray-50);
    padding: 16px;
    margin-bottom: 12px;
    border-radius: var(--schemafy-radius);
    border: 1px solid var(--schemafy-gray-200);
    transition: var(--schemafy-transition);
}

.schemafy-array-item:hover {
    border-color: var(--schemafy-gray-300);
    box-shadow: var(--schemafy-shadow);
}

.schemafy-remove-array-item {
    position: absolute;
    top: 8px;
    right: 8px;
    background: var(--schemafy-danger);
    color: white;
    border: none;
    border-radius: 50%;
    width: 28px;
    height: 28px;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 16px;
    line-height: 1;
    transition: var(--schemafy-transition);
    z-index: 10;
}

.schemafy-remove-array-item:hover {
    background: #b91c1c;
    transform: scale(1.1);
}

.schemafy-add-array-item {
    background: var(--schemafy-primary);
    color: white;
    border: none;
    border-radius: var(--schemafy-radius);
    padding: 10px 16px;
    cursor: pointer;
    font-size: 14px;
    font-weight: 500;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    transition: var(--schemafy-transition);
    margin-top: 12px;
}

.schemafy-add-array-item:hover {
    background: var(--schemafy-primary-hover);
    box-shadow: var(--schemafy-shadow-md);
    transform: translateY(-1px);
}

.schemafy-add-array-item .dashicons {
    font-size: 16px;
    width: 16px;
    height: 16px;
}

.schemafy-array-item .schemafy-form-group-v2:last-child {
    margin-bottom: 0;
}

/* Array item numbering */
.schemafy-array-item::before {
    content: attr(data-index);
    position: absolute;
    top: -10px;
    left: 12px;
    background: var(--schemafy-primary);
    color: white;
    width: 24px;
    height: 24px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 12px;
    font-weight: 600;
    counter-increment: array-item;
}

/* ================================
   LOADING SPINNER
   ================================ */
@keyframes schemafy-spin {
    from {
        transform: rotate(0deg);
    }
    to {
        transform: rotate(360deg);
    }
}

.schemafy-spin {
    animation: schemafy-spin 1s linear infinite;
    display: inline-block;
}

/* ================================
   URL DROPDOWN CONTAINER
   ================================ */
.schemafy-url-dropdown-container {
    position: relative;
    display: flex;
    flex-direction: column;
    gap: 0;
}

.schemafy-url-select,
.schemafy-url-manual {
    flex: 1;
    padding: 10px 12px;
    border: 1px solid var(--schemafy-gray-300);
    border-radius: var(--schemafy-radius);
    font-size: 14px;
    line-height: 1.5;
    font-family: inherit;
    background-color: var(--schemafy-white);
    color: var(--schemafy-gray-900);
    transition: var(--schemafy-transition);
}

.schemafy-url-select:hover,
.schemafy-url-manual:hover {
    border-color: var(--schemafy-gray-400);
}

.schemafy-url-select:focus,
.schemafy-url-manual:focus {
    outline: none;
    border-color: var(--schemafy-primary);
    box-shadow: 0 0 0 3px rgba(79, 110, 245, 0.15);
}

.schemafy-url-select {
    cursor: pointer;
    appearance: none;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 24 24' stroke='%236b7280'%3E%3Cpath stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M19 9l-7 7-7-7'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right 10px center;
    background-size: 16px;
    padding-right: 36px;
}

.schemafy-url-select:focus {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 24 24' stroke='%232563eb'%3E%3Cpath stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M19 9l-7 7-7-7'/%3E%3C/svg%3E");
}

.schemafy-url-select optgroup {
    font-weight: 600;
    font-style: normal;
    color: var(--schemafy-gray-700);
    padding: 8px 0 4px;
}

.schemafy-url-select option {
    padding: 8px 12px;
    color: var(--schemafy-gray-900);
}

.schemafy-toggle-manual-url {
    flex-shrink: 0;
    width: 40px;
    height: 40px;
    padding: 0;
    border: 1px solid var(--schemafy-gray-300);
    border-radius: var(--schemafy-radius);
    background: var(--schemafy-white);
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: var(--schemafy-transition);
}

.schemafy-toggle-manual-url:hover {
    background-color: var(--schemafy-gray-50);
    border-color: var(--schemafy-gray-400);
}

.schemafy-toggle-manual-url:focus {
    outline: none;
    border-color: var(--schemafy-primary);
    box-shadow: 0 0 0 3px rgba(79, 110, 245, 0.15);
}

.schemafy-toggle-manual-url:active {
    transform: scale(0.97);
}

.schemafy-toggle-manual-url .dashicons {
    font-size: 18px;
    width: 18px;
    height: 18px;
    color: var(--schemafy-gray-600);
}

.schemafy-toggle-manual-url:hover .dashicons,
.schemafy-toggle-manual-url:focus .dashicons {
    color: var(--schemafy-primary);
}

/* Loading state for dropdown */
.schemafy-url-select:disabled {
    background-color: var(--schemafy-gray-100);
    color: var(--schemafy-gray-500);
    cursor: not-allowed;
    opacity: 0.7;
}

/* Manual input inherits font */
.schemafy-url-manual {
    font-family: inherit;
}

/* Better styling for optgroups in dropdown */
.schemafy-url-select optgroup {
    background-color: var(--schemafy-gray-50);
    border-top: 1px solid var(--schemafy-gray-200);
}

.schemafy-url-select option[value="__manual__"] {
    border-top: 2px solid var(--schemafy-gray-300);
    background-color: var(--schemafy-gray-50);
    font-weight: 500;
    color: var(--schemafy-primary);
}

/* Responsive adjustments */
@media (max-width: 768px) {
    .schemafy-url-add-row {
        flex-wrap: wrap;
    }

    .schemafy-url-add-row .schemafy-url-select,
    .schemafy-url-add-row .schemafy-select-enhanced,
    .schemafy-url-add-row .schemafy-url-manual,
    .schemafy-url-add-row .schemafy-input-enhanced {
        min-width: 100px;
    }

    .schemafy-toggle-manual-url {
        width: 100%;
        height: 42px;
    }
}

/* ================================
   DUPLICATE SCHEMA MODAL
   ================================ */
.schemafy-duplicate-modal-overlay {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(0, 0, 0, 0.6);
    backdrop-filter: blur(2px);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 999999;
    animation: schemafyModalFadeIn 0.2s ease;
}

@keyframes schemafyModalFadeIn {
    from {
        opacity: 0;
    }
    to {
        opacity: 1;
    }
}

.schemafy-duplicate-modal {
    background: white;
    border-radius: 12px;
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.3);
    max-width: 560px;
    width: 90%;
    max-height: 90vh;
    overflow-y: auto;
    animation: schemafyModalSlideUp 0.3s ease;
}

@keyframes schemafyModalSlideUp {
    from {
        transform: translateY(30px);
        opacity: 0;
    }
    to {
        transform: translateY(0);
        opacity: 1;
    }
}

.schemafy-duplicate-modal-header {
    padding: 24px 24px 16px;
    border-bottom: 2px solid var(--schemafy-gray-200);
}

.schemafy-duplicate-modal-header h3 {
    margin: 0;
    font-size: 20px;
    color: var(--schemafy-gray-900);
    display: flex;
    align-items: center;
    gap: 8px;
}

.schemafy-duplicate-modal-body {
    padding: 24px;
}

.schemafy-duplicate-modal-body p {
    margin: 0 0 16px;
    color: var(--schemafy-gray-700);
    line-height: 1.6;
}

.schemafy-existing-schema-info {
    background: var(--schemafy-gray-50);
    border: 1px solid var(--schemafy-gray-200);
    border-radius: 8px;
    padding: 16px;
    margin-bottom: 20px;
}

.schemafy-info-row {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 8px 0;
    border-bottom: 1px solid var(--schemafy-gray-200);
}

.schemafy-info-row:last-child {
    border-bottom: none;
}

.schemafy-info-label {
    font-weight: 600;
    color: var(--schemafy-gray-700);
    font-size: 13px;
}

.schemafy-info-value {
    color: var(--schemafy-gray-900);
    font-size: 14px;
    font-weight: 500;
}

.schemafy-seo-warning {
    background: #fff3cd;
    border: 2px solid #ffc107;
    border-radius: 8px;
    padding: 16px;
    margin: 20px 0;
}

.schemafy-seo-warning strong {
    color: #856404;
    display: block;
    margin-bottom: 8px;
    font-size: 14px;
}

.schemafy-seo-warning p {
    color: #856404;
    margin: 0;
    font-size: 13px;
    line-height: 1.6;
}

.schemafy-duplicate-modal-actions {
    padding: 20px 24px;
    border-top: 1px solid var(--schemafy-gray-200);
    display: flex;
    gap: 12px;
    flex-wrap: wrap;
}

.schemafy-duplicate-modal-actions .schemafy-btn {
    flex: 1;
    min-width: 140px;
    padding: 12px 20px;
    border: none;
    border-radius: 8px;
    font-size: 14px;
    font-weight: 600;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    transition: all 0.2s ease;
}

/* .schemafy-btn-primary — canonical definition in the BUTTONS section above */

.schemafy-btn-secondary {
    background: var(--schemafy-gray-200);
    color: var(--schemafy-gray-700);
}

.schemafy-btn-secondary:hover {
    background: var(--schemafy-gray-300);
}

.schemafy-btn-tertiary {
    background: white;
    color: var(--schemafy-gray-600);
    border: 1px solid var(--schemafy-gray-300);
}

.schemafy-btn-tertiary:hover {
    background: var(--schemafy-gray-50);
    border-color: var(--schemafy-gray-400);
}

/* Responsive modal */
@media (max-width: 640px) {
    .schemafy-duplicate-modal {
        width: 95%;
        margin: 20px;
    }

    .schemafy-duplicate-modal-actions {
        flex-direction: column;
    }

    .schemafy-duplicate-modal-actions .schemafy-btn {
        width: 100%;
    }
}

/* ================================
   EDITOR MODE SELECTION MODAL
   ================================ */
.schemafy-modal-container {
    background: var(--schemafy-white);
    border-radius: var(--schemafy-radius);
    box-shadow: 0 4px 24px rgba(0, 0, 0, 0.12);
    max-width: 600px;
    width: 90%;
    max-height: 90vh;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    border: var(--schemafy-border);
}

.schemafy-modal-container .schemafy-modal-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 16px 20px;
    border-bottom: var(--schemafy-border);
    background: var(--schemafy-gray-50);
}

.schemafy-modal-container .schemafy-modal-header h2 {
    margin: 0;
    font-size: 14px;
    font-weight: 600;
    color: var(--schemafy-gray-800);
    display: flex;
    align-items: center;
    gap: 8px;
}

.schemafy-modal-container .schemafy-modal-body {
    padding: 24px;
    overflow-y: auto;
    background: var(--schemafy-white);
}

.schemafy-editor-mode-modal {
    max-width: 720px !important;
    width: 90%;
}

.schemafy-mode-description {
    text-align: center;
    font-size: 13px;
    color: var(--schemafy-gray-500);
    margin: 0 0 24px 0;
    line-height: 1.5;
}

.schemafy-mode-selection-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 16px;
    margin: 16px 0;
}

.schemafy-mode-card {
    position: relative;
    background: var(--schemafy-white);
    border: var(--schemafy-border);
    border-radius: var(--schemafy-radius);
    padding: 24px 20px;
    text-align: center;
    transition: var(--schemafy-transition);
    cursor: pointer;
    display: flex;
    flex-direction: column;
    align-items: center;
}

.schemafy-mode-card:hover {
    border-color: var(--schemafy-gray-400);
    background: var(--schemafy-gray-50);
}

.schemafy-mode-card.schemafy-mode-smart-builder {
    border-color: var(--schemafy-gray-900);
    background: var(--schemafy-gray-50);
}

.schemafy-mode-card.schemafy-mode-smart-builder:hover {
    background: var(--schemafy-gray-100);
}

.schemafy-mode-icon {
    width: 56px;
    height: 56px;
    border-radius: var(--schemafy-radius);
    background: var(--schemafy-gray-100);
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto 16px;
    transition: var(--schemafy-transition);
}

.schemafy-mode-card:hover .schemafy-mode-icon {
    background: var(--schemafy-gray-200);
}

.schemafy-mode-card.schemafy-mode-smart-builder .schemafy-mode-icon {
    background: var(--schemafy-gray-900);
}

.schemafy-mode-icon .dashicons {
    font-size: 26px;
    width: 26px;
    height: 26px;
    color: var(--schemafy-gray-500);
    transition: var(--schemafy-transition);
}

.schemafy-mode-card.schemafy-mode-smart-builder .schemafy-mode-icon .dashicons {
    color: var(--schemafy-white);
}

.schemafy-mode-card:hover .schemafy-mode-icon .dashicons {
    color: var(--schemafy-gray-700);
}

.schemafy-mode-card h3 {
    font-size: 16px;
    font-weight: 600;
    color: var(--schemafy-gray-900);
    margin: 0 0 4px 0;
}

.schemafy-mode-card > p {
    font-size: 12px;
    color: var(--schemafy-gray-500);
    margin: 0 0 16px 0;
}

.schemafy-mode-features {
    list-style: none;
    padding: 0;
    margin: 0 0 20px 0;
    text-align: left;
    width: 100%;
}

.schemafy-mode-features li {
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 5px 0;
    font-size: 12px;
    color: var(--schemafy-gray-600);
}

.schemafy-mode-features li .dashicons {
    width: 14px;
    height: 14px;
    font-size: 14px;
    color: var(--schemafy-gray-400);
}

.schemafy-btn-select-mode {
    width: 100%;
    padding: 10px 16px;
    font-size: 13px;
    font-weight: 500;
    border-radius: var(--schemafy-radius);
    border: none;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    transition: var(--schemafy-transition);
}

.schemafy-btn-select-mode .dashicons {
    width: 16px;
    height: 16px;
    font-size: 16px;
}

.schemafy-btn-select-mode.schemafy-btn-primary {
    background: var(--schemafy-gray-900);
    color: var(--schemafy-white);
}

.schemafy-btn-select-mode.schemafy-btn-primary:hover {
    background: var(--schemafy-gray-800);
}

.schemafy-btn-select-mode.schemafy-btn-secondary {
    background: var(--schemafy-white);
    color: var(--schemafy-gray-700);
    border: var(--schemafy-border);
}

.schemafy-btn-select-mode.schemafy-btn-secondary:hover {
    background: var(--schemafy-gray-50);
    border-color: var(--schemafy-gray-300);
}

.schemafy-recommended-badge {
    position: absolute;
    top: 12px;
    right: 12px;
    background: var(--schemafy-gray-900);
    color: var(--schemafy-white);
    font-size: 9px;
    font-weight: 600;
    padding: 3px 8px;
    border-radius: var(--schemafy-radius-sm);
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

/* Locked mode card state */
.schemafy-mode-card.schemafy-mode-locked {
    opacity: 0.75;
    cursor: default;
    border-color: var(--schemafy-gray-300);
    background: var(--schemafy-gray-50);
}

.schemafy-mode-card.schemafy-mode-locked:hover {
    border-color: var(--schemafy-gray-300);
    background: var(--schemafy-gray-50);
}

.schemafy-mode-card.schemafy-mode-locked .schemafy-mode-icon {
    background: var(--schemafy-gray-200);
}

.schemafy-mode-card.schemafy-mode-locked .schemafy-mode-icon .dashicons {
    color: var(--schemafy-gray-400);
}

.schemafy-plan-required-badge {
    position: absolute;
    top: 12px;
    right: 12px;
    background: var(--schemafy-warning);
    color: #fff;
    font-size: 9px;
    font-weight: 700;
    padding: 3px 8px;
    border-radius: var(--schemafy-radius-sm);
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

.schemafy-btn-upgrade {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    width: 100%;
    justify-content: center;
    padding: 10px 16px;
    background: var(--schemafy-warning);
    color: #fff !important;
    border: none;
    border-radius: var(--schemafy-radius);
    font-size: 13px;
    font-weight: 600;
    cursor: pointer;
    text-decoration: none;
    transition: background 0.15s ease;
}

.schemafy-btn-upgrade:hover {
    background: var(--schemafy-warning-dark);
    color: #fff !important;
    text-decoration: none;
}

/* Responsive Design */
@media (max-width: 768px) {
    .schemafy-mode-selection-grid {
        grid-template-columns: 1fr;
        gap: 12px;
    }

    .schemafy-editor-mode-modal {
        width: 95%;
        margin: 16px;
    }

    .schemafy-mode-card {
        padding: 20px 16px;
    }

    .schemafy-mode-icon {
        width: 48px;
        height: 48px;
    }

    .schemafy-mode-icon .dashicons {
        font-size: 30px;
        width: 30px;
        height: 30px;
    }
}

/* ================================
   EDITING MODE INDICATORS
   ================================ */

.schemafy-editing-indicator {
    background: var(--schemafy-gray-900);
    color: var(--schemafy-white);
    padding: 10px 16px;
    font-size: 12px;
    display: flex;
    align-items: center;
    gap: 8px;
    border-radius: 0;
    margin: 0;
}

.schemafy-editing-indicator .dashicons {
    font-size: 14px;
    width: 14px;
    height: 14px;
    opacity: 0.7;
}

.schemafy-editing-indicator strong {
    font-weight: 600;
}

.schemafy-cancel-edit {
    margin-left: auto;
    background: transparent;
    border: 1px solid rgba(255, 255, 255, 0.3);
    color: var(--schemafy-white);
    padding: 4px 12px;
    border-radius: var(--schemafy-radius-sm);
    cursor: pointer;
    font-size: 11px;
    font-weight: 500;
    transition: var(--schemafy-transition);
}

.schemafy-cancel-edit:hover {
    background: rgba(255, 255, 255, 0.1);
    border-color: rgba(255, 255, 255, 0.5);
}

/* Save button in editing mode */
.schemafy-editing-mode {
    background: var(--schemafy-primary) !important;
}

.schemafy-editing-mode:hover {
    background: var(--schemafy-primary-hover) !important;
}

@keyframes schemafyEditingBorder {
    0% {
        background-position: 0% 50%;
    }
    100% {
        background-position: 200% 50%;
    }
}

/* Enhanced Form Groups */
.schemafy-form-group-enhanced {
    position: relative;
}

.schemafy-form-group-full {
    grid-column: 1 / -1;
}

.schemafy-label-enhanced {
    display: flex;
    align-items: center;
    gap: 8px;
    font-weight: 600;
    color: var(--schemafy-gray-800);
    margin-bottom: 8px;
}

.schemafy-label-enhanced .dashicons {
    font-size: 18px;
    color: var(--schemafy-primary);
}

.schemafy-input-enhanced,
.schemafy-select-enhanced {
    width: 100%;
    padding: 12px 16px;
    border: 2px solid var(--schemafy-gray-200);
    border-radius: var(--schemafy-radius);
    font-size: 14px;
    transition: var(--schemafy-transition);
    background: white;
}

.schemafy-input-enhanced:focus,
.schemafy-select-enhanced:focus {
    outline: none;
    border-color: var(--schemafy-primary);
    box-shadow: 0 0 0 3px rgba(79, 110, 245, 0.1);
}

.schemafy-field-help {
    display: flex;
    align-items: center;
    gap: 6px;
    margin-top: 8px;
    font-size: 13px;
    color: var(--schemafy-gray-600);
    line-height: 1.5;
}

.schemafy-field-help .dashicons {
    font-size: 16px;
    color: var(--schemafy-info);
}

/* URL Selector Wrapper */
.schemafy-url-selector-wrapper {
    position: relative;
}

.schemafy-url-selector-wrapper select {
    cursor: pointer;
    appearance: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath fill='%23666' d='M6 8L1 3h10z'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right 12px center;
    padding-right: 36px;
}

.schemafy-url-selector-wrapper select:hover {
    border-color: var(--schemafy-primary);
}

.schemafy-url-selector-wrapper select option {
    padding: 8px 12px;
}

/* Enhanced JSON Editor */
.schemafy-json-editor-wrapper-enhanced {
    border: 2px solid var(--schemafy-gray-200);
    border-radius: var(--schemafy-radius-lg);
    background: white;
    overflow: hidden;
    transition: var(--schemafy-transition);
}

.schemafy-json-editor-wrapper-enhanced:focus-within {
    border-color: var(--schemafy-primary);
    box-shadow: 0 0 0 3px rgba(79, 110, 245, 0.1);
}

/* Validation Status */
.schemafy-validation-status {
    padding: 12px 16px;
    background: var(--schemafy-gray-50);
    border-bottom: 1px solid var(--schemafy-gray-200);
    display: flex;
    align-items: center;
    gap: 12px;
    animation: slideDown 0.3s ease-out;
}

@keyframes slideDown {
    from {
        opacity: 0;
        transform: translateY(-10px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.schemafy-validation-badge {
    padding: 4px 12px;
    border-radius: 12px;
    font-size: 12px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.schemafy-validation-status.success .schemafy-validation-badge {
    background: #dcfce7;
    color: #166534;
}

.schemafy-validation-status.error .schemafy-validation-badge {
    background: #fee2e2;
    color: #991b1b;
}

.schemafy-validation-message {
    font-size: 13px;
    color: var(--schemafy-gray-700);
    flex: 1;
}

/* Enhanced Toolbar */
.schemafy-editor-toolbar-enhanced {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 8px;
    padding: 12px 16px;
    background: linear-gradient(135deg, var(--schemafy-gray-50) 0%, var(--schemafy-gray-100) 100%);
    border-bottom: 1px solid var(--schemafy-gray-200);
}

.schemafy-toolbar-group {
    display: flex;
    align-items: center;
    gap: 6px;
}

.schemafy-toolbar-divider {
    width: 1px;
    height: 24px;
    background: var(--schemafy-gray-300);
    margin: 0 8px;
}

.schemafy-toolbar-btn {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 6px 12px;
    border: 1px solid var(--schemafy-gray-300);
    border-radius: var(--schemafy-radius-sm);
    background: white;
    color: var(--schemafy-gray-700);
    font-size: 13px;
    font-weight: 500;
    cursor: pointer;
    transition: var(--schemafy-transition);
}

.schemafy-toolbar-btn:hover {
    background: var(--schemafy-gray-50);
    border-color: var(--schemafy-gray-400);
    transform: translateY(-1px);
}

.schemafy-toolbar-btn:active {
    transform: translateY(0);
}

.schemafy-toolbar-btn .dashicons {
    font-size: 16px;
    width: 16px;
    height: 16px;
}

.schemafy-toolbar-btn.schemafy-btn-format:hover {
    background: #f0f0fd;
    border-color: var(--schemafy-info);
    color: var(--schemafy-info);
}

.schemafy-toolbar-btn.schemafy-btn-validate:hover {
    background: #f0fdf4;
    border-color: var(--schemafy-success);
    color: var(--schemafy-success);
}

/* Code Editor Container */
.schemafy-code-editor-container {
    display: flex;
    background: var(--schemafy-code-bg);
    position: relative;
}

.schemafy-line-numbers {
    padding: 16px 8px;
    background: #0f172a;
    color: #64748b;
    font-family: var(--schemafy-font-mono);
    font-size: 13px;
    line-height: 1.6;
    text-align: right;
    user-select: none;
    border-right: 1px solid var(--schemafy-code-border);
    min-width: 50px;
    overflow: visible;
    /* No scroll — textarea auto-expands so no sync drift */
}

.schemafy-line-numbers > div {
    text-align: right;
}

.schemafy-code-editor {
    flex: 1;
    padding: 16px;
    background: var(--schemafy-code-bg);
    color: var(--schemafy-gray-200);
    font-family: var(--schemafy-font-mono);
    font-size: 13px;
    line-height: 1.6;
    border: none;
    resize: none;
    min-height: 400px;
    outline: none;
    white-space: pre;
    overflow: hidden;
    word-wrap: normal;
    /* Height set by JS (auto-expand) to eliminate scroll-sync drift */
}

.schemafy-code-editor::placeholder {
    color: #64748b;
}

/* Editor Footer */
.schemafy-editor-footer {
    padding: 10px 16px;
    background: var(--schemafy-gray-50);
    border-top: 1px solid var(--schemafy-gray-200);
}

.schemafy-editor-stats {
    display: flex;
    align-items: center;
    gap: 24px;
    font-size: 12px;
    color: var(--schemafy-gray-600);
}

.schemafy-stat-item {
    display: flex;
    align-items: center;
    gap: 6px;
}

.schemafy-stat-item .dashicons {
    font-size: 16px;
    color: var(--schemafy-gray-500);
}

.schemafy-stat-divider {
    width: 1px;
    height: 16px;
    background: var(--schemafy-gray-300);
    margin: 0 8px;
}

.schemafy-bracket-status {
    transition: var(--schemafy-transition);
}

.schemafy-bracket-status.success {
    color: var(--schemafy-success);
}

.schemafy-bracket-status.success .dashicons {
    color: var(--schemafy-success);
}

.schemafy-bracket-status.error {
    color: var(--schemafy-danger);
}

.schemafy-bracket-status.error .dashicons {
    color: var(--schemafy-danger);
}

/* ================================
   VARIABLES PANEL
   ================================ */
.schemafy-variables-panel {
    background: linear-gradient(135deg, #f5f3ff 0%, #ede9fe 100%);
    border: 1px solid #c4b5fd;
    border-radius: var(--schemafy-radius);
    padding: 16px;
    margin-bottom: 12px;
    animation: slideDown 0.2s ease-out;
}

@keyframes slideDown {
    from {
        opacity: 0;
        transform: translateY(-10px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.schemafy-variables-header {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 12px;
    padding-bottom: 10px;
    border-bottom: 1px solid #c4b5fd;
    color: #5b21b6;
    font-size: 13px;
}

.schemafy-variables-header .dashicons {
    color: var(--schemafy-primary);
}

.schemafy-variables-hint {
    margin-left: auto;
    font-weight: normal;
    font-size: 11px;
    color: #64748b;
    font-style: italic;
}

.schemafy-variables-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    gap: 16px;
}

.schemafy-variable-group {
    background: white;
    border-radius: var(--schemafy-radius-sm);
    padding: 12px;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05);
}

.schemafy-variable-group-title {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 11px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    color: var(--schemafy-gray-600);
    margin-bottom: 10px;
    padding-bottom: 8px;
    border-bottom: 1px solid var(--schemafy-gray-200);
}

.schemafy-variable-group-title .dashicons {
    font-size: 14px;
    width: 14px;
    height: 14px;
    color: var(--schemafy-primary);
}

.schemafy-variable-btn {
    display: flex;
    align-items: center;
    gap: 8px;
    width: 100%;
    padding: 8px 10px;
    margin-bottom: 6px;
    background: var(--schemafy-gray-50);
    border: 1px solid var(--schemafy-gray-200);
    border-radius: var(--schemafy-radius-sm);
    cursor: pointer;
    transition: var(--schemafy-transition);
    text-align: left;
}

.schemafy-variable-btn:last-child {
    margin-bottom: 0;
}

.schemafy-variable-btn:hover {
    background: var(--schemafy-primary);
    border-color: var(--schemafy-primary);
    transform: translateX(3px);
}

.schemafy-variable-btn:hover code,
.schemafy-variable-btn:hover .schemafy-variable-desc {
    color: white;
}

.schemafy-variable-btn code {
    font-family: var(--schemafy-font-mono);
    font-size: 11px;
    color: var(--schemafy-primary);
    background: var(--schemafy-blue-50);
    padding: 2px 6px;
    border-radius: 3px;
    transition: var(--schemafy-transition);
}

.schemafy-variable-btn:hover code {
    background: rgba(255, 255, 255, 0.2);
}

.schemafy-variable-desc {
    font-size: 11px;
    color: var(--schemafy-gray-600);
    transition: var(--schemafy-transition);
}

.schemafy-variable-group-header {
    padding: 6px 12px;
    margin-top: 4px;
    background: var(--schemafy-gray-50);
    border-bottom: 1px solid var(--schemafy-gray-200);
    border-top: 1px solid var(--schemafy-gray-200);
    font-size: 11px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    color: var(--schemafy-gray-600);
}

/* ================================
   ERROR PANEL
   ================================ */
.schemafy-error-panel {
    background: linear-gradient(135deg, #fef2f2 0%, #fee2e2 100%);
    border: 1px solid #fecaca;
    border-left: 4px solid var(--schemafy-danger);
    border-radius: var(--schemafy-radius);
    padding: 12px 16px;
    margin-bottom: 12px;
    animation: slideDown 0.2s ease-out;
}

.schemafy-error-header {
    display: flex;
    align-items: center;
    gap: 8px;
    color: #991b1b;
    font-size: 13px;
    margin-bottom: 8px;
}

.schemafy-error-header .dashicons {
    color: var(--schemafy-danger);
}

.schemafy-error-list {
    margin: 0;
    padding: 0;
    list-style: none;
}

.schemafy-error-list li {
    display: flex;
    align-items: flex-start;
    gap: 8px;
    padding: 6px 0;
    font-size: 12px;
    color: #7f1d1d;
    border-bottom: 1px solid rgba(239, 68, 68, 0.1);
}

.schemafy-error-list li:last-child {
    border-bottom: none;
    padding-bottom: 0;
}

.schemafy-error-list li::before {
    content: "•";
    color: var(--schemafy-danger);
    font-weight: bold;
}

/* Variables button active state */
.schemafy-btn-variables.active {
    background: var(--schemafy-primary) !important;
    color: white !important;
    border-color: var(--schemafy-primary) !important;
}

.schemafy-btn-variables.active .dashicons {
    color: white !important;
}

/* Responsive Adjustments */
@media (max-width: 768px) {
    .schemafy-editor-toolbar-enhanced {
        padding: 10px 12px;
    }

    .schemafy-toolbar-btn span:not(.dashicons) {
        display: none;
    }

    .schemafy-toolbar-divider {
        display: none;
    }

    .schemafy-code-editor {
        font-size: 12px;
    }

    .schemafy-line-numbers {
        font-size: 12px;
        min-width: 40px;
    }

    .schemafy-editor-stats {
        flex-wrap: wrap;
        gap: 12px;
    }
}

/* ================================
   SIDEBAR LAYOUT
   ================================ */

/* Main Layout Container */
.schemafy-sidebar-layout {
    display: flex;
    flex-direction: row-reverse;
    min-height: calc(100vh - 32px);
    margin: 0 !important;
    background: var(--schemafy-gray-100);
    overflow-x: hidden;
}

/* Sidebar */
.schemafy-sidebar {
    width: 240px;
    min-width: 240px;
    background: #0d1117;
    display: flex;
    flex-direction: column;
    position: fixed;
    top: 32px;
    right: 0;
    left: auto;
    bottom: 0;
    z-index: 99;
    transition: width 0.25s ease, min-width 0.25s ease;
    overflow: hidden;
    box-shadow: -1px 0 0 rgba(255, 255, 255, 0.05);
}

/* Collapsed state */
.schemafy-sidebar.collapsed {
    width: 60px;
    min-width: 60px;
}

.schemafy-sidebar.collapsed .schemafy-nav-text,
.schemafy-sidebar.collapsed .schemafy-nav-label,
.schemafy-sidebar.collapsed .schemafy-logo-text,
.schemafy-sidebar.collapsed .schemafy-logo-dot,
.schemafy-sidebar.collapsed .schemafy-sidebar-link span:last-child,
.schemafy-sidebar.collapsed .schemafy-version-badge,
.schemafy-sidebar.collapsed .schemafy-nav-divider {
    display: none;
}

.schemafy-sidebar.collapsed .schemafy-tab-btn-v2 {
    justify-content: center;
    padding: 10px;
    width: calc(100% - 16px);
}

/* Sidebar Header */
.schemafy-sidebar-header {
    padding: 18px 16px 14px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.05);
    margin-bottom: 4px;
}

.schemafy-logo-compact {
    display: flex;
    align-items: center;
    gap: 10px;
    color: white;
}

.schemafy-logo-compact .dashicons {
    font-size: 18px;
    width: 18px;
    height: 18px;
    color: var(--schemafy-primary);
    opacity: 1;
    background: rgba(79, 110, 245, 0.18);
    border-radius: 6px;
    padding: 5px;
    box-sizing: content-box;
}

.schemafy-logo-text {
    font-size: 15px;
    font-weight: 700;
    letter-spacing: -0.3px;
    color: #fff;
}

.schemafy-logo-dot {
    color: var(--schemafy-primary);
}

/* Sidebar Navigation */
.schemafy-sidebar-nav {
    flex: 1;
    min-height: 0; /* allows flex child to shrink and scroll properly */
    padding: 8px 0;
    overflow-y: auto;
}

.schemafy-nav-section {
    margin-bottom: 4px;
}

.schemafy-nav-label--removed-dupe {
    display: block;
    padding: 12px 20px 4px;
    font-size: 10px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.8px;
    color: rgba(255, 255, 255, 0.22);
}

/* Nav text — truncates so tier badges always remain visible */
.schemafy-nav-text {
    flex: 1;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* ── Sidebar tab buttons — base (secondary/compact style) ────────────── */
.schemafy-sidebar .schemafy-tab-btn-v2 {
    display: flex;
    align-items: center;
    gap: 9px;
    width: calc(100% - 16px);
    padding: 7px 12px;
    margin: 1px 8px;
    background: transparent;
    border: none;
    border-radius: 7px;
    color: rgba(255, 255, 255, 0.45);
    font-size: var(--schemafy-text-sm);
    font-weight: 500;
    text-align: left;
    cursor: pointer;
    transition: background 0.15s ease, color 0.15s ease;
}

.schemafy-sidebar .schemafy-tab-btn-v2:hover {
    background: rgba(255, 255, 255, 0.06);
    color: rgba(255, 255, 255, 0.8);
}

.schemafy-sidebar .schemafy-tab-btn-v2.active {
    background: rgba(79, 110, 245, 0.12);
    color: rgba(79, 110, 245, 0.9);
}

.schemafy-sidebar .schemafy-tab-btn-v2 .dashicons {
    font-size: 14px;
    width: 14px;
    height: 14px;
    color: currentColor;
    opacity: 0.7;
    flex-shrink: 0;
}

.schemafy-sidebar .schemafy-tab-btn-v2:hover .dashicons {
    opacity: 0.9;
}

.schemafy-sidebar .schemafy-tab-btn-v2.active .dashicons {
    opacity: 1;
}

/* ── PRIMARY nav tabs — Dashboard + Create Schemas group ─────────────
   Larger, icon-box treatment, solid active state.
   Applied via .schemafy-tab-primary modifier class in the template.
   ──────────────────────────────────────────────────────────────────── */
.schemafy-sidebar .schemafy-tab-btn-v2.schemafy-tab-primary {
    padding: 9px 10px;
    margin: 2px 8px;
    border-radius: 10px;
    color: rgba(255, 255, 255, 0.65);
    font-size: var(--schemafy-text-base);
    font-weight: 600;
    gap: 11px;
}

.schemafy-sidebar .schemafy-tab-btn-v2.schemafy-tab-primary:hover {
    background: rgba(255, 255, 255, 0.08);
    color: rgba(255, 255, 255, 0.95);
}

/* Icon box */
.schemafy-sidebar .schemafy-tab-btn-v2.schemafy-tab-primary .schemafy-nav-icon-box {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 30px;
    height: 30px;
    border-radius: 8px;
    background: rgba(255, 255, 255, 0.07);
    flex-shrink: 0;
    transition: background 0.15s ease;
}

.schemafy-sidebar .schemafy-tab-btn-v2.schemafy-tab-primary .dashicons {
    font-size: 15px;
    width: 15px;
    height: 15px;
    opacity: 0.8;
}

.schemafy-sidebar .schemafy-tab-btn-v2.schemafy-tab-primary:hover .schemafy-nav-icon-box {
    background: rgba(255, 255, 255, 0.12);
}

.schemafy-sidebar .schemafy-tab-btn-v2.schemafy-tab-primary:hover .dashicons {
    opacity: 1;
}

/* Active primary tab — solid brand color */
.schemafy-sidebar .schemafy-tab-btn-v2.schemafy-tab-primary.active {
    background: rgba(79, 110, 245, 0.15);
    color: #fff;
}

.schemafy-sidebar .schemafy-tab-btn-v2.schemafy-tab-primary.active .schemafy-nav-icon-box {
    background: var(--schemafy-primary);
    box-shadow: 0 2px 8px rgba(79, 110, 245, 0.45);
}

.schemafy-sidebar .schemafy-tab-btn-v2.schemafy-tab-primary.active .dashicons {
    opacity: 1;
    color: #fff;
}

/* Collapsed sidebar — icon-box centered, no label */
.schemafy-sidebar.collapsed .schemafy-tab-btn-v2.schemafy-tab-primary {
    justify-content: center;
    padding: 9px;
    width: calc(100% - 16px);
    gap: 0;
}

.schemafy-sidebar.collapsed .schemafy-tab-btn-v2.schemafy-tab-primary .schemafy-nav-icon-box {
    width: 34px;
    height: 34px;
}

/* ── Section separator between primary and secondary groups ──────────── */
.schemafy-nav-divider {
    height: 1px;
    background: rgba(255, 255, 255, 0.06);
    margin: 10px 16px 8px;
}

/* ── Section labels — secondary group ────────────────────────────────── */
.schemafy-nav-label {
    display: block;
    padding: 8px 20px 4px;
    font-size: 10px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.8px;
    color: rgba(255, 255, 255, 0.18);
}

/* Sidebar Footer */
.schemafy-sidebar-footer {
    padding: 12px 8px;
    border-top: 1px solid rgba(255, 255, 255, 0.06);
    display: flex;
    flex-direction: column;
    gap: 2px;
    flex-shrink: 0; /* stays anchored at bottom, never overlapped by nav */
    position: relative;
    z-index: 1;
}

.schemafy-sidebar-link {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 7px 12px;
    color: rgba(255, 255, 255, 0.4);
    text-decoration: none;
    font-size: var(--schemafy-text-sm);
    border-radius: 8px;
    transition: background 0.15s ease, color 0.15s ease;
}

.schemafy-sidebar-link:hover {
    background: rgba(255, 255, 255, 0.06);
    color: rgba(255, 255, 255, 0.8);
}

.schemafy-sidebar-link .dashicons {
    font-size: 14px;
    width: 14px;
    height: 14px;
    opacity: 0.7;
}

.schemafy-version-badge {
    margin-top: 8px;
    padding: 4px 10px;
    background: rgba(255, 255, 255, 0.08);
    border-radius: 20px;
    font-size: 11px;
    color: rgba(255, 255, 255, 0.55);
    text-align: center;
    letter-spacing: 0.3px;
}

/* Main Content */
.schemafy-main-content {
    flex: 1;
    margin-right: 240px;
    margin-left: 0;
    display: flex;
    flex-direction: column;
    min-height: calc(100vh - 32px);
    min-width: 0; /* evita que flex-child desborde su contenedor */
    background: var(--schemafy-gray-50);
    overflow-x: hidden;
}

.schemafy-sidebar.collapsed ~ .schemafy-main-content {
    margin-right: 60px;
    margin-left: 0;
}

/* Top Bar */
.schemafy-topbar {
    display: flex;
    align-items: center;
    gap: 16px;
    padding: 10px 24px;
    background: #fff;
    border-bottom: 1px solid rgba(0, 0, 0, 0.06);
    box-shadow: 0 1px 0 rgba(0, 0, 0, 0.04);
    position: sticky;
    top: 32px;
    z-index: 50;
}

/* Sidebar Toggle Tab - Protruding button on sidebar edge */
.schemafy-sidebar-toggle-tab {
    position: fixed;
    right: 240px;
    top: 50%;
    transform: translateY(-50%);
    width: 20px;
    height: 44px;
    background: #0d1117;
    border: none;
    border-radius: 6px 0 0 6px;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: width 0.25s ease, right 0.25s ease, background 0.15s ease;
    z-index: 100;
    box-shadow: -1px 0 0 rgba(255, 255, 255, 0.06);
}

.schemafy-sidebar-toggle-tab:hover {
    background: #161b22;
    width: 24px;
    right: 236px;
}

.schemafy-sidebar-toggle-tab .dashicons {
    font-size: 14px;
    width: 14px;
    height: 14px;
    color: rgba(255, 255, 255, 0.45);
    transition: transform 0.25s ease, color 0.15s ease;
}

.schemafy-sidebar-toggle-tab:hover .dashicons {
    color: rgba(255, 255, 255, 0.8);
}

/* Move toggle when sidebar is collapsed (adjacent sibling selector) */
.schemafy-sidebar.collapsed + .schemafy-sidebar-toggle-tab {
    right: 60px; /* Collapsed sidebar width */
}

.schemafy-sidebar.collapsed + .schemafy-sidebar-toggle-tab:hover {
    right: 56px;
}

/* Rotate arrow when sidebar is collapsed */
.schemafy-sidebar.collapsed + .schemafy-sidebar-toggle-tab .dashicons {
    transform: rotate(180deg);
}

/* Old toggle in topbar - hidden */
.schemafy-sidebar-toggle {
    display: none;
}

.schemafy-page-title {
    font-size: 15px;
    font-weight: 600;
    color: var(--schemafy-gray-900);
    margin: 0;
    flex: 1;
    letter-spacing: -0.1px;
}

.schemafy-topbar-actions {
    display: flex;
    gap: 8px;
}

/* Content Area */
.schemafy-content-area {
    flex: 1;
    padding: 24px 0;
    overflow-y: auto;
}

/* Footer in sidebar layout */
.schemafy-sidebar-layout .schemafy-footer-v2 {
    padding: 16px 24px;
    background: white;
    border-top: 1px solid var(--schemafy-gray-200);
    text-align: center;
}

.schemafy-sidebar-layout .schemafy-footer-v2 p {
    margin: 0;
    font-size: 13px;
    color: var(--schemafy-gray-500);
}


/* Responsive: Medium screens — auto-collapse sidebar to icon-only */
@media (max-width: 1100px) {
    .schemafy-sidebar {
        width: 60px;
        min-width: 60px;
    }

    .schemafy-sidebar .schemafy-nav-text,
    .schemafy-sidebar .schemafy-nav-label,
    .schemafy-sidebar .schemafy-logo-text,
    .schemafy-sidebar .schemafy-sidebar-link span:last-child,
    .schemafy-sidebar .schemafy-version-badge {
        display: none;
    }

    .schemafy-sidebar .schemafy-tab-btn-v2 {
        justify-content: center;
        padding: 12px;
    }

    .schemafy-main-content {
        margin-right: 60px;
    }

    .schemafy-sidebar-toggle-tab {
        right: 60px;
    }

    .schemafy-sidebar-toggle-tab:hover {
        right: 56px;
    }
}

/* Responsive: Mobile */
@media (max-width: 782px) {
    .schemafy-sidebar {
        transform: translateX(100%);
        right: 0;
        left: auto;
        top: 46px;
        width: 260px;
        min-width: 260px;
        box-shadow: -4px 0 20px rgba(0, 0, 0, 0.3);
    }

    /* Restaurar texto en mobile cuando está abierto */
    .schemafy-sidebar .schemafy-nav-text,
    .schemafy-sidebar .schemafy-nav-label,
    .schemafy-sidebar .schemafy-logo-text,
    .schemafy-sidebar .schemafy-sidebar-link span:last-child,
    .schemafy-sidebar .schemafy-version-badge {
        display: revert;
    }

    .schemafy-sidebar .schemafy-tab-btn-v2 {
        justify-content: flex-start;
        padding: 10px 20px;
    }

    .schemafy-sidebar.mobile-open {
        transform: translateX(0);
        box-shadow: -4px 0 20px rgba(0, 0, 0, 0.3);
    }

    /* Mobile toggle tab - fixed position when sidebar is hidden */
    .schemafy-sidebar-toggle-tab {
        position: fixed;
        right: 0;
        left: auto;
        top: 50%;
        transform: translateY(-50%);
        width: 36px;
        height: 48px;
        border-radius: 8px 0 0 8px;
        z-index: 1002;
    }

    /* When sidebar is open on mobile, position toggle at sidebar edge */
    .schemafy-sidebar.mobile-open + .schemafy-sidebar-toggle-tab {
        right: 260px;
    }

    .schemafy-sidebar.mobile-open + .schemafy-sidebar-toggle-tab .dashicons {
        transform: rotate(180deg);
    }

    .schemafy-main-content {
        margin-right: 0;
        margin-left: 0;
    }

    .schemafy-topbar {
        top: 46px;
    }

    .schemafy-content-area {
        padding: 16px;
    }
}

/* ================================
   WORDPRESS MENU COLLAPSE FIX
   ================================ */

/* Cuando el menú de WordPress está colapsado (clase .folded en body)
   WordPress reduce el #wpcontent, así que nuestro contenedor debe usar el 100% disponible */
body.folded .schemafy-admin-wrap-v2,
body.folded .schemafy-sidebar-layout {
    margin-left: 0 !important;
    margin-right: 0 !important;
    width: 100% !important;
    max-width: 100% !important;
}

body.folded .schemafy-main-content {
    max-width: 100%;
    width: 100%;
}

/* En pantallas pequeñas cuando el menú está en auto-fold */
@media screen and (max-width: 960px) {
    body.auto-fold .schemafy-admin-wrap-v2,
    body.auto-fold .schemafy-sidebar-layout {
        margin-left: 0 !important;
        margin-right: 0 !important;
        width: 100% !important;
        max-width: 100% !important;
    }

    body.auto-fold .schemafy-main-content {
        max-width: 100%;
        width: 100%;
    }
}

/* Asegurar que el contenedor principal del plugin use todo el ancho disponible
   del #wpcontent de WordPress, independientemente del estado del menú */
.schemafy-sidebar-layout,
.schemafy-admin-wrap-v2 {
    width: 100%;
    max-width: 100%;
    box-sizing: border-box;
}

/* ================================
   MINIMALIST BULK MANAGER STYLES
   ================================ */

/* Stats Bar (inline stats row above bulk table) */
.schemafy-stats-bar {
    padding: 16px 24px;
    background: var(--schemafy-gray-50);
    border-bottom: 1px solid var(--schemafy-gray-200);
    display: flex;
    flex-wrap: wrap;
    gap: 24px;
    align-items: center;
}
.schemafy-stats-bar-group {
    display: flex;
    gap: 32px;
    flex-wrap: wrap;
    flex: 1;
}
.schemafy-stat-inline {
    display: flex;
    align-items: center;
    gap: 8px;
}
.schemafy-stat-inline-value {
    font-size: 24px;
    font-weight: 700;
    color: var(--schemafy-gray-900);
}
.schemafy-stat-inline-value.value-success { color: var(--schemafy-success); }
.schemafy-stat-inline-value.value-warning { color: var(--schemafy-warning); }
.schemafy-stat-inline-value.value-primary { color: var(--schemafy-primary); }
.schemafy-stat-inline-label {
    font-size: 13px;
    color: var(--schemafy-gray-600);
}

/* Tools Panel */
.schemafy-tools-panel {
    display: none;
    padding: 20px 24px;
    background: var(--schemafy-gray-50);
    border-bottom: var(--schemafy-border);
    position: relative;
    z-index: 1;
}
.schemafy-tools-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: 12px;
}
.schemafy-tools-grid + .schemafy-tools-grid {
    margin-top: 16px;
}

/* Tool Button Base */
.schemafy-tool-btn {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 14px 16px;
    background: white;
    border: var(--schemafy-border);
    border-radius: var(--schemafy-radius);
    text-align: left;
    cursor: pointer;
    transition: var(--schemafy-transition);
    width: 100%;
}
.schemafy-tool-btn-icon {
    width: 40px;
    height: 40px;
    border-radius: var(--schemafy-radius);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}
.schemafy-tool-btn-icon .dashicons {
    color: white;
    font-size: 20px;
    width: 20px;
    height: 20px;
}
.schemafy-tool-btn-icon.icon-primary  { background: var(--schemafy-primary); }
.schemafy-tool-btn-icon.icon-danger   { background: var(--schemafy-danger); }
.schemafy-tool-btn-icon.icon-warning  { background: var(--schemafy-warning); }
.schemafy-tool-btn-icon.icon-dark     { background: var(--schemafy-primary-dark); }
.schemafy-tool-btn-icon.icon-info     { background: var(--schemafy-info); }
.schemafy-tool-btn-icon.icon-gray     { background: var(--schemafy-gray-500); }
.schemafy-tool-btn-title {
    font-weight: 600;
    font-size: 14px;
    color: var(--schemafy-gray-900);
}
.schemafy-tool-btn-desc {
    font-size: 12px;
    color: var(--schemafy-gray-500);
}

/* Health Stats Summary (inside tools panel) */
.schemafy-health-overview {
    margin-top: 16px;
    padding: 16px;
    background: white;
    border-radius: 10px;
    border: 1px solid var(--schemafy-gray-200);
}
.schemafy-health-overview-title {
    font-weight: 600;
    font-size: 13px;
    color: var(--schemafy-gray-700);
    margin-bottom: 12px;
}
.schemafy-health-overview-stats {
    display: flex;
    gap: 24px;
    flex-wrap: wrap;
}
.schemafy-health-overview-stat { text-align: center; }
.schemafy-health-overview-value {
    font-size: 24px;
    font-weight: 700;
    color: var(--schemafy-gray-900);
}
.schemafy-health-overview-value.value-success { color: var(--schemafy-success); }
.schemafy-health-overview-value.value-danger  { color: var(--schemafy-danger); }
.schemafy-health-overview-value.value-warning { color: var(--schemafy-warning); }
.schemafy-health-overview-label {
    font-size: 11px;
    color: var(--schemafy-gray-500);
}

/* Filters Bar (Rich Snippets) */
.schemafy-filters-bar {
    padding: 16px 24px;
    background: white;
    border-bottom: 1px solid var(--schemafy-gray-200);
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    align-items: center;
}
.schemafy-filter-input {
    padding: 10px 14px;
    border: 1px solid var(--schemafy-gray-300);
    border-radius: 8px;
    font-size: 14px;
    background: white;
}
.schemafy-filter-input-search {
    flex: 1;
    min-width: 200px;
    max-width: 400px;
}
.schemafy-filter-select {
    padding: 10px 14px;
    border: 1px solid var(--schemafy-gray-300);
    border-radius: 8px;
    font-size: 14px;
    min-width: 150px;
    background: white;
}
.schemafy-filter-select.select-sm { min-width: 120px; }
.schemafy-filters-extended {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    align-items: center;
    width: 100%;
    margin-top: 12px;
    padding-top: 12px;
    border-top: 1px solid var(--schemafy-gray-200);
}

/* Tool Button Hover Effects */
.schemafy-tool-btn:hover {
    border-color: var(--schemafy-primary) !important;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
    transform: translateY(-2px);
}

.schemafy-tool-btn:active {
    transform: translateY(0);
}

/* Toggle Button States */
#schemafy-toggle-tools,
#schemafy-toggle-more-filters {
    transition: all 0.2s ease;
}

#schemafy-toggle-tools:hover,
#schemafy-toggle-more-filters:hover {
    background: var(--schemafy-gray-100);
    border-color: var(--schemafy-gray-400);
}

/* Filter Input Focus States */
#schemafy-bulk-search:focus,
#schemafy-bulk-filter-type:focus,
#schemafy-bulk-filter-status:focus,
#schemafy-bulk-filter-date:focus,
#schemafy-bulk-sort:focus,
#schemafy-bulk-per-page:focus {
    outline: none;
    border-color: var(--schemafy-primary);
    box-shadow: 0 0 0 3px rgba(79, 110, 245, 0.1);
}

/* Responsive for Minimalist Bulk Manager */
@media (max-width: 768px) {
    #schemafy-tools-panel .schemafy-tool-btn {
        flex-direction: column;
        text-align: center;
        padding: 16px 12px;
    }

    #schemafy-tools-panel .schemafy-tool-btn > div:first-child {
        margin: 0 auto 8px;
    }

    #schemafy-tools-panel .schemafy-tool-btn > div:last-child {
        text-align: center;
    }
}

/* ================================
   MODULAR COMPONENTS (v2 aliases)
   ================================ */

/* Notification V2 */
.schemafy-notification-v2 {
    position: fixed;
    top: 32px;
    right: 32px;
    min-width: 300px;
    max-width: 500px;
    padding: 16px 20px;
    border-radius: var(--schemafy-radius);
    box-shadow: var(--schemafy-shadow-lg);
    display: flex;
    align-items: center;
    gap: 12px;
    z-index: 100001;
    transform: translateX(120%);
    opacity: 0;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    background: white;
}

.schemafy-notification-v2.show {
    transform: translateX(0);
    opacity: 1;
}

/* Validation reports list one finding per line. The message is inserted as
   text, never markup, so the line breaks have to come from CSS. */
.schemafy-notification-v2 .schemafy-notification-message {
    white-space: pre-line;
}

.schemafy-notification-v2.schemafy-notification-success {
    background: #d1fae5;
    border-left: 4px solid var(--schemafy-success);
    color: #065f46;
}

.schemafy-notification-v2.schemafy-notification-error {
    background: #fee2e2;
    border-left: 4px solid var(--schemafy-danger);
    color: #991b1b;
}

.schemafy-notification-v2.schemafy-notification-warning {
    background: #fef3c7;
    border-left: 4px solid var(--schemafy-warning);
    color: #92400e;
}

.schemafy-notification-v2.schemafy-notification-info {
    background: var(--schemafy-blue-100);
    border-left: 4px solid var(--schemafy-primary);
    color: var(--schemafy-primary-dark);
}

.schemafy-notification-close {
    background: none;
    border: none;
    font-size: 20px;
    cursor: pointer;
    opacity: 0.6;
    transition: opacity 0.2s;
    padding: 0;
    line-height: 1;
}

.schemafy-notification-close:hover {
    opacity: 1;
}

/* Table V2 */
.schemafy-table-v2 {
    width: 100%;
    border-collapse: collapse;
    background: white;
    border-radius: var(--schemafy-radius);
    overflow: hidden;
}

.schemafy-table-v2 th {
    text-align: left;
    padding: 12px 16px;
    background: var(--schemafy-gray-50);
    font-weight: 600;
    color: var(--schemafy-gray-700);
    border-bottom: 2px solid var(--schemafy-gray-200);
}

.schemafy-table-v2 td {
    padding: 12px 16px;
    border-bottom: 1px solid var(--schemafy-gray-200);
    vertical-align: middle;
}

.schemafy-table-v2 tbody tr:hover {
    background: var(--schemafy-gray-50);
}

/* Pagination V2 */
.schemafy-pagination-v2 {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 8px;
    margin-top: 24px;
    padding: 16px;
}

.schemafy-pagination-btn {
    padding: 8px 16px;
    border: 1px solid var(--schemafy-gray-300);
    border-radius: var(--schemafy-radius);
    background: white;
    color: var(--schemafy-gray-700);
    font-size: 14px;
    cursor: pointer;
    transition: all 0.2s;
}

.schemafy-pagination-btn:hover {
    background: var(--schemafy-gray-100);
    border-color: var(--schemafy-gray-400);
}

.schemafy-pagination-btn.active {
    background: var(--schemafy-primary);
    color: white;
    border-color: var(--schemafy-primary);
}

.schemafy-pagination-ellipsis {
    padding: 8px 12px;
    color: var(--schemafy-gray-500);
}

/* Empty State V2 */
.schemafy-empty-state-v2 {
    text-align: center;
    padding: 48px 24px;
    color: var(--schemafy-gray-600);
}

.schemafy-empty-state-v2 .schemafy-empty-icon {
    font-size: 48px;
    margin-bottom: 16px;
    opacity: 0.5;
}

.schemafy-empty-state-v2 .schemafy-empty-icon .dashicons {
    font-size: 48px;
    width: 48px;
    height: 48px;
}

.schemafy-empty-state-v2 h3 {
    margin: 0 0 8px 0;
    font-size: 18px;
    font-weight: 600;
    color: var(--schemafy-gray-700);
}

.schemafy-empty-state-v2 p {
    margin: 0;
    font-size: 14px;
}

/* Info Box V2 */
.schemafy-info-box-v2 {
    display: flex;
    gap: 12px;
    padding: 16px;
    background: var(--schemafy-blue-50);
    border: 1px solid var(--schemafy-blue-200);
    border-radius: var(--schemafy-radius);
    color: var(--schemafy-primary-dark);
    font-size: 14px;
    line-height: 1.5;
}

.schemafy-info-box-v2 .dashicons {
    flex-shrink: 0;
    color: var(--schemafy-primary);
}

.schemafy-info-box-v2 strong {
    display: block;
    margin-bottom: 4px;
}

/* ================================
   ONBOARDING TUTORIAL
   ================================ */
.schemafy-onboarding-overlay {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(15, 23, 42, 0.8);
    backdrop-filter: blur(4px);
    z-index: 999999;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 20px;
}

.schemafy-onboarding-modal {
    background: white;
    border-radius: 16px;
    max-width: 600px;
    width: 100%;
    box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.25);
    overflow: hidden;
    animation: schemafySlideUp 0.4s ease-out;
}

@keyframes schemafySlideUp {
    from {
        opacity: 0;
        transform: translateY(30px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.schemafy-onboarding-header {
    background: linear-gradient(135deg, var(--schemafy-primary) 0%, var(--schemafy-primary-dark) 100%);
    color: white;
    padding: 32px;
    text-align: center;
}

.schemafy-onboarding-logo {
    width: 64px;
    height: 64px;
    background: rgba(255, 255, 255, 0.2);
    border-radius: 16px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto 16px;
}

.schemafy-onboarding-logo .dashicons {
    font-size: 32px;
    width: 32px;
    height: 32px;
}

.schemafy-onboarding-header h2 {
    margin: 0 0 8px 0;
    font-size: 24px;
    font-weight: 700;
    color: white;
}

.schemafy-onboarding-header p {
    margin: 0;
    opacity: 0.9;
    font-size: 14px;
    color: white;
}

@keyframes schemafyFadeIn {
    from { opacity: 0; }
    to { opacity: 1; }
}

.schemafy-onboarding-nav {
    padding: 20px 32px;
    border-top: 1px solid var(--schemafy-gray-200);
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.schemafy-onboarding-buttons {
    display: flex;
    gap: 10px;
}

.schemafy-onboarding-buttons .schemafy-btn-primary,
.schemafy-onboarding-buttons .schemafy-btn-secondary {
    display: inline-flex;
    align-items: center;
    gap: 6px;
}

.schemafy-onboarding-buttons .dashicons {
    font-size: 16px;
    width: 16px;
    height: 16px;
}

.schemafy-onboarding-dismiss {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 12px 32px;
    background: var(--schemafy-gray-50);
    font-size: 12px;
    color: var(--schemafy-gray-500);
    cursor: pointer;
}

.schemafy-onboarding-dismiss:hover {
    color: var(--schemafy-gray-700);
}

.schemafy-onboarding-dismiss input {
    margin: 0;
}

/* Responsive Onboarding */
@media (max-width: 600px) {
    .schemafy-onboarding-modal {
        max-height: 90vh;
        overflow-y: auto;
    }

    .schemafy-onboarding-header {
        padding: 24px;
    }

    .schemafy-onboarding-nav {
        flex-direction: column;
        gap: 16px;
    }

    .schemafy-onboarding-buttons {
        width: 100%;
        justify-content: center;
    }
}

/* =====================================================
   INTERACTIVE TOUR SYSTEM
   ===================================================== */

/* Tour Overlay - covers the screen with semi-transparent background */
.schemafy-tour-overlay {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(0, 0, 0, 0.5);
    z-index: 99998;
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.3s ease, visibility 0.3s ease;
}

.schemafy-tour-overlay.active {
    opacity: 1;
    visibility: visible;
}

/* Highlighted element gets this class */
.schemafy-tour-highlight {
    position: relative !important;
    z-index: 99999 !important;
    box-shadow: 0 0 0 4px var(--schemafy-primary), 0 0 0 9999px rgba(0, 0, 0, 0.5) !important;
    border-radius: 8px !important;
    animation: schemafy-tour-pulse 2s ease-in-out infinite;
}

/* Sidebar nav buttons highlighted during tour: force white text for dark-bg sidebar */
.schemafy-tab-btn-v2.schemafy-tour-highlight .dashicons,
.schemafy-tab-btn-v2.schemafy-tour-highlight .schemafy-nav-text,
.schemafy-tab-btn-v2.schemafy-tour-highlight .schemafy-tier-badge {
    color: white !important;
    opacity: 1 !important;
    text-shadow: 0 1px 3px rgba(0, 0, 0, 0.7);
}

/* Content elements (cards, forms) highlighted during tour: guarantee dark readable text */
.schemafy-tour-highlight:not(.schemafy-tab-btn-v2) {
    background-color: #ffffff !important;
    color: #1a1a2e !important;
    overflow: visible !important;
}

@keyframes schemafy-tour-pulse {
    0%, 100% {
        box-shadow: 0 0 0 4px var(--schemafy-primary), 0 0 0 9999px rgba(0, 0, 0, 0.5);
    }
    50% {
        box-shadow: 0 0 0 8px rgba(79, 110, 245, 0.5), 0 0 0 9999px rgba(0, 0, 0, 0.5);
    }
}

/* Tour Tooltip */
.schemafy-tour-tooltip {
    position: fixed;
    z-index: 100000;
    background: white;
    border-radius: 12px;
    box-shadow: 0 20px 40px rgba(0, 0, 0, 0.2), 0 0 0 1px rgba(0, 0, 0, 0.05);
    width: 340px;
    max-width: calc(100vw - 40px);
    opacity: 0;
    visibility: hidden;
    transform: translateY(10px);
    transition: opacity 0.3s ease, visibility 0.3s ease, transform 0.3s ease;
}

.schemafy-tour-tooltip.active {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
}

/* Tooltip Arrow */
.schemafy-tour-tooltip-arrow {
    position: absolute;
    width: 16px;
    height: 16px;
    background: white;
    transform: rotate(45deg);
    box-shadow: -2px -2px 4px rgba(0, 0, 0, 0.05);
}

.schemafy-tour-tooltip[data-position="bottom"] .schemafy-tour-tooltip-arrow {
    top: -8px;
    left: 50%;
    margin-left: -8px;
}

.schemafy-tour-tooltip[data-position="top"] .schemafy-tour-tooltip-arrow {
    bottom: -8px;
    left: 50%;
    margin-left: -8px;
    box-shadow: 2px 2px 4px rgba(0, 0, 0, 0.05);
}

.schemafy-tour-tooltip[data-position="left"] .schemafy-tour-tooltip-arrow {
    right: -8px;
    top: 50%;
    margin-top: -8px;
    box-shadow: 2px -2px 4px rgba(0, 0, 0, 0.05);
}

.schemafy-tour-tooltip[data-position="right"] .schemafy-tour-tooltip-arrow {
    left: -8px;
    top: 50%;
    margin-top: -8px;
}

/* Tooltip Header */
.schemafy-tour-tooltip-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 16px 20px 12px;
    border-bottom: 1px solid var(--schemafy-gray-100);
}

.schemafy-tour-step-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: linear-gradient(135deg, var(--schemafy-primary) 0%, var(--schemafy-primary-dark) 100%);
    color: white;
    font-size: 11px;
    font-weight: 600;
    padding: 4px 10px;
    border-radius: 20px;
}

.schemafy-tour-close {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    border: none;
    background: var(--schemafy-gray-100);
    border-radius: 6px;
    cursor: pointer;
    color: var(--schemafy-gray-500);
    transition: all 0.2s;
}

.schemafy-tour-close:hover {
    background: var(--schemafy-gray-200);
    color: var(--schemafy-gray-700);
}

.schemafy-tour-close .dashicons {
    font-size: 18px;
    width: 18px;
    height: 18px;
}

/* Tooltip Content */
.schemafy-tour-tooltip-content {
    padding: 16px 20px;
}

.schemafy-tour-tooltip-content h4 {
    margin: 0 0 8px 0;
    font-size: 16px;
    font-weight: 600;
    color: var(--schemafy-gray-900);
}

.schemafy-tour-tooltip-content p {
    margin: 0;
    font-size: 14px;
    line-height: 1.5;
    color: var(--schemafy-gray-600);
}

/* Tooltip Footer */
.schemafy-tour-tooltip-footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    padding: 12px 20px 16px;
    border-top: 1px solid var(--schemafy-gray-100);
    gap: 12px;
}

.schemafy-tour-dont-show {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 12px;
    color: var(--schemafy-gray-500);
    cursor: pointer;
    white-space: nowrap;
    flex-shrink: 1;
    min-width: 0;
}

.schemafy-tour-dont-show:hover {
    color: var(--schemafy-gray-700);
}

.schemafy-tour-dont-show input {
    margin: 0;
}

.schemafy-tour-buttons {
    display: flex;
    align-items: center;
    flex-wrap: nowrap;
    gap: 8px;
    flex-shrink: 0;
}


.schemafy-tour-buttons .schemafy-btn-secondary,
.schemafy-tour-buttons .schemafy-btn-primary {
    padding: 8px 14px;
    font-size: 13px;
    display: inline-flex;
    align-items: center;
    gap: 4px;
    white-space: nowrap;
}

.schemafy-tour-buttons .schemafy-tour-prev,
.schemafy-tour-buttons .schemafy-tour-next {
    min-width: auto;
    padding: 8px 12px;
}

.schemafy-tour-buttons .dashicons {
    font-size: 14px;
    width: 14px;
    height: 14px;
}

/* Responsive Tour */
@media (max-width: 480px) {
    .schemafy-tour-tooltip {
        width: calc(100vw - 32px);
        left: 16px !important;
        right: 16px !important;
    }

    .schemafy-tour-tooltip-footer {
        flex-direction: column;
        gap: 12px;
    }

    .schemafy-tour-buttons {
        width: 100%;
        justify-content: flex-end;
    }
}

/* ================================
   QA FIXES - Meta Tags & UI Improvements
   ================================ */

/* Fix #5.1: Visit Page button styling - prevent overflow */
.schemafy-editor-left-action {
    margin: 16px 0;
}

.schemafy-editor-left-action .schemafy-btn-secondary {
    width: 100%;
    max-width: 100%;
    justify-content: center;
    padding: 10px 16px;
    font-size: 14px;
    box-sizing: border-box;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* Fix #5.2: WordPress Default / SEO Plugin Badge - make it clear it's a label */
.schemafy-seo-plugin-badge-v2 {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 4px 10px;
    background: var(--schemafy-gray-100);
    border: 1px solid var(--schemafy-gray-200);
    border-radius: 6px;
    font-size: 12px;
    color: var(--schemafy-gray-700);
    font-weight: 500;
    cursor: default;
    user-select: none;
}

.schemafy-seo-plugin-badge-v2 .dashicons {
    font-size: 14px;
    width: 14px;
    height: 14px;
    opacity: 0.7;
}

/* Fix #5.3: Reduce excessive spacing in Current SEO Values header */
.schemafy-info-box-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 16px 20px;
    gap: 12px;
    border-bottom: 1px solid var(--schemafy-gray-200);
}

.schemafy-info-box-title {
    display: flex;
    align-items: center;
    gap: 8px;
    flex: 1;
}

.schemafy-info-box-title h4 {
    margin: 0;
    font-size: 15px;
    font-weight: 600;
    color: var(--schemafy-gray-900);
}

.schemafy-info-box-v2 {
    background: white;
    border: var(--schemafy-border);
    border-radius: var(--schemafy-radius);
    margin-bottom: 24px;
}

.schemafy-info-box-content {
    padding: 20px;
}

/* Fix #8: Smart Builder - Prevent duplicate saves */
.schemafy-btn-primary:disabled,
.schemafy-btn-secondary:disabled {
    opacity: 0.5;
    cursor: not-allowed;
    pointer-events: none;
}

.schemafy-btn-primary.schemafy-saving,
.schemafy-btn-secondary.schemafy-saving {
    position: relative;
    color: transparent;
}

.schemafy-btn-primary.schemafy-saving::after,
.schemafy-btn-secondary.schemafy-saving::after {
    content: '';
    position: absolute;
    width: 16px;
    height: 16px;
    top: 50%;
    left: 50%;
    margin-left: -8px;
    margin-top: -8px;
    border: 2px solid #ffffff;
    border-top-color: transparent;
    border-radius: 50%;
    animation: schemafy-button-spin 0.6s linear infinite;
}

@keyframes schemafy-button-spin {
    to { transform: rotate(360deg); }
}

/* Fix: Error state styling for better UX */
.schemafy-error-state {
    text-align: center;
    padding: 60px 20px;
    background: white;
    border-radius: var(--schemafy-radius);
    border: var(--schemafy-border);
}

.schemafy-error-state .dashicons {
    font-size: 64px;
    width: 64px;
    height: 64px;
    color: var(--schemafy-danger);
    opacity: 0.5;
    margin-bottom: 20px;
}

.schemafy-error-state h3 {
    margin: 0 0 12px 0;
    color: var(--schemafy-gray-900);
    font-size: 20px;
}

.schemafy-error-state p {
    margin: 0 0 24px 0;
    color: var(--schemafy-gray-600);
    font-size: 14px;
}

/* Improve empty state for consistency */
.schemafy-builder-placeholder button {
    margin-top: 20px;
}

/* ===== Multi-URL Selector Component ===== */
.schemafy-url-add-row {
    display: flex;
    align-items: center;
    gap: 8px;
}

.schemafy-url-add-row .schemafy-url-select,
.schemafy-url-add-row .schemafy-select-enhanced {
    flex: 1;
    min-width: 150px;
}

.schemafy-url-add-row .schemafy-url-manual,
.schemafy-url-add-row .schemafy-input-enhanced {
    flex: 1;
    min-width: 150px;
}

.schemafy-add-url-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    min-width: 36px;
    padding: 0;
    border: 1px solid var(--schemafy-primary);
    border-radius: 8px;
    background: var(--schemafy-primary);
    color: #fff;
    cursor: pointer;
    font-size: 18px;
    font-weight: 600;
    line-height: 1;
    transition: all 0.15s ease;
}

.schemafy-add-url-btn:hover {
    background: var(--schemafy-primary-hover);
    border-color: var(--schemafy-primary-hover);
    transform: scale(1.05);
}

.schemafy-add-url-btn:active {
    transform: scale(0.97);
}

.schemafy-add-url-btn .dashicons {
    font-size: 18px;
    width: 18px;
    height: 18px;
    line-height: 18px;
}

.schemafy-selected-urls {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin-top: 8px;
    min-height: 0;
    max-height: 108px;
    overflow-y: auto;
    padding: 4px 2px;
    scrollbar-width: thin;
    scrollbar-color: var(--schemafy-gray-300) transparent;
}

.schemafy-selected-urls::-webkit-scrollbar {
    width: 4px;
}

.schemafy-selected-urls::-webkit-scrollbar-track {
    background: transparent;
}

.schemafy-selected-urls::-webkit-scrollbar-thumb {
    background: var(--schemafy-gray-300);
    border-radius: 2px;
}

.schemafy-selected-urls:empty {
    display: none;
}

.schemafy-url-chip {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    max-width: 100%;
    padding: 6px 10px;
    background: var(--schemafy-blue-50);
    border: 1px solid var(--schemafy-blue-200);
    border-radius: 20px;
    font-size: 12px;
    line-height: 1.3;
    color: var(--schemafy-primary-dark);
    animation: schemafyChipIn 0.2s ease;
}

@keyframes schemafyChipIn {
    from {
        opacity: 0;
        transform: scale(0.85);
    }
    to {
        opacity: 1;
        transform: scale(1);
    }
}

.schemafy-url-chip .dashicons {
    font-size: 14px;
    width: 14px;
    height: 14px;
    line-height: 14px;
    color: var(--schemafy-primary);
    flex-shrink: 0;
}

.schemafy-url-chip-text {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    max-width: 200px;
}

.schemafy-chip-remove {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 18px;
    height: 18px;
    min-width: 18px;
    padding: 0;
    border: none;
    border-radius: 50%;
    background: transparent;
    color: var(--schemafy-gray-500);
    cursor: pointer;
    font-size: 16px;
    line-height: 1;
    transition: all 0.15s ease;
    flex-shrink: 0;
}

.schemafy-chip-remove:hover {
    background: var(--schemafy-danger);
    color: #fff;
}

.schemafy-chip-remove .dashicons {
    font-size: 14px;
    width: 14px;
    height: 14px;
    line-height: 14px;
}

/* ============================================================
   LICENSE TIER GATING STYLES
   ============================================================ */

/* Tier badges on sidebar tab buttons */
.schemafy-tier-badge {
    font-size: 9px;
    font-weight: 700;
    padding: 2px 5px;
    border-radius: 3px;
    text-transform: uppercase;
    margin-left: auto;
    flex-shrink: 0;
    letter-spacing: 0.3px;
}
.schemafy-tier-basic { background: var(--schemafy-primary-light); color: #fff; }
.schemafy-tier-mid   { background: #8b5cf6; color: #fff; }
.schemafy-tier-full  { background: var(--schemafy-warning); color: #fff; }

/* Locked tab button */
.schemafy-tab-locked { opacity: 0.5; }
.schemafy-sidebar .schemafy-tab-locked:hover { opacity: 0.75; background: rgba(255,255,255,0.05); }

/* Locked schema type card in Smart Builder */
.schemafy-schema-type-card.schemafy-schema-locked {
    position: relative;
    opacity: 0.52;
    cursor: not-allowed;
}
.schemafy-schema-type-card.schemafy-schema-locked:hover {
    opacity: 0.75;
    transform: none;
    box-shadow: none;
}
.schemafy-lock-overlay {
    position: absolute;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(255, 255, 255, 0.72);
    font-size: 10px;
    font-weight: 700;
    color: var(--schemafy-gray-700);
    border-radius: inherit;
    gap: 3px;
}

/* Locked bulk action button */
.schemafy-tool-btn.schemafy-btn-locked {
    opacity: 0.55;
    cursor: not-allowed;
    pointer-events: none;
}
.schemafy-tool-btn.schemafy-btn-locked:hover {
    opacity: 0.75;
    box-shadow: none;
}
.schemafy-lock-tag {
    display: inline-block;
    font-size: 10px;
    font-weight: 700;
    color: var(--schemafy-gray-500);
    margin-top: 3px;
}

/* ================================
   AUTO GENERATOR TAB
   ================================ */

/* Tab header badge */
.schemafy-autogen-badge {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    background: linear-gradient(135deg, var(--schemafy-primary), var(--schemafy-primary-dark));
    color: white;
    padding: 6px 14px;
    border-radius: 20px;
    font-size: 12px;
    font-weight: 600;
}
.schemafy-autogen-badge .dashicons {
    font-size: 14px;
    width: 14px;
    height: 14px;
}

/* Stats grid (pre-scan summary) */
.schemafy-autogen-stats-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 16px;
    margin-bottom: 24px;
}
.schemafy-autogen-stat-card {
    background: white;
    border-radius: 12px;
    padding: 20px;
    border: 1px solid var(--schemafy-gray-200);
    text-align: center;
}
.schemafy-autogen-stat-value {
    font-size: 28px;
    font-weight: 700;
    color: var(--schemafy-gray-900);
}
.schemafy-autogen-stat-value.value-primary { color: var(--schemafy-primary); }
.schemafy-autogen-stat-value.value-danger  { color: var(--schemafy-danger); }
.schemafy-autogen-stat-value.value-warning { color: var(--schemafy-warning); }
.schemafy-autogen-stat-value.value-success { color: var(--schemafy-success); }
.schemafy-autogen-stat-label {
    font-size: 13px;
    color: var(--schemafy-gray-500);
    margin-top: 4px;
}

/* Scan controls bar */
.schemafy-scan-controls {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 16px;
}
.schemafy-btn-scan {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    background: linear-gradient(135deg, var(--schemafy-primary), var(--schemafy-primary-dark));
    border: none;
    border-radius: var(--schemafy-radius);
    padding: 10px 24px;
    font-size: 14px;
    font-weight: 600;
    color: white;
    cursor: pointer;
    transition: var(--schemafy-transition);
}
.schemafy-btn-scan:hover { opacity: 0.92; }
.schemafy-btn-scan .dashicons { font-size: 18px; width: 18px; height: 18px; }
.schemafy-btn-generate {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    background: linear-gradient(135deg, var(--schemafy-success), var(--schemafy-success-dark));
    border: none;
    border-radius: var(--schemafy-radius);
    padding: 10px 24px;
    font-size: 14px;
    font-weight: 600;
    color: white;
    cursor: pointer;
    transition: var(--schemafy-transition);
}
.schemafy-btn-generate:hover { opacity: 0.92; }
.schemafy-btn-generate .dashicons { font-size: 18px; width: 18px; height: 18px; }
.schemafy-generate-wrapper {
    margin-left: auto;
}
.schemafy-autogen-select {
    border-radius: var(--schemafy-radius);
    padding: 8px 12px;
    border: 1px solid var(--schemafy-gray-300);
    font-size: 13px;
    min-width: 160px;
    background: white;
}

/* Auto Generator Loading */
.schemafy-autogen-loading {
    text-align: center;
    padding: 60px 20px;
}
.schemafy-autogen-loading p {
    color: var(--schemafy-gray-500);
    font-size: 15px;
    margin: 16px 0 0;
}

/* Results Table Header */
.schemafy-autogen-table-header {
    padding: 16px 20px;
    border-bottom: 1px solid var(--schemafy-gray-200);
    display: flex;
    align-items: center;
    justify-content: space-between;
    background: var(--schemafy-gray-50);
}
.schemafy-autogen-table-header label {
    display: flex;
    align-items: center;
    gap: 6px;
    cursor: pointer;
    font-size: 13px;
    color: var(--schemafy-gray-700);
}
.schemafy-autogen-table-header label input[type="checkbox"] {
    width: 16px;
    height: 16px;
}
.schemafy-autogen-selection-count {
    font-size: 13px;
    color: var(--schemafy-gray-500);
}
.schemafy-autogen-table-body {
    max-height: 600px;
    overflow-y: auto;
}

/* Progress Bar */
.schemafy-progress-panel {
    margin-top: 24px;
}
.schemafy-progress-title {
    margin: 0 0 16px 0;
    color: var(--schemafy-gray-900);
    font-size: 15px;
    font-weight: 600;
}
.schemafy-progress-track {
    background: var(--schemafy-gray-200);
    border-radius: 8px;
    height: 12px;
    overflow: hidden;
}
.schemafy-progress-fill {
    background: linear-gradient(135deg, var(--schemafy-primary), var(--schemafy-primary-dark));
    height: 100%;
    width: 0%;
    transition: width 0.3s ease;
    border-radius: 8px;
}
.schemafy-progress-text {
    margin: 12px 0 0 0;
    font-size: 13px;
    color: var(--schemafy-gray-500);
}

/* Generation Success Panel */
.schemafy-generation-success {
    border: 2px solid var(--schemafy-success);
    background: #f0fdf4;
    border-radius: var(--schemafy-radius);
    padding: 24px;
}
.schemafy-generation-success-inner {
    display: flex;
    align-items: flex-start;
    gap: 16px;
}
.schemafy-generation-success-icon {
    color: var(--schemafy-success);
    font-size: 36px;
    width: 36px;
    height: 36px;
    flex-shrink: 0;
}
.schemafy-generation-success-body { flex: 1; }
.schemafy-generation-success-title {
    margin: 0 0 8px 0;
    color: #166534;
    font-size: 16px;
}
.schemafy-generation-success-details {
    font-size: 14px;
    color: var(--schemafy-success-dark);
}
.schemafy-generation-success-actions {
    margin-top: 16px;
    display: flex;
    gap: 12px;
}
.schemafy-btn-view-dashboard {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    background: var(--schemafy-primary);
    color: white;
    border: none;
    border-radius: var(--schemafy-radius-sm);
    padding: 8px 16px;
    font-size: 13px;
    cursor: pointer;
}
.schemafy-btn-scan-again {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    border: 1px solid var(--schemafy-gray-300);
    background: white;
    border-radius: var(--schemafy-radius-sm);
    padding: 8px 16px;
    font-size: 13px;
    cursor: pointer;
}

/* Auto Generator Empty State */
.schemafy-autogen-empty {
    text-align: center;
    padding: 80px 20px;
}
.schemafy-autogen-empty-icon {
    font-size: 64px;
    width: 64px;
    height: 64px;
    line-height: 64px;
    color: #9ea8ee;
    display: block;
    margin: 0 auto 20px;
}
.schemafy-autogen-empty h3 {
    margin: 0 0 8px;
    color: var(--schemafy-gray-800);
    font-size: 18px;
}
.schemafy-autogen-empty p {
    color: var(--schemafy-gray-500);
    max-width: 480px;
    margin: 0 auto 24px;
    line-height: 1.6;
}
.schemafy-autogen-features {
    display: flex;
    justify-content: center;
    gap: 24px;
    flex-wrap: wrap;
    max-width: 600px;
    margin: 0 auto;
}
.schemafy-autogen-feature {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 13px;
    color: var(--schemafy-gray-500);
}
.schemafy-autogen-feature .dashicons { color: var(--schemafy-primary); }

/* ================================
   SHARED UTILS
   ================================ */

/* Inline action rows (save buttons) */
.schemafy-action-row {
    display: flex;
    align-items: center;
    gap: 12px;
    flex-wrap: wrap;
    margin-top: 16px;
}

/* Type distribution chart */
.schemafy-type-distribution {
    margin: 24px;
    padding: 20px;
    background: white;
    border: 1px solid var(--schemafy-gray-200);
    border-radius: 12px;
}
.schemafy-type-distribution-title {
    margin: 0 0 16px;
    font-size: 15px;
    font-weight: 600;
    color: var(--schemafy-gray-800);
    display: flex;
    align-items: center;
    gap: 6px;
}
.schemafy-type-bars {
    display: flex;
    flex-direction: column;
    gap: 12px;
}
.schemafy-results-summary {
    padding: 16px 0 12px;
    font-size: 13px;
    color: var(--schemafy-gray-600);
    display: flex;
    justify-content: space-between;
    align-items: center;
    border-top: 1px solid var(--schemafy-gray-200);
}

/* Compat plugin row */
.schemafy-compat-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 12px 0;
    border-bottom: 1px solid var(--schemafy-gray-200);
}
.schemafy-compat-row p {
    margin: 4px 0 0;
    color: var(--schemafy-gray-500);
    font-size: 12px;
}
.schemafy-compat-row .schemafy-toggle-switch {
    flex-shrink: 0;
    margin-left: 16px;
}

/* ================================
   MICRO UTILITIES (standardization)
   ================================ */

/* Danger variant for secondary buttons */
.schemafy-btn-secondary.schemafy-btn-danger { color: var(--schemafy-danger); }

/* Stat value smaller font (date/time stat) */
.schemafy-stat-value-sm { font-size: 16px !important; letter-spacing: 0 !important; }

/* Inline status message */
.schemafy-status-msg { font-size: 13px; font-weight: 500; }


/* Onboarding nav centered layout */
.schemafy-onboarding-nav { padding: 24px 32px; border-top: none; }
.schemafy-onboarding-buttons-center { width: 100%; justify-content: center; gap: 12px; }

/* Compact search input (card headers) */
.schemafy-search-compact {
    padding: 6px 12px 6px 32px;
    font-size: 13px;
    width: 160px;
    height: 32px;
    background-position: 8px center;
    background-size: 14px 14px;
    min-width: auto;
}

/* Card description paragraph */
.schemafy-card-description {
    color: var(--schemafy-gray-500);
    margin: 0 0 16px;
    font-size: 13px;
}




/* Help text after table */
.schemafy-table-v2 + .schemafy-help-text-v2 { margin-top: 16px; }

/* Empty / no-data state text */
.schemafy-empty-text {
    color: var(--schemafy-gray-400);
    font-style: italic;
    margin: 0;
}

/* WordPress admin notices banner — above the plugin layout */
#schemafy-notices-banner {
    position: sticky;
    top: 32px;
    z-index: 999;
    margin: 0;
}
#schemafy-notices-banner .notice,
#schemafy-notices-banner .updated,
#schemafy-notices-banner .update-nag,
#schemafy-notices-banner .error,
#schemafy-notices-banner .warning {
    margin: 0;
    border-radius: 0;
    border-left-width: 4px;
}

/* URL detail overlay */
.schemafy-url-detail-overlay {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    background: #f0f0f1;
    z-index: 100;
    min-height: 100vh;
}

/* Fix #3: Meta Tags editor two-column layout */
.schemafy-meta-editor-v2 {
    display: grid;
    grid-template-columns: 260px 1fr;
    gap: 24px;
    align-items: start;
    margin-top: 24px;
}

.schemafy-editor-left-panel {
    background: var(--schemafy-gray-50);
    border: var(--schemafy-border);
    border-radius: var(--schemafy-radius);
    overflow: hidden;
    position: sticky;
    top: 32px;
}

.schemafy-editor-left-panel-header {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 14px 16px;
    background: var(--schemafy-primary);
    color: white;
    font-weight: 600;
    font-size: 14px;
}

.schemafy-editor-left-panel-header h4 {
    margin: 0;
    font-size: 14px;
    font-weight: 600;
    color: white;
}

.schemafy-editor-left-panel-body {
    padding: 16px;
}

.schemafy-current-url-display {
    margin-bottom: 16px;
}

.schemafy-current-url-label {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 12px;
    font-weight: 600;
    color: var(--schemafy-gray-500);
    text-transform: uppercase;
    letter-spacing: 0.05em;
    margin-bottom: 6px;
}

.schemafy-current-url-value {
    font-size: 13px;
    color: var(--schemafy-primary);
    word-break: break-all;
    font-family: var(--schemafy-font-mono);
}

.schemafy-editor-left-action {
    margin-bottom: 16px;
}

.schemafy-editor-left-action .schemafy-btn-secondary {
    width: 100%;
    justify-content: center;
    text-align: center;
}

.schemafy-editor-left-divider {
    height: 1px;
    background: var(--schemafy-gray-200);
    margin: 16px 0;
}

.schemafy-editor-left-info-title {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 13px;
    font-weight: 600;
    color: var(--schemafy-gray-700);
    margin-bottom: 6px;
}

.schemafy-editor-left-info-text {
    font-size: 12px;
    color: var(--schemafy-gray-500);
    line-height: 1.5;
    margin: 0;
}

.schemafy-editor-right-panel {
    min-width: 0;
}

.schemafy-meta-value-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 16px;
}

.schemafy-meta-value-item-v2 {}

.schemafy-meta-value-label {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 13px;
    font-weight: 600;
    color: var(--schemafy-gray-700);
    margin-bottom: 6px;
}

.schemafy-meta-value-content-v2 {
    font-size: 13px;
    color: var(--schemafy-gray-900);
    line-height: 1.5;
    min-height: 20px;
}

.schemafy-seo-plugin-badge-v2 {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 4px 10px;
    background: var(--schemafy-gray-100);
    border: var(--schemafy-border);
    border-radius: 20px;
    font-size: 12px;
    color: var(--schemafy-gray-600);
    white-space: nowrap;
}

@media (max-width: 1200px) {
    .schemafy-meta-editor-v2 {
        grid-template-columns: 220px 1fr;
    }
}

@media (max-width: 900px) {
    .schemafy-meta-editor-v2 {
        grid-template-columns: 1fr;
    }
    .schemafy-meta-value-grid {
        grid-template-columns: 1fr;
    }
    .schemafy-editor-left-panel {
        position: static;
    }
}

/* ═══════════════════════════════════════════════════════════════════
   APPLE THEME RECREATION  —  appended last so it wins the cascade.
   Goal: all-light, airy, hairline borders, pill controls, soft badges.
   To revert the visual redesign, delete from this banner to EOF.
   ═══════════════════════════════════════════════════════════════════ */

/* ── 1. Dark chrome → light ──────────────────────────────────────── */
.schemafy-tab-header,
.schemafy-card-header-v2,
.schemafy-builder-sidebar-header,
.schemafy-manual-sidebar-header,
.schemafy-preview-header {
    background: var(--schemafy-white);
    border-bottom: 1px solid var(--schemafy-gray-200);
}

/* header titles + copy: white → near-black / muted */
.schemafy-tab-header-text h2,
.schemafy-card-header-v2 h2,
.schemafy-builder-sidebar-header h3,
.schemafy-manual-sidebar-header h3,
.schemafy-preview-header h3 {
    color: var(--schemafy-gray-900);
}
.schemafy-tab-header-text p {
    color: var(--schemafy-gray-500);
}
.schemafy-card-header-v2 h2 .dashicons {
    color: var(--schemafy-gray-400);
}

/* tab-header icon chip: translucent-white → light gray w/ accent icon */
.schemafy-tab-header-icon {
    background: var(--schemafy-gray-100);
}
.schemafy-tab-header-icon .dashicons {
    color: var(--schemafy-primary);
}

/* tab-header pill badge → light */
.schemafy-tab-header-badge {
    background: var(--schemafy-gray-100);
    color: var(--schemafy-gray-600);
}
.schemafy-tab-header-badge .dashicons {
    color: var(--schemafy-gray-500);
}

/* controls living inside the (now light) headers → light variants */
.schemafy-tab-header .schemafy-btn-secondary,
.schemafy-card-header-v2 .schemafy-btn-secondary,
.schemafy-card-header-v2 .schemafy-search-input-v2,
.schemafy-card-header-v2 .schemafy-select-v2 {
    background: var(--schemafy-white);
    border: 1px solid var(--schemafy-gray-200);
    color: var(--schemafy-gray-700);
}
.schemafy-tab-header .schemafy-btn-secondary:hover,
.schemafy-card-header-v2 .schemafy-btn-secondary:hover {
    background: var(--schemafy-gray-50);
    border-color: var(--schemafy-gray-300);
    color: var(--schemafy-gray-900);
}
.schemafy-tab-header .schemafy-btn-secondary .dashicons {
    color: var(--schemafy-gray-500);
}
.schemafy-card-header-v2 .schemafy-search-input-v2::placeholder {
    color: var(--schemafy-gray-400);
}
.schemafy-card-header-v2 .schemafy-search-input-v2:focus {
    background: var(--schemafy-white);
    border-color: var(--schemafy-primary);
    box-shadow: 0 0 0 3px rgba(79, 110, 245, 0.12);
}

/* preview-header copy button (was styled for dark) → dark-on-light */
.schemafy-preview-header .schemafy-btn-icon {
    background: var(--schemafy-white);
    border: 1px solid var(--schemafy-gray-200);
    color: var(--schemafy-gray-500);
}
.schemafy-preview-header .schemafy-btn-icon:hover {
    background: var(--schemafy-gray-50);
    color: var(--schemafy-primary);
}
.schemafy-preview-header .schemafy-btn-icon .dashicons {
    color: inherit;
}

/* ── 2. Pill controls ────────────────────────────────────────────── */
.schemafy-btn-primary,
.schemafy-btn-secondary {
    border-radius: 980px;
}
.schemafy-btn-primary:hover {
    transform: none;                       /* Apple buttons don't bounce */
    box-shadow: 0 2px 8px rgba(79, 110, 245, 0.22);
}
.schemafy-btn-icon {
    border-radius: var(--schemafy-radius);
}
.schemafy-search-input-v2 {
    border-radius: 980px;
}

/* ── 3. Soft pastel status pills ─────────────────────────────────── */
.schemafy-schema-status {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 3px 10px;
    border-radius: 980px;
    font-size: var(--schemafy-text-xs);
    font-weight: 600;
    line-height: 1.4;
}
.schemafy-schema-status.schemafy-status-active {
    background: var(--schemafy-success-bg);
    color: var(--schemafy-success-dark);
}
.schemafy-schema-status.schemafy-status-inactive {
    background: var(--schemafy-gray-100);
    color: var(--schemafy-gray-500);
}

/* ── 4. Airy, light table ────────────────────────────────────────── */
.schemafy-table-v2 th {
    background: var(--schemafy-white);
    padding: 11px 16px;
    font-size: var(--schemafy-text-xs);
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: var(--schemafy-tracking-wide);
    color: var(--schemafy-gray-400);
    border-bottom: 1px solid var(--schemafy-gray-200);
}
.schemafy-table-v2 td {
    padding: 14px 16px;
    border-bottom: 1px solid var(--schemafy-gray-100);
    color: var(--schemafy-gray-700);
}
.schemafy-table-v2 tbody tr:hover {
    background: var(--schemafy-gray-50);
}

/* ── 5. Cards: hairline + whisper shadow ─────────────────────────── */
.schemafy-card-v2 {
    border: 1px solid var(--schemafy-gray-200);
    box-shadow: var(--schemafy-shadow);
}

/* ── 6. Filter / select controls → rounded, hairline ─────────────── */
.schemafy-select-v2,
.schemafy-filter-search .schemafy-search-input-v2 {
    border-radius: var(--schemafy-radius);
    border: 1px solid var(--schemafy-gray-200);
}

/* ── Premium upgrade teaser (free build shows these in place of tools) ── */
.schemafy-premium-teaser {
    max-width: 520px;
    margin: 48px auto;
    padding: 40px 36px;
    text-align: center;
    background: var(--schemafy-white);
    border: 1px solid var(--schemafy-gray-200);
    border-radius: var(--schemafy-radius-lg);
    box-shadow: var(--schemafy-shadow);
}
.schemafy-premium-teaser-icon {
    font-size: 40px;
    width: 40px;
    height: 40px;
    color: var(--schemafy-primary);
}
.schemafy-premium-teaser-badge {
    display: inline-block;
    margin: 12px 0 0;
    padding: 3px 10px;
    border-radius: 980px;
    background: var(--schemafy-blue-50);
    color: var(--schemafy-primary);
    font-size: var(--schemafy-text-xs);
    font-weight: var(--schemafy-font-semibold);
    text-transform: uppercase;
    letter-spacing: var(--schemafy-tracking-wide);
}
.schemafy-premium-teaser-title {
    margin: 14px 0 6px;
    font-size: var(--schemafy-text-2xl);
    font-weight: var(--schemafy-font-bold);
    color: var(--schemafy-gray-900);
}
.schemafy-premium-teaser-tagline {
    margin: 0 0 20px;
    color: var(--schemafy-gray-600);
    font-size: var(--schemafy-text-md);
    line-height: var(--schemafy-leading-normal);
}
.schemafy-premium-teaser-points {
    display: inline-block;
    text-align: left;
    margin: 0 auto 24px;
    padding: 0;
    list-style: none;
}
.schemafy-premium-teaser-points li {
    display: flex;
    align-items: center;
    gap: 8px;
    margin: 0 0 10px;
    color: var(--schemafy-gray-700);
    font-size: var(--schemafy-text-md);
}
.schemafy-premium-teaser-points .dashicons {
    color: var(--schemafy-success);
    font-size: 18px;
    width: 18px;
    height: 18px;
    flex-shrink: 0;
}
.schemafy-premium-teaser-cta {
    font-size: var(--schemafy-text-lg);
    padding: 11px 22px;
}

/* ── Inline upgrade card (shown where this build ships no tool) ───────── */
.schemafy-upgrade-card {
    margin: 4px 0 0;
    padding: 20px 22px;
    background: var(--schemafy-white);
    border: 1px dashed var(--schemafy-gray-200);
    border-radius: var(--schemafy-radius-lg);
}
.schemafy-upgrade-card-title {
    margin: 0 0 12px;
    font-size: var(--schemafy-text-md);
    font-weight: var(--schemafy-font-semibold);
    color: var(--schemafy-gray-900);
}
.schemafy-upgrade-card-points {
    margin: 0 0 18px;
    padding: 0;
    list-style: none;
}
.schemafy-upgrade-card-points li {
    display: flex;
    align-items: center;
    gap: 8px;
    margin: 0 0 8px;
    color: var(--schemafy-gray-600);
    font-size: var(--schemafy-text-sm);
}
.schemafy-upgrade-card-points .dashicons {
    color: var(--schemafy-success);
    font-size: 16px;
    width: 16px;
    height: 16px;
    flex-shrink: 0;
}
.schemafy-upgrade-link {
    color: var(--schemafy-primary);
    font-weight: var(--schemafy-font-semibold);
}
