/* General Form Container */
#cod-dz-order-form-container {
    max-width: 500px;
    margin: 40px auto;
    padding: 30px;
    background-color: #ffffff;
    border-radius: 10px;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.1);
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
}

/* Form Title and Price */
#cod-dz-order-form-container h2 {
    text-align: center;
    font-size: 24px;
    margin-bottom: 10px;
    color: #333;
}

#cod-dz-order-form-container p {
    text-align: center;
    font-size: 20px;
    color: #007bff;
    margin-bottom: 25px;
    font-weight: bold;
}

/* Form Rows for Spacing */
.cod-dz-form .form-row {
    margin-bottom: 20px;
}

/* Labels */
.cod-dz-form label {
    display: block;
    margin-bottom: 8px;
    font-weight: 600;
    color: #555;
    font-size: 14px;
}

/* Input Fields and Textarea */
.cod-dz-form input[type="text"],
.cod-dz-form input[type="tel"],
.cod-dz-form input[type="number"],
.cod-dz-form textarea {
    width: 100%;
    padding: 12px;
    border: 1px solid #ccc;
    border-radius: 5px;
    box-sizing: border-box;
    font-size: 16px;
    transition: border-color 0.3s;
}

.cod-dz-form input[type="text"]:focus,
.cod-dz-form input[type="tel"]:focus,
.cod-dz-form input[type="number"]:focus,
.cod-dz-form textarea:focus {
    border-color: #007bff;
    outline: none;
}

/* Radio Buttons for Delivery Method */
.cod-dz-form input[type="radio"] {
    margin-right: 8px;
}

.cod-dz-form .form-row label input[type="radio"] {
    display: inline-block;
    width: auto;
}

/* Submit Button */
#cod-dz-submit-button {
    width: 100%;
    padding: 15px;
    background-color: #28a745;
    color: #ffffff;
    border: none;
    border-radius: 5px;
    font-size: 18px;
    font-weight: bold;
    cursor: pointer;
    transition: background-color 0.3s;
}

#cod-dz-submit-button:hover {
    background-color: #218838;
}

/* Required Fields Asterisk */
.cod-dz-form .required {
    color: #dc3545;
}

/* Form Messages */
#cod-dz-form-messages {
    margin-top: 20px;
    padding: 15px;
    border-radius: 5px;
    display: none; /* Hidden by default */
}

#cod-dz-form-messages.success {
    background-color: #d4edda;
    color: #155724;
    display: block;
}

#cod-dz-form-messages.error {
    background-color: #f8d7da;
    color: #721c24;
    display: block;
}

/* Toast Notifications */
.cod-toast {
    position: fixed;
    bottom: 20px;
    left: 50%;
    transform: translateX(-50%);
    background-color: #333;
    color: #fff;
    padding: 15px 25px;
    border-radius: 8px;
    z-index: 1000;
    opacity: 0;
    transition: opacity 0.5s, bottom 0.5s;
    box-shadow: 0 4px 15px rgba(0,0,0,0.2);
    font-size: 16px;
    font-weight: 500;
}

.cod-toast.error {
    background-color: #e74c3c;
}

.cod-toast.success {
    background-color: #2ecc71;
}
/* COD DZ (modern, mobile-first) */
.cod-form-wrapper.cod-dz-modern{max-width:540px;margin:18px auto;padding:0 12px;font-family:system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif}
.cod-form-wrapper.cod-dz-modern .form-container{background:#fff;border:1px solid rgba(0,0,0,.08);border-radius:16px;box-shadow:0 10px 30px rgba(0,0,0,.07);overflow:hidden}

.cod-form-wrapper.cod-dz-modern .cod-dz-header{padding:18px 18px 10px;text-align:center;background:linear-gradient(180deg,#ffffff 0%,#fafafa 100%)}
.cod-form-wrapper.cod-dz-modern .cod-dz-title{margin:0;font-size:22px;font-weight:800;letter-spacing:.2px}
.cod-form-wrapper.cod-dz-modern .cod-dz-subtitle{margin:8px 0 0;color:#6b7280;font-size:14px;font-weight:600}

.cod-form-wrapper.cod-dz-modern .form-content{padding:14px 14px 18px;display:flex;flex-direction:column;gap:14px}

.cod-form-wrapper.cod-dz-modern .product-info{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:12px;border:1px solid rgba(0,0,0,.08);border-radius:14px;background:#fff}
.cod-form-wrapper.cod-dz-modern .product-name{margin:0;font-size:16px;font-weight:800}
.cod-form-wrapper.cod-dz-modern .product-price{font-weight:900;font-size:16px;color:#111827;white-space:nowrap}

.cod-form-wrapper.cod-dz-modern .cod-fields{display:grid;grid-template-columns:1fr;gap:12px}

.cod-form-wrapper.cod-dz-modern .cod-label{display:block;margin:0 0 6px;font-size:13px;font-weight:800;color:#111827}

.cod-form-wrapper.cod-dz-modern .cod-input-wrap{position:relative}
.cod-form-wrapper.cod-dz-modern .cod-input-wrap input,
.cod-form-wrapper.cod-dz-modern .cod-input-wrap select{
  width:100%;
  height:48px;
  border-radius:12px;
  border:1px solid rgba(0,0,0,.12);
  background:#fff;
  padding:0 44px 0 12px; /* right icon space (rtl) */
  font-size:16px;
  outline:none;
  box-shadow:0 1px 0 rgba(0,0,0,.02);
}
.cod-form-wrapper.cod-dz-modern .cod-input-wrap select{appearance:none;-webkit-appearance:none}
.cod-form-wrapper.cod-dz-modern .cod-input-wrap input:focus,
.cod-form-wrapper.cod-dz-modern .cod-input-wrap select:focus{border-color:#111827;box-shadow:0 0 0 3px rgba(17,24,39,.08)}

/* Prefix for phone */
.cod-form-wrapper.cod-dz-modern .cod-prefix{
  position:absolute;
  left:10px;
  top:50%;
  transform:translateY(-50%);
  font-size:13px;
  font-weight:800;
  color:#111827;
  background:#f3f4f6;
  border:1px solid rgba(0,0,0,.08);
  padding:6px 10px;
  border-radius:999px;
  direction:ltr;
}
.cod-form-wrapper.cod-dz-modern .is-icon-phone input{padding-left:118px}

/* Icons (simple, lightweight) */
.cod-form-wrapper.cod-dz-modern .cod-input-wrap::after{
  content:"";
  position:absolute;
  right:10px;
  top:50%;
  transform:translateY(-50%);
  width:28px;height:28px;
  border-radius:10px;
  background:#f3f4f6;
  border:1px solid rgba(0,0,0,.08);
}
.cod-form-wrapper.cod-dz-modern .is-icon-user::after{content:"👤";display:flex;align-items:center;justify-content:center;font-size:14px}
.cod-form-wrapper.cod-dz-modern .is-icon-phone::after{content:"📞";display:flex;align-items:center;justify-content:center;font-size:14px}
.cod-form-wrapper.cod-dz-modern .is-icon-state::after{content:"🧾";display:flex;align-items:center;justify-content:center;font-size:14px}
.cod-form-wrapper.cod-dz-modern .is-icon-city::after{content:"🏙️";display:flex;align-items:center;justify-content:center;font-size:14px}
.cod-form-wrapper.cod-dz-modern .is-icon-pin::after{content:"📍";display:flex;align-items:center;justify-content:center;font-size:14px}

.cod-form-wrapper.cod-dz-modern .delivery-section{padding:12px;border:1px solid rgba(0,0,0,.08);border-radius:14px;background:#fff}
.cod-form-wrapper.cod-dz-modern .delivery-title{font-size:14px;font-weight:900;margin-bottom:10px}
.cod-form-wrapper.cod-dz-modern .radio-group{display:flex;gap:10px;flex-wrap:wrap}
.cod-form-wrapper.cod-dz-modern .radio-option{flex:1;min-width:180px;display:flex;align-items:center;gap:10px;border:1px solid rgba(0,0,0,.08);border-radius:12px;padding:10px;background:#fafafa}
.cod-form-wrapper.cod-dz-modern .radio-option input{accent-color:#111827}
.cod-form-wrapper.cod-dz-modern .radio-option label{font-weight:800}

.cod-form-wrapper.cod-dz-modern .cod-summary{padding:12px;border:1px solid rgba(0,0,0,.08);border-radius:14px;background:#fff}
.cod-form-wrapper.cod-dz-modern .price-row,
.cod-form-wrapper.cod-dz-modern .total-row{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:8px 0;border-bottom:1px dashed rgba(0,0,0,.08)}
.cod-form-wrapper.cod-dz-modern .total-row{border-bottom:none;padding-top:10px}
.cod-form-wrapper.cod-dz-modern .price-label,.cod-form-wrapper.cod-dz-modern .total-label{font-weight:900;color:#111827}
.cod-form-wrapper.cod-dz-modern .price-value{font-weight:900;color:#111827}
.cod-form-wrapper.cod-dz-modern .total-value{font-weight:1000;color:#111827;font-size:18px}

.cod-form-wrapper.cod-dz-modern .quantity-control{display:flex;align-items:center;justify-content:center;gap:12px}
.cod-form-wrapper.cod-dz-modern .qty-btn{width:44px;height:44px;border-radius:12px;border:1px solid rgba(0,0,0,.12);background:#fff;font-size:18px;font-weight:900;cursor:pointer}
.cod-form-wrapper.cod-dz-modern .qty-input{width:72px;height:44px;text-align:center;border-radius:12px;border:1px solid rgba(0,0,0,.12);font-size:16px;font-weight:900;background:#fff}

/* Sticky CTA like the screenshot */
.cod-form-wrapper.cod-dz-modern .cod-cta{
  position:sticky;
  bottom:10px;
  z-index:5;
  border:none;
  border-radius:14px;
  padding:14px 14px;
  background:#0b0b0d;
  color:#fff;
  font-size:16px;
  font-weight:1000;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  cursor:pointer;
  box-shadow:0 16px 30px rgba(0,0,0,.18);
}
.cod-form-wrapper.cod-dz-modern .cod-cta:disabled{opacity:.7;cursor:not-allowed}
.cod-form-wrapper.cod-dz-modern .cod-cta-total{font-weight:900;font-size:14px;opacity:.95;direction:rtl}
.cod-form-wrapper.cod-dz-modern .cod-cta-label{opacity:.85}

/* Hide any Woo add-to-cart leftovers */
form.cart, .single_add_to_cart_button, .add_to_cart_button, a.ajax_add_to_cart, .ct-woo-card-actions{display:none !important}

@media (min-width: 680px){
  .cod-form-wrapper.cod-dz-modern .cod-fields{grid-template-columns:1fr 1fr}
  .cod-form-wrapper.cod-dz-modern .cod-field:nth-child(5){grid-column:1 / -1}
}
/* Overrides to beat theme styles (Blocksy/Elementor) */
.cod-form-wrapper.cod-dz-modern .form-container{border-radius:18px !important}
.cod-form-wrapper.cod-dz-modern .cod-input-wrap input,
.cod-form-wrapper.cod-dz-modern .cod-input-wrap select{
  background:#fff !important;
  border:1px solid rgba(0,0,0,.14) !important;
}
.cod-form-wrapper.cod-dz-modern .cod-input-wrap::after{background:#f3f4f6 !important}

/* Make CTA look like screenshot (black sticky bar) */
.cod-form-wrapper.cod-dz-modern .submit-btn.cod-cta{
  background:#0b0b0d !important;
  color:#fff !important;
  border-radius:14px !important;
  min-height:54px !important;
  width:100% !important;
  display:flex !important;
  align-items:center !important;
  justify-content:space-between !important;
  gap:10px !important;
  position:sticky !important;
  bottom:12px !important;
  z-index:20 !important;
}
.cod-form-wrapper.cod-dz-modern .submit-btn.cod-cta *{color:#fff !important}

/* Summary alignment */
.cod-form-wrapper.cod-dz-modern .price-row,
.cod-form-wrapper.cod-dz-modern .total-row{direction:rtl}
.cod-form-wrapper.cod-dz-modern .price-value,
.cod-form-wrapper.cod-dz-modern .total-value{direction:ltr}

/* Remove extra theme button effects */
.cod-form-wrapper.cod-dz-modern button.submit-btn{box-shadow:0 16px 30px rgba(0,0,0,.18) !important}
