/**
 * WVTO Reset CSS
 * 
 * Scoped reset/normalize that only affects elements within the plugin.
 * This ensures plugin styles are independent of theme styles.
 * 
 * @package Woo_Virtual_Try_On
 * @since 2.0.0
 */

/* ==========================================================================
   Scoped Reset - Only affects .wvto-* elements
   ========================================================================== */

/**
 * Apply a scoped reset to all plugin elements.
 * Uses high specificity to override theme styles.
 */
[class*="wvto-"],
[class*="wvto-"] *,
[class*="wvto-"] *::before,
[class*="wvto-"] *::after {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
    border: 0;
    font-size: 100%;
    font-family: inherit;
    vertical-align: baseline;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

/**
 * Reset text elements
 */
[class*="wvto-"] h1,
[class*="wvto-"] h2,
[class*="wvto-"] h3,
[class*="wvto-"] h4,
[class*="wvto-"] h5,
[class*="wvto-"] h6 {
    font-size: inherit;
    font-weight: inherit;
    margin: 0;
    padding: 0;
    line-height: inherit;
}

[class*="wvto-"] p {
    margin: 0;
    padding: 0;
}

[class*="wvto-"] a {
    color: inherit;
    text-decoration: none;
    background-color: transparent;
}

[class*="wvto-"] a:hover,
[class*="wvto-"] a:focus {
    outline: none;
}

/**
 * Reset lists
 */
[class*="wvto-"] ul,
[class*="wvto-"] ol {
    list-style: none;
    margin: 0;
    padding: 0;
}

/**
 * Reset images and media
 */
[class*="wvto-"] img,
[class*="wvto-"] video,
[class*="wvto-"] canvas {
    display: block;
    max-width: 100%;
    height: auto;
    border: 0;
}

/**
 * Reset buttons - Very important! 
 * Theme buttons often have aggressive styles.
 */
[class*="wvto-"] button,
[class*="wvto-"] .wvto-btn,
.wvto-btn {
    appearance: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    background: none;
    border: none;
    border-radius: 0;
    color: inherit;
    cursor: pointer;
    font-family: inherit;
    font-size: inherit;
    font-weight: inherit;
    line-height: inherit;
    margin: 0;
    padding: 0;
    text-align: center;
    text-decoration: none;
    text-transform: none;
    white-space: nowrap;
    width: auto;
    outline: none;
    box-shadow: none;
}

[class*="wvto-"] button:hover,
[class*="wvto-"] button:focus,
[class*="wvto-"] button:active,
.wvto-btn:hover,
.wvto-btn:focus,
.wvto-btn:active {
    outline: none;
    box-shadow: none;
}

/**
 * Reset form elements
 */
[class*="wvto-"] input,
[class*="wvto-"] textarea,
[class*="wvto-"] select {
    appearance: none;
    -webkit-appearance: none;
    background: none;
    border: none;
    border-radius: 0;
    color: inherit;
    font-family: inherit;
    font-size: inherit;
    margin: 0;
    padding: 0;
    outline: none;
}

[class*="wvto-"] input:focus,
[class*="wvto-"] textarea:focus,
[class*="wvto-"] select:focus {
    outline: none;
    box-shadow: none;
}

[class*="wvto-"] input[type="file"] {
    cursor: pointer;
}

/**
 * Reset tables (if used)
 */
[class*="wvto-"] table {
    border-collapse: collapse;
    border-spacing: 0;
}

/**
 * Ensure proper font rendering
 */
[class*="wvto-"] {
    text-rendering: optimizeLegibility;
    -webkit-text-size-adjust: 100%;
    -moz-text-size-adjust: 100%;
    text-size-adjust: 100%;
}
