/* ===========================================================================
   Port Twenty Five brand theme for Postal
   ---------------------------------------------------------------------------
   Injected by nginx (sub_filter) AFTER Postal's own stylesheet, so equal
   specificity wins. Nothing in Postal is modified, which means `postal upgrade`
   cannot break it and this file cannot break Postal.

   Palette matches porttwentyfive.com:
     ground    #040706   near-black
     surface   #0a100d / #0d1512
     phosphor  #5cffa8
     text      #a3c0b2
   =========================================================================== */

:root{
  --ptf-ground:#040706;
  --ptf-surface:#0a100d;
  --ptf-raised:#0e1613;
  --ptf-line:rgba(92,255,168,.11);
  --ptf-line-soft:rgba(92,255,168,.06);
  --ptf-p:#5cffa8;
  --ptf-p-dim:#3fbf7f;
  --ptf-p-faint:#2a7a58;
  --ptf-text:#a3c0b2;
  --ptf-text-dim:#6d8a7c;
  --ptf-head:#dff3e8;
  --ptf-red:#ff6b6b;
  --ptf-amber:#ffb454;
  --ptf-mono:ui-monospace,"SFMono-Regular",Menlo,Consolas,"Liberation Mono",monospace;
}

/* ── Ground ──────────────────────────────────────────────────────────────── */
html,body,.page,.siteContent,.siteContent__main,.pageContent,.subPage,.main{
  background:var(--ptf-ground)!important;
  color:var(--ptf-text)!important;
}
body{-webkit-font-smoothing:antialiased}

/* ── Top header ──────────────────────────────────────────────────────────── */
.siteHeader{
  background:var(--ptf-surface)!important;
  border-bottom:1px solid var(--ptf-line)!important;
}
.siteHeader__logo{
  color:var(--ptf-p)!important;
  font-family:var(--ptf-mono)!important;
  font-weight:700!important;
  letter-spacing:.04em;
  text-shadow:0 0 8px rgba(92,255,168,.35);
}
.siteHeader__navItem a,.siteHeader__navLinkWithMenu,.siteHeader__subMenuLink{
  color:var(--ptf-text-dim)!important;
}
.siteHeader__navItem a:hover,.siteHeader__subMenuLink:hover{color:var(--ptf-p)!important}
.siteHeader__subMenu{
  background:var(--ptf-raised)!important;
  border:1px solid var(--ptf-line)!important;
}
.siteHeader__version{color:var(--ptf-p-faint)!important}

/* ── Nav bars ────────────────────────────────────────────────────────────── */
.navBar,.navBar--secondary,.navBar--tertiary{
  background:var(--ptf-surface)!important;
  border-bottom:1px solid var(--ptf-line)!important;
}
.navBar__link{
  color:var(--ptf-text-dim)!important;
  font-family:var(--ptf-mono)!important;
  font-size:12px!important;
  letter-spacing:.09em;
  text-transform:uppercase;
}
.navBar__link:hover{color:var(--ptf-p-dim)!important}
.navBar__item.is-active .navBar__link,.navBar__link.current,.navBar__item.current .navBar__link{
  color:var(--ptf-p)!important;
  box-shadow:inset 0 -2px 0 var(--ptf-p);
}
.navBar__itemCounter{
  background:var(--ptf-p-faint)!important;
  color:var(--ptf-ground)!important;
}

/* ── Sidebar ─────────────────────────────────────────────────────────────── */
.sidebar,.sidebar__new,.sidebar__search{
  background:var(--ptf-surface)!important;
  border-right:1px solid var(--ptf-line)!important;
}
.sidebarServerList__link{color:var(--ptf-text)!important;border-bottom:1px solid var(--ptf-line-soft)!important}
.sidebarServerList__link:hover{background:var(--ptf-raised)!important;color:var(--ptf-p)!important}
.sidebarServerList__title{color:var(--ptf-head)!important}
.sidebarServerList__mode,.sidebarServerList__quantity{color:var(--ptf-p-faint)!important}
.sidebar__searchInput{background:var(--ptf-ground)!important;color:var(--ptf-text)!important;border-color:var(--ptf-line)!important}

/* ── Headings & page furniture ───────────────────────────────────────────── */
.pageHeader,.serverHeader{
  background:var(--ptf-surface)!important;
  border-bottom:1px solid var(--ptf-line)!important;
}
.pageHeader__title,.pageContent__title,.serverHeader__title,.fieldSet__title,
.messageHeader__subject,.messagePropertiesPage__title,.subPageBox__title,
h1,h2,h3,h4{
  color:var(--ptf-head)!important;
}
.pageContent__subTitle,.pageContent__text,.pageContent__intro,.fieldSet__titleSubText,
.fieldSet__text,.subPageBox__text,.noData__text,.retentionLimits__text{
  color:var(--ptf-text-dim)!important;
}
.pageHeader__titlePrevious{color:var(--ptf-p-faint)!important}
.serverHeader__stripe--live{background:var(--ptf-p)!important}
.serverHeader__stripe--suspended{background:var(--ptf-red)!important}
.serverHeader__usageLineLabel,.serverHeader__usageTitle,.limits__title,.limits__frequency{
  color:var(--ptf-text-dim)!important;font-family:var(--ptf-mono)!important;
}
.serverHeader__usageLineValue,.serverHeader__usageLineValueLarge,.limits__value,.limits__limit{
  color:var(--ptf-p)!important;font-family:var(--ptf-mono)!important;
}

/* ── Links ───────────────────────────────────────────────────────────────── */
a,.u-link{color:var(--ptf-p-dim)!important}
a:hover,.u-link:hover{color:var(--ptf-p)!important}

/* ── Buttons ──────────────────────────────────────────────────────────────
   Outlined terminal style, matching the "> PORT TWENTY FIVE" block on the
   site: transparent ground, phosphor rule, glow on hover. Nothing gets a
   solid fill, so the UI reads as a terminal rather than a web app.        */
.button{
  font-family:var(--ptf-mono)!important;
  letter-spacing:.14em!important;
  text-transform:uppercase!important;
  font-weight:600!important;
  border-radius:2px!important;
  background:rgba(92,255,168,.02)!important;
  border:1px solid var(--ptf-p-faint)!important;
  color:var(--ptf-p-dim)!important;
  transition:border-color .25s ease,box-shadow .25s ease,color .25s ease,
             text-shadow .25s ease!important;
}
.button:hover{
  border-color:var(--ptf-p)!important;
  color:var(--ptf-p)!important;
  text-shadow:0 0 6px rgba(92,255,168,.5)!important;
  box-shadow:0 0 14px rgba(92,255,168,.16),
             inset 0 0 20px rgba(92,255,168,.05)!important;
}
.button:focus-visible{outline:2px solid var(--ptf-p-dim)!important;outline-offset:2px}

/* Primary action carries the chevron, same as the site */
.button--positive::before{content:"> ";color:var(--ptf-p-faint);font-weight:400}
.button--positive{border-color:var(--ptf-p-dim)!important;color:var(--ptf-p)!important}
.button--positive:hover{
  border-color:var(--ptf-p)!important;
  background:rgba(92,255,168,.07)!important;
}

.button--neutral,.button--dark{border-color:var(--ptf-line)!important;color:var(--ptf-text-dim)!important}
.button--neutral:hover,.button--dark:hover{border-color:var(--ptf-p-faint)!important;color:var(--ptf-p-dim)!important}

.button--danger{border-color:rgba(255,107,107,.45)!important;color:var(--ptf-red)!important;background:transparent!important}
.button--danger:hover{
  border-color:var(--ptf-red)!important;color:#ffa0a0!important;
  box-shadow:0 0 14px rgba(255,107,107,.18)!important;
  text-shadow:0 0 6px rgba(255,107,107,.45)!important;
}
.button--danger::before{content:none!important}

.button--small{letter-spacing:.1em!important}

/* ── Forms ───────────────────────────────────────────────────────────────── */
.input,.input--text,.input--onWhite,.input--area,.input--select,.input--code,
.input--smallArea,.multibox__input,.messageSearch__input,.routeNameInput__name{
  background:var(--ptf-ground)!important;
  color:var(--ptf-text)!important;
  border:1px solid var(--ptf-line)!important;
  border-radius:3px!important;
}
.input:focus,.input--text:focus,.input--area:focus,.input--select:focus{
  border-color:var(--ptf-p-faint)!important;
  outline:2px solid rgba(92,255,168,.25)!important;
  outline-offset:1px;
}
.input--code{font-family:var(--ptf-mono)!important}
.fieldSet__label,.retentionLimits__label{color:var(--ptf-text-dim)!important;font-family:var(--ptf-mono)!important;letter-spacing:.06em}
.fieldSet__field,.fieldSet__fieldPair,.fieldSetSubmit{border-color:var(--ptf-line)!important}
.input--danger{border-color:var(--ptf-red)!important}
.inlineError,.errorExplanation{color:var(--ptf-red)!important}

/* ── Tables & lists ──────────────────────────────────────────────────────── */
.dataTable,.dataTable td,.dataTable th{
  background:transparent!important;
  color:var(--ptf-text)!important;
  border-color:var(--ptf-line)!important;
}
.dataTable th{color:var(--ptf-text-dim)!important;font-family:var(--ptf-mono)!important;
  font-size:11px!important;letter-spacing:.11em;text-transform:uppercase}
.dataTable__redRow{background:rgba(255,107,107,.07)!important}
.dataTable__empty,.noData__title{color:var(--ptf-text-dim)!important}

.messageList__link,.largeList__link,.domainList__item,.credentialList__item,
.webhookList__item,.routeList__item,.endpointList__item,.ipList__item,
.suppressionList__item,.userList__item,.webhookRequestList__item,.ipPoolRuleList__item,
.deliveryList__item,.headersList__item,.spamCheckList__item{
  background:var(--ptf-surface)!important;
  border-bottom:1px solid var(--ptf-line-soft)!important;
  color:var(--ptf-text)!important;
}
.messageList__link:hover,.largeList__link:hover,.credentialList__link:hover,
.webhookList__link:hover,.routeList__link:hover,.endpointList__link:hover,
.sidebarServerList__link:hover{background:var(--ptf-raised)!important}
.messageList__subject,.largeList__item,.domainList__name,.credentialList__name,
.webhookList__name,.routeList__name,.ipList__name,.suppressionList__address{
  color:var(--ptf-head)!important;
}
.messageList__addresses,.messageList__timestamp,.messageList__meta,.largeList__subText,
.domainList__details,.credentialList__properties,.credentialList__usedAt,
.webhookList__usageTime,.suppressionList__timestamp,.suppressionList__reason,
.messageActivity__timestamp,.messageActivity__extra,.simplePagination__info,
.pageContent__pageEntriesInfo,.domainList__verificationTime{
  color:var(--ptf-text-dim)!important;font-family:var(--ptf-mono)!important;
}
.credentialList__key{font-family:var(--ptf-mono)!important;color:var(--ptf-p-dim)!important}

/* ── Message detail & the SMTP output block (the important one) ──────────── */
.messageHeader,.messagePropertiesPage,.messagePropertiesPage__left,
.messagePropertiesPage__right,.subPageBox,.messageSearch__helpBox,.warningBox{
  background:var(--ptf-surface)!important;
  border:1px solid var(--ptf-line)!important;
  color:var(--ptf-text)!important;
}
.messagePropertiesPage__property{color:var(--ptf-text)!important}
.messagePropertiesPage__propertyPair{border-color:var(--ptf-line-soft)!important}

.codeBlock,.deliveryList__error,.deliveryList__error--output,
.deliveryList__error--output-ref,.pageContent__definitionCode,.spamCheckList__code{
  background:#04100a!important;
  color:var(--ptf-p)!important;
  border:1px solid var(--ptf-line)!important;
  font-family:var(--ptf-mono)!important;
  border-radius:3px!important;
}
.deliveryList__errorCode{color:var(--ptf-amber)!important;font-family:var(--ptf-mono)!important}
.deliveryList__status,.deliveryList__secure,.deliveryList__techLink{color:var(--ptf-text-dim)!important}
.deliveryList__item--header,.deliveryList__top{color:var(--ptf-text-dim)!important}

/* ── Status labels ───────────────────────────────────────────────────────── */
.label{font-family:var(--ptf-mono)!important;letter-spacing:.07em!important;border-radius:2px!important}
.label--green,.label--messageStatus-sent,.label--serverStatus-live,
.label--spamStatus-not_spam,.label--http-status-2{
  background:rgba(92,255,168,.15)!important;color:var(--ptf-p)!important;
}
.label--red,.label--messageStatus-bounced,.label--messageStatus-hard_fail,
.label--serverStatus-suspended,.label--spamStatus-spam,.label--http-status-5{
  background:rgba(255,107,107,.15)!important;color:var(--ptf-red)!important;
}
.label--orange,.label--messageStatus-soft_fail,.label--messageStatus-held,
.label--http-status-4{background:rgba(255,180,84,.15)!important;color:var(--ptf-amber)!important}
.label--grey,.label--messageStatus-pending,.label--messageStatus-processed,
.label--spamStatus-not_checked,.label--serverStatus-development,.label--blue,
.label--purple,.label--turquoise,.label--credentialType-api,.label--credentialType-smtp{
  background:rgba(163,192,178,.12)!important;color:var(--ptf-text)!important;
}
.u-green{color:var(--ptf-p)!important}
.u-red{color:var(--ptf-red)!important}
.u-orange{color:var(--ptf-amber)!important}
.u-grey{color:var(--ptf-text-dim)!important}

/* ── Domain verification ticks ───────────────────────────────────────────── */
.domainList__check--ok{color:var(--ptf-p)!important}
.domainList__check--warning{color:var(--ptf-amber)!important}
.domainList__check--neutral,.domainList__check--neutral-cross{color:var(--ptf-text-dim)!important}

/* ── Login ───────────────────────────────────────────────────────────────── */
.subPage,.loginForm{background:var(--ptf-ground)!important}
.subPage__logo{color:var(--ptf-p)!important;font-family:var(--ptf-mono)!important;
  text-shadow:0 0 10px rgba(92,255,168,.4)}
.loginForm__input{background:var(--ptf-surface)!important;color:var(--ptf-text)!important;
  border:1px solid var(--ptf-line)!important}
.loginForm__divider{border-color:var(--ptf-line)!important}
.loginForm__links a{color:var(--ptf-p-faint)!important}

/* ── Flash messages, misc ────────────────────────────────────────────────── */
.flashMessage{background:var(--ptf-raised)!important;color:var(--ptf-text)!important;
  border-left:3px solid var(--ptf-p)!important}
.flashMessage--notice{border-left-color:var(--ptf-p)!important}
.dangerZone{border:1px solid rgba(255,107,107,.35)!important;background:rgba(255,107,107,.04)!important}
.suspensionBox{background:rgba(255,107,107,.09)!important;border:1px solid var(--ptf-red)!important}
.footer__name,.footer__links a,.siteContent__footer{color:var(--ptf-p-faint)!important}
.bar{background:var(--ptf-line)!important}
.bar__inner{background:var(--ptf-p)!important}
.turbolinks-progress-bar{background:var(--ptf-p)!important}

/* Charts */
.ct-label{fill:var(--ptf-text-dim)!important;color:var(--ptf-text-dim)!important}
.ct-grid{stroke:var(--ptf-line)!important}
.ct-series-a .ct-line,.ct-series-a .ct-point,.ct-series-a .ct-bar{stroke:var(--ptf-p)!important}
.ct-series-a .ct-area{fill:var(--ptf-p)!important;fill-opacity:.12!important}
.ct-series-b .ct-line,.ct-series-b .ct-point,.ct-series-b .ct-bar{stroke:var(--ptf-amber)!important}
.mailGraph__key,.mailGraph__labels,.mailGraph__empty{color:var(--ptf-text-dim)!important}
