/**
 * InstaRestaurant SaaS Checkout Styling
 * Modular & Focused
 */

/* Hintergrund für die gesamte Seite */
body.woocommerce-checkout, 
body.woocommerce-cart {
    background-color: #f4f7f6 !important;
    color: #333;
}

/* Entferne unnötige Theme-Elemente (Sidebars/Header-Bilder) */
.woocommerce-checkout .sidebar, 
.woocommerce-cart .sidebar {
    display: none !important;
}

/* Der Haupt-Container */
.woocommerce-checkout .content-area,
.woocommerce-cart .content-area {
    max-width: 900px !important;
    margin: 40px auto !important;
    float: none !important;
}

/* SaaS Karten-Look für Formulare */
.woocommerce-checkout #customer_details, 
#order_review,
.woocommerce-cart-form {
    background: #ffffff !important;
    padding: 30px !important;
    border-radius: 16px !important;
    box-shadow: 0 4px 25px rgba(0,0,0,0.06) !important;
    border: 1px solid #eef1f0 !important;
    margin-bottom: 30px !important;
}

/* Input Felder */
.woocommerce-checkout input[type="text"], 
.woocommerce-checkout input[type="email"], 
.woocommerce-checkout input[type="tel"], 
.woocommerce-checkout textarea {
    border: 1px solid #dce0df !important;
    border-radius: 8px !important;
    padding: 14px !important;
    background-color: #fff !important;
    font-size: 15px !important;
    transition: border-color 0.2s ease;
}

.woocommerce-checkout input:focus {
    border-color: #27ae60 !important;
    outline: none !important;
}

/* Bestell-Übersicht Tabelle */
table.shop_table {
    border: none !important;
    border-radius: 0 !important;
}

table.shop_table tr {
    border-bottom: 1px solid #f0f0f0 !important;
}

.cart-subtotal, .order-total {
    background: #f9fbfb !important;
}

/* Payment Bereich */
#payment {
    background: transparent !important;
    border-radius: 0 !important;
}

#payment ul.payment_methods {
    border-bottom: none !important;
    padding: 0 !important;
}

.wc_payment_method {
    background: #fff !important;
    border: 1px solid #eef1f0 !important;
    margin-bottom: 12px !important;
    border-radius: 10px !important;
    padding: 15px !important;
}

/* Der "Kaufen" Button */
#place_order {
    background-color: #1a1a1a !important; /* Schwarz passend zum Floating Cart */
    color: #ffffff !important;
    width: 100% !important;
    padding: 20px !important;
    font-size: 18px !important;
    font-weight: 700 !important;
    border-radius: 12px !important;
    text-transform: uppercase;
    letter-spacing: 1px;
    border: none !important;
    transition: all 0.3s ease !important;
}

#place_order:hover {
    background-color: #27ae60 !important; /* Wechselt zu Grün bei Hover */
    transform: translateY(-2px);
}