/* =========================================================
   Dixyo Auto — Neutral SaaS Form UI (Theme-Compatible)
   Scope: only plugin UI (auto_form / auto_login / auto_dashboard)
   ========================================================= */

/* ---------- Base / Scope ---------- */
.autoafd-form,
.dxy-auth-card,
.autoafd-wrap {
  font-family: Inter, system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, "Apple Color Emoji","Segoe UI Emoji";
  color: #111827;
}

.autoafd-form,
.autoafd-form * {
  box-sizing: border-box;
}

/* ---------- Page-like canvas (without touching body/theme) ---------- */
.autoafd-form {
  max-width: 1100px;         /* per spec */
  margin: 24px auto;
  padding: 24px;             /* 8px system */
  background: #F8F9FA;       /* per spec */
  border: none;
  border-radius: 14px;
}

/* ---------- Section Cards (major blocks) ---------- */
/* 1) first field block is the inline-grid div at top */
.autoafd-form > div[style*="display:grid"]{
  background: #FFFFFF;
  border-radius: 12px;
  box-shadow: 0 2px 12px rgba(0,0,0,0.04);
  padding: 32px;
  margin: 0 0 40px 0;
}

/* 2) all major sections in your form use a "border-top:1px solid ..." wrapper */
.autoafd-form > div[style*="border-top:1px solid"]{
  background: #FFFFFF;
  border-radius: 12px;
  box-shadow: 0 2px 12px rgba(0,0,0,0.04);
  padding: 32px;
  margin: 0 0 40px 0;
  border-top: none !important; /* remove the old separator */
}

/* Keep last section spacing neat */
.autoafd-form > div[style*="border-top:1px solid"]:last-of-type{
  margin-bottom: 16px;
}

/* ---------- Section Titles ---------- */
/* Your section title markup: <p style="font-weight:700;margin:0 0 8px">Title</p> */
.autoafd-form p[style*="font-weight:700"]{
  font-size: 21px;       /* 20–22px */
  font-weight: 600;
  color: #111827;
  margin: 0 0 16px !important;
  padding: 0;
}

/* Sub helper paragraphs under titles */
.autoafd-form p[style*="opacity:.75"],
.autoafd-form p[style*="opacity:.7"],
.autoafd-form small{
  font-size: 12px;
  color: #6B7280 !important;
}

/* ---------- Form grid: keep your structure, just normalize gap ---------- */
.autoafd-form > div[style*="display:grid"]{
  /* your inline grid stays; we just ensure it looks consistent */
}
.autoafd-form > div[style*="display:grid"]{
  /* some themes override select/input widths; enforce predictable spacing */
}
@media (max-width: 860px){
  .autoafd-form{
    margin: 16px auto;
    padding: 16px;
  }
  .autoafd-form > div[style*="display:grid"],
  .autoafd-form > div[style*="border-top:1px solid"]{
    padding: 20px;
    margin-bottom: 24px;
  }
}

/* ---------- Labels ---------- */
.autoafd-form label{
  font-size: 13px;
  font-weight: 500;
  color: #374151;
  display: block;
}

/* ---------- Inputs / Selects / Textareas ---------- */
.autoafd-form input[type="text"],
.autoafd-form input[type="number"],
.autoafd-form input[type="email"],
.autoafd-form input[type="tel"],
.autoafd-form input[type="password"],
.autoafd-form select,
.autoafd-form textarea{
  width: 100%;
  height: 46px;                 /* 44–48px */
  padding: 0 16px;              /* proper horizontal padding */
  border: 1px solid #E5E7EB;
  border-radius: 8px;
  background: #FFFFFF;
  color: #111827;
  outline: none;
  transition: border-color 150ms ease, box-shadow 150ms ease;
}

/* textarea */
.autoafd-form textarea{
  height: auto;
  min-height: 180px;
  padding: 14px 16px;
  line-height: 1.45;
  resize: vertical;
}

/* focus state */
.autoafd-form input:focus,
.autoafd-form select:focus,
.autoafd-form textarea:focus{
  border-color: var(--dxy-accent, #2563EB);
  box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.15);
}

/* Placeholder (if any) */
.autoafd-form input::placeholder,
.autoafd-form textarea::placeholder{
  color: #9CA3AF;
}

/* Dropdown arrow (theme-safe) */
.autoafd-form select{
  padding-right: 44px;
  appearance: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  background-image:
    linear-gradient(45deg, transparent 50%, #6B7280 50%),
    linear-gradient(135deg, #6B7280 50%, transparent 50%),
    linear-gradient(to right, transparent, transparent);
  background-position:
    calc(100% - 18px) 50%,
    calc(100% - 12px) 50%,
    0 0;
  background-size:
    6px 6px,
    6px 6px,
    100% 100%;
  background-repeat: no-repeat;
}

/* ---------- Buttons ---------- */
.dxy-btn,
.autoafd-btn,
.autoafd-btn-a{
  display: inline-block;
  height: 48px;              /* per spec */
  line-height: 48px;
  padding: 0 18px;
  border-radius: 10px;
  font-weight: 600;
  text-decoration: none;
  cursor: pointer;
  border: 1px solid transparent;
  transition: background-color 150ms ease, box-shadow 150ms ease, transform 150ms ease;
  user-select: none;
}

/* Primary */
.autoafd-btn,
.dxy-btn{
  background: var(--dxy-accent, #2563EB);
  color: #FFFFFF;
  box-shadow: 0 6px 16px rgba(37,99,235,0.18);
}
.autoafd-btn:hover,
.dxy-btn:hover{
  background: var(--dxy-accent-hover, #1D4ED8);
}

/* Secondary */
.autoafd-btn-a.secondary,
.dxy-btn.secondary{
  background: #FFFFFF;
  color: #111827;
  border-color: #E5E7EB;
  box-shadow: none;
}
.autoafd-btn-a.secondary:hover,
.dxy-btn.secondary:hover{
  background: #F9FAFB;
}

/* Button active */
.autoafd-btn:active,
.dxy-btn:active,
.autoafd-btn-a:active{
  transform: translateY(1px);
}

/* ---------- Images Section: make it feel like a drop-zone ---------- */
/* Your inner cards already exist; we improve styling */
.autoafd-form div[style*="padding:14px;border:1px solid"],
.autoafd-form div[style*="padding:14px;border:1px dashed"]{
  background: #FFFFFF !important;
  border-radius: 12px !important;
  box-shadow: none !important;
}

/* Cover area: the wrapper with image + buttons (has flex inline) */
.autoafd-form div[style*="display:flex;gap:16px"]{
  border: 1px dashed #D1D5DB;
  background: #F9FAFB;
  border-radius: 12px;
  padding: 16px;
}

/* Hover highlight */
.autoafd-form div[style*="display:flex;gap:16px"]:hover{
  border-color: #9CA3AF;
}

/* Cover preview */
#fe_thumb_preview{
  width: 168px !important;
  height: 168px !important;
  border-radius: 12px !important;
  border: 1px solid #E5E7EB !important;
  background: #FFFFFF !important;
  display: block;
}

/* Gallery thumbnails: convert wrap to grid */
#fe_gal_wrap{
  display: block; /* reset theme overrides */
  margin-top: 12px !important;
}
#fe_gal_wrap:after{
  content:"";
  display:block;
  clear:both;
}
#fe_gal_wrap img{
  width: 96px;
  height: 96px;
  border-radius: 10px;
  border: 1px solid #E5E7EB;
  background: #FFFFFF;
  display: block;
  float: left;
  margin: 0 8px 8px 0; /* 8px system gap */
}

/* ---------- Features Section (checkbox area) ---------- */
/* Bigger separation + readable columns */
.dxy-feats-grid{
  margin-top: 16px;
}

/* Category containers */
.dxy-feats-col{
  background: #F9FAFB;
  border: 1px solid #EEF0F3;
  border-radius: 12px;
  padding: 16px;
}

/* Category title */
.dxy-feats-title{
  font-size: 16px;
  font-weight: 600;
  color: #111827;
  margin: 0 0 12px;
}

/* List spacing */
.dxy-feats-list{
  margin: 0;
  padding: 0;
}

/* Row hover + spacing */
.dxy-feat-item{
  display: block;
  padding: 10px 10px;
  border-radius: 10px;
  margin-bottom: 12px; /* min 12px vertical */
  transition: background-color 150ms ease;
}
.dxy-feat-item:hover{
  background: rgba(17,24,39,0.04);
}

/* Custom checkbox */
.dxy-feat-item input[type="checkbox"]{
  appearance: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  width: 18px;
  height: 18px;
  border: 1px solid #D1D5DB;
  border-radius: 4px;
  background: #FFFFFF;
  vertical-align: middle;
  margin: 0 10px 0 0;
  position: relative;
  cursor: pointer;
  outline: none;
  transition: background-color 150ms ease, border-color 150ms ease, box-shadow 150ms ease;
}

.dxy-feat-item input[type="checkbox"]:focus{
  border-color: var(--dxy-accent, #2563EB);
  box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.15);
}

.dxy-feat-item input[type="checkbox"]:checked{
  background: var(--dxy-accent, #2563EB);
  border-color: var(--dxy-accent, #2563EB);
}

/* check icon */
.dxy-feat-item input[type="checkbox"]:checked:after{
  content:"";
  position:absolute;
  left: 5px;
  top: 2px;
  width: 5px;
  height: 9px;
  border: solid #FFFFFF;
  border-width: 0 2px 2px 0;
  transform: rotate(45deg);
}

/* Label text alignment */
.dxy-feat-item span{
  font-size: 13px;
  font-weight: 500;
  color: #374151;
  vertical-align: middle;
}

/* Columns organization (modern but theme-safe) */
.dxy-feats-grid{
  display: grid;
  grid-template-columns: repeat(2, minmax(240px, 1fr));
  gap: 16px;
}
@media (min-width: 980px){
  .dxy-feats-grid{
    grid-template-columns: repeat(3, minmax(240px, 1fr));
  }
}
@media (max-width: 720px){
  .dxy-feats-grid{
    grid-template-columns: 1fr;
  }
}

/* ---------- Description block ---------- */
.autoafd-form textarea{
  background: #FFFFFF;
}


/* Make primary button right-aligned feel */
.autoafd-form > div[style*="display:flex"][style*="margin-top:12px"]{
  text-align: right;
}
.autoafd-form > div[style*="display:flex"][style*="margin-top:12px"] .autoafd-btn{
  margin-right: 10px;
}

/* ---------- Login card polish ---------- */
.dxy-auth-card{
  max-width: 560px;
  margin: 32px auto;
  padding: 32px;
  border-radius: 12px;
  background: #FFFFFF;
  box-shadow: 0 2px 12px rgba(0,0,0,0.04);
  border: 1px solid #EEF0F3;
}
.dxy-auth-card h3{
  font-size: 22px;
  font-weight: 600;
  margin: 0 0 16px;
  color: #111827;
}
.dxy-err{
  background: #FEF2F2;
  border: 1px solid #FECACA;
  color: #991B1B;
  padding: 10px 12px;
  border-radius: 10px;
  font-weight: 600;
}

/* ---------- Dashboard container polish ---------- */
.autoafd-wrap{
  max-width: 1100px;
  margin: 24px auto;
  padding: 24px;
  background: #F8F9FA;
  border-radius: 14px;
}
.autoafd-table{
  background: #FFFFFF;
  border-radius: 12px;
  box-shadow: 0 2px 12px rgba(0,0,0,0.04);
  border: 1px solid #EEF0F3;
  overflow: hidden;
}
.autoafd-table thead th{
  background: #F9FAFB;
  color: #111827;
  font-weight: 600;
  font-size: 12px;
}
.autoafd-table td{
  border-bottom: 1px solid #EEF0F3;
}
.autoafd-thumb{
  border-radius: 10px;
  border: 1px solid #E5E7EB;
}

/* ===== FIX: centrare text butoane (rosu / primary) ===== */
.autoafd-btn,
.dxy-btn,
.autoafd-btn-a{
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;

  height: 48px !important;
  padding: 0 20px !important;

  line-height: 1 !important;
  text-align: center !important;

  vertical-align: middle !important;
  white-space: nowrap !important;

  /* dacă tema pune font-size/weight aiurea */
  font-weight: 600 !important;
}

/* dacă tema îți “umflă” butonul prin pseudo-elemente */
.autoafd-btn:before,
.autoafd-btn:after,
.dxy-btn:before,
.dxy-btn:after,
.autoafd-btn-a:before,
.autoafd-btn-a:after{
  display: none !important;
  content: none !important;
}

/* unele teme pun 'button { padding: ...; line-height: ... }' */
button.autoafd-btn,
button.dxy-btn{
  padding: 0 20px !important;
  line-height: 1 !important;
}

/* link-urile buton (a) uneori au line-height diferit */
a.autoafd-btn-a,
a.dxy-btn{
  line-height: 1 !important;
  text-decoration: none !important;
}

/* =========================================================
   AutoAdy — SaaS Premium Polish Layer (NO layout changes)
   Paste at END of assets/dixyo-auto.css
   ========================================================= */

/* --- Typography tightening (neutral + SaaS) --- */
.autoafd-form,
.dxy-auth-card,
.autoafd-wrap{
  font-family: Inter, system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, "Apple Color Emoji","Segoe UI Emoji";
  color:#111827;
}

.autoafd-form{
  font-size:14px;
  line-height:1.45;
}

/* Section titles (your <p style="font-weight:700...">) */
.autoafd-form p[style*="font-weight:700"]{
  font-size:21px !important;      /* 20–22 */
  font-weight:600 !important;
  letter-spacing:-0.01em;
  color:#111827 !important;
  margin-bottom:16px !important;  /* rhythm */
}

/* Labels */
.autoafd-form label{
  font-size:14px !important;
  font-weight:500 !important;
  color:#374151 !important;
}

/* Helper text */
.autoafd-form small,
.autoafd-form p[style*="opacity:.7"],
.autoafd-form p[style*="opacity:.75"]{
  font-size:12px !important;
  color:#6B7280 !important;
  letter-spacing:0;
}

/* --- Vertical rhythm: calm spacing system --- */
/* 16px between label text and input/select/textarea */
.autoafd-form label > input,
.autoafd-form label > select,
.autoafd-form label > textarea{
  margin-top:16px !important;
}

/* 24px between related elements (labels) inside main grid */
.autoafd-form > div[style*="display:grid"] label{
  margin-bottom:24px !important;
}

/* Major sections: tighten to 48–56px without redesigning */
.autoafd-form > div[style*="border-top:1px solid"]{
  margin-top:48px !important;
  padding-top:24px !important;
}

/* Extra breathing room above final action buttons */
.autoafd-form > div[style*="display:flex"][style*="margin-top:12px"]{
  margin-top:40px !important;
}

/* --- Inputs: premium micro-interactions --- */
.autoafd-form input[type="text"],
.autoafd-form input[type="number"],
.autoafd-form input[type="email"],
.autoafd-form input[type="tel"],
.autoafd-form input[type="password"],
.autoafd-form select,
.autoafd-form textarea{
  height:48px !important;
  border:1px solid #E5E7EB !important;
  border-radius:8px !important;
  padding:0 16px !important;
  background:#FFFFFF !important;
  color:#111827 !important;
  transition: border-color 160ms ease, box-shadow 160ms ease, background-color 160ms ease !important;
  -webkit-transition: border-color 160ms ease, box-shadow 160ms ease, background-color 160ms ease !important;
}

.autoafd-form textarea{
  height:auto !important;
  min-height:180px !important;
  padding:14px 16px !important;
}

.autoafd-form input:focus,
.autoafd-form select:focus,
.autoafd-form textarea:focus{
  border-color:#2563EB !important;
  background:#F9FAFB !important; /* subtle tint */
  box-shadow:0 0 0 3px rgba(37,99,235,0.15) !important;
}

/* subtle hover (calm) */
.autoafd-form input:hover,
.autoafd-form select:hover,
.autoafd-form textarea:hover{
  background:#FBFCFE !important;
}

/* dropdown arrow clarity (doesn't change layout) */
.autoafd-form select{
  padding-right:44px !important;
  appearance:none !important;
  -webkit-appearance:none !important;
  -moz-appearance:none !important;
  background-image:
    linear-gradient(45deg, transparent 50%, #6B7280 50%),
    linear-gradient(135deg, #6B7280 50%, transparent 50%);
  background-position:
    calc(100% - 18px) 50%,
    calc(100% - 12px) 50%;
  background-size:6px 6px, 6px 6px;
  background-repeat:no-repeat;
}

/* --- Buttons: authority + perfect centering --- */
.autoafd-btn,
.dxy-btn,
.autoafd-btn-a{
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  line-height:1 !important;
  height:48px !important;
  padding:0 22px !important;      /* slightly more authority */
  border-radius:10px !important;
  font-weight:600 !important;
  transition: transform 160ms ease, box-shadow 160ms ease, background-color 160ms ease, border-color 160ms ease !important;
  -webkit-transition: transform 160ms ease, box-shadow 160ms ease, background-color 160ms ease, border-color 160ms ease !important;
  text-decoration:none !important;
  white-space:nowrap !important;
}

/* Primary: stronger but subtle shadow */
.autoafd-btn,
.dxy-btn{
  box-shadow: 0 8px 18px rgba(37,99,235,0.18) !important;
}

.autoafd-btn:hover,
.dxy-btn:hover{
  transform: translateY(-1px) !important;
  box-shadow: 0 12px 24px rgba(37,99,235,0.22) !important;
}

/* Secondary: clean */
.autoafd-btn-a.secondary,
.dxy-btn.secondary{
  box-shadow:none !important;
}

/* Remove theme pseudo-elements that can misalign text */
.autoafd-btn:before, .autoafd-btn:after,
.dxy-btn:before, .dxy-btn:after,
.autoafd-btn-a:before, .autoafd-btn-a:after{
  content:none !important;
  display:none !important;
}

/* --- Image section emphasis (no redesign) --- */
/* Increase dropzone height (your cover container uses display:flex;gap:16px...) */
.autoafd-form div[style*="display:flex;gap:16px;align-items:flex-start"]{
  min-height:150px !important;          /* 140–160 */
  background:#F9FAFB !important;        /* subtle differentiation */
  border-color:#D1D5DB !important;
  transition: border-color 160ms ease, background-color 160ms ease !important;
}
.autoafd-form div[style*="display:flex;gap:16px;align-items:flex-start"]:hover{
  border-color:#9CA3AF !important;
}

/* Make instruction text slightly stronger (you have a paragraph right under "Imagini") */
.autoafd-form p[style*="Pasul 1"],
.autoafd-form p[style*="Pasul 2"]{
  font-weight:500 !important;
}

/* Add the requested helper line under the Images title (CSS-only, no markup changes) */
.autoafd-form p[style*="Imagini"]:after{
  content:" Recomandat: minim 8 imagini pentru conversie mai bună.";
  display:block;
  margin-top:8px;
  font-size:12px;
  font-weight:400;
  color:#6B7280;
  letter-spacing:0;
}

/* Gallery thumbs: more even spacing (8–12px) */
#fe_gal_wrap img{
  margin: 0 10px 10px 0 !important;
}

/* --- Dotări micro-refinement (reduce fatigue) --- */
.dxy-feats-col{
  padding:18px !important; /* slightly more space */
}

/* title contrast + subtle divider */
.dxy-feats-title{
  color:#111827 !important;
  font-weight:600 !important;
  font-size:16px !important;
  margin-bottom:12px !important;
  padding-bottom:10px !important;
  border-bottom:1px solid rgba(17,24,39,0.06) !important;
}

/* Checkbox rows: +4–6px spacing */
.dxy-feat-item{
  margin-bottom:14px !important; /* was smaller */
  padding:10px 10px !important;
  border-radius:10px !important;
  cursor:pointer !important;
  transition: background-color 160ms ease !important;
}
.dxy-feat-item:hover{
  background: rgba(0,0,0,0.02) !important;
}

/* Checkbox alignment + polish */
.dxy-feat-item input[type="checkbox"]{
  width:18px !important;
  height:18px !important;
  border-radius:4px !important;
  border:1px solid #D1D5DB !important;
  vertical-align: middle !important;
}

/* Make sure checkbox + text align pixel-perfect */
.dxy-feat-item span{
  vertical-align: middle !important;
  font-size:14px !important;
  color:#374151 !important;
}

/* --- Shadows / radii consistency (remove rough edges) --- */
/* Keep your main card shadow subtle + consistent */
.autoafd-form{
  border-radius:12px !important;
}

/* =====================================================
   FINAL ACTIONS – SAFE NON-STICKY BEHAVIOR
   ===================================================== */

/* ne asigurăm explicit că NU sunt sticky/fixed */
.autoafd-form .autoafd-btn,
.autoafd-form .autoafd-btn-a{
  position: static !important;
}

/* zona de acțiuni de la final */
.autoafd-form > div[style*="display:flex"][style*="margin-top"]{
  margin-top:56px !important;   /* clar “final de formular” */
  padding-top:24px !important;
  border-top:1px solid #E5E7EB !important;
}

/* butonul principal – mai multă autoritate, fără grabă */
.autoafd-btn{
  min-width:220px;              /* senzație de decizie serioasă */
}

/* buton secundar – mai retras vizual */
.autoafd-btn-a.secondary{
  opacity:.9;
}
.autoafd-btn-a.secondary:hover{
  opacity:1;
}

/* =====================================================
   FINAL ACTIONS – NON-STICKY (SAFE, DEFINITIVE)
   ===================================================== */

/* ne asigurăm că NU există sticky/fixed nicăieri */
.autoafd-form > div[style*="display:flex"][style*="margin-top"]{
  position: static !important;
  bottom: auto !important;
  z-index: auto !important;

  background: transparent !important;
  backdrop-filter: none !important;

  margin-top: 56px !important;   /* clar final de formular */
  padding-top: 32px !important;
  border-top: 1px solid #E5E7EB !important;

  border-radius: 0 !important;
  box-shadow: none !important;
}

/* aliniere naturală, fără “bară” */
.autoafd-form > div[style*="display:flex"][style*="margin-top"]{
  justify-content: flex-start !important;
}

/* buton principal – autoritate calmă */
.autoafd-btn{
  min-width: 220px;
}

/* buton secundar mai discret */
.autoafd-btn-a.secondary{
  opacity: .85;
}
.autoafd-btn-a.secondary:hover{
  opacity: 1;
}