/* =========================================================
   WHRO SIGN RC5
   Production-safe visual polish only
   ========================================================= */

:root{
  --rc5-navy:#063b56;
  --rc5-navy-deep:#022f45;
  --rc5-blue:#006f96;
  --rc5-blue-hover:#005c7d;
  --rc5-gold:#f2cd00;

  --rc5-bg:#e7eef2;
  --rc5-surface:#ffffff;
  --rc5-surface-soft:#f5f8f9;

  --rc5-text:#172f3b;
  --rc5-text-strong:#102933;
  --rc5-muted:#5d717b;
  --rc5-muted-2:#73858d;

  --rc5-border:#b9c9d0;
  --rc5-border-soft:#d2dde1;

  --rc5-green:#187657;
  --rc5-green-soft:#e8f5ef;
  --rc5-yellow-soft:#fff5c9;
  --rc5-red:#ad3028;

  --rc5-radius-button:10px;
  --rc5-radius-card:16px;
  --rc5-radius-dialog:18px;

  --rc5-shadow-sm:0 4px 14px rgba(13,42,55,.08);
  --rc5-shadow:0 12px 34px rgba(10,39,52,.12);
  --rc5-shadow-lg:0 24px 64px rgba(7,32,43,.17);
}

/* APP BACKGROUND */

body,
.whro-studio-page,
.whro-signing-page,
.portal7{
  background:
    radial-gradient(circle at 92% 4%,rgba(0,111,150,.07),transparent 28%),
    linear-gradient(180deg,#edf3f5 0,#e3ebef 100%) !important;
  color:var(--rc5-text) !important;
}


/* =========================================================
   HEADER
   ========================================================= */

.whro-shell-header{
  background:
    linear-gradient(
      135deg,
      var(--rc5-navy-deep),
      var(--rc5-navy) 55%,
      #005675
    ) !important;

  color:#fff !important;
  border:0 !important;
  box-shadow:0 8px 28px rgba(0,31,46,.22) !important;
}

.whro-shell-header-inner{
  min-height:82px !important;
}

.whro-shell-product strong,
.whro-shell-usercopy strong{
  color:#fff !important;
}

.whro-shell-product small,
.whro-shell-usercopy small{
  color:#bfd4dd !important;
}


/* =========================================================
   TOP NAV — RC5 PRIORITY FIX
   ========================================================= */

.whro-shell-nav{
  gap:4px !important;

  padding:5px !important;

  background:#f7fafb !important;
  border:1px solid #9eb4be !important;
  border-radius:13px !important;

  box-shadow:
    0 4px 13px rgba(0,28,42,.14),
    inset 0 1px 0 rgba(255,255,255,.9) !important;
}

.whro-shell-nav a{
  min-height:42px !important;

  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  gap:7px !important;

  padding:0 16px !important;

  border-radius:9px !important;

  color:#234957 !important;
  background:transparent !important;

  font-weight:800 !important;
  opacity:1 !important;

  text-shadow:none !important;

  transition:
    background .14s ease,
    color .14s ease,
    box-shadow .14s ease !important;
}

.whro-shell-nav a:hover{
  background:#e7f0f4 !important;
  color:#083d55 !important;
}

.whro-shell-nav a.active{
  background:linear-gradient(180deg,#087ca6,#005f83) !important;

  color:#fff !important;

  box-shadow:
    0 4px 10px rgba(0,77,108,.22),
    inset 0 -3px 0 var(--rc5-gold) !important;
}

.whro-shell-nav a.active *,
.whro-shell-nav a.active .whro-shell-nav-icon{
  color:#fff !important;
}

.whro-shell-nav-icon{
  color:#00698e !important;
  opacity:1 !important;
}


/* HEADER RIGHT SIDE */

.whro-shell-trust{
  background:rgba(26,121,88,.25) !important;
  color:#e4f6ef !important;
  border-color:rgba(157,219,196,.26) !important;
}

.whro-shell-theme,
.whro-shell-logout{
  color:#fff !important;
  background:rgba(255,255,255,.08) !important;
  border-color:rgba(255,255,255,.26) !important;
}

.whro-shell-theme:hover,
.whro-shell-logout:hover{
  background:rgba(255,255,255,.16) !important;
}

.whro-shell-avatar{
  background:#fff !important;
  color:#064768 !important;
  box-shadow:0 4px 11px rgba(0,0,0,.17) !important;
}

.whro-shell-accent{
  height:5px !important;
  background:var(--rc5-gold) !important;
}


/* =========================================================
   TYPOGRAPHY
   ========================================================= */

h1,h2,h3,
.studio-page-head h1,
.p8-document-titleblock h1,
.upload8-hero h1{
  color:var(--rc5-text-strong) !important;
}

.studio-page-head h1,
.p8-document-titleblock h1,
.upload8-hero h1{
  letter-spacing:-.035em !important;
  font-weight:850 !important;
}

.studio-page-head p,
.p8-document-subtitle,
.upload8-hero p{
  color:var(--rc5-muted) !important;
}

.eyebrow,
.portal7-kicker,
.p8-card-kicker,
.editor18-group-label{
  color:#00678c !important;
  font-weight:900 !important;
  letter-spacing:.12em !important;
}


/* =========================================================
   CARDS
   ========================================================= */

.surface,
.p8-card,
.studio-library,
.metric-strip article,
.admin-panel,
.admin-health-card,
.admin-form-card,
.portal7-auth-card{
  background:var(--rc5-surface) !important;
  border:1px solid var(--rc5-border) !important;
  border-radius:var(--rc5-radius-card) !important;
  box-shadow:var(--rc5-shadow-sm) !important;
}

.metric-strip article{
  border-top:4px solid var(--rc5-blue) !important;
}

.metric-strip article:nth-child(3){
  border-top-color:var(--rc5-gold) !important;
}

.metric-strip article strong{
  color:#163945 !important;
}

.metric-strip article span{
  color:#536a75 !important;
  font-weight:800 !important;
}


/* =========================================================
   BUTTONS
   ========================================================= */

button,
.cta,
.secondary,
.portal7-btn-primary,
.portal7-btn-secondary,
.studio-send-primary,
.editor18-action-btn,
.editor18-send{
  border-radius:var(--rc5-radius-button) !important;
}

.cta,
.portal7-btn-primary,
.studio-send-primary,
.editor18-send,
.s2-finish{
  background:linear-gradient(180deg,#087ca6,#005c7c) !important;
  border-color:#005372 !important;
  color:#fff !important;

  box-shadow:0 7px 17px rgba(0,75,106,.20) !important;
}

.cta:hover,
.portal7-btn-primary:hover,
.studio-send-primary:hover,
.editor18-send:hover{
  background:linear-gradient(180deg,#006e95,#004c69) !important;
  transform:translateY(-1px);
}

.secondary,
.secondary-button,
.portal7-btn-secondary,
.editor18-action-btn{
  background:#fff !important;
  color:#294d5b !important;
  border-color:#aebfc7 !important;
}

.secondary:hover,
.secondary-button:hover,
.portal7-btn-secondary:hover,
.editor18-action-btn:hover{
  background:#edf4f6 !important;
  border-color:#819ba6 !important;
}

.editor18-danger-action{
  background:#b72e26 !important;
  border-color:#9f251f !important;
  color:#fff !important;
}


/* =========================================================
   STATUS / ALERTS
   ========================================================= */

.p8-status-strip{
  background:#e8f5ef !important;
  border:1px solid #a9d2c1 !important;
  color:#265e4e !important;

  box-shadow:0 4px 12px rgba(21,94,70,.06) !important;
}

.studio-status.completed,
.portal7-status-completed{
  background:#e3f3eb !important;
  color:#166a4e !important;
  border-color:#abd4c2 !important;
}

.studio-status.sent,
.portal7-status-sent{
  background:#fff4c8 !important;
  color:#785b0b !important;
  border-color:#e4cc67 !important;
}

.studio-status.draft,
.portal7-status-draft{
  background:#fff7d8 !important;
  color:#6f5710 !important;
  border-color:#e3cc6f !important;
}

.studio-status.viewed,
.portal7-status-viewed{
  background:#e3f0f5 !important;
  color:#005f83 !important;
  border-color:#b1d1df !important;
}


/* =========================================================
   DOCUMENT LIBRARY
   ========================================================= */

.studio-library{
  overflow:hidden !important;
}

.studio-filterbar{
  background:#f3f6f7 !important;
  border-bottom:1px solid var(--rc5-border) !important;
}

.studio-table-head{
  background:#dfe8ec !important;
  color:#405c68 !important;

  border-color:#c2d0d6 !important;

  font-weight:850 !important;
}

.studio-table-row{
  background:#fff !important;
  border-color:#d5e0e4 !important;
}

.studio-table-row:hover{
  background:#eef5f7 !important;
}

.studio-doc-cell strong,
.studio-table-row strong{
  color:#183c49 !important;
}

.studio-table-row small{
  color:#647983 !important;
}

.studio-file-icon{
  background:#e4eff3 !important;
  border:1px solid #bdd5df !important;
  color:#00658a !important;
}


/* =========================================================
   INPUTS
   ========================================================= */

input,
select,
textarea{
  border-color:#aebfc6 !important;
  color:#203b46 !important;
  background:#fff !important;
}

input:focus,
select:focus,
textarea:focus{
  border-color:#00759e !important;
  box-shadow:0 0 0 3px rgba(0,117,158,.13) !important;
}


/* =========================================================
   DOCUMENT DETAIL
   ========================================================= */

.p8-detail-grid .p8-card{
  border-radius:var(--rc5-radius-card) !important;
}

.p8-meta-list > div,
.p8-recipient-row{
  border-color:#d5e0e4 !important;
}

.p8-meta-list dt,
.p8-recipient-row small{
  color:#657a84 !important;
}

.p8-meta-list dd,
.p8-recipient-row strong{
  color:#233f4a !important;
}


/* =========================================================
   TIMELINE
   ========================================================= */

.p8-timeline{
  border-left:2px solid #b5c8d0 !important;
}

.p8-event{
  padding-bottom:17px !important;
}

.p8-event-dot{
  width:12px !important;
  height:12px !important;

  background:#007397 !important;
  border:2px solid #fff !important;

  box-shadow:0 0 0 4px #dbe9ee !important;
}

.p8-event strong{
  color:#233e49 !important;
}


/* =========================================================
   ADMIN
   ========================================================= */

.admin-subnav{
  background:#dce6ea !important;
  border:1px solid #b7c7ce !important;
  border-radius:12px !important;
}

.admin-subnav a{
  color:#345462 !important;
  font-weight:750 !important;
}

.admin-subnav a.active{
  background:var(--rc5-navy) !important;
  color:#fff !important;
}

.admin-table-head{
  background:#dfe7eb !important;
  color:#47616c !important;
}

.admin-table-row{
  border-color:#d5e0e4 !important;
}


/* =========================================================
   LOGIN / AUTH
   ========================================================= */

.portal7-auth-brand{
  background:
    radial-gradient(circle at 82% 14%,rgba(242,205,0,.18),transparent 26%),
    linear-gradient(145deg,#043b56,#006183) !important;

  border-radius:22px !important;
  color:#fff !important;

  box-shadow:var(--rc5-shadow-lg) !important;
}

.portal7-auth-brand h1{
  color:#fff !important;
}

.portal7-auth-brand p{
  color:#d4e4ea !important;
}

.portal7-auth-brand .portal7-kicker{
  color:#f6db45 !important;
}


/* =========================================================
   SIGNER
   ========================================================= */

.s2-body{
  background:
    linear-gradient(180deg,#e9eff2,#dbe4e8) !important;
}

.s2-viewer-card,
.s2-assistant{
  border-color:#acbec6 !important;
  box-shadow:var(--rc5-shadow) !important;
}

.s2-viewer{
  background:linear-gradient(180deg,#aab8bf,#99a8af) !important;
}

.s2-viewer-toolbar{
  background:linear-gradient(180deg,#263d47,#192e36) !important;
}


/* =========================================================
   PDF PREVIEW
   ========================================================= */

.sender-preview{
  background:linear-gradient(180deg,#e7eef1,#d9e3e7) !important;
}

.sender-pdf-stage{
  background:linear-gradient(180deg,#a9b6bc,#96a6ad) !important;
}

.sender-pdf-shell{
  border-color:#9bafb8 !important;
  box-shadow:var(--rc5-shadow-lg) !important;
}


/* =========================================================
   FOOTER
   ========================================================= */

.whro-shell-footer{
  background:#d4dfe4 !important;
  border-top:1px solid #b6c7ce !important;
  color:#4b6570 !important;
}


/* =========================================================
   MOBILE
   ========================================================= */

@media(max-width:720px){

  .whro-shell-header-inner{
    min-height:70px !important;
  }

  .whro-shell-nav{
    border-color:#849faa !important;
    box-shadow:0 4px 10px rgba(0,34,49,.13) !important;
  }

  .whro-shell-nav a{
    min-height:42px !important;
    padding:0 11px !important;

    color:#183f50 !important;
    font-size:.76rem !important;
  }

  .whro-shell-nav a.active{
    color:#fff !important;
  }

  .studio-page-head h1{
    font-size:2rem !important;
  }

  .surface,
  .p8-card,
  .studio-library,
  .metric-strip article{
    border-radius:12px !important;
  }
}


/* =========================================================
   DARK MODE
   ========================================================= */

html[data-theme="dark"] body{
  background:#0c151a !important;
}

html[data-theme="dark"] .whro-shell-nav{
  background:#13232a !important;
  border-color:#40545d !important;
}

html[data-theme="dark"] .whro-shell-nav a{
  color:#d4e2e7 !important;
}

html[data-theme="dark"] .whro-shell-nav a.active{
  background:#08749a !important;
  color:#fff !important;
}



/* =========================================================
   RC6 ENTERPRISE ADMINISTRATION
   ========================================================= */

.rc6-user-stats{
  grid-template-columns:repeat(2,minmax(0,1fr)) !important;
  max-width:640px;
}

.rc6-users-table .admin-table-head,
.rc6-users-table .admin-table-row{
  grid-template-columns:
    minmax(240px,2fr)
    minmax(130px,1fr)
    90px
    90px
    90px
    110px !important;
}

.rc6-users-table .admin-table-row{
  min-height:72px;
}

.rc6-users-table small{
  display:block;
  margin-top:3px;
  color:#6b7e87;
}

.rc6-account-summary{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:12px;
  margin:18px 0;
}

.rc6-account-summary article{
  padding:17px 18px;
}

.rc6-account-summary span{
  display:block;
  color:#657984;
  font-size:.68rem;
  font-weight:850;
  letter-spacing:.08em;
  text-transform:uppercase;
}

.rc6-account-summary strong{
  display:block;
  margin-top:7px;
  color:#123b4a;
  font-size:1.55rem;
}

.rc6-account-summary small{
  display:block;
  margin-top:4px;
  color:#71848d;
}

.rc6-lower-grid{
  margin-top:18px;
}

.rc6-danger-zone{
  border-color:#ddb9b5 !important;
}

.rc6-danger-zone h4{
  margin:18px 0 6px;
  color:#8e2d28;
}

.rc6-danger-zone hr{
  margin:20px 0;
  border:0;
  border-top:1px solid #e5ccca;
}

.rc6-warning{
  margin:12px 0 18px;
  padding:11px 13px;
  border:1px solid #e4c45b;
  border-radius:10px;
  background:#fff7d7;
  color:#73590c;
  font-size:.76rem;
  line-height:1.45;
}

.rc6-delete-button{
  width:100%;
  min-height:44px;
  margin-top:7px;
  border:1px solid #a72520;
  border-radius:10px;
  background:#b6322b;
  color:#fff;
  font-weight:850;
  cursor:pointer;
}

.rc6-delete-button:hover{
  background:#94261f;
}

.rc6-permission-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:9px;
  margin:17px 0 24px;
}

.rc6-permission-grid label{
  display:flex;
  align-items:flex-start;
  gap:10px;
  min-height:64px;
  padding:11px 12px;
  border:1px solid #c6d3d8;
  border-radius:11px;
  background:#f9fbfb;
  cursor:pointer;
}

.rc6-permission-grid input{
  margin-top:4px;
}

.rc6-permission-grid span{
  display:grid;
  gap:3px;
}

.rc6-permission-grid strong{
  color:#254754;
  font-size:.79rem;
}

.rc6-permission-grid small{
  color:#73858d;
  font-family:monospace;
  font-size:.67rem;
}

.rc6-report-table .admin-table-head,
.rc6-report-table .admin-table-row{
  grid-template-columns:minmax(250px,2fr) repeat(3,1fr) !important;
}

@media(max-width:900px){

  .rc6-account-summary{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }

  .rc6-users-table{
    overflow-x:auto;
  }

  .rc6-users-table .admin-table-head,
  .rc6-users-table .admin-table-row{
    min-width:850px;
  }
}

@media(max-width:720px){

  .admin-subnav{
    overflow-x:auto;
    white-space:nowrap;
  }

  .rc6-account-summary{
    grid-template-columns:1fr 1fr;
  }

  .rc6-permission-grid{
    grid-template-columns:1fr;
  }
}


/* =========================================================
   RC7 SAVED SIGNATURES
   ========================================================= */

.whro-shell-signatures{
  min-height:38px;
  display:inline-flex;
  align-items:center;
  gap:6px;
  padding:0 10px;
  border:1px solid rgba(255,255,255,.22);
  border-radius:9px;
  background:rgba(255,255,255,.07);
  color:#fff !important;
  text-decoration:none;
  font-size:.7rem;
  font-weight:800;
}

.whro-shell-signatures:hover{
  background:rgba(255,255,255,.14);
}

.rc7-signature-layout{
  display:grid;
  grid-template-columns:minmax(0,1fr) 330px;
  gap:18px;
  align-items:start;
}

.rc7-signature-library,
.rc7-signature-upload{
  padding:20px;
}

.rc7-signature-count{
  color:#657984;
  font-size:.7rem;
  font-weight:800;
}

.rc7-signature-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:14px;
  margin-top:16px;
}

.rc7-signature-card{
  position:relative;
  overflow:hidden;
  padding:14px;
  border:1px solid #c7d4da;
  border-radius:14px;
  background:#f9fbfb;
}

.rc7-signature-card.default{
  border-color:#00739a;
  box-shadow:0 0 0 2px rgba(0,115,154,.10);
}

.rc7-default-badge{
  position:absolute;
  top:10px;
  right:10px;
  z-index:2;
  padding:4px 7px;
  border-radius:999px;
  background:#005f83;
  color:#fff;
  font-size:.58rem;
  font-weight:900;
  letter-spacing:.07em;
  text-transform:uppercase;
}

.rc7-signature-preview{
  height:150px;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:16px;
  border:1px solid #dae3e7;
  border-radius:10px;
  background:#fff;
}

.rc7-signature-preview img{
  max-width:100%;
  max-height:115px;
  object-fit:contain;
}

.rc7-signature-meta{
  display:grid;
  gap:3px;
  margin-top:11px;
}

.rc7-signature-meta strong{
  color:#173d4c;
}

.rc7-signature-meta small{
  color:#71838c;
}

.rc7-signature-actions{
  display:flex;
  gap:7px;
  margin-top:12px;
}

.rc7-signature-actions form{
  flex:1;
}

.rc7-signature-actions button{
  width:100%;
}

.rc7-delete-signature{
  min-height:40px;
  border:1px solid #ddb8b4;
  border-radius:9px;
  background:#fff7f6;
  color:#a62e27;
  font-weight:800;
}

.rc7-signature-upload > p{
  color:#647983;
  line-height:1.5;
}

.rc7-signature-upload form{
  display:grid;
  gap:13px;
  margin-top:18px;
}

.rc7-signature-upload label{
  display:grid;
  gap:6px;
}

.rc7-signature-upload label > span{
  color:#3f5964;
  font-size:.7rem;
  font-weight:800;
}

.rc7-upload-box{
  padding:18px;
  border:1px dashed #9fb5bf;
  border-radius:12px;
  background:#f4f8f9;
}

.rc7-upload-box strong,
.rc7-upload-box small{
  display:block;
}

.rc7-upload-box small{
  color:#71858e;
}

.rc7-security-note{
  margin-top:20px;
  padding:13px;
  border-radius:11px;
  background:#e9f4f7;
  color:#375b69;
}

.rc7-security-note p{
  margin:5px 0 0;
  font-size:.7rem;
  line-height:1.5;
}

.rc7-empty-signatures{
  margin-top:15px;
  padding:38px 20px;
  text-align:center;
  border:1px dashed #bacbd2;
  border-radius:12px;
  background:#f7f9fa;
}

.rc7-empty-signatures p{
  color:#71838c;
}


/* Signer saved signature cards */

.s2-saved-signatures{
  margin:0 0 16px;
  padding:12px;
  border:1px solid #bed3dc;
  border-radius:12px;
  background:#f0f7f9;
}

.s2-saved-signatures-head{
  display:flex;
  justify-content:space-between;
  gap:10px;
  margin-bottom:10px;
}

.s2-saved-signatures-head strong{
  color:#234653;
}

.s2-saved-signatures-head small{
  color:#70828a;
}

.s2-saved-signature-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:8px;
}

.s2-saved-signature{
  min-height:92px;
  display:grid;
  grid-template-columns:90px 1fr;
  align-items:center;
  gap:10px;
  padding:9px;
  border:1px solid #bfd0d7;
  border-radius:10px;
  background:#fff;
  cursor:pointer;
}

.s2-saved-signature:hover{
  border-color:#00749b;
  background:#f7fbfc;
}

.s2-saved-signature img{
  width:90px;
  height:62px;
  object-fit:contain;
}

.s2-saved-signature span{
  display:grid;
  gap:2px;
  text-align:left;
}

.s2-saved-signature strong{
  color:#234653;
}

.s2-saved-signature small{
  color:#73858d;
}

.s2-save-account-signature{
  margin-top:12px;
  display:flex;
  align-items:center;
  gap:8px;
  color:#526a74;
  font-size:.72rem;
}


@media(max-width:800px){

  .rc7-signature-layout{
    grid-template-columns:1fr;
  }

  .rc7-signature-grid{
    grid-template-columns:1fr;
  }

  .whro-shell-signatures span{
    display:none;
  }
}


/* =========================================================
   RC7 FIX — SAVED SIGNATURE PICKER SIZING
   ========================================================= */

.s2-saved-signatures{
  margin:0 0 16px !important;
  padding:12px !important;
  border:1px solid #bed3dc !important;
  border-radius:12px !important;
  background:#f0f7f9 !important;
}

.s2-saved-signature-grid{
  display:grid !important;
  grid-template-columns:repeat(2,minmax(0,1fr)) !important;
  gap:10px !important;
}

.s2-saved-signature{
  min-width:0 !important;
  min-height:100px !important;
  max-height:120px !important;

  display:grid !important;
  grid-template-columns:110px minmax(0,1fr) !important;
  align-items:center !important;
  gap:12px !important;

  overflow:hidden !important;

  padding:10px !important;

  border:1px solid #bfd0d7 !important;
  border-radius:10px !important;

  background:#fff !important;
}

.s2-saved-signature img{
  display:block !important;

  width:100px !important;
  height:70px !important;

  max-width:100px !important;
  max-height:70px !important;

  object-fit:contain !important;

  margin:0 auto !important;

  background:transparent !important;
}

.s2-saved-signature span{
  min-width:0 !important;

  display:grid !important;
  gap:3px !important;

  overflow:hidden !important;

  text-align:left !important;
}

.s2-saved-signature strong{
  overflow:hidden !important;
  text-overflow:ellipsis !important;
  white-space:nowrap !important;
}

.s2-saved-signature small{
  overflow:hidden !important;
  text-overflow:ellipsis !important;
  white-space:nowrap !important;
}


/* Mobile */
@media(max-width:720px){

  .s2-saved-signature-grid{
    grid-template-columns:1fr !important;
  }

  .s2-saved-signature{
    min-height:92px !important;
    max-height:105px !important;

    grid-template-columns:92px minmax(0,1fr) !important;
  }

  .s2-saved-signature img{
    width:82px !important;
    height:58px !important;

    max-width:82px !important;
    max-height:58px !important;
  }

}