/* BotShield CAPTCHA Modern Admin Design - v2.0.0 */

:root {
    /* Primary Brand Colors */
    --bs-primary: #4F46E5; /* Indigo 600 */
    --bs-primary-hover: #4338CA; /* Indigo 700 */
    --bs-primary-light: #EEF2FF; /* Indigo 50 */
    
    /* Neutral / UI Colors */
    --bs-bg: #F3F4F6; /* Cool Gray 100 */
    --bs-card-bg: #FFFFFF;
    --bs-text-main: #111827; /* Gray 900 */
    --bs-text-muted: #6B7280; /* Gray 500 */
    --bs-border: #E5E7EB; /* Gray 200 */
    --bs-border-hover: #D1D5DB; /* Gray 300 */
    
    /* Semantic Colors */
    --bs-success: #10B981; /* Emerald 500 */
    --bs-success-bg: #ECFDF5;
    --bs-error: #EF4444; /* Red 500 */
    --bs-warning: #F59E0B; /* Amber 500 */
    
    /* Spacing & Layout */
    --bs-radius: 12px;
    --bs-shadow-sm: 0 1px 2px 0 rgba(0, 0, 0, 0.05);
    --bs-shadow-md: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
    --bs-font-sans: 'Inter', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
}

/* Global Reset & Layout */
.botshield-captcha-admin-modern {
    font-family: var(--bs-font-sans);
    background-color: var(--bs-bg);
    color: var(--bs-text-main);
    margin: 0 20px -65px -20px; /* Stretch to fill WP admin area */
    padding: 20px 40px;
    min-height: 100vh;
    box-sizing: border-box;
}

.botshield-captcha-admin-modern * {
    box-sizing: border-box;
}

/* Header */
.botshield-captcha-admin-header {
    margin-bottom: 30px;
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.botshield-captcha-admin-header h1 {
    font-size: 28px;
    font-weight: 700;
    color: var(--bs-text-main);
    display: flex;
    align-items: center;
    gap: 12px;
    margin: 0;
}

.botshield-captcha-admin-header h1 .dashicons {
    font-size: 32px;
    width: 32px;
    height: 32px;
    color: var(--bs-primary);
}

.botshield-captcha-admin-header .description {
    font-size: 15px;
    color: var(--bs-text-muted);
    margin: 0;
    font-weight: 400;
}

/* Main Grid Layout */
.botshield-captcha-admin-main {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 360px; /* Fixed sidebar, flexible content */
    gap: 30px;
    width: 100%; /* Full width */
    max-width: 100%; /* Prevent overflow */
    padding-right: 0; /* Remove extra padding */
    overflow-x: hidden; /* Prevent horizontal scroll */
    box-sizing: border-box;
}

@media (max-width: 960px) {
    .botshield-captcha-admin-main {
        grid-template-columns: 1fr;
        padding-right: 0;
    }
}

/* Card Styling */
.botshield-captcha-admin-card {
    background: var(--bs-card-bg);
    border-radius: var(--bs-radius);
    box-shadow: var(--bs-shadow-sm);
    border: 1px solid var(--bs-border);
    overflow: hidden;
    margin-bottom: 30px;
}

/* Tabs Navigation - Pixel Perfect */
.botshield-nav-tabs {
    background: #FFFFFF;
    border-bottom: 1px solid #E5E7EB;
    padding: 0 24px;
    display: flex;
    gap: 32px;
    margin: 0;
}

.botshield-nav-tabs .nav-tab {
    background: transparent;
    border: none;
    border-bottom: 2px solid transparent;
    color: #9CA3AF;
    font-size: 16px;
    font-weight: 500;
    padding: 14px 0;
    margin: 0;
    cursor: pointer;
    transition: all 0.2s ease;
}

.botshield-nav-tabs .nav-tab:focus {
    outline: none;
    box-shadow: none;
    background: transparent;
}

.botshield-nav-tabs .nav-tab:hover {
    color: #1F2937;
    background: transparent;
}

.botshield-nav-tabs .nav-tab.nav-tab-active {
    color: #1F2937;
    border-bottom-color: #6366F1;
    background: transparent;
    font-weight: 600;
}

/* Card Header (Internal) - Pixel Perfect */
.botshield-captcha-card-header {
    padding: 24px 24px 20px;
    border-bottom: none;
}

.botshield-captcha-card-header h2 {
    font-size: 20px;
    font-weight: 700;
    margin: 0 0 6px 0;
    padding: 0;
    color: #1F2937;
}

.botshield-captcha-card-header .description {
    font-size: 14px;
    color: #6B7280;
    margin: 0;
    font-weight: 400;
    line-height: 1.5;
}

/* Forms - Pixel Perfect */
.botshield-captcha-admin-form {
    padding: 0;
}

.botshield-captcha-admin-fields {
    display: flex;
    flex-direction: column;
    gap: 20px;
    padding: 24px;
}

.botshield-captcha-admin-field {
    display: flex;
    flex-direction: column;
    gap: 8px;
    max-width: 100%;
}

.botshield-captcha-admin-field label {
    font-size: 14px;
    font-weight: 600;
    color: #1F2937;
    cursor: pointer;
}

.botshield-captcha-admin-field select,
.botshield-captcha-admin-field input[type="text"],
.botshield-captcha-admin-field input[type="password"],
.botshield-captcha-admin-field input[type="number"] {
    width: 100%;
    padding: 8px 12px;
    font-size: 14px;
    line-height: 1.5;
    border: 1px solid #D1D5DB;
    border-radius: 6px;
    background-color: #F9FAFB;
    transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
    height: 40px;
    color: #1F2937;
}

.botshield-captcha-admin-field select:focus,
.botshield-captcha-admin-field input:focus {
    border-color: #6366F1;
    box-shadow: 0 0 0 3px rgba(99, 102, 241, 0.1);
    outline: none;
    background-color: #FFFFFF;
}

.botshield-captcha-admin-desc {
    font-size: 13px;
    color: #6B7280;
    margin: 0;
    line-height: 1.5;
}

.botshield-captcha-admin-desc a {
    color: #6366F1;
    text-decoration: none;
    font-weight: 500;
}

.botshield-captcha-admin-desc a:hover {
    text-decoration: underline;
}


/* Radio Group */
.botshield-radio-group {
    display: flex;
    gap: 24px;
    padding: 8px 0;
}

.botshield-radio-group label {
    display: flex;
    align-items: center;
    gap: 10px;
    font-weight: 500;
    cursor: pointer;
    color: #374151;
    transition: color 0.2s ease;
}

.botshield-radio-group label:hover {
    color: #111827;
}

.botshield-radio-group input[type="radio"] {
    appearance: none !important;
    -webkit-appearance: none !important;
    -moz-appearance: none !important;
    width: 18px !important;
    height: 18px !important;
    border: 2px solid #D1D5DB !important;
    border-radius: 50% !important;
    margin: 0 !important;
    padding: 0 !important;
    cursor: pointer;
    position: relative;
    transition: all 0.2s ease;
    background-color: #FFFFFF !important;
    box-shadow: none !important;
    flex-shrink: 0;
}

.botshield-radio-group input[type="radio"]:hover {
    border-color: #9CA3AF !important;
}

.botshield-radio-group input[type="radio"]:checked {
    background-color: #6366F1 !important;
    border-color: #6366F1 !important;
    box-shadow: 0 0 0 3px rgba(99, 102, 241, 0.1) !important;
}

.botshield-radio-group input[type="radio"]:checked::before {
    content: '' !important;
    position: absolute !important;
    top: 50% !important;
    left: 50% !important;
    transform: translate(-50%, -50%) !important;
    width: 6px !important;
    height: 6px !important;
    border-radius: 50% !important;
    background-color: #FFFFFF !important;
    margin: 0 !important;
    padding: 0 !important;
    border: none !important;
}

.botshield-radio-group input[type="radio"]:focus {
    outline: none !important;
    box-shadow: 0 0 0 3px rgba(99, 102, 241, 0.2) !important;
}

/* Provider Sections */
/* Grid Layout for Providers */
.botshield-provider-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 24px;
    align-items: start;
}

@media (max-width: 782px) {
    .botshield-provider-grid {
        grid-template-columns: 1fr;
    }
}

.botshield-integration-section {
    padding: 20px 24px;
    border: 1px solid #E5E7EB;
    border-radius: 8px;
    background: #FAFBFC;
    margin-bottom: 0; /* Remove margin as grid handles gap */
    height: 100%; /* Equal height */
    display: flex;
    flex-direction: column;
}

.provider-heading {
    font-size: 18px;
    font-weight: 700;
    color: #111827;
    margin: 0 0 16px 0;
    padding: 0 0 10px 0;
    border-bottom: 2px solid #E5E7EB;
}

/* v2/v3 Field Groups */
.botshield-recaptcha-v2-fields,
.botshield-recaptcha-v3-fields {
    display: flex;
    flex-direction: column;
    gap: 16px;
    margin-top: 16px;
    padding-top: 16px;
    border-top: 1px dashed #D1D5DB;
}

/* Get Keys Links */
.botshield-integration-section .botshield-captcha-admin-desc:last-child {
    margin-top: 12px;
    margin-bottom: 0;
}

/* Turnstile Field Groups */
.botshield-turnstile-fields {
    display: flex;
    flex-direction: column;
    gap: 16px;
}


/* Buttons - Pixel Perfect */
.botshield-captcha-admin-form .submit {
    margin: 0;
    padding: 24px;
    border-top: none;
    display: flex;
    justify-content: flex-start;
    align-items: center;
}

.botshield-captcha-admin-form .button-primary {
    background: #6366F1;
    border: 1px solid transparent;
    color: white;
    padding: 10px 24px;
    font-size: 14px;
    font-weight: 600;
    border-radius: 8px;
    cursor: pointer;
    transition: all 0.2s;
    height: auto;
    text-shadow: none;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05);
}

.botshield-captcha-admin-form .button-primary:hover {
    background: #4F46E5;
    transform: translateY(-1px);
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
}

.botshield-captcha-admin-form .button-primary:focus {
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05);
    outline: none;
}

/* Save Success Notification Toast */
.botshield-captcha-save-success {
    position: fixed;
    bottom: 30px;
    right: 30px;
    background: #FFFFFF;
    border: 1px solid #E5E7EB;
    color: #111827;
    padding: 16px 24px;
    border-radius: 12px;
    display: flex;
    align-items: center;
    gap: 12px;
    box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05);
    z-index: 99999;
    font-size: 14px;
    font-weight: 500;
    visibility: hidden;
    opacity: 0;
    transform: translateY(20px);
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.botshield-captcha-save-success.visible {
    visibility: visible;
    opacity: 1;
    transform: translateY(0);
}

.botshield-captcha-save-success .dashicons {
    color: #10B981;
    font-size: 22px;
    width: 22px;
    height: 22px;
}

.botshield-captcha-save-success p {
    margin: 0;
    padding: 0;
}

/* Guide Card - Perfect Design */
.botshield-captcha-admin-guide {
    background: #FFFFFF;
    border-radius: 8px;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
    border: 1px solid #E5E7EB;
    overflow: hidden;
    margin-bottom: 24px;
}

.cf7-guide-header {
    padding: 20px 24px;
    background: #FFFFFF;
    border-bottom: 1px solid #E5E7EB;
}

.cf7-guide-header h2 {
    font-size: 16px;
    font-weight: 600;
    color: #111827;
    margin: 0;
}

.cf7-guide-steps {
    padding: 24px;
    display: flex;
    flex-direction: column;
    gap: 28px;
}

.cf7-guide-step {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.cf7-guide-step h4 {
    margin: 0 0 8px 0;
    font-size: 14px;
    font-weight: 600;
    color: #111827;
    display: flex;
    align-items: center;
    gap: 10px;
}

.cf7-guide-step h4 .dashicons {
    font-size: 20px;
    width: 20px;
    height: 20px;
    display: flex;
    align-items: center;
    justify-content: center;
}

/* Specific icon colors */
.cf7-guide-step h4 .dashicons-google { color: #EA4335; }
.cf7-guide-step h4 .dashicons-cloud { color: #F48120; }
.cf7-guide-step h4 .dashicons-shield { color: #10B981; }

.cf7-guide-step ol, 
.cf7-guide-step ul {
    margin: 0 0 0 30px; /* Align with text */
    padding: 0;
    color: #4B5563;
    font-size: 13px;
    line-height: 1.6;
}

.cf7-guide-step p {
    color: #4B5563;
    font-size: 13px;
    margin: 0 0 0 30px;
    line-height: 1.6;
}

/* Sidebar */
.botshield-captcha-admin-aside {
    display: flex;
    flex-direction: column;
    gap: 24px;
}

.cf7-sidebar-card {
    background: var(--bs-card-bg);
    border-radius: var(--bs-radius);
    box-shadow: var(--bs-shadow-sm);
    border: 1px solid var(--bs-border);
    padding: 20px;
}

.cf7-sidebar-title {
    font-size: 15px;
    font-weight: 600;
    color: var(--bs-text-main);
    margin: 0 0 16px 0;
    padding-bottom: 12px;
    border-bottom: 1px solid var(--bs-border);
}

.cf7-sidebar-card ul {
    margin: 0;
    padding: 0;
    list-style: none;
}

.cf7-sidebar-card li {
    font-size: 13px;
    color: var(--bs-text-muted);
    margin-bottom: 10px;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.cf7-sidebar-card li strong {
    color: var(--bs-text-main);
    font-weight: 500;
}



/* Resources Card Design - Exact Match from Request */
.botshield-captcha-admin-resources {
    background-color: #ffffff;
    padding: 24px;
    border-radius: 8px;
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.05), 0 1px 3px rgba(0, 0, 0, 0.1);
    border: none;
    box-sizing: border-box;
}

.botshield-captcha-admin-resources * {
    box-sizing: border-box;
}

.botshield-captcha-admin-resources .cf7-sidebar-title {
    font-size: 18px;
    font-weight: 600;
    color: #111827;
    margin-bottom: 16px;
    margin-top: 0;
    padding: 0;
    border: none;
    background: none;
}

.botshield-captcha-admin-resources .resource-list {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

/* Individual Button Styling */
.resource-item {
    display: flex;
    align-items: center;
    text-decoration: none;
    background-color: #ffffff;
    border: 1px solid #e5e7eb;
    border-radius: 6px;
    padding: 14px 16px;
    transition: background-color 0.2s ease, border-color 0.2s ease;
    width: 100%;
    box-shadow: none;
}

/* Hover Effect */
.resource-item:hover {
    background-color: #f9fafb;
    border-color: #d1d5db;
    transform: none;
    box-shadow: none;
}

/* Icon Container */
.resource-item .icon {
    display: flex;
    align-items: center;
    justify-content: center;
    margin-right: 14px;
    width: 20px;
    height: 20px;
    flex-shrink: 0;
}

/* Text Styling */
.resource-item .text {
    font-size: 15px;
    color: #1f2937;
    font-weight: 400;
    line-height: normal;
}

/* Specific Icon Colors based on screenshot */
.resource-item .icon-blue { color: #3b82f6; }   /* Blue for Documentation */
.resource-item .icon-purple { color: #9333ea; } /* Purple for Support */
.resource-item .icon-green { color: #22c55e; }  /* Green for Review */
.resource-item .icon-dark { color: #1f2937; }   /* Dark for Community */

/* Remove any dashicon or pseudo-element styles from previous implementation */
.resource-item::after {
    content: none;
}

/* Tag Generator Pane (CF7 Popup) - Standardized */
.botshield-tg-pane {
    padding: 0;
}

.botshield-tg-pane legend {
    font-weight: 600;
    margin-bottom: 10px;
}

.botshield-tg-pane select.oneline, 
.botshield-tg-pane input.oneline {
    width: 240px;
}

/* CF7 Editor - CAPTCHA Button High Visibility/Perfect Design */
button[data-target="tag-generator-panel-captcha"],
a.wpcf7-tg-generator.captcha {
    background: #6366F1;
    color: #FFFFFF;
    border: 1px solid #6366F1;
    padding: 2px 12px;
    border-radius: 4px;
    font-weight: 600;
    font-size: 13px;
    display: inline-flex;
    align-items: center;
    transition: all 0.2s ease;
    box-shadow: 0 1px 2px rgba(99, 102, 241, 0.2);
    cursor: pointer;
    height: 28px;
    line-height: 1;
    text-decoration: none;
    margin: 0 2px;
}

button[data-target="tag-generator-panel-captcha"]:hover,
a.wpcf7-tg-generator.captcha:hover {
    background: #4F46E5;
    border-color: #4338CA;
    box-shadow: 0 2px 4px rgba(99, 102, 241, 0.3);
    color: #FFFFFF;
}

/* Pro Upsell Card Design */
.botshield-pro-card {
    background: #1F2937; /* Dark cool gray - almost black */
    border-radius: 12px;
    padding: 24px;
    position: relative;
    overflow: hidden;
    color: #FFFFFF;
    box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    border: 1px solid #374151;
}

/* Background Icon */
.botshield-pro-bg-icon {
    position: absolute;
    top: -20px;
    right: -20px;
    opacity: 0.1;
    transform: rotate(15deg);
    pointer-events: none;
    color: #FFFFFF;
}

/* Pro Badge */
.botshield-pro-badge {
    display: inline-block;
    background-color: rgba(251, 191, 36, 0.1);
    color: #FBBF24; /* Amber 400 */
    border: 1px solid rgba(251, 191, 36, 0.2);
    border-radius: 6px;
    padding: 4px 8px;
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    margin-bottom: 16px;
}

/* Title */
.botshield-pro-card h3 {
    margin: 0 0 12px 0;
    font-size: 20px;
    font-weight: 700;
    color: #FFFFFF;
    line-height: 1.3;
}

/* Description */
.botshield-pro-card p {
    margin: 0 0 24px 0;
    font-size: 14px;
    line-height: 1.6;
    color: #D1D5DB; /* Gray 300 */
}

/* Button */
.botshield-pro-btn {
    display: inline-flex;
    align-items: center;
    background-color: #6366F1; /* Indigo 500 (Brand Primary) */
    color: #FFFFFF;
    font-weight: 600;
    font-size: 15px;
    padding: 12px 24px;
    border-radius: 8px;
    text-decoration: none;
    transition: all 0.2s ease;
    width: 100%;
    justify-content: center;
    border: 1px solid transparent;
}

.botshield-pro-btn:hover {
    background-color: #4F46E5; /* Indigo 600 */
    color: #FFFFFF;
    transform: translateY(-1px);
    box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
}

.botshield-pro-btn:active {
    transform: translateY(0);
}

.botshield-pro-btn:focus {
    outline: none;
    box-shadow: 0 0 0 3px rgba(99, 102, 241, 0.3);
}

/* Footer */
.botshield-captcha-admin-footer {
    text-align: center;
    margin-top: 40px;
    color: #6B7280;
    font-size: 13px;
}

/* --- New Implementation Guide Styles --- */

/* Badge/Number Circle */
.cf7-guide-step {
    flex-direction: row; /* Override previous column layout */
    gap: 20px;
    align-items: flex-start;
}

.step-number {
    flex-shrink: 0;
    width: 32px;
    height: 32px;
    background-color: #4F46E5;
    color: #ffffff;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 700;
    font-size: 14px;
    box-shadow: 0 2px 4px rgba(79, 70, 229, 0.2);
}

.step-content {
    flex-grow: 1;
}

.step-content h3 {
    margin: 0 0 8px 0;
    font-size: 16px;
    font-weight: 600;
    color: #111827;
}

.step-content p {
    margin: 0 0 16px 0 !important; /* Override specificity */
    color: #4B5563;
    font-size: 14px; /* Increased from 13px */
}

/* Code Block & Copy Button */
.botshield-code-block {
    display: flex;
    align-items: center;
    background: #F9FAFB;
    border: 1px dashed #D1D5DB; /* Dashed border as per image */
    border-radius: 6px;
    padding: 2px; /* Small padding */
    gap: 12px;
    max-width: 600px;
    justify-content: space-between;
}

.botshield-code-block code {
    background: transparent;
    padding: 12px 16px;
    color: #374151;
    font-family: monospace;
    font-size: 14px;
    font-weight: 500;
    flex-grow: 1;
}

.botshield-copy-btn {
    margin: 6px !important;
    background: #4F46E5 !important;
    color: #ffffff !important;
    border: none !important;
    border-radius: 4px !important;
    padding: 6px 16px !important;
    display: inline-flex !important;
    align-items: center;
    gap: 6px;
    font-weight: 500 !important;
    transition: background 0.2s;
}

.botshield-copy-btn:hover {
    background: #4338CA !important;
}

.botshield-copy-btn .dashicons {
    font-size: 18px;
    width: 18px;
    height: 18px;
    margin: 0;
}

.copy-success-msg {
    color: #10B981;
    font-weight: 600;
    font-size: 13px;
    margin-right: 12px;
    animation: fadeIn 0.2s ease-out;
}

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

/* Info Box */
.botshield-info-box {
    background-color: #EFF6FF; /* Blue 50 */
    border: 1px solid #DBEAFE; /* Blue 200 */
    border-radius: 6px;
    padding: 16px;
    display: flex;
    gap: 12px;
    align-items: flex-start;
}

.botshield-info-box .dashicons {
    color: #3B82F6; /* Blue 500 */
    font-size: 20px;
    width: 20px;
    height: 20px;
    margin-top: 2px;
}

.botshield-info-box p {
    margin: 0 !important;
    color: #1E40AF; /* Blue 800 */
    font-size: 13px;
}

/* Check List */
.botshield-check-list {
    margin: 0;
    padding: 0;
    list-style: none;
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.botshield-check-list li {
    display: flex;
    align-items: center;
    gap: 10px;
    font-size: 14px;
    color: #374151;
}

.botshield-check-list .dashicons {
    color: #10B981; /* Green 500 */
    font-size: 18px;
    width: 18px;
    height: 18px;
}

/* Header Lightbulb Icon specific style override if needed */
.cf7-guide-header h2 .dashicons {
    color: #4F46E5;
    margin-right: 8px;
    font-size: 24px;
    width: 24px;
    height: 24px;
}

/* Review Notice Styling */
.botshield-review-notice {
    position: relative;
    padding: 20px !important;
    border: none !important;
    border-left: 4px solid #6366F1 !important;
    box-shadow: 0 1px 4px rgba(0,0,0,0.1) !important;
    background: #FFFFFF !important;
}

.botshield-review-content {
    display: flex;
    align-items: flex-start;
    gap: 16px;
    margin-bottom: 16px;
}

.botshield-review-icon {
    flex-shrink: 0;
}

.botshield-review-icon-inner {
    background: #EEF2FF;
    color: #6366F1;
    width: 48px;
    height: 48px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
}

.botshield-review-icon-inner .dashicons {
    font-size: 24px;
    width: 24px;
    height: 24px;
}

.botshield-review-text {
    flex-grow: 1;
}

.botshield-review-text h3 {
    margin: 0 0 8px 0 !important;
    font-size: 16px !important;
    font-weight: 600 !important;
    color: #111827 !important;
}

.botshield-review-text p {
    margin: 0 !important;
    font-size: 14px !important;
    color: #4B5563 !important;
    line-height: 1.5 !important;
}

.botshield-review-actions {
    display: flex;
    align-items: center;
    gap: 10px;
    padding-left: 64px;
}

.botshield-review-action[data-action="rate"] {
    background: #6366F1 !important;
    color: white !important;
    border-color: #6366F1 !important;
    font-weight: 600 !important;
    padding: 6px 16px !important;
    text-decoration: none !important;
    box-shadow: none !important;
    border-radius: 6px !important;
    line-height: 2 !important;
    height: auto !important;
}

.botshield-review-action[data-action="already_did"] {
    background: #F3F4F6 !important;
    color: #374151 !important;
    border: 1px solid #D1D5DB !important;
    font-weight: 500 !important;
    padding: 6px 16px !important;
    box-shadow: none !important;
    border-radius: 6px !important;
    line-height: 2 !important;
    height: auto !important;
}

.botshield-review-action[data-action="later"] {
    color: #6B7280 !important;
    text-decoration: none !important;
    font-size: 14px !important;
    padding: 6px 12px !important;
    border-radius: 6px !important;
}

.botshield-radio-group {
    display: flex;
    gap: 15px;
    align-items: center;
}
/* Plugins Page: Rate Us Highlight */
.botshield-rate-link {
    font-weight: 700 !important;
    color: #6366F1 !important;
}

.botshield-rate-link:hover {
    color: #4F46E5 !important;
}


/* Utility: Hidden Class */
.botshield-hidden {
    display: none !important;
}

/* --- Our Plugins Page (100% Lite Parity) --- */
.botshield-our-plugins-wrap {
    padding: 40px;
    max-width: 1400px;
    margin: 0 auto;
}

.botshield-our-plugins-wrap .botshield-header {
    margin-bottom: 20px;
}

.botshield-our-plugins-wrap .botshield-logo-section {
    display: flex;
    align-items: center;
    gap: 0;
}

.botshield-our-plugins-wrap .botshield-title-group h1 {
    margin: 0;
    font-size: 32px;
    font-weight: 700;
    color: #101010;
    letter-spacing: -0.025em;
}

.botshield-our-plugins-wrap .botshield-title-group .botshield-subtitle {
    font-size: 18px;
    color: #475569;
    max-width: 700px;
}

.botshield-plugins-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 30px;
    margin-top: 20px;
}

.botshield-plugin-card {
    background: #fff;
    border: 1px solid #e5e7eb;
    border-radius: 16px;
    padding: 30px;
    display: flex;
    flex-direction: column;
    gap: 20px;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    position: relative;
    overflow: hidden;
}

.botshield-plugin-card:hover {
    transform: translateY(-5px);
    border-color: #3b82f6; /* Changed var(--aips-primary) to actual color to prevent missing var issue */
    box-shadow: none;
}

.botshield-plugin-pro {
    background: linear-gradient(180deg, #ffffff 0%, #f9fafb 100%);
}

.botshield-plugin-badge-top {
    position: absolute;
    top: 15px;
    right: -35px;
    background: #101010;
    color: #fff;
    font-size: 11px;
    font-weight: 700;
    padding: 4px 40px;
    transform: rotate(45deg);
    text-transform: uppercase;
    letter-spacing: 0.5px;
    z-index: 1;
}

.botshield-plugin-badge-top.botshield-badge-discount {
    background: #ef4444;
}

.botshield-plugin-icon {
    width: 64px;
    height: 64px;
    border-radius: 14px;
    background: transparent;
    padding: 0;
    display: flex;
    align-items: center;
    justify-content: center;
}

.botshield-plugin-icon img {
    width: 100%;
    height: auto;
    border-radius: 4px;
}

.botshield-plugin-info h3 {
    margin: 0 0 10px 0;
    font-size: 20px;
    font-weight: 700;
    color: #101010;
}

.botshield-plugin-info p {
    margin: 0;
    font-size: 15px;
    line-height: 1.6;
    color: #646970; /* Replaced var(--aips-text-secondary) */
    min-height: 72px;
}

.botshield-plugin-footer {
    margin-top: auto;
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding-top: 20px;
    border-top: 1px solid #f1f5f9;
}

.botshield-plugin-tags {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
}

.botshield-tag {
    font-size: 10px;
    font-weight: 600;
    padding: 3px 8px;
    border-radius: 6px;
    text-transform: uppercase;
}

.botshield-tag-free { background: #dcfce7; color: #166534; }
.botshield-tag-pro { background: #fef9c3; color: #854d0e; }
.botshield-tag-woo { background: #f3e8ff; color: #6b21a8; }
.botshield-tag-hot { background: #fee2e2; color: #991b1b; }
.botshield-tag-security { background: #dbeafe; color: #1e40af; }
.botshield-tag-form { background: #ecfdf5; color: #065f46; }
.botshield-tag-geo { background: #fff7ed; color: #9a3412; }
.botshield-tag-fraud { background: #fff1f2; color: #9f1239; }
.botshield-tag-price { background: #f0fdf4; color: #166534; }
.botshield-tag-ai { background: #eff6ff; color: #1e40af; }

.botshield-plugin-footer .button {
    border-radius: 10px;
    font-weight: 700;
    padding: 8px 20px !important;
    transition: all 0.2s ease;
    border: none !important;
    text-transform: none;
    font-size: 14px !important;
    height: auto;
    line-height: 1.4;
}

.botshield-plugin-footer .button-primary,
.botshield-plugin-footer .button-secondary {
    background: #3b82f6 !important;
    color: #ffffff !important;
    box-shadow: 0 4px 10px rgba(59, 130, 246, 0.2) !important;
    text-decoration: none !important;
}

.botshield-plugin-footer .button-primary:hover,
.botshield-plugin-footer .button-secondary:hover {
    background: #2563eb !important;
    transform: translateY(-2px);
    box-shadow: 0 6px 15px rgba(37, 99, 235, 0.3) !important;
    color: #ffffff !important;
}

.botshield-btn-installing {
    opacity: 0.7 !important;
    pointer-events: none !important;
    cursor: wait !important;
}

.botshield-btn-activated {
    background: #ecfdf5 !important;
    color: #059669 !important;
    border: 1px solid #a7f3d0 !important;
    cursor: default;
    font-size: 13px !important;
    pointer-events: none;
    box-shadow: none !important;
    border-radius: 10px !important;
    padding: 8px 20px !important;
}

/* Bold Amber Menu Item */
#toplevel_page_wpcf7 ul.wp-submenu li a[href*="botshield-our-plugins"] {
    color: #f59e0b !important;
    font-weight: 700 !important;
}

.botshield-copyright-footer {
    text-align: center;
    padding: 30px 0 10px;
    font-size: 13px;
    color: #646970;
}

/* Toast Notification */
.botshield-toast {
    position: fixed;
    bottom: 30px;
    left: 50%;
    transform: translateX(-50%) translateY(100px);
    background: #1e293b;
    color: #fff;
    padding: 12px 24px;
    border-radius: 12px;
    font-size: 15px;
    font-weight: 500;
    z-index: 99999;
    box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.2);
    transition: all 0.4s cubic-bezier(0.34, 1.56, 0.64, 1);
    opacity: 0;
}

.botshield-toast.show {
    transform: translateX(-50%) translateY(0);
    opacity: 1;
}

@media (max-width: 782px) {
    .botshield-plugins-grid {
        grid-template-columns: 1fr;
    }
}