/**
Theme Name: igenetx
Author: Mohamed Sayed 
Author URI: http://wpastra.com/about/
Description: Astra is the fastest, fully customizable & beautiful theme suitable for blogs, personal portfolios and business websites. It is very lightweight (less than 50KB on frontend) and offers unparalleled speed. Built with SEO in mind, Astra comes with schema.org code integrated so search engines will love your site. Astra offers plenty of sidebar options and widget areas giving you a full control for customizations. Furthermore, we have included special features and templates so feel free to choose any of your favorite page builder plugin to create pages flexibly. Some of the other features: # WooCommerce Ready # Responsive # Compatible with major plugins # Translation Ready # Extendible with premium addons # Regularly updated # Designed, Developed, Maintained & Supported by Brainstorm Force. Looking for a perfect base theme? Look no further. Astra is fast, fully customizable and beautiful theme!
Version: 1.0.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: igenetx
Template: astra
*/



/* --- 1. Global Container and Card Styling --- */

/* Container for the whole tabbed structure (The main card) */
.wc-tabs-wrapper {
    margin: 40px auto;
    max-width: 550px; /* **INCREASED SIZE for a bigger card** */
    background-color: #0d111d; /* Very dark background for the card (closer to image_fc9fe4) */
    border-radius: 30px;
    padding: 40px; /* **INCREASED PADDING** */
    box-shadow: 0 5px 20px rgba(0, 0, 0, 0.5); 
    box-sizing: border-box;
    color: #ffffff; /* Default text color for the card */
}

/* Hide the default two-column layout divs */
.u-columns.col2-set {
    display: block !important;
}
/* Hide the original h2 headings */
.wc-tabs-wrapper h2 {
    display: none;
}


/* --- 2. Tab Switcher Styling (Login/Register Tabs) --- */

/* Tab list container */
.wc-tabs {
    list-style: none;
    padding: 0;
    margin: 0 0 30px 0;
    display: flex;
    border-bottom: none;
    background-color: #111111; /* Dark background for the tab switcher */
    border-radius: 15px;
    overflow: hidden;
    max-width: 90%; /* Keep the tab bar slightly narrower than the card if desired */
    margin-left: auto; /* Center the tab bar */
    margin-right: auto;
}

/* Individual tab item */
.wc-tabs li {
    flex: 1; 
    text-align: center;
}

/* Tab link styling */
.wc-tabs a {
    display: block;
    padding: 15px 15px; 
    text-decoration: none;
    color: #ffffff; 
    background: transparent; 
    border: none;
    transition: background-color 0.3s ease;
    font-weight: bold;
    font-size: 1.1em;
}

/* Active tab styling (Blue background) */
.wc-tabs li.active a {
    background: #4169e1; /* Your requested button color */
    color: #ffffff;
    border-radius: 15px;
    cursor: default;
}

/* Hover effect on inactive tabs (Darker background) */
.wc-tabs a:hover:not(.wc-tabs li.active a) { 
    background-color: #1a1a1a; /* Darker shade for hover */
    color: #ffffff;
}

/* --- 3. Form Alignment and Field Styling --- */

/* Tab content area (forms) */
.wc-tab {
    padding: 20px 0 0 0; 
}

/* Ensure form rows take up full width and have consistent spacing */
.woocommerce-form-row {
    margin-bottom: 25px; /* Consistent spacing between rows */
    width: 100%; /* **CRITICAL FOR ALIGNMENT** - make form row full width */
    clear: both; /* Prevent floating issues */
}

/* Label styling */
.woocommerce-form-row label {
    color: #ffffff; /* White text for labels */
    font-size: 1em; 
    display: block; /* Ensure label is on its own line */
    margin-bottom: 8px;
    font-weight: 500;
}

/* Input field styling */
.woocommerce-Input.input-text,
.woocommerce-form-row .select2-container .select2-selection--single { 
    /* The !important overrides are often needed to beat WooCommerce's inline/default styles */
    background-color: #111111 !important; /* Input field background (dark) */
    border: 1px solid #333333 !important; 
    color: #ffffff !important; /* Text inside fields (white) */
    border-radius: 10px !important; /* Rounded corners for input fields */
    padding: 15px !important; /* **INCREASED PADDING for larger fields** */
    width: 100% !important; /* **CRITICAL FOR ALIGNMENT** - make input full width */
    box-sizing: border-box; 
    line-height: 1.2; /* Better vertical alignment of text */
}

/* Required asterisk color (Red from your image) */
.woocommerce-form-row .required {
    color: #ff4500 !important;
}

/* Placeholder color */
.woocommerce-Input.input-text::placeholder {
    color: #cccccc !important;
    opacity: 0.6 !important;
}

/* --- 4. Button and Link Styling --- */

/* Primary button (Log in / Register) */
.woocommerce-button.button {
    background-color: #4169e1 !important;
    color: #ffffff !important;
    border: none !important;
    border-radius: 10px !important;
    padding: 15px 30px !important; /* **LARGER BUTTON PADDING** */
    font-size: 1.1em !important;
    font-weight: bold !important;
    cursor: pointer !important;
    transition: background-color 0.3s ease !important;
    width: auto !important; 
    min-width: 150px; /* Optional: ensures a minimum button width */
}

.woocommerce-button.button:hover {
    background-color: #325bc1 !important;
}

/* Checkbox and Remember me text */
.woocommerce-form__label-for-checkbox {
    color: #ffffff;
    font-size: 1em;
}

/* Lost password link */
.woocommerce-LostPassword {
    margin-top: 15px;
    text-align: right;
}
.woocommerce-LostPassword a {
    color: #4169e1;
    text-decoration: none;
    font-size: 0.95em;
    transition: color 0.3s ease;
}
.woocommerce-LostPassword a:hover {
    color: #6a8ce8;
}
.woocommerce-account .woocommerce-MyAccount-content {
    float: right;
    width: 100%;
}