/* Mianjo v8.0.2 - form + mobile layout upgrade */
:root{
  --mjn-blue:#245dff;
  --mjn-blue-soft:#f2f6ff;
  --mjn-ink:#1a1c23;
  --mjn-muted:#747887;
  --mjn-line:#e4e7ee;
  --mjn-shadow:0 16px 50px rgba(18,24,55,.07);
  --mjn-focus:0 0 0 4px rgba(36,93,255,.10);
}

/* Global form foundation */
form,
fieldset{min-width:0}
form{width:100%}
label{line-height:1.7}
.form-grid > label,
.form-group,
.field-label,
.auth-form label{
  display:grid;
  gap:8px;
  min-width:0;
}
.form-grid > label,
.form-group label,
.field-label,
.auth-form .field-label{
  color:var(--mjn-ink);
  font-size:12px;
  font-weight:800;
}
.form-grid > label > small,
.form-group > small,
.hint,
.auth-form small{
  font-size:10px;
  color:var(--mjn-muted);
  font-weight:500;
}

/* Replace rigid square controls with soft modern controls */
.form-grid input:not([type="hidden"]),
.form-grid select,
.form-grid textarea,
.form-group input:not([type="hidden"]),
.form-group select,
.form-group textarea,
.auth-form input:not([type="hidden"]),
.auth-form select,
.auth-form textarea,
.field-control input,
.field-control select,
.field-control textarea,
.support-search input,
.search-field input,
.admin-main input:not([type="hidden"]),
.admin-main select,
.admin-main textarea{
  width:100%;
  min-height:50px;
  border:1px solid #dfe3eb;
  border-radius:15px;
  background:#fff;
  color:var(--mjn-ink);
  padding:12px 14px;
  outline:0;
  box-shadow:0 2px 0 rgba(14,20,50,.015);
  transition:border-color .18s ease,box-shadow .18s ease,background-color .18s ease,transform .18s ease;
}
.form-grid textarea,
.form-group textarea,
.auth-form textarea,
.field-control textarea,
.admin-main textarea{
  min-height:140px;
  resize:vertical;
  line-height:1.9;
}
.form-grid select,
.form-group select,
.auth-form select,
.field-control select,
.admin-main select{
  appearance:auto;
  padding-inline-end:14px;
}
.form-grid input::placeholder,
.form-grid textarea::placeholder,
.form-group input::placeholder,
.form-group textarea::placeholder,
.auth-form input::placeholder,
.auth-form textarea::placeholder,
.admin-main input::placeholder,
.admin-main textarea::placeholder{
  color:#a7acb8;
}
.form-grid input:focus,
.form-grid select:focus,
.form-grid textarea:focus,
.form-group input:focus,
.form-group select:focus,
.form-group textarea:focus,
.auth-form input:focus,
.auth-form select:focus,
.auth-form textarea:focus,
.field-control:focus-within,
.admin-main input:focus,
.admin-main select:focus,
.admin-main textarea:focus{
  border-color:#86a3ff;
  box-shadow:var(--mjn-focus);
}
.form-grid input:hover,
.form-grid select:hover,
.form-grid textarea:hover,
.form-group input:hover,
.form-group select:hover,
.form-group textarea:hover,
.auth-form input:hover,
.auth-form textarea:hover,
.admin-main input:hover,
.admin-main select:hover,
.admin-main textarea:hover{
  border-color:#cbd2e0;
}

/* Keep hidden controls / radios / checkboxes untouched */
input[type="hidden"]{display:none!important}
input[type="radio"],
input[type="checkbox"]{
  width:auto!important;
  min-height:0!important;
  border:0!important;
  padding:0!important;
  box-shadow:none!important;
}

/* Input-with-icon design used by login/register */
.field-control{
  min-width:0;
  position:relative;
  display:flex;
  align-items:center;
  background:#fff;
  border:1px solid #dfe3eb;
  border-radius:15px;
  min-height:52px;
  transition:border-color .18s ease,box-shadow .18s ease;
}
.field-control:focus-within{
  border-color:#86a3ff;
  box-shadow:var(--mjn-focus);
}
.field-control > i{
  flex:0 0 42px;
  text-align:center;
  color:var(--mjn-blue);
  font-size:17px;
}
.field-control input,
.field-control select,
.field-control textarea{
  flex:1 1 auto;
  min-width:0;
  min-height:50px!important;
  border:0!important;
  box-shadow:none!important;
  background:transparent!important;
  padding:11px 13px 11px 10px;
}

/* Auth pages: desktop two-column, mobile clean single flow */
.auth-page{
  min-height:calc(100vh - 90px);
  background:#fff;
  padding:28px 20px 44px;
  display:flex;
  align-items:center;
}
.auth-layout{
  width:min(1240px,100%);
  margin-inline:auto;
  min-height:680px;
  display:grid;
  grid-template-columns:minmax(0,1.08fr) minmax(410px,.92fr);
  background:#fff;
  border:1px solid #e7e9ef;
  border-radius:30px;
  overflow:hidden;
  box-shadow:0 28px 90px rgba(18,24,55,.10);
}
.auth-layout.register-layout{
  grid-template-columns:minmax(0,1fr) minmax(470px,1fr);
}
.auth-visual{
  min-width:0;
  min-height:100%;
  display:flex;
  align-items:center;
  justify-content:center;
  background:#05070d;
  padding:42px;
  overflow:hidden;
}
.auth-visual img{
  width:min(100%,720px);
  height:auto;
  max-height:640px;
  object-fit:contain;
  object-position:center;
  display:block;
}
.auth-panel{
  min-width:0;
  background:#fff;
  display:flex;
  align-items:center;
}
.auth-panel-inner{
  width:min(520px,100%);
  padding:52px 46px;
  margin-inline:auto;
}
.auth-brand{
  display:inline-flex;
  align-items:center;
  gap:10px;
  color:#181a20;
  font-weight:900;
  font-size:22px;
  margin-bottom:34px;
}
.auth-brand img{width:42px;height:42px;border-radius:12px;object-fit:cover}
.auth-heading{margin-bottom:24px}
.auth-heading .eyebrow{margin-bottom:6px}
.auth-heading h1{margin:0 0 8px;color:var(--mjn-ink);font-size:32px;line-height:1.3}
.auth-heading p{margin:0;color:var(--mjn-muted);font-size:12px}
.auth-form{display:grid;gap:15px}
.register-grid{display:grid;grid-template-columns:1fr 1fr;gap:13px}
.auth-submit{width:100%;margin-top:4px}
.auth-divider{margin:21px 0 13px;display:flex;align-items:center;gap:12px;color:#9a9eaa;font-size:11px}
.auth-divider::before,.auth-divider::after{content:"";height:1px;background:#eceef3;flex:1}
.auth-alt-link{display:flex;align-items:center;justify-content:center;gap:7px;min-height:47px;border:1px solid #dde2ed;border-radius:14px;color:var(--mjn-blue);font-weight:800;font-size:12px;transition:.18s ease}
.auth-alt-link:hover{background:var(--mjn-blue-soft);border-color:#c8d4ff;transform:translateY(-1px)}
.auth-note{margin:13px 0 0;color:#9296a1;text-align:center;font-size:10px;line-height:1.9}
.form-errors{display:grid;gap:7px;margin-bottom:14px}
.form-errors>div{padding:11px 13px;border-radius:13px;background:#fff3f5;color:#b73149;border:1px solid #f0d1d7;font-size:11px}

/* Generic panels and transaction forms */
.form-panel{overflow:visible}
.full-width,.full{grid-column:1 / -1}
.intermediary-options{gap:14px}
.intermediary-option label,
.intermediary-option-body{
  min-width:0;
}
.intermediary-option label{
  border-radius:18px;
  padding:18px;
}
.intermediary-option-body{display:grid;gap:4px}
.intermediary-option-body strong{color:var(--mjn-ink);font-size:14px}
.intermediary-option-body small{color:var(--mjn-muted);font-size:10px}

/* File pickers should look like controls, not browser defaults */
.attachment-picker,
.file-picker{
  border:1px dashed #cbd3e2!important;
  border-radius:15px!important;
  background:#fbfcff!important;
  color:#596071!important;
  padding:13px 15px!important;
  min-height:50px;
}
.file-picker span[data-file-label],
.attachment-picker span[data-file-label]{
  color:var(--mjn-blue);
  font-weight:700;
}
.file-picker input[type=file]{
  border:0!important;
  padding:0!important;
  min-height:0!important;
  background:transparent!important;
  box-shadow:none!important;
}

/* Better action rows: don't make form buttons collapse awkwardly */
.actions-row,.action-duo,.action-buttons{
  display:flex;
  align-items:center;
  flex-wrap:wrap;
  gap:9px;
}
.actions-row form,.action-duo form{width:auto;flex:0 1 auto}
.actions-row form .btn,.action-duo form .btn{width:auto}

/* Tables on small screens */
.table-wrap{overflow-x:auto;-webkit-overflow-scrolling:touch}
.table-wrap table{width:100%}

/* Mobile: one column, proper widths, no oversized gaps */
@media (max-width:900px){
  .auth-page{padding:18px 12px 32px;align-items:stretch}
  .auth-layout,
  .auth-layout.register-layout{
    grid-template-columns:1fr;
    min-height:0;
    border-radius:24px;
  }
  .auth-visual{
    order:0;
    min-height:230px;
    max-height:320px;
    padding:20px;
  }
  .register-layout .auth-visual{min-height:220px}
  .auth-visual img{width:min(100%,540px);max-height:270px}
  .auth-panel{order:1}
  .auth-panel-inner{padding:30px 22px 34px}
  .auth-brand{margin-bottom:24px}
  .auth-heading h1{font-size:27px}
  .register-grid{grid-template-columns:1fr}
  .form-grid{grid-template-columns:1fr!important}
  .form-grid > label,.form-group,.full-width{grid-column:auto!important}
}

@media (max-width:600px){
  .form-grid input:not([type="hidden"]),
  .form-grid select,
  .form-grid textarea,
  .form-group input:not([type="hidden"]),
  .form-group select,
  .form-group textarea,
  .admin-main input:not([type="hidden"]),
  .admin-main select,
  .admin-main textarea{
    min-height:52px;
    font-size:14px;
    border-radius:14px;
  }
  .form-grid textarea,.form-group textarea,.admin-main textarea{min-height:150px}
  .field-control{min-height:52px}
  .field-control input{font-size:14px}
  .auth-page{padding:10px 8px 24px}
  .auth-layout{border-radius:20px}
  .auth-visual{min-height:190px;max-height:240px;padding:14px}
  .register-layout .auth-visual{min-height:180px}
  .auth-visual img{max-height:205px}
  .auth-panel-inner{padding:24px 16px 26px}
  .auth-heading h1{font-size:24px}
  .auth-heading p{font-size:11px}
  .auth-brand{font-size:19px}
  .auth-submit,.auth-alt-link{min-height:50px}
  .actions-row,.action-duo,.action-buttons{display:grid;grid-template-columns:1fr;width:100%}
  .actions-row form,.action-duo form{width:100%}
  .actions-row .btn,.action-duo .btn,.action-buttons .btn{width:100%!important}
  .intermediary-options{grid-template-columns:1fr!important}
  .panel{border-radius:18px!important}
  .panel-head{align-items:flex-start;flex-direction:column}
}

@media (prefers-reduced-motion:reduce){
  .form-grid input,.form-grid select,.form-grid textarea,.form-group input,.form-group select,.form-group textarea,.field-control,.auth-alt-link{transition:none!important}
}
