/* =========================================================
   Generate NFC 2.0.0 — Customer Portal UI Refresh
   Layered AFTER portal.css so existing editor behavior and
   user custom CSS remain intact unless intentionally refined.
========================================================= */
:root{
  --gnfc-v2-bg:#f5f7fa;
  --gnfc-v2-surface:#ffffff;
  --gnfc-v2-surface-soft:#f8fafc;
  --gnfc-v2-text:#172033;
  --gnfc-v2-muted:#6f7a8d;
  --gnfc-v2-line:#e7ebf0;
  --gnfc-v2-primary:#ff6b00;
  --gnfc-v2-primary-soft:#fff3ea;
  --gnfc-v2-success:#15935d;
  --gnfc-v2-shadow:0 12px 32px rgba(30,41,59,.06);
  --gnfc-v2-radius:18px;
}

.gnfc-portal-shell,
.gnfc-portal-login-wrap{
  font-family:"Roboto",system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  color:var(--gnfc-v2-text);
}
.gnfc-portal-shell h1,.gnfc-portal-shell h2,.gnfc-portal-shell h3,
.gnfc-portal-login-wrap h1,.gnfc-portal-login-wrap h2,.gnfc-portal-login-wrap h3,
.gnfc-app-brand strong,.gnfc-project-topbar-title{
  font-family:"Montserrat","Roboto",sans-serif;
}

/* Let Elementor/container own the outer width. */
.gnfc-portal-shell{
  width:100%;
  max-width:none;
  margin:0;
  min-height:720px;
  border:1px solid var(--gnfc-v2-line);
  border-radius:22px;
  background:var(--gnfc-v2-bg);
  box-shadow:0 18px 48px rgba(15,23,42,.07);
}

/* ---------- Desktop shell ---------- */
@media (min-width:821px){
  .gnfc-portal-shell:not(.is-editor-mode){grid-template-columns:226px minmax(0,1fr)}
  .gnfc-portal-shell:not(.is-editor-mode) .gnfc-app-sidebar{
    min-height:720px;
    background:#fff;
    color:var(--gnfc-v2-text);
    border-right:1px solid var(--gnfc-v2-line);
    padding:24px 16px 18px;
  }
  .gnfc-portal-shell:not(.is-editor-mode) .gnfc-app-brand{
    padding:0 10px 28px;
    gap:11px;
  }
  .gnfc-portal-shell:not(.is-editor-mode) .gnfc-app-brand-mark{
    width:39px;height:39px;border-radius:12px;
    background:linear-gradient(145deg,#ff7a18,#ff5f00);
    color:#fff;
    box-shadow:0 8px 18px rgba(255,107,0,.2);
  }
  .gnfc-portal-shell:not(.is-editor-mode) .gnfc-app-brand strong{color:#172033;font-size:14px;letter-spacing:-.2px}
  .gnfc-portal-shell:not(.is-editor-mode) .gnfc-app-brand small{color:#8b95a5;font-size:12px}
  .gnfc-portal-shell:not(.is-editor-mode) .gnfc-app-menu-label{
    margin:0 11px 8px;
    color:#a0a7b2;
    font-size:12px;
    font-weight:800;
    text-transform:uppercase;
    letter-spacing:.12em;
  }
  .gnfc-portal-shell:not(.is-editor-mode) .gnfc-app-menu{gap:4px}
  .gnfc-portal-shell:not(.is-editor-mode) .gnfc-app-menu a{
    min-height:44px;
    padding:0 11px;
    border-radius:11px;
    color:#667085;
    font-size:12px;
    font-weight:650;
  }
  .gnfc-portal-shell:not(.is-editor-mode) .gnfc-app-menu a:hover{background:#f7f8fa;color:#273244}
  .gnfc-portal-shell:not(.is-editor-mode) .gnfc-app-menu a.is-active{
    background:var(--gnfc-v2-primary-soft);
    color:#d95600;
    box-shadow:none;
  }
  .gnfc-portal-shell:not(.is-editor-mode) .gnfc-app-menu-icon{
    width:25px;height:25px;border-radius:8px;background:transparent;color:currentColor;
  }
  .gnfc-app-menu-icon svg,.gnfc-mobile-nav-icon svg,.gnfc-project-toolbar svg{
    width:19px;height:19px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;
  }
  .gnfc-portal-shell:not(.is-editor-mode) .gnfc-app-sidebar-bottom{border-top:1px solid #eef1f4;padding-top:14px}
  .gnfc-portal-shell:not(.is-editor-mode) .gnfc-app-profile{color:#273244!important;padding:9px 8px}
  .gnfc-portal-shell:not(.is-editor-mode) .gnfc-app-profile:hover,
  .gnfc-portal-shell:not(.is-editor-mode) .gnfc-app-profile.is-active{background:#f7f8fa}
  .gnfc-portal-shell:not(.is-editor-mode) .gnfc-app-avatar{background:#f0f3f7;color:#4e596b}
  .gnfc-portal-shell:not(.is-editor-mode) .gnfc-app-profile small{color:#939cab}
  .gnfc-portal-shell:not(.is-editor-mode) .gnfc-app-logout{color:#c95050!important}

  .gnfc-portal-shell:not(.is-editor-mode) .gnfc-app-topbar{
    min-height:74px;height:auto;
    padding:13px 26px;
    background:rgba(255,255,255,.96);
    border-bottom:1px solid var(--gnfc-v2-line);
  }
  .gnfc-portal-shell:not(.is-editor-mode) .gnfc-app-topbar-label{font-size:12px;color:#9aa2af}
  .gnfc-portal-shell:not(.is-editor-mode) .gnfc-app-topbar strong{font-size:18px;letter-spacing:-.2px}
  .gnfc-portal-shell:not(.is-editor-mode) .gnfc-app-help-button{
    width:36px;height:36px;border-radius:11px;background:#fff;color:#667085!important;
  }
  .gnfc-portal-shell:not(.is-editor-mode) .gnfc-app-user-name{font-size:12px;color:#667085}
  .gnfc-portal-shell:not(.is-editor-mode) .gnfc-portal-main{padding:24px 26px 30px;background:var(--gnfc-v2-bg)}
}

/* ---------- Project toolbar ---------- */
.gnfc-project-topbar{gap:18px}
.gnfc-project-topbar-title{font-size:20px!important;font-weight:700;letter-spacing:-.35px;white-space:nowrap}
.gnfc-project-toolbar{display:flex;align-items:center;gap:8px;flex:1;justify-content:flex-end;min-width:0}
.gnfc-project-search{
  width:min(520px,100%);
  height:40px;
  padding:0 4px 0 12px;
  display:flex;align-items:center;gap:8px;
  background:#f8fafc;border:1px solid #e4e8ee;border-radius:12px;
  transition:.16s ease;
}
.gnfc-project-search:focus-within{background:#fff;border-color:#ffb37f;box-shadow:0 0 0 3px rgba(255,107,0,.08)}
.gnfc-project-search>svg{width:17px!important;height:17px!important;color:#96a0af;flex:0 0 auto}
.gnfc-project-search input{flex:1;min-width:0;height:36px!important;border:0!important;background:transparent!important;box-shadow:none!important;padding:0!important;font-size:12px!important;color:#273244!important}
.gnfc-project-search-submit{height:31px;padding:0 12px;border:0;border-radius:9px;background:#fff;color:#d85d08;font-size:12px;font-weight:750;cursor:pointer;box-shadow:0 1px 3px rgba(15,23,42,.06)}
.gnfc-project-view-switch{display:flex;align-items:center;padding:3px;border:1px solid var(--gnfc-v2-line);border-radius:11px;background:#fff}
.gnfc-project-view-switch button{width:31px;height:31px;border:0;border-radius:8px;background:transparent;color:#9aa3b0;display:grid;place-items:center;cursor:pointer}
.gnfc-project-view-switch button.is-active{background:var(--gnfc-v2-primary-soft);color:var(--gnfc-v2-primary)}
.gnfc-project-help{width:38px;height:38px;display:grid;place-items:center;border:1px solid var(--gnfc-v2-line);border-radius:11px;background:#fff;color:#667085!important;text-decoration:none!important;font-weight:800}
.gnfc-project-topbar-actions{display:flex;align-items:center;gap:12px}
.gnfc-project-topbar-count{min-width:72px;padding:7px 12px;border:1px solid var(--gnfc-v2-line);border-radius:12px;background:#fff;text-align:center}
.gnfc-project-topbar-count strong{display:block!important;font:700 18px/1 "Montserrat",sans-serif!important}
.gnfc-project-topbar-count small{display:block;margin-top:3px;color:#8993a3;font-size:12px;font-weight:600}

/* ---------- Surfaces ---------- */
.gnfc-portal-section-head{margin-bottom:20px}
.gnfc-portal-section-head h1{font-size:25px;letter-spacing:-.55px}
.gnfc-portal-section-head p{font-size:12px;line-height:1.65;color:#758093}
.gnfc-portal-eyebrow{font-size:12px;letter-spacing:.13em}
.gnfc-assist-banner,.gnfc-portal-alert{box-shadow:none}

/* ---------- Project cards ---------- */
.gnfc-product-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
.gnfc-product-card{
  min-height:286px;
  padding:14px;
  border:1px solid #e5eaf0;
  border-radius:16px;
  background:#fff;
  box-shadow:0 5px 16px rgba(15,23,42,.035);
  transform:none!important;
}
.gnfc-product-card:hover{border-color:#d9dfe7;box-shadow:0 12px 26px rgba(15,23,42,.065)}
.gnfc-product-visual{height:112px;margin-bottom:13px;border:0;border-radius:13px;background:#f7f9fb}
.gnfc-product-visual img{max-height:76px;max-width:76%;filter:none}
.gnfc-product-meta{margin-bottom:8px}
.gnfc-product-meta span{padding:4px 7px;background:#f1f4f7;color:#6d7787;font-size:12px;font-weight:700}
.gnfc-product-meta span.is-customized{background:#edf9f3;color:#188451}
.gnfc-product-body h3{font:650 15px/1.4 "Montserrat",sans-serif;letter-spacing:-.15px;color:#1d2738}
.gnfc-product-body p{font-size:12px;color:#778194}
.gnfc-product-body small{font-size:12px;color:#9aa3af}
.gnfc-product-actions{gap:7px;margin-top:13px}
.gnfc-product-actions .gnfc-btn{flex:1;min-height:37px;border-radius:10px;font-size:12px}
.gnfc-btn.is-primary{background:var(--gnfc-v2-primary);border-color:var(--gnfc-v2-primary);box-shadow:none}
.gnfc-btn.is-primary:hover{background:#ed6200;border-color:#ed6200}
.gnfc-btn.is-secondary{background:#fff;border-color:#dfe4eb;color:#344054!important}
.gnfc-btn.is-secondary:hover{background:#f8fafc}

/* List mode: app-style horizontal rows. */
.gnfc-product-grid.is-list{display:flex;flex-direction:column;gap:10px}
.gnfc-product-grid.is-list .gnfc-product-card{
  min-height:0;
  display:grid;
  grid-template-columns:86px minmax(0,1fr) 170px;
  align-items:center;
  gap:16px;
  padding:12px 14px;
}
.gnfc-product-grid.is-list .gnfc-product-visual{width:86px;height:76px;margin:0}
.gnfc-product-grid.is-list .gnfc-product-visual img{max-height:58px;max-width:72%}
.gnfc-product-grid.is-list .gnfc-product-body h3{margin-bottom:4px}
.gnfc-product-grid.is-list .gnfc-product-actions{margin:0;display:flex;flex-direction:column;gap:6px}
.gnfc-product-grid.is-list .gnfc-product-actions .gnfc-btn{width:100%;min-height:35px}

/* ---------- Templates ---------- */
.gnfc-template-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
.gnfc-template-card{overflow:hidden;border:1px solid #e4e9ef;border-radius:17px;background:#fff;box-shadow:0 5px 16px rgba(15,23,42,.035)}
.gnfc-template-preview{
  min-height:190px;
  padding:17px 17px 10px;
  display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;
  background:#f7f9fc!important;
  border-bottom:1px solid #edf0f4;
}
.gnfc-template-preview>small{font-size:12px;font-weight:750;color:#778194;text-transform:uppercase;letter-spacing:.08em}
.gnfc-template-device{
  width:112px;height:158px;padding:18px 12px 13px;
  border:5px solid #273244;border-radius:20px;
  background:#fff;
  box-shadow:0 12px 24px rgba(15,23,42,.11);
  display:flex;flex-direction:column;align-items:center;gap:8px;
}
.gnfc-template-mini-logo{width:32px;height:13px;border-radius:4px;background:#ffb37f}
.gnfc-template-mini-title{width:72px;height:8px;border-radius:5px;background:#3f4a5d}
.gnfc-template-mini-line{width:58px;height:4px;border-radius:999px;background:#dfe4eb}
.gnfc-template-mini-line.is-long{width:76px}
.gnfc-template-mini-image{width:44px;height:44px;border-radius:50%;background:#eef1f5;border:1px solid #e1e6ec}
.gnfc-template-preview.is-corporate .gnfc-template-mini-logo{background:#5677a6}
.gnfc-template-preview.is-celebration .gnfc-template-mini-logo{background:#d8876a}
.gnfc-template-preview.is-memorial .gnfc-template-mini-logo{background:#8a94a4}
.gnfc-template-preview.is-fun .gnfc-template-mini-logo{background:#67a98e}
.gnfc-template-body{padding:16px}
.gnfc-template-body h3{font:650 15px/1.3 "Montserrat",sans-serif;margin-bottom:6px}
.gnfc-template-body p{min-height:44px;font-size:12px;line-height:1.55;color:#788295}
.gnfc-template-body .gnfc-btn{width:100%;margin-top:10px}

/* ---------- Help / Account ---------- */
.gnfc-help-grid{gap:9px}
.gnfc-help-item{border:1px solid #e4e9ef!important;border-radius:14px!important;background:#fff!important;box-shadow:none!important}
.gnfc-help-item summary{font-family:"Montserrat",sans-serif;font-size:12px!important;font-weight:650!important}
.gnfc-help-callout,.gnfc-support-card,.gnfc-account-card{border:1px solid #e4e9ef!important;border-radius:17px!important;box-shadow:0 5px 16px rgba(15,23,42,.035)!important;background:#fff!important}
.gnfc-help-callout{margin-top:16px!important;padding:18px!important}
.gnfc-help-callout p{margin:8px 0 15px!important}
.gnfc-account-profile strong,.gnfc-support-card h3{font-family:"Montserrat",sans-serif}

/* ---------- Login ---------- */
.gnfc-portal-login-wrap{
  min-height:640px;
  display:grid;
  place-items:center;
  padding:34px 20px;
  background:linear-gradient(150deg,#f7f9fc 0%,#fff 58%,#fff3ea 100%);
  border:1px solid #e8ebf0;
  border-radius:22px;
}
.gnfc-portal-login-brand{margin-bottom:14px}
.gnfc-portal-login-card{width:min(100%,420px);padding:30px;border:1px solid #e3e8ef;border-radius:22px;background:#fff;box-shadow:0 22px 58px rgba(15,23,42,.09)}
.gnfc-portal-login-card h2{font-size:24px;letter-spacing:-.5px}
.gnfc-portal-login-card input[type=text],.gnfc-portal-login-card input[type=password]{border-radius:12px!important;background:#f8fafc!important;border:1px solid #e2e7ed!important;min-height:45px!important}
.gnfc-portal-login-card input[type=submit]{min-height:45px!important;border-radius:12px!important;background:var(--gnfc-v2-primary)!important;border:0!important;box-shadow:none!important}

/* ---------- Mobile app treatment ---------- */
@media (max-width:820px){
  .gnfc-portal-shell:not(.is-editor-mode){
    width:100%;min-height:100dvh;margin:0;border:0;border-radius:0;box-shadow:none;background:#f6f7f9;display:block;
  }
  .gnfc-portal-shell:not(.is-editor-mode) .gnfc-app-sidebar{display:none!important}
  .gnfc-portal-shell:not(.is-editor-mode) .gnfc-portal-workspace{min-height:100dvh;background:#f6f7f9}
  .gnfc-portal-shell:not(.is-editor-mode) .gnfc-app-topbar{
    position:sticky;top:0;z-index:800;
    min-height:62px;height:auto;padding:10px 14px;
    background:rgba(255,255,255,.95);backdrop-filter:blur(12px);
    border-bottom:1px solid #e8ebef;
  }
  .gnfc-portal-shell:not(.is-editor-mode) .gnfc-app-topbar-label{display:none}
  .gnfc-portal-shell:not(.is-editor-mode) .gnfc-app-topbar strong{font-size:17px;margin:0}
  .gnfc-portal-shell:not(.is-editor-mode) .gnfc-app-user-name{display:none}
  .gnfc-portal-shell:not(.is-editor-mode) .gnfc-app-help-button{width:35px;height:35px;border-radius:50%;font-size:12px}
  .gnfc-portal-shell:not(.is-editor-mode) .gnfc-portal-main{padding:16px 14px 92px;background:#f6f7f9}

  .gnfc-project-topbar{display:grid!important;grid-template-columns:auto 1fr;align-items:center;gap:8px;padding:10px 12px!important}
  .gnfc-project-topbar-title{font-size:16px!important}
  .gnfc-project-toolbar{min-width:0;gap:5px;justify-content:flex-end}
  .gnfc-project-search{height:36px;padding-left:9px;border-radius:10px;background:#f5f7fa;min-width:0;width:100%}
  .gnfc-project-search>svg{width:15px!important;height:15px!important}
  .gnfc-project-search input{height:32px!important;font-size:12px!important}
  .gnfc-project-search-submit{display:none}
  .gnfc-project-view-switch{padding:2px;border-radius:9px;flex:0 0 auto}
  .gnfc-project-view-switch button{width:29px;height:29px;border-radius:7px}
  .gnfc-project-view-switch button svg{width:16px;height:16px}
  .gnfc-project-help{width:33px;height:33px;border-radius:50%;flex:0 0 auto}
  .gnfc-project-topbar-actions{display:none}

  .gnfc-mobile-nav{
    left:10px;right:10px;bottom:10px;height:64px;
    grid-template-columns:repeat(3,1fr);
    padding:7px 8px calc(7px + env(safe-area-inset-bottom));
    border:1px solid #e4e8ee;border-radius:18px;
    background:rgba(255,255,255,.97);
    box-shadow:0 12px 34px rgba(15,23,42,.14);
  }
  .gnfc-mobile-nav a{gap:3px;border-radius:12px;color:#96a0ae!important;background:transparent!important}
  .gnfc-mobile-nav a.is-active{color:var(--gnfc-v2-primary)!important;background:#fff5ee!important}
  .gnfc-mobile-nav-icon{height:22px;display:grid;place-items:center}
  .gnfc-mobile-nav-icon svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
  .gnfc-mobile-nav a small{font-size:12px;font-weight:650}

  .gnfc-portal-section-head{margin-bottom:15px}
  .gnfc-portal-section-head h1{font-size:22px}
  .gnfc-portal-section-head p{font-size:12px;line-height:1.55}
  .gnfc-portal-eyebrow{font-size:12px}

  .gnfc-product-grid{grid-template-columns:1fr;gap:10px}
  .gnfc-product-card{min-height:0;padding:12px;border-radius:15px;box-shadow:none}
  .gnfc-product-visual{height:100px;margin-bottom:11px}
  .gnfc-product-body h3{font-size:14px}
  .gnfc-product-actions{display:grid;grid-template-columns:1fr 1fr}
  .gnfc-product-actions .gnfc-btn{min-height:38px}

  .gnfc-product-grid.is-list .gnfc-product-card{
    grid-template-columns:74px minmax(0,1fr) 92px;
    gap:10px;padding:10px;
  }
  .gnfc-product-grid.is-list .gnfc-product-visual{width:74px;height:74px;border-radius:12px}
  .gnfc-product-grid.is-list .gnfc-product-visual img{max-height:54px}
  .gnfc-product-grid.is-list .gnfc-product-body{min-width:0}
  .gnfc-product-grid.is-list .gnfc-product-meta{gap:3px;margin-bottom:5px}
  .gnfc-product-grid.is-list .gnfc-product-meta span{font-size:12px;padding:3px 5px}
  .gnfc-product-grid.is-list .gnfc-product-body h3{font-size:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .gnfc-product-grid.is-list .gnfc-product-body p{font-size:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-bottom:3px}
  .gnfc-product-grid.is-list .gnfc-product-body small{font-size:12px}
  .gnfc-product-grid.is-list .gnfc-product-actions{display:flex;flex-direction:column;gap:5px}
  .gnfc-product-grid.is-list .gnfc-product-actions .gnfc-btn{min-height:32px;padding:0 6px;font-size:12px;border-radius:8px}

  .gnfc-template-grid{grid-template-columns:1fr 1fr;gap:10px}
  .gnfc-template-card{border-radius:15px;box-shadow:none}
  .gnfc-template-preview{min-height:155px;padding:13px 10px 8px}
  .gnfc-template-device{width:86px;height:122px;border-width:4px;border-radius:16px;padding:14px 9px 9px;gap:6px}
  .gnfc-template-mini-logo{width:25px;height:10px}
  .gnfc-template-mini-title{width:55px;height:6px}
  .gnfc-template-mini-line{width:44px;height:3px}.gnfc-template-mini-line.is-long{width:58px}
  .gnfc-template-mini-image{width:34px;height:34px}
  .gnfc-template-body{padding:12px}
  .gnfc-template-body h3{font-size:12px}
  .gnfc-template-body p{min-height:0;font-size:12px;line-height:1.45}
  .gnfc-template-body .gnfc-btn{min-height:34px;font-size:12px;padding:0 8px}

  .gnfc-account-layout{grid-template-columns:1fr!important;gap:10px!important}
  .gnfc-account-card,.gnfc-support-card,.gnfc-help-callout{border-radius:15px!important;box-shadow:none!important}
  .gnfc-help-grid{grid-template-columns:1fr!important}
  .gnfc-help-item summary{font-size:12px!important}
  .gnfc-help-callout{padding:15px!important}
}

/* Keep editor mechanics from the existing, tested mobile/desktop editor. */
.gnfc-portal-shell.is-editor-mode .gnfc-app-menu-icon svg,
.gnfc-portal-shell.is-editor-mode .gnfc-mobile-nav-icon svg{
  width:19px;height:19px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;
}