/* Clean UI like BTU calculator */
.frilar-consumo-wrapper{display:flex;justify-content:center;align-items:flex-start;padding:24px}
.frilar-consumo-card{max-width:800px;width:100%;background:#fff;border:1px solid #e6eef5;border-radius:18px;box-shadow:0 10px 30px rgba(2,12,27,.06);overflow:hidden}
.frilar-consumo-header{display:flex;justify-content:space-between;gap:16px;align-items:center;padding:18px 22px;background:linear-gradient(180deg,#f6fbff 0,#fff 100%);border-bottom:1px solid #eef4fb}
.frilar-head-left h2{margin:0 0 6px;font-size:22px}
.frilar-head-left p{margin:0;color:#5c738a}
.frilar-head-right{display:flex;gap:10px}
.frilar-primary,.frilar-ghost{display:inline-block;text-decoration:none;border-radius:12px;padding:10px 16px;font-weight:700}
.frilar-primary{background:#1f7ae0;color:#fff;border:1px solid #1f7ae0}
.frilar-ghost{background:transparent;border:1px solid #c4d6e8;color:#1a2a3a}
.frilar-ghost:hover{background:#f1f7fd}
.frilar-consumo-body{padding:22px}
.frilar-form .frilar-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
.frilar-field label{display:block;margin-bottom:6px;color:#294056;font-size:13px}
.frilar-field input,.frilar-field select{width:100%;padding:10px 12px;border:1px solid #cdd9e4;border-radius:10px;background:#fff;font-size:14px}
.frilar-actions{margin-top:12px;display:flex;gap:10px}
.frilar-resultado{margin-top:18px;border:1px dashed #cbd5e1;border-radius:14px;background:#f6f9fc;padding:16px}
.frilar-res-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.frilar-res-title{font-size:12px;color:#5b6b7c;text-transform:uppercase;letter-spacing:.04em;margin-bottom:6px}
.frilar-res-value{font-size:20px;font-weight:800}
.frilar-res-sub{color:#6b7c8f;font-size:13px;margin-top:4px}
.frilar-details{margin-top:12px}
.frilar-details summary{cursor:pointer;font-weight:600}
.frilar-details-content{padding:8px 0 0 0;color:#334155;font-size:14px}
.frilar-cta{margin-top:14px;display:flex;gap:10px}
@media (max-width:700px){
  .frilar-form .frilar-grid{grid-template-columns:1fr}
  .frilar-res-grid{grid-template-columns:1fr}
}

/* Share bar */
.frilar-share{margin-top:14px;padding:12px;border:1px solid #e4ecf4;border-radius:12px;background:#fff}
.frilar-share-title{font-size:13px;color:#334155;margin-bottom:8px;font-weight:700}
.frilar-share-buttons{display:flex;gap:10px;flex-wrap:wrap}
.share-btn{display:inline-flex;align-items:center;justify-content:center;width:40px;height:40px;border:1px solid #cbd5e1;border-radius:10px;background:#f8fafc;color:#0f172a;cursor:pointer;text-decoration:none}
.share-btn:hover{background:#eef2f7}
.frilar-share-hint{display:block;margin-top:6px;color:#64748b}

/* ===== Mobile-first responsive enhancements (v1.5.0) ===== */
:where(.frilar-consumo-card){box-sizing:border-box}
.frilar-consumo-card *,.frilar-consumo-card *::before,.frilar-consumo-card *::after{box-sizing:border-box}

/* Typography scales fluidly */
.frilar-consumo-card{font-size:clamp(14px, 2.2vw, 16px); line-height:1.55}

/* Layout paddings adapt */
.frilar-consumo-header{padding:clamp(14px, 2.8vw, 22px)}
.frilar-consumo-body{padding:clamp(14px, 2.8vw, 22px)}

/* Grid: single column by default; grows on wider screens */
.frilar-form .frilar-grid{
  display:grid;
  grid-template-columns:1fr;
  gap:14px;
}
@media (min-width:700px){
  .frilar-form .frilar-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}

/* Inputs: comfortable tap targets; avoid iOS zoom */
.frilar-field input,.frilar-field select{
  min-height:44px;
  font-size:16px; /* iOS no-zoom */
  -webkit-tap-highlight-color: rgba(0,0,0,0);
}

/* Buttons: wrap and grow on small screens */
.frilar-head-right,.frilar-actions,.frilar-cta,.frilar-share-buttons{
  flex-wrap:wrap;
}
@media (max-width:480px){
  .frilar-primary,.frilar-ghost{width:100%; justify-content:center}
  .frilar-actions .frilar-primary{order:1}
  .frilar-actions .frilar-ghost{order:2}
}

/* Result grid stacks on small screens */
.frilar-res-grid{
  display:grid;
  grid-template-columns:1fr;
  gap:16px;
}
@media (min-width:860px){
  .frilar-res-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
}

/* Share bar: buttons grow to fill width on small screens */
.share-btn{width:44px;height:44px}
@media (max-width:480px){
  .frilar-share-buttons{gap:12px}
  .share-btn{flex:1 0 44px}
}

/* Header: stack items nicely on narrow viewports */
@media (max-width:640px){
  .frilar-consumo-header{flex-direction:column; align-items:flex-start; gap:10px}
  .frilar-head-right{width:100%}
}

/* Reduce motion for users who prefer it */
@media (prefers-reduced-motion: reduce){
  html:focus-within { scroll-behavior: auto; }
}

/* Minimal logo styling */
.frilar-logo{height:32px;margin-right:10px;vertical-align:middle}
.frilar-head-left{display:flex;align-items:center;gap:12px}
.frilar-head-left h2{margin:0;font-size:20px}
.frilar-head-left p{margin:0;font-size:14px;color:#5c738a}

/* v1.6.2 - Logo minimal size adjustments */
.frilar-logo{height:24px;max-width:120px;object-fit:contain}
@media (max-width:600px){
  .frilar-logo{height:20px;max-width:100px}
}