/*
 * variables.css — Global CSS Custom Property Defaults
 * =====================================================
 * Defines all CSS variables consumed by style.css with dark theme defaults.
 * Load order: variables.css → site.css → style.css → media.css → custom.css
 *
 * Per-store overrides:
 *   Brand colors   → site.css (loads after this, overrides brand variables)
 *   Component fixes → custom.css (loads last, highest priority)
 *
 * To implement a light theme for a store, override the structural variables
 * in site.css alongside the brand color variables.
 */

:root {

    /* =========================================================
     * Brand / Accent
     * ========================================================= */
    --mainColor: #e50000;
    --lightMainColor: #D8D8D8;

    /* =========================================================
     * Base
     * ========================================================= */
    --bodyBackgroundColor: #0c0c0c;
    --bodyColor: #ffffff;

    /* =========================================================
     * Sections
     * ========================================================= */
    --sectionBackground: #0c0c0c;         /* .library, .popularUpdates, .black, footer */
    --sectionBackgroundAlt: #181818;      /* .latestUpdates, .ourModels, .aboutSite, .gray, .page, .modelBioArea */

    /* =========================================================
     * Navigation
     * ========================================================= */
    --navLinkColor: #ffffff;
    --navSeparatorColor: #484848;
    --navJoinHoverBackground: #484848;

    /* =========================================================
     * Dropdown Menus
     * ========================================================= */
    --dropdownBackground: #181818;
    --dropdownBorderColor: #333333;
    --dropdownLinkHoverBackground: #333333;

    /* =========================================================
     * Content Cards / Blocks
     * ========================================================= */
    --cardBackground: #2b2b2b;
    --cardTextColor: #fdfcfc;
    --contentTitleColor: #ffffff;
    --addToCartBackground: #317533;

    /* =========================================================
     * Headings & Body Text
     * ========================================================= */
    --titleColor: #fdfcfc;
    --sectionBodyText: #848484;
    --infoBoxBodyText: #d4d4d4;

    /* =========================================================
     * View All Button
     * ========================================================= */
    --viewAllBackground: #484848;
    --viewAllColor: #ffffff;

    /* =========================================================
     * Select / Dropdown Element
     * ========================================================= */
    --selectBorderColor: #484848;
    --selectTextColor: #ffffff;
    --selectricBackground: #2b2b2b;
    --selectricLabelColor: #6d6c6c;

    /* =========================================================
     * Footer
     * ========================================================= */
    --footerBackground: #0c0c0c;
    --footerBorderColor: #181818;
    --footerLinkColor: #535353;
    --footerLinkHoverColor: #ffffff;

    /* =========================================================
     * Info / About Boxes
     * ========================================================= */
    --infoBoxBackground: #0c0c0c;
    --infoBoxBorderColor: #1e1e1e;

    /* =========================================================
     * Popups / Modals
     * ========================================================= */
    --popupBackground: #181818;
    --popupBorderColor: #2b2b2b;

    /* =========================================================
     * Form Elements
     * ========================================================= */
    --inputBackground: #2b2b2b;
    --inputTextColor: #ffffff;
    --inputLabelColor: #6d6c6c;
    --placeholderColor: #6d6c6c;
    --formBorderColor: #747474;
    --formTextColor: #747474;
    --loginBtnBackground: #181818;

    /* =========================================================
     * Search
     * ========================================================= */
    --searchBarBackground: #2b2b2b;

    /* =========================================================
     * Buttons (brand-level — override per store in site.css)
     * ========================================================= */
    --buttonBackground: #e50000;
    --buttonTextColor: #ffffff;
    --buttonHoverBackground: #7c0000;
    --buttonHoverTextColor: #ffffff;
    --linkColor: #ffffff;
    --linkHoverColor: #ffffff;

    /* =========================================================
     * Cart Buttons
     * ========================================================= */
    --cartButtonBackground: #e50000;
    --cartButtonColor: #ffffff;
    --cartColor: #ffffff;
    --cartButtonHoverBackground: #94161c;
    --removeCartButtonBackground: #94161c;
    --removeCartButtonColor: #ffffff;
    --removeCartButtonHoverBackground: #e50000;
    --removeCartColor: #fdfcfc;

    /* =========================================================
     * Wishlist Buttons
     * ========================================================= */
    --addWishlistButtonBackground: #94161c;
    --addWishlistButtonColor: #ffffff;
    --addWishlistButtonHoverBackground: red;
    --removeWishlistButtonBackground: #94161c;
    --removeWishlistButtonColor: #ffffff;
    --removeWishlistButtonHoverBackground: #000000;

    /* =========================================================
     * Download Buttons
     * ========================================================= */
    --downloadButtonBackground: red;
    --downloadButtonHoverBackground: #000000;
    --downloadButtonHoverColor: #ffffff;
    --downloadIconColor: #ffffff;

    /* =========================================================
     * Credits / Purchase
     * ========================================================= */
    --purchaseCreditsBoxHoverBackground: red;
    --purchaseCreditsBoxHoverColor: #ffffff;

    /* =========================================================
     * Gradients / Backgrounds
     * ========================================================= */
    --linearGradient: to bottom, #ed1212, #c41818;
    --linearBackground: #c41818;
    --joinAccessBackground: #ed1212;

    /* =========================================================
     * Text Tone Palette
     * ========================================================= */
    --lightText: #E6E6E6;
    --altLightText: #F2F2F2;
    --darkText: #010101;
    --altDarkText: #2c2c2c;
    --darkerText: #000000;

    /* =========================================================
     * Primary Button (checkout / login / join)
     * ========================================================= */
    --primaryButtonBackground: #e50000;
    --primaryButtonText: #F2F2F2;
    --primaryButtonBorder: #e50000;
    --primaryButtonHoverBackground: #7c0000;
    --primaryButtonHoverText: #ffffff;

    /* =========================================================
     * Secondary Button (cancel / back / continue)
     * ========================================================= */
    --secondaryButtonBackground: transparent;
    --secondaryButtonText: #e50000;
    --secondaryButtonBorder: #e50000;
    --secondaryButtonHoverBackground: #7c0000;
    --secondaryButtonHoverText: #F2F2F2;
    --secondaryButtonHoverBorder: #e50000;

    /* =========================================================
     * Pagination
     * ========================================================= */
    --paginationBackground: #313131;
    --paginationHoverBackground: #0c0c0c;
    --paginationColor: #ffffff;

    /* =========================================================
     * Alphabet Navigation
     * ========================================================= */
    --alphabetBackground: #313131;
    --alphabetHoverBackground: #0c0c0c;
    --alphabetColor: #ffffff;
    --alphabetDisabledBackground: #4b4b4b;
    --alphabetDisabledColor: #626262;

    /* =========================================================
     * Carousel / Slider Arrows
     * ========================================================= */
    --sliderArrowBackground: #2b2b2b;

    /* =========================================================
     * Utility
     * ========================================================= */
    --mutedColor: #6c757d;
    --disabledIconColor: #6c757d;
    --copyrightLinks: #535353;
    --copyrightLinksHover: #ffffff;
}