/* ============================================
   CRITICAL RESPONSIVE FIXES FOR WORDPRESS
   (ONLY AFFECTS MOBILE - DESKTOP UNTOUCHED)
   ============================================ */
#av_section_1 .av-section-cont-open .av-content-full {
    margin-top: 30px !important;
}

.bimi-record-lookup .av-section-cont-open {
    box-shadow: 0 0 13px 0 rgba(82, 63, 105, 0.05);
    border-radius: 5vw;
    margin-top: -9rem;
    background: white;
    max-width: 1080px;
}

.bimi-record-lookup .av-section-cont-open .av-content-full {
    max-width: 1220px;
    background: transparent;
    padding-top: 20px;
    padding-bottom: 20px;
}


/* Force proper box-sizing everywhere (safe for all sizes) */
#bimi-checker-app *,
#bimi-checker-app *::before,
#bimi-checker-app *::after {
    box-sizing: border-box !important;
}

/* Hide "What is BIMI?" info box */
    .tw\:border-slate-200.tw\:rounded-lg.tw\:border.tw\:p-4 {
        display: none !important;
    }
    
    /* Make parent container take full width */
    .tw\:lg\:col-span-2 {
        grid-column: 1 / -1 !important;
        max-width: 1200px !important;
        margin: 0 auto !important;
        width: 100% !important;
    }
    
    /* Make the grid container wider - 950px on desktop */
    .tw\:grid.tw\:grid-cols-1.tw\:sm\:grid-cols-2.tw\:md\:grid-cols-2.tw\:items-start {
        max-width: 1180px !important;
        width: 100% !important;
        margin: 0 auto !important;
    }
    
    /* Remove default margin-right */
    .tw\:mr-4 {
        margin-right: 0 !important;
    }
    
    /* Full width input group */
    .tw\:lg\:col-span-2 .p-inputgroup {
        width: 100% !important;
        max-width: none !important;
    }
    
    /* Responsive: Stack on tablet and mobile */
    @media (max-width: 1024px) {
        .tw\:grid.tw\:grid-cols-1.tw\:sm\:grid-cols-2.tw\:md\:grid-cols-2.tw\:items-start {
            max-width: 100% !important;
            padding: 0 1rem !important;
        }

        .bimi-record-lookup .av-section-cont-open {
            max-width: 90%;
        }
    }
    
    @media (max-width: 768px) {
        .tw\:lg\:col-span-2 {
            max-width: 100% !important;
            padding: 0 1rem !important;
        }
        
        .tw\:grid.tw\:grid-cols-1.tw\:sm\:grid-cols-2.tw\:md\:grid-cols-2.tw\:items-start {
            grid-template-columns: 1fr !important;
        }

        .checker-tool-title-section .avia_textblock p {
            font-size: 16px;
            font-weight: 400;
        }

        .checker-tool-title-section .avia_textblock p span{
            font-size: 16px;
            font-weight: 400;
        }

        .bimi-record-lookup {
            margin-top: -9rem;
        }
    }

    @media (max-width: 480px) {
        .bimi-record-lookup {
            margin-top: -4rem;
            max-width: 90%;
            margin-left: 20px;
        }
    }

    @media (max-width: 389px) {
        .bimi-record-lookup {
            margin-top: -2rem;            
        }
    }

/* ── BIMI phone logo overlay — breakpoint corrections ────────────────────── */

/* below 640px */
#vue-bimi-checker .tw\:top-23 {
    top: calc(0.25rem * 17) !important;
}

@media (min-width: 768px) and (max-width: 1023px) {
    #vue-bimi-checker .tw\:lg\:top-25 {
        top: calc(0.25rem * 15) !important;
    }
}

@media (min-width: 1024px) and (max-width: 1279px) {
    #vue-bimi-checker .tw\:lg\:top-25 {
        top: calc(0.25rem * 20) !important;
    }
}

@media (min-width: 1280px) and (max-width: 1535px) {
    #vue-bimi-checker .tw\:xl\:top-23 {
        top: calc(0.25rem * 19) !important;
    }
}

@media (min-width: 1536px) {
    #vue-bimi-checker .tw\:2xl\:top-22 {
        top: calc(0.25rem * 16) !important;
    }
}

/* ── BIMI desktop preview logo overlay — position corrections ────────────── */

@media (max-width: 639px) {
    #vue-bimi-checker .tw\:top-8.tw\:left-18 {
        top: calc(0.25rem * 6) !important;
        left: calc(0.25rem * 12) !important;
    }
}

@media (max-width: 767px) {
    #vue-bimi-checker .tw\:left-25 {
        left: calc(var(--tw-spacing) * 19) !important;
    }
    #vue-bimi-checker .tw\:top-19 {
        top: calc(var(--tw-spacing) * 14) !important;
    }
    #vue-bimi-checker .tw\:left-7 {
        left: calc(var(--tw-spacing) * 3) !important;
    }
}

@media (min-width: 640px) and (max-width: 767px) {
    #vue-bimi-checker .tw\:sm\:top-22.tw\:sm\:left-44 {
        top: calc(0.25rem * 18) !important;
        left: calc(0.25rem * 30) !important;
    }
}

@media (min-width: 768px) and (max-width: 1023px) {
    #vue-bimi-checker .tw\:md\:top-27.tw\:md\:left-52 {
        top: calc(0.25rem * 21) !important;
        left: calc(0.25rem * 44) !important;
    }
}

@media (min-width: 1024px) and (max-width: 1279px) {
    #vue-bimi-checker .tw\:md\:top-27.tw\:md\:left-52 {
        top: calc(0.25rem * 23) !important;
        left: calc(0.25rem * 42) !important;
    }
}

@media (min-width: 1280px) and (max-width: 1535px) {
    #vue-bimi-checker .tw\:xl\:top-23.tw\:xl\:left-45 {
        top: calc(0.25rem * 14) !important;
        left: calc(0.25rem * 28) !important;
    }
}

@media (min-width: 1536px) {
    #vue-bimi-checker .tw\:2xl\:top-21.tw\:2xl\:left-45 {
        top: calc(0.25rem * 16) !important;
        left: calc(0.25rem * 34) !important;
    }
}

/* ── Desktop preview image — lock to fixed width at 768–1023px ───────────── */
/* Prevents the SVG from shrinking, so the absolutely-positioned logo overlay  */
/* stays anchored — image overflows/clips from the right instead of scaling.   */
@media (min-width: 768px) and (max-width: 1023px) {
    #vue-bimi-checker .tw\:md\:w-\[550px\] {
        width: 550px !important;
        min-width: 550px !important;
        flex-shrink: 0 !important;
        margin-left: 20px !important;
    }
}

/* ── Desktop preview outer container — fix left position at 768–1023px ────── */
@media (min-width: 768px) and (max-width: 1023px) {
    #vue-bimi-checker .tw\:md\:top-8.tw\:md\:left-115 {
        left: calc(0.25rem * 70) !important;
    }
}

#vue-bimi-checker label[for="bimi-selector"].mt-8 {
    margin-top: 0 !important;
}

/* Constrain BIMI app wrapper (safe for all sizes) */
#bimi-checker-app {
    max-width: 100vw !important;
    overflow-x: hidden !important;
    width: 100% !important;
}

.vue-app-isolation-wrapper {
    max-width: 100% !important;
    overflow-x: hidden !important;
}

#vue-bimi-checker {
    max-width: 100% !important;
    overflow-x: hidden !important;
}

/* Fix PrimeVue Card overflow (safe for all sizes) */
.p-card,
.p-card-body,
.p-card-content {
    max-width: 100% !important;
    overflow-x: hidden !important;
}

/* ============================================
   ENFOLD OVERRIDES - LIGHT MODE TEXT COLORS
   ============================================ */

/* Base text colors - Override Enfold */
#bimi-checker-app {
    font-family: 'Muli', Helvetica, sans-serif !important;
    font-size: 13px !important;
    line-height: 1.5 !important;
    color: #475569 !important;
}

/* Headings - Override Enfold */
#bimi-checker-app h1,
#bimi-checker-app h2,
#bimi-checker-app h3,
#bimi-checker-app h4,
#bimi-checker-app h5,
#bimi-checker-app h6 {
    color: #475569 !important;
    font-family: 'Muli', Helvetica, sans-serif !important;
    font-weight: 700 !important;
    line-height: 1.2 !important;
    margin: 0 !important;
}

/* Gray text variants */
#bimi-checker-app .tw\:text-gray-600 {
    color: #6c757d !important;
}

#bimi-checker-app .tw\:text-gray-700 {
    color: #495057 !important;
}

#bimi-checker-app .tw\:text-surface-600 {
    color: #6c757d !important;
}

/* Success text - GREEN (keep in light mode) */
#bimi-checker-app .tw\:text-green-600,
#bimi-checker-app [class*="text-green"],
#bimi-checker-app .text-success {
    color: #16a34a !important;
}

/* Error text - RED (keep in light mode) */
#bimi-checker-app .tw\:text-red-600,
#bimi-checker-app [class*="text-red"],
#bimi-checker-app .text-danger {
    color: #ff0000 !important;
}

/* Border colors - Override Enfold */
#bimi-checker-app .border,
#bimi-checker-app .tw\:border,
#bimi-checker-app .tw\:border-gray-200 {
    border-color: #e9ecef !important;
}

/* Card styles */
#bimi-checker-app .p-card,
#bimi-checker-app .shadow-none.border {
    background: #ffffff !important;    
    border-radius: 0.5rem !important;
}

/* ============================================
   DARK MODE - BRAND MARK HEADINGS
   ============================================ */

/* Logo overview headings (Brand Mark, Mark Variants, Preview) - WHITE in dark mode */
#bimi-checker-app[data-theme="dark"] h5,
#bimi-checker-app .dark-mode h5,
#bimi-checker-app[data-theme="dark"] h5.tw\:\!m-0,
#bimi-checker-app[data-theme="dark"] h5.tw\:\!mt-1,
#bimi-checker-app .dark-mode h5.tw\:\!m-0,
#bimi-checker-app .dark-mode h5.tw\:\!mt-1 {
    color: #ffffff !important;
    font-family: 'Muli', Helvetica, sans-serif !important;
}

/* Keep success/error colors VISIBLE in dark mode */
#bimi-checker-app[data-theme="dark"] .tw\:text-green-600,
#bimi-checker-app .dark-mode .tw\:text-green-600,
#bimi-checker-app[data-theme="dark"] .text-success,
#bimi-checker-app .dark-mode .text-success {
    color: #16a34a !important;
}

#bimi-checker-app[data-theme="dark"] .tw\:text-red-600,
#bimi-checker-app .dark-mode .tw\:text-red-600,
#bimi-checker-app[data-theme="dark"] .text-danger,
#bimi-checker-app .dark-mode .text-danger {
    color: #ff0000 !important;
}

/* ============================================
   PRE ELEMENT FIXES (ALL SCREEN SIZES)
   ============================================ */

/* Fix PRE elements for all screen sizes to prevent overflow */
pre,
pre.tw\:w-full,
pre[class*="tw:px-"] {
    white-space: pre-wrap !important;
    /* Allow wrapping */
    word-break: break-word !important;
    /* Break long words */
    overflow-wrap: break-word !important;
    /* Break at word boundaries */
    word-wrap: break-word !important;
    /* Legacy support */
    max-width: 100% !important;
    overflow-x: auto !important;
    /* Scroll if needed */
    box-sizing: border-box !important;
}

/* ============================================
   ADDITIONAL COMPONENT FIXES
   ============================================ */

/* Input border radius - 6px */
#bimi-checker-app .p-inputtext,
#bimi-checker-app input.p-inputtext,
#bimi-checker-app input[type="text"],
#bimi-checker-app input[type="email"],
#bimi-checker-app input[type="url"] {
    border-radius: 6px !important;
    margin-bottom: 0px !important;
    border: 1px solid #cbd5e1 !important;
    border-top-right-radius: 0px !important;
    border-bottom-right-radius: 0px !important;
}

.p-inputgroupaddon {
    border-color: #cbd5e1 !important;
}

#bimi-checker-app .p-panel,
#bimi-checker-app .p-panel.p-component,
#bimi-checker-app .p-panel-toggleable {
    border: 1px solid #e2e8f0 !important;
}

/* Panel header border */
#bimi-checker-app .p-panel-header {
    border-bottom: 1px solid #e2e8f0 !important;
}

/* Search button icon - white color */
#bimi-checker-app .p-button .p-button-icon.pi-search {
    color: #ffffff !important;
}

/* Copy buttons - blue background with white icon */
#bimi-checker-app .p-button-primary {
    background: #2563eb !important;
    border-color: #2563eb !important;
    color: #ffffff !important;
}

#bimi-checker-app .p-button-primary:hover {
    background: #1d4ed8 !important;
    border-color: #1d4ed8 !important;
}

#bimi-checker-app .p-button-primary .p-button-icon {
    color: #ffffff !important;
}

/* All button icons white when inside primary button */
#bimi-checker-app .p-button-primary .pi {
    color: #ffffff !important;
}

/* Copy button (icon-only) specific styling */
#bimi-checker-app .p-button-icon-only {
    border-radius: 6px !important;
}

#bimi-checker-app .p-button-icon-only.p-button-primary {
    background: #2563eb !important;
    border-color: #2563eb !important;
}

#bimi-checker-app .p-button-icon-only.p-button-primary:hover {
    background: #1d4ed8 !important;
    border-color: #1d4ed8 !important;
}

/* Clone/copy icon specifically */
#bimi-checker-app .p-button .pi-clone {
    color: #ffffff !important;
}

/* ============================================
   DARK MODE / LOGO OVERVIEW TEXT FIX
   ============================================ */

/* When dark mode or logo section is active */
#bimi-checker-app[data-theme="dark"],
#bimi-checker-app .dark-mode,
#bimi-checker-app [data-theme="dark"],
.logo-overview-section {
    color: #ffffff !important;
}

/* All text elements in dark mode */
#bimi-checker-app[data-theme="dark"] *,
#bimi-checker-app .dark-mode *,
#bimi-checker-app [data-theme="dark"] *,
.logo-overview-section * {
    color: #ffffff !important;
}

/* Headings in dark mode */
#bimi-checker-app[data-theme="dark"] h1,
#bimi-checker-app[data-theme="dark"] h2,
#bimi-checker-app[data-theme="dark"] h3,
#bimi-checker-app[data-theme="dark"] h4,
#bimi-checker-app[data-theme="dark"] h5,
#bimi-checker-app[data-theme="dark"] h6,
#bimi-checker-app .dark-mode h1,
#bimi-checker-app .dark-mode h2,
#bimi-checker-app .dark-mode h3,
#bimi-checker-app .dark-mode h4,
#bimi-checker-app .dark-mode h5,
#bimi-checker-app .dark-mode h6 {
    color: #ffffff !important;
}

/* Paragraphs and spans in dark mode */
#bimi-checker-app[data-theme="dark"] p,
#bimi-checker-app[data-theme="dark"] span,
#bimi-checker-app[data-theme="dark"] div,
#bimi-checker-app[data-theme="dark"] label,
#bimi-checker-app .dark-mode p,
#bimi-checker-app .dark-mode span,
#bimi-checker-app .dark-mode div,
#bimi-checker-app .dark-mode label {
    color: #ffffff !important;
}

/* Tables in dark mode */
#bimi-checker-app[data-theme="dark"] .p-datatable-thead th,
#bimi-checker-app .dark-mode .p-datatable-thead th {
    color: #ffffff !important;
    background: #2c2c2c !important;
    border-color: #404040 !important;
}

#bimi-checker-app[data-theme="dark"] .p-datatable-tbody td,
#bimi-checker-app .dark-mode .p-datatable-tbody td {
    color: #ffffff !important;
    border-color: #404040 !important;
}

/* Cards in dark mode */
#bimi-checker-app[data-theme="dark"] .p-card,
#bimi-checker-app .dark-mode .p-card {
    background: #252525 !important;
    color: #ffffff !important;
    border-color: #404040 !important;
}

/* Panels in dark mode */
#bimi-checker-app[data-theme="dark"] .p-panel,
#bimi-checker-app .dark-mode .p-panel {
    background: #252525 !important;
    color: #ffffff !important;
    border-color: #404040 !important;
}

#bimi-checker-app[data-theme="dark"] .p-panel-header,
#bimi-checker-app .dark-mode .p-panel-header {
    background: #2c2c2c !important;
    color: #ffffff !important;
    border-color: #404040 !important;
}

/* Inputs in dark mode */
#bimi-checker-app[data-theme="dark"] input,
#bimi-checker-app .dark-mode input {
    background: #2c2c2c !important;
    color: #ffffff !important;
    border-color: #404040 !important;
}

#bimi-checker-app[data-theme="dark"] input::placeholder,
#bimi-checker-app .dark-mode input::placeholder {
    color: #9ca3af !important;
}

/* Keep success/error colors visible in dark mode */
#bimi-checker-app[data-theme="dark"] .tw\:text-green-600,
#bimi-checker-app .dark-mode .tw\:text-green-600 {
    color: #0abb87 !important;
}

#bimi-checker-app[data-theme="dark"] .tw\:text-red-600,
#bimi-checker-app .dark-mode .tw\:text-red-600 {
    color: #F64E60 !important;
}

/* ============================================
   MOBILE-ONLY FIXES (640px and below)
   ============================================ */
@media (max-width: 640px) {

    /* Prevent horizontal overflow at root level - ONLY ON MOBILE */
    html {
        overflow-x: hidden !important;
        max-width: 100vw !important;
    }

    body {
        overflow-x: hidden !important;
        max-width: 100vw !important;
        color: #475569 !important;
        /* Override that red color */
    }

    /* Fix Bootstrap container gutters */
    .container,
    .container-fluid,
    .container-sm,
    .container-md,
    .container-lg,
    .container-xl,
    .container-xxl {
        --bs-gutter-x: 0.75rem !important;
        padding-right: calc(var(--bs-gutter-x) * 0.5) !important;
        padding-left: calc(var(--bs-gutter-x) * 0.5) !important;
        max-width: 100% !important;
        overflow-x: hidden !important;
    }

    /* Reduce all horizontal padding */
    .tw\:px-4 {
        padding-left: 0.5rem !important;
        padding-right: 0.5rem !important;
    }

    .tw\:px-5 {
        padding-left: 0.75rem !important;
        padding-right: 0.75rem !important;
    }

    /* Ensure panels don't overflow */
    .p-panel,
    .p-panel-content,
    .p-panel-content-container,
    .p-panel-content-wrapper {
        max-width: 100% !important;
        overflow-x: hidden !important;
    }

    /* Fix panel padding */
    .p-panel-content {
        padding: 0.5rem !important;
    }

    /* Constrain tables */
    .p-datatable-table-container {
        max-width: 100% !important;
        overflow-x: auto !important;
        -webkit-overflow-scrolling: touch !important;
    }

    .p-datatable-table {
        width: 100% !important;
        min-width: unset !important;
        table-layout: fixed !important;
        /* Force table to respect container width */
    }

    /* CRITICAL: Break long URLs and text in table cells */
    .p-datatable-table td,
    .p-datatable-table th {
        word-break: break-word !important;
        overflow-wrap: break-word !important;
        word-wrap: break-word !important;
        hyphens: auto !important;
        white-space: normal !important;
    }

    /* Target specific table cells more aggressively */
    td.tw\:border,
    td[class*="tw:px-"],
    td.tw\:text-surface-600,
    .p-datatable-tbody td {
        word-break: break-all !important;
        /* More aggressive breaking for URLs */
        overflow-wrap: anywhere !important;
        max-width: 1px !important;
        /* Forces wrapping */
    }

    /* CRITICAL: Break content in PRE elements */
    pre,
    pre.tw\:w-full,
    pre[class*="tw:px-"] {
        white-space: pre-wrap !important;
        /* Allow wrapping */
        word-break: break-word !important;
        /* Break long words */
        overflow-wrap: break-word !important;
        /* Break at word boundaries */
        word-wrap: break-word !important;
        /* Legacy support */
        max-width: 100% !important;
        overflow-x: auto !important;
        /* Scroll if needed */
        font-size: 0.75rem !important;
        /* Smaller text on mobile */
        line-height: 1.4 !important;
    }

    /* Break long URLs in span elements inside result displays */
    span.tw\:break-all,
    span.tw\:select-all {
        word-break: break-all !important;
        overflow-wrap: anywhere !important;
        display: block !important;
        max-width: 100% !important;
    }

    /* Reduce gap spacing on mobile */
    .tw\:gap-5 {
        gap: 0.75rem !important;
    }

    .tw\:gap-3 {
        gap: 0.5rem !important;
    }

    /* Fix grid layouts - BUT NOT images inside */
    .tw\:grid:not(.tw\:items-center) {
        max-width: 100% !important;
        overflow-x: hidden !important;
    }

    /* Ensure images don't overflow */
    img {
        max-width: 100% !important;        
    }

    /* Remove inline margin styles from Brand Mark image */
    .tw\:flex.tw\:items-center.tw\:justify-center img[style*="margin"] {
        margin: 0 auto !important;
    }

    /* IMPORTANT: Don't apply max-width to image container flexboxes */
    /* This allows Circle/Rounded/Square images to center properly */
    .tw\:flex.tw\:flex-col.tw\:items-center,
    .tw\:flex.tw\:flex-wrap.tw\:items-center.tw\:justify-center {
        max-width: none !important;
        flex-wrap: wrap !important;
    }

    /* IMPORTANT: Don't apply max-width to image width classes */
    /* This preserves the 60px/80px/100px/120px sizing */
    .tw\:flex-col.tw\:items-center [class*="tw:w-"],
    .tw\:flex-wrap [class*="tw:w-"] {
        max-width: none !important;
    }

    /* But DO constrain text containers and panels */
    .p-card [class*="tw:w-"],
    .p-panel [class*="tw:w-"],
    .tw\:w-full {
        max-width: 100% !important;
    }

    /* Fix tabs to allow wrapping */
    .p-tab {
        white-space: normal !important;
        word-break: break-word !important;
    }
}

/* ============================================
   EXTRA SMALL MOBILE (430px and below)
   ============================================ */
@media (max-width: 430px) {

    /* Further reduce padding */
    .tw\:px-4,
    .tw\:px-5 {
        padding-left: 0.25rem !important;
        padding-right: 0.25rem !important;
    }

    /* Make cards stack vertically */
    .tw\:grid-cols-2,
    .tw\:grid-cols-3,
    .tw\:grid-cols-4 {
        grid-template-columns: 1fr !important;
    }

    /* Reduce panel padding even more */
    .p-panel-content {
        padding: 0.25rem !important;
    }

    /* Even smaller font for PRE on very small screens */
    pre {
        font-size: 0.65rem !important;
        padding: 0.5rem !important;
    }

    /* Reduce table cell padding */
    .p-datatable-table td,
    .p-datatable-table th {
        padding: 0.25rem !important;
        font-size: 0.85rem !important;
    }
}

/* ============================================
   LOADING STATE — match SPF checker appearance
   Fix: flickering, scrollbar, spinner sizing
   ============================================ */

/* Reserve scrollbar gutter so the page layout does not shift
   (17px jump) when the result card makes the page scrollable. */
html {
    scrollbar-gutter: stable;
}

/* Fix: W3C spec forces overflow-y to 'auto' when overflow-x is
   set to anything other than 'visible'. Add overflow-y:visible
   to the elements that already carry overflow-x:hidden so they
   don't sprout an internal vertical scrollbar.                  */
#bimi-checker-app,
.vue-app-isolation-wrapper,
#vue-bimi-checker {
    overflow-y: visible !important;
}

#bimi-checker-app .p-card,
#bimi-checker-app .p-card-body,
#bimi-checker-app .p-card-content {
    overflow-y: visible !important;
}

/* Hide the card's visual shell while the spinner is active so that
   only the bare spinner is visible — matching SPF checker behaviour
   where the spinner floats in open space and the result card only
   appears once data has arrived.                                  */
#vue-bimi-checker .p-card:has(.p-progressspinner) {
    background: transparent !important;
    box-shadow: none !important;
    border: none !important;
    border-radius: 0 !important;
}

#vue-bimi-checker .p-card:has(.p-progressspinner) .p-card-body,
#vue-bimi-checker .p-card:has(.p-progressspinner) .p-card-content {
    background: transparent !important;
}

/* Give the hidden card just enough room to centre the spinner     */
#vue-bimi-checker .p-card:has(.p-progressspinner) .p-card-body {
    padding: 0 !important;
}

#vue-bimi-checker .p-card:has(.p-progressspinner) .p-card-content {
    min-height: 120px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
}

/* Remove the mt-4 top margin on the spinner wrapper and centre it */
#vue-bimi-checker .p-card .tw\:mt-4.tw\:flex.tw\:items-center.tw\:gap-2 {
    margin-top: 0 !important;
    justify-content: center !important;
}

/* Resize the spinner from 40px to 60px — matching SPF checker    */
#vue-bimi-checker .p-card .p-progressspinner {
    width: 60px !important;
    height: 60px !important;
}

/* Thin the stroke from 4 to 2 — matching SPF checker             */
#vue-bimi-checker .p-card .p-progressspinner-circle {
    stroke-width: 2 !important;
}