/*
Theme Name: ProteoMosiac Splash
Theme URI: https://example.com/
Author: ProteoMosaic
Author URI: https://example.com/
Description: Single-page splash theme for ProteoMosaic email capture.
Version: 1.0.0
Requires at least: 6.0
Tested up to: 6.6
Requires PHP: 7.4
License: GPLv2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: proteomosiac-splash
Tags: one-column, custom-background, custom-logo, featured-images
*/

:root{
  --pmx-bg-color: #D8D8D8;
  --pmx-text: #333333;
  --pmx-muted: #666666;
  --pmx-card-max: 980px;
  --pmx-form-width: 430px;
  --pmx-radius: 12px;
}

*{ box-sizing:border-box; }
html, body{ height:100%; }
body{
  margin:0;
  font-family: system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, sans-serif;
  color: var(--pmx-text);
  background: var(--pmx-bg-color);
}

/* Background "float" image centered on page */
.pmx-bg{
  min-height: 100vh;
  display:flex;
  align-items:center;
  justify-content:center;
  padding: 48px 20px;
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
}

/* Main stack */
.pmx-wrap{
  width: 100%;
  max-width: var(--pmx-card-max);
  text-align:center;
}

.pmx-logo{
  max-width: 720px;
  width: min(90vw, 720px);
  height:auto;
  display:block;
  margin: 0 auto 28px auto;
}

/* Form area */
.pmx-form-title{
  font-size: 18px;
  margin: 0 0 10px 0;
  color: var(--pmx-text);
}

.pmx-form{
  display:flex;
  align-items:center;
  justify-content:center;
  gap: 0;
  width: 100%;
}

.pmx-input-wrap{
  position: relative;
  width: min(90vw, var(--pmx-form-width));
}

.pmx-email{
  width: 100%;
  height: 44px;
  padding: 0 56px 0 14px;
  border-radius: 10px;
  border: 2px solid #333;
  font-size: 18px;
  outline: none;
  background: rgba(255,255,255,0.85);
}

.pmx-email:focus{
  box-shadow: 0 0 0 3px rgba(42,95,141,0.25);
}

/* Icon submit button positioned over the right side of input */
.pmx-submit{
  position:absolute;
  top: 50%;
  right: -22px; /* overlaps */
  transform: translateY(-50%);
  width: 44px;
  height: 44px;
  border: none;
  background-color: transparent;
  cursor: pointer;
  padding: 0;
  background-image: var(--pmx-go-icon);
  background-repeat: no-repeat;
  background-position: center;
  background-size: 44px 44px;
}

.pmx-submit:hover,
.pmx-submit:focus{
  background-image: var(--pmx-go-icon-hover);
  outline: none;
}

.pmx-submit:focus{
  box-shadow: 0 0 0 3px rgba(95,141,42,0.35);
  border-radius: 999px;
}

/* Messages */
.pmx-message{
  margin-top: 14px;
  font-size: 14px;
  color: var(--pmx-muted);
}

.pmx-message.pmx-error{ color: #8d2a2a; }
.pmx-message.pmx-success{ color: #2b4e04; }

/* Simple accessibility helper */
.screen-reader-text{
  border: 0;
  clip: rect(1px,1px,1px,1px);
  clip-path: inset(50%);
  height: 1px;
  margin: -1px;
  overflow: hidden;
  padding: 0;
  position: absolute !important;
  width: 1px;
  word-wrap: normal !important;
}
