/*
 * GPC Buy Sale — shared account pages
 * Keeps profile, security, finance, notifications and destructive actions
 * visually consistent without changing any backend behaviour.
 */
:root{
  --account-ink:#172238;
  --account-muted:#7c8899;
  --account-line:#e1e6ed;
  --account-soft:#f7f9fc;
  --account-blue:#2563eb;
  --account-navy:#111b2c;
}
.fv-site-main{
  min-width:0;
  overflow-x:hidden;
}
.site-flash{
  position:relative;
  z-index:20;
  width:calc(100% - 48px);
  max-width:1240px;
  min-height:48px;
  margin:16px auto 0;
  padding:11px 46px 11px 13px;
  border:1px solid #a8e0bf;
  border-radius:10px;
  display:flex;
  align-items:center;
  gap:10px;
  background:#ecfbf2;
  color:#17643d;
  box-shadow:0 7px 20px rgba(26,105,64,.08);
  font-size:11px;
  font-weight:800;
}
.site-flash.error{border-color:#f0bcbc;background:#fff0f0;color:#a83232}
.site-flash-icon{
  flex:0 0 27px;
  width:27px;
  height:27px;
  border-radius:50%;
  display:grid;
  place-items:center;
  background:#2aa568;
  color:#fff;
  font-size:11px;
  font-weight:900;
}
.site-flash.error .site-flash-icon{background:#d54848}
.site-flash button{
  position:absolute;
  top:50%;
  right:13px;
  width:27px;
  height:27px;
  padding:0;
  border:0;
  border-radius:7px;
  transform:translateY(-50%);
  background:transparent;
  color:currentColor;
  cursor:pointer;
  font-size:18px;
}
.settings-heading,
.settings-page-head,
.plans-heading,
.subscriptions-heading,
.delete-heading{
  width:calc(100% - 48px)!important;
  max-width:1240px!important;
  min-height:132px!important;
  margin:32px auto 16px!important;
  padding:27px 31px!important;
  border-radius:14px!important;
  display:flex!important;
  flex-direction:column!important;
  justify-content:center!important;
  background:linear-gradient(120deg,#111b2c 0%,#172a49 58%,#2459b4 100%)!important;
  color:#fff!important;
  box-shadow:0 13px 32px rgba(20,41,78,.12)!important;
}
.settings-heading h1,
.settings-page-head h1,
.plans-heading h1,
.subscriptions-heading h1,
.delete-heading h1{
  margin:0 0 7px!important;
  color:#fff!important;
  font-size:27px!important;
  letter-spacing:-.5px!important;
}
.settings-heading p,
.settings-page-head p,
.plans-heading p,
.subscriptions-heading p,
.delete-heading p{
  margin:0!important;
  color:#c7d0de!important;
  font-size:11px!important;
}
.account-page-grid,
.account-profile-shell,
.notifications-account-grid{
  width:calc(100% - 48px)!important;
  max-width:1240px!important;
  min-width:0!important;
  min-height:0!important;
  margin:0 auto 70px!important;
  display:grid!important;
  grid-template-columns:215px minmax(0,1fr)!important;
  border:1px solid var(--account-line)!important;
  border-radius:13px!important;
  background:#fff!important;
  box-shadow:0 8px 26px rgba(28,45,74,.045)!important;
  overflow:hidden!important;
}
.account-page-content,
.account-profile-main,
.notifications-account-content{
  width:100%!important;
  min-width:0!important;
  padding:22px!important;
  background:var(--account-soft)!important;
  overflow:hidden!important;
}
.account-settings-nav{
  width:215px!important;
  min-width:0!important;
  padding:18px 11px!important;
  border-right:1px solid var(--account-line)!important;
  background:#fff!important;
}
.account-settings-title{
  margin:6px 0 7px!important;
  padding:0 9px!important;
  color:#929dad!important;
  font-size:8px!important;
  font-weight:900!important;
  letter-spacing:.8px!important;
}
.account-settings-links{
  gap:2px!important;
  margin-bottom:14px!important;
}
.account-settings-links a{
  min-height:40px!important;
  gap:9px!important;
  padding:0 10px!important;
  border-radius:7px!important;
  color:#445268!important;
  font-size:10px!important;
  font-weight:800!important;
}
.account-settings-links a:hover{
  transform:none!important;
  background:#f2f6fc!important;
  color:var(--account-blue)!important;
}
.account-settings-links a.active{
  background:#eaf2ff!important;
  color:var(--account-blue)!important;
  box-shadow:inset 3px 0 var(--account-blue)!important;
}
.account-settings-icon{
  width:17px!important;
  font-size:12px!important;
}
.settings-card,
.plans-empty,
.contact-strip,
.clean-table,
.danger-box,
.table-wrap,
.notification-list{
  border-color:var(--account-line)!important;
  border-radius:11px!important;
  box-shadow:none!important;
}
.settings-card{max-width:720px!important}
.settings-card-head,
.panel-header{padding:16px 18px!important}
.settings-card-head h2{font-size:16px!important}
.settings-form{padding:18px!important;gap:14px!important}
.settings-form label,
.settings-field label{
  margin-bottom:6px!important;
  color:#506078!important;
  font-size:10px!important;
}
.settings-form input,
.settings-field input,
.settings-field select{
  height:43px!important;
  padding:0 12px!important;
  border-color:#d8e0ea!important;
  border-radius:7px!important;
  font-size:11px!important;
  box-shadow:none!important;
}
.settings-save,
.settings-cancel{
  min-height:41px!important;
  padding:0 18px!important;
  border-radius:7px!important;
  font-size:10px!important;
}
.settings-save{
  min-width:150px!important;
  background:var(--account-blue)!important;
  box-shadow:none!important;
}
.account-profile-main h2{
  margin:0 0 17px!important;
  font-size:19px!important;
}
.photo-row{
  gap:15px!important;
  padding-bottom:20px!important;
}
.photo-avatar{
  width:64px!important;
  height:64px!important;
  flex-basis:64px!important;
  font-size:22px!important;
}
.photo-details strong{font-size:13px!important}
.photo-details small{font-size:9px!important}
.photo-button{min-height:33px!important;font-size:9px!important}
.settings-section{padding:21px 0!important}
.settings-section h3{margin:0 0 18px!important;font-size:14px!important}
.settings-note{margin:-12px 0 18px!important;font-size:9px!important}
.settings-form-grid{gap:16px 18px!important}
.network-grid{gap:9px!important}
.network-option{
  min-height:48px!important;
  padding:0 12px!important;
  border-radius:9px!important;
  font-size:10px!important;
}
.network-option input{width:16px!important;height:16px!important}
.network-option strong{font-size:10px!important}
.network-badge{font-size:7px!important}
.settings-actions{padding-top:18px!important}
.plans-empty{
  min-height:330px!important;
  background:#fff!important;
}
.plans-empty-icon{
  width:58px!important;
  height:58px!important;
  font-size:22px!important;
}
.plans-empty h2{margin:15px 0 6px!important;font-size:17px!important}
.plans-empty p{font-size:10px!important}
.contact-strip{
  margin-top:14px!important;
  padding:15px 18px!important;
  background:#eef4ff!important;
  font-size:10px!important;
}
.contact-strip a{
  padding:10px 16px!important;
  border-radius:7px!important;
  background:var(--account-blue)!important;
  font-size:9px!important;
}
.account-page-content>h2{
  margin:0 0 15px!important;
  color:#7e8999!important;
  font-size:9px!important;
  letter-spacing:1px!important;
}
.data-toolbar{margin-bottom:12px!important}
.data-toolbar select,.data-toolbar input{
  height:37px!important;
  border-radius:7px!important;
  font-size:9px!important;
}
.clean-table{
  width:100%!important;
  max-width:100%!important;
  overflow-x:auto!important;
  background:#fff!important;
}
.clean-row{
  min-width:720px!important;
  padding:12px 14px!important;
  font-size:9px!important;
}
.clean-row.head{font-size:8px!important}
.clean-empty{min-height:280px!important;font-size:10px!important}
.clean-empty span{font-size:35px!important}
.danger-box{
  max-width:760px!important;
  padding:22px!important;
  background:#fff!important;
}
.danger-box h2{font-size:17px!important}
.danger-box h3{font-size:13px!important}
.danger-box p{color:#657286!important;font-size:10px!important;line-height:1.7!important}
.danger-check{font-size:10px!important;line-height:1.55!important}
.danger-button{
  min-height:41px!important;
  margin:28px 0 0!important;
  padding:0 18px!important;
  border-radius:7px!important;
  font-size:9px!important;
}
.history-page,
.notifications-page{
  width:100%!important;
  max-width:1240px!important;
  margin:0 auto!important;
  padding:32px 24px 70px!important;
  overflow:hidden!important;
}
.history-hero,
.notifications-hero{
  min-height:148px!important;
  margin:0 0 16px!important;
  padding:28px 32px!important;
  border-radius:14px!important;
  background:linear-gradient(120deg,#111b2c 0%,#172a49 58%,#2459b4 100%)!important;
  box-shadow:0 13px 32px rgba(20,41,78,.12)!important;
}
.history-hero h1,
.notifications-hero h1{
  margin:0 0 7px!important;
  color:#fff!important;
  font-size:27px!important;
}
.history-hero p,
.notifications-hero p{
  color:#c7d0de!important;
  font-size:11px!important;
}
.notifications-account-grid{
  width:100%!important;
  margin-bottom:0!important;
}
.notifications-back-button{
  min-height:38px!important;
  padding:0 13px!important;
  border-radius:7px!important;
  font-size:9px!important;
}
.hero-count{
  min-width:52px!important;
  min-height:38px!important;
  border-radius:7px!important;
  font-size:13px!important;
}
.notification-summary{gap:9px!important;margin-bottom:13px!important}
.summary-card{padding:14px!important;border-radius:9px!important;box-shadow:none!important}
.summary-card span{font-size:8px!important}
.summary-card strong{margin-top:5px!important;font-size:19px!important}
.notification-toolbar{margin-bottom:12px!important}
.filter-tabs a{padding:8px 12px!important;border-radius:7px!important;font-size:9px!important}
.filter-tabs a.active{background:var(--account-blue)!important}
.mark-all{font-size:9px!important}
.notification-item{
  grid-template-columns:38px minmax(0,1fr) auto!important;
  gap:11px!important;
  padding:14px 16px!important;
}
.notification-icon{width:36px!important;height:36px!important;border-radius:9px!important;font-size:10px!important}
.notification-content strong{font-size:11px!important}
.notification-content p{margin:5px 0 7px!important;font-size:9px!important}
.notification-meta{font-size:8px!important}
.notification-actions a,.notification-actions button,.read-label{
  min-height:30px!important;
  padding:0 9px!important;
  border-radius:6px!important;
  font-size:8px!important;
}
.table-wrap{
  width:100%!important;
  max-width:100%!important;
  overflow-x:auto!important;
}
.history-page .row{
  grid-template-columns:55px 115px 95px 105px minmax(180px,1fr) 125px!important;
  min-width:720px!important;
  padding:12px 14px!important;
  font-size:9px!important;
}
.history-page .row.head{font-size:8px!important}
.history-page .account-page-grid{
  width:100%!important;
  margin-bottom:0!important;
}
@media(max-width:900px){
  .account-page-grid,
  .account-profile-shell,
  .notifications-account-grid{
    grid-template-columns:1fr!important;
  }
  .account-settings-nav{
    width:100%!important;
    border-right:0!important;
    border-bottom:1px solid var(--account-line)!important;
  }
  .account-settings-links{grid-template-columns:repeat(3,minmax(0,1fr))!important}
  .settings-form-grid{grid-template-columns:1fr!important}
  .settings-field.full{grid-column:auto!important}
}
@media(max-width:680px){
  .site-flash{width:calc(100% - 26px);margin-top:12px}
  .settings-heading,
  .settings-page-head,
  .plans-heading,
  .subscriptions-heading,
  .delete-heading{
    width:calc(100% - 26px)!important;
    min-height:110px!important;
    margin:18px auto 12px!important;
    padding:22px 19px!important;
  }
  .account-page-grid,
  .account-profile-shell,
  .notifications-account-grid{
    width:calc(100% - 26px)!important;
    margin-bottom:50px!important;
  }
  .account-page-content,
  .account-profile-main,
  .notifications-account-content{padding:13px!important}
  .account-settings-links{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .history-page,.notifications-page{padding:18px 13px 50px!important}
  .history-hero,.notifications-hero{
    min-height:0!important;
    align-items:flex-start!important;
    flex-direction:column!important;
    padding:23px 19px!important;
  }
  .notifications-hero-actions{width:100%!important;display:grid!important;grid-template-columns:1fr 1fr!important}
  .hero-count{grid-column:1/-1!important}
  .notification-summary{grid-template-columns:1fr!important}
  .notification-toolbar{align-items:flex-start!important;flex-direction:column!important}
  .notification-item{grid-template-columns:36px 1fr!important}
  .notification-actions{grid-column:1/-1!important;justify-content:flex-start!important}
  .network-grid{grid-template-columns:1fr!important}
}