/* =========================================================================
   Avoscours Aside widget — frontend styles
   Variant classes provide design defaults; Elementor style controls override
   these via higher-specificity inline rules when set.
   ========================================================================= */

.avo-aside{
  position:relative;
  overflow:hidden;
  display:flex;
  flex-wrap:wrap;
  column-gap:18px;
  align-items:flex-start;
  margin:32px 0;
  padding:24px 28px;
  border-radius:20px;
  font-family:"Figtree",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;
  box-sizing:border-box;
}
.avo-aside *{box-sizing:border-box;}

.avo-aside__icon{
  width:44px;height:44px;
  border-radius:12px;
  flex-shrink:0;
  display:grid;place-items:center;
}
.avo-aside__icon svg{width:22px;height:22px;fill:currentColor;}
.avo-aside__icon i{font-size:22px;line-height:1;color:inherit;}

.avo-aside__body{flex:1 1 auto;min-width:0;position:relative;}

.avo-aside__eyebrow{
  display:flex;align-items:center;gap:8px;
  font-size:11px;font-weight:800;letter-spacing:.12em;
  text-transform:uppercase;
  margin-bottom:8px;
}
.avo-aside__dash{
  display:inline-block;width:22px;height:2px;
  background:currentColor;opacity:.9;border-radius:2px;flex-shrink:0;
}

.avo-aside__title{
  font-weight:800;font-size:19px;line-height:1.25;
  letter-spacing:.01em;
  margin:0 0 8px;
}
.avo-aside__title em,.avo-aside__title i{font-style:italic;}

.avo-aside__text{font-size:16px;line-height:1.6;}
.avo-aside__text p{margin:0;}
.avo-aside__text p + p{margin-top:12px;}
.avo-aside__text a{color:inherit;text-decoration:underline;}

.avo-aside__action{flex-basis:100%;margin-top:16px;}

.avo-aside__btn{
  display:inline-flex;align-items:center;justify-content:center;gap:10px;
  padding:13px 22px;border-radius:999px;
  font-weight:800;font-size:12.5px;letter-spacing:.06em;
  text-transform:uppercase;text-decoration:none;
  cursor:pointer;border:none;white-space:nowrap;
  transition:all .22s cubic-bezier(.22,.61,.36,1);
}
.avo-aside__btn:hover{transform:translateY(-1px);}
.avo-aside__btn-icon{display:inline-flex;}
.avo-aside__btn-icon svg{width:16px;height:16px;fill:currentColor;}
.avo-aside__btn-icon i{font-size:14px;}

.avo-aside__note{
  margin-top:10px;font-size:11px;opacity:.75;
  display:flex;align-items:center;gap:6px;
}
.avo-aside__note-icon{display:inline-flex;}
.avo-aside__note-icon svg{width:14px;height:14px;fill:currentColor;}

.avo-aside__bubble{
  position:absolute;right:-30px;bottom:-30px;
  width:150px;height:150px;border-radius:50%;
  background:currentColor;opacity:.10;
  pointer-events:none;
}

/* ---------- Side-by-side (button on the right) ---------- */
.avo-aside--split{align-items:center;flex-wrap:nowrap;}
.avo-aside--split .avo-aside__action{
  flex-basis:auto;margin-top:0;margin-left:auto;flex-shrink:0;
}

/* ---------- Variant: quick-answer (mint, no icon) ---------- */
.avo-aside--quick-answer{background:#E5F5F4;border:1px solid #C0E7E5;}
.avo-aside--quick-answer .avo-aside__eyebrow{color:#00736E;}
.avo-aside--quick-answer .avo-aside__title{color:#034155;}
.avo-aside--quick-answer .avo-aside__text{color:#034155;}

/* ---------- Variant: tip (mint + icon) ---------- */
.avo-aside--tip{background:#E5F5F4;border:1px solid #C0E7E5;}
.avo-aside--tip .avo-aside__icon{background:#00A19A;color:#fff;}
.avo-aside--tip .avo-aside__title{color:#00736E;}
.avo-aside--tip .avo-aside__text{color:#034155;}

/* ---------- Variant: important (peach + icon) ---------- */
.avo-aside--important{background:#FFEEE3;border:1px solid #FFD3B6;}
.avo-aside--important .avo-aside__icon{background:#EA5B0C;color:#fff;}
.avo-aside--important .avo-aside__title{color:#A23A05;}
.avo-aside--important .avo-aside__text{color:#034155;}

/* ---------- Variant: key (navy) ---------- */
.avo-aside--key{background:#005470;color:#fff;border:none;}
.avo-aside--key .avo-aside__icon{background:rgba(255,255,255,.15);color:#fff;}
.avo-aside--key .avo-aside__title{color:rgba(255,255,255,.78);}
.avo-aside--key .avo-aside__text{color:#fff;}
.avo-aside--key .avo-aside__text strong{color:#fff;}
.avo-aside--key .avo-aside__bubble{display:none;}

/* ---------- Variant: cta-dark (gradient) ---------- */
.avo-aside--cta-dark{background:linear-gradient(155deg,#005470,#034155);color:#fff;border:none;}
.avo-aside--cta-dark .avo-aside__eyebrow{color:#FF8B47;}
.avo-aside--cta-dark .avo-aside__title{color:#fff;}
.avo-aside--cta-dark .avo-aside__text{color:rgba(255,255,255,.85);font-size:13px;}
.avo-aside--cta-dark .avo-aside__btn{background:#EA5B0C;color:#fff;width:100%;}
.avo-aside--cta-dark .avo-aside__btn:hover{background:#C84B08;}
.avo-aside--cta-dark .avo-aside__note{color:rgba(255,255,255,.65);justify-content:center;text-align:center;}
.avo-aside--cta-dark .avo-aside__bubble{background:#EA5B0C;opacity:.18;}

/* ---------- Variant: cta-orange ---------- */
.avo-aside--cta-orange{background:#EA5B0C;color:#fff;border:none;}
.avo-aside--cta-orange .avo-aside__icon{background:rgba(255,255,255,.2);color:#fff;}
.avo-aside--cta-orange .avo-aside__eyebrow{color:rgba(255,255,255,.85);}
.avo-aside--cta-orange .avo-aside__title{color:#fff;}
.avo-aside--cta-orange .avo-aside__text{color:rgba(255,255,255,.9);font-size:14px;}
.avo-aside--cta-orange .avo-aside__btn{background:#fff;color:#005470;}
.avo-aside--cta-orange .avo-aside__btn:hover{background:#FFF4EC;}
.avo-aside--cta-orange .avo-aside__note{color:rgba(255,255,255,.9);}
.avo-aside--cta-orange .avo-aside__bubble{background:#fff;opacity:.12;}

/* ---------- Variant: plain (white card) ---------- */
.avo-aside--plain{background:#fff;border:1px solid #E5E5E1;box-shadow:0 8px 20px rgba(7,49,66,.08);}
.avo-aside--plain .avo-aside__icon{background:#00A19A;color:#fff;}
.avo-aside--plain .avo-aside__eyebrow{color:#00736E;}
.avo-aside--plain .avo-aside__title{color:#034155;}
.avo-aside--plain .avo-aside__text{color:#005470;font-size:14px;}
.avo-aside--plain .avo-aside__btn{background:#EA5B0C;color:#fff;}
.avo-aside--plain .avo-aside__btn:hover{background:#C84B08;}
.avo-aside--plain .avo-aside__bubble{background:#00A19A;opacity:.10;}

/* ---------- Responsive ---------- */
@media(max-width:767px){
  .avo-aside--split{flex-wrap:wrap;align-items:flex-start;}
  .avo-aside--split .avo-aside__action{flex-basis:100%;margin-left:0;margin-top:16px;}
  .avo-aside--split .avo-aside__btn{width:100%;}
}
