/**
 * WooCommerce Styles for Best Shop Theme
 * 
 * This file contains all WooCommerce-specific styles for the Best Shop theme.
 * It includes styles for products, cart, checkout, account pages, and more.
 */

/* ==========================================================================
   WOOCOMMERCE GENERAL STYLES
   ========================================================================== */

.woocommerce {
    display: block;
}

.woocommerce-page .page-header .page-title {
    /* Custom page title styling */
}

/* ==========================================================================
   PRODUCT GRID STYLES
   ========================================================================== */

.woocommerce ul.products {
    margin: 0 0 1em;
    padding: 0;
    list-style: none outside;
    clear: both;
}

.woocommerce ul.products::before {
    content: none;
}

.woocommerce ul.products li.product {
    list-style: none outside;
    margin-bottom: 2em;
    text-align: center;
    position: relative;
}

.woocommerce ul.products li.product a {
    text-decoration: none;
}

.woocommerce ul.products li.product a.woocommerce-loop-product__link {
    display: block;
}

.woocommerce ul.products li.product a img {
    width: 100%;
    height: auto;
    display: block;
    margin: 0 0 1em;
    box-shadow: none;
}

.woocommerce ul.products li.product .woocommerce-loop-product__title {
    font-weight: 600;
    font-size: 0.9em;
    padding: 3px 0 10px;
    margin: 0;
}

.woocommerce ul.products li.product .price {
    color: var(--text-color);
    font-weight: 500;
    font-size: .857em;
    margin-bottom: .5em;
}

.woocommerce ul.products li.product .price del {
    opacity: 1;
}

.woocommerce ul.products li.product .price del bdi {
    opacity: 0.9;
    font-size: .857em;
}

.woocommerce ul.products li.product .price ins {
    margin-left: 10px;
}

.woocommerce ul.products li.product .price .woocommerce-Price-currencySymbol {
    font-size: 1em;
}

.woocommerce ul.products li.product .onsale {
    font-size: 0.778em;
    color: #ffffff;
    padding: 3px 5px;
    border-radius: 5px;
    background-color: var(--webtrain-btn-bg, var(--gbl-primary-color));
    position: absolute;
    right: 25px;
    top: 20px;
    font-weight: 400;
    z-index: 1;
    min-height: unset !important;
    min-width: unset !important;
    line-height: unset;
}

.woocommerce ul.products li.product .star-rating {
    font-size: .857em;
    margin: 0 auto .5em;
    float: none;
}

.woocommerce ul.products li.product .button {
    display: inline-block;
    margin-top: 1em;
}

.woocommerce ul.products li.product strong {
    display: block;
}

.woocommerce ul.products li.product .woocommerce-placeholder {
    border: 1px solid #f2f2f2;
}

/* ==========================================================================
   SINGLE PRODUCT STYLES
   ========================================================================== */

.woocommerce div.product {
    margin-bottom: 0;
    position: relative;
}

.woocommerce div.product .product_title {
    clear: none;
    margin-top: 0;
    padding: 0;
}

.woocommerce div.product p.price,
.woocommerce div.product span.price {
    color: var(--text-color);
}

.woocommerce div.product p.price ins,
.woocommerce div.product span.price ins {
    background: inherit;
    font-weight: 700;
    display: inline-block;
}

.woocommerce div.product p.price del,
.woocommerce div.product span.price del {
    opacity: .5;
    display: inline-block;
}

.woocommerce div.product p.stock {
    font-size: .92em;
}

.woocommerce div.product .woocommerce-product-rating {
    margin-bottom: 1.618em;
}

.woocommerce div.product div.images {
    margin-bottom: 2em;
}

.woocommerce div.product div.images img {
    display: block;
    width: 100%;
    height: auto;
    box-shadow: none;
}

.woocommerce div.product div.summary {
    margin-bottom: 2em;
}

.woocommerce div.product form.cart {
    margin-bottom: 2em;
}

.woocommerce div.product form.cart .button {
    vertical-align: middle;
    float: left;
}

.woocommerce div.product form.cart .variations {
    margin-bottom: 1em;
    border: 0;
    width: 100%;
}

.woocommerce div.product form.cart .variations td,
.woocommerce div.product form.cart .variations th {
    border: 0;
    line-height: 2em;
    vertical-align: top;
}

.woocommerce div.product form.cart .variations label {
    font-weight: 700;
    text-align: left;
}

.woocommerce div.product form.cart .variations select {
    max-width: 100%;
    min-width: 75%;
    display: inline-block;
    margin-right: 1em;
    appearance: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    padding-right: 3em;
    background: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgc3Ryb2tlPSJibGFjayIgc3Ryb2tlLXdpZHRoPSIyIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiIGNsYXNzPSJmZWF0aGVyIGZlYXRoZXItY2hldnJvbi1kb3duIj48cG9seWxpbmUgcG9pbnRzPSI2IDkgMTIgMTUgMTggOSI+PC9wb2x5bGluZT48L3N2Zz4=) no-repeat;
    background-size: 16px;
    -webkit-background-size: 16px;
    background-position: calc(100% - 12px) 50%;
    -webkit-background-position: calc(100% - 12px) 50%;
}

.woocommerce div.product form.cart .variations td.label {
    padding-right: 1em;
}

.woocommerce div.product form.cart .reset_variations {
    visibility: hidden;
    font-size: .83em;
}

.woocommerce div.product form.cart .wc-no-matching-variations {
    display: none;
}

.woocommerce div.product form.cart .group_table td.woocommerce-grouped-product-list-item__label {
    padding-right: 1em;
    padding-left: 1em;
}

.woocommerce div.product form.cart .group_table td {
    vertical-align: top;
    padding-bottom: .5em;
    border: 0;
}

.woocommerce div.product form.cart .group_table td:first-child {
    width: 4em;
    text-align: center;
}

.woocommerce div.product form.cart .group_table .wc-grouped-product-add-to-cart-checkbox {
    display: inline-block;
    width: auto;
    margin: 0 auto;
    transform: scale(1.5,1.5);
}

/* ==========================================================================
   PRODUCT TABS STYLES
   ========================================================================== */

.woocommerce div.product .woocommerce-tabs {
    margin: 2em 0;
}

.woocommerce div.product .woocommerce-tabs ul.tabs {
    list-style: none;
    padding: 0 0 0 1em;
    margin: 0 0 1.618em;
    overflow: hidden;
    position: relative;
}

.woocommerce div.product .woocommerce-tabs ul.tabs li {
    border: 1px solid #cfc8d8;
    background-color: #e9e6ed;
    color: #515151;
    display: inline-block;
    position: relative;
    z-index: 0;
    border-radius: 4px 4px 0 0;
    margin: 0 -5px;
    padding: 0 1em;
}

.woocommerce div.product .woocommerce-tabs ul.tabs li a {
    display: inline-block;
    padding: .5em 0;
    font-weight: 700;
    color: #515151;
    text-decoration: none;
}

.woocommerce div.product .woocommerce-tabs ul.tabs li a:hover {
    text-decoration: none;
    color: #6b6b6b;
}

.woocommerce div.product .woocommerce-tabs ul.tabs li.active {
    background: #fff;
    color: #515151;
    z-index: 2;
    border-bottom-color: #fff;
}

.woocommerce div.product .woocommerce-tabs ul.tabs li.active a {
    color: inherit;
    text-shadow: inherit;
}

.woocommerce div.product .woocommerce-tabs ul.tabs li.active::before {
    box-shadow: 2px 2px 0 #fff;
}

.woocommerce div.product .woocommerce-tabs ul.tabs li.active::after {
    box-shadow: -2px 2px 0 #fff;
}

.woocommerce div.product .woocommerce-tabs ul.tabs li::after,
.woocommerce div.product .woocommerce-tabs ul.tabs li::before {
    border: 1px solid #cfc8d8;
    position: absolute;
    bottom: -1px;
    width: 5px;
    height: 5px;
    content: " ";
    box-sizing: border-box;
}

.woocommerce div.product .woocommerce-tabs ul.tabs li::before {
    left: -5px;
    border-bottom-right-radius: 4px;
    border-width: 0 1px 1px 0;
    box-shadow: 2px 2px 0 #e9e6ed;
}

.woocommerce div.product .woocommerce-tabs ul.tabs li::after {
    right: -5px;
    border-bottom-left-radius: 4px;
    border-width: 0 0 1px 1px;
    box-shadow: -2px 2px 0 #e9e6ed;
}

.woocommerce div.product .woocommerce-tabs ul.tabs::before {
    position: absolute;
    content: " ";
    width: 100%;
    bottom: 0;
    left: 0;
    border-bottom: 1px solid #cfc8d8;
    z-index: 1;
}

.woocommerce div.product .woocommerce-tabs .panel {
    margin: 0 0 2em;
    padding: 0;
}

.woocommerce div.product .woocommerce-tabs .panel h2 {
    margin-top: 0;
    margin-bottom: 1em;
}

.woocommerce div.product .woocommerce-tabs .panel p {
    margin-bottom: 1em;
}

/* ==========================================================================
   STAR RATING STYLES
   ========================================================================== */

.woocommerce .star-rating {
    overflow: hidden;
    position: relative;
    height: 1em;
    width: 5.4em;
    font-family: star;
    line-height: 1;
    font-size: 0.7em;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 10px;
}

.woocommerce .star-rating::before {
    content: "sssss";
    color: #cfc8d8;
    float: left;
    top: 0;
    left: 0;
    position: absolute;
}

.woocommerce .star-rating span {
    overflow: hidden;
    float: left;
    top: 0;
    left: 0;
    position: absolute;
    padding-top: 1.5em;
}

.woocommerce .star-rating span::before {
    content: "SSSSS";
    top: 0;
    position: absolute;
    left: 0;
}

.woocommerce .products .star-rating {
    display: block;
    margin: 0 auto .5em;
    float: none;
}

.woocommerce .woocommerce-product-rating {
    line-height: 2;
    display: block;
}

.woocommerce .woocommerce-product-rating .star-rating {
    margin: .5em 4px 0 0;
    float: left;
}

/* ==========================================================================
   PAGINATION STYLES
   ========================================================================== */

.woocommerce nav.woocommerce-pagination {
    text-align: center;
}

.woocommerce nav.woocommerce-pagination ul {
    display: inline-block;
    white-space: nowrap;
    padding: 0;
    clear: both;
    border: 1px solid #cfc8d8;
    border-right: 0;
    margin: 1px;
}

.woocommerce nav.woocommerce-pagination ul li {
    border-right: 1px solid #cfc8d8;
    padding: 0;
    margin: 0;
    float: left;
    display: inline;
    overflow: hidden;
}

.woocommerce nav.woocommerce-pagination ul li a,
.woocommerce nav.woocommerce-pagination ul li span {
    margin: 0;
    text-decoration: none;
    padding: 0;
    line-height: 1;
    font-size: 1em;
    font-weight: 400;
    padding: .5em;
    min-width: 1em;
    display: block;
}

.woocommerce nav.woocommerce-pagination ul li a:focus,
.woocommerce nav.woocommerce-pagination ul li a:hover,
.woocommerce nav.woocommerce-pagination ul li span.current {
    background: #e9e6ed;
    color: #816f98;
}

.woocommerce nav.woocommerce-pagination .page-numbers {
    border: 0;
}

.woocommerce nav.woocommerce-pagination .page-numbers li {
    position: relative;
    height: 45px;
    width: 45px;
    background-color: var(--webtrain-btn-bg, var(--gbl-primary-color));
    color: var(--webtrain-btn-text, #ffffff);
    display: inline-block;
    margin: 0 3px;
    line-height: 45px;
    border-radius: 50%;
    transition: 0.3s ease all;
}

.woocommerce nav.woocommerce-pagination .page-numbers li span.page-numbers,
.woocommerce nav.woocommerce-pagination .page-numbers li a {
    background: var(--webtrain-btn-bg, var(--gbl-primary-color));
    color: var(--webtrain-btn-text, #ffffff);
    line-height: 26px;
    height: 45px;
    width: 45px;
    border: 1px solid var(--webtrain-btn-bg, var(--gbl-primary-color));
}

.woocommerce nav.woocommerce-pagination .page-numbers li span.page-numbers:hover,
.woocommerce nav.woocommerce-pagination .page-numbers li a:hover {
    background-color: var(--gbl-secondary-color);
    border: 1px solid var(--gbl-secondary-color);
}

.woocommerce nav.woocommerce-pagination .page-numbers li span.page-numbers.current {
    background-color: var(--gbl-secondary-color);
    border: 1px solid var(--gbl-secondary-color);
}

.woocommerce nav.woocommerce-pagination .page-numbers li a.next,
.woocommerce nav.woocommerce-pagination .page-numbers li a.prev {
    line-height: 22px;
}

/* ==========================================================================
   NOTICE STYLES
   ========================================================================== */

.woocommerce .woocommerce-notices-wrapper .woocommerce-message {
    border-top-color: var(--webtrain-btn-bg, var(--gbl-primary-color));
}

.woocommerce .woocommerce-notices-wrapper .wc-forward {
    background-color: var(--webtrain-btn-bg, var(--gbl-primary-color));
    color: var(--webtrain-btn-text, #ffffff);
}

.woocommerce-error,
.woocommerce-info,
.woocommerce-message {
    padding: 1em 2em 1em 3.5em;
    margin: 0 0 2em;
    position: relative;
    background-color: #f6f5f8;
    color: #515151;
    border-top: 3px solid #720eec;
    list-style: none outside;
    width: auto;
    word-wrap: break-word;
}

.woocommerce-error::after,
.woocommerce-error::before,
.woocommerce-info::after,
.woocommerce-info::before,
.woocommerce-message::after,
.woocommerce-message::before {
    content: " ";
    display: table;
}

.woocommerce-error::after,
.woocommerce-info::after,
.woocommerce-message::after {
    clear: both;
}

.woocommerce-error::before,
.woocommerce-info::before,
.woocommerce-message::before {
    font-family: WooCommerce;
    content: "\e028";
    display: inline-block;
    position: absolute;
    top: 1em;
    left: 1.5em;
}

.woocommerce-error .button,
.woocommerce-info .button,
.woocommerce-message .button {
    float: right;
}

.woocommerce-error li,
.woocommerce-info li,
.woocommerce-message li {
    list-style: none outside !important;
    padding-left: 0 !important;
    margin-left: 0 !important;
}

.woocommerce-message {
    border-top-color: #8fae1b;
}

.woocommerce-message::before {
    content: "\e015";
    color: #8fae1b;
}

.woocommerce-info {
    border-top-color: #1e85be;
}

.woocommerce-info::before {
    color: #1e85be;
}

.woocommerce-error {
    border-top-color: #b81c23;
}

.woocommerce-error::before {
    content: "\e016";
    color: #b81c23;
}

/* ==========================================================================
   BUTTON STYLES
   ========================================================================== */

.woocommerce a.button,
.woocommerce button.button,
.woocommerce input.button,
.woocommerce #respond input#submit {
    font-size: 100%;
    margin: 0;
    line-height: 1;
    cursor: pointer;
    position: relative;
    text-decoration: none;
    overflow: visible;
    padding: .618em 1em;
    font-weight: 700;
    border-radius: 3px;
    left: auto;
    color: #515151;
    background-color: #e9e6ed;
    border: 0;
    display: inline-block;
    background-image: none;
    box-shadow: none;
    text-shadow: none;
}

.woocommerce a.button:hover,
.woocommerce button.button:hover,
.woocommerce input.button:hover,
.woocommerce #respond input#submit:hover {
    background-color: #dcd7e2;
    text-decoration: none;
    background-image: none;
    color: #515151;
}

.woocommerce a.button.alt,
.woocommerce button.button.alt,
.woocommerce input.button.alt,
.woocommerce #respond input#submit.alt {
    background-color: #7f54b3;
    color: #fff;
    -webkit-font-smoothing: antialiased;
}

.woocommerce a.button.alt:hover,
.woocommerce button.button.alt:hover,
.woocommerce input.button.alt:hover,
.woocommerce #respond input#submit.alt:hover {
    background-color: #7249a4;
    color: #fff;
}

.woocommerce a.added_to_cart {
    padding-top: .5em;
    display: inline-block;
    font-size: 13px;
    padding-left: 5px;
    background-color: #ffffff59;
}

/* ==========================================================================
   CART STYLES
   ========================================================================== */

.woocommerce-cart table.cart img {
    width: 32px;
    height: auto;
    box-shadow: none;
}

.woocommerce-cart table.cart td,
.woocommerce-cart table.cart th {
    vertical-align: middle;
}

.woocommerce-cart table.cart td.actions .coupon .input-text {
    float: left;
    box-sizing: border-box;
    border: 1px solid #cfc8d8;
    padding: 6px 6px 5px;
    margin: 0 4px 0 0;
    outline: 0;
}

.woocommerce-cart table.cart input {
    margin: 0;
    vertical-align: middle;
}

.woocommerce-cart .wc-proceed-to-checkout {
    padding: 1em 0;
}

.woocommerce-cart .wc-proceed-to-checkout a.checkout-button {
    display: block;
    text-align: center;
    margin-bottom: 1em;
    font-size: 1.25em;
    padding: 1em;
}

/* ==========================================================================
   CHECKOUT STYLES
   ========================================================================== */

.woocommerce-checkout .page-title {
    margin-bottom: 1em;
}

.woocommerce-checkout .woocommerce-form-coupon-toggle .woocommerce-info {
    margin-bottom: 1em;
    padding: 1em 2em 1em 3.5em;
    position: relative;
    background-color: #f6f5f8;
    color: #515151;
    border-top: 3px solid #720eec;
}

.woocommerce-checkout .woocommerce-form-coupon-toggle .woocommerce-info::before {
    font-family: WooCommerce;
    content: "\e028";
    display: inline-block;
    position: absolute;
    top: 1em;
    left: 1.5em;
}

.woocommerce-checkout li::before {
    content: none;
}

/* ==========================================================================
   ACCOUNT STYLES
   ========================================================================== */

.woocommerce-account .woocommerce {
    margin-bottom: 2em;
}

.woocommerce-account .addresses .title {
    margin-bottom: 1em;
}

.woocommerce-account .addresses .title h3 {
    float: left;
    margin: 0;
}

.woocommerce-account .addresses .title .edit {
    float: right;
}

.woocommerce-account ol.commentlist.notes li.note p.meta {
    font-weight: 700;
    margin-bottom: 0;
}

.woocommerce-account ol.commentlist.notes li.note .description p:last-child {
    margin-bottom: 0;
}

.woocommerce-account ul.digital-downloads {
    margin-left: 0;
    padding-left: 0;
}

.woocommerce-account ul.digital-downloads li {
    list-style: none;
    margin-left: 0;
    padding-left: 0;
}

.woocommerce-account ul.digital-downloads li::before {
    font-family: WooCommerce;
    content: "\e00a";
    margin-right: .618em;
}

/* ==========================================================================
   WIDGET STYLES
   ========================================================================== */

.widget.woocommerce ul li {
    list-style: none;
}

.widget.woocommerce ul.product_list_widget li {
    padding: 4px 0;
    margin: 0;
    list-style: none;
}

.widget.woocommerce ul.product_list_widget li::after,
.widget.woocommerce ul.product_list_widget li::before {
    content: " ";
    display: table;
}

.widget.woocommerce ul.product_list_widget li::after {
    clear: both;
}

.widget.woocommerce ul.product_list_widget li a {
    display: block;
    font-weight: 700;
}

.widget.woocommerce ul.product_list_widget li img {
    float: right;
    margin-left: 4px;
    width: 32px;
    height: auto;
    box-shadow: none;
}

.widget.woocommerce ul.product_list_widget li dl {
    margin: 0;
    padding-left: 1em;
    border-left: 2px solid rgba(0,0,0,.1);
}

.widget.woocommerce ul.product_list_widget li dl::after,
.widget.woocommerce ul.product_list_widget li dl::before {
    content: " ";
    display: table;
}

.widget.woocommerce ul.product_list_widget li dl::after {
    clear: both;
}

.widget.woocommerce ul.product_list_widget li dl dd,
.widget.woocommerce ul.product_list_widget li dl dt {
    display: inline-block;
    float: left;
    margin-bottom: 1em;
}

.widget.woocommerce ul.product_list_widget li dl dt {
    font-weight: 700;
    padding: 0 0 .25em;
    margin: 0 4px 0 0;
    clear: left;
}

.widget.woocommerce ul.product_list_widget li dl dd {
    padding: 0 0 .25em;
}

.widget.woocommerce ul.product_list_widget li dl dd p:last-child {
    margin-bottom: 0;
}

.widget.woocommerce ul.product_list_widget li .star-rating {
    float: none;
}

.widget.woocommerce .widget_shopping_cart .total,
.widget.woocommerce.widget_shopping_cart .total {
    border-top: 3px double #e9e6ed;
    padding: 4px 0 0;
}

.widget.woocommerce .widget_shopping_cart .total strong,
.widget.woocommerce.widget_shopping_cart .total strong {
    min-width: 40px;
    display: inline-block;
}

.widget.woocommerce .widget_shopping_cart .cart_list li,
.widget.woocommerce.widget_shopping_cart .cart_list li {
    padding-left: 2em;
    position: relative;
    padding-top: 0;
}

.widget.woocommerce .widget_shopping_cart .cart_list li a.remove,
.widget.woocommerce.widget_shopping_cart .cart_list li a.remove {
    position: absolute;
    top: 0;
    left: 0;
}

.widget.woocommerce .widget_shopping_cart .buttons::after,
.widget.woocommerce .widget_shopping_cart .buttons::before,
.widget.woocommerce.widget_shopping_cart .buttons::after,
.widget.woocommerce.widget_shopping_cart .buttons::before {
    content: " ";
    display: table;
}

.widget.woocommerce .widget_shopping_cart .buttons::after,
.widget.woocommerce.widget_shopping_cart .buttons::after {
    clear: both;
}

.widget.woocommerce .widget_shopping_cart .buttons a,
.widget.woocommerce.widget_shopping_cart .buttons a {
    margin-right: 5px;
    margin-bottom: 5px;
}

/* ==========================================================================
   RESPONSIVE STYLES
   ========================================================================== */

@media (max-width: 767px) {
    .woocommerce .woocommerce-ordering {
        width: 100%;
        float: left;
    }
    
    .woocommerce ul.products li.product {
        width: 100%;
        margin-right: 0;
    }
    
    .woocommerce div.product form.cart .variations select {
        min-width: 100%;
        margin-right: 0;
    }
    
    .woocommerce div.product form.cart .variations td.label {
        padding-right: 0;
        padding-bottom: .5em;
    }
}

@media (max-width: 1440px) {
    .woocommerce .woocommerce-ordering select {
        font-size: 0.889em;
    }
}

/* ==========================================================================
   ERROR STYLES
   ========================================================================== */

.woocommerce-error li,
.woocommerce-info li,
.woocommerce-message li {
    list-style: none outside !important;
    padding-left: 50px !important;
    margin-left: 0 !important;
}

/* ==========================================================================
   MODERN LOGIN FORM OVERRIDES
   ========================================================================== */

/* Ensure modern login form styles take precedence */
.modern-login-container {
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
    min-height: 100vh;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 20px;
    font-family: inherit;
}

.modern-login-container * {
    box-sizing: border-box;
}

.modern-login-container {
    position: relative;
    z-index: 1;
}

.modern-login-container {
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
}

.modern-login-card {
    background: white;
    border-radius: 15px;
    box-shadow: 0 20px 40px rgba(0, 0, 0, 0.1);
    padding: 40px;
    width: 100%;
    max-width: 400px;
    text-align: center;
}

.modern-signin-btn {
    width: 100%;
    padding: 12px;
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
    color: white;
    border: none;
    border-radius: 8px;
    font-size: 16px;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.3s ease;
    margin-top: 20px;
}

.modern-signin-btn:hover {
    transform: translateY(-2px);
    box-shadow: 0 10px 20px rgba(0, 0, 0, 0.2);
}

.modern-input {
    width: 100%;
    padding: 12px 15px;
    border: 2px solid #e1e5e9;
    border-radius: 8px;
    font-size: 14px;
    transition: border-color 0.3s ease;
    margin-bottom: 15px;
}

.modern-input:focus {
    outline: none;
    border-color: #667eea;
    box-shadow: 0 0 0 3px rgba(102, 126, 234, 0.1);
}

.modern-checkbox {
    margin-right: 8px;
    transform: scale(1.2);
}

.modern-lost-password a,
.modern-signup-link a {
    color: #667eea;
    text-decoration: none;
    font-size: 14px;
    transition: color 0.3s ease;
}

.modern-lost-password a:hover,
.modern-signup-link a:hover {
    color: #764ba2;
    text-decoration: underline;
}

.modern-login-container .container {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 15px;
}

.modern-login-card {
    margin: 0 auto;
    position: relative;
    z-index: 2;
}

.modern-login-container .site-header,
.modern-login-container .site-footer {
    display: none !important;
}

.modern-login-container {
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
    min-height: 100vh;
}

@media (max-width: 768px) {
    .modern-login-card {
        padding: 30px 20px;
        margin: 10px;
    }
}

@media (max-width: 480px) {
    .modern-login-container {
        padding: 10px;
    }
    
    .modern-login-card {
        padding: 25px 15px;
    }
}