/* assets/css/style.css - responsive dark theme */
*{box-sizing:border-box}
body.dark{margin:0;font-family:Inter,Arial,sans-serif;background:#0f0f10;color:#fff;-webkit-font-smoothing:antialiased}
header{background:#111;padding:12px 10px;position:sticky;top:0;z-index:10;border-bottom:1px solid #1f1f1f}
header h1{margin:0;font-size:18px;color:#f6b000;text-align:center}
.logout{position:absolute;right:10px;top:14px;color:#ff6b6b;text-decoration:none;font-size:13px}

.container{max-width:980px;margin:0 auto;padding:12px}
.card{background:#141414;padding:16px;border-radius:12px;margin:14px auto;box-shadow:0 6px 20px rgba(0,0,0,0.5)}
.login-container{max-width:380px;margin:60px auto;padding:18px;border-radius:10px}
input,textarea,button,select{width:100%;padding:12px;border-radius:10px;border:none;background:#222;color:#eee;margin:8px 0;font-size:15px}
textarea{min-height:80px}
button{background:#f6b000;color:#111;font-weight:700;cursor:pointer;border:none}
button[style*="background:#d9534f"]{background:#d9534f;color:#fff}
.small{font-size:13px;color:#bfbfbf}
.hrule{height:1px;background:#262626;margin:12px 0;border-radius:2px}
.section-title{color:#f6b000;font-weight:700;margin-top:12px;font-size:16px}
.list{color:#ddd;margin-left:18px}
.logo{max-width:120px;margin-bottom:10px;border-radius:8px}

table{width:100%;border-collapse:collapse;margin-top:12px}
.table-responsive{overflow:auto}
th,td{padding:8px;border-bottom:1px solid #202020;text-align:left;font-size:13px}
th{background:#121212;color:#ddd;position:sticky;top:0}
.small-input{padding:8px;font-size:13px;background:#111;border-radius:6px;color:#ddd;border:1px solid #222}

/* Buttons */
.export-btn{display:inline-block;padding:8px 12px;background:#28a745;color:#fff;border-radius:8px;text-decoration:none}
.link{color:#f6b000;text-decoration:underline;display:block;margin-top:8px}

/* Modal styles */
#refModal{display:none;position:fixed;inset:0;background:rgba(0,0,0,0.6);z-index:999;padding:20px}
#refModal .box{max-width:920px;margin:40px auto;background:#111;padding:18px;border-radius:10px}

/* Responsive */
@media (max-width:768px){
  header h1{font-size:16px}
  .card{padding:14px;border-radius:10px}
  input,textarea,button{padding:12px;font-size:15px}
  th,td{font-size:13px;padding:8px}
}
@media (max-width:420px){
  header h1{font-size:15px}
  .logo{max-width:100px}
  .small-input{font-size:12px}
  .export-btn{font-size:13px;padding:8px}
}