/* Área do cliente — Cactus Hub */
.customer-portal-page{background:#f5f7f9;color:#172134}
.customer-portal-page .customer-hero{padding-bottom:54px}
.customer-portal-page .customer-hero .compact-hero-copy{max-width:820px}
.customer-portal-page .customer-hero .compact-hero-copy p{max-width:720px}
.customer-portal-page .customer-section{padding-top:42px;padding-bottom:72px}
.customer-lookup-card,
.customer-order-card,
.customer-payment-card{
  background:#fff;
  border:1px solid #e2e7ed;
  border-radius:22px;
  box-shadow:0 18px 54px rgba(23,32,52,.07)
}
.customer-lookup-card{padding:24px}
.customer-lookup-grid{
  display:grid;
  grid-template-columns:1.1fr 1fr 1fr auto;
  gap:12px;
  align-items:end
}
.customer-field label{
  display:block;
  margin-bottom:7px;
  color:#3c485a;
  font-size:11px;
  font-weight:900;
  letter-spacing:.02em
}
.customer-field input{
  width:100%;
  min-height:50px;
  padding:0 14px;
  border:1px solid #cfd7e0;
  border-radius:13px;
  background:#fff;
  color:#172134;
  outline:none
}
.customer-field input:focus{
  border-color:#82bd20;
  box-shadow:0 0 0 4px rgba(129,191,32,.13)
}
.customer-lookup-help{
  margin:13px 0 0;
  color:#718096;
  font-size:11px;
  line-height:1.6
}
.customer-alert{
  display:none;
  margin-top:15px;
  padding:13px 15px;
  border-radius:13px;
  font-size:12px;
  line-height:1.55
}
.customer-alert.show{display:block}
.customer-alert.info{background:#edf4ff;color:#31599b}
.customer-alert.success{background:#f0f8df;color:#4f770d}
.customer-alert.error{background:#fff0f0;color:#a02f2f}
.customer-results{display:grid;gap:18px;margin-top:20px}
.customer-empty{
  padding:40px 22px;
  text-align:center;
  color:#718096
}
.customer-empty strong{
  display:block;
  margin-bottom:7px;
  color:#172134;
  font-family:"Montserrat",sans-serif;
  font-size:18px
}
.customer-order-card{overflow:hidden}
.customer-order-head{
  display:flex;
  justify-content:space-between;
  gap:18px;
  align-items:flex-start;
  padding:20px 22px 17px;
  border-bottom:1px solid #e9edf2
}
.customer-order-title{display:flex;gap:13px;align-items:flex-start}
.customer-product-icon{
  width:44px;height:44px;display:grid;place-items:center;flex:0 0 auto;
  border-radius:13px;background:#0e1524;color:#9bd83f;font-size:12px;font-weight:900
}
.customer-order-title h2{
  margin:1px 0 5px;
  color:#172134;
  font-family:"Montserrat",sans-serif;
  font-size:20px
}
.customer-order-title p{margin:0;color:#718096;font-size:11px}
.customer-badge{
  display:inline-flex;align-items:center;gap:7px;min-height:29px;padding:0 10px;
  border-radius:999px;font-size:10px;font-weight:900;white-space:nowrap
}
.customer-badge::before{content:"";width:7px;height:7px;border-radius:50%;background:currentColor}
.customer-badge.pending{background:#fff7df;color:#956400}
.customer-badge.running{background:#edf4ff;color:#315fb2}
.customer-badge.online{background:#eff9dd;color:#55800e}
.customer-badge.problem{background:#fff0f0;color:#a52e2e}
.customer-order-body{padding:20px 22px 22px}
.customer-meta-grid{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:10px
}
.customer-meta{
  padding:12px 13px;border-radius:13px;
  border:1px solid #edf0f3;background:#f8fafb
}
.customer-meta span{
  display:block;color:#8791a1;font-size:8px;font-weight:900;letter-spacing:.08em;text-transform:uppercase
}
.customer-meta strong{
  display:block;margin-top:6px;color:#253249;font-size:12px;line-height:1.45;word-break:break-word
}
.customer-progress{
  display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin-top:18px
}
.customer-step{
  min-height:74px;padding:12px;border:1px solid #e4e8ed;border-radius:13px;background:#fff
}
.customer-step::before{content:"";display:block;width:9px;height:9px;margin-bottom:9px;border-radius:50%;background:#c4cbd4}
.customer-step strong{display:block;color:#273449;font-size:11px}
.customer-step span{display:block;margin-top:3px;color:#7b8797;font-size:9px;line-height:1.45}
.customer-step.done{background:#f7fbeF;border-color:#dceabb}
.customer-step.done::before{background:#81bf20}
.customer-step.active{background:#edf4ff;border-color:#ccdbf8}
.customer-step.active::before{background:#2f6fed;box-shadow:0 0 0 4px rgba(47,111,237,.12)}
.customer-step.problem{background:#fff0f0;border-color:#ffd1d1}
.customer-step.problem::before{background:#d83b3b}
.customer-order-actions{display:flex;gap:9px;flex-wrap:wrap;margin-top:18px}
.customer-security-note{
  margin-top:14px;padding:12px 13px;border-radius:12px;background:#f7f9fb;color:#667388;
  font-size:10px;line-height:1.55
}
.customer-security-note strong{color:#273449}
.customer-payment-card{padding:25px}
.customer-payment-state{display:flex;gap:16px;align-items:flex-start}
.customer-state-icon{
  width:58px;height:58px;border-radius:18px;display:grid;place-items:center;flex:0 0 auto;
  background:#edf4ff;color:#2f6fed;font-size:27px;font-weight:900
}
.customer-state-icon.success{background:#eff9dd;color:#5e8d10}
.customer-state-icon.problem{background:#fff0f0;color:#d83b3b}
.customer-payment-state h2{
  margin:1px 0 7px;color:#172134;font-family:"Montserrat",sans-serif;font-size:25px
}
.customer-payment-state p{margin:0;color:#718096;line-height:1.6;font-size:13px}
.customer-payment-details{margin-top:20px}
.customer-payment-actions{display:flex;gap:9px;flex-wrap:wrap;margin-top:18px}
.customer-spinner{
  width:17px;height:17px;border:2px solid rgba(14,21,36,.2);border-top-color:#0e1524;
  border-radius:50%;display:none;animation:customer-spin .7s linear infinite
}
.customer-loading .customer-spinner{display:inline-block}
@keyframes customer-spin{to{transform:rotate(360deg)}}
.customer-mono{font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace}
@media(max-width:980px){
  .customer-lookup-grid{grid-template-columns:1fr 1fr}
  .customer-lookup-grid .btn{grid-column:1/-1}
  .customer-meta-grid{grid-template-columns:1fr 1fr}
}
@media(max-width:640px){
  .customer-portal-page .customer-section{padding-top:26px;padding-bottom:56px}
  .customer-lookup-card,.customer-payment-card{padding:17px;border-radius:18px}
  .customer-lookup-grid{grid-template-columns:1fr}
  .customer-lookup-grid .btn{grid-column:auto;width:100%}
  .customer-order-head{padding:17px;flex-direction:column}
  .customer-order-body{padding:17px}
  .customer-meta-grid,.customer-progress{grid-template-columns:1fr 1fr}
  .customer-order-actions .btn,.customer-payment-actions .btn{width:100%}
  .customer-payment-state{flex-direction:column}
}
@media(max-width:420px){
  .customer-meta-grid,.customer-progress{grid-template-columns:1fr}
}