/* ============================
   RF CDE SHOP — Cuenta de cliente (Fase 4)
   Reusa clases ya existentes donde es posible: .quote-modal (tamaño/posición
   de modal), .quote-form (inputs), .dm-tabs/.dm-tab (pestañas del modal de
   producto), .checkout-steps/.checkout-step (stepper del checkout, reusado
   acá como timeline de estado de pedido). Solo lo específico de esta
   feature vive en este archivo.
   ============================ */

.account-btn { position:relative; background:#fff; border:1.5px solid var(--border); color:var(--text); width:42px; height:42px; border-radius:var(--radius); font-size:1.1rem; display:flex; align-items:center; justify-content:center; transition:.2s; }
.account-btn:hover { border-color:var(--primary); color:var(--primary); }
.account-btn.logged-in { color:var(--primary); border-color:var(--primary); }

.account-modal { position:fixed; top:5%; left:50%; transform:translateX(-50%); width:92%; max-width:640px; max-height:90vh; overflow-y:auto; background:#fff; border-radius:var(--radius-lg); z-index:1201; display:none; box-shadow:0 20px 50px rgba(16,24,40,.25); }
.account-modal.active { display:block; }
.acc-body-wrap { padding:1.5rem; }
.acc-body-wrap .dm-tabs { margin-bottom:1rem; }

.acc-error { background:rgba(220,38,38,.08); color:var(--error); border:1px solid rgba(220,38,38,.25); border-radius:var(--radius); padding:.6rem .8rem; font-size:.8rem; margin:.3rem 0 .8rem; }
.acc-hint { font-size:.78rem; color:var(--text-2); margin:-.3rem 0 .8rem; }
.acc-hint a, .acc-switch-link { color:var(--primary); font-weight:600; cursor:pointer; }
.acc-switch-row { text-align:center; font-size:.82rem; color:var(--text-2); margin-top:.9rem; }

.acc-loading { text-align:center; padding:2rem 1rem; color:var(--text-2); font-size:.85rem; }
.acc-loading i { display:block; font-size:1.5rem; margin-bottom:.6rem; color:var(--primary); }

.acc-empty { text-align:center; padding:2rem 1rem; color:var(--text-2); }
.acc-empty i { display:block; font-size:2rem; margin-bottom:.6rem; color:var(--border); }
.acc-empty p { font-size:.85rem; }

/* -- Pestaña Cuenta -- */
.acc-info-card { background:var(--bg-2); border-radius:var(--radius-lg); padding:1.2rem; margin-bottom:1rem; }
.acc-info-row { display:flex; justify-content:space-between; align-items:center; padding:.5rem 0; border-bottom:1px solid var(--border); font-size:.88rem; }
.acc-info-row:last-child { border-bottom:none; }
.acc-info-row span:first-child { color:var(--text-2); }
.acc-info-row span:last-child { font-weight:600; color:var(--text); }
.acc-actions-row { display:flex; gap:.6rem; flex-wrap:wrap; }
.acc-actions-row button { flex:1; min-width:140px; }

/* -- Pestaña Pedidos -- */
.acc-order-card { border:1.5px solid var(--border); border-radius:var(--radius-lg); padding:1rem; margin-bottom:1rem; }
.acc-order-head { display:flex; justify-content:space-between; align-items:flex-start; gap:.6rem; margin-bottom:.8rem; flex-wrap:wrap; }
.acc-order-head strong { font-size:.9rem; color:var(--text); }
.acc-order-head span { display:block; font-size:.72rem; color:var(--text-2); margin-top:.15rem; }
.acc-order-badge { padding:.3rem .7rem; border-radius:50px; font-size:.72rem; font-weight:700; white-space:nowrap; }
.acc-order-badge.cancelled { background:rgba(220,38,38,.1); color:var(--error); }
.acc-order-badge.normal { background:rgba(0,136,204,.1); color:var(--primary-dark); }

.acc-timeline { display:flex; align-items:center; margin:.8rem 0 .3rem; }
.acc-timeline-step { display:flex; flex-direction:column; align-items:center; gap:.35rem; flex:1; position:relative; }
.acc-timeline-step:not(:last-child)::after { content:''; position:absolute; top:14px; left:calc(50% + 20px); right:calc(-50% + 20px); height:2px; background:var(--border); }
.acc-timeline-step.done:not(:last-child)::after { background:var(--success); }
.acc-timeline-num { width:28px; height:28px; border-radius:50%; background:var(--bg-2); border:2px solid var(--border); color:var(--text-2); font-size:.75rem; display:flex; align-items:center; justify-content:center; flex-shrink:0; z-index:1; }
.acc-timeline-step.active .acc-timeline-num { background:var(--primary); border-color:var(--primary); color:#fff; }
.acc-timeline-step.done .acc-timeline-num { background:var(--success); border-color:var(--success); color:#fff; }
.acc-timeline-step span { font-size:.65rem; color:var(--text-2); text-align:center; }
.acc-timeline-step.active span, .acc-timeline-step.done span { color:var(--text); font-weight:600; }
.acc-cancelled-note { background:rgba(220,38,38,.06); border:1px solid rgba(220,38,38,.2); color:var(--error); border-radius:var(--radius); padding:.6rem .8rem; font-size:.8rem; margin:.5rem 0; }

/* -- Pestaña Proyectos -- */
.acc-project-card { border:1.5px solid var(--border); border-radius:var(--radius-lg); padding:1rem; margin-bottom:1rem; }
.acc-project-head { display:flex; justify-content:space-between; align-items:flex-start; gap:.6rem; margin-bottom:.5rem; }
.acc-project-head strong { font-size:.92rem; color:var(--text); }
.acc-project-head span { display:block; font-size:.72rem; color:var(--text-2); margin-top:.1rem; }
.acc-project-items { font-size:.8rem; color:var(--text-2); margin-bottom:.8rem; line-height:1.6; }
.acc-project-actions { display:flex; gap:.5rem; flex-wrap:wrap; }
.acc-project-actions button { font-size:.78rem; padding:.5rem .8rem; }
.acc-project-del { background:none; border:1.5px solid var(--border); color:var(--text-2); border-radius:var(--radius); }
.acc-project-del:hover { border-color:var(--error); color:var(--error); }

@media (max-width:768px) {
  .account-modal { top:2%; max-height:96vh; }
  .acc-timeline-step span { display:none; }
  .acc-actions-row button { min-width:100%; }
}
