/* Card container */
#wpau-upload-wrapper{
  max-width: 600px;
  margin: 28px auto;
  padding: 28px 24px 26px;
  background:#fff;
  border:1px solid #e6ebf0;
  border-radius:16px;
  box-shadow:0 8px 28px rgba(16,24,40,.06);
  text-align:center;
  position:relative;
}

/* Cloud icon (from assets/image/cloud-upload.svg) */
#wpau-upload-wrapper::before{
  content:"";
  display:block;
  width:72px; height:72px;
  margin:0 auto 8px;
  background:url('../image/cloud-upload.svg') no-repeat center;
  background-size:contain;
  filter: drop-shadow(0 2px 6px rgba(15,23,42,.08));
}

/* Title + subtitle like Image 1 */
#wpau-upload-wrapper h2{
  margin:0 0 6px;
  font-size:28px;              /* bold, large */
  line-height:1.2;
  color:#0f172a;               /* near-black */
  font-weight:700;
  letter-spacing:.2px;
}

/* The helper text is inside the dropzone <p> in your markup */
#wpau-dropzone p{
  margin:0 0 16px;
  color:#64748b;               /* subtle gray */
  font-size:14px;
}

/* Remove the dashed border area entirely */
.drop-area{
  border:none !important;
  background:transparent !important;
  padding:0 !important;
  margin-bottom:0 !important;
  cursor:pointer;
}
.drop-area.dragging{ background:transparent; }

/* Primary button (matches Image 1) */
#wpau-choose-btn{
  background:#2563eb;
  color:#fff !important;
  border:none;
  padding:12px 22px;
  border-radius:12px;
  font-weight:600;
  box-shadow:0 6px 16px rgba(37,99,235,.25);
  transition:transform .05s ease, box-shadow .2s ease, background .2s ease;
}
#wpau-choose-btn:hover{
  background:#1e4ed8;
  box-shadow:0 10px 22px rgba(37,99,235,.30);
  transform:translateY(-1px);
}

/* Progress hidden until active */
#wpau-progress{ display:none; height:8px; margin:10px 0; background:#e5e7eb; border-radius:999px; overflow:hidden; }
#wpau-progress.is-active{ display:block; }
#wpau-bar{ height:100%; width:0; background:#2563eb; border-radius:999px; }

/* Keep your existing bits */
#wpau-filename{ margin-top:12px; color:#334155; font-style:italic; }
#wpau-thumbnail img, #wpau-preview-thumb{ display:block; max-height:100px; margin-bottom:10px; border:1px solid #e2e8f0; border-radius:8px; }
.wpau-field{ margin-bottom:12px; }

/* place in your plugin assets/css/style.css or Additional CSS */

/* remove dashed box + tighten uploader to match mock */
#wpau-dropzone{ border:none !important; background:transparent !important; padding:0 !important; }
#wpau-upload-wrapper{ text-align:center; }

/* stats row under uploader */
.kv-stats{
  max-width:1100px;
  margin:16px auto 8px;
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:20px;
}
.kv-card{
  background:#fff;
  border:1px solid #e7ebf0;
  border-radius:14px;
  padding:18px 20px;
  display:flex; align-items:center; gap:14px;
  box-shadow:0 1px 2px rgba(16,24,40,.04);
}
.kv-icon{
  width:46px; height:46px; flex:0 0 46px;
  border-radius:50%;
  display:grid; place-items:center;
  background:#f6f8ff; border:1px solid #e4e9f8;
  color:#2563eb; font-weight:600;
}
/* use your plugin image paths */
.kv-i-user{ background:#f6f8ff url('../image/user.svg') no-repeat center/22px; }
.kv-i-doc { background:#f6f8ff url('../image/doc.svg')  no-repeat center/22px; }
/* numeric badge */
.kv-i-badge{
  background:#f8fafc; border:1px solid #e5e7eb; color:#64748b;
  font-family:system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;
  font-size:16px;
}
.kv-title{ font-weight:600; color:#111827; margin:0 0 4px; }
.kv-sub{ color:#6b7280; font-size:13px; }

/* responsive */
@media (max-width:768px){
  .kv-stats{ grid-template-columns:1fr; gap:12px; }
}

/* ------------------------------
   MODERN CARD STYLE FOR STEP 2
------------------------------ */

.wpau-details-block {
    background: #ffffff;
    border-radius: 14px;
    padding: 24px 28px;
    border: 1px solid #e7e7e7;
    box-shadow: 0 4px 12px rgba(0,0,0,0.05);
    transition: box-shadow 0.2s ease;
    max-width: 420px;
}

.wpau-details-block:hover {
    box-shadow: 0 6px 18px rgba(0,0,0,0.08);
}

/* Title */
.wpau-details-block h3 {
    font-size: 22px;
    font-weight: 700;
    margin-bottom: 15px;
}

/* Thumbnail preview */
.wpau-preview-thumb {
    border-radius: 8px;
    box-shadow: 0 2px 8px rgba(0,0,0,0.08);
}

/* Inputs */
.wpau-details-block input[type="text"],
.wpau-details-block textarea,
.wpau-details-block select {
    width: 100% !important;
    margin-top: 6px;
    margin-bottom: 16px;
    padding: 10px 12px;
    border-radius: 8px;
    border: 1px solid #dcdcdc;
    background: #fafafa;
    transition: border-color 0.2s ease, background 0.2s ease;
    font-size: 15px;
}

.wpau-details-block input[type="text"]:focus,
.wpau-details-block textarea:focus,
.wpau-details-block select:focus {
    border-color: #6b4eff;
    background: #fff;
    outline: none;
}

/* Labels */
.wpau-details-block label {
    font-weight: 600;
    color: #333;
}

/* Buttons */
.wpau-details-block .button,
.wpau-details-block button {
    border-radius: 8px !important;
    padding: 10px 16px !important;
    font-weight: 600 !important;
}

/* Primary Button */
.wpau-details-block .button-primary {
    background: #6b4eff !important;
    border-color: #6b4eff !important;
    color: #fff !important;
}
.wpau-details-block .button-primary:hover {
    background: #5738df !important;
}

/* Secondary Button */
.wpau-details-block .button-secondary {
    background: #f0f0f7 !important;
    color: #333 !important;
    border-color: #e1e1e8 !important;
}
.wpau-details-block .button-secondary:hover {
    background: #e4e4ef !important;
}

/* Spacing fixes */
.wpau-details-block p {
    margin-bottom: 12px;
}

/* Select dropdown */
.wpau-details-block select {
    height: 42px;
}

/* Tags + Abstract helpers */
.wpau-details-block .wpau-gen-abstract,
.wpau-details-block .wpau-gen-tags {
    margin-top: -8px;
}

/* Responsive */
@media (max-width: 480px) {
    .wpau-details-block {
        padding: 18px;
    }
    .wpau-details-block h3 {
        font-size: 20px;
    }
}

