:root{
--border:#dbe4ef;
--surface:#fff;
--bg:#f4f7fb;
--text:#152033;
--muted:#607089;
--brand:#1f6ed4;
--brand-2:#1858aa;
--shadow:0 10px 26px rgba(15,31,56,.08);
--radius:20px
}

*{box-sizing:border-box}

body{
margin:0;
background:var(--bg);
color:var(--text);
font-family:system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,Cantarell,Noto Sans,sans-serif
}

a{text-decoration:none;color:var(--brand)}
a:hover{color:var(--brand-2)}

.admin-shell{
max-width:96vw;
margin:24px auto;
padding:24px;
background:#fff;
border:1px solid var(--border);
border-radius:var(--radius);
box-shadow:var(--shadow)
}

.admin-topbar{
display:flex;
flex-wrap:wrap;
justify-content:space-between;
align-items:center;
gap:12px;
margin-bottom:18px
}

.admin-topbar h1{
margin:0;
letter-spacing:-.03em
}

.admin-actions,.toolbar{
display:flex;
flex-wrap:wrap;
gap:10px;
align-items:center
}

.toolbar{
margin-bottom:14px
}

.btn,button{
display:inline-flex;
align-items:center;
justify-content:center;
gap:8px;
min-height:42px;
padding:0 14px;
border:1px solid var(--border);
border-radius:14px;
background:#fff;
color:var(--text);
font:inherit;
font-weight:700;
cursor:pointer
}

.btn-primary,button{
background:linear-gradient(180deg,var(--brand),var(--brand-2));
color:#fff;
border-color:transparent
}

.btn-secondary{
background:#fff
}

.small{
min-height:38px;
padding:0 12px
}

.admin-grid{
display:grid;
grid-template-columns:repeat(auto-fit,minmax(230px,1fr));
gap:14px
}

.admin-card{
padding:18px;
border:1px solid var(--border);
border-radius:18px;
background:#fff;
box-shadow:0 4px 16px rgba(15,31,56,.06)
}

.admin-card p{
color:var(--muted)
}

.notice{
background:#edf6ff;
border:1px solid rgba(31,110,212,.2);
padding:12px 14px;
border-radius:14px;
margin:10px 0 16px;
color:#20497e
}

.table-wrap{
overflow:auto;
border:1px solid var(--border);
border-radius:18px
}

.admin-table{
width:100%;
min-width:1500px;
border-collapse:collapse;
background:#fff
}

.admin-table th,
.admin-table td{
padding:12px;
border-bottom:1px solid #edf2f7;
vertical-align:top;
text-align:left
}

.admin-table th{
background:#f8fbff;
color:#4b5f78;
font-size:.92rem;
position:sticky;
top:0;
z-index:1
}

.admin-table tr:last-child td{
border-bottom:0
}

.admin-table td:nth-child(1){min-width:150px}
.admin-table td:nth-child(2){min-width:180px}
.admin-table td:nth-child(3){min-width:170px}
.admin-table td:nth-child(4){min-width:150px}
.admin-table td:nth-child(5){min-width:260px}
.admin-table td:nth-child(6){min-width:330px}
.admin-table td:nth-child(7){min-width:160px}

.admin-table tr.edit-row{
background:#fff8e6
}

input[type=text],
input[type=url],
input[type=tel],
input[type=date],
input[type=datetime-local],
textarea{
width:100%;
padding:12px 14px;
border:1px solid var(--border);
border-radius:14px;
font:inherit
}

textarea{
min-height:88px;
resize:vertical
}

.actions{
white-space:nowrap
}

.admin-note{
margin:12px 0 0;
color:var(--muted)
}

/* Smartphone ohne horizontales Scrollen */
@media (max-width:640px){

body{
background:#fff
}

.admin-shell{
max-width:100%;
margin:0;
padding:14px;
border:0;
border-radius:0;
box-shadow:none
}

.admin-topbar{
align-items:flex-start
}

.admin-topbar h1{
font-size:1.45rem
}

.admin-actions{
width:100%;
gap:8px
}

.admin-actions .btn,
.admin-actions button{
flex:1;
min-height:40px;
padding:0 10px;
font-size:.9rem
}

.table-wrap{
border:none;
overflow:visible
}

.admin-table{
width:100%;
min-width:100%;
display:block
}

.admin-table thead{
display:none
}

.admin-table,
.admin-table tbody,
.admin-table tr,
.admin-table td{
display:block;
width:100%
}

.admin-table tr{
background:#fff;
border:1px solid var(--border);
border-radius:14px;
padding:12px;
margin-bottom:14px
}

.admin-table td{
border:none;
padding:6px 0;
min-width:auto !important
}

.admin-table td.actions{
display:flex;
gap:8px;
margin-top:10px
}

.admin-table td.actions .btn,
.admin-table td.actions button{
flex:1
}

input[type=text],
input[type=url],
input[type=tel],
input[type=date],
input[type=datetime-local],
textarea{
padding:9px;
font-size:.85rem;
border-radius:10px
}

textarea{
min-height:70px
}

input[type=file]{
max-width:210px;
font-size:.78rem
}

.small{
min-height:34px;
padding:0 9px;
font-size:.82rem
}

}