/* ====================================================



   GoodCold Pedidos — Frontend CSS



   Namespace: .gc-presupuesto-*, .gc-item, .gc-btn-*



   ==================================================== */







/* Usuario logueado — bloque de datos en modo lectura */



.gc-user-summary {



  display: flex;



  align-items: center;



  gap: 14px;



  background: #f0f4ff;



  border: 1.5px solid #d0dbff;



  border-radius: 10px;



  padding: 14px 18px;



  margin-bottom: 20px;



}



.gc-user-summary__avatar {



  width: 42px;



  height: 42px;



  background: #0B39F2;



  color: #fff;



  border-radius: 50%;



  display: flex;



  align-items: center;



  justify-content: center;



  font-size: 18px;



  font-weight: 700;



  flex-shrink: 0;



}



.gc-user-summary__info { flex: 1; min-width: 0; }



.gc-user-summary__name {



  font-size: 14px;



  font-weight: 700;



  color: #111;



  margin: 0 0 2px;



}



.gc-user-summary__detail {



  font-size: 12px;



  color: #666;



  margin: 0;



  white-space: nowrap;



  overflow: hidden;



  text-overflow: ellipsis;



}







/* Layout principal */



.gc-presupuesto-wrap {



  max-width: 1140px;



  margin: 0 auto;



  padding: 32px 16px 64px;



  font-family: Arial, Helvetica, sans-serif;



}







.gc-presupuesto-layout {



  display: grid;



  grid-template-columns: 1fr 380px;



  gap: 28px;



  align-items: start;



}







@media (max-width: 900px) {



  .gc-presupuesto-layout {



    grid-template-columns: 1fr;



  }



  .gc-presupuesto-summary-col {



    order: -1;



  }



}







/* Card */



.gc-card {



  background: #fff;



  border: 1px solid #E4E7EC;



  border-radius: 12px;



  padding: 28px;



  box-shadow: 0 2px 8px rgba(0,0,0,0.05);



}



.gc-card--sticky {



  position: sticky;



  top: 100px;



}



.gc-card__title {



  font-size: 16px;



  font-weight: 700;



  color: #111;



  margin: 0 0 20px;



  padding-bottom: 14px;



  border-bottom: 2px solid #0B39F2;



  letter-spacing: 0.01em;



}







/* Formulario */



.gc-form-row { display: flex; gap: 16px; }



.gc-form-row--2 > * { flex: 1; }



.gc-form-group { margin-bottom: 18px; }



.gc-form-group label {



  display: block;



  font-size: 13px;



  font-weight: 600;



  color: #444;



  margin-bottom: 6px;



  letter-spacing: 0.01em;



}



.gc-form-group .req { color: #0B39F2; }







.gc-form-group input,



.gc-form-group textarea {



  width: 100%;



  box-sizing: border-box;



  padding: 10px 14px;



  border: 1.5px solid #E4E7EC;



  border-radius: 8px;



  font-size: 14px;



  font-family: Arial, Helvetica, sans-serif;



  color: #222;



  background: #fafafa;



  transition: border-color 0.2s, box-shadow 0.2s;



  outline: none;



}



.gc-form-group input:focus,



.gc-form-group textarea:focus {



  border-color: #0B39F2;



  box-shadow: 0 0 0 3px rgba(11,57,242,0.10);



  background: #fff;



}



.gc-form-group input.gc-error { border-color: #e53e3e !important; }



.gc-form-group textarea { resize: vertical; min-height: 80px; }







@media (max-width: 600px) {



  .gc-form-row { flex-direction: column; gap: 0; }



}







/* Radio modalidad */



.gc-radio-group { display: flex; flex-direction: column; gap: 10px; }



.gc-radio-option { cursor: pointer; }



.gc-radio-option input[type="radio"] { display: none; }



.gc-radio-box {



  display: flex;



  align-items: center;



  gap: 10px;



  padding: 12px 16px;



  border: 1.5px solid #E4E7EC;



  border-radius: 8px;



  font-size: 14px;



  color: #444;



  background: #fafafa;



  transition: all 0.2s;



}



.gc-radio-box em { color: #999; font-size: 12px; font-style: normal; }



.gc-radio-option input[type="radio"]:checked + .gc-radio-box {



  border-color: #0B39F2;



  background: #f0f4ff;



  color: #0B39F2;



  font-weight: 600;



}



.gc-radio-box svg { flex-shrink: 0; }







/* Botón de envío */



.gc-btn-submit {



  display: block;



  width: 100%;



  padding: 15px;



  background: #0B39F2;



  color: #fff;



  font-size: 15px;



  font-weight: 700;



  font-family: Arial, Helvetica, sans-serif;



  border: none;



  border-radius: 8px;



  cursor: pointer;



  text-align: center;



  text-decoration: none;



  letter-spacing: 0.02em;



  transition: background 0.2s, transform 0.1s;



  margin-top: 8px;



}



.gc-btn-submit:hover { background: #0a2fcc; }



.gc-btn-submit:active { transform: scale(0.99); }



.gc-btn-submit:disabled { opacity: 0.6; cursor: not-allowed; }







/* Items en el resumen */



.gc-items-list { margin-bottom: 20px; }



.gc-item {



  display: flex;



  align-items: center;



  gap: 12px;



  padding: 12px 0;



  border-bottom: 1px solid #E4E7EC;



}



.gc-item:last-child { border-bottom: none; }



.gc-item__img { flex-shrink: 0; }



.gc-item__img img { width: 56px; height: 56px; object-fit: contain; border-radius: 6px; border: 1px solid #eee; }



.gc-item__info { flex: 1; min-width: 0; }



.gc-item__name { font-size: 13px; font-weight: 600; color: #222; margin: 0 0 3px; line-height: 1.3; }



.gc-item__sku { font-size: 11px; color: #999; margin: 0 0 2px; }



.gc-item__qty { font-size: 12px; color: #666; margin: 0; }



.gc-item__price { font-size: 14px; font-weight: 700; color: #0B39F2; flex-shrink: 0; }







/* Totales */



.gc-summary-totals { border-top: 2px solid #E4E7EC; padding-top: 14px; }



.gc-summary-row {



  display: flex;



  justify-content: space-between;



  font-size: 14px;



  color: #555;



  margin-bottom: 8px;



}



.gc-summary-row--total {



  font-size: 17px;



  font-weight: 700;



  color: #111;



  padding-top: 8px;



  border-top: 1px dashed #ddd;



  margin-top: 4px;



}



.gc-summary-note {



  font-size: 11px;



  color: #999;



  margin: 14px 0 12px;



  line-height: 1.5;



}



.gc-link-back {



  font-size: 13px;



  color: #0B39F2;



  text-decoration: none;



}



.gc-link-back:hover { text-decoration: underline; }







/* Estado vacío */



.gc-presupuesto-wrap--empty {



  display: flex;



  align-items: center;



  justify-content: center;



  min-height: 400px;



}



.gc-empty-state { text-align: center; max-width: 380px; }



.gc-empty-state__icon { margin-bottom: 20px; }



.gc-empty-state h3 { font-size: 20px; color: #222; margin: 0 0 10px; }



.gc-empty-state p { color: #777; margin: 0 0 24px; }



.gc-empty-state .gc-btn-submit { display: inline-block; width: auto; padding: 13px 32px; }







/* Modal de confirmación */



.gc-modal {



  position: fixed;



  inset: 0;



  z-index: 99999;



  display: flex;



  align-items: center;



  justify-content: center;



}



.gc-modal__backdrop {



  position: absolute;



  inset: 0;



  background: rgba(0,0,0,0.55);



}



.gc-modal__box {



  position: relative;



  background: #fff;



  border-radius: 16px;



  padding: 48px 40px 40px;



  max-width: 440px;



  width: 90%;



  text-align: center;



  box-shadow: 0 20px 60px rgba(0,0,0,0.2);



}



.gc-modal__icon {



  width: 64px;



  height: 64px;



  background: #0B39F2;



  color: #fff;



  font-size: 32px;



  border-radius: 50%;



  display: flex;



  align-items: center;



  justify-content: center;



  margin: 0 auto 20px;



}



.gc-modal__box h3 { font-size: 22px; color: #111; margin: 0 0 10px; }



.gc-modal__box p { color: #555; margin: 0 0 8px; font-size: 15px; }



.gc-modal__numero { font-weight: 700; color: #0B39F2; font-size: 18px; }



.gc-modal__box .gc-btn-submit { margin-top: 20px; width: auto; padding: 12px 28px; display: inline-block; }






/* ─────────────────────────────────────────────────────────── */


/*  Mis pedidos / Repetir pedido                                */


/* ─────────────────────────────────────────────────────────── */





.gc-mis-pedidos-wrap,


.gc-pedido-detalle-wrap {


  font-family: Arial, Helvetica, sans-serif;


  max-width: 1100px;


  margin: 0 auto;


  padding: 24px 16px;


  color: #111;


}





/* Tabla de pedidos */


.gc-pedidos-table-wrap {


  background: #fff;


  border: 1px solid #E4E7EC;


  border-radius: 22px;


  overflow: hidden;


}


.gc-pedidos-table {


  width: 100%;


  border-collapse: collapse;


  font-size: 14px;


}


.gc-pedidos-table thead th {


  background: #fafafa;


  text-align: left;


  padding: 14px 16px;


  font-weight: 700;


  font-size: 12px;


  text-transform: uppercase;


  letter-spacing: 0.05em;


  color: #555;


  border-bottom: 2px solid #E4E7EC;


}


.gc-pedidos-table tbody td {


  padding: 16px;


  border-bottom: 1px solid #E4E7EC;


  vertical-align: middle;


}


.gc-pedidos-table tbody tr:last-child td { border-bottom: none; }


.gc-pedidos-table tbody tr:hover { background: #fafbff; }





.gc-col-acciones {


  text-align: right;


  white-space: nowrap;


}


.gc-col-acciones a,


.gc-col-acciones button { margin-left: 6px; }





/* Botones */


.gc-btn-secondary {


  display: inline-flex;


  align-items: center;


  gap: 4px;


  padding: 8px 14px;


  background: #fff;


  color: #0B39F2;


  border: 1.5px solid #0B39F2;


  border-radius: 8px;


  font-size: 13px;


  font-weight: 600;


  text-decoration: none;


  cursor: pointer;


  transition: all 0.2s;


}


.gc-btn-secondary:hover { background: #0B39F2; color: #fff; }





.gc-btn-repetir {


  display: inline-flex;


  align-items: center;


  padding: 8px 14px;


  background: #0B39F2;


  color: #fff;


  border: 1.5px solid #0B39F2;


  border-radius: 8px;


  font-size: 13px;


  font-weight: 600;


  cursor: pointer;


  transition: all 0.2s;


  font-family: Arial, Helvetica, sans-serif;


}


.gc-btn-repetir:hover { background: #0a2fcc; border-color: #0a2fcc; }


.gc-btn-repetir:disabled { opacity: 0.6; cursor: not-allowed; }





.gc-btn-cancel {


  background: transparent;


  color: #666;


  border: 1.5px solid #ddd;


  border-radius: 8px;


  padding: 10px 18px;


  font-size: 14px;


  font-weight: 600;


  cursor: pointer;


  font-family: Arial, Helvetica, sans-serif;


}


.gc-btn-cancel:hover { border-color: #999; color: #333; }





.gc-btn--inline { width: auto !important; padding: 10px 18px !important; display: inline-block; margin: 0 !important; }





/* Estados */


.gc-estado {


  display: inline-block;


  padding: 4px 10px;


  border-radius: 12px;


  font-size: 11px;


  font-weight: 700;


  text-transform: uppercase;


  letter-spacing: 0.05em;


}


.gc-estado--pendiente   { background: #fff7e6; color: #b86e00; }


.gc-estado--en_proceso  { background: #e6f0ff; color: #0B39F2; }


.gc-estado--cotizado    { background: #e8f5e9; color: #2e7d32; }


.gc-estado--aceptado    { background: #2e7d32; color: #fff; }


.gc-estado--cancelado   { background: #f5f5f5; color: #888; }





/* Paginación */


.gc-pagination {


  display: flex;


  justify-content: center;


  gap: 6px;


  margin-top: 24px;


}


.gc-page {


  padding: 8px 14px;


  border: 1px solid #E4E7EC;


  border-radius: 8px;


  color: #555;


  text-decoration: none;


  font-size: 13px;


  font-weight: 600;


}


.gc-page:hover { border-color: #0B39F2; color: #0B39F2; }


.gc-page--active { background: #0B39F2; color: #fff !important; border-color: #0B39F2; }





/* Detalle */


.gc-detalle-header {


  display: flex;


  justify-content: space-between;


  align-items: flex-start;


  padding-bottom: 16px;


  border-bottom: 1px solid #E4E7EC;


  margin-bottom: 20px;


}


.gc-detalle-fecha {


  color: #888;


  font-size: 13px;


  margin: 4px 0 0;


}


.gc-detalle-grid {


  display: grid;


  grid-template-columns: 1fr 1fr;


  gap: 24px;


  margin-bottom: 24px;


}


.gc-detalle-label {


  font-size: 11px;


  text-transform: uppercase;


  letter-spacing: 0.05em;


  color: #888;


  margin: 0 0 4px;


  font-weight: 700;


}


.gc-detalle-valor { margin: 0 0 2px; font-size: 14px; }


.gc-detalle-valor--muted { color: #777; font-size: 13px; }


.gc-detalle-subtitle {


  font-size: 14px;


  font-weight: 700;


  text-transform: uppercase;


  letter-spacing: 0.05em;


  color: #111;


  margin: 24px 0 12px;


  padding-bottom: 8px;


  border-bottom: 2px solid #0B39F2;


}


.gc-detalle-acciones { margin-top: 20px; text-align: right; }





/* Modal — variante de acciones múltiples */


.gc-modal__actions {


  display: flex;


  gap: 8px;


  justify-content: center;


  flex-wrap: wrap;


  margin-top: 20px;


}


.gc-modal__actions .gc-btn-submit,


.gc-modal__actions .gc-btn-secondary,


.gc-modal__actions .gc-btn-cancel {


  margin: 0;


}





.gc-modal__box #gc-repetir-result-msg {


  text-align: left;


  margin-top: 12px;


  font-size: 14px;


}


.gc-modal__box #gc-repetir-result-msg p { margin: 0 0 8px; }





.gc-repetir-warn {


  background: #fff7e6;


  border: 1px solid #ffd591;


  border-radius: 8px;


  padding: 12px 14px;


  margin-top: 12px;


  font-size: 13px;


}


.gc-repetir-warn p { margin: 0 0 6px; color: #b86e00; }


.gc-repetir-warn ul { margin: 0; padding-left: 20px; color: #555; }


.gc-repetir-warn li { margin-bottom: 4px; line-height: 1.4; }


.gc-repetir-warn small { color: #888; }





/* Responsive — tabla a cards */


@media (max-width: 720px) {


  .gc-pedidos-table thead { display: none; }


  .gc-pedidos-table, .gc-pedidos-table tbody, .gc-pedidos-table tr, .gc-pedidos-table td {


    display: block; width: 100%;


  }


  .gc-pedidos-table tr {


    background: #fff;


    border: 1px solid #E4E7EC;


    border-radius: 12px;


    margin-bottom: 12px;


    padding: 12px;


  }


  .gc-pedidos-table tbody td {


    border: none;


    padding: 6px 0;


    display: flex;


    justify-content: space-between;


    align-items: center;


  }


  .gc-pedidos-table tbody td::before {


    content: attr(data-label);


    font-size: 11px;


    text-transform: uppercase;


    letter-spacing: 0.05em;


    color: #888;


    font-weight: 700;


  }


  .gc-col-acciones { flex-direction: column; align-items: stretch !important; gap: 6px; }


  .gc-col-acciones::before { display: none; }


  .gc-col-acciones a, .gc-col-acciones button {


    margin-left: 0;


    width: 100%;


    text-align: center;


    justify-content: center;


  }





  .gc-detalle-grid { grid-template-columns: 1fr; }


  .gc-detalle-header { flex-direction: column; gap: 8px; }


}