/* XP Start menu styling — applies ONLY to XP skins (blue/olive/silver). Win95 untouched. */

/* Helper scope for all XP rules */
body:is(.ag-skin-xp-blue,.ag-skin-xp-olive,.ag-skin-xp-silver) #start-menu.start-menu{
  position:absolute;
  left:6px;
  bottom:calc(var(--taskbar-h,40px) + 6px);
  width:420px;
  min-height:300px;
  display:flex;
  flex-direction:column; /* header on top */
  overflow:hidden;
  z-index:45000;
  border-radius:12px;
  box-sizing:border-box;
  background-clip:padding-box;
}

/* Hide toggle (kept global is fine, but harmless) */
#start-menu.start-menu.hidden{ display:none !important; }

/* Container look per XP skin */
body.ag-skin-xp-blue  #start-menu.start-menu{
  background:linear-gradient(#f3f7ff,#e4ecff);
  border:1px solid #2f4b8f;
  box-shadow:0 14px 36px rgba(0,0,0,.35);
}
body.ag-skin-xp-olive #start-menu.start-menu{
  background:linear-gradient(#f1f5e8,#e6edd3);
  border:1px solid #6b8f2d;
  box-shadow:0 14px 36px rgba(0,0,0,.35);
}
body.ag-skin-xp-silver #start-menu.start-menu{ /* FIX: space after body */
  background:linear-gradient(#f6f6f8,#eceef2);
  border:1px solid #7a7a7a;
  box-shadow:0 14px 36px rgba(0,0,0,.35);
}

/* ===== Header (brand) on top — XP only, reset vertical writing ===== */
body:is(.ag-skin-xp-blue,.ag-skin-xp-olive,.ag-skin-xp-silver) #start-menu .start-brand{
  order:0;
  display:flex; align-items:center; gap:10px;
  height:64px; width:100%;
  padding:8px 12px;
  writing-mode: horizontal-tb !important;
  transform: none !important;
  rotate: 0deg !important;
  border-bottom:1px solid rgba(0,0,0,.12);
  border-top-left-radius:12px;
  border-top-right-radius:12px;
  border-bottom-left-radius:0;
  border-bottom-right-radius:0;
  box-sizing:border-box;
}
body.ag-skin-xp-blue  #start-menu .start-brand{ background:linear-gradient(#6aa0ff,#2f6eea 55%,#1d57c9); }
body.ag-skin-xp-olive #start-menu .start-brand{ background:linear-gradient(#a2c173,#7aa14f 55%,#597f2f); }
body.ag-skin-xp-silver #start-menu .start-brand{ background:linear-gradient(#dfe6f2,#bfc7d6 60%,#a8afc0); }

/* User tile inside header */
body:is(.ag-skin-xp-blue,.ag-skin-xp-olive,.ag-skin-xp-silver) #start-menu .start-brand .user{
  display:flex; align-items:center; gap:10px;
}
body:is(.ag-skin-xp-blue,.ag-skin-xp-olive,.ag-skin-xp-silver) #start-menu .start-brand .user-avatar{
  width:48px; height:48px; border-radius:8px; flex:none;
  border:1px solid rgba(0,0,0,.25);
  background:linear-gradient(#ffffff,#dfe8ff); /* fallback if no image */
  object-fit:cover;
}
body:is(.ag-skin-xp-blue,.ag-skin-xp-olive,.ag-skin-xp-silver) #start-menu .start-brand .user-name{
  font:700 16px Tahoma, Arial, sans-serif;
  letter-spacing:.2px;
  line-height:1.2;
  writing-mode: horizontal-tb !important;
  transform:none !important;
  rotate:0 !important;
}
body.ag-skin-xp-blue  #start-menu .start-brand .user-name,
body.ag-skin-xp-olive #start-menu .start-brand .user-name{
  color:#fff; text-shadow:0 1px 0 rgba(0,0,0,.35);
}
body.ag-skin-xp-silver #start-menu .start-brand .user-name{
  color:#112; text-shadow:none;
}

/* Body */
body:is(.ag-skin-xp-blue,.ag-skin-xp-olive,.ag-skin-xp-silver) #start-menu .start-body{
  order:1; flex:1; display:flex; flex-direction:column;
  padding:10px; gap:8px; box-sizing:border-box;
}

/* Group and header */
body:is(.ag-skin-xp-blue,.ag-skin-xp-olive,.ag-skin-xp-silver) #start-menu .start-group{
  display:flex; flex-direction:column; gap:6px; position:static !important;
}
body:is(.ag-skin-xp-blue,.ag-skin-xp-olive,.ag-skin-xp-silver) #start-menu .start-header{
  font:700 12px Tahoma, Arial, sans-serif;
  color:#345; opacity:.85;
}

/* Programs list (keep inside, full width) */
body:is(.ag-skin-xp-blue,.ag-skin-xp-olive,.ag-skin-xp-silver) #start-menu .start-programs{
  list-style:none; margin:0; padding:4px;
  display:flex; flex-direction:column; gap:6px;
  max-height:48vh; overflow:auto;
  background:rgba(255,255,255,.45);
  border-radius:6px;
  width:100%;
  box-sizing:border-box;
  position:static !important; float:none !important;
}

/* Items */
body:is(.ag-skin-xp-blue,.ag-skin-xp-olive,.ag-skin-xp-silver) #start-menu .start-item{
  display:flex; align-items:center; gap:10px;
  padding:6px 10px; border-radius:6px; cursor:pointer;
  border:1px solid transparent; color:#112;
  background:rgba(255,255,255,.65);
  box-sizing:border-box;
}
body:is(.ag-skin-xp-blue,.ag-skin-xp-olive,.ag-skin-xp-silver) #start-menu .start-item:hover{
  color:#fff;
}
body.ag-skin-xp-blue  #start-menu .start-item:hover{ background:linear-gradient(#6aa0ff,#2f6eea); border-color:#2f4b8f; }
body.ag-skin-xp-olive #start-menu .start-item:hover{ background:linear-gradient(#a2c173,#7aa14f); border-color:#6b8f2d; }
body.ag-skin-xp-silver #start-menu .start-item:hover{ background:linear-gradient(#dfe6f2,#bfc7d6); border-color:#7a7a7a; color:#123; }

/* Divider */
body:is(.ag-skin-xp-blue,.ag-skin-xp-olive,.ag-skin-xp-silver) #start-menu .start-divider{
  height:1px; margin:2px 0 0;
  background:rgba(0,0,0,.1);
  box-shadow:0 1px 0 rgba(255,255,255,.65) inset;
}

/* Shutdown button */
body:is(.ag-skin-xp-blue,.ag-skin-xp-olive,.ag-skin-xp-silver) #start-menu .start-actions{
  margin-top:auto; display:flex; justify-content:flex-end;
}
body:is(.ag-skin-xp-blue,.ag-skin-xp-olive,.ag-skin-xp-silver) #start-menu .start-actions .btn{
  height:26px; padding:0 12px; border-radius:6px; border:1px solid;
  font:700 12px Tahoma, Arial, sans-serif; cursor:pointer;
}
body.ag-skin-xp-blue  #start-menu .start-actions .btn{ background:linear-gradient(#ffc3a1,#ff8a5a); border-color:#c04a1a; color:#142; }
body.ag-skin-xp-olive #start-menu .start-actions .btn{ background:linear-gradient(#ffd0a8,#ff9a60); border-color:#a8602a; color:#142; }
body.ag-skin-xp-silver #start-menu .start-actions .btn{ background:linear-gradient(#ffe0cc,#ffb090); border-color:#a06030; color:#142; }
body:is(.ag-skin-xp-blue,.ag-skin-xp-olive,.ag-skin-xp-silver) #start-menu .start-actions .btn:hover{ filter:brightness(1.06); }
body:is(.ag-skin-xp-blue,.ag-skin-xp-olive,.ag-skin-xp-silver) #start-menu .start-actions .btn:active{ transform:translateY(1px); }

/* Scrollbar accents (optional) */
body.ag-skin-xp-blue  #start-menu .start-programs{ scrollbar-color:#6aa0ff #e7efff; }
body.ag-skin-xp-olive #start-menu .start-programs{ scrollbar-color:#7aa14f #eef5e0; }
body.ag-skin-xp-silver #start-menu .start-programs{ scrollbar-color:#bfc7d6 #f3f4f8; }