
/* Flinapp CMS V4.24.30 — Final professional template/layout repair */

/* ---------- Global ---------- */
:root{
 --fx30-bg:#07111f;--fx30-bg2:#091624;--fx30-panel:#0d2136;--fx30-panel2:#0a1a2b;
 --fx30-line:rgba(116,157,198,.16);--fx30-line2:rgba(116,157,198,.26);
 --fx30-text:#f5f9ff;--fx30-muted:#8da5bb;--fx30-blue:#168ff0;--fx30-violet:#6d50ed;
 --fx30-green:#19c58b;--fx30-radius:18px;--fx30-shadow:0 18px 45px rgba(0,0,0,.14)
}
*{box-sizing:border-box}
html,body{max-width:100%;overflow-x:hidden!important}
body{background:var(--fx30-bg)!important;color:var(--fx30-text)}
.main,.view,.admin-section,.card,.shell,.portal-auth-shell,.page-designer-shell{min-width:0!important;max-width:100%!important}
img,svg,video,canvas,iframe{max-width:100%!important}
.hidden{display:none!important}

/* ---------- Admin ---------- */
.sidebar{background:linear-gradient(180deg,#081521,#06101b)!important;border-right:1px solid var(--fx30-line)!important}
.main{background:radial-gradient(circle at 8% 0%,rgba(22,143,240,.04),transparent 28%),linear-gradient(180deg,#07111f,#07121f)!important}
.topbar{min-height:72px!important;padding:10px 0 18px!important;border-bottom:1px solid rgba(116,155,194,.10)!important}
.topbar h1{font-size:clamp(25px,2.5vw,35px)!important;letter-spacing:-.04em!important}
.top-actions{display:flex!important;gap:8px!important;flex-wrap:wrap!important;align-items:center!important}
.admin-section{padding-top:20px!important;overflow-x:hidden!important}
.card{
 border:1px solid var(--fx30-line)!important;border-radius:var(--fx30-radius)!important;
 background:linear-gradient(180deg,rgba(13,33,54,.98),rgba(8,22,37,.99))!important;
 box-shadow:var(--fx30-shadow)!important
}
input,select,textarea{max-width:100%!important;border:1px solid rgba(115,156,197,.21)!important;border-radius:11px!important}
input:focus,select:focus,textarea:focus{border-color:#3c92e5!important;box-shadow:0 0 0 3px rgba(48,135,225,.10)!important}
.primary{border:0!important;border-radius:10px!important;background:linear-gradient(135deg,var(--fx30-blue),var(--fx30-violet))!important}
.ghost,button{border-radius:10px!important}

/* Admin page grids */
#overview .stats{display:grid!important;grid-template-columns:repeat(4,minmax(0,1fr))!important;gap:12px!important}
#overview .admin-grid,#settings .admin-grid,#payments .admin-grid{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:14px!important}
#settings .admin-wide{grid-column:1/-1!important}
#settings .card{padding:20px!important}
#settings .two{grid-template-columns:repeat(2,minmax(0,1fr))!important}
#settings .three{grid-template-columns:repeat(3,minmax(0,1fr))!important}
#page-designer .designer-grid,#page-designer .designer-theme-grid{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:14px!important}
#users .users-table,#builds #buildTable,#payments .admin-table{overflow:auto!important}
#packages .package-admin-grid{display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:12px!important}
#notifications .notification-layout{display:grid!important;grid-template-columns:minmax(0,1fr) minmax(330px,.85fr)!important;gap:14px!important}
#addons .fx-upgrade-grid,#cms-update .fx-upgrade-grid{display:grid!important;grid-template-columns:minmax(0,1.35fr) minmax(330px,.9fr)!important;gap:16px!important}
#maintenance .system-info-grid{display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:10px!important}

/* ---------- User page: theme demo without pink full-page fill ---------- */
.portal-auth-body{
 --theme-a:#168ff0;--theme-b:#6d50ed;
 min-height:100vh!important;
 background:radial-gradient(circle at 12% 4%,rgba(22,143,240,.10),transparent 28%),linear-gradient(145deg,#07111f,#091522)!important
}
.page-theme-aurastudio.portal-auth-body{
 --theme-a:#815ce9;--theme-b:#9d62d1;
 background:radial-gradient(circle at 14% 4%,rgba(129,92,233,.09),transparent 28%),linear-gradient(145deg,#0a1120,#0d1424)!important
}
.page-theme-novatech.portal-auth-body{--theme-a:#168ff0;--theme-b:#436cf2}
.fx-user-auth{min-height:100vh!important;display:grid!important;grid-template-columns:minmax(0,1.08fr) minmax(420px,.72fr)!important;background:transparent!important}
.fx-user-showcase{
 min-height:100vh!important;padding:58px clamp(36px,6vw,88px)!important;border:0!important;border-right:1px solid var(--fx30-line)!important;border-radius:0!important;
 background:radial-gradient(circle at 15% 7%,rgba(22,143,240,.09),transparent 28%),linear-gradient(145deg,#0a1a2b,#081522)!important
}
.page-theme-aurastudio .fx-user-showcase{
 background:radial-gradient(circle at 15% 7%,rgba(129,92,233,.11),transparent 28%),linear-gradient(145deg,#11182a,#0b1423)!important
}
.fx-user-showcase .portal-auth-copy h1{max-width:720px!important;font-size:clamp(40px,5vw,68px)!important;line-height:1!important;letter-spacing:-.05em!important}
.fx-user-showcase .portal-auth-copy>p{max-width:700px!important;color:#93a9be!important;font-size:15px!important;line-height:1.75!important}
.fx-user-showcase .auth-feature-list{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:9px!important}
.fx-user-showcase .auth-feature-list span{padding:12px!important;border:1px solid var(--fx30-line)!important;border-radius:12px!important;background:rgba(6,20,34,.60)!important}
.fx-user-panel{width:min(510px,calc(100% - 46px))!important;margin:auto!important;padding:34px!important;border:1px solid var(--fx30-line)!important;border-radius:22px!important;background:linear-gradient(180deg,#0d2136,#091827)!important;box-shadow:0 30px 80px rgba(0,0,0,.30)!important}
.page-theme-aurastudio .fx-user-panel{background:linear-gradient(180deg,#151c2f,#0c1423)!important}
.fx-user-panel .auth-tabs button.active{background:linear-gradient(135deg,var(--theme-a),var(--theme-b))!important;color:#fff!important}

/* ---------- App Studio: remove non-working demo chips and pink shell ---------- */
.studio-page-designed{
 --studio-a:#168ff0;--studio-b:#6d50ed;
 min-height:100vh!important;
 background:radial-gradient(circle at 12% 0%,rgba(22,143,240,.04),transparent 28%),linear-gradient(180deg,#07111f,#07121f)!important
}
.page-theme-aurastudio.studio-page-designed{
 --studio-a:#815ce9;--studio-b:#9d62d1;
 background:radial-gradient(circle at 12% 0%,rgba(129,92,233,.055),transparent 27%),linear-gradient(180deg,#0a1120,#0b1322)!important
}
.page-theme-novatech.studio-page-designed{--studio-a:#168ff0;--studio-b:#436cf2}
.studio-page-designed .main{background:transparent!important}

/* These were demo-only visual chips and were not functional. Hide old saved versions too. */
.demo-aura-studio-nav,.demo-studio-tags,.studio-custom-html:has(.demo-aura-studio-nav),.studio-custom-html:has(.demo-studio-tags){display:none!important}
.studio-custom-html:empty{display:none!important}

/* Theme demo intro */
.studio-designer-intro{
 margin:0 0 13px!important;padding:25px 28px!important;border:1px solid var(--fx30-line)!important;border-radius:18px!important;
 background:radial-gradient(circle at 88% 8%,rgba(22,143,240,.08),transparent 28%),linear-gradient(145deg,#0d1d30,#091522)!important;
 box-shadow:var(--fx30-shadow)!important
}
.page-theme-aurastudio .studio-designer-intro{
 background:radial-gradient(circle at 88% 8%,rgba(129,92,233,.09),transparent 28%),linear-gradient(145deg,#12192a,#0b1423)!important
}
.studio-designer-blocks{display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:12px!important;margin-bottom:16px!important}
.studio-designer-blocks article{min-height:100px!important;padding:17px!important;border:1px solid var(--fx30-line)!important;border-radius:15px!important;background:linear-gradient(180deg,#0d2136,#091827)!important}
.page-theme-aurastudio .studio-designer-blocks article{background:linear-gradient(180deg,#141c2e,#0d1524)!important}

/* Never let old theme .active rules paint full sections. */
.studio-page-designed .view.active,.page-theme-aurastudio.studio-page-designed .view.active,.page-theme-novatech.studio-page-designed .view.active{background:transparent!important;color:inherit!important}

/* Builder */
#builder{max-width:100%!important;overflow:visible!important;background:transparent!important}
#builder .builder-grid{display:grid!important;grid-template-columns:minmax(0,1fr) minmax(280px,320px)!important;gap:16px!important;align-items:start!important;max-width:100%!important}
#builder .controls{min-width:0!important;width:100%!important;padding:22px!important;overflow:hidden!important;border:1px solid var(--fx30-line)!important;border-radius:19px!important;background:linear-gradient(180deg,#0d2944,#0a2037)!important;box-shadow:var(--fx30-shadow)!important}
.page-theme-aurastudio #builder .controls{background:linear-gradient(180deg,#111d30,#0b1728)!important}
#builder .studio-tabs{display:flex!important;max-width:100%!important;overflow-x:auto!important;gap:4px!important;padding:6px!important;border:1px solid var(--fx30-line)!important;border-radius:13px!important;background:#08192b!important}
#builder .studio-tab{flex:0 0 auto!important;min-width:max-content!important;padding:10px 15px!important;border-radius:9px!important}
#builder .studio-tab.active{background:linear-gradient(135deg,var(--studio-a),var(--studio-b))!important;color:#fff!important}
#builder .two,#builder .three,#builder .prime-setting-grid,#builder .feature-grid,#builder .upload-grid{min-width:0!important;gap:10px!important}
#builder .two>*,#builder .three>*,#builder .prime-setting-grid>*,#builder .feature-grid>*,#builder .upload-grid>*{min-width:0!important}
#builder input,#builder select,#builder textarea{width:100%!important;min-width:0!important;background:#f4f8fc!important;color:#142236!important;border:1px solid #dbe6f0!important}
#builder .release-build-card,#builder .prime-studio-card{max-width:100%!important;overflow:hidden!important;border:1px solid rgba(104,149,191,.18)!important;border-radius:15px!important;background:rgba(5,24,41,.28)!important}
#builder .preview-wrap{position:sticky!important;top:82px!important;width:320px!important;max-width:100%!important;min-width:0!important;margin:0!important;overflow:visible!important}
#builder .preview-toolbar{display:flex!important;align-items:center!important;justify-content:space-between!important;gap:8px!important;padding:0 3px 8px!important;color:#91a7bc!important}
#builder .device{width:292px!important;height:610px!important;max-width:100%!important;margin:0 auto!important;border-radius:36px!important;border-width:8px!important}
#builder .device-screen{border-radius:24px!important}

/* Other App Studio views */
#dashboard .stats{display:grid!important;grid-template-columns:repeat(4,minmax(0,1fr))!important;gap:10px!important}
#templates .template-grid{display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:12px!important}
#packages .pricing-grid{display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:12px!important}
#notifications .notification-layout,#payments .payment-layout{display:grid!important;grid-template-columns:minmax(0,1fr) minmax(330px,.85fr)!important;gap:14px!important}
#downloads .build-card,#downloads .build-row{border:1px solid var(--fx30-line)!important;border-radius:15px!important;background:#0a1c30!important}

/* ---------- Mobile ---------- */
@media(max-width:1180px){
 #overview .stats,#dashboard .stats{grid-template-columns:repeat(2,minmax(0,1fr))!important}
 #packages .package-admin-grid,#templates .template-grid,#packages .pricing-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}
 #addons .fx-upgrade-grid,#cms-update .fx-upgrade-grid{grid-template-columns:1fr!important}
 #builder .builder-grid{grid-template-columns:minmax(0,1fr) 290px!important}
 #builder .preview-wrap{width:290px!important}
 #builder .device{width:270px!important;height:575px!important}
}
@media(max-width:980px){
 #settings .admin-grid,#overview .admin-grid,#payments .admin-grid,#notifications .notification-layout{grid-template-columns:1fr!important}
 #page-designer .designer-grid,#page-designer .designer-theme-grid{grid-template-columns:1fr!important}
 .fx-user-auth{grid-template-columns:1fr!important}
 .fx-user-showcase{min-height:auto!important;padding:72px 28px 36px!important;border-right:0!important;border-bottom:1px solid var(--fx30-line)!important}
 .fx-user-panel{width:min(620px,calc(100% - 28px))!important;margin:18px auto 38px!important}
 .studio-designer-blocks{grid-template-columns:1fr!important}
 #builder .builder-grid{grid-template-columns:1fr!important}
 #builder .preview-wrap{position:relative!important;top:auto!important;width:min(350px,100%)!important;margin:18px auto 0!important}
 #builder .device{width:min(310px,100%)!important;height:625px!important}
}
@media(max-width:760px){
 .main{padding:18px 14px 72px!important}
 .topbar{align-items:flex-start!important}.top-actions{width:100%!important;justify-content:flex-start!important}
 #overview .stats,#dashboard .stats,#packages .package-admin-grid,#templates .template-grid,#packages .pricing-grid{grid-template-columns:1fr!important}
 #maintenance .system-info-grid,#settings .two,#settings .three,#builder .two,#builder .three,#builder .prime-setting-grid,#builder .feature-grid,#builder .upload-grid{grid-template-columns:1fr!important}
 .fx-user-showcase{padding:66px 18px 26px!important}
 .fx-user-showcase .portal-auth-copy h1{font-size:38px!important}
 .fx-user-showcase .auth-feature-list{grid-template-columns:1fr!important}
 .fx-user-panel{padding:22px!important;border-radius:18px!important}
 .studio-designer-intro{padding:20px 16px!important}
 #builder .controls{padding:15px!important}
}
