/* ===== AstroHub Portal (scoped to .ahp-wrap) ===== */

/* Palette & layout */
.ahp-wrap{--p-bg:#0f0a1a;--p-surface:#161027;--p-border:#2a1f41;--p-text:#f1ecff;--p-muted:#cfc6e6;--p-purple:#6c3cc9;--p-purple-2:#8747f1;--p-gold:#f2c234}
.ahp-wrap .ahp-container{max-width:1100px;margin:0 auto;padding:0 18px}
.ahp-wrap .ahp-topbar{position:sticky;top:0;z-index:10;background:#4b1fb3}
.ahp-wrap .ahp-topbar .ahp-container{display:flex;align-items:center;justify-content:space-between;height:64px}
.ahp-wrap .ahp-brand{color:#fff;font-weight:800;font-size:22px}

/* Tabs */
.ahp-wrap .ahp-menu{display:flex;gap:10px}

/* anchor reset (kill underline everywhere) */
.ahp-wrap .ahp-item,
.ahp-wrap .ahp-item:link,
.ahp-wrap .ahp-item:visited,
.ahp-wrap .ahp-item:hover,
.ahp-wrap .ahp-item:focus,
.ahp-wrap .ahp-item:active,
.ahp-wrap .ahp-item span{ text-decoration:none !important; }

/* base */
.ahp-wrap .ahp-item{
  display:inline-flex;align-items:center;gap:8px;
  border:0;background:rgba(255,255,255,.12);color:#fff;
  padding:8px 14px;border-radius:12px;cursor:pointer;
  text-decoration:none; position:relative; outline:0;
  transition:background .2s ease, box-shadow .2s ease, transform .15s ease, color .2s ease;
}
.ahp-wrap .ahp-item .dashicons{font-size:16px;line-height:1}

/* hover / focus-visible */
.ahp-wrap .ahp-item:hover{
  background:rgba(255,255,255,.18);
  box-shadow:0 6px 18px rgba(0,0,0,.18), inset 0 0 0 1px rgba(255,255,255,.28);
  transform:translateY(-1px);
}
.ahp-wrap .ahp-item:focus-visible{
  box-shadow:0 0 0 3px rgba(255,255,255,.55), 0 2px 10px rgba(0,0,0,.2);
}

/* active tab */
.ahp-wrap .ahp-item.is-active{
  background:rgba(255,255,255,.95);
  color:#4b1fb3;
  box-shadow:0 6px 20px rgba(0,0,0,.12);
}

/* pressed */
.ahp-wrap .ahp-item:active{
  transform:translateY(0);
  box-shadow:0 2px 8px rgba(0,0,0,.18);
}

.ahp-wrap .ahp-panels{padding:28px 0}

/* Panel cards */
.ahp-wrap .ahp-card{background:#fff;border:0;border-radius:18px;box-shadow:0 18px 40px rgba(0,0,0,.2);color:#24103f}
.ahp-wrap .ahp-card + .ahp-card{margin-top:22px}
.ahp-wrap .ahp-card .ahp-section{padding:26px}
.ahp-wrap .ahp-title{font-size:48px;line-height:1.1;color:#4b1fb3;font-weight:900;margin:0 0 12px}
.ahp-wrap .ahp-note{border-left:8px solid #8f64ff;background:#efe8ff;padding:14px 16px;border-radius:10px;margin:8px 0 18px}
.ahp-wrap .ahp-progress-wrap{background:#e9e6f5;border-radius:999px;height:20px;overflow:hidden}
.ahp-wrap .ahp-progress{height:100%;width:65%;background:#e1b436;border-radius:999px;text-align:center;font-weight:800;color:#3b2b02;font-size:12px;line-height:20px}
.ahp-wrap .ahp-text{font-size:18px;line-height:1.8;color:#2b1a44}
.ahp-wrap .ahp-muted{color:#6d5b86}

/* Forms */
.ahp-wrap .ahp-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
@media (max-width:720px){.ahp-wrap .ahp-grid{grid-template-columns:repeat(2,1fr)}}
.ahp-wrap .ahp-input,.ahp-wrap .ahp-select{background:#110b1c;border:1px solid #2a1f41;color:#fff;border-radius:10px;padding:10px}
.ahp-wrap .ahp-btn{display:inline-flex;align-items:center;gap:8px;padding:10px 16px;border-radius:10px;background:linear-gradient(180deg,#ffd86a,var(--p-gold));color:#351f00;border:0;font-weight:800;cursor:pointer}
.ahp-wrap .ahp-chip{display:inline-block;padding:4px 10px;border-radius:999px;background:rgba(75,31,179,.12);color:#4b1fb3;font-weight:700}

/* Panels (server renders only one, keep for consistency) */
.ahp-wrap .ahp-panel{display:block}




.astrohub-horoscope-tab h1 {
    color: #6a1b9a;
    font-size: 2em;
    margin-bottom: 0.5em;
}

.horoscope-note {
    background: #f3e5f5;
    padding: 1em;
    border-radius: 4px;
    margin-bottom: 1em;
    font-style: italic;
}

.progress-bar {
    background: #e0e0e0;
    border-radius: 20px;
    height: 10px;
    position: relative;
    margin-bottom: 1em;
}

.progress-fill {
    background: #ffd700;
    height: 100%;
    border-radius: 20px;
}

.progress-label {
    position: absolute;
    top: -20px;
    left: 50%;
    transform: translateX(-50%);
    font-weight: bold;
}

.horoscope-text {
    line-height: 1.6;
    margin-bottom: 2em;
}

.aspects-container {
    display: flex;
    overflow-x: auto;
    gap: 1em;
    margin-bottom: 2em;
}

.aspect-item {
    display: flex;
    flex-direction: column;
    align-items: center;
    min-width: 100px;
}

.aspect-circle {
    width: 50px;
    height: 50px;
    border: 1px solid #ccc;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 0.5em;
}

.planet-symbol, .aspect-symbol {
    font-size: 1.2em;
    color: #2196f3;
}

.aspect-line {
    width: 2px;
    height: 10px;
    background: #ccc;
}

.aspect-label {
    text-align: center;
    font-size: 0.8em;
    color: #333;
}

.blurred {
    filter: blur(5px);
    opacity: 0.7;
    pointer-events: none;
}

.signup-prompt {
    text-align: center;
    margin: 1em 0;
}

.read-button {
    background: #6a1b9a;
    color: white;
    padding: 0.5em 1em;
    border-radius: 20px;
    text-decoration: none;
    display: inline-block;
    margin: 1em auto;
}
