/* ──────────────────────────────────────────────────────────
   ASTRO — النوافذ المنبثقة
   ──────────────────────────────────────────────────────────
   نافذة الدخول، نافذة الطلب، صفحة الطلبات، وتنسيق الفاتورة المطبوعة.
────────────────────────────────────────────────────────── */

    /* ══════════════════════════════════
       MODAL — تسجيل دخول / إنشاء حساب
    ══════════════════════════════════ */
    .modal-overlay{display:none;position:fixed;inset:0;background:rgba(5,5,15,0.92);backdrop-filter:blur(12px);z-index:1000;align-items:center;justify-content:center}
    .modal-overlay.open{display:flex}
    .modal{background:rgba(14,14,30,0.97);border:1px solid rgba(138,77,255,0.3);border-radius:12px;padding:40px;width:90%;max-width:420px}
    .modal-title{font-family:'Orbitron',sans-serif;font-size:1rem;font-weight:900;letter-spacing:3px;background:linear-gradient(135deg,#fff,#C084FC);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;margin-bottom:28px;text-align:center}
    .modal-tabs{display:flex;gap:0;margin-bottom:28px;border:1px solid rgba(138,77,255,0.2);border-radius:6px;overflow:hidden}
    .modal-tab{flex:1;padding:10px;background:transparent;border:none;color:rgba(242,242,247,0.5);font-family:'Cairo',sans-serif;font-size:0.88rem;font-weight:600;cursor:pointer;transition:background 0.2s,color 0.2s}
    .modal-tab.active{background:rgba(138,77,255,0.25);color:#fff}
    .modal-input{width:100%;background:rgba(10,5,25,0.8);border:1px solid rgba(138,77,255,0.18);border-radius:5px;padding:12px 15px;color:var(--wh);font-family:'Cairo',sans-serif;font-size:0.9rem;outline:none;transition:border-color 0.25s;margin-bottom:12px}
    .modal-input:focus{border-color:var(--pm)}
    .modal-input::placeholder{color:rgba(242,242,247,0.28)}
    .modal-btn{width:100%;padding:13px;background:linear-gradient(135deg,var(--pd),var(--pm));border:none;border-radius:5px;color:#fff;font-family:'Orbitron',sans-serif;font-size:0.78rem;font-weight:700;letter-spacing:2px;cursor:pointer;margin-top:6px;box-shadow:0 0 20px rgba(138,77,255,0.35);transition:box-shadow 0.2s}
    .modal-btn:hover{box-shadow:0 0 35px rgba(138,77,255,0.6)}
    .modal-close{float:left;background:none;border:none;color:rgba(242,242,247,0.4);font-size:1.2rem;cursor:pointer;margin-bottom:16px}
    .modal-msg{text-align:center;font-size:0.82rem;margin-top:12px;min-height:20px}
    .modal-msg.error{color:#ff6b6b}
    .modal-msg.success{color:#6bffb8}

    /* ══════════════════════════════════
       ADMIN PANEL
    ══════════════════════════════════ */
    .admin-btn{display:none;position:fixed;bottom:30px;left:30px;z-index:999;background:linear-gradient(135deg,#3d1a6e,#8A4DFF);color:#fff;border:none;border-radius:50px;padding:14px 24px;font-family:'Orbitron',sans-serif;font-size:0.75rem;font-weight:700;letter-spacing:2px;cursor:pointer;box-shadow:0 0 24px rgba(138,77,255,0.5);transition:box-shadow 0.2s,transform 0.2s}
    .admin-btn:hover{box-shadow:0 0 40px rgba(138,77,255,0.8);transform:translateY(-2px)}
    .admin-overlay{display:none;position:fixed;inset:0;background:rgba(5,5,15,0.92);backdrop-filter:blur(12px);z-index:1000;overflow-y:auto;padding:40px 20px}
    .admin-overlay.open{display:flex;flex-direction:column;align-items:center}
    .admin-panel{background:rgba(14,14,30,0.95);border:1px solid rgba(138,77,255,0.3);border-radius:12px;padding:40px;width:100%;max-width:700px}
    .admin-header{display:flex;align-items:center;gap:10px;margin-bottom:32px}
    /* العنوان بياخد المساحة الفاضية، فالزرارين يفضلوا على الطرف التاني */
    .admin-header .admin-title{margin-inline-end:auto}
    .admin-logout{background:rgba(255,107,107,0.12);border:1px solid rgba(255,107,107,0.32);border-radius:8px;height:36px;padding:0 14px;color:#ff8f8f;font-family:'Cairo',sans-serif;font-size:0.82rem;font-weight:600;cursor:pointer;display:flex;align-items:center;gap:6px;white-space:nowrap;transition:background .2s,border-color .2s}
    .admin-logout:hover{background:rgba(255,107,107,0.2);border-color:rgba(255,107,107,0.5)}
    .admin-title{font-family:'Orbitron',sans-serif;font-size:1.1rem;font-weight:900;letter-spacing:3px;background:linear-gradient(135deg,#fff,#C084FC);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}
    .admin-close{background:rgba(138,77,255,0.15);border:1px solid rgba(138,77,255,0.3);border-radius:50%;width:36px;height:36px;color:#C084FC;font-size:1.1rem;cursor:pointer;display:flex;align-items:center;justify-content:center}
    .admin-form{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-bottom:28px}
    .admin-form .full{grid-column:1/-1}
    .admin-label{font-family:'Orbitron',sans-serif;font-size:0.6rem;letter-spacing:2px;color:#C084FC;display:block;margin-bottom:6px}
    .admin-input{width:100%;background:rgba(10,5,25,0.8);border:1px solid rgba(138,77,255,0.25);border-radius:6px;padding:11px 14px;color:#F2F2F7;font-family:'Cairo',sans-serif;font-size:0.9rem;outline:none;transition:border-color 0.2s}
    .admin-input:focus{border-color:#8A4DFF}
    .admin-input::placeholder{color:rgba(242,242,247,0.25)}
    .img-upload-area{width:100%;height:160px;border:2px dashed rgba(138,77,255,0.35);border-radius:8px;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:border-color 0.2s,background 0.2s;overflow:hidden;margin-top:8px;position:relative}
    .img-upload-area:hover{border-color:rgba(138,77,255,0.7);background:rgba(138,77,255,0.06)}
    .img-upload-placeholder{display:flex;flex-direction:column;align-items:center;gap:4px}
    .img-remove-btn{margin-top:8px;background:rgba(255,60,60,0.1);border:1px solid rgba(255,60,60,0.25);border-radius:6px;color:#ff6b6b;font-size:0.75rem;padding:6px 14px;cursor:pointer;font-family:'Orbitron',sans-serif;letter-spacing:1px}
    .admin-add-btn{grid-column:1/-1;padding:13px;background:linear-gradient(135deg,#3d1a6e,#8A4DFF);border:none;border-radius:6px;color:#fff;font-family:'Orbitron',sans-serif;font-size:0.78rem;font-weight:700;letter-spacing:2px;cursor:pointer;box-shadow:0 0 20px rgba(138,77,255,0.35);transition:box-shadow 0.2s}
    .admin-divider{height:1px;background:linear-gradient(90deg,transparent,rgba(138,77,255,0.3),transparent);margin:24px 0}
    .admin-products-list{display:flex;flex-direction:column;gap:12px}
    .admin-product-item{display:flex;align-items:center;gap:14px;background:rgba(20,10,40,0.6);border:1px solid rgba(138,77,255,0.15);border-radius:8px;padding:14px 18px;flex-wrap:wrap}
    .admin-product-thumb{width:52px;height:52px;border-radius:6px;object-fit:cover;flex-shrink:0;border:1px solid rgba(138,77,255,0.2)}
    .admin-product-info{flex:1;min-width:140px}
    .admin-product-name{font-family:'Orbitron',sans-serif;font-size:0.82rem;font-weight:700;color:#fff;margin-bottom:3px}
    .admin-product-meta{font-size:0.78rem;color:rgba(242,242,247,0.5)}
    .admin-product-price-badge{font-family:'Orbitron',sans-serif;font-size:0.85rem;font-weight:700;color:#C084FC;white-space:nowrap}
    .admin-delete-btn{background:rgba(255,60,60,0.1);border:1px solid rgba(255,60,60,0.25);border-radius:6px;color:#ff6b6b;font-size:0.75rem;padding:6px 12px;cursor:pointer;font-family:'Orbitron',sans-serif;letter-spacing:1px;flex-shrink:0}
    .admin-empty{text-align:center;color:rgba(242,242,247,0.35);font-size:0.85rem;padding:24px}

    /* ── ORDER MODAL ── */
    .order-modal-overlay{display:none;position:fixed;inset:0;background:rgba(5,5,15,0.92);backdrop-filter:blur(12px);z-index:1000;align-items:center;justify-content:center}
    .order-modal-overlay.open{display:flex}
    .order-modal{background:rgba(14,14,30,0.97);border:1px solid rgba(138,77,255,0.3);border-radius:12px;padding:36px;width:90%;max-width:460px}
    .order-modal h3{font-family:'Orbitron',sans-serif;font-size:0.95rem;font-weight:900;letter-spacing:2px;color:var(--pl);margin-bottom:22px;text-align:center}
    .order-product-info{display:flex;align-items:center;gap:14px;background:rgba(20,10,40,0.6);border:1px solid rgba(138,77,255,0.15);border-radius:8px;padding:14px;margin-bottom:22px}
    .order-product-img{width:60px;height:60px;object-fit:cover;border-radius:6px;flex-shrink:0}
    .order-product-name{font-family:'Orbitron',sans-serif;font-size:0.82rem;color:#fff;margin-bottom:4px}
    .order-product-price{font-family:'Orbitron',sans-serif;font-size:0.95rem;color:var(--pl);font-weight:700}
    /* سطر الكمية والإجمالي — بيظهر بس لما العميل يطلب أكتر من قطعة */
    .order-product-qty{font-size:0.78rem;color:rgba(242,242,247,0.62);margin-top:5px}
    .order-product-qty strong{color:#fff;font-weight:600}
    .payment-options{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-bottom:22px}
    .payment-opt{padding:14px;background:rgba(20,10,40,0.6);border:2px solid rgba(138,77,255,0.15);border-radius:8px;text-align:center;cursor:pointer;transition:border-color 0.2s,background 0.2s}
    .payment-opt:hover{border-color:rgba(138,77,255,0.4)}
    .payment-opt.selected{border-color:var(--pm);background:rgba(138,77,255,0.15)}
    .payment-opt .opt-icon{font-size:1.8rem;margin-bottom:6px}
    .payment-opt .opt-label{font-family:'Cairo',sans-serif;font-size:0.82rem;color:var(--wh)}
    .whatsapp-info{background:rgba(37,211,102,0.08);border:1px solid rgba(37,211,102,0.2);border-radius:8px;padding:14px;margin-bottom:18px;display:none;text-align:center}
    .whatsapp-info p{font-size:0.85rem;color:rgba(242,242,247,0.7);line-height:1.7}
    .whatsapp-info strong{color:#25d366}

    /* ── ORDERS PAGE (للأدمن) ── */
    .order-item{background:rgba(20,10,40,0.6);border:1px solid rgba(138,77,255,0.15);border-radius:8px;padding:18px;margin-bottom:12px;display:flex;align-items:center;gap:14px;flex-wrap:wrap}
    .order-status{padding:4px 12px;border-radius:20px;font-family:'Orbitron',sans-serif;font-size:0.6rem;letter-spacing:1px;font-weight:700}
    .status-pending{background:rgba(255,165,0,0.15);color:#ffa500;border:1px solid rgba(255,165,0,0.3)}
    .status-confirmed{background:rgba(107,255,184,0.1);color:#6bffb8;border:1px solid rgba(107,255,184,0.2)}
    .status-done{background:rgba(138,77,255,0.15);color:var(--pl);border:1px solid rgba(138,77,255,0.3)}
    .status-cancelled{background:rgba(255,107,107,0.12);color:#ff6b6b;border:1px solid rgba(255,107,107,0.3)}
    .confirm-order-btn{padding:6px 14px;background:rgba(107,255,184,0.1);border:1px solid rgba(107,255,184,0.2);border-radius:6px;color:#6bffb8;font-size:0.75rem;cursor:pointer;font-family:'Orbitron',sans-serif;letter-spacing:1px;transition:background 0.2s}
    .confirm-order-btn:hover{background:rgba(107,255,184,0.2)}


    /* ══ فاتورة ══ */
    @media print {
      body > *:not(#invoicePrintArea) { display: none !important; }
      #invoicePrintArea { display: block !important; position: fixed; inset: 0; background: #fff; z-index: 9999; padding: 40px; }
    }
    #invoicePrintArea { display: none; }

    .invoice-box {
      max-width: 600px;
      margin: 0 auto;
      padding: 40px;
      background: #fff;
      color: #111;
      font-family: 'Cairo', sans-serif;
    }
    .invoice-header {
      display: flex;
      justify-content: space-between;
      align-items: flex-start;
      margin-bottom: 32px;
      padding-bottom: 20px;
      border-bottom: 2px solid #8A4DFF;
    }
    .invoice-brand {
      font-family: 'Orbitron', sans-serif;
      font-size: 1.8rem;
      font-weight: 900;
      color: #5B2D91;
      letter-spacing: 4px;
    }
    .invoice-sub {
      font-size: 0.7rem;
      color: #8A4DFF;
      letter-spacing: 2px;
      margin-top: 4px;
    }
    .invoice-meta { text-align: left; font-size: 0.85rem; color: #555; }
    .invoice-meta strong { color: #111; }
    .invoice-section { margin-bottom: 24px; }
    .invoice-section h4 { font-family: 'Orbitron', sans-serif; font-size: 0.7rem; letter-spacing: 3px; color: #8A4DFF; margin-bottom: 10px; }
    .invoice-row { display: flex; justify-content: space-between; padding: 8px 0; border-bottom: 1px solid #f0e6ff; font-size: 0.9rem; }
    .invoice-total { display: flex; justify-content: space-between; padding: 14px 0; font-family: 'Orbitron', sans-serif; font-size: 1rem; font-weight: 700; color: #5B2D91; border-top: 2px solid #8A4DFF; margin-top: 8px; }
    .invoice-footer { text-align: center; margin-top: 32px; font-size: 0.78rem; color: #999; border-top: 1px solid #eee; padding-top: 16px; }
    .invoice-status { display: inline-block; padding: 4px 14px; border-radius: 20px; font-size: 0.75rem; font-weight: 700; }
    .invoice-status.pending { background: #fff3cd; color: #856404; }
    .invoice-status.confirmed { background: #d1f7e8; color: #0a6640; }