:root{
  --color-primary:#401f19;
  --color-primary-400:#af8a65;
  --color-secondary:#dbc1ac;
  --color-background:#f5f0eb;
  --color-text-main:#b88e6f;
  --shadow-soft:0 4px 20px rgba(0,0,0,0.1);
}

*{box-sizing:border-box}
body{font-family:system-ui,Arial,sans-serif;background:var(--color-background);margin:0;color:#333}
.admin-header{position:sticky;top:0;background:rgba(255,255,255,0.8);backdrop-filter:blur(6px);box-shadow:0 2px 10px rgba(0,0,0,0.06);z-index:10}
.admin-header-inner{max-width:1100px;margin:0 auto;display:flex;align-items:center;gap:12px;padding:12px 16px}
.admin-logo{height:40px}
.admin-header h1{color:var(--color-text-main);font-weight:700;margin:0}

.container{max-width:1100px;margin:20px auto;background:#fff;padding:20px;border-radius:16px;box-shadow:var(--shadow-soft)}
.hidden{display:none}

.tabs{display:flex;gap:8px;margin-bottom:16px}
.tabs button{padding:8px 12px;border:1px solid #ddd;background:#fff;color:#333;border-radius:10px;cursor:pointer}
.tabs button.active{background:var(--color-secondary);color:#333;border-color:#cdb19a}

.form{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-bottom:16px}
.form input,.form label{padding:8px;border:1px solid #ddd;border-radius:10px;background:#fff}
.form label{display:flex;align-items:center;gap:8px}
.form button{grid-column:span 3;padding:10px;background:var(--color-primary);color:#fff;border:none;border-radius:12px;box-shadow:var(--shadow-soft);cursor:pointer}

.list{display:flex;flex-direction:column;gap:8px}
.row{border:1px solid #e5e5e5;border-radius:12px;padding:12px;display:flex;align-items:center;justify-content:space-between;background:#fff;box-shadow:var(--shadow-soft)}
.row-title{color:var(--color-text-main);font-weight:600}
.row-actions{display:flex;gap:8px}
.btn{padding:8px 12px;border:none;border-radius:10px;cursor:pointer}
.btn{transition:background-color .2s ease, transform .08s ease}
.btn-primary{background:var(--color-primary);color:#fff}
.btn-primary:hover{background:var(--color-primary-400)}
.btn-secondary{background:#ececec;color:#333}
.btn-secondary:hover{background:#dfdfdf}
.btn-danger{background:#b00020;color:#fff}
.btn-danger:hover{filter:brightness(0.92)}

#auth{align-items:center;margin-bottom:16px}
#auth input{padding:8px;border:1px solid #ddd;border-radius:10px}
#auth button{padding:8px 12px;background:var(--color-primary);color:#fff;border:none;border-radius:10px}
#loginStatus{color:#b00020}

/* Modal */
.modal{position:fixed;inset:0;display:flex;align-items:center;justify-content:center}
.modal.hidden{display:none !important}
.modal-backdrop{position:absolute;inset:0;background:rgba(0,0,0,0.3)}
.modal-content{position:relative;background:#fff;border-radius:16px;max-width:900px;width:90%;padding:16px;box-shadow:var(--shadow-soft);z-index:2}
.modal-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:12px}
.modal-header h3{color:var(--color-text-main);margin:0}
.modal-form{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.modal-form input, .modal-form textarea, .modal-form label{padding:8px;border:1px solid #ddd;border-radius:10px}
.modal-form textarea{min-height:80px;resize:vertical}
.modal-actions{display:flex;justify-content:flex-end;margin-top:12px;gap:8px}
