/* =============================================================================
   DEISO WP Pro — Global Stylesheet
   -----------------------------------------------------------------------------
   File:        assets/css/deiso-global-style.css
   Purpose:     Single, consolidated source of truth for every visual rule
                used by the DEISO WP Pro plugin. This file replaces
                all previously inline <style> blocks and the legacy
                deiso-banner-style.css partial.

   Sections:
     01  Design tokens (CSS custom properties)
     02  Admin shell scope, reset, and base typography
     03  Admin page header, titles, subtitles
     04  Admin section headings and dividers
     05  Admin cards
     06  Admin form table layout
     07  Admin form fields (inputs, textareas, selects, checkboxes, labels)
     08  Admin code editor surface (CSS / JS boxes)
     09  Admin buttons
     10  Admin notices and inline status messages
     11  Admin endpoint / code blocks
     12  Admin tables (widefat, striped)
     13  Admin dashboard status table & migration note
     14  Admin background image picker
     15  Admin Mirai chat iframe card
     16  Admin reset confirmation messages
     17  Admin responsive rules
     18  Frontend banner
     19  Frontend Footer CTA
     20  Frontend animations & utilities

   Notes:
     - All admin styles are scoped under `.deiso-wp-pro-page` (a class
       added to every DEISO admin <div class="wrap">). This guarantees
       that DEISO styling never leaks into other WordPress admin screens.
     - Frontend selectors use the `.deiso-banner-*` and `.deiso-footer-cta-*`
       prefixes so they coexist safely with any active theme.
     - Brand color is DEISO green (#00A62D) used as a sparing accent
       on top of an enterprise neutral palette.
   ============================================================================= */


/* =============================================================================
   01  DESIGN TOKENS
   -----------------------------------------------------------------------------
   Every color, radius, shadow, spacing, and font choice flows from these
   custom properties. Changing one variable here propagates everywhere.
   ============================================================================= */

:root {
    /* Brand — DEISO green as the primary accent.
       Used for primary buttons, active borders, focus rings, link hovers. */
    --deiso-brand:            #00A62D;
    --deiso-brand-hover:      #00811E;
    --deiso-brand-active:     #006B19;
    --deiso-brand-soft:       #E8F7EC;
    --deiso-brand-soft-2:     #D1EFD8;
    --deiso-brand-ring:       rgba(0, 166, 45, 0.18);

    /* Secondary accent — used on the Mirai header pill button. */
    --deiso-accent:           #094971;
    --deiso-accent-hover:     #073855;

    /* Neutral palette — enterprise gray scale, slightly cool. */
    --deiso-ink:              #0E1B2C;   /* page titles, strong headings */
    --deiso-text:             #2C3A50;   /* body copy */
    --deiso-text-secondary:   #52617A;   /* descriptions, sub-headings */
    --deiso-text-muted:       #8693A8;   /* placeholders, captions */
    --deiso-text-inverse:     #FFFFFF;

    /* Surfaces and lines. */
    --deiso-surface:          #FFFFFF;
    --deiso-surface-alt:      #F8FAFD;
    --deiso-page-bg:          #F4F6FA;
    --deiso-border:           #DDE3EC;
    --deiso-border-strong:    #C5CFDD;
    --deiso-border-subtle:    #EEF2F7;

    /* Status colors. */
    --deiso-success:          #16A34A;
    --deiso-success-soft:     #DCFCE7;
    --deiso-warning:          #D97706;
    --deiso-warning-soft:     #FEF3C7;
    --deiso-danger:           #DC2626;
    --deiso-danger-soft:      #FEE2E2;
    --deiso-info:             #0369A1;
    --deiso-info-soft:        #E0F2FE;

    /* Code editor surface — used by the CSS Box / JS Box textareas. */
    --deiso-code-bg:          #0F172A;
    --deiso-code-bg-2:        #111B30;
    --deiso-code-fg:          #E2E8F0;
    --deiso-code-line:        rgba(255, 255, 255, 0.06);
    --deiso-code-caret:       #6EE7B7;

    /* Typography. */
    --deiso-font:             -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", Arial, sans-serif;
    --deiso-font-mono:        ui-monospace, SFMono-Regular, "JetBrains Mono", "Fira Code", Menlo, Consolas, "Liberation Mono", monospace;

    /* Radii. */
    --deiso-radius-sm:        6px;
    --deiso-radius:           10px;
    --deiso-radius-lg:        14px;
    --deiso-radius-pill:      999px;

    /* Elevation — subtle, layered shadows for an enterprise feel. */
    --deiso-shadow-sm:        0 1px 2px rgba(14, 27, 44, 0.04), 0 1px 1px rgba(14, 27, 44, 0.03);
    --deiso-shadow:           0 1px 3px rgba(14, 27, 44, 0.06), 0 4px 12px rgba(14, 27, 44, 0.05);
    --deiso-shadow-lg:        0 4px 6px rgba(14, 27, 44, 0.04), 0 12px 28px rgba(14, 27, 44, 0.10);
    --deiso-shadow-focus:     0 0 0 4px var(--deiso-brand-ring);

    /* Motion. */
    --deiso-transition:       150ms cubic-bezier(0.4, 0, 0.2, 1);
    --deiso-transition-slow:  240ms cubic-bezier(0.4, 0, 0.2, 1);
}


/* =============================================================================
   02  ADMIN SHELL — SCOPE, RESET, BASE TYPOGRAPHY
   -----------------------------------------------------------------------------
   `.deiso-wp-pro-page` is the wrapper class added to every DEISO admin
   page. All admin styling is scoped under this class so the rules cannot
   leak into other WordPress core or third-party plugin screens.
   ============================================================================= */

/* Adjust the WordPress wrap so it inherits our typography and breathes
   more generously than the WP default. */
.wrap.deiso-wp-pro-page {
    max-width: 1240px;
    margin: 18px 20px 60px 0;
    padding: 4px 0 28px;
    color: var(--deiso-text);
    font-family: var(--deiso-font);
    font-size: 14px;
    line-height: 1.55;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

/* Tone the WP admin page background a touch toward our cool gray. */
body.toplevel_page_deiso-wordpress-pro,
body[class*="page_deiso-wp-pro-"],
body[class*="page_deiso-mirai-ai-pro-"] {
    background: var(--deiso-page-bg);
}

/* Generic prose paragraphs inside any DEISO admin page. */
.deiso-wp-pro-page p {
    color: var(--deiso-text);
    font-size: 14px;
    line-height: 1.6;
}

/* WordPress's `.description` is used for inline help text under fields. */
.deiso-wp-pro-page .description,
.deiso-wp-pro-page p.description {
    color: var(--deiso-text-secondary);
    font-size: 13px;
    line-height: 1.55;
    margin-top: 8px;
    font-style: normal;
}

/* `<code>` snippets such as endpoints and shared secrets. */
.deiso-wp-pro-page code {
    display: inline-block;
    padding: 3px 8px;
    background: var(--deiso-surface-alt);
    border: 1px solid var(--deiso-border-subtle);
    border-radius: var(--deiso-radius-sm);
    color: var(--deiso-ink);
    font-family: var(--deiso-font-mono);
    font-size: 12.5px;
    line-height: 1.4;
    word-break: break-all;
}

/* Inline links are tinted with the brand color. */
.deiso-wp-pro-page a {
    color: var(--deiso-brand);
    text-decoration: none;
    transition: color var(--deiso-transition);
}
.deiso-wp-pro-page a:hover,
.deiso-wp-pro-page a:focus {
    color: var(--deiso-brand-hover);
    text-decoration: underline;
}

/* Universal focus ring — accessibility first. Applies to every focusable
   element inside the DEISO admin pages that does not declare its own. */
.deiso-wp-pro-page :focus-visible {
    outline: none;
    box-shadow: var(--deiso-shadow-focus);
    border-color: var(--deiso-brand) !important;
}


/* =============================================================================
   03  PAGE HEADER — TITLE, SUBTITLE, ACCESS BUTTON
   -----------------------------------------------------------------------------
   The `.deiso-admin-page-header` block hosts the page H1 (title), an
   optional subtitle paragraph, and the right-aligned "Access Mirai"
   button. Used by every Mirai admin page.
   ============================================================================= */

.deiso-wp-pro-page .deiso-admin-page-header {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 20px;
    padding: 24px 28px;
    margin: 0 0 24px;
    background: var(--deiso-surface);
    border: 1px solid var(--deiso-border);
    border-radius: var(--deiso-radius-lg);
    box-shadow: var(--deiso-shadow-sm);
    position: relative;
    overflow: hidden;
}

/* Subtle brand-colored accent bar along the left edge of every page header. */
.deiso-wp-pro-page .deiso-admin-page-header::before {
    content: "";
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    width: 4px;
    background: linear-gradient(180deg, var(--deiso-brand) 0%, #1FB54B 100%);
}

/* Page title — large, tight, ink-colored. */
.deiso-wp-pro-page .deiso-admin-page-header h1,
.deiso-wp-pro-page > h1 {
    font-size: 28px;
    line-height: 1.2;
    font-weight: 700;
    letter-spacing: -0.01em;
    margin: 0 0 8px;
    color: var(--deiso-ink);
    padding: 0;
}

/* Subheading paragraph below the title. */
.deiso-wp-pro-page .deiso-admin-page-subheading {
    font-size: 15px;
    line-height: 1.55;
    color: var(--deiso-text-secondary);
    margin: 0;
    max-width: 780px;
}

/* The right-aligned external "Access Mirai" pill button. */
.deiso-wp-pro-page .deiso-mirai-access-button {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    background: var(--deiso-accent);
    color: var(--deiso-text-inverse) !important;
    text-decoration: none !important;
    padding: 10px 18px;
    border-radius: var(--deiso-radius-pill);
    font-weight: 600;
    font-size: 13.5px;
    line-height: 1;
    white-space: nowrap;
    border: 1px solid transparent;
    box-shadow: var(--deiso-shadow-sm);
    transition: background var(--deiso-transition), transform var(--deiso-transition), box-shadow var(--deiso-transition);
}
.deiso-wp-pro-page .deiso-mirai-access-button:hover,
.deiso-wp-pro-page .deiso-mirai-access-button:focus {
    background: var(--deiso-accent-hover);
    color: var(--deiso-text-inverse) !important;
    text-decoration: none !important;
    transform: translateY(-1px);
    box-shadow: var(--deiso-shadow);
}

/* Append a small chevron arrow indicating an external link. */
.deiso-wp-pro-page .deiso-mirai-access-button::after {
    content: "↗";
    font-size: 13px;
    line-height: 1;
    margin-left: 2px;
}

/* Secondary variant — used for Download Plugin button in header. */
.deiso-wp-pro-page .deiso-mirai-access-button--secondary {
    background: transparent;
    color: var(--deiso-accent) !important;
    border: 1px solid var(--deiso-accent);
    box-shadow: none;
}
.deiso-wp-pro-page .deiso-mirai-access-button--secondary:hover,
.deiso-wp-pro-page .deiso-mirai-access-button--secondary:focus {
    background: var(--deiso-accent);
    color: var(--deiso-text-inverse) !important;
}


/* =============================================================================
   04  SECTION HEADINGS AND DIVIDERS
   -----------------------------------------------------------------------------
   In-page H2-level headings used by render functions to introduce form
   groups (e.g., "Middleware Settings", "API Settings", "CSS Styling").
   ============================================================================= */

/* Plain H2 inside a DEISO admin page (no special class assigned). */
.deiso-wp-pro-page form > h2,
.deiso-wp-pro-page > h2 {
    font-size: 18px;
    line-height: 1.3;
    font-weight: 700;
    color: var(--deiso-ink);
    margin: 28px 0 14px;
    padding: 0 0 10px;
    border-bottom: 1px solid var(--deiso-border-subtle);
}

/* Larger, decorated section heading used by the Code page. */
.deiso-wp-pro-page .deiso-mirai-section-heading {
    font-size: 20px;
    line-height: 1.25;
    font-weight: 700;
    color: var(--deiso-ink);
    margin: 30px 0 6px;
    letter-spacing: -0.005em;
    display: flex;
    align-items: center;
    gap: 10px;
}

/* Decorative dot in front of the section heading for visual rhythm. */
.deiso-wp-pro-page .deiso-mirai-section-heading::before {
    content: "";
    width: 8px;
    height: 8px;
    border-radius: 2px;
    background: var(--deiso-brand);
    flex-shrink: 0;
}

.deiso-wp-pro-page .deiso-mirai-section-subtitle {
    margin: 0 0 20px;
    font-size: 14px;
    line-height: 1.55;
    color: var(--deiso-text-secondary);
    max-width: 780px;
}

/* Hairline divider used between major sections. */
.deiso-wp-pro-page .deiso-mirai-divider,
.deiso-wp-pro-page hr.deiso-mirai-divider,
.deiso-wp-pro-page form > hr {
    border: 0;
    border-top: 1px solid var(--deiso-border-subtle);
    margin: 32px 0;
    height: 0;
}


/* =============================================================================
   05  CARDS
   -----------------------------------------------------------------------------
   `.deiso-mirai-card` is the universal container used to group a single
   logical block (a CSS Box, a JS Box, an export option, the Global CSS
   editor, etc.). Cards stack vertically with consistent margin.
   ============================================================================= */

.deiso-wp-pro-page .deiso-mirai-card {
    background: var(--deiso-surface);
    border: 1px solid var(--deiso-border);
    border-radius: var(--deiso-radius-lg);
    padding: 22px 24px;
    margin: 0 0 18px;
    box-shadow: var(--deiso-shadow-sm);
    transition: box-shadow var(--deiso-transition), border-color var(--deiso-transition);
}

/* Slight lift on hover communicates interactivity for cards that contain
   editable code or controls. */
.deiso-wp-pro-page .deiso-mirai-card:hover {
    box-shadow: var(--deiso-shadow);
    border-color: var(--deiso-border-strong);
}

/* Card heading — slightly smaller than a section H2 because it is nested. */
.deiso-wp-pro-page .deiso-mirai-card h2 {
    margin: 0 0 14px;
    padding: 0 0 12px;
    font-size: 15px;
    line-height: 1.3;
    font-weight: 700;
    color: var(--deiso-ink);
    border-bottom: 1px solid var(--deiso-border-subtle);
    display: flex;
    align-items: center;
    gap: 8px;
}

/* Brand-tinted square in front of card headings to establish a clear
   visual hierarchy between section heading and card heading. */
.deiso-wp-pro-page .deiso-mirai-card h2::before {
    content: "";
    width: 4px;
    height: 16px;
    border-radius: 2px;
    background: var(--deiso-brand);
    flex-shrink: 0;
}

/* Card paragraphs and descriptions sit a touch tighter than page-level prose. */
.deiso-wp-pro-page .deiso-mirai-card p {
    margin: 10px 0;
}
.deiso-wp-pro-page .deiso-mirai-card p:last-child {
    margin-bottom: 0;
}


/* =============================================================================
   06  FORM TABLE LAYOUT
   -----------------------------------------------------------------------------
   WordPress uses `<table class="form-table">` to lay out admin settings.
   Below we restyle this table so it reads as an enterprise label/field
   pair list rather than a 1990s spreadsheet.
   ============================================================================= */

.deiso-wp-pro-page .form-table {
    background: var(--deiso-surface);
    border: 1px solid var(--deiso-border);
    border-radius: var(--deiso-radius-lg);
    box-shadow: var(--deiso-shadow-sm);
    border-collapse: separate;
    border-spacing: 0;
    width: 100%;
    margin: 0 0 24px;
    overflow: hidden;
}

/* Each row is a label/value pair. Hairline border between rows; none on
   the last row to keep the rounded corner clean. */
.deiso-wp-pro-page .form-table tr {
    border-bottom: 1px solid var(--deiso-border-subtle);
}
.deiso-wp-pro-page .form-table tr:last-child {
    border-bottom: 0;
}

.deiso-wp-pro-page .form-table th,
.deiso-wp-pro-page .form-table td {
    padding: 18px 24px;
    vertical-align: top;
    border: 0;
}

/* Labels — fixed width column on the left, ink color, semibold. */
.deiso-wp-pro-page .form-table th {
    width: 260px;
    font-weight: 600;
    font-size: 14px;
    line-height: 1.45;
    color: var(--deiso-ink);
    background: transparent;
    text-align: left;
}

/* Value column — gives breathing room around inputs. */
.deiso-wp-pro-page .form-table td {
    color: var(--deiso-text);
    font-size: 14px;
    line-height: 1.55;
}

/* Some rows contain only `<th colspan="2"><hr></th>` as a visual divider. */
.deiso-wp-pro-page .form-table th[colspan="2"] {
    width: auto;
    padding: 0;
}
.deiso-wp-pro-page .form-table th[colspan="2"] hr {
    border: 0;
    border-top: 1px solid var(--deiso-border-subtle);
    margin: 0;
}


/* =============================================================================
   07  FORM FIELDS — INPUTS, SELECTS, TEXTAREAS, CHECKBOXES, LABELS
   -----------------------------------------------------------------------------
   We restyle every WordPress text input class (`regular-text`,
   `large-text`, `code`) plus checkboxes and selects. All controls share
   the same height rhythm and focus ring for a uniform feel.
   ============================================================================= */

/* Generic text-style inputs (text, email, url, password, number, search). */
.deiso-wp-pro-page input[type="text"],
.deiso-wp-pro-page input[type="email"],
.deiso-wp-pro-page input[type="url"],
.deiso-wp-pro-page input[type="password"],
.deiso-wp-pro-page input[type="number"],
.deiso-wp-pro-page input[type="search"],
.deiso-wp-pro-page input[type="tel"],
.deiso-wp-pro-page input[type="date"],
.deiso-wp-pro-page input[type="datetime-local"] {
    appearance: none;
    -webkit-appearance: none;
    box-sizing: border-box;
    width: 100%;
    max-width: 480px;
    min-height: 42px;
    padding: 10px 14px;
    background: var(--deiso-surface);
    color: var(--deiso-text);
    border: 1px solid var(--deiso-border);
    border-radius: var(--deiso-radius-sm);
    font-family: var(--deiso-font);
    font-size: 14px;
    line-height: 1.4;
    box-shadow: inset 0 1px 0 rgba(14, 27, 44, 0.02);
    transition: border-color var(--deiso-transition), box-shadow var(--deiso-transition), background var(--deiso-transition);
}

/* WordPress provides .regular-text and .large-text utility classes that
   override widths. We honor them but cap at sensible enterprise limits. */
.deiso-wp-pro-page input.regular-text {
    max-width: 480px;
}
.deiso-wp-pro-page input.large-text,
.deiso-wp-pro-page textarea.large-text {
    max-width: 100%;
    width: 100%;
}

/* Hover — reveal a slightly stronger border to signal interactivity. */
.deiso-wp-pro-page input[type="text"]:hover,
.deiso-wp-pro-page input[type="email"]:hover,
.deiso-wp-pro-page input[type="url"]:hover,
.deiso-wp-pro-page input[type="password"]:hover,
.deiso-wp-pro-page input[type="number"]:hover,
.deiso-wp-pro-page input[type="search"]:hover,
.deiso-wp-pro-page input[type="tel"]:hover,
.deiso-wp-pro-page input[type="date"]:hover,
.deiso-wp-pro-page input[type="datetime-local"]:hover,
.deiso-wp-pro-page select:hover,
.deiso-wp-pro-page textarea:hover {
    border-color: var(--deiso-border-strong);
}

/* Focus — accent ring matches the brand color. */
.deiso-wp-pro-page input[type="text"]:focus,
.deiso-wp-pro-page input[type="email"]:focus,
.deiso-wp-pro-page input[type="url"]:focus,
.deiso-wp-pro-page input[type="password"]:focus,
.deiso-wp-pro-page input[type="number"]:focus,
.deiso-wp-pro-page input[type="search"]:focus,
.deiso-wp-pro-page input[type="tel"]:focus,
.deiso-wp-pro-page input[type="date"]:focus,
.deiso-wp-pro-page input[type="datetime-local"]:focus,
.deiso-wp-pro-page select:focus,
.deiso-wp-pro-page textarea:focus {
    outline: none;
    border-color: var(--deiso-brand) !important;
    box-shadow: var(--deiso-shadow-focus);
    background: var(--deiso-surface);
}

/* Placeholder text uses the muted neutral. */
.deiso-wp-pro-page input::placeholder,
.deiso-wp-pro-page textarea::placeholder {
    color: var(--deiso-text-muted);
    opacity: 1;
}

/* Disabled state. */
.deiso-wp-pro-page input:disabled,
.deiso-wp-pro-page textarea:disabled,
.deiso-wp-pro-page select:disabled {
    background: var(--deiso-surface-alt);
    color: var(--deiso-text-muted);
    cursor: not-allowed;
}

/* Inputs flagged with the `code` class (used for URLs, secrets, API keys)
   render in monospace for legibility. */
.deiso-wp-pro-page input.code,
.deiso-wp-pro-page input[type="url"].code {
    font-family: var(--deiso-font-mono);
    font-size: 13px;
    letter-spacing: 0;
}

/* Textareas — same field language as inputs but with a comfortable
   minimum height and natural resizing. */
.deiso-wp-pro-page textarea {
    appearance: none;
    -webkit-appearance: none;
    box-sizing: border-box;
    width: 100%;
    min-height: 96px;
    padding: 12px 14px;
    background: var(--deiso-surface);
    color: var(--deiso-text);
    border: 1px solid var(--deiso-border);
    border-radius: var(--deiso-radius-sm);
    font-family: var(--deiso-font);
    font-size: 14px;
    line-height: 1.55;
    resize: vertical;
    transition: border-color var(--deiso-transition), box-shadow var(--deiso-transition);
}

/* Selects — replace the native chevron with an SVG so the dropdown
   matches the rest of the visual system. */
.deiso-wp-pro-page select {
    appearance: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    box-sizing: border-box;
    min-height: 42px;
    padding: 10px 40px 10px 14px;
    background-color: var(--deiso-surface);
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8' fill='none'%3E%3Cpath d='M1 1.5L6 6.5L11 1.5' stroke='%2352617A' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right 14px center;
    color: var(--deiso-text);
    border: 1px solid var(--deiso-border);
    border-radius: var(--deiso-radius-sm);
    font-family: var(--deiso-font);
    font-size: 14px;
    line-height: 1.4;
    cursor: pointer;
    transition: border-color var(--deiso-transition), box-shadow var(--deiso-transition);
}

/* Native checkboxes — restyle into pill-square brand checkboxes. */
.deiso-wp-pro-page input[type="checkbox"] {
    appearance: none;
    -webkit-appearance: none;
    width: 18px;
    height: 18px;
    margin: 0 8px 0 0;
    padding: 0;
    background: var(--deiso-surface);
    border: 1.5px solid var(--deiso-border-strong);
    border-radius: 4px;
    cursor: pointer;
    position: relative;
    flex-shrink: 0;
    transition: background var(--deiso-transition), border-color var(--deiso-transition), box-shadow var(--deiso-transition);
    vertical-align: middle;
}
.deiso-wp-pro-page input[type="checkbox"]:hover {
    border-color: var(--deiso-brand);
}
.deiso-wp-pro-page input[type="checkbox"]:checked {
    background: var(--deiso-brand);
    border-color: var(--deiso-brand);
}
/* Custom checkmark glyph drawn via a CSS pseudo-element. */
.deiso-wp-pro-page input[type="checkbox"]:checked::after {
    content: "";
    position: absolute;
    top: 2px;
    left: 5px;
    width: 5px;
    height: 9px;
    border: solid #fff;
    border-width: 0 2px 2px 0;
    transform: rotate(45deg);
}
.deiso-wp-pro-page input[type="checkbox"]:focus-visible {
    box-shadow: var(--deiso-shadow-focus);
    border-color: var(--deiso-brand) !important;
}

/* N12 — WordPress core draws its OWN tick on a checked checkbox through
   `input[type=checkbox]:checked::before` (the dashicons \f147 glyph). This
   file has always drawn a second one through ::after above, and nothing
   anywhere in the plugin suppressed core's — so every checked box on every
   plugin page rendered two overlapping checkmarks. Core's glyph is dropped
   here; the ::after tick above stays as the single source. */
.deiso-wp-pro-page input[type="checkbox"]:checked::before,
.deiso-wp-pro-page input[type="radio"]:checked::before {
    content: none !important;
    display: none !important;
}

/* Labels paired with checkboxes — align inline, choose a comfortable size. */
.deiso-wp-pro-page label {
    display: inline-flex;
    align-items: center;
    color: var(--deiso-text);
    font-size: 14px;
    line-height: 1.5;
    cursor: pointer;
}

/* Standalone label headings (such as the "Injection Location" label
   above a select) are rendered as a small, semibold caption. */
.deiso-wp-pro-page .deiso-mirai-card label[for] {
    font-weight: 600;
    color: var(--deiso-ink);
    margin-right: 10px;
}

/* `.deiso-field-row` wraps grouped sub-fields inside a settings cell
   (e.g., the "Text / URL" pairs for Footer CTA buttons). */
.deiso-wp-pro-page p.deiso-field-row {
    margin: 0 0 10px;
    color: var(--deiso-text-secondary);
    font-size: 13px;
    font-weight: 600;
    line-height: 1.45;
}
.deiso-wp-pro-page p.deiso-field-row:last-child {
    margin-bottom: 0;
}
.deiso-wp-pro-page p.deiso-field-row label {
    display: block;
    color: var(--deiso-text-secondary);
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    font-size: 11.5px;
    margin-bottom: 6px;
    cursor: text;
}
.deiso-wp-pro-page p.deiso-field-row label br {
    display: block;
    margin-bottom: 4px;
    content: "";
}
.deiso-wp-pro-page p.deiso-field-row input {
    text-transform: none;
    letter-spacing: 0;
    font-weight: 400;
}

/* `.deiso-bg-actions` sits below the background image preview and groups
   the "Upload" and "Remove" buttons with consistent inline spacing. */
.deiso-wp-pro-page p.deiso-bg-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin: 0;
}

/* File input (used by the Import Settings page). */
.deiso-wp-pro-page input[type="file"] {
    display: block;
    width: 100%;
    max-width: 520px;
    padding: 14px;
    background: var(--deiso-surface-alt);
    border: 1.5px dashed var(--deiso-border-strong);
    border-radius: var(--deiso-radius-sm);
    color: var(--deiso-text);
    font-family: var(--deiso-font);
    font-size: 13.5px;
    cursor: pointer;
    transition: border-color var(--deiso-transition), background var(--deiso-transition);
}
.deiso-wp-pro-page input[type="file"]:hover {
    border-color: var(--deiso-brand);
    background: var(--deiso-brand-soft);
}
.deiso-wp-pro-page input[type="file"]::file-selector-button {
    margin-right: 14px;
    padding: 8px 14px;
    background: var(--deiso-ink);
    color: var(--deiso-text-inverse);
    border: 0;
    border-radius: var(--deiso-radius-sm);
    font-weight: 600;
    font-size: 13px;
    cursor: pointer;
    transition: background var(--deiso-transition);
}
.deiso-wp-pro-page input[type="file"]::file-selector-button:hover {
    background: var(--deiso-brand);
}


/* =============================================================================
   08  CODE EDITOR SURFACE — CSS BOX / JAVASCRIPT BOX TEXTAREAS
   -----------------------------------------------------------------------------
   The Mirai Code page exposes 5 CSS boxes and 5 JavaScript boxes. These
   are textareas with class `large-text code`. We style them as proper
   dark-themed code editor surfaces — rounded, monospaced, with a
   subtle window-chrome top bar and a glowing focus ring.
   ============================================================================= */

.deiso-wp-pro-page textarea.code,
.deiso-wp-pro-page textarea.large-text.code {
    width: 100%;
    min-height: 200px;
    padding: 18px 18px 18px 20px;
    background: var(--deiso-code-bg);
    color: var(--deiso-code-fg);
    border: 1px solid #1E293B;
    border-radius: var(--deiso-radius);
    font-family: var(--deiso-font-mono);
    font-size: 13px;
    line-height: 1.65;
    /* Synthetic line-number gutter via repeating gradient — purely visual. */
    background-image: linear-gradient(180deg, var(--deiso-code-bg-2) 0%, var(--deiso-code-bg) 80px);
    box-shadow: inset 1px 0 0 var(--deiso-code-line);
    caret-color: var(--deiso-code-caret);
    tab-size: 4;
    -moz-tab-size: 4;
    transition: box-shadow var(--deiso-transition), border-color var(--deiso-transition);
}

.deiso-wp-pro-page textarea.code:hover,
.deiso-wp-pro-page textarea.large-text.code:hover {
    border-color: #2A3B57;
}

.deiso-wp-pro-page textarea.code:focus,
.deiso-wp-pro-page textarea.large-text.code:focus {
    outline: none;
    border-color: var(--deiso-brand) !important;
    box-shadow: 0 0 0 4px rgba(0, 166, 45, 0.25), inset 0 0 0 1px var(--deiso-brand);
}

.deiso-wp-pro-page textarea.code::placeholder,
.deiso-wp-pro-page textarea.large-text.code::placeholder {
    color: #64748B;
    font-style: italic;
}

/* Selection inside the code editor is brand-tinted but legible. */
.deiso-wp-pro-page textarea.code::selection,
.deiso-wp-pro-page textarea.large-text.code::selection {
    background: rgba(0, 166, 45, 0.30);
    color: #fff;
}


/* =============================================================================
   09  BUTTONS — PRIMARY, SECONDARY, DESTRUCTIVE
   -----------------------------------------------------------------------------
   Restyles WordPress's `.button`, `.button-primary`, `.button-secondary`
   classes inside the DEISO admin scope. Buttons share a single height,
   radius, and motion language; only color differentiates intent.
   ============================================================================= */

/* Base button (secondary / neutral). */
.deiso-wp-pro-page .button,
.deiso-wp-pro-page button.button,
.deiso-wp-pro-page input[type="submit"].button,
.deiso-wp-pro-page a.button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    height: auto;
    min-height: 40px;
    padding: 10px 18px;
    background: var(--deiso-surface);
    color: var(--deiso-ink) !important;
    border: 1px solid var(--deiso-border-strong);
    border-radius: var(--deiso-radius-sm);
    font-family: var(--deiso-font);
    font-weight: 600;
    font-size: 13.5px;
    line-height: 1.2;
    text-decoration: none;
    cursor: pointer;
    box-shadow: var(--deiso-shadow-sm);
    transition: background var(--deiso-transition), border-color var(--deiso-transition),
                color var(--deiso-transition), transform var(--deiso-transition),
                box-shadow var(--deiso-transition);
    text-shadow: none;
}
.deiso-wp-pro-page .button:hover,
.deiso-wp-pro-page button.button:hover,
.deiso-wp-pro-page input[type="submit"].button:hover,
.deiso-wp-pro-page a.button:hover {
    background: var(--deiso-brand-soft);
    color: var(--deiso-brand-hover) !important;
    border-color: var(--deiso-brand);
    transform: translateY(-1px);
    box-shadow: var(--deiso-shadow);
}
.deiso-wp-pro-page .button:active,
.deiso-wp-pro-page button.button:active {
    transform: translateY(0);
    box-shadow: var(--deiso-shadow-sm);
}
.deiso-wp-pro-page .button:focus-visible,
.deiso-wp-pro-page button.button:focus-visible {
    box-shadow: var(--deiso-shadow-focus);
    border-color: var(--deiso-brand) !important;
}

/* Primary call-to-action — solid brand fill. */
.deiso-wp-pro-page .button-primary,
.deiso-wp-pro-page button.button-primary,
.deiso-wp-pro-page input[type="submit"].button-primary,
.deiso-wp-pro-page a.button-primary {
    background: var(--deiso-brand);
    color: var(--deiso-text-inverse) !important;
    border-color: var(--deiso-brand);
    box-shadow: 0 1px 0 rgba(0, 0, 0, 0.04), 0 4px 10px rgba(0, 166, 45, 0.18);
}
.deiso-wp-pro-page .button-primary:hover,
.deiso-wp-pro-page button.button-primary:hover,
.deiso-wp-pro-page input[type="submit"].button-primary:hover,
.deiso-wp-pro-page a.button-primary:hover {
    background: var(--deiso-brand-hover);
    color: var(--deiso-text-inverse) !important;
    border-color: var(--deiso-brand-hover);
    box-shadow: 0 2px 0 rgba(0, 0, 0, 0.04), 0 8px 18px rgba(0, 166, 45, 0.28);
}
.deiso-wp-pro-page .button-primary:active,
.deiso-wp-pro-page button.button-primary:active {
    background: var(--deiso-brand-active);
    border-color: var(--deiso-brand-active);
}

/* Secondary alias retains the neutral style of the base button. */
.deiso-wp-pro-page .button-secondary {
    /* Inherits from .button. */
}

/* Hard-reset / destructive action. The render functions emit "Hard Reset"
   buttons whose `value` attribute starts with `css:` or `js:` — we use
   that as a styling hook so callers don't need to add a new class. */
.deiso-wp-pro-page button.button[name="deiso_mirai_reset_code_box"],
.deiso-wp-pro-page button.button[value^="css:"],
.deiso-wp-pro-page button.button[value^="js:"] {
    background: var(--deiso-surface);
    color: var(--deiso-danger) !important;
    border-color: var(--deiso-border);
}
.deiso-wp-pro-page button.button[name="deiso_mirai_reset_code_box"]:hover,
.deiso-wp-pro-page button.button[value^="css:"]:hover,
.deiso-wp-pro-page button.button[value^="js:"]:hover {
    background: var(--deiso-danger-soft);
    color: var(--deiso-danger) !important;
    border-color: var(--deiso-danger);
}

/* The `.submit` paragraph wrapper that WordPress places around submit
   buttons by default. */
.deiso-wp-pro-page p.submit {
    margin: 24px 0 0;
    padding: 0;
}


/* =============================================================================
   10  NOTICES AND INLINE STATUS MESSAGES
   -----------------------------------------------------------------------------
   Custom `.deiso-mirai-reset-message` inline status line only.
   WordPress admin notices (.notice) are intentionally NOT restyled here —
   they render as standard WordPress notices so they remain visually separate
   from DEISO WP Pro plugin content, dismissible, and clearly identifiable
   as system-level messages from other plugins.
   ============================================================================= */


/* =============================================================================
   11  ENDPOINT / CODE BLOCKS
   -----------------------------------------------------------------------------
   The Webhooks page prints several endpoint URLs as `<code>` blocks.
   We give those a card-like presentation so they read clearly.
   ============================================================================= */

.deiso-wp-pro-page form > p > code,
.deiso-wp-pro-page p > code {
    display: inline-block;
    margin-top: 4px;
    padding: 6px 12px;
    background: var(--deiso-surface-alt);
    border: 1px solid var(--deiso-border-subtle);
    border-radius: var(--deiso-radius-sm);
    font-family: var(--deiso-font-mono);
    font-size: 12.5px;
    color: var(--deiso-ink);
    word-break: break-all;
    user-select: all;
}

/* "Shared secret:" / "Webhook endpoint:" prose paragraphs become
   subtle labeled rows. */
.deiso-wp-pro-page form > p strong:first-child {
    color: var(--deiso-text-secondary);
    font-weight: 600;
    font-size: 13px;
    text-transform: uppercase;
    letter-spacing: 0.04em;
}


/* =============================================================================
   12  TABLES — widefat & striped
   -----------------------------------------------------------------------------
   Used by the dashboard module status table and by the Mirai Markdown Sync
   recent-conversations table. Restyled to match the form-table card.
   ============================================================================= */

.deiso-wp-pro-page table.widefat {
    background: var(--deiso-surface);
    border: 1px solid var(--deiso-border);
    border-radius: var(--deiso-radius-lg);
    box-shadow: var(--deiso-shadow-sm);
    border-collapse: separate;
    border-spacing: 0;
    overflow: hidden;
    width: 100%;
    font-size: 13.5px;
}

.deiso-wp-pro-page table.widefat thead th {
    background: var(--deiso-surface-alt);
    color: var(--deiso-ink);
    font-weight: 700;
    font-size: 12.5px;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    padding: 14px 18px;
    text-align: left;
    border-bottom: 1px solid var(--deiso-border);
}

.deiso-wp-pro-page table.widefat tbody td {
    padding: 14px 18px;
    border-top: 1px solid var(--deiso-border-subtle);
    color: var(--deiso-text);
    vertical-align: top;
}

/* `.striped` produces the subtle alternating row tint. */
.deiso-wp-pro-page table.widefat.striped tbody tr:nth-child(even) {
    background: var(--deiso-surface-alt);
}

/* Hover row affordance. */
.deiso-wp-pro-page table.widefat tbody tr:hover {
    background: var(--deiso-brand-soft);
}

/* Inline links inside table cells (e.g., "Export Mirai Markdown" buttons). */
.deiso-wp-pro-page table.widefat tbody td a.button {
    margin: 0;
}


/* =============================================================================
   13  DASHBOARD STATUS TABLE & MIGRATION NOTE
   -----------------------------------------------------------------------------
   Hooks specifically targeting the main DEISO WP Pro dashboard page so the
   "Module / Status / Settings" table feels designed rather than raw.
   The dashboard wrap also gets a `.deiso-dashboard-page` modifier class.
   ============================================================================= */

.deiso-wp-pro-page.deiso-dashboard-page > p:first-of-type {
    color: var(--deiso-text-secondary);
    font-size: 14px;
    margin: 0 0 8px;
}
.deiso-wp-pro-page.deiso-dashboard-page > p:first-of-type strong {
    display: inline-block;
    margin-right: 6px;
    padding: 2px 8px;
    background: var(--deiso-brand-soft);
    color: var(--deiso-brand-hover);
    border-radius: var(--deiso-radius-pill);
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 0.02em;
}

.deiso-wp-pro-page.deiso-dashboard-page > p {
    margin: 12px 0;
    color: var(--deiso-text);
}

/* The "Migration Note" H2 inherits the section heading rules above; the
   following paragraph block gets a subtle info-card treatment. */
.deiso-wp-pro-page.deiso-dashboard-page .deiso-migration-note {
    background: var(--deiso-info-soft);
    border: 1px solid #BAE6FD;
    border-left: 4px solid var(--deiso-info);
    border-radius: var(--deiso-radius);
    padding: 18px 22px;
    margin: 8px 0 0;
}
.deiso-wp-pro-page.deiso-dashboard-page .deiso-migration-note p {
    margin: 0 0 8px;
    color: var(--deiso-ink);
}
.deiso-wp-pro-page.deiso-dashboard-page .deiso-migration-note p:last-child {
    margin-bottom: 0;
}


/* =============================================================================
   14  BACKGROUND IMAGE PICKER (Footer CTA settings page)
   -----------------------------------------------------------------------------
   Two adjacent buttons ("Upload / Select Image", "Remove") plus a
   preview image. We give the preview a framed thumbnail look.
   ============================================================================= */

.deiso-wp-pro-page #deiso_bg_preview {
    margin: 0 0 12px;
}
.deiso-wp-pro-page #deiso_bg_preview img {
    display: block;
    max-width: 420px;
    height: auto;
    padding: 6px;
    background: var(--deiso-surface);
    border: 1px solid var(--deiso-border);
    border-radius: var(--deiso-radius-sm);
    box-shadow: var(--deiso-shadow-sm);
}
.deiso-wp-pro-page #deiso_bg_preview em {
    display: inline-block;
    padding: 14px 18px;
    background: var(--deiso-surface-alt);
    border: 1px dashed var(--deiso-border-strong);
    border-radius: var(--deiso-radius-sm);
    color: var(--deiso-text-muted);
    font-style: normal;
    font-size: 13px;
}


/* =============================================================================
   15  MIRAI CHAT IFRAME CARD
   -----------------------------------------------------------------------------
   The "Chat with Mirai" admin page embeds an iframe. We frame it with
   a tall card and give the iframe a clean white surface to render on.
   ============================================================================= */

.deiso-wp-pro-page .deiso-mirai-chat-admin-card {
    background: var(--deiso-surface);
    border: 1px solid var(--deiso-border);
    border-radius: var(--deiso-radius-lg);
    box-shadow: var(--deiso-shadow);
    overflow: hidden;
    min-height: 720px;
    position: relative;
    padding: 0;
}

.deiso-wp-pro-page .deiso-mirai-chat-iframe {
    display: block;
    width: 100%;
    height: 720px;
    min-height: 660px;
    border: 0;
    background: var(--deiso-surface);
}


/* =============================================================================
   16  RESET CONFIRMATION MESSAGES (Code page)
   -----------------------------------------------------------------------------
   After a "Hard Reset CSS Box N" or "Hard Reset JavaScript Box N"
   submit, the render function prints a small status line. We turn that
   into a colored badge.
   ============================================================================= */

.deiso-wp-pro-page .deiso-mirai-reset-message {
    margin: 12px 0 0;
    font-weight: 600;
    font-size: 13px;
}

.deiso-wp-pro-page .deiso-mirai-reset-success {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 4px 10px;
    background: var(--deiso-success-soft);
    color: var(--deiso-success);
    border: 1px solid #86EFAC;
    border-radius: var(--deiso-radius-pill);
}
.deiso-wp-pro-page .deiso-mirai-reset-success::before {
    content: "✓";
    font-weight: 700;
}

.deiso-wp-pro-page .deiso-mirai-reset-error {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 4px 10px;
    background: var(--deiso-danger-soft);
    color: var(--deiso-danger);
    border: 1px solid #FCA5A5;
    border-radius: var(--deiso-radius-pill);
}
.deiso-wp-pro-page .deiso-mirai-reset-error::before {
    content: "✕";
    font-weight: 700;
}


/* =============================================================================
   17  RESPONSIVE RULES (Admin)
   -----------------------------------------------------------------------------
   Below ~960px the form-table label column collapses above the field,
   buttons stack, and the page header switches to a vertical layout.
   ============================================================================= */

@media (max-width: 1100px) {
    .wrap.deiso-wp-pro-page {
        max-width: 100%;
        margin-right: 12px;
    }
    .deiso-wp-pro-page .form-table th {
        width: 220px;
    }
}

@media (max-width: 960px) {
    .deiso-wp-pro-page .deiso-admin-page-header {
        flex-direction: column;
        align-items: stretch;
        gap: 14px;
        padding: 20px 22px;
    }
    .deiso-wp-pro-page .deiso-mirai-access-button {
        align-self: flex-start;
    }
    .deiso-wp-pro-page .deiso-admin-page-header h1,
    .deiso-wp-pro-page > h1 {
        font-size: 24px;
    }
    .deiso-wp-pro-page .form-table th,
    .deiso-wp-pro-page .form-table td {
        display: block;
        width: 100%;
        padding: 14px 18px;
    }
    .deiso-wp-pro-page .form-table th {
        padding-bottom: 4px;
    }
    .deiso-wp-pro-page .form-table tr {
        border-bottom: 1px solid var(--deiso-border-subtle);
    }
}

@media (max-width: 600px) {
    .deiso-wp-pro-page .deiso-mirai-card {
        padding: 18px 16px;
    }
    .deiso-wp-pro-page input[type="text"],
    .deiso-wp-pro-page input[type="email"],
    .deiso-wp-pro-page input[type="url"],
    .deiso-wp-pro-page input[type="password"],
    .deiso-wp-pro-page input[type="number"] {
        max-width: 100%;
    }
    .deiso-wp-pro-page .button,
    .deiso-wp-pro-page .button-primary {
        width: 100%;
        justify-content: center;
    }
}


/* =============================================================================
   18  FRONTEND BANNER
   -----------------------------------------------------------------------------
   Top-of-page promotional banner. Renders on every public page when
   enabled. Uses brand gradient, large rounded close button, smooth
   close animation, optional countdown.
   ============================================================================= */

.deiso-banner-wrapper {
    /* Use a multi-stop brand gradient with a soft sheen overlay. */
    position: relative;
    z-index: 9999;
    display: block;
    box-sizing: border-box;
    padding: 22px 28px 22px 80px;
    background: linear-gradient(135deg, #0E1B2C 0%, #112A52 55%, #0B5C32 100%);
    color: #FFFFFF;
    font-family: var(--deiso-font, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif);
    font-size: 15.5px;
    line-height: 1.55;
    text-align: center;
    box-shadow: 0 6px 18px rgba(0, 0, 0, 0.08);

    /* Smoothly fade out when `.closed` is added by JS. */
    transition: opacity 0.4s ease, visibility 0.4s ease, transform 0.4s ease;
    opacity: 1;
    visibility: visible;
}

/* Subtle decorative diagonal gloss across the banner. */
.deiso-banner-wrapper::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(120deg, rgba(255, 255, 255, 0.08) 0%, rgba(255, 255, 255, 0) 40%, rgba(0, 166, 45, 0.10) 100%);
    pointer-events: none;
}

/* Inner banner text wrapper. */
.deiso-banner-wrapper .deiso-banner-message {
    position: relative;
    z-index: 1;
    margin: 0 auto 14px;
    max-width: 980px;
    color: #FFFFFF;
}
.deiso-banner-wrapper .deiso-banner-message :is(p, span, strong, em) {
    color: inherit;
}
.deiso-banner-wrapper .deiso-banner-message a {
    color: #BCF7CC;
    text-decoration: underline;
    text-underline-offset: 2px;
}
.deiso-banner-wrapper .deiso-banner-message a:hover {
    color: #FFFFFF;
}

/* Primary CTA button inside the banner. */
.deiso-banner-cta {
    position: relative;
    z-index: 1;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    margin-top: 6px;
    padding: 12px 22px;
    background: var(--deiso-brand, #00A62D) !important;
    color: #FFFFFF !important;
    border: 1px solid var(--deiso-brand, #00A62D);
    border-radius: 8px;
    font-weight: 700;
    font-size: 14.5px;
    line-height: 1;
    text-decoration: none !important;
    cursor: pointer;
    box-shadow: 0 6px 14px rgba(0, 166, 45, 0.30);
    transition: background 0.18s ease, transform 0.18s ease, box-shadow 0.18s ease;
}
.deiso-banner-cta:hover {
    background: #00811E !important;
    color: #FFFFFF !important;
    transform: translateY(-1px);
    box-shadow: 0 10px 20px rgba(0, 166, 45, 0.40);
}
.deiso-banner-cta:focus-visible {
    outline: none;
    box-shadow: 0 0 0 4px rgba(255, 255, 255, 0.40), 0 6px 14px rgba(0, 166, 45, 0.30);
}

/* Optional sales-block HTML rendered below the CTA. */
.deiso-banner-sales-block {
    position: relative;
    z-index: 1;
    margin-top: 14px;
    color: rgba(255, 255, 255, 0.86);
    font-size: 14px;
}

/* Countdown line ("Offer ends in: 3d : 4h : 22m : 18s"). */
.deiso-banner-countdown {
    position: relative;
    z-index: 1;
    margin-top: 12px;
    font-weight: 700;
    font-size: 14.5px;
    color: #FFFFFF;
    letter-spacing: 0.02em;
}
.deiso-banner-countdown span {
    display: inline-block;
    margin-left: 6px;
    padding: 2px 10px;
    background: rgba(255, 255, 255, 0.12);
    border: 1px solid rgba(255, 255, 255, 0.18);
    border-radius: 999px;
    font-family: var(--deiso-font-mono, monospace);
    font-size: 13px;
}

/* Round close button anchored to the left edge. */
.deiso-banner-close {
    position: absolute;
    top: 50%;
    left: 22px;
    transform: translateY(-50%);
    z-index: 2;

    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 38px;
    height: 38px;
    padding: 0;

    background: #FFFFFF !important;
    color: #0E1B2C !important;
    border: 1px solid rgba(255, 255, 255, 0.85);
    border-radius: 999px;
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.18);

    font-size: 22px;
    font-weight: 700;
    line-height: 1;
    cursor: pointer;
    transition: transform 0.2s ease, background 0.2s ease, box-shadow 0.2s ease;
}
.deiso-banner-close:hover {
    background: #F2F4F8 !important;
    transform: translateY(-50%) scale(1.08);
    box-shadow: 0 6px 14px rgba(0, 0, 0, 0.22);
}
.deiso-banner-close:focus-visible {
    outline: none;
    box-shadow: 0 0 0 4px rgba(0, 166, 45, 0.45);
}

/* Closed state — the JS adds `.closed` and the row collapses gracefully. */
.deiso-banner-wrapper.closed {
    opacity: 0;
    visibility: hidden;
    height: 0 !important;
    padding: 0 !important;
    margin: 0 !important;
    overflow: hidden !important;
    transform: translateY(-12px);
}

/* Banner — small screens. */
@media (max-width: 768px) {
    .deiso-banner-wrapper {
        padding: 18px 20px 18px 64px;
        font-size: 14.5px;
    }
    .deiso-banner-close {
        left: 14px;
        width: 34px;
        height: 34px;
        font-size: 20px;
    }
    .deiso-banner-cta {
        padding: 11px 18px;
        font-size: 14px;
    }
}


/* =============================================================================
   19  FRONTEND FOOTER CTA — v5.6.11 REBRAND
   -----------------------------------------------------------------------------
   v5.6.11: Bottom margin is now driven by CSS custom properties emitted by
   the render function, sourced from two new admin settings fields:
     --deiso-cta-bottom-desktop  (admin field "Bottom Spacing — Desktop")
     --deiso-cta-bottom-mobile   (admin field "Bottom Spacing — Mobile")
   Defaults: 100px desktop, 70px mobile. Range: 0–300 (clamped on save).

   v5.9.0: Three additional spacing controls and a brand-color fix.
   - Top margin now driven by:
       --deiso-cta-top-desktop   (admin field "Top Spacing — Desktop")
       --deiso-cta-top-mobile    (admin field "Top Spacing — Mobile")
     Defaults: 30px desktop, 24px mobile. Range: 0–300.
   - Outer side gutter now driven by:
       --deiso-cta-side-desktop  (admin field "Side Spacing — Desktop")
       --deiso-cta-side-mobile   (admin field "Side Spacing — Mobile")
     Defaults: 24px desktop, 18px mobile. Ranges: 0–80 / 0–60.
     This fixes the v5.8.x mobile bug where the CTA card visually broke
     out of horizontal alignment with the page content above it because
     the outer wrap had no side padding while the content blocks above
     used 18px gutter.
   - PRIMARY button (.deiso-footer-cta__btn--outline) color migrated
     from charcoal #1a1a1a fill to locked Tier 1 teal #006675 fill so
     it matches every other primary CTA across the DEISO site.

   Full-width footer call-to-action block injected above the theme footer.
   Supports an optional left "announcement" block plus a main right-side
   title + subtitle + two buttons.

   v5.6.8: Full visual rebrand to align with the new DEISO identity system
   ("Sustainability Operating Systems"). White card design language with
   sage→teal gradient bar, charcoal headings, body gray text.

   v5.6.9: Two defensive fixes on top of the v5.6.8 rebrand:
   - Bottom margin raised from 12px → 60px so the Footer CTA has proper
     breathing room above the theme footer.
   - Explicit z-index isolation: every element inside `.deiso-footer-cta`
     is capped at z-index ≤ 10 so the WordPress admin bar (z-index 99999)
     can never be overlaid by accidental stacking-context bleed.

   Locked design tokens (DEISO Rebrand v5.6.8+):
   - Charcoal       #1a1a1a   (headings, primary button fill)
   - Body gray      #475569   (body text)
   - Teal           #008194   (hover accents, button hover, eyebrow text)
   - Darker teal    #006675   (eyebrow text)
   - Sage           #63976B   (gradient start)
   - Teal-mid       #2D8B8A   (gradient mid)
   - Locked gradient: linear-gradient(90deg, #63976B 0%, #2D8B8A 50%, #008194 100%)
   ============================================================================= */

/* Defensive z-index isolation — guarantees the WP admin bar stays clickable. */
.deiso-footer-cta,
.deiso-footer-cta * {
    z-index: auto;
}

.deiso-footer-cta {
    width: 100%;
    margin: 0;
    /* v5.9.0 — Symmetric side gutter so the CTA aligns with every other
       locked content block on the DEISO site (24px desktop / 18px mobile).
       Sourced from admin field "Side Spacing — Desktop/Mobile". */
    padding: 0 var(--deiso-cta-side-desktop, 24px);
    box-sizing: border-box;
    font-family: 'Jost', sans-serif;
}

.deiso-footer-cta *,
.deiso-footer-cta *::before,
.deiso-footer-cta *::after {
    box-sizing: border-box;
    font-family: 'Jost', sans-serif;
}

.deiso-footer-cta__wrap {
    position: relative;
    z-index: 1;
    width: 100%;
    max-width: 1200px;
    margin: var(--deiso-cta-top-desktop, 30px) auto var(--deiso-cta-bottom-desktop, 100px) auto;
    box-sizing: border-box;
    display: grid;
    grid-template-columns: 1fr 1fr;
    align-items: center;
    gap: 40px;
    padding: 38px 32px;

    background: #ffffff;
    background-image: var(--deiso-cta-bg-image, none);
    background-position: var(--deiso-cta-bg-pos, center center);
    background-size: var(--deiso-cta-bg-size, cover);
    background-repeat: no-repeat;

    border: 1px solid rgba(26, 26, 26, 0.10);
    border-radius: 22px;
    box-shadow: 0 14px 34px rgba(26, 26, 26, 0.08),
                0 4px 10px rgba(26, 26, 26, 0.04);
    overflow: hidden;
}

/* v5.7.0 — Dynamic column layout. The wrap reflows based on which side
   blocks are enabled, set as modifier classes by PHP:
     --solo            → centre column only
     --has-left        → left + centre (existing 1fr 1fr behaviour)
     --has-right       → centre + right
     --has-left & --has-right → three columns, centre widest */
.deiso-footer-cta__wrap--solo {
    grid-template-columns: minmax(0, 720px);
    justify-content: center;
}
.deiso-footer-cta__wrap--has-right:not(.deiso-footer-cta__wrap--has-left) {
    grid-template-columns: 1fr 1fr;
}
.deiso-footer-cta__wrap--has-left.deiso-footer-cta__wrap--has-right {
    grid-template-columns: 1fr 1.2fr 1fr;
}

/* Sage → teal gradient top bar (locked rebrand gradient). */
.deiso-footer-cta__wrap::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 6px;
    background: linear-gradient(90deg, #63976B 0%, #2D8B8A 50%, #008194 100%);
    z-index: 1;
}

/* Both content columns sit above the gradient bar. */
.deiso-footer-cta__left,
.deiso-footer-cta__content {
    position: relative;
    z-index: 2;
    color: #1a1a1a;
}

/* Left "announcement" column. */
.deiso-footer-cta__left {
    text-align: left;
}

.deiso-footer-cta__left-title {
    margin: 0 0 12px 0;
    font-size: 26px;
    line-height: 1.22;
    font-weight: 700;
    letter-spacing: -0.2px;
    color: #1a1a1a;
}

.deiso-footer-cta__left-text {
    margin: 0 0 22px 0;
    font-size: 16px;
    line-height: 1.55;
    color: #475569;
    max-width: 100%;
}

.deiso-footer-cta__left-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
}

/* v5.7.0 — Right announcement column. Mirrors the left block visually so
   left and right blocks read as a symmetric pair when both are enabled. */
.deiso-footer-cta__right {
    position: relative;
    z-index: 2;
    color: #1a1a1a;
    text-align: left;
}

.deiso-footer-cta__right-title {
    margin: 0 0 12px 0;
    font-size: 26px;
    line-height: 1.22;
    font-weight: 700;
    letter-spacing: -0.2px;
    color: #1a1a1a;
}

.deiso-footer-cta__right-text {
    margin: 0 0 22px 0;
    font-size: 16px;
    line-height: 1.55;
    color: #475569;
    max-width: 100%;
}

.deiso-footer-cta__right-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
}

/* Right main CTA column. */
.deiso-footer-cta__content {
    text-align: left;
}

.deiso-footer-cta h2.deiso-footer-cta__title {
    margin: 0 0 12px 0;
    font-size: 26px !important;
    line-height: 1.22;
    font-weight: 700;
    letter-spacing: -0.2px;
    color: #1a1a1a !important;
}

.deiso-footer-cta p.deiso-footer-cta__subtitle {
    margin: 0 0 22px 0 !important;
    font-size: 16px !important;
    line-height: 1.55 !important;
    color: #475569 !important;
    max-width: 100% !important;
}

.deiso-footer-cta__buttons {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
}

/* Footer CTA button — base. */
.deiso-footer-cta__btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    height: 48px;
    padding: 0 22px;
    border-radius: 12px;
    font-size: 14px;
    font-weight: 600;
    line-height: 1;
    white-space: nowrap;
    text-decoration: none !important;
    transition: background-color 0.22s ease,
                color 0.22s ease,
                border-color 0.22s ease,
                box-shadow 0.22s ease,
                transform 0.22s ease;
}

/* Outline variant — used as PRIMARY button slot in this layout.
   v5.9.0 — Locked Tier 1 colors: teal #006675 fill, white text →
   hover white fill, teal text, teal border. Matches every other
   Tier 1 CTA across the DEISO site (was charcoal #1a1a1a in v5.8.x). */
.deiso-footer-cta__btn--outline {
    background: #006675 !important;
    color: #ffffff !important;
    border: 1px solid #006675 !important;
    box-shadow: 0 8px 18px rgba(0, 102, 117, 0.22);
}

.deiso-footer-cta__btn--outline:hover,
.deiso-footer-cta__btn--outline:focus,
.deiso-footer-cta__btn--outline:active {
    background: #ffffff !important;
    color: #006675 !important;
    border-color: #006675 !important;
    box-shadow: 0 10px 22px rgba(0, 102, 117, 0.20);
    transform: translateY(-1px);
}

/* Solid variant — used as SECONDARY (outlined) button slot in this layout.
   Rest: white fill, charcoal text, charcoal-tinted border.
   Hover: white fill stays, teal text, teal border. */
.deiso-footer-cta__btn--solid {
    background: #ffffff !important;
    color: #1a1a1a !important;
    border: 1px solid rgba(26, 26, 26, 0.20) !important;
    box-shadow: none !important;
}

.deiso-footer-cta__btn--solid:hover,
.deiso-footer-cta__btn--solid:focus,
.deiso-footer-cta__btn--solid:active {
    background: #ffffff !important;
    color: #008194 !important;
    border-color: #008194 !important;
}

.deiso-footer-cta__btn:focus-visible {
    outline: none;
    box-shadow: 0 0 0 3px rgba(0, 129, 148, 0.30),
                0 6px 14px rgba(0, 129, 148, 0.20);
}

/* Footer CTA — responsive collapses. */
@media (max-width: 1100px) {
    .deiso-footer-cta__wrap {
        gap: 30px;
        padding: 34px 28px;
    }

    .deiso-footer-cta__left-title,
    .deiso-footer-cta__right-title,
    .deiso-footer-cta h2.deiso-footer-cta__title {
        font-size: 24px !important;
    }

    .deiso-footer-cta__left-text,
    .deiso-footer-cta__right-text,
    .deiso-footer-cta p.deiso-footer-cta__subtitle {
        font-size: 15.5px !important;
    }

    .deiso-footer-cta__btn {
        font-size: 14px;
        height: 46px;
        padding: 0 20px;
    }
}

@media (max-width: 800px) {
    /* v5.9.0 — Switch outer side padding to mobile value (default 18px),
       matching every other locked content block on the site at this breakpoint. */
    .deiso-footer-cta {
        padding: 0 var(--deiso-cta-side-mobile, 18px);
    }

    .deiso-footer-cta__wrap,
    .deiso-footer-cta__wrap--solo,
    .deiso-footer-cta__wrap--has-left,
    .deiso-footer-cta__wrap--has-right,
    .deiso-footer-cta__wrap--has-left.deiso-footer-cta__wrap--has-right {
        grid-template-columns: 1fr;
        gap: 28px;
        margin: var(--deiso-cta-top-mobile, 24px) auto var(--deiso-cta-bottom-mobile, 70px) auto;
        padding: 30px 22px;
        border-radius: 18px;
    }

    .deiso-footer-cta__left,
    .deiso-footer-cta__right,
    .deiso-footer-cta__content {
        max-width: 100%;
    }

    .deiso-footer-cta__buttons,
    .deiso-footer-cta__left-actions,
    .deiso-footer-cta__right-actions {
        width: 100%;
        flex-direction: column;
        gap: 12px;
    }

    .deiso-footer-cta__btn {
        width: 100%;
        flex: 1 1 100%;
    }

    .deiso-footer-cta__left-title,
    .deiso-footer-cta__right-title,
    .deiso-footer-cta h2.deiso-footer-cta__title {
        font-size: 22px !important;
        line-height: 1.22 !important;
    }

    .deiso-footer-cta__left-text,
    .deiso-footer-cta__right-text,
    .deiso-footer-cta p.deiso-footer-cta__subtitle {
        font-size: 15px !important;
        line-height: 1.55 !important;
    }
}


/* =============================================================================
   20  ANIMATIONS & UTILITIES
   -----------------------------------------------------------------------------
   Small reusable utilities and motion primitives.
   ============================================================================= */

/* Visually hide but keep accessible (screen readers). */
.deiso-sr-only {
    position: absolute !important;
    width: 1px; height: 1px;
    padding: 0; margin: -1px;
    overflow: hidden; clip: rect(0, 0, 0, 0);
    white-space: nowrap; border: 0;
}

/* Respect users who prefer reduced motion — disable hover transforms. */
@media (prefers-reduced-motion: reduce) {
    .deiso-wp-pro-page *,
    .deiso-banner-wrapper,
    .deiso-banner-cta,
    .deiso-banner-close,
    .deiso-footer-cta__btn {
        transition: none !important;
        animation: none !important;
    }
    .deiso-wp-pro-page .button:hover,
    .deiso-wp-pro-page .button-primary:hover,
    .deiso-banner-cta:hover,
    .deiso-banner-close:hover,
    .deiso-footer-cta__btn--outline:hover,
    .deiso-footer-cta__btn--solid:hover {
        transform: none !important;
    }
}

/* === End of file =========================================================== */


/* =============================================================================
   21  v1.2.1 ENTERPRISE ADMIN HEADER STANDARD
   -----------------------------------------------------------------------------
   All current and future DEISO WP Pro admin pages should use the shared header
   renderer and the two-line title model:
   Line 1: Page name + functional label.
   Line 2: (DEISO WP Pro Plugin vX.X.X - Developed by DEISO), with the version
           pulled from the main plugin file constant.
   ============================================================================= */

.wrap.deiso-wp-pro-page .deiso-admin-page-header.deiso-admin-page-header--two-line {
    align-items: flex-start;
    padding: 24px 30px 26px;
    gap: 24px;
}

.wrap.deiso-wp-pro-page .deiso-admin-page-header-main {
    display: block;
    flex: 1 1 auto;
    min-width: 0;
}

.wrap.deiso-wp-pro-page .deiso-admin-logo-row {
    display: flex;
    align-items: center;
    margin: 0 0 18px;
    padding: 0;
}

.wrap.deiso-wp-pro-page .deiso-admin-logo-row a {
    display: inline-flex;
    align-items: center;
    max-width: 250px;
    line-height: 0;
    text-decoration: none !important;
}

.wrap.deiso-wp-pro-page .deiso-admin-page-logo {
    display: block;
    width: auto;
    max-width: 250px;
    max-height: 90px;
    height: auto;
    object-fit: contain;
}

.wrap.deiso-wp-pro-page .deiso-admin-title-block {
    max-width: 980px;
}

.wrap.deiso-wp-pro-page .deiso-admin-page-header h1,
.wrap.deiso-wp-pro-page > h1 {
    color: #053755 !important;
    font-size: 22px;
    line-height: 1.25;
    font-weight: 700;
    letter-spacing: -0.005em;
    margin: 0 0 10px;
    padding: 0;
}

.wrap.deiso-wp-pro-page .deiso-admin-page-header h1 .deiso-admin-title-main,
.wrap.deiso-wp-pro-page .deiso-admin-page-header h1 .deiso-admin-title-meta {
    display: block;
    color: #053755 !important;
    font-weight: 700;
}

.wrap.deiso-wp-pro-page .deiso-admin-page-header h1 .deiso-admin-title-main {
    font-size: 22px;
    line-height: 1.24;
}

.wrap.deiso-wp-pro-page .deiso-admin-page-header h1 .deiso-admin-title-meta {
    margin-top: 4px;
    font-size: 17px;
    line-height: 1.32;
}

.wrap.deiso-wp-pro-page .deiso-admin-page-subheading {
    color: var(--deiso-text-secondary);
    font-size: 17px;
    line-height: 1.55;
    margin: 0;
    max-width: 940px;
}

@media (max-width: 960px) {
    .wrap.deiso-wp-pro-page .deiso-admin-page-header.deiso-admin-page-header--two-line {
        flex-direction: column;
        padding: 22px 22px 24px;
    }

    .wrap.deiso-wp-pro-page .deiso-admin-page-logo {
        max-width: 220px;
        max-height: 82px;
    }

    .wrap.deiso-wp-pro-page .deiso-admin-page-header h1 .deiso-admin-title-main {
        font-size: 21px;
    }

    .wrap.deiso-wp-pro-page .deiso-admin-page-header h1 .deiso-admin-title-meta {
        font-size: 16px;
    }

    .wrap.deiso-wp-pro-page .deiso-admin-page-subheading {
        font-size: 16px;
    }
}

@media (max-width: 600px) {
    .wrap.deiso-wp-pro-page .deiso-admin-page-header.deiso-admin-page-header--two-line {
        padding: 20px 18px 22px;
    }

    .wrap.deiso-wp-pro-page .deiso-admin-page-logo {
        max-width: 190px;
        max-height: 76px;
    }

    .wrap.deiso-wp-pro-page .deiso-admin-page-header h1 .deiso-admin-title-main {
        font-size: 19px;
    }

    .wrap.deiso-wp-pro-page .deiso-admin-page-header h1 .deiso-admin-title-meta {
        font-size: 14.5px;
    }

    .wrap.deiso-wp-pro-page .deiso-admin-page-subheading {
        font-size: 15px;
    }
}

/* v1.2.1: DEISO symbol in the WordPress left admin menu. */
#adminmenu .toplevel_page_deiso-wordpress-pro .wp-menu-image img {
    width: 20px !important;
    height: 20px !important;
    object-fit: contain !important;
    padding: 6px 0 0 !important;
    opacity: 0.95 !important;
}

#adminmenu .toplevel_page_deiso-wordpress-pro:hover .wp-menu-image img,
#adminmenu .toplevel_page_deiso-wordpress-pro.wp-has-current-submenu .wp-menu-image img {
    opacity: 1 !important;
}

/* =============================================================================
   22  v1.5.0 DASHBOARD, MENU, LOGS, AND MODULE STANDARD
   -----------------------------------------------------------------------------
   DEISO WP Pro v1.5.0 dashboard, logs, and WordPress admin sidebar corrections.
   ============================================================================= */

.deiso-wp-pro-page.deiso-dashboard-page .deiso-version-label {
    margin: 0 0 14px !important;
    color: var(--deiso-text-secondary) !important;
}
.deiso-wp-pro-page.deiso-dashboard-page .deiso-version-label strong {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 8px 20px !important;
    background: var(--deiso-brand-soft) !important;
    color: var(--deiso-brand-hover) !important;
    border: 1px solid var(--deiso-brand-soft-2) !important;
    border-radius: var(--deiso-radius-pill) !important;
    font-size: 30px !important;
    line-height: 1.05 !important;
    font-weight: 800 !important;
    letter-spacing: -0.02em !important;
}

.deiso-wp-pro-page .deiso-dashboard-green-button,
.deiso-wp-pro-page a.deiso-dashboard-green-button {
    background: var(--deiso-brand) !important;
    color: var(--deiso-text-inverse) !important;
    border-color: var(--deiso-brand) !important;
    box-shadow: 0 1px 0 rgba(0, 0, 0, 0.04), 0 4px 10px rgba(0, 166, 45, 0.18) !important;
}
.deiso-wp-pro-page .deiso-dashboard-green-button:hover,
.deiso-wp-pro-page a.deiso-dashboard-green-button:hover {
    background: var(--deiso-brand-hover) !important;
    color: var(--deiso-text-inverse) !important;
    border-color: var(--deiso-brand-hover) !important;
    box-shadow: 0 2px 0 rgba(0, 0, 0, 0.04), 0 8px 18px rgba(0, 166, 45, 0.28) !important;
}

.deiso-wp-pro-page.deiso-dashboard-page .deiso-about-deiso {
    background: var(--deiso-surface) !important;
    border: 1px solid var(--deiso-border) !important;
    border-left: 4px solid var(--deiso-brand) !important;
    border-radius: var(--deiso-radius) !important;
    box-shadow: var(--deiso-shadow-sm) !important;
    padding: 18px 22px !important;
    margin: 8px 0 0 !important;
}
.deiso-wp-pro-page.deiso-dashboard-page .deiso-about-deiso p {
    margin: 0 0 14px !important;
    color: var(--deiso-ink) !important;
    font-size: 15px !important;
    line-height: 1.7 !important;
}
.deiso-wp-pro-page.deiso-dashboard-page .deiso-about-deiso p:last-child {
    margin-bottom: 0 !important;
}
.deiso-wp-pro-page.deiso-dashboard-page .deiso-dashboard-visit-button {
    min-width: 128px !important;
}

#adminmenu .toplevel_page_deiso-wordpress-pro .wp-menu-image,
#adminmenu .toplevel_page_deiso-wordpress-pro div.wp-menu-image {
    display: none !important;
    width: 0 !important;
    min-width: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
}
#adminmenu .toplevel_page_deiso-wordpress-pro .wp-menu-name,
#adminmenu .toplevel_page_deiso-wordpress-pro:hover .wp-menu-name,
#adminmenu .toplevel_page_deiso-wordpress-pro.wp-has-current-submenu .wp-menu-name,
#adminmenu .toplevel_page_deiso-wordpress-pro.current .wp-menu-name,
#adminmenu .toplevel_page_deiso-wordpress-pro.wp-menu-open .wp-menu-name {
    color: #ffffff !important;
    font-weight: 700 !important;
    padding-left: 12px !important;
}

/* =============================================================================
   v1.5.0 FOOTER CTA TYPOGRAPHY MIGRATION — SUPERSEDED BY v5.6.8 REBRAND
   -----------------------------------------------------------------------------
   The v1.5.0 typography overrides for the Footer CTA have been fully absorbed
   into the consolidated v5.6.8 rebrand block in Section 19 above. This stub
   is intentionally empty and preserved as a migration marker only.
   ============================================================================= */


/* =============================================================================
   v1.5.0 LOGS + MARKDOWN ACTIONS UI
   ============================================================================= */
.deiso-mirai-actions-bar {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    align-items: center;
    margin: 14px 0 18px;
}
.deiso-mirai-actions-bar form {
    margin: 0;
}
.deiso-wp-pro-danger-button,
.deiso-wp-pro-danger-button:hover,
.deiso-wp-pro-danger-button:focus {
    border-color: #b32d2e !important;
    background: #b32d2e !important;
    color: #ffffff !important;
}
.deiso-logs-table td,
.deiso-logs-table th {
    vertical-align: top;
}
.deiso-log-type-success {
    color: #00a42d;
    font-weight: 700;
}
.deiso-log-type-error {
    color: #b32d2e;
    font-weight: 700;
}
.deiso-log-type-warning {
    color: #996800;
    font-weight: 700;
}
.deiso-log-type-info {
    color: #053755;
    font-weight: 700;
}
/* =============================================================================
   v1.5.0 ADMIN SIDEBAR, DANGER BUTTON, AND LOGO UPLOAD FIXES
   ============================================================================= */
#adminmenu li.toplevel_page_deiso-wordpress-pro,
#adminmenu li.toplevel_page_deiso-wordpress-pro.menu-top {
    background: transparent !important;
}

#adminmenu li.toplevel_page_deiso-wordpress-pro .wp-menu-image,
#adminmenu li.toplevel_page_deiso-wordpress-pro div.wp-menu-image {
    display: none !important;
    width: 0 !important;
    min-width: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
}

#adminmenu li.toplevel_page_deiso-wordpress-pro > a.menu-top,
#adminmenu li.toplevel_page_deiso-wordpress-pro > a.menu-top:link,
#adminmenu li.toplevel_page_deiso-wordpress-pro > a.menu-top:visited {
    background: transparent !important;
    color: #ffffff !important;
    font-weight: 700 !important;
    box-shadow: none !important;
}

#adminmenu li.toplevel_page_deiso-wordpress-pro > a.menu-top .wp-menu-name,
#adminmenu li.toplevel_page_deiso-wordpress-pro > a.menu-top:link .wp-menu-name,
#adminmenu li.toplevel_page_deiso-wordpress-pro > a.menu-top:visited .wp-menu-name,
.folded #adminmenu li.toplevel_page_deiso-wordpress-pro > a.menu-top .wp-menu-name {
    color: #ffffff !important;
    font-weight: 700 !important;
    padding-left: 12px !important;
}

#adminmenu li.toplevel_page_deiso-wordpress-pro:hover,
#adminmenu li.toplevel_page_deiso-wordpress-pro:focus-within,
#adminmenu li.toplevel_page_deiso-wordpress-pro.current,
#adminmenu li.toplevel_page_deiso-wordpress-pro.wp-has-current-submenu,
#adminmenu li.toplevel_page_deiso-wordpress-pro.wp-menu-open {
    background: #ffffff !important;
}

#adminmenu li.toplevel_page_deiso-wordpress-pro:hover > a.menu-top,
#adminmenu li.toplevel_page_deiso-wordpress-pro > a.menu-top:hover,
#adminmenu li.toplevel_page_deiso-wordpress-pro > a.menu-top:focus,
#adminmenu li.toplevel_page_deiso-wordpress-pro > a.menu-top:active,
#adminmenu li.toplevel_page_deiso-wordpress-pro.current > a.menu-top,
#adminmenu li.toplevel_page_deiso-wordpress-pro.current > a.menu-top:hover,
#adminmenu li.toplevel_page_deiso-wordpress-pro.wp-has-current-submenu > a.wp-has-current-submenu,
#adminmenu li.toplevel_page_deiso-wordpress-pro.wp-has-current-submenu > a.wp-has-current-submenu:hover,
#adminmenu li.toplevel_page_deiso-wordpress-pro.wp-has-current-submenu > a.wp-has-current-submenu:focus,
#adminmenu li.toplevel_page_deiso-wordpress-pro.wp-menu-open > a.menu-top,
.folded #adminmenu li.toplevel_page_deiso-wordpress-pro:hover > a.menu-top,
.folded #adminmenu li.toplevel_page_deiso-wordpress-pro.current > a.menu-top,
.folded #adminmenu li.toplevel_page_deiso-wordpress-pro.wp-has-current-submenu > a.wp-has-current-submenu {
    background: #ffffff !important;
    color: #ffffff !important;
    font-weight: 700 !important;
    box-shadow: none !important;
}

#adminmenu li.toplevel_page_deiso-wordpress-pro:hover > a.menu-top .wp-menu-name,
#adminmenu li.toplevel_page_deiso-wordpress-pro > a.menu-top:hover .wp-menu-name,
#adminmenu li.toplevel_page_deiso-wordpress-pro > a.menu-top:focus .wp-menu-name,
#adminmenu li.toplevel_page_deiso-wordpress-pro > a.menu-top:active .wp-menu-name,
#adminmenu li.toplevel_page_deiso-wordpress-pro.current > a.menu-top .wp-menu-name,
#adminmenu li.toplevel_page_deiso-wordpress-pro.wp-has-current-submenu > a.wp-has-current-submenu .wp-menu-name,
#adminmenu li.toplevel_page_deiso-wordpress-pro.wp-menu-open > a.menu-top .wp-menu-name {
    color: #ffffff !important;
    font-weight: 700 !important;
}

#adminmenu li.toplevel_page_deiso-wordpress-pro.wp-has-current-submenu > a.wp-has-current-submenu:after,
#adminmenu li.toplevel_page_deiso-wordpress-pro.current > a.menu-top:after {
    border-right-color: #ffffff !important;
}

.wrap.deiso-wp-pro-page button.deiso-wp-pro-danger-button,
.wrap.deiso-wp-pro-page button.deiso-wp-pro-danger-button:hover,
.wrap.deiso-wp-pro-page button.deiso-wp-pro-danger-button:focus,
.wrap.deiso-wp-pro-page button.deiso-wp-pro-danger-button:active,
.wrap.deiso-wp-pro-page a.deiso-wp-pro-danger-button,
.wrap.deiso-wp-pro-page a.deiso-wp-pro-danger-button:link,
.wrap.deiso-wp-pro-page a.deiso-wp-pro-danger-button:visited,
.wrap.deiso-wp-pro-page a.deiso-wp-pro-danger-button:hover,
.wrap.deiso-wp-pro-page a.deiso-wp-pro-danger-button:focus,
.wrap.deiso-wp-pro-page a.deiso-wp-pro-danger-button:active,
.deiso-mirai-actions-bar button.deiso-wp-pro-danger-button,
.deiso-mirai-actions-bar button.deiso-wp-pro-danger-button:hover,
.deiso-mirai-actions-bar button.deiso-wp-pro-danger-button:focus,
.deiso-mirai-actions-bar button.deiso-wp-pro-danger-button:active {
    background: #b32d2e !important;
    border-color: #b32d2e !important;
    color: #ffffff !important;
    text-decoration: none !important;
    box-shadow: none !important;
}

.wrap.deiso-wp-pro-page button.deiso-wp-pro-danger-button *,
.wrap.deiso-wp-pro-page a.deiso-wp-pro-danger-button * {
    color: #ffffff !important;
}

.wrap.deiso-wp-pro-page .deiso-plugin-logo-setting {
    display: block !important;
    max-width: 520px !important;
}

.wrap.deiso-wp-pro-page .deiso-plugin-logo-preview-wrap {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 14px 16px !important;
    margin: 0 0 12px !important;
    background: #ffffff !important;
    border: 1px solid var(--deiso-border) !important;
    border-radius: 14px !important;
    box-shadow: var(--deiso-shadow-xs) !important;
}

.wrap.deiso-wp-pro-page .deiso-plugin-logo-preview {
    display: block !important;
    width: auto !important;
    max-width: 250px !important;
    max-height: 96px !important;
    height: auto !important;
    object-fit: contain !important;
}

.wrap.deiso-wp-pro-page .deiso-plugin-logo-actions {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 8px !important;
    margin: 0 0 8px !important;
}

/* =============================================================================
   v1.5.0 MODULE CONTROLS
   ============================================================================= */
.wrap.deiso-wp-pro-page .deiso-settings-section-title {
    margin: 24px 0 8px !important;
    color: #053755 !important;
    font-size: 20px !important;
    font-weight: 800 !important;
}

.wrap.deiso-wp-pro-page .deiso-module-controls-table {
    background: #ffffff !important;
    border: 1px solid var(--deiso-border) !important;
    border-radius: 16px !important;
    box-shadow: var(--deiso-shadow-xs) !important;
    padding: 8px 14px !important;
}

.wrap.deiso-wp-pro-page .deiso-wp-pro-toggle-control {
    display: inline-flex !important;
    align-items: center !important;
    gap: 12px !important;
    cursor: pointer !important;
    user-select: none !important;
}

.wrap.deiso-wp-pro-page .deiso-wp-pro-toggle-control input {
    position: absolute !important;
    opacity: 0 !important;
    width: 1px !important;
    height: 1px !important;
}

.wrap.deiso-wp-pro-page .deiso-wp-pro-toggle-slider {
    position: relative !important;
    width: 52px !important;
    height: 28px !important;
    border-radius: 999px !important;
    background: #b7c3c9 !important;
    transition: background .18s ease, box-shadow .18s ease !important;
    box-shadow: inset 0 0 0 1px rgba(5,55,85,.12) !important;
}

.wrap.deiso-wp-pro-page .deiso-wp-pro-toggle-slider::before {
    content: "" !important;
    position: absolute !important;
    top: 4px !important;
    left: 4px !important;
    width: 20px !important;
    height: 20px !important;
    border-radius: 50% !important;
    background: #ffffff !important;
    box-shadow: 0 2px 8px rgba(5,55,85,.2) !important;
    transition: transform .18s ease !important;
}

.wrap.deiso-wp-pro-page .deiso-wp-pro-toggle-control input:checked + .deiso-wp-pro-toggle-slider {
    background: #00a42d !important;
}

.wrap.deiso-wp-pro-page .deiso-wp-pro-toggle-control input:checked + .deiso-wp-pro-toggle-slider::before {
    transform: translateX(24px) !important;
}

.wrap.deiso-wp-pro-page .deiso-wp-pro-toggle-control input:focus + .deiso-wp-pro-toggle-slider {
    box-shadow: 0 0 0 3px rgba(0,164,45,.18), inset 0 0 0 1px rgba(5,55,85,.12) !important;
}

.wrap.deiso-wp-pro-page .deiso-wp-pro-toggle-text {
    color: #053755 !important;
    font-weight: 700 !important;
    /* v2.1.5: Hide any hardcoded inner text ("Disabled", "Enabled", or
       inverted phrasing). The actual state label is rendered via the
       ::before pseudo-element below so it dynamically reflects the
       checkbox state instead of lying about it. */
    font-size: 0 !important;
    line-height: 1.4 !important;
}

/* v2.1.5: Dynamic toggle state label.
   Default (checkbox not checked) → shows "Disabled" in muted gray.
   Checked state → shows "Enabled" in DEISO green via the input:checked
   sibling selector below. Replaces the static hardcoded text that was
   inconsistent across plugin sections (Module Controls hardcoded
   "Enabled", Notification Management hardcoded "Disabled", etc.). */
.wrap.deiso-wp-pro-page .deiso-wp-pro-toggle-text::before {
    content: "Disabled" !important;
    display: inline-block !important;
    font-size: 14px !important;
    font-weight: 700 !important;
    color: #6b7c8a !important;
    line-height: 1.4 !important;
    letter-spacing: 0.2px !important;
}

.wrap.deiso-wp-pro-page .deiso-wp-pro-toggle-control input:checked ~ .deiso-wp-pro-toggle-text::before {
    content: "Enabled" !important;
    color: #00a42d !important;
}

/* v2.1.6: Subsection grouping inside WordPress Tweaking table.
   Visually separates DEISO Branding Defaults / Admin Bar Adjustments /
   Custom CSS Module Behavior subsections so the section scales as
   more toggles are added without losing readability. */
.wrap.deiso-wp-pro-page .deiso-tweak-subsection-row {
    background: transparent !important;
}
.wrap.deiso-wp-pro-page .deiso-tweak-subsection-row th {
    padding: 24px 0 6px !important;
    border-top: 1px solid #e0e6ed !important;
}
.wrap.deiso-wp-pro-page .deiso-tweak-subsection-row:first-child th {
    border-top: none !important;
    padding-top: 8px !important;
}
.wrap.deiso-wp-pro-page .deiso-tweak-subsection-title {
    color: #275d7e !important;
    font-size: 15px !important;
    font-weight: 700 !important;
    margin: 0 0 4px !important;
    padding: 0 !important;
    letter-spacing: 0.2px !important;
    text-transform: uppercase !important;
}
.wrap.deiso-wp-pro-page .deiso-tweak-subsection-row .description {
    color: #6b7c8a !important;
    margin: 0 !important;
    font-size: 13px !important;
}
/* =============================================================================
   22  LINK MANAGER & DASHBOARD LINK ACCESS
   -----------------------------------------------------------------------------
   Daily-use admin link manager and favorite-link dashboard block.
   ============================================================================= */

.deiso-wp-pro-page .deiso-link-manager-grid {
    display: grid;
    grid-template-columns: minmax(220px, 1.2fr) minmax(180px, 0.9fr) minmax(160px, 0.6fr);
    gap: 14px 18px;
    align-items: start;
}
.deiso-wp-pro-page .deiso-link-manager-grid p {
    margin: 0;
}
.deiso-wp-pro-page .deiso-link-manager-grid p:nth-child(4) {
    grid-column: 1 / span 2;
}
.deiso-wp-pro-page .deiso-link-manager-plus {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 24px;
    height: 24px;
    border-radius: 999px;
    background: var(--deiso-brand);
    color: var(--deiso-text-inverse);
    font-weight: 800;
    line-height: 1;
}
.deiso-wp-pro-page .deiso-link-manager-toolbar {
    background: var(--deiso-surface);
    border: 1px solid var(--deiso-border);
    border-radius: var(--deiso-radius);
    box-shadow: var(--deiso-shadow-sm);
    padding: 12px 16px;
    margin: 0 0 14px;
    display: flex;
    gap: 16px;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
}
.deiso-wp-pro-page .deiso-link-manager-controls {
    display: inline-flex;
    align-items: center;
    gap: 14px;
    flex-wrap: wrap;
    justify-content: flex-end;
}
.deiso-wp-pro-page .deiso-link-manager-group-filter {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    color: var(--deiso-ink);
    font-weight: 700;
}
.deiso-wp-pro-page .deiso-link-manager-group-filter select {
    min-width: 150px;
    border-color: var(--deiso-border-strong);
    border-radius: var(--deiso-radius-sm);
}
.deiso-wp-pro-page .deiso-link-manager-sort-links a {
    color: var(--deiso-brand-hover);
    font-weight: 700;
    text-decoration: none;
}
.deiso-wp-pro-page .deiso-link-manager-sort-links a:hover {
    color: var(--deiso-brand-active);
    text-decoration: underline;
}
.deiso-wp-pro-page .deiso-link-manager-table-wrap {
    max-height: 560px;
    overflow: auto;
    border: 1px solid var(--deiso-border);
    border-radius: var(--deiso-radius-lg);
    background: var(--deiso-surface);
    box-shadow: var(--deiso-shadow-sm);
}
.deiso-wp-pro-page .deiso-link-manager-table-wrap::-webkit-scrollbar,
.deiso-wp-pro-page .deiso-link-access-scroll::-webkit-scrollbar {
    width: 10px;
    height: 10px;
}
.deiso-wp-pro-page .deiso-link-manager-table-wrap::-webkit-scrollbar-track,
.deiso-wp-pro-page .deiso-link-access-scroll::-webkit-scrollbar-track {
    background: var(--deiso-surface-alt);
    border-radius: 999px;
}
.deiso-wp-pro-page .deiso-link-manager-table-wrap::-webkit-scrollbar-thumb,
.deiso-wp-pro-page .deiso-link-access-scroll::-webkit-scrollbar-thumb {
    background: var(--deiso-border-strong);
    border-radius: 999px;
    border: 2px solid var(--deiso-surface-alt);
}
.deiso-wp-pro-page .deiso-link-manager-table-wrap::-webkit-scrollbar-thumb:hover,
.deiso-wp-pro-page .deiso-link-access-scroll::-webkit-scrollbar-thumb:hover {
    background: var(--deiso-brand);
}
.deiso-wp-pro-page .deiso-link-manager-table th,
.deiso-wp-pro-page .deiso-link-access-table th {
    position: sticky;
    top: 0;
    z-index: 2;
    background: var(--deiso-surface-alt) !important;
}
.deiso-wp-pro-page .deiso-link-manager-table input[type="text"],
.deiso-wp-pro-page .deiso-link-manager-table input[type="url"],
.deiso-wp-pro-page .deiso-link-manager-table textarea,
.deiso-wp-pro-page .deiso-link-manager-table select {
    width: 100%;
    min-width: 140px;
}
.deiso-wp-pro-page .deiso-link-url-input {
    min-width: 280px !important;
}
.deiso-wp-pro-page .deiso-link-favorite {
    color: var(--deiso-brand-hover);
    font-size: 18px;
    font-weight: 800;
}
.deiso-wp-pro-page .deiso-link-access-block {
    background: var(--deiso-surface);
    border: 1px solid var(--deiso-border);
    border-left: 4px solid var(--deiso-brand);
    border-radius: var(--deiso-radius-lg);
    box-shadow: var(--deiso-shadow-sm);
    padding: 18px 22px 20px;
    margin: 20px 0 22px;
}
.deiso-wp-pro-page .deiso-link-access-block h2 {
    margin-top: 0;
    margin-bottom: 6px;
}
.deiso-wp-pro-page .deiso-link-access-subtitle {
    margin: 0 0 14px;
    color: var(--deiso-text-secondary);
}
.deiso-wp-pro-page .deiso-link-access-scroll {
    max-height: 260px;
    overflow: auto;
    border: 1px solid var(--deiso-border-subtle);
    border-radius: var(--deiso-radius);
}
.deiso-wp-pro-page .deiso-link-access-url {
    display: inline-block;
    max-width: 100%;
    color: var(--deiso-brand-hover);
    font-weight: 700;
    text-decoration: none;
    word-break: break-all;
}
.deiso-wp-pro-page .deiso-link-access-url:hover {
    color: var(--deiso-brand-active);
    text-decoration: underline;
}
.deiso-wp-pro-page .deiso-mirai-events-table code {
    color: var(--deiso-ink);
    background: var(--deiso-surface-alt);
    border: 1px solid var(--deiso-border-subtle);
    border-radius: var(--deiso-radius-sm);
    padding: 3px 6px;
}

@media (max-width: 960px) {
    .deiso-wp-pro-page .deiso-link-manager-grid {
        grid-template-columns: 1fr;
    }
    .deiso-wp-pro-page .deiso-link-manager-grid p:nth-child(4) {
        grid-column: auto;
    }
    .deiso-wp-pro-page .deiso-link-manager-toolbar,
    .deiso-wp-pro-page .deiso-link-manager-controls {
        align-items: flex-start;
        flex-direction: column;
        justify-content: flex-start;
    }
    .deiso-wp-pro-page .deiso-link-manager-table-wrap,
    .deiso-wp-pro-page .deiso-link-access-scroll {
        overflow-x: auto;
    }
}

/* Link Manager v2.0.0 Patch 2 — URL field/open control cleanup */
.deiso-wp-pro-page .deiso-link-url-control {
    display: flex;
    align-items: stretch;
    gap: 8px;
    min-width: 360px;
}
.deiso-wp-pro-page .deiso-link-url-control .deiso-link-url-input {
    flex: 1 1 auto;
    min-width: 260px !important;
}
.deiso-wp-pro-page .deiso-link-open-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 58px;
    padding: 0 12px;
    border: 1px solid var(--deiso-brand);
    border-radius: var(--deiso-radius-sm);
    background: var(--deiso-brand);
    color: #fff !important;
    font-weight: 700;
    line-height: 1;
    text-decoration: none !important;
    box-shadow: 0 6px 14px rgba(0, 166, 45, 0.16);
}
.deiso-wp-pro-page .deiso-link-open-button:hover,
.deiso-wp-pro-page .deiso-link-open-button:focus {
    background: var(--deiso-brand-hover);
    border-color: var(--deiso-brand-hover);
    color: #fff !important;
    text-decoration: none !important;
}
@media (max-width: 782px) {
    .deiso-wp-pro-page .deiso-link-url-control {
        min-width: 260px;
    }
}


/* DEISO WP Pro v2.0.0 Patch 4 — Dashboard Link Access filter + parent menu visibility */
.deiso-wp-pro-page .deiso-link-access-header {
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:16px;
    margin-bottom:14px;
}
.deiso-wp-pro-page .deiso-link-access-header h2 {
    margin:0 0 6px;
}
.deiso-wp-pro-page .deiso-link-access-filter {
    display:flex;
    align-items:center;
    gap:8px;
    flex:0 0 auto;
}
.deiso-wp-pro-page .deiso-link-access-filter label {
    color:var(--deiso-ink);
    font-weight:700;
}
.deiso-wp-pro-page .deiso-link-access-filter select {
    min-width:180px;
    border:1px solid var(--deiso-border);
    border-radius:var(--deiso-radius-sm);
    background:var(--deiso-surface);
    color:var(--deiso-ink);
    font-weight:600;
}
body.wp-admin #adminmenu li.toplevel_page_deiso-wordpress-pro,
body.wp-admin #adminmenu li.toplevel_page_deiso-wordpress-pro.menu-top,
body.wp-admin #adminmenu li.toplevel_page_deiso-wordpress-pro:hover,
body.wp-admin #adminmenu li.toplevel_page_deiso-wordpress-pro:focus-within,
body.wp-admin #adminmenu li.toplevel_page_deiso-wordpress-pro.current,
body.wp-admin #adminmenu li.toplevel_page_deiso-wordpress-pro.wp-has-current-submenu,
body.wp-admin #adminmenu li.toplevel_page_deiso-wordpress-pro.wp-menu-open {
    background:#0a1929 !important;
}
body.wp-admin #adminmenu li.toplevel_page_deiso-wordpress-pro > a.menu-top,
body.wp-admin #adminmenu li.toplevel_page_deiso-wordpress-pro > a.menu-top:link,
body.wp-admin #adminmenu li.toplevel_page_deiso-wordpress-pro > a.menu-top:visited,
body.wp-admin #adminmenu li.toplevel_page_deiso-wordpress-pro:hover > a.menu-top,
body.wp-admin #adminmenu li.toplevel_page_deiso-wordpress-pro > a.menu-top:hover,
body.wp-admin #adminmenu li.toplevel_page_deiso-wordpress-pro > a.menu-top:focus,
body.wp-admin #adminmenu li.toplevel_page_deiso-wordpress-pro > a.menu-top:active,
body.wp-admin #adminmenu li.toplevel_page_deiso-wordpress-pro.current > a.menu-top,
body.wp-admin #adminmenu li.toplevel_page_deiso-wordpress-pro.wp-has-current-submenu > a.wp-has-current-submenu,
body.wp-admin #adminmenu li.toplevel_page_deiso-wordpress-pro.wp-menu-open > a.menu-top {
    background:#0a1929 !important;
    color:#ffffff !important;
    box-shadow:none !important;
}
body.wp-admin #adminmenu li.toplevel_page_deiso-wordpress-pro > a.menu-top .wp-menu-name,
body.wp-admin #adminmenu li.toplevel_page_deiso-wordpress-pro:hover > a.menu-top .wp-menu-name,
body.wp-admin #adminmenu li.toplevel_page_deiso-wordpress-pro > a.menu-top:hover .wp-menu-name,
body.wp-admin #adminmenu li.toplevel_page_deiso-wordpress-pro > a.menu-top:focus .wp-menu-name,
body.wp-admin #adminmenu li.toplevel_page_deiso-wordpress-pro.current > a.menu-top .wp-menu-name,
body.wp-admin #adminmenu li.toplevel_page_deiso-wordpress-pro.wp-has-current-submenu > a.wp-has-current-submenu .wp-menu-name,
body.wp-admin #adminmenu li.toplevel_page_deiso-wordpress-pro.wp-menu-open > a.menu-top .wp-menu-name {
    color:#ffffff !important;
    font-weight:700 !important;
}
body.wp-admin #adminmenu li.toplevel_page_deiso-wordpress-pro.wp-has-current-submenu > a.wp-has-current-submenu:after,
body.wp-admin #adminmenu li.toplevel_page_deiso-wordpress-pro.current > a.menu-top:after {
    border-right-color:#0a1929 !important;
}
@media (max-width: 960px) {
    .deiso-wp-pro-page .deiso-link-access-header {
        flex-direction:column;
        align-items:flex-start;
    }
    .deiso-wp-pro-page .deiso-link-access-filter {
        width:100%;
        justify-content:flex-start;
    }
}

/* DEISO WP Pro v2.0.0 Patch 5 — hard override for parent menu hover/current readability */
body.wp-admin #adminmenu li.toplevel_page_deiso-wordpress-pro,
body.wp-admin #adminmenu li.toplevel_page_deiso-wordpress-pro.menu-top,
body.wp-admin #adminmenu li.toplevel_page_deiso-wordpress-pro.opensub,
body.wp-admin #adminmenu li.toplevel_page_deiso-wordpress-pro:hover,
body.wp-admin #adminmenu li.toplevel_page_deiso-wordpress-pro:focus-within,
body.wp-admin #adminmenu li.toplevel_page_deiso-wordpress-pro.current,
body.wp-admin #adminmenu li.toplevel_page_deiso-wordpress-pro.wp-has-current-submenu,
body.wp-admin #adminmenu li.toplevel_page_deiso-wordpress-pro.wp-menu-open {
    background:#0a1929 !important;
}
body.wp-admin #adminmenu li.toplevel_page_deiso-wordpress-pro > a.menu-top,
body.wp-admin #adminmenu li.toplevel_page_deiso-wordpress-pro > a.menu-top:link,
body.wp-admin #adminmenu li.toplevel_page_deiso-wordpress-pro > a.menu-top:visited,
body.wp-admin #adminmenu li.toplevel_page_deiso-wordpress-pro.opensub > a.menu-top,
body.wp-admin #adminmenu li.toplevel_page_deiso-wordpress-pro.opensub > a.menu-top:hover,
body.wp-admin #adminmenu li.toplevel_page_deiso-wordpress-pro.opensub > a.menu-top:focus,
body.wp-admin #adminmenu li.toplevel_page_deiso-wordpress-pro:hover > a.menu-top,
body.wp-admin #adminmenu li.toplevel_page_deiso-wordpress-pro > a.menu-top:hover,
body.wp-admin #adminmenu li.toplevel_page_deiso-wordpress-pro > a.menu-top:focus,
body.wp-admin #adminmenu li.toplevel_page_deiso-wordpress-pro > a.menu-top:active,
body.wp-admin #adminmenu li.toplevel_page_deiso-wordpress-pro.current > a.menu-top,
body.wp-admin #adminmenu li.toplevel_page_deiso-wordpress-pro.current > a.menu-top:hover,
body.wp-admin #adminmenu li.toplevel_page_deiso-wordpress-pro.current > a.menu-top:focus,
body.wp-admin #adminmenu li.toplevel_page_deiso-wordpress-pro.wp-has-current-submenu > a.wp-has-current-submenu,
body.wp-admin #adminmenu li.toplevel_page_deiso-wordpress-pro.wp-has-current-submenu > a.wp-has-current-submenu:hover,
body.wp-admin #adminmenu li.toplevel_page_deiso-wordpress-pro.wp-has-current-submenu > a.wp-has-current-submenu:focus,
body.wp-admin #adminmenu li.toplevel_page_deiso-wordpress-pro.wp-menu-open > a.menu-top,
body.wp-admin #adminmenu li.toplevel_page_deiso-wordpress-pro.wp-menu-open > a.menu-top:hover,
body.wp-admin #adminmenu li.toplevel_page_deiso-wordpress-pro.wp-menu-open > a.menu-top:focus,
body.wp-admin #adminmenu a.toplevel_page_deiso-wordpress-pro,
body.wp-admin #adminmenu a.toplevel_page_deiso-wordpress-pro:hover,
body.wp-admin #adminmenu a.toplevel_page_deiso-wordpress-pro:focus {
    background:#0a1929 !important;
    color:#ffffff !important;
    box-shadow:none !important;
}
body.wp-admin #adminmenu li.toplevel_page_deiso-wordpress-pro > a.menu-top .wp-menu-name,
body.wp-admin #adminmenu li.toplevel_page_deiso-wordpress-pro.opensub > a.menu-top .wp-menu-name,
body.wp-admin #adminmenu li.toplevel_page_deiso-wordpress-pro.opensub > a.menu-top:hover .wp-menu-name,
body.wp-admin #adminmenu li.toplevel_page_deiso-wordpress-pro:hover > a.menu-top .wp-menu-name,
body.wp-admin #adminmenu li.toplevel_page_deiso-wordpress-pro > a.menu-top:hover .wp-menu-name,
body.wp-admin #adminmenu li.toplevel_page_deiso-wordpress-pro > a.menu-top:focus .wp-menu-name,
body.wp-admin #adminmenu li.toplevel_page_deiso-wordpress-pro > a.menu-top:active .wp-menu-name,
body.wp-admin #adminmenu li.toplevel_page_deiso-wordpress-pro.current > a.menu-top .wp-menu-name,
body.wp-admin #adminmenu li.toplevel_page_deiso-wordpress-pro.current > a.menu-top:hover .wp-menu-name,
body.wp-admin #adminmenu li.toplevel_page_deiso-wordpress-pro.wp-has-current-submenu > a.wp-has-current-submenu .wp-menu-name,
body.wp-admin #adminmenu li.toplevel_page_deiso-wordpress-pro.wp-has-current-submenu > a.wp-has-current-submenu:hover .wp-menu-name,
body.wp-admin #adminmenu li.toplevel_page_deiso-wordpress-pro.wp-menu-open > a.menu-top .wp-menu-name {
    color:#ffffff !important;
    font-weight:700 !important;
}
body.wp-admin #adminmenu li.toplevel_page_deiso-wordpress-pro.wp-has-current-submenu > a.wp-has-current-submenu:after,
body.wp-admin #adminmenu li.toplevel_page_deiso-wordpress-pro.current > a.menu-top:after {
    border-right-color:#0a1929 !important;
}

/* DEISO WP Pro v2.0.0 Patch 7 — Link Access spacing refinement */
.deiso-wp-pro-page .deiso-link-access-header {
    margin-bottom: 22px !important;
    row-gap: 14px !important;
}
.deiso-wp-pro-page .deiso-link-access-filter {
    margin-top: 8px !important;
    margin-bottom: 12px !important;
    padding-top: 4px !important;
}
.deiso-wp-pro-page .deiso-link-access-scroll {
    margin-top: 8px !important;
}

/* DEISO WP Pro v2.0.0 Patch 7 — final sidebar parent menu state override */
html body.wp-admin #adminmenu li#toplevel_page_deiso-wordpress-pro,
html body.wp-admin #adminmenu li.toplevel_page_deiso-wordpress-pro,
html body.wp-admin #adminmenu li#toplevel_page_deiso-wordpress-pro.menu-top,
html body.wp-admin #adminmenu li.toplevel_page_deiso-wordpress-pro.menu-top,
html body.wp-admin #adminmenu li#toplevel_page_deiso-wordpress-pro.opensub,
html body.wp-admin #adminmenu li.toplevel_page_deiso-wordpress-pro.opensub,
html body.wp-admin #adminmenu li#toplevel_page_deiso-wordpress-pro:hover,
html body.wp-admin #adminmenu li.toplevel_page_deiso-wordpress-pro:hover,
html body.wp-admin #adminmenu li#toplevel_page_deiso-wordpress-pro:focus-within,
html body.wp-admin #adminmenu li.toplevel_page_deiso-wordpress-pro:focus-within,
html body.wp-admin #adminmenu li#toplevel_page_deiso-wordpress-pro.current,
html body.wp-admin #adminmenu li.toplevel_page_deiso-wordpress-pro.current,
html body.wp-admin #adminmenu li#toplevel_page_deiso-wordpress-pro.wp-has-current-submenu,
html body.wp-admin #adminmenu li.toplevel_page_deiso-wordpress-pro.wp-has-current-submenu,
html body.wp-admin #adminmenu li#toplevel_page_deiso-wordpress-pro.wp-menu-open,
html body.wp-admin #adminmenu li.toplevel_page_deiso-wordpress-pro.wp-menu-open {
    background: #0a1929 !important;
    background-color: #0a1929 !important;
    background-image: none !important;
}
html body.wp-admin #adminmenu li#toplevel_page_deiso-wordpress-pro > a.menu-top,
html body.wp-admin #adminmenu li.toplevel_page_deiso-wordpress-pro > a.menu-top,
html body.wp-admin #adminmenu li#toplevel_page_deiso-wordpress-pro > a.menu-top:link,
html body.wp-admin #adminmenu li.toplevel_page_deiso-wordpress-pro > a.menu-top:link,
html body.wp-admin #adminmenu li#toplevel_page_deiso-wordpress-pro > a.menu-top:visited,
html body.wp-admin #adminmenu li.toplevel_page_deiso-wordpress-pro > a.menu-top:visited,
html body.wp-admin #adminmenu li#toplevel_page_deiso-wordpress-pro.opensub > a.menu-top,
html body.wp-admin #adminmenu li.toplevel_page_deiso-wordpress-pro.opensub > a.menu-top,
html body.wp-admin #adminmenu li#toplevel_page_deiso-wordpress-pro.opensub > a.menu-top:hover,
html body.wp-admin #adminmenu li.toplevel_page_deiso-wordpress-pro.opensub > a.menu-top:hover,
html body.wp-admin #adminmenu li#toplevel_page_deiso-wordpress-pro.opensub > a.menu-top:focus,
html body.wp-admin #adminmenu li.toplevel_page_deiso-wordpress-pro.opensub > a.menu-top:focus,
html body.wp-admin #adminmenu li#toplevel_page_deiso-wordpress-pro:hover > a.menu-top,
html body.wp-admin #adminmenu li.toplevel_page_deiso-wordpress-pro:hover > a.menu-top,
html body.wp-admin #adminmenu li#toplevel_page_deiso-wordpress-pro > a.menu-top:hover,
html body.wp-admin #adminmenu li.toplevel_page_deiso-wordpress-pro > a.menu-top:hover,
html body.wp-admin #adminmenu li#toplevel_page_deiso-wordpress-pro > a.menu-top:focus,
html body.wp-admin #adminmenu li.toplevel_page_deiso-wordpress-pro > a.menu-top:focus,
html body.wp-admin #adminmenu li#toplevel_page_deiso-wordpress-pro > a.menu-top:active,
html body.wp-admin #adminmenu li.toplevel_page_deiso-wordpress-pro > a.menu-top:active,
html body.wp-admin #adminmenu li#toplevel_page_deiso-wordpress-pro.current > a.menu-top,
html body.wp-admin #adminmenu li.toplevel_page_deiso-wordpress-pro.current > a.menu-top,
html body.wp-admin #adminmenu li#toplevel_page_deiso-wordpress-pro.current > a.menu-top:hover,
html body.wp-admin #adminmenu li.toplevel_page_deiso-wordpress-pro.current > a.menu-top:hover,
html body.wp-admin #adminmenu li#toplevel_page_deiso-wordpress-pro.current > a.menu-top:focus,
html body.wp-admin #adminmenu li.toplevel_page_deiso-wordpress-pro.current > a.menu-top:focus,
html body.wp-admin #adminmenu li#toplevel_page_deiso-wordpress-pro.wp-has-current-submenu > a.wp-has-current-submenu,
html body.wp-admin #adminmenu li.toplevel_page_deiso-wordpress-pro.wp-has-current-submenu > a.wp-has-current-submenu,
html body.wp-admin #adminmenu li#toplevel_page_deiso-wordpress-pro.wp-has-current-submenu > a.wp-has-current-submenu:hover,
html body.wp-admin #adminmenu li.toplevel_page_deiso-wordpress-pro.wp-has-current-submenu > a.wp-has-current-submenu:hover,
html body.wp-admin #adminmenu li#toplevel_page_deiso-wordpress-pro.wp-has-current-submenu > a.wp-has-current-submenu:focus,
html body.wp-admin #adminmenu li.toplevel_page_deiso-wordpress-pro.wp-has-current-submenu > a.wp-has-current-submenu:focus,
html body.wp-admin #adminmenu li#toplevel_page_deiso-wordpress-pro.wp-menu-open > a.menu-top,
html body.wp-admin #adminmenu li.toplevel_page_deiso-wordpress-pro.wp-menu-open > a.menu-top,
html body.wp-admin #adminmenu li#toplevel_page_deiso-wordpress-pro.wp-menu-open > a.menu-top:hover,
html body.wp-admin #adminmenu li.toplevel_page_deiso-wordpress-pro.wp-menu-open > a.menu-top:hover,
html body.wp-admin #adminmenu li#toplevel_page_deiso-wordpress-pro.wp-menu-open > a.menu-top:focus,
html body.wp-admin #adminmenu li.toplevel_page_deiso-wordpress-pro.wp-menu-open > a.menu-top:focus {
    background: #0a1929 !important;
    background-color: #0a1929 !important;
    background-image: none !important;
    color: #ffffff !important;
    box-shadow: none !important;
    text-shadow: none !important;
}
html body.wp-admin #adminmenu li#toplevel_page_deiso-wordpress-pro > a.menu-top .wp-menu-name,
html body.wp-admin #adminmenu li.toplevel_page_deiso-wordpress-pro > a.menu-top .wp-menu-name,
html body.wp-admin #adminmenu li#toplevel_page_deiso-wordpress-pro:hover > a.menu-top .wp-menu-name,
html body.wp-admin #adminmenu li.toplevel_page_deiso-wordpress-pro:hover > a.menu-top .wp-menu-name,
html body.wp-admin #adminmenu li#toplevel_page_deiso-wordpress-pro.opensub > a.menu-top .wp-menu-name,
html body.wp-admin #adminmenu li.toplevel_page_deiso-wordpress-pro.opensub > a.menu-top .wp-menu-name,
html body.wp-admin #adminmenu li#toplevel_page_deiso-wordpress-pro.current > a.menu-top .wp-menu-name,
html body.wp-admin #adminmenu li.toplevel_page_deiso-wordpress-pro.current > a.menu-top .wp-menu-name,
html body.wp-admin #adminmenu li#toplevel_page_deiso-wordpress-pro.wp-has-current-submenu > a.wp-has-current-submenu .wp-menu-name,
html body.wp-admin #adminmenu li.toplevel_page_deiso-wordpress-pro.wp-has-current-submenu > a.wp-has-current-submenu .wp-menu-name,
html body.wp-admin #adminmenu li#toplevel_page_deiso-wordpress-pro.wp-menu-open > a.menu-top .wp-menu-name,
html body.wp-admin #adminmenu li.toplevel_page_deiso-wordpress-pro.wp-menu-open > a.menu-top .wp-menu-name {
    color: #ffffff !important;
    font-weight: 700 !important;
}


/* DEISO WP Pro v2.0.0 Patch 8 — Dashboard Link Access spacing guaranteed fix */
.deiso-wp-pro-page .deiso-link-access-filter {
    display: flex !important;
    align-items: center !important;
    gap: 12px !important;
    padding: 10px 0 20px 0 !important;
    margin: 0 !important;
    border-bottom: 0 !important;
}
.deiso-wp-pro-page .deiso-link-access-filter + table,
.deiso-wp-pro-page .deiso-link-access-filter + .deiso-link-access-table-wrap,
.deiso-wp-pro-page .deiso-link-access-filter + .deiso-link-access-scroll,
.deiso-wp-pro-page #deiso-link-access-block table,
.deiso-wp-pro-page #deiso-link-access-block .deiso-link-access-scroll {
    margin-top: 8px !important;
}
.deiso-wp-pro-page .deiso-link-access-filter label {
    font-weight: 600 !important;
    margin: 0 !important;
}
.deiso-wp-pro-page .deiso-link-access-filter select {
    min-width: 180px !important;
}

/* DEISO WP Pro v2.0.0 Patch 9 — Dashboard Link Access spacing direct final fallback */
body.wp-admin .deiso-wp-pro-page .deiso-link-access-block .deiso-link-access-filter,
body.wp-admin #deiso-link-access-block .deiso-link-access-filter,
body.wp-admin .deiso-link-access-filter {
    display: flex !important;
    align-items: center !important;
    gap: 12px !important;
    padding: 0 0 20px 0 !important;
    margin: 18px 0 24px 0 !important;
    border-bottom: 0 !important;
}
body.wp-admin .deiso-wp-pro-page .deiso-link-access-block .deiso-link-access-scroll,
body.wp-admin #deiso-link-access-block .deiso-link-access-scroll,
body.wp-admin .deiso-link-access-filter + .deiso-link-access-scroll {
    margin-top: 14px !important;
}
body.wp-admin .deiso-link-access-filter label {
    font-weight: 600 !important;
    margin: 0 !important;
}
body.wp-admin .deiso-link-access-filter select {
    min-width: 180px !important;
}

/* DEISO WP Pro v2.0.0 Patch 9 — href-based sidebar branding fallback */
html body.wp-admin #adminmenu li:has(> a[href*="page=deiso-wordpress-pro"]),
html body.wp-admin #adminmenu li:has(> a[href*="page=deiso-wordpress-pro"]):hover,
html body.wp-admin #adminmenu li:has(> a[href*="page=deiso-wordpress-pro"]).opensub,
html body.wp-admin #adminmenu li:has(> a[href*="page=deiso-wordpress-pro"]).current,
html body.wp-admin #adminmenu li:has(> a[href*="page=deiso-wordpress-pro"]).wp-has-current-submenu,
html body.wp-admin #adminmenu li:has(> a[href*="page=deiso-wordpress-pro"]).wp-menu-open,
html body.wp-admin #adminmenu a[href*="page=deiso-wordpress-pro"],
html body.wp-admin #adminmenu a[href*="page=deiso-wordpress-pro"]:hover,
html body.wp-admin #adminmenu a[href*="page=deiso-wordpress-pro"]:focus,
html body.wp-admin #adminmenu a[href*="page=deiso-wordpress-pro"]:active {
    background: #0a1929 !important;
    background-color: #0a1929 !important;
    background-image: none !important;
    color: #ffffff !important;
}
html body.wp-admin #adminmenu a[href*="page=deiso-wordpress-pro"] .wp-menu-name {
    color: #ffffff !important;
    font-weight: 700 !important;
}

/* DEISO SMTP — Patch 12 save/test spacing refinement */
.deiso-wp-pro-page .deiso-smtp-save-actions{
    margin:34px 0 34px 0 !important;
    padding:0 0 4px 0 !important;
    clear:both;
}
.deiso-wp-pro-page .deiso-smtp-save-actions .button,
.deiso-wp-pro-page .deiso-smtp-save-actions input[type="submit"]{
    margin:0 !important;
}
.deiso-wp-pro-page .deiso-smtp-test-email-card{
    margin-top:0 !important;
}

/* DEISO SMTP — Patch 13 guaranteed save/test spacing */
.deiso-wp-pro-page.deiso-smtp-page .deiso-smtp-save-actions,
body.wp-admin .deiso-smtp-save-actions{
    display:block !important;
    clear:both !important;
    margin:56px 0 62px 0 !important;
    padding:0 0 18px 0 !important;
}
.deiso-wp-pro-page.deiso-smtp-page .deiso-smtp-test-email-card,
body.wp-admin .deiso-smtp-test-email-card{
    margin-top:28px !important;
    clear:both !important;
}


/* =============================================================================
   22  v5.9.1 — MOBILE CTA PRODUCTION HARDENING
   -----------------------------------------------------------------------------
   Adds mobile-only scoped rules that protect the Footer CTA in the real
   WordPress cascade (theme + Elementor + HFCM + Finder module). The rules
   below only apply at ≤800px — desktop is unaffected.

   Fix targets (from live production defect):
     A) Finder launcher positioning is owned by Finder Search Pro settings and
        its frontend positioning logic. Do not override those coordinates here.
     B) Theme side-area toggle (Impeka/Greatives) renders a rotated vertical
        label on the viewport edge. On phones the label appears next to the
        CTA card and reads as an overlay. Hidden on ≤800px only. Desktop
        side-area behaviour is unchanged.
     C) External anchor/theme styles have been observed to override the
        plugin button spec (radius, height, colour) on some pages. Every
        button property is reasserted at higher specificity to hold the
        v5.9.0 spec through any external cascade.
     D) The card is given its own stacking context (isolation + z-index)
        so unknown external floats cannot sit on top of the CTA content.
   ============================================================================= */

@media (max-width: 800px) {

    /* D — Card stacking isolation, keeps decorative floats behind. */
    .deiso-footer-cta__wrap {
        position: relative !important;
        z-index: 10 !important;
        isolation: isolate;
        background: #ffffff !important;
        overflow: hidden !important;
    }
    .deiso-footer-cta__left,
    .deiso-footer-cta__right,
    .deiso-footer-cta__content {
        position: relative;
        z-index: 3;
    }

    /* B — Hide theme side-area toggle on mobile. It is a vertical rotated
       label pinned to the viewport edge and interferes with content blocks
       on narrow widths. Desktop is unaffected. */
    #grve-side-area-toggle,
    .grve-side-area-toggle,
    a[href="#grve-side-area"] {
        display: none !important;
    }

    /* C — Reassert button spec against any external cascade.
       Scoped to buttons inside the Footer CTA only. */
    .deiso-footer-cta .deiso-footer-cta__buttons .deiso-footer-cta__btn,
    .deiso-footer-cta .deiso-footer-cta__left-actions .deiso-footer-cta__btn,
    .deiso-footer-cta .deiso-footer-cta__right-actions .deiso-footer-cta__btn {
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        width: 100% !important;
        min-height: 46px !important;
        padding: 12px 20px !important;
        border-radius: 12px !important;
        font-size: 14px !important;
        line-height: 1.2 !important;
        text-align: center !important;
        white-space: normal !important;
        box-sizing: border-box !important;
        text-decoration: none !important;
    }
    .deiso-footer-cta .deiso-footer-cta__btn--outline {
        background: #006675 !important;
        color: #ffffff !important;
        border: 1px solid #006675 !important;
        box-shadow: 0 8px 18px rgba(0, 102, 117, 0.22) !important;
    }
    .deiso-footer-cta .deiso-footer-cta__btn--solid {
        background: #ffffff !important;
        color: #1a1a1a !important;
        border: 1px solid rgba(26, 26, 26, 0.20) !important;
        box-shadow: none !important;
    }

    /* Stacked button gaps and container width. */
    .deiso-footer-cta__buttons,
    .deiso-footer-cta__left-actions,
    .deiso-footer-cta__right-actions {
        width: 100% !important;
        display: flex !important;
        flex-direction: column !important;
        gap: 12px !important;
    }
}

/* ============================================================
   v6.1.5 — Meeting AI notification settings readability fix
   Scope: Global Settings → Meeting AI → Meeting AI Notifications only.
   ============================================================ */
.deiso-wp-pro-page .deiso-meeting-ai-notification-types {
  display: flex;
  flex-direction: column;
  gap: 10px;
  max-width: 760px;
  margin: 10px 0 0;
  padding: 0;
  border: 0;
}

.deiso-wp-pro-page .deiso-meeting-ai-notification-types-title {
  margin: 0 0 2px;
  padding: 0;
  color: #102033;
  line-height: 1.35;
}

.deiso-wp-pro-page .deiso-meeting-ai-notification-row {
  display: grid;
  grid-template-columns: 24px minmax(0, 1fr);
  align-items: flex-start;
  column-gap: 14px;
  width: 100%;
  margin: 0;
  padding: 12px 14px;
  border: 1px solid #d8e4ec;
  border-radius: 12px;
  background: #ffffff;
  box-sizing: border-box;
  line-height: 1.45;
  overflow: hidden;
}

.deiso-wp-pro-page .deiso-meeting-ai-notification-row input[type="checkbox"] {
  grid-column: 1;
  width: 22px;
  height: 22px;
  margin: 1px 0 0;
}

.deiso-wp-pro-page .deiso-meeting-ai-notification-copy {
  grid-column: 2;
  display: block;
  min-width: 0;
  margin: 0;
  padding: 0;
  background: transparent;
  border: 0;
}

.deiso-wp-pro-page .deiso-meeting-ai-notification-title {
  display: block;
  margin: 0 0 4px;
  padding: 0;
  color: #102033;
  font-size: 15px;
  font-weight: 700;
  line-height: 1.35;
  background: transparent;
  border: 0;
  white-space: normal;
}

.deiso-wp-pro-page .deiso-meeting-ai-notification-desc {
  display: block;
  margin: 0;
  padding: 0;
  color: #667b89;
  font-size: 13px;
  font-weight: 500;
  line-height: 1.55;
  background: transparent;
  border: 0;
  white-space: normal;
}

/* ═══════════════════════════════════════════════════════════════════════
 * X93 — the shared page furniture: tabs, pills, hints, warnings, stat
 * cards, row lists and data tables.
 *
 * These were written inside the Speed Vitals page and printed only there,
 * so the Security page — which uses the same classes for the same things —
 * arrived without any of them: plain checkboxes in a plain list, a tab that
 * did not look like a tab, notes with no colour to tell a caution from an
 * aside.
 *
 * A style two pages share cannot live inside one of them. They are scoped
 * to the plugin's pages rather than to a single one, so a page written
 * next month inherits the same furniture without copying anything.
 * ═══════════════════════════════════════════════════════════════════════ */
.deiso-wp-pro-page .deiso-sv-tabs{display:flex;gap:8px;flex-wrap:wrap;margin:0 0 18px;}
.deiso-wp-pro-page .deiso-sv-tab{font-size:12.5px;border-radius:999px;padding:6px 14px;border:1px solid #DDE3EC;background:#fff;color:#094971;}
.deiso-wp-pro-page .deiso-sv-tab.is-on{background:#0E1B2C;border-color:#0E1B2C;}
.deiso-wp-pro-page .deiso-sv-tab .deiso-sv-tab-ink{color:#094971;}
.deiso-wp-pro-page .deiso-sv-tab.is-on .deiso-sv-tab-ink{color:#ffffff;font-weight:600;}
.deiso-wp-pro-page a.deiso-sv-tab:hover .deiso-sv-tab-ink{color:#00811E;}
.deiso-wp-pro-page a.deiso-sv-tab.is-on:hover .deiso-sv-tab-ink{color:#ffffff;}
.deiso-wp-pro-page .deiso-sv-stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:12px;margin:14px 0 18px;}
.deiso-wp-pro-page .deiso-sv-stat{background:#F8FAFD;border-radius:10px;padding:14px 16px;}
.deiso-wp-pro-page .deiso-sv-stat b{display:block;font-size:24px;color:#0E1B2C;line-height:1.2;font-weight:600;}
.deiso-wp-pro-page .deiso-sv-stat span{font-size:12.5px;color:#52617A;}
.deiso-wp-pro-page .deiso-svw-list{border:1px solid #E5EAF0;border-radius:10px;overflow:hidden;margin:0 0 14px;}
.deiso-wp-pro-page .deiso-svw-row{display:flex;align-items:center;gap:12px;padding:11px 16px;border-bottom:1px solid #EEF2F7;cursor:pointer;}
.deiso-wp-pro-page .deiso-svw-row:last-child{border-bottom:0;}
.deiso-wp-pro-page .deiso-svw-row.is-used{opacity:.55;cursor:default;}
.deiso-wp-pro-page .deiso-svw-row[hidden]{display:none;}
.deiso-wp-pro-page .deiso-svw-name{flex:1;font-size:14px;color:#0E1B2C;}
.deiso-wp-pro-page .deiso-svw-name small{display:block;font-size:12px;color:#8693A8;}
.deiso-wp-pro-page .deiso-svw-pill{font-size:12px;padding:4px 10px;border-radius:8px;white-space:nowrap;}
.deiso-wp-pro-page .deiso-svw-pill.is-free{background:#DCFCE7;color:#14532D;}
.deiso-wp-pro-page .deiso-svw-pill.is-used{background:#FEF3C7;color:#7C4A03;}
.deiso-wp-pro-page .deiso-svw-h3{font-size:14px;margin:22px 0 4px;}
.deiso-wp-pro-page .deiso-svw-count{font-size:12.5px;color:#8693A8;margin-left:auto;}
.deiso-wp-pro-page .deiso-sv-pill{display:inline-flex;align-items:center;gap:6px;font-size:11.5px;padding:4px 11px;border-radius:999px;font-weight:600;}
.deiso-wp-pro-page .deiso-sv-pill.is-ok{background:#DCFCE7;color:#14532D;}
.deiso-wp-pro-page .deiso-sv-pill.is-off{background:#F0F3F6;color:#52617A;}
.deiso-wp-pro-page .deiso-sv-hint{background:#E8F7EC;border-left:3px solid #00A62D;border-radius:0 8px 8px 0;padding:11px 14px;font-size:12.5px;color:#2C3A50;line-height:1.65;margin:8px 0 0;}
.deiso-wp-pro-page .deiso-sv-warn{background:#FEF3C7;border-left:3px solid #D97706;border-radius:0 8px 8px 0;padding:11px 14px;font-size:12.5px;color:#7C4A03;line-height:1.65;margin:8px 0 0;}
.deiso-wp-pro-page .button.deiso-sv-danger{color:#DC2626;border-color:#F3C9C9;}
.deiso-wp-pro-page a.deiso-sv-tab{text-decoration:none;}
.deiso-wp-pro-page .deiso-svdb-table{width:100%;border-collapse:collapse;font-size:12.5px;}
.deiso-wp-pro-page .deiso-svdb-table th{text-align:left;font-weight:600;color:#52617A;padding:8px 10px;border-bottom:1px solid #DDE3EC;font-size:11.5px;text-transform:uppercase;letter-spacing:.04em;}
.deiso-wp-pro-page .deiso-svdb-table td{padding:9px 10px;border-bottom:1px solid #EEF2F7;color:#0E1B2C;}
.deiso-wp-pro-page .deiso-svdb-table .num{text-align:right;}
.deiso-wp-pro-page .deiso-svdb-pill{display:inline-block;font-size:11px;padding:3px 9px;border-radius:999px;}
.deiso-wp-pro-page .deiso-svdb-pill.is-ov{background:#FEF3C7;color:#7C4A03;}
.deiso-wp-pro-page .deiso-svdb-pill.is-ok{background:#DCFCE7;color:#14532D;}
.deiso-wp-pro-page .deiso-svdb-table th:nth-child(3),.deiso-wp-pro-page .deiso-svdb-table td:nth-child(3){display:none;}
.deiso-wp-pro-page .deiso-sv-pill.is-stopped{background:#FEE2E2;color:#7F1D1D;}
.deiso-wp-pro-page .deiso-sv-stop{background:#B32D2E;color:#fff;border-radius:8px;padding:13px 16px;margin:14px 0 0;font-size:13.5px;line-height:1.7;}
.deiso-wp-pro-page .deiso-sv-stop strong{color:#fff;}