/* ============================================
   Product Page - Wishlist & Compare Buttons
   ============================================ */

/* Product social links container */
.product-social-links,
.product-info-main .product-social-links {
    margin-top: 15px !important;
}

/* Wishlist and Compare links on product page */
.product-social-links .action.towishlist,
.product-social-links .action.tocompare,
.product-info-main .action.towishlist,
.product-info-main .action.tocompare {
    background-color: transparent !important;
    border: 1px solid rgba(255, 255, 255, 0.2) !important;
    border-radius: 4px !important;
    color: #d6d6d6 !important;
    padding: 10px 16px !important;
    font-size: 13px !important;
    font-weight: 500 !important;
    text-decoration: none !important;
    display: inline-block !important;
    transition: all 0.2s ease !important;
}

.product-social-links .action.towishlist:hover,
.product-social-links .action.tocompare:hover,
.product-info-main .action.towishlist:hover,
.product-info-main .action.tocompare:hover {
    background-color: rgba(158, 195, 255, 0.1) !important;
    border-color: #9ec3ff !important;
    color: #9ec3ff !important;
}

/* Icons before the text */
.product-social-links .action.towishlist:before,
.product-social-links .action.tocompare:before,
.product-info-main .action.towishlist:before,
.product-info-main .action.tocompare:before {
    color: inherit !important;
}

/* ============================================
   Authentication Popup / Sign-In Modal
   ============================================ */

/* Auth popup dropdown (header sign-in) */
.authentication-dropdown {
    background-color: #0f1214 !important;
    border: 1px solid rgba(255, 255, 255, 0.14) !important;
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.5) !important;
}

/* Auth popup modal (checkout sign-in) */
.popup-authentication .modal-inner-wrap,
.popup-authentication .modal-content,
.popup-authentication .modal-header {
    background-color: #0f1214 !important;
    border-color: rgba(255, 255, 255, 0.14) !important;
}

.block-authentication {
    background-color: #0f1214 !important;
}

.block-authentication .block-title,
.block-authentication .block-title strong {
    color: #ffffff !important;
}

.block-authentication .block-content {
    background-color: transparent !important;
    color: #cfcfcf !important;
}

.block-authentication .block-content p {
    color: #cfcfcf !important;
}

.block-authentication .block-content ul li {
    color: #cfcfcf !important;
}

/* Auth popup form fields */
.block-authentication .form-login .fieldset,
.block-authentication .form.form-login .fieldset {
    background: transparent !important;
    border: none !important;
}

.block-authentication .field .label {
    color: #d6d6d6 !important;
}

.block-authentication input.input-text,
.block-authentication input[type="email"],
.block-authentication input[type="password"] {
    background-color: #0f1214 !important;
    border: 1px solid rgba(255, 255, 255, 0.14) !important;
    color: #ffffff !important;
}

.block-authentication input.input-text:focus,
.block-authentication input[type="email"]:focus,
.block-authentication input[type="password"]:focus {
    background-color: #0f1214 !important;
    border-color: rgba(116, 169, 255, 0.95) !important;
    color: #ffffff !important;
    box-shadow: 0 0 0 1px rgba(116, 169, 255, 0.4) !important;
}

/* Auth popup "or" divider */
.block-authentication .block-new-customer:before {
    background-color: #0f1214 !important;
    border-color: rgba(255, 255, 255, 0.14) !important;
    color: #bdbdbd !important;
}

/* Auth popup actions */
.block-authentication .actions-toolbar .secondary a {
    color: #9ec3ff !important;
}

.block-authentication .actions-toolbar .secondary a:hover {
    color: #e7f0ff !important;
}

/* ============================================
   Modal Popup - Generic Dark Theme
   ============================================ */
.modal-popup .modal-inner-wrap,
.modal-slide .modal-inner-wrap {
    background-color: #0f1214 !important;
    border: 1px solid rgba(255, 255, 255, 0.14) !important;
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.5) !important;
}

.modal-popup .modal-header,
.modal-slide .modal-header {
    background-color: #0f1214 !important;
    border-bottom: 1px solid rgba(255, 255, 255, 0.08) !important;
}

.modal-popup .modal-content,
.modal-slide .modal-content {
    background-color: #0f1214 !important;
    color: #cfcfcf !important;
}

.modal-popup .modal-footer,
.modal-slide .modal-footer {
    background-color: #0f1214 !important;
    border-top: 1px solid rgba(255, 255, 255, 0.08) !important;
}

.modal-popup .modal-title,
.modal-slide .modal-title {
    color: #ffffff !important;
}

.modal-popup .action-close:before,
.modal-slide .action-close:before {
    color: #bdbdbd !important;
}

.modal-popup .action-close:hover:before,
.modal-slide .action-close:hover:before {
    color: #ffffff !important;
}