/**
 * Enerix PowerCheck - WordPress Plugin Styles
 * Ultra-aggressive CSS to override EVERYTHING (Tailwind + WordPress themes)
 * MUST be loaded AFTER Tailwind CSS!
 */

/* === WRAPPER ISOLATION === */
.enerix-powercheck-wrapper {
    all: initial !important;
    display: block !important;
    width: 100% !important;
    max-width: 1100px !important;
    margin: 0 auto !important;
    padding: 0 !important;
    font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif !important;
    font-size: 16px !important;
    line-height: 1.5 !important;
    color: #282828 !important;
    -webkit-font-smoothing: antialiased !important;
    -moz-osx-font-smoothing: grayscale !important;
}

.enerix-powercheck-wrapper *,
.enerix-powercheck-wrapper *::before,
.enerix-powercheck-wrapper *::after {
    box-sizing: border-box !important;
}

/* === CONTAINER === */
.enerix-powercheck-container,
#enerix-powercheck-container,
div[id^="enerix-powercheck-"] {
    width: 100% !important;
    height: 680px !important;
    max-height: 680px !important;
    min-height: 680px !important;
    overflow: hidden !important;
    position: relative !important;
    background-color: #e1e9cb !important;
    background: #e1e9cb !important;
    margin: 0 !important;
    padding: 0 !important;
    border: none !important;
    border-radius: 20px !important;
    font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif !important;
    box-shadow: none !important;
}

/* === RESET ALL INSIDE CONTAINER === */
.enerix-powercheck-container *,
.enerix-powercheck-container *::before,
.enerix-powercheck-container *::after,
div[id^="enerix-powercheck-"] *,
div[id^="enerix-powercheck-"] *::before,
div[id^="enerix-powercheck-"] *::after {
    box-sizing: border-box !important;
    font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif !important;
}

/* === HEADINGS === */
.enerix-powercheck-container h1,
.enerix-powercheck-container h2,
.enerix-powercheck-container h3,
.enerix-powercheck-container h4,
.enerix-powercheck-container h5,
.enerix-powercheck-container h6,
div[id^="enerix-powercheck-"] h1,
div[id^="enerix-powercheck-"] h2,
div[id^="enerix-powercheck-"] h3 {
    font-weight: 700 !important;
    line-height: 1.2 !important;
    margin: 0 !important;
    padding: 0 !important;
    border: none !important;
    background: transparent !important;
    font-family: inherit !important;
}

/* === PARAGRAPHS === */
.enerix-powercheck-container p,
div[id^="enerix-powercheck-"] p {
    margin: 0 !important;
    padding: 0 !important;
    line-height: 1.5 !important;
    border: none !important;
    background: transparent !important;
}

/* === LABELS - CRITICAL === */
.enerix-powercheck-container label,
div[id^="enerix-powercheck-"] label {
    display: inline-flex !important;
    align-items: center !important;
    gap: 0.5rem !important;
    margin: 0 !important;
    padding: 0 !important;
    font-size: 11px !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.05em !important;
    color: #094a23 !important;
    font-family: inherit !important;
    line-height: 1 !important;
    cursor: default !important;
    border: none !important;
    background: transparent !important;
}

/* === INPUT FIELDS - ULTRA SPECIFIC === */
.enerix-powercheck-container input[type="text"],
.enerix-powercheck-container input[type="email"],
.enerix-powercheck-container input[type="tel"],
.enerix-powercheck-container input[type="number"],
div[id^="enerix-powercheck-"] input[type="text"],
div[id^="enerix-powercheck-"] input[type="email"],
div[id^="enerix-powercheck-"] input[type="tel"],
div[id^="enerix-powercheck-"] input[type="number"],
.enerix-powercheck-container input,
div[id^="enerix-powercheck-"] input {
    appearance: none !important;
    -webkit-appearance: none !important;
    -moz-appearance: none !important;
    width: 100% !important;
    display: block !important;
    margin: 0 !important;
    padding: 0.625rem 0.75rem !important;
    border: 1px solid #5e5e59 !important;
    border-radius: 0.75rem !important;
    background-color: #ffffff !important;
    background: #ffffff !important;
    color: #000000 !important;
    font-size: 0.875rem !important;
    font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif !important;
    font-weight: 400 !important;
    line-height: 1.5 !important;
    outline: none !important;
    transition: border-color 0.15s ease-in-out !important;
    box-shadow: none !important;
    min-height: 2.75rem !important;
    height: auto !important;
    text-transform: none !important;
    letter-spacing: normal !important;
}

/* Input focus state */
.enerix-powercheck-container input[type="text"]:focus,
.enerix-powercheck-container input[type="email"]:focus,
.enerix-powercheck-container input[type="tel"]:focus,
.enerix-powercheck-container input[type="number"]:focus,
div[id^="enerix-powercheck-"] input:focus {
    border: 2px solid #0d7c3d !important;
    padding: calc(0.625rem - 1px) calc(0.75rem - 1px) !important;
    outline: none !important;
    box-shadow: none !important;
    background-color: #ffffff !important;
    color: #000000 !important;
}

/* Placeholder */
.enerix-powercheck-container input::placeholder,
div[id^="enerix-powercheck-"] input::placeholder {
    color: #9ca3af !important;
    opacity: 1 !important;
}

/* Remove number spinners */
.enerix-powercheck-container input[type="number"]::-webkit-inner-spin-button,
.enerix-powercheck-container input[type="number"]::-webkit-outer-spin-button {
    -webkit-appearance: none !important;
    margin: 0 !important;
}

/* === BUTTONS - ULTRA SPECIFIC === */
.enerix-powercheck-container button,
div[id^="enerix-powercheck-"] button {
    appearance: none !important;
    -webkit-appearance: none !important;
    -moz-appearance: none !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 0.5rem !important;
    margin: 0 !important;
    padding: 0.875rem 1.5rem !important;
    border: none !important;
    border-radius: 0.5rem !important;
    background-color: #0d7c3d !important;
    background: #0d7c3d !important;
    color: #ffffff !important;
    font-size: 1rem !important;
    font-weight: 700 !important;
    font-family: inherit !important;
    line-height: 1 !important;
    cursor: pointer !important;
    transition: all 0.15s ease-in-out !important;
    text-transform: none !important;
    letter-spacing: normal !important;
    box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.1) !important;
    text-decoration: none !important;
}

.enerix-powercheck-container button:hover,
div[id^="enerix-powercheck-"] button:hover {
    background-color: #094a23 !important;
    background: #094a23 !important;
    transform: scale(1.02) !important;
}

.enerix-powercheck-container button:disabled,
div[id^="enerix-powercheck-"] button:disabled {
    background-color: #9ca3af !important;
    background: #9ca3af !important;
    cursor: not-allowed !important;
    opacity: 0.8 !important;
}

/* Red button variant (Analyse Starten) */
.enerix-powercheck-container button[class*="bg-[#DC0000]"],
.enerix-powercheck-container button[class*="bg-red"] {
    background-color: #DC0000 !important;
    background: #DC0000 !important;
}

.enerix-powercheck-container button[class*="bg-[#DC0000]"]:hover,
.enerix-powercheck-container button[class*="bg-red"]:hover {
    background-color: #b00000 !important;
    background: #b00000 !important;
}

/* === DIVS - CRITICAL LAYOUT RESET === */
.enerix-powercheck-container div,
div[id^="enerix-powercheck-"] div {
    border: none !important;
    margin: 0 !important;
    padding: 0 !important;
    max-width: none !important;
    width: auto !important;
}

/* === SPANS === */
.enerix-powercheck-container span,
div[id^="enerix-powercheck-"] span {
    display: inline !important;
    font-family: inherit !important;
    margin: 0 !important;
    padding: 0 !important;
}

/* === SVG ICONS === */
.enerix-powercheck-container svg,
div[id^="enerix-powercheck-"] svg {
    display: inline-block !important;
    vertical-align: middle !important;
    width: auto !important;
    height: auto !important;
}

/* === LINKS === */
.enerix-powercheck-container a,
div[id^="enerix-powercheck-"] a {
    font-family: inherit !important;
    text-decoration: underline !important;
}

/* === LISTS === */
.enerix-powercheck-container ul,
.enerix-powercheck-container ol,
div[id^="enerix-powercheck-"] ul,
div[id^="enerix-powercheck-"] ol {
    list-style: none !important;
    margin: 0 !important;
    padding: 0 !important;
}

/* === SCROLLBAR === */
.enerix-powercheck-container .custom-scrollbar::-webkit-scrollbar {
    width: 8px !important;
    height: 8px !important;
}

.enerix-powercheck-container .custom-scrollbar::-webkit-scrollbar-track {
    background: rgba(0, 0, 0, 0.05) !important;
    border-radius: 4px !important;
}

.enerix-powercheck-container .custom-scrollbar::-webkit-scrollbar-thumb {
    background: rgba(0, 0, 0, 0.2) !important;
    border-radius: 4px !important;
}

.enerix-powercheck-container .custom-scrollbar::-webkit-scrollbar-thumb:hover {
    background: rgba(0, 0, 0, 0.3) !important;
}

/* === FORCE CORRECT COLORS === */
.enerix-powercheck-container [class*="text-enerix-dark"],
div[id^="enerix-powercheck-"] [class*="text-enerix-dark"] {
    color: #094a23 !important;
}

.enerix-powercheck-container [class*="text-enerix-primary"],
div[id^="enerix-powercheck-"] [class*="text-enerix-primary"] {
    color: #0d7c3d !important;
}

.enerix-powercheck-container [class*="text-black"],
div[id^="enerix-powercheck-"] [class*="text-black"] {
    color: #000000 !important;
}

.enerix-powercheck-container [class*="text-gray"],
div[id^="enerix-powercheck-"] [class*="text-gray"] {
    color: #5e5e59 !important;
}

/* === FORCE CORRECT BACKGROUNDS === */
.enerix-powercheck-container [class*="bg-white"],
div[id^="enerix-powercheck-"] [class*="bg-white"] {
    background-color: #ffffff !important;
    background: #ffffff !important;
}

.enerix-powercheck-container [class*="bg-enerix-primary"],
div[id^="enerix-powercheck-"] [class*="bg-enerix-primary"] {
    background-color: #0d7c3d !important;
    background: #0d7c3d !important;
}

/* === REMOVE ALL THEME OVERRIDES === */
.enerix-powercheck-container *[style],
div[id^="enerix-powercheck-"] *[style] {
    /* Let inline styles work but override with our CSS */
}

/* === CRITICAL: Remove max-width from theme === */
.enerix-powercheck-container > *,
div[id^="enerix-powercheck-"] > * {
    max-width: 100% !important;
}

/* === FORCE TAILWIND SPACING CLASSES === */
.enerix-powercheck-container [class*="p-"],
.enerix-powercheck-container [class*="px-"],
.enerix-powercheck-container [class*="py-"],
.enerix-powercheck-container [class*="pt-"],
.enerix-powercheck-container [class*="pb-"],
.enerix-powercheck-container [class*="pl-"],
.enerix-powercheck-container [class*="pr-"],
div[id^="enerix-powercheck-"] [class*="p-"],
div[id^="enerix-powercheck-"] [class*="px-"],
div[id^="enerix-powercheck-"] [class*="py-"],
div[id^="enerix-powercheck-"] [class*="pt-"],
div[id^="enerix-powercheck-"] [class*="pb-"],
div[id^="enerix-powercheck-"] [class*="pl-"],
div[id^="enerix-powercheck-"] [class*="pr-"] {
    /* Padding should come from Tailwind classes, not theme */
}

.enerix-powercheck-container [class*="m-"],
.enerix-powercheck-container [class*="mx-"],
.enerix-powercheck-container [class*="my-"],
.enerix-powercheck-container [class*="mt-"],
.enerix-powercheck-container [class*="mb-"],
.enerix-powercheck-container [class*="ml-"],
.enerix-powercheck-container [class*="mr-"],
div[id^="enerix-powercheck-"] [class*="m-"],
div[id^="enerix-powercheck-"] [class*="mx-"],
div[id^="enerix-powercheck-"] [class*="my-"],
div[id^="enerix-powercheck-"] [class*="mt-"],
div[id^="enerix-powercheck-"] [class*="mb-"],
div[id^="enerix-powercheck-"] [class*="ml-"],
div[id^="enerix-powercheck-"] [class*="mr-"] {
    /* Margin should come from Tailwind classes, not theme */
}

/* === FORCE FLEX LAYOUT === */
.enerix-powercheck-container [class*="flex"],
div[id^="enerix-powercheck-"] [class*="flex"] {
    display: flex !important;
}

.enerix-powercheck-container [class*="flex-col"],
div[id^="enerix-powercheck-"] [class*="flex-col"] {
    flex-direction: column !important;
}

.enerix-powercheck-container [class*="flex-row"],
div[id^="enerix-powercheck-"] [class*="flex-row"] {
    flex-direction: row !important;
}

.enerix-powercheck-container [class*="items-center"],
div[id^="enerix-powercheck-"] [class*="items-center"] {
    align-items: center !important;
}

.enerix-powercheck-container [class*="justify-center"],
div[id^="enerix-powercheck-"] [class*="justify-center"] {
    justify-content: center !important;
}

.enerix-powercheck-container [class*="gap-"],
div[id^="enerix-powercheck-"] [class*="gap-"] {
    /* Gap should come from Tailwind, ensure it's not overridden */
}

/* === FORCE WIDTH CLASSES === */
.enerix-powercheck-container [class*="w-full"],
div[id^="enerix-powercheck-"] [class*="w-full"] {
    width: 100% !important;
}

.enerix-powercheck-container [class*="h-full"],
div[id^="enerix-powercheck-"] [class*="h-full"] {
    height: 100% !important;
}

/* === FORCE POSITIONING === */
.enerix-powercheck-container [class*="relative"],
div[id^="enerix-powercheck-"] [class*="relative"] {
    position: relative !important;
}

.enerix-powercheck-container [class*="absolute"],
div[id^="enerix-powercheck-"] [class*="absolute"] {
    position: absolute !important;
}

/* === FORCE OVERFLOW === */
.enerix-powercheck-container [class*="overflow-hidden"],
div[id^="enerix-powercheck-"] [class*="overflow-hidden"] {
    overflow: hidden !important;
}

.enerix-powercheck-container [class*="overflow-y-auto"],
div[id^="enerix-powercheck-"] [class*="overflow-y-auto"] {
    overflow-y: auto !important;
}
