/* =====================================================
   ERP GGN — Settings Styles
   File: css/settings.css
   ===================================================== */

.st-section{
  background:#fff; border-radius:16px;
  padding:16px; margin-bottom:14px;
  box-shadow:0 3px 12px rgba(10,37,64,.07);
  border:1px solid rgba(10,37,64,.04);
}
.st-section-title{
  font-size:13px; font-weight:800; color:#0A2540;
  text-transform:uppercase; letter-spacing:.6px;
  display:flex; align-items:center; gap:8px;
  margin-bottom:16px;
  padding-bottom:12px;
  border-bottom:1px solid #F1F5F9;
}
.st-icon{ font-size:18px; }

/* Field */
.st-field{ margin-bottom:14px; }
.st-field:last-child{ margin-bottom:0; }

.st-label{
  display:block; font-size:11.5px; font-weight:700;
  color:#0A2540; text-transform:uppercase; letter-spacing:.5px;
  margin-bottom:6px;
}
.st-input{
  width:100%; padding:11px 14px;
  border:1.5px solid #E2E8F0; border-radius:11px;
  font-size:13.5px; font-family:inherit;
  color:#0A2540; background:#F8FAFC; outline:none;
  transition:border-color .2s, background .2s, box-shadow .2s;
  box-sizing:border-box;
  resize:vertical;
}
.st-input:focus{
  border-color:#3E7CB1; background:#fff;
  box-shadow:0 0 0 4px rgba(62,124,177,.12);
}
.st-input[readonly]{
  background:#F1F5F9; color:#64748B; cursor:not-allowed;
}

.st-hint{
  font-size:10.5px; color:#94A3B8;
  margin-top:4px; font-style:italic;
  line-height:1.4;
}

.st-row-2{
  display:grid; grid-template-columns:1fr 1fr; gap:12px;
}

/* Logo */
.st-logo-wrap{
  display:flex; align-items:center; gap:16px;
  padding:12px;
  background:#F8FAFC;
  border:1.5px dashed #CBD5E1;
  border-radius:12px;
}
.st-logo-preview{
  width:80px; height:80px; border-radius:14px;
  background:#fff;
  display:flex; align-items:center; justify-content:center;
  overflow:hidden;
  flex-shrink:0;
  box-shadow:0 3px 10px rgba(10,37,64,.08);
  border:1px solid #E2E8F0;
}
.st-logo-preview img{
  max-width:100%; max-height:100%; object-fit:contain;
}
.st-logo-placeholder{
  width:100%; height:100%;
  background:linear-gradient(135deg,#C9A227,#E8B33D);
  display:flex; align-items:center; justify-content:center;
  font-size:24px; font-weight:900; color:#0A2540;
  letter-spacing:-1px;
}
.st-logo-actions{
  flex:1; min-width:0;
  display:flex; flex-direction:column; gap:8px;
  align-items:flex-start;
}
.st-btn-upload{
  padding:8px 14px; border:1.5px solid #3E7CB1; border-radius:9px;
  background:#fff; color:#3E7CB1;
  font-size:12px; font-weight:700; cursor:pointer;
  font-family:inherit;
  display:inline-flex; align-items:center; gap:6px;
  transition:all .15s;
}
.st-btn-upload:hover{ background:#F0F9FF; }
.st-btn-upload svg{
  width:14px; height:14px;
  stroke:currentColor; fill:none;
  stroke-width:2.2; stroke-linecap:round; stroke-linejoin:round;
}
.st-btn-remove{
  padding:6px 12px;
  border:1.5px solid #FECACA; border-radius:8px;
  background:#fff; color:#991B1B;
  font-size:11px; font-weight:700; cursor:pointer;
  font-family:inherit;
  transition:background .15s;
}
.st-btn-remove:hover{ background:#FEF2F2; }

/* Info rows */
.st-info-row{
  display:flex; align-items:center; justify-content:space-between;
  padding:10px 0;
  border-bottom:1px solid #F8FAFC;
}
.st-info-row:last-of-type{ border-bottom:none; }
.st-info-lbl{
  font-size:11.5px; color:#64748B; font-weight:600;
  text-transform:uppercase; letter-spacing:.4px;
}
.st-info-val{
  font-size:13px; color:#0A2540; font-weight:700;
  text-align:right; word-break:break-word;
}

/* Buttons */
.st-btn-primary{
  width:100%; padding:15px 20px;
  border:none; border-radius:14px;
  background:linear-gradient(135deg,#C9A227,#E8B33D);
  color:#0A2540; font-size:14.5px; font-weight:800;
  cursor:pointer; font-family:inherit;
  display:flex; align-items:center; justify-content:center; gap:10px;
  box-shadow:0 6px 20px rgba(201,162,39,.35);
  transition:transform .15s, box-shadow .2s;
  letter-spacing:.3px;
  margin-top:8px;
}
.st-btn-primary:hover{
  transform:translateY(-1px);
  box-shadow:0 8px 24px rgba(201,162,39,.5);
}
.st-btn-primary:active{ transform:translateY(1px); }
.st-btn-primary svg{
  width:18px; height:18px;
  stroke:currentColor; fill:none;
  stroke-width:2.4; stroke-linecap:round; stroke-linejoin:round;
}

.st-btn-secondary{
  width:100%; padding:12px 16px;
  border:1.5px solid #E2E8F0; border-radius:12px;
  background:#fff; color:#0A2540;
  font-size:13px; font-weight:700;
  cursor:pointer; font-family:inherit;
  display:flex; align-items:center; justify-content:center; gap:8px;
  transition:all .15s;
}
.st-btn-secondary:hover{
  border-color:#3E7CB1; background:#F0F9FF; color:#1B4B7E;
}
.st-btn-secondary svg{
  width:15px; height:15px;
  stroke:currentColor; fill:none;
  stroke-width:2.2; stroke-linecap:round; stroke-linejoin:round;
}

/* Responsive */
@media (max-width:480px){
  .st-row-2{ grid-template-columns:1fr; }
  .st-logo-wrap{ flex-direction:column; align-items:flex-start; }
}