/* LeadPfad SocialHub Lite – Basisdesign */
* { box-sizing: border-box; }
body { margin: 0; font-family: Arial, sans-serif; background: #EAF5F8; color: #023144; line-height: 1.55; }
header { background: #023144; color: white; padding: 26px max(24px, calc((100vw - 1180px) / 2)); }
header h1 { color: white; margin: 0 0 8px; }
header p { margin: 0; opacity: .92; }
main { max-width: 1180px; margin: 28px auto; background: white; padding: 28px; border-radius: 14px; box-shadow: 0 8px 24px rgba(2,49,68,.12); }
footer { max-width: 1180px; margin: 0 auto 30px; color: #42636f; font-size: 13px; padding: 0 10px; }
h1, h2, h3 { color: #023144; }
a { color: #1E607A; font-weight: bold; text-decoration: none; }
a:hover { text-decoration: underline; }
.nav { display: flex; flex-wrap: wrap; gap: 8px; max-width: 1180px; margin: 18px auto 0; padding: 0 10px; }
.nav a, .button-link, button, input[type=submit] { display: inline-block; background: #023144; color: white; border: 0; padding: 10px 14px; border-radius: 8px; font-weight: 700; cursor: pointer; text-decoration: none; }
.nav a:hover, .button-link:hover, button:hover, input[type=submit]:hover { background: #1E607A; text-decoration: none; }
.notice { background: #D0E7F3; border-left: 5px solid #1E607A; padding: 16px; margin: 18px 0; border-radius: 8px; }
.warning { background: #fff5d7; border-left: 5px solid #b77a00; padding: 16px; margin: 18px 0; border-radius: 8px; }
.grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(230px, 1fr)); gap: 14px; }
.card { border: 1px solid #d8e8ee; border-radius: 12px; padding: 16px; background: #fbfdfe; }
.card h3 { margin-top: 0; }
form { margin: 18px 0; }
label { display: block; font-weight: 700; margin-top: 12px; }
input, select, textarea { width: 100%; padding: 10px; border: 1px solid #b6cbd3; border-radius: 8px; font: inherit; background: white; }
textarea { min-height: 110px; resize: vertical; }
.form-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)); gap: 12px 18px; }
table { width: 100%; border-collapse: collapse; margin-top: 16px; overflow-x: auto; }
th, td { text-align: left; border-bottom: 1px solid #dbe9ef; padding: 10px; vertical-align: top; }
th { background: #EAF5F8; }
.badge { display: inline-block; border-radius: 999px; padding: 4px 9px; background: #dfeef3; font-size: 12px; font-weight: 700; }
.badge.good { background: #d7f5e7; color: #0d5d37; }
.badge.bad { background: #ffe0e0; color: #8a1b1b; }
.badge.wait { background: #fff1c8; color: #775000; }
.copybox { width: 100%; min-height: 180px; font-family: Consolas, monospace; }
.customer-switch { background: #f5fbfd; padding: 12px; border-radius: 10px; margin-bottom: 18px; }
.customer-switch a { margin-left: 10px; }
.small { color: #5f7480; font-size: 13px; }
