:root{
  /* Paleta inspirada en el logo */
  --ega-primary:#7880F8;
  --ega-primary-dark:#676FEA;
  --ega-primary-soft:#A7AEFF;

  --ega-support:#F090A8;
  --ega-support-dark:#E57E98;
  --ega-support-soft:#F7B8C8;

  --ega-motivation:#F8F8F8;
  --ega-motivation-soft:#FFF9FC;

  --ega-bg:#F5F1FB;
  --ega-ink:#312B4A;
  --ega-muted:rgba(49,43,74,.62);

  /* Superficies */
  --ega-panel:#FFFFFF;
  --ega-panel-soft:rgba(255,255,255,.78);
  --ega-panel-strong:rgba(255,255,255,.92);

  /* Bordes */
  --ega-border:rgba(49,43,74,.10);
  --ega-border-strong:rgba(49,43,74,.16);
  --ega-border-light:rgba(255,255,255,.68);

  /* Radios */
  --ega-radius-xl:26px;
  --ega-radius-lg:18px;
  --ega-radius-md:14px;
  --ega-radius-sm:12px;
  --ega-radius-pill:999px;

  /* Sombras */
  --ega-shadow-lg:0 18px 60px rgba(49,43,74,.12);
  --ega-shadow-md:0 10px 28px rgba(49,43,74,.10);
  --ega-shadow-sm:0 8px 18px rgba(49,43,74,.08);
  --ega-shadow-xs:0 4px 10px rgba(49,43,74,.05);

  /* Layout */
  --ega-sidebar-w:300px;
  --ega-sidebar-w-collapsed:92px;
  --ega-topbar-h:58px;
  --ega-shell-gap:22px;
  --ega-shell-pad:26px;

  /* UI compartida con Woo */
  --ega-btn-h:44px;
  --ega-input-h:46px;
  --ega-card-pad:18px;
  --ega-content-pad-x:22px;
  --ega-content-pad-y:22px;

  --ega-ring:0 0 0 4px rgba(120,128,248,.18);

  --ega-font:"Poppins", ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, Arial, "Noto Sans";
}

/* =========================================================
   Base
   ========================================================= */
*{ box-sizing:border-box; }

html,
body{
  height:100%;
}

html{
  -webkit-text-size-adjust:100%;
}

body.ega-app{
  margin:0;
  color:var(--ega-ink);
  font-family:var(--ega-font);
  background:
    radial-gradient(900px 600px at 14% 5%, rgba(240,144,168,.20), transparent 60%),
    radial-gradient(950px 620px at 86% 0%, rgba(120,128,248,.24), transparent 60%),
    radial-gradient(700px 420px at 40% 100%, rgba(240,144,168,.14), transparent 65%),
    linear-gradient(180deg, rgba(255,255,255,.40), rgba(255,255,255,0) 22%),
    var(--ega-bg);
  background-repeat:no-repeat;
  background-attachment:fixed;
}

img{
  max-width:100%;
  height:auto;
}

button,
input,
select,
textarea{
  font:inherit;
}

a{
  color:inherit;
}

:focus-visible{
  outline:none;
  box-shadow:var(--ega-ring);
  border-radius:12px;
}

/* =========================================================
   Shell
   ========================================================= */
.ega-shell{
  min-height:100vh;
  padding:var(--ega-shell-pad);
  display:grid;
  grid-template-columns:var(--ega-sidebar-w) 1fr;
  gap:var(--ega-shell-gap);
  transition:grid-template-columns .18s ease;
}

@media (min-width:981px){
  body.ega-sidebar-collapsed .ega-shell{
    grid-template-columns:var(--ega-sidebar-w-collapsed) 1fr;
  }
}

/* =========================================================
   Sidebar
   ========================================================= */
.ega-sidebar{
  position:sticky;
  top:26px;
  height:calc(100vh - 52px);
  padding:16px 12px;
  border-radius:28px;
  overflow:hidden;
  display:flex;
  flex-direction:column;
  background:
    radial-gradient(180px 140px at 85% 88%, rgba(240,144,168,.26), transparent 75%),
    linear-gradient(180deg, rgba(255,255,255,.12), rgba(255,255,255,.00)),
    linear-gradient(180deg, rgba(120,128,248,.98), rgba(103,111,234,.88));
  border:1px solid rgba(255,255,255,.18);
  box-shadow:var(--ega-shadow-md);
}

/* =========================================================
   Brand
   ========================================================= */
.ega-brand{
  width:84px;
  height:84px;
  margin:6px auto 14px;
  padding:0;
  display:flex;
  align-items:center;
  justify-content:center;
  border-radius:22px;
  overflow:hidden;
  background:rgba(255,255,255,.26);
  border:1px solid rgba(255,255,255,.42);
  box-shadow:0 14px 30px rgba(49,43,74,.16);
  transition:width .18s ease, height .18s ease, border-radius .18s ease;
}

.ega-brand__link{
  width:100%;
  height:100%;
  display:flex;
  align-items:center;
  justify-content:center;
  text-decoration:none;
}

.ega-brand__logo{
  width:100%;
  height:100%;
  display:block;
  object-fit:contain;
  object-position:center;
}

.ega-brand__text{
  padding:10px;
  color:rgba(255,255,255,.96);
  text-align:center;
  font-weight:800;
  font-size:13px;
}

@media (min-width:981px){
  body.ega-sidebar-collapsed .ega-brand{
    width:54px;
    height:54px;
    border-radius:16px;
  }
}

/* =========================================================
   Sidebar nav
   ========================================================= */
.ega-nav ul{
  list-style:none;
  margin:0;
  padding:6px;
  display:grid;
  gap:8px;
}

.ega-nav a{
  min-height:46px;
  display:flex;
  align-items:center;
  gap:10px;
  padding:12px 14px;
  border-radius:14px;
  text-decoration:none;
  color:rgba(255,255,255,.94);
  background:transparent;
  font-weight:500;
  opacity:.97;
  transition:background-color .14s ease, transform .14s ease, opacity .14s ease, box-shadow .14s ease;
}

.ega-nav a:hover{
  background:rgba(255,255,255,.18);
  transform:translateY(-1px);
  opacity:1;
}

.ega-nav .current-menu-item > a,
.ega-nav .current_page_item > a{
  background:linear-gradient(135deg, rgba(255,255,255,.28), rgba(240,144,168,.18));
  box-shadow:0 10px 24px rgba(49,43,74,.16);
  font-weight:700;
  opacity:1;
}

.ega-nav--secondary{
  margin-top:auto;
  padding-top:12px;
  border-top:1px solid rgba(255,255,255,.22);
}

.ega-mi__icon{
  width:22px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  font-size:18px;
  line-height:1;
}

.ega-mi__icon--dot{
  width:10px;
  height:10px;
  border-radius:999px;
  background:rgba(255,255,255,.90);
  box-shadow:0 6px 14px rgba(49,43,74,.18);
}

@media (min-width:981px){
  body.ega-sidebar-collapsed .ega-mi__text{
    display:none;
  }

  body.ega-sidebar-collapsed .ega-nav a{
    justify-content:center;
    gap:0;
    padding:12px 10px;
  }
}

/* =========================================================
   Main panel
   ========================================================= */
.ega-main{
  min-width:0;
  border-radius:34px;
  background:rgba(255,255,255,.58);
  border:1px solid rgba(255,255,255,.60);
  box-shadow:var(--ega-shadow-lg);
  overflow:visible;
  backdrop-filter:blur(10px);
}

/* =========================================================
   Topbar
   ========================================================= */
.ega-topbar{
  min-height:var(--ega-topbar-h);
  display:flex;
  align-items:center;
  gap:10px;
  padding:16px var(--ega-content-pad-x) 8px;
  position:relative;
  z-index:50;
}

.ega-topbar-spacer{
  flex:1;
}

.ega-burger,
.ega-cartbtn,
.ega-userbtn,
.ega-topbar__login{
  min-height:var(--ega-btn-h);
}

.ega-burger{
  width:40px;
  height:40px;
  display:inline-grid;
  place-items:center;
  border-radius:12px;
  border:1px solid var(--ega-border);
  background:var(--ega-panel-soft);
  color:var(--ega-ink);
  box-shadow:var(--ega-shadow-sm);
  cursor:pointer;
  transition:transform .16s ease, background-color .16s ease, box-shadow .16s ease, color .16s ease;
}

.ega-burger:hover{
  transform:translateY(-1px);
  background:var(--ega-panel-strong);
  box-shadow:0 12px 24px rgba(49,43,74,.10);
  color:var(--ega-primary);
}

/* =========================================================
   Search
   ========================================================= */
.ega-search{
  width:min(520px, 52vw);
}

.ega-search__input{
  width:100%;
  min-height:var(--ega-input-h);
  padding:12px 14px;
  border-radius:var(--ega-radius-pill);
  border:1px solid var(--ega-border);
  background:var(--ega-panel-soft);
  color:var(--ega-ink);
  outline:none;
  box-shadow:var(--ega-shadow-xs);
}

.ega-search__input::placeholder{
  color:var(--ega-muted);
}

.ega-search__input:focus{
  border-color:rgba(120,128,248,.45);
  box-shadow:var(--ega-ring);
}

/* =========================================================
   Topbar nav menu
   ========================================================= */
.ega-topbar > ul{
  list-style:none;
  margin:0 0 0 4px;
  padding:4px;
  display:flex;
  align-items:center;
  gap:6px;
  border-radius:999px;
  background:rgba(255,255,255,.42);
  border:1px solid rgba(255,255,255,.48);
  backdrop-filter:blur(10px);
}

.ega-topbar > ul li{
  margin:0;
  padding:0;
}

.ega-topbar > ul a{
  display:flex;
  align-items:center;
  min-height:40px;
  padding:10px 14px;
  border-radius:999px;
  text-decoration:none;
  color:var(--ega-ink);
  font-size:14px;
  font-weight:700;
  transition:background-color .16s ease, color .16s ease, transform .16s ease;
}

.ega-topbar > ul a:hover,
.ega-topbar > ul .current-menu-item > a,
.ega-topbar > ul .current_page_item > a{
  background:rgba(120,128,248,.12);
  color:var(--ega-primary-dark);
}

/* =========================================================
   Content
   ========================================================= */
.ega-content{
  padding:10px var(--ega-content-pad-x) var(--ega-content-pad-y);
}

/* =========================================================
   Cards
   ========================================================= */
.ega-card{
  padding:var(--ega-card-pad);
  background:rgba(255,255,255,.88);
  border:1px solid rgba(49,43,74,.08);
  border-radius:var(--ega-radius-xl);
  box-shadow:var(--ega-shadow-sm);
}

.ega-card--accent{
  border:2px solid rgba(120,128,248,.28);
  box-shadow:0 18px 44px rgba(120,128,248,.14);
}

/* =========================================================
   Cart button
   ========================================================= */
.ega-cartbtn{
  position:relative;
  display:inline-flex;
  align-items:center;
  gap:10px;
  padding:10px 14px;
  border-radius:999px;
  text-decoration:none;
  color:var(--ega-ink);
  background:var(--ega-panel-soft);
  border:1px solid var(--ega-border);
  box-shadow:var(--ega-shadow-sm);
  transition:transform .16s ease, box-shadow .16s ease, background-color .16s ease, color .16s ease;
}

.ega-cartbtn:hover{
  transform:translateY(-1px);
  background:var(--ega-panel-strong);
  box-shadow:0 12px 24px rgba(49,43,74,.10);
  color:var(--ega-primary);
}

.ega-cartbtn__icon{
  width:18px;
  height:18px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  font-size:18px;
}

.ega-cartbtn__text{
  font-size:14px;
  line-height:1;
  font-weight:700;
}

.ega-cartbtn__count{
  min-width:22px;
  height:22px;
  padding:0 6px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border-radius:999px;
  background:linear-gradient(135deg, var(--ega-support), var(--ega-support-dark));
  color:#fff;
  font-size:12px;
  line-height:1;
  font-weight:800;
  box-shadow:0 8px 18px rgba(240,144,168,.28);
}

/* =========================================================
   User button + dropdown
   ========================================================= */
.ega-userwrap{
  position:relative;
  z-index:60;
}

.ega-userbtn{
  display:flex;
  align-items:center;
  gap:10px;
  padding:10px 12px;
  border-radius:999px;
  background:var(--ega-panel-soft);
  border:1px solid var(--ega-border);
  box-shadow:var(--ega-shadow-sm);
  color:var(--ega-ink);
  cursor:pointer;
  transition:transform .16s ease, box-shadow .16s ease, background-color .16s ease;
}

.ega-userbtn:hover{
  transform:translateY(-1px);
  background:var(--ega-panel-strong);
  box-shadow:0 12px 24px rgba(49,43,74,.10);
}

.ega-user__avatar{
  width:40px;
  height:40px;
  flex:0 0 40px;
  overflow:hidden;
  border-radius:999px;
  box-shadow:0 10px 20px rgba(49,43,74,.12);
}

.ega-user__img{
  width:100%;
  height:100%;
  display:block;
  object-fit:cover;
}

.ega-user__meta{
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  line-height:1.1;
}

.ega-user__name{
  font-size:14px;
  font-weight:800;
}

.ega-user__sub{
  margin-top:2px;
  color:var(--ega-muted);
  font-size:12px;
}

.ega-usermenu{
  position:absolute;
  right:0;
  top:calc(100% + 10px);
  width:230px;
  overflow:hidden;
  border-radius:16px;
  background:rgba(255,255,255,.94);
  border:1px solid var(--ega-border);
  box-shadow:0 18px 60px rgba(49,43,74,.14);
  backdrop-filter:blur(14px);
  z-index:9999;
}

.ega-usermenu__item{
  display:flex;
  align-items:center;
  min-height:46px;
  padding:12px 14px;
  text-decoration:none;
  color:var(--ega-ink);
  font-weight:600;
}

.ega-usermenu__item:hover{
  background:rgba(120,128,248,.12);
}

.ega-usermenu__item--danger{
  color:#8a1d14;
}

.ega-usermenu__item--danger:hover{
  background:rgba(255,80,60,.12);
}

/* =========================================================
   Login button
   ========================================================= */
.ega-topbar__login{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:10px 16px;
  border-radius:999px;
  text-decoration:none;
  color:#fff;
  font-size:14px;
  font-weight:800;
  background:linear-gradient(135deg, var(--ega-primary), var(--ega-primary-soft));
  box-shadow:0 10px 24px rgba(120,128,248,.26);
  transition:transform .16s ease, box-shadow .16s ease, filter .16s ease;
}

.ega-topbar__login:hover{
  transform:translateY(-1px);
  box-shadow:0 16px 30px rgba(120,128,248,.32);
  filter:saturate(1.03);
  color:#fff;
}

/* =========================================================
   Woo width harmony
   ========================================================= */
.ega-content > .ega-woo{
  margin-top:2px;
}

.ega-content > .ega-woo > .ega-woo__inner{
  width:min(1240px, 100%);
  margin:0 auto;
}

/* =========================================================
   Mobile
   ========================================================= */
@media (max-width:980px){
  .ega-shell{
    padding:14px;
    grid-template-columns:1fr;
    gap:14px;
  }

  .ega-sidebar{
    position:fixed;
    top:14px;
    left:14px;
    width:min(var(--ega-sidebar-w), 88vw);
    height:calc(100vh - 28px);
    transform:translateX(-110%);
    transition:transform .2s ease;
    z-index:9999;
  }

  body.ega-sidebar-open .ega-sidebar{
    transform:translateX(0);
  }

  .ega-main{
    border-radius:26px;
  }

  .ega-topbar{
    flex-wrap:wrap;
    gap:8px;
    padding:10px 14px 8px;
  }

  .ega-topbar-spacer{
    flex:1 1 auto;
  }

  .ega-topbar > ul{
    width:100%;
    order:6;
    margin:2px 0 0;
    justify-content:flex-start;
    flex-wrap:wrap;
    border-radius:18px;
    padding:6px;
  }

  .ega-topbar > ul a{
    min-height:38px;
    padding:9px 12px;
  }

  .ega-cartbtn__text,
  .ega-user__sub{
    display:none;
  }

  .ega-cartbtn,
  .ega-userbtn{
    padding:10px 12px;
  }

  .ega-content{
    padding:8px 14px 14px;
  }

  .ega-search{
    width:100%;
    order:5;
  }
}

/* =========================================================
   Collapsed tooltips
   ========================================================= */
@media (min-width:981px){
  .ega-sidebar{
    z-index:200;
  }

  body.ega-sidebar-collapsed .ega-nav a[data-tip]{
    position:relative;
  }

  body.ega-sidebar-collapsed .ega-nav a[data-tip]::after{
    content:attr(data-tip);
    position:absolute;
    left:calc(100% + 12px);
    top:50%;
    transform:translateY(-50%);
    white-space:nowrap;
    padding:8px 10px;
    border-radius:12px;
    background:rgba(255,255,255,.95);
    border:1px solid rgba(49,43,74,.12);
    box-shadow:0 14px 40px rgba(49,43,74,.18);
    color:var(--ega-ink);
    font-size:13px;
    font-weight:600;
    opacity:0;
    pointer-events:none;
    transition:opacity .12s ease, transform .12s ease;
    z-index:999999;
  }

  body.ega-sidebar-collapsed .ega-nav a[data-tip]::before{
    content:"";
    position:absolute;
    left:calc(100% + 6px);
    top:50%;
    transform:translateY(-50%) rotate(-45deg);
    width:10px;
    height:10px;
    background:rgba(255,255,255,.95);
    border-left:1px solid rgba(49,43,74,.12);
    border-top:1px solid rgba(49,43,74,.12);
    opacity:0;
    pointer-events:none;
    transition:opacity .12s ease;
    z-index:999999;
  }

  body.ega-sidebar-collapsed .ega-nav a[data-tip]:hover::after,
  body.ega-sidebar-collapsed .ega-nav a[data-tip]:focus-visible::after{
    opacity:1;
    transform:translateY(-50%) translateX(2px);
  }

  body.ega-sidebar-collapsed .ega-nav a[data-tip]:hover::before,
  body.ega-sidebar-collapsed .ega-nav a[data-tip]:focus-visible::before{
    opacity:1;
  }
}

/* =========================================================
   Reduced motion
   ========================================================= */
@media (prefers-reduced-motion: reduce){
  *,
  *::before,
  *::after{
    animation:none !important;
    transition:none !important;
    scroll-behavior:auto !important;
  }
}