:root {
  --radius:16px;
  --border:#000;
  --muted:#f6f7fb;
  --primary:#2e7dff;
}
.fardaco-container { margin:20px; font-family:inherit; }
.fardaco-header { display:flex; align-items:center; justify-content:space-between; margin-bottom:12px; }
.fardaco-user-menu{ position:relative; }
.fardaco-user-menu .toggle{ display:flex; align-items:center; gap:6px; cursor:pointer; }
.fardaco-user-menu .toggle img{ width:20px;height:20px;border-radius:50%; }
.fardaco-user-menu .dropdown{ position:absolute; top:28px; left:0; background:#fff; border:1px solid #ddd; border-radius:8px; min-width:160px; display:none; box-shadow:0 4px 14px rgba(0,0,0,.08); }
.fardaco-user-menu:hover .dropdown{ display:block; }
.fardaco-user-menu .dropdown a{ display:block; padding:8px 12px; color:#111; text-decoration:none; }
.fardaco-user-menu .dropdown a:hover{ background:#f4f4f4; }

.fardaco-panel{ display:flex; gap:20px; }
.fardaco-sidebar{ width:240px; border:1px solid var(--border); border-radius:var(--radius); padding:14px; background:#fff; display:flex; flex-direction:column; gap:8px; }
.fardaco-sidebar a{ display:block; padding:10px 12px; border-radius:10px; text-decoration:none; color:#111; border:1px solid transparent; }
.fardaco-sidebar a.active, .fardaco-sidebar a:hover{ border-color:#ddd; background:var(--muted); }

.fardaco-content{ flex:1; border:1px solid #ddd; border-radius:var(--radius); background:#fff; padding:16px; min-height:300px; }

.fardaco-table{ width:100%; border-collapse:separate; border-spacing:0; }
.fardaco-table th, .fardaco-table td{ padding:10px; border-bottom:1px solid #eee; text-align:right; }

.fardaco-auth label{ display:block; margin-top:10px; }
.fardaco-auth input{ width:100%; padding:10px; border:1px solid #ddd; border-radius:10px; }
.fardaco-auth .inline{ display:flex; align-items:center; gap:6px; margin:8px 0; }
.fardaco-auth button{ margin-top:12px; padding:10px 16px; border-radius:10px; background:var(--primary); color:#fff; border:0; cursor:pointer; }

#fardaco-account-form label{ display:block; margin-top:10px; }
#fardaco-account-form input{ width:100%; padding:10px; border:1px solid #ddd; border-radius:10px; }
#fardaco-account-form button{ margin-top:12px; padding:10px 16px; border-radius:10px; background:var(--primary); color:#fff; border:0; cursor:pointer; }
.fardaco-response{ margin-top:8px; }

#fardaco-order-wizard .steps{ display:flex; gap:10px; margin-bottom:10px; flex-wrap:wrap; }
#fardaco-order-wizard .step{ background:#f1f3f8; border:1px solid #e5e7ef; padding:6px 10px; border-radius:10px; }
.svc-list{ display:grid; grid-template-columns:repeat(2,1fr); gap:12px; }
.svc-card{ border:1px solid #e8e8e8; border-radius:12px; padding:12px; background:#fff; }
.svc-card .price{ font-weight:600; margin:6px 0; }
.btn{ display:inline-block; padding:8px 12px; border:1px solid #ddd; border-radius:10px; background:#fafafa; cursor:pointer; text-decoration:none; }
.btn.primary{ background:var(--primary); color:#fff; border-color:var(--primary); }
.btn.small{ padding:6px 10px; }
.wizard-actions{ display:flex; gap:8px; margin-top:12px; }
.contract-box{ padding:12px; border:1px solid #eee; border-radius:12px; background:#fcfcfc; }

@media (max-width: 900px){
  .svc-list{ grid-template-columns:1fr; }
}
@media (max-width: 780px){
  .fardaco-panel{ flex-direction:column; }
  .fardaco-sidebar{ width:100%; order:2; }
  .fardaco-content{ order:1; }
}
