/* Minimal styles for the Rezolve demo aggregator */
:root{--accent:#0b5cff;--bg:#ffffff}
html,body{height: 100%;}
/* Landing page */
#landing-view{}
.landing-hero{min-height:100vh;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;background:linear-gradient(135deg,#0b5cff 0%,#0038b8 100%);color:#fff;padding:2rem}
.landing-hero h1{font-size:2.5rem;margin:0 0 0.75rem}
.landing-hero p{font-size:1.1rem;opacity:0.9;margin:0 0 2rem}
.login-btn{background:#fff;color:var(--accent);padding:0.75rem 2rem;border-radius:6px;font-size:1rem;font-weight:700;text-decoration:none;transition:opacity 0.15s}
.login-btn:hover{opacity:0.88}
.auth-error{background:rgba(0,0,0,0.25);border-radius:8px;padding:1rem 1.5rem;margin-bottom:1.25rem;max-width:360px}
.auth-error-msg{margin:0 0 1rem;font-size:0.95rem;line-height:1.5}
*{box-sizing:border-box}
body{font-family:system-ui,-apple-system,Segoe UI,Roboto,"Helvetica Neue",Arial;margin:0;background:var(--bg);color:#111;background-image:url(./demos-bg.jpg);background-size: cover;background-repeat: no-repeat;}

#app-view {height: 100%;}



header{background:var(--accent);color:#fff;padding:1rem;display:flex;justify-content:space-between;align-items:center;

display: none!important;

}
.header-left{}
header h1{margin:0;font-size:1.25rem}
header p{margin:0.25rem 0 0;font-size:0.9rem;opacity:0.95}
.header-right{display:flex;align-items:center;gap:0.75rem;flex-shrink:0}
#user-email{font-size:0.85rem;opacity:0.9}
.logout-btn{background:#fff;color:var(--accent);border-radius:4px;padding:0.3rem 0.75rem;font-size:0.85rem;font-weight:600;text-decoration:none;white-space:nowrap}
.logout-btn:hover{background:#e8eeff}
main{padding:1rem;height: 100%;}
.demo-list{display: flex;justify-content: center;align-items: center;height: 100%;}
.demo{width: calc(15% - 1rem);margin: 0 4rem;position:relative;}
.demo > img{width:100%;height:auto;}
.demo > a{text-decoration: none;display:block;width:100%;height:calc(100% - 4px);position:absolute;left:0;top:0;z-index:2;background-color:rgba(0,0,0,0.2);overflow:hidden;}
.demo > a:hover{background-color:rgba(0,0,0,0);}
.demo > a > div{position: absolute;transform: rotate(-90deg);left: -80%;top: 40%;width: 200%;background-color: rgba(255, 255, 255, 0.35);padding: 1rem 5rem;color: white;font-size: 1.5rem;letter-spacing:3px;}
