/* _content/MobilioPortal/Pages/Benutzermanager.razor.rz.scp.css */
.um-page[b-ty2esn3ap3] {
--stroke: rgba(255,255,255,.10);
--stroke2: rgba(255,255,255,.16);
--text: #fff;
--dim: #cfd8e3;
--accent: #ECEFCA;
min-height: calc(100vh - 24px);
padding: 18px;
color: var(--text);
border-radius: 18px;
background: radial-gradient(1100px 520px at 15% -10%, rgba(107,145,171,.9) 0%, transparent 60%), radial-gradient(900px 420px at 90% -20%, rgba(61,95,120,.75) 0%, transparent 60%), linear-gradient(180deg, #5e86a3 0%, #3b5b72 50%, #243a4f 100%);
}
.um-header[b-ty2esn3ap3] {
display: flex;
align-items: flex-end;
justify-content: space-between;
gap: 16px;
margin-bottom: 14px;
padding: 14px 14px 12px;
background: linear-gradient(180deg, rgba(25,37,53,.95), rgba(25,37,53,.78));
border: 1px solid var(--stroke);
border-radius: 16px;
box-shadow: 0 12px 40px rgba(0,0,0,.35), inset 0 1px 0 rgba(255,255,255,.03);
}
.um-title h1[b-ty2esn3ap3] {
margin: 0;
font-size: 22px;
}
.um-sub[b-ty2esn3ap3] {
margin-top: 4px;
font-size: 12px;
color: var(--dim);
font-weight: 600;
}
.um-actions[b-ty2esn3ap3] {
display: flex;
flex-wrap: wrap;
gap: 10px;
justify-content: flex-end;
}
.um-btn[b-ty2esn3ap3] {
appearance: none;
border: 1px solid var(--stroke);
background: rgba(23,42,65,.80);
color: var(--text);
padding: 9px 12px;
border-radius: 12px;
cursor: pointer;
font-weight: 850;
font-size: 13px;
transition: transform .12s ease, filter .12s ease, border-color .12s ease;
}
.um-btn:hover[b-ty2esn3ap3] {
transform: translateY(-1px);
border-color: var(--stroke2);
filter: brightness(1.03);
}
.um-btn:active[b-ty2esn3ap3] {
transform: translateY(0);
}
.um-btn-primary[b-ty2esn3ap3] {
border-color: rgba(236,239,202,.45);
background: linear-gradient(180deg, rgba(236,239,202,.95), rgba(236,239,202,.72));
color: #213448;
}
.um-btn-toggle[b-ty2esn3ap3] {
border-color: rgba(255,255,255,.18);
background: rgba(23,42,65,.65);
}
.um-grid[b-ty2esn3ap3] {
display: grid;
grid-template-columns: 1.2fr .8fr;
gap: 14px;
align-items: start;
}
@media (max-width: 1100px) {
.um-grid[b-ty2esn3ap3] {
grid-template-columns: 1fr;
}
}
.um-card[b-ty2esn3ap3] {
background: linear-gradient(180deg, rgba(25,37,53,.92), rgba(25,37,53,.78));
border: 1px solid var(--stroke);
border-radius: 16px;
box-shadow: 0 12px 40px rgba(0,0,0,.35), inset 0 1px 0 rgba(255,255,255,.03);
overflow: hidden;
}
.um-card-head[b-ty2esn3ap3] {
display: flex;
align-items: center;
justify-content: space-between;
gap: 12px;
padding: 14px 14px 10px;
border-bottom: 1px solid var(--stroke);
}
.um-card-left[b-ty2esn3ap3] {
display: flex;
align-items: center;
gap: 10px;
}
.um-card-head h2[b-ty2esn3ap3] {
margin: 0;
font-size: 15px;
color: var(--dim);
letter-spacing: .02em;
}
.um-chip[b-ty2esn3ap3] {
font-size: 12px;
padding: 6px 10px;
border-radius: 999px;
border: 1px solid rgba(255,255,255,.12);
background: rgba(23,42,65,.65);
color: var(--dim);
font-weight: 800;
}
.um-form-actions[b-ty2esn3ap3] {
display: flex;
gap: 10px;
flex-wrap: wrap;
justify-content: flex-end;
}
.um-back[b-ty2esn3ap3] {
display: none;
}
/* Desktop: hide */
.um-search[b-ty2esn3ap3] {
display: flex;
align-items: center;
gap: 10px;
background: rgba(30,46,68,.80);
border: 1px solid rgba(255,255,255,.10);
border-radius: 12px;
padding: 8px 10px;
min-width: 360px;
}
@media (max-width: 900px) {
.um-search[b-ty2esn3ap3] {
min-width: 100%;
}
}
.um-search-ico[b-ty2esn3ap3] {
opacity: .85;
}
.um-input[b-ty2esn3ap3] {
width: 100%;
min-width: 0;
border: 0;
outline: none;
background: transparent;
color: var(--text);
font-weight: 700;
}
.um-input[b-ty2esn3ap3]::placeholder {
color: rgba(207,216,227,.55);
}
/* Desktop table */
.um-table-wrap[b-ty2esn3ap3] {
padding: 10px 12px 12px;
overflow: auto;
max-height: 70vh;
}
.um-table[b-ty2esn3ap3] {
width: 100%;
border-collapse: collapse;
font-size: 13px;
min-width: 820px;
}
.um-table thead th[b-ty2esn3ap3] {
position: sticky;
top: 0;
background: rgba(34,52,75,.96);
color: var(--text);
padding: 10px 10px;
text-align: left;
border-bottom: 1px solid rgba(255,255,255,.12);
z-index: 1;
font-weight: 950;
}
.um-table tbody td[b-ty2esn3ap3] {
padding: 10px 10px;
border-bottom: 1px dashed rgba(255,255,255,.12);
color: rgba(233,243,251,.95);
}
.um-table tbody tr:nth-child(even)[b-ty2esn3ap3] {
background: rgba(255,255,255,.03);
}
.um-table tbody tr:hover[b-ty2esn3ap3] {
background: rgba(236,239,202,.10);
cursor: pointer;
}
.um-table tbody tr.is-selected[b-ty2esn3ap3] {
outline: 2px solid rgba(236,239,202,.28);
outline-offset: -2px;
background: rgba(236,239,202,.12);
}
.um-row-actions[b-ty2esn3ap3] {
display: flex;
gap: 8px;
justify-content: center;
}
.um-iconbtn[b-ty2esn3ap3] {
width: 34px;
height: 32px;
border-radius: 10px;
border: 1px solid rgba(255,255,255,.14);
background: rgba(23,42,65,.70);
color: var(--text);
cursor: pointer;
font-weight: 900;
transition: transform .12s ease, filter .12s ease;
}
.um-iconbtn:hover[b-ty2esn3ap3] {
transform: translateY(-1px);
filter: brightness(1.05);
}
.um-iconbtn:active[b-ty2esn3ap3] {
transform: translateY(0);
}
.um-empty[b-ty2esn3ap3] {
padding: 16px 10px;
color: rgba(207,216,227,.90);
}
.um-footer[b-ty2esn3ap3] {
padding: 10px 14px 14px;
font-size: 12px;
color: rgba(207,216,227,.92);
border-top: 1px solid rgba(255,255,255,.10);
}
/* Form */
.um-form[b-ty2esn3ap3] {
display: grid;
grid-template-columns: 1fr 1fr;
gap: 14px;
padding: 14px;
}
@media (max-width: 900px) {
.um-form[b-ty2esn3ap3] {
grid-template-columns: 1fr;
}
}
.um-col[b-ty2esn3ap3] {
display: flex;
flex-direction: column;
gap: 10px;
}
.um-label[b-ty2esn3ap3] {
font-size: 12px;
color: var(--text);
font-weight: 900;
margin-top: 2px;
}
.um-input2[b-ty2esn3ap3] {
width: 100%;
min-width: 0;
height: 38px;
border-radius: 12px;
border: 1px solid rgba(255,255,255,.10);
background: rgba(30,46,68,.90);
color: var(--text);
padding: 0 12px;
outline: none;
transition: border-color .12s ease, box-shadow .12s ease;
}
.um-input2:focus[b-ty2esn3ap3] {
border-color: rgba(236,239,202,.60);
box-shadow: 0 0 0 3px rgba(236,239,202,.12);
}
.um-checkrow[b-ty2esn3ap3] {
display: flex;
flex-wrap: wrap;
gap: 10px;
margin-top: 6px;
}
.um-check[b-ty2esn3ap3] {
display: flex;
align-items: center;
gap: 10px;
padding: 8px 10px;
border-radius: 12px;
border: 1px solid rgba(255,255,255,.10);
background: rgba(23,42,65,.55);
color: var(--text);
font-weight: 800;
white-space: nowrap;
user-select: none;
}
.um-check input[type="checkbox"][b-ty2esn3ap3] {
width: 16px;
height: 16px;
accent-color: #aab48a;
}
.um-note[b-ty2esn3ap3] {
font-size: 11px;
color: rgba(207,216,227,.90);
line-height: 1.35;
}
/* --------------------------- */
/* MOBILE MASTER/DETAIL + LIST */
/* --------------------------- */
.um-list-desktop[b-ty2esn3ap3] {
display: block;
}
.um-list-mobile[b-ty2esn3ap3] {
display: none;
padding: 10px 12px 12px;
}
.um-mrow[b-ty2esn3ap3] {
width: 100%;
text-align: left;
border: 1px solid rgba(255,255,255,.10);
background: rgba(30,46,68,.75);
color: #fff;
padding: 12px;
border-radius: 12px;
margin-bottom: 10px;
cursor: pointer;
}
.um-mrow.is-selected[b-ty2esn3ap3] {
outline: 2px solid rgba(236,239,202,.28);
outline-offset: -2px;
background: rgba(236,239,202,.12);
}
.um-mname[b-ty2esn3ap3] {
font-weight: 950;
}
.um-msub[b-ty2esn3ap3] {
font-size: 12px;
opacity: .85;
margin-top: 4px;
}
.um-empty-mobile[b-ty2esn3ap3] {
padding: 14px 2px;
color: rgba(207,216,227,.90);
}
@media (max-width: 1100px) {
/* switch list rendering */
.um-list-desktop[b-ty2esn3ap3] {
display: none;
}
.um-list-mobile[b-ty2esn3ap3] {
display: block;
}
/* master/detail behavior */
.um-detail[b-ty2esn3ap3] {
display: none;
}
.um-detail.um-show-mobile[b-ty2esn3ap3] {
display: block;
}
.um-hide-mobile[b-ty2esn3ap3] {
display: none !important;
}
/* show back button only on mobile */
.um-back[b-ty2esn3ap3] {
display: inline-flex;
}
}
/* _content/MobilioPortal/Pages/Fahrtenplaner.razor.rz.scp.css */
/* =========================================================
Fahrtenplaner – Scoped CSS (Fahrtenplaner.razor.css)
========================================================= */
/* ---------- Page + Design Tokens (scoped!) ---------- */
.fp-page[b-vvwtfk4i22] {
--fp-bg0: #0f172a;
--fp-bg1: #111c2f;
--fp-bg2: #172a41;
--fp-panel: #192535;
--fp-stroke: rgba(255,255,255,.10);
--fp-stroke-2: rgba(255,255,255,.14);
--fp-text: #ffffff;
--fp-dim: #cfd8e3;
--fp-dimmer: rgba(207,216,227,.85);
--fp-accent: #ECEFCA;
--fp-accent-2: rgba(236,239,202,.65);
--fp-danger: #ef4444;
--fp-radius: 16px;
--fp-radius-sm: 12px;
--fp-shadow: 0 12px 40px rgba(0,0,0,.35), inset 0 1px 0 rgba(255,255,255,.03);
min-height: calc(100vh - 24px);
padding: 18px;
color: var(--fp-text);
border-radius: 18px;
background: radial-gradient(1100px 520px at 15% -10%, rgba(107,145,171,.9) 0%, transparent 60%), radial-gradient(900px 420px at 90% -20%, rgba(61,95,120,.75) 0%, transparent 60%), linear-gradient(180deg, #5e86a3 0%, #3b5b72 50%, #243a4f 100%);
}
/* ---------- Header ---------- */
.fp-header[b-vvwtfk4i22] {
display: flex;
align-items: flex-end;
justify-content: space-between;
gap: 16px;
margin-bottom: 14px;
padding: 14px 14px 12px;
background: linear-gradient(180deg, rgba(25,37,53,.95), rgba(25,37,53,.78));
border: 1px solid var(--fp-stroke);
border-radius: var(--fp-radius);
box-shadow: var(--fp-shadow);
}
.fp-title h1[b-vvwtfk4i22] {
margin: 0;
font-size: 22px;
letter-spacing: .2px;
}
.fp-sub[b-vvwtfk4i22] {
margin-top: 4px;
font-size: 12px;
color: var(--fp-dim);
font-weight: 600;
}
/* Actions */
.fp-actions[b-vvwtfk4i22] {
display: flex;
flex-wrap: wrap;
gap: 10px;
justify-content: flex-end;
}
.fp-btn[b-vvwtfk4i22] {
appearance: none;
border: 1px solid var(--fp-stroke);
background: rgba(23,42,65,.80);
color: var(--fp-text);
padding: 9px 12px;
border-radius: 12px;
cursor: pointer;
font-weight: 800;
font-size: 13px;
box-shadow: inset 0 1px 0 rgba(255,255,255,.03);
transition: transform .12s ease, background .12s ease, border-color .12s ease, box-shadow .12s ease, filter .12s ease;
}
.fp-btn:hover[b-vvwtfk4i22] {
transform: translateY(-1px);
border-color: var(--fp-stroke-2);
filter: brightness(1.03);
}
.fp-btn:active[b-vvwtfk4i22] {
transform: translateY(0);
}
.fp-btn-primary[b-vvwtfk4i22] {
border-color: rgba(236,239,202,.45);
background: linear-gradient(180deg, rgba(236,239,202,.95), rgba(236,239,202,.72));
color: #213448;
box-shadow: 0 10px 28px rgba(236,239,202,.22);
}
.fp-btn-danger[b-vvwtfk4i22] {
border-color: rgba(239,68,68,.45);
background: rgba(239,68,68,.14);
color: #ffd6d6;
}
/* ---------- Layout Grid ---------- */
.fp-grid[b-vvwtfk4i22] {
display: grid;
grid-template-columns: 1fr;
gap: 14px;
}
/* Desktop: 2 cards nebeneinander */
@media (min-width: 1100px) {
.fp-grid[b-vvwtfk4i22] {
grid-template-columns: 1.05fr 0.95fr;
align-items: start;
}
}
/* ---------- Cards ---------- */
.fp-card[b-vvwtfk4i22] {
background: linear-gradient(180deg, rgba(25,37,53,.92), rgba(25,37,53,.78));
border: 1px solid var(--fp-stroke);
border-radius: var(--fp-radius);
box-shadow: var(--fp-shadow);
overflow: visible; /* wichtig: Autocomplete darf raus “drop-downen” */
}
.fp-card-head[b-vvwtfk4i22] {
display: flex;
align-items: center;
justify-content: space-between;
gap: 12px;
padding: 14px 14px 10px;
border-bottom: 1px solid var(--fp-stroke);
}
.fp-card-head h2[b-vvwtfk4i22] {
margin: 0;
font-size: 15px;
color: var(--fp-dim);
letter-spacing: .02em;
}
.fp-chip[b-vvwtfk4i22] {
font-size: 12px;
padding: 6px 10px;
border-radius: 999px;
border: 1px solid rgba(255,255,255,.12);
background: rgba(23,42,65,.65);
color: var(--fp-dim);
font-weight: 800;
}
/* ---------- Form ---------- */
.fp-form[b-vvwtfk4i22] {
display: grid;
grid-template-columns: 1fr;
gap: 14px;
padding: 14px;
}
@media (min-width: 760px) {
.fp-form[b-vvwtfk4i22] {
grid-template-columns: 1fr 1fr;
}
}
.fp-col[b-vvwtfk4i22] {
display: flex;
flex-direction: column;
gap: 10px;
}
.fp-label[b-vvwtfk4i22] {
font-size: 12px;
color: var(--fp-text);
font-weight: 900;
margin-top: 2px;
}
/* inputs/selects/textarea */
.fp-input[b-vvwtfk4i22] {
width: 100%;
min-width: 0;
height: 38px;
border-radius: 12px;
border: 1px solid rgba(255,255,255,.10);
background: rgba(30,46,68,.90);
color: var(--fp-text);
padding: 0 12px;
outline: none;
transition: border-color .12s ease, box-shadow .12s ease, filter .12s ease, background .12s ease;
}
.fp-input[b-vvwtfk4i22]::placeholder {
color: rgba(207,216,227,.55);
}
.fp-input:focus[b-vvwtfk4i22] {
border-color: rgba(236,239,202,.60);
box-shadow: 0 0 0 3px rgba(236,239,202,.12);
}
select.fp-input[b-vvwtfk4i22] {
padding-right: 10px;
}
/* ---------- Autocomplete (NEU) ---------- */
.fp-ac[b-vvwtfk4i22] {
position: relative;
}
.fp-ac-list[b-vvwtfk4i22] {
position: absolute;
left: 0;
right: 0;
top: calc(100% + 6px);
background: rgba(15, 23, 42, .98);
border: 1px solid rgba(255,255,255,.12);
border-radius: 12px;
overflow: hidden;
z-index: 50;
box-shadow: 0 16px 40px rgba(0,0,0,.35);
}
.fp-ac-item[b-vvwtfk4i22] {
width: 100%;
text-align: left;
border: 0;
background: transparent;
padding: 10px 12px;
cursor: pointer;
}
.fp-ac-item:hover[b-vvwtfk4i22] {
background: rgba(236,239,202,.10);
}
.fp-ac-name[b-vvwtfk4i22] {
font-weight: 900;
color: #fff;
letter-spacing: .01em;
}
.fp-ac-mail[b-vvwtfk4i22] {
font-size: 12px;
color: rgba(207,216,227,.9);
margin-top: 2px;
}
/* Combos / hints */
.fp-combo .fp-hint[b-vvwtfk4i22] {
margin-top: -6px;
font-size: 11px;
color: var(--fp-dimmer);
}
/* Email row */
.fp-email-row[b-vvwtfk4i22] {
display: grid;
grid-template-columns: 1fr;
gap: 10px;
}
@media (min-width: 520px) {
.fp-email-row[b-vvwtfk4i22] {
grid-template-columns: 1fr auto;
align-items: center;
}
}
.fp-check[b-vvwtfk4i22] {
display: flex;
align-items: center;
gap: 10px;
padding: 8px 10px;
border-radius: 12px;
border: 1px solid rgba(255,255,255,.10);
background: rgba(23,42,65,.55);
color: var(--fp-text);
font-weight: 800;
white-space: nowrap;
user-select: none;
}
.fp-check input[type="checkbox"][b-vvwtfk4i22] {
width: 16px;
height: 16px;
accent-color: #aab48a;
}
.fp-note[b-vvwtfk4i22] {
font-size: 11px;
color: rgba(207,216,227,.90);
line-height: 1.35;
}
/* ---------- Day header ---------- */
.fp-day-head[b-vvwtfk4i22] {
align-items: flex-start;
}
.fp-day-nav[b-vvwtfk4i22] {
display: flex;
align-items: center;
gap: 10px;
}
.fp-day-title[b-vvwtfk4i22] {
margin: 0;
font-size: 16px;
color: var(--fp-text);
font-weight: 950;
}
.fp-day-sub[b-vvwtfk4i22] {
margin-top: 2px;
font-size: 12px;
color: var(--fp-dim);
font-weight: 800;
}
.fp-iconbtn[b-vvwtfk4i22] {
width: 40px;
height: 38px;
border-radius: 12px;
border: 1px solid rgba(255,255,255,.12);
background: rgba(23,42,65,.75);
color: var(--fp-text);
cursor: pointer;
font-weight: 950;
transition: transform .12s ease, filter .12s ease, border-color .12s ease;
}
.fp-iconbtn:hover[b-vvwtfk4i22] {
transform: translateY(-1px);
border-color: rgba(255,255,255,.18);
filter: brightness(1.03);
}
.fp-iconbtn:active[b-vvwtfk4i22] {
transform: translateY(0);
}
/* ---------- Table ---------- */
.fp-table-wrap[b-vvwtfk4i22] {
padding: 10px 12px 12px;
overflow: auto;
max-height: 68vh;
border-top: 0;
}
.fp-table-wrap[b-vvwtfk4i22]::-webkit-scrollbar {
height: 10px;
width: 10px;
}
.fp-table-wrap[b-vvwtfk4i22]::-webkit-scrollbar-thumb {
background: rgba(255,255,255,.12);
border-radius: 999px;
}
.fp-table-wrap[b-vvwtfk4i22]::-webkit-scrollbar-track {
background: rgba(0,0,0,.18);
border-radius: 999px;
}
.fp-table[b-vvwtfk4i22] {
width: 100%;
border-collapse: collapse;
font-size: 13px;
min-width: 840px;
}
.fp-table thead th[b-vvwtfk4i22] {
position: sticky;
top: 0;
background: rgba(34,52,75,.96);
color: var(--fp-text);
padding: 10px 10px;
text-align: left;
border-bottom: 1px solid rgba(255,255,255,.12);
z-index: 1;
font-weight: 950;
letter-spacing: .02em;
}
.fp-table tbody td[b-vvwtfk4i22] {
padding: 10px 10px;
border-bottom: 1px dashed rgba(255,255,255,.12);
color: rgba(233,243,251,.95);
}
.fp-table tbody tr:nth-child(even)[b-vvwtfk4i22] {
background: rgba(255,255,255,.03);
}
.fp-table tbody tr:hover[b-vvwtfk4i22] {
background: rgba(236,239,202,.10);
cursor: pointer;
}
.fp-table tbody tr.is-selected[b-vvwtfk4i22] {
outline: 2px solid rgba(236,239,202,.28);
outline-offset: -2px;
background: rgba(236,239,202,.12);
}
/* ---------- Footer note ---------- */
.fp-footer-note[b-vvwtfk4i22] {
padding: 10px 14px 14px;
font-size: 12px;
color: rgba(207,216,227,.92);
border-top: 1px solid rgba(255,255,255,.10);
}
/* ---------- Responsive tweaks ---------- */
@media (max-width: 900px) {
.fp-header[b-vvwtfk4i22] {
flex-direction: column;
align-items: flex-start;
}
.fp-actions[b-vvwtfk4i22] {
justify-content: flex-start;
}
.fp-table[b-vvwtfk4i22] {
min-width: 760px;
}
}
@media (max-width: 520px) {
.fp-page[b-vvwtfk4i22] {
padding: 12px;
border-radius: 14px;
}
.fp-header[b-vvwtfk4i22] {
padding: 12px;
}
.fp-btn[b-vvwtfk4i22] {
width: 100%;
}
.fp-actions[b-vvwtfk4i22] {
width: 100%;
}
.fp-iconbtn[b-vvwtfk4i22] {
width: 38px;
}
}
/* _content/MobilioPortal/Pages/Fahrzeugmanager.razor.rz.scp.css */
/* =========================
Fahrzeugmanager – NEW CSS
========================= */
.vm-page[b-w6v4yehcr8] {
/* Theme tokens */
--stroke: rgba(255,255,255,.10);
--stroke2: rgba(255,255,255,.07);
--text: rgba(255,255,255,.96);
--dim: rgba(207,216,227,.86);
--bg1: rgba(25,37,53,.92);
--bg2: rgba(25,37,53,.78);
--panel: rgba(34,52,75,.45);
--panel2: rgba(23,42,65,.70);
--shadow: 0 12px 40px rgba(0,0,0,.35), inset 0 1px 0 rgba(255,255,255,.03);
padding: 18px;
color: var(--text);
}
/* ==========
Header
========== */
.vm-header[b-w6v4yehcr8] {
display: flex;
align-items: flex-end;
justify-content: space-between;
gap: 14px;
padding: 14px;
border: 1px solid var(--stroke);
border-radius: 16px;
background: linear-gradient(180deg,var(--bg1),var(--bg2));
box-shadow: var(--shadow);
}
.vm-title[b-w6v4yehcr8] {
min-width: 0;
}
.vm-title h1[b-w6v4yehcr8] {
margin: 0;
font-size: 22px;
letter-spacing: .2px;
}
.vm-sub[b-w6v4yehcr8] {
margin-top: 4px;
font-size: 12px;
color: var(--dim);
font-weight: 800;
}
.vm-actions[b-w6v4yehcr8] {
display: flex;
flex-wrap: wrap;
gap: 10px;
justify-content: flex-end;
}
/* Buttons */
.vm-btn[b-w6v4yehcr8] {
border: 1px solid var(--stroke);
background: rgba(23,42,65,.80);
color: var(--text);
padding: 9px 12px;
border-radius: 12px;
cursor: pointer;
font-weight: 950;
letter-spacing: .1px;
transition: transform .08s ease, filter .12s ease;
}
.vm-btn:active[b-w6v4yehcr8] {
transform: translateY(1px);
}
.vm-btn-primary[b-w6v4yehcr8] {
border-color: rgba(236,239,202,.45);
background: linear-gradient(180deg, rgba(236,239,202,.95), rgba(236,239,202,.72));
color: #213448;
}
.vm-btn-danger[b-w6v4yehcr8] {
border-color: rgba(255,120,120,.35);
background: rgba(120,20,20,.22);
}
.vm-btn-warn[b-w6v4yehcr8] {
border-color: rgba(255,198,0,.28);
background: rgba(255,198,0,.12);
}
.vm-btn:disabled[b-w6v4yehcr8] {
opacity: .35;
filter: grayscale(1);
cursor: not-allowed;
pointer-events: none;
}
/* ==========
Error
========== */
.vm-error[b-w6v4yehcr8] {
margin-top: 10px;
padding: 10px 12px;
border-radius: 14px;
border: 1px solid rgba(255,120,120,.35);
background: rgba(120,20,20,.25);
font-weight: 950;
}
/* ==========
Layout (LIST wider, DETAILS narrower)
========== */
.vm-grid[b-w6v4yehcr8] {
margin-top: 12px;
display: grid;
grid-template-columns: minmax(720px, 2.7fr) minmax(340px, 1fr);
gap: 12px;
align-items: start;
}
/* Cards */
.vm-card[b-w6v4yehcr8] {
border: 1px solid var(--stroke);
border-radius: 16px;
background: linear-gradient(180deg,var(--bg1),var(--bg2));
overflow: hidden;
min-width: 0;
box-shadow: var(--shadow);
}
.vm-cardhead[b-w6v4yehcr8] {
padding: 12px 14px;
border-bottom: 1px solid var(--stroke);
background: rgba(34,52,75,.45);
display: flex;
align-items: center;
justify-content: space-between;
gap: 12px;
min-width: 0;
}
.vm-cardtitle[b-w6v4yehcr8] {
font-weight: 950;
color: rgba(233,243,251,.95);
min-width: 0;
}
.vm-cardsub[b-w6v4yehcr8] {
font-size: 12px;
color: rgba(207,216,227,.85);
font-weight: 850;
}
.vm-dot[b-w6v4yehcr8] {
margin: 0 6px;
opacity: .7;
}
.vm-pill[b-w6v4yehcr8] {
font-size: 12px;
padding: 6px 10px;
border-radius: 999px;
border: 1px solid rgba(255,255,255,.12);
background: rgba(23,42,65,.65);
color: var(--dim);
font-weight: 950;
white-space: nowrap;
}
/* Search */
.vm-search[b-w6v4yehcr8] {
display: flex;
align-items: center;
gap: 8px;
min-width: 320px;
flex: 0 0 auto;
}
.vm-ico[b-w6v4yehcr8] {
opacity: .85;
}
.vm-input[b-w6v4yehcr8] {
width: 100%;
height: 38px;
border-radius: 12px;
border: 1px solid rgba(255,255,255,.10);
background: rgba(30,46,68,.90);
color: var(--text);
padding: 0 12px;
outline: none;
min-width: 0;
}
.vm-input:focus[b-w6v4yehcr8] {
border-color: rgba(236,239,202,.35);
box-shadow: 0 0 0 3px rgba(236,239,202,.10);
}
.vm-textarea[b-w6v4yehcr8] {
height: auto;
padding: 10px 12px;
line-height: 1.25;
resize: vertical;
}
/* ==========
TABLE (Typ breiter, V.-zweck schmaler)
========== */
.vm-tablewrap[b-w6v4yehcr8] {
padding: 10px 12px;
}
.vm-table[b-w6v4yehcr8] {
width: 100%;
border-collapse: collapse;
font-size: 13px;
table-layout: fixed;
}
/* Drag & Drop: keine Textmarkierung im Table-Bereich */
.vm-table[b-w6v4yehcr8],
.vm-table *[b-w6v4yehcr8] {
-webkit-user-select: none;
user-select: none;
}
/* ABER: falls jemals Inputs/Areas in der Tabelle wären -> Text wieder erlauben */
.vm-table input[b-w6v4yehcr8],
.vm-table textarea[b-w6v4yehcr8],
.vm-table select[b-w6v4yehcr8] {
-webkit-user-select: text;
user-select: text;
}
.vm-table th[b-w6v4yehcr8] {
text-align: left;
color: rgba(207,216,227,.92);
font-weight: 950;
padding: 10px 8px;
border-bottom: 1px solid rgba(255,255,255,.10);
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
.vm-table td[b-w6v4yehcr8] {
padding: 10px 8px;
border-bottom: 1px solid rgba(255,255,255,.06);
vertical-align: middle;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.vm-table tr[b-w6v4yehcr8] {
cursor: pointer;
}
.vm-table tr:hover[b-w6v4yehcr8] {
background: rgba(255,255,255,.04);
}
.vm-table tr.is-selected[b-w6v4yehcr8] {
background: rgba(236,239,202,.12);
}
/* Column sizing via nth-child
Reihenfolge: 1 # | 2 Kennzeichen | 3 Typ | 4 Verwendungszweck | 5 Aktionen */
.vm-table th:nth-child(1)[b-w6v4yehcr8],
.vm-table td:nth-child(1)[b-w6v4yehcr8] {
width: 56px;
text-align: center;
}
.vm-table th:nth-child(2)[b-w6v4yehcr8],
.vm-table td:nth-child(2)[b-w6v4yehcr8] {
width: 150px;
}
.vm-table th:nth-child(3)[b-w6v4yehcr8],
.vm-table td:nth-child(3)[b-w6v4yehcr8] {
width: 42%;
}
.vm-table th:nth-child(4)[b-w6v4yehcr8],
.vm-table td:nth-child(4)[b-w6v4yehcr8] {
width: 28%;
}
.vm-table th:nth-child(5)[b-w6v4yehcr8],
.vm-table td:nth-child(5)[b-w6v4yehcr8] {
width: 128px;
text-align: center;
}
/* ==========
Misc elements
========== */
.vm-name[b-w6v4yehcr8] {
font-weight: 950;
display: flex;
align-items: center;
gap: 10px;
min-width: 0;
}
.vm-dim[b-w6v4yehcr8] {
color: rgba(207,216,227,.85);
}
.vm-small[b-w6v4yehcr8] {
font-size: 12px;
}
.vm-center[b-w6v4yehcr8] {
text-align: center;
}
.vm-handle[b-w6v4yehcr8] {
cursor: grab;
touch-action: none;
display: inline-flex;
align-items: center;
justify-content: center;
width: 22px;
height: 22px;
border-radius: 8px;
background: rgba(255,255,255,.06);
border: 1px solid rgba(255,255,255,.10);
}
/* während drag */
.vm-row.is-dragging .vm-handle[b-w6v4yehcr8] {
cursor: grabbing;
}
.vm-row.is-dragging[b-w6v4yehcr8] {
opacity: .6;
}
/* Drop-Ziel hervorheben */
.vm-row.is-drop-target[b-w6v4yehcr8] {
outline: 2px dashed rgba(236,239,202,.45);
outline-offset: -4px;
}
/* Sold badge */
.vm-sold[b-w6v4yehcr8] {
font-size: 12px;
padding: 3px 8px;
border-radius: 999px;
border: 1px solid rgba(255,90,90,.35);
background: rgba(180,30,30,.16);
color: rgba(255,210,210,.95);
font-weight: 950;
animation: vmblink-b-w6v4yehcr8 1.2s infinite ease-in-out;
}
@keyframes vmblink-b-w6v4yehcr8 {
0%, 100% {
opacity: 1;
}
50% {
opacity: .35;
}
}
/* mini buttons in table */
.vm-mini[b-w6v4yehcr8] {
border: 1px solid rgba(255,255,255,.12);
background: rgba(23,42,65,.70);
color: rgba(233,243,251,.95);
border-radius: 10px;
padding: 6px 10px;
cursor: pointer;
font-weight: 950;
margin: 0 4px;
transition: transform .08s ease, filter .12s ease;
}
.vm-mini:active[b-w6v4yehcr8] {
transform: translateY(1px);
}
.vm-mini-danger[b-w6v4yehcr8] {
border-color: rgba(255,120,120,.35);
background: rgba(120,20,20,.22);
}
.vm-mini:disabled[b-w6v4yehcr8] {
opacity: .35;
pointer-events: none;
cursor: not-allowed;
}
/* empty states */
.vm-empty[b-w6v4yehcr8] {
text-align: center;
padding: 16px;
color: rgba(207,216,227,.85);
font-weight: 850;
}
.vm-emptybig[b-w6v4yehcr8] {
padding: 18px 14px;
display: grid;
gap: 6px;
}
.vm-emptybig-title[b-w6v4yehcr8] {
font-weight: 950;
color: rgba(233,243,251,.95);
}
.vm-emptybig-sub[b-w6v4yehcr8] {
color: rgba(207,216,227,.85);
font-weight: 850;
font-size: 12px;
}
/* ==========
Form / Details
========== */
.vm-form[b-w6v4yehcr8] {
padding: 12px;
display: grid;
gap: 10px;
}
.vm-fields[b-w6v4yehcr8] {
display: grid;
gap: 10px;
}
.vm-cols-2[b-w6v4yehcr8] {
grid-template-columns: 1fr 1fr;
}
.vm-field[b-w6v4yehcr8] {
display: grid;
gap: 6px;
min-width: 0;
}
.vm-span-2[b-w6v4yehcr8] {
grid-column: 1 / -1;
}
.vm-label[b-w6v4yehcr8] {
font-size: 12px;
font-weight: 950;
color: var(--dim);
letter-spacing: .1px;
}
.vm-inline[b-w6v4yehcr8] {
display: flex;
gap: 12px;
flex-wrap: wrap;
align-items: center;
}
.vm-check[b-w6v4yehcr8] {
display: flex;
gap: 10px;
align-items: center;
font-weight: 900;
color: rgba(233,243,251,.92);
background: rgba(23,42,65,.35);
border: 1px solid rgba(255,255,255,.08);
padding: 10px 12px;
border-radius: 12px;
}
.vm-check input[b-w6v4yehcr8] {
transform: scale(1.15);
}
.vm-hint[b-w6v4yehcr8] {
font-size: 11px;
color: rgba(207,216,227,.90);
padding: 0 4px;
}
.vm-foot[b-w6v4yehcr8] {
padding: 10px 12px;
color: rgba(207,216,227,.85);
font-weight: 850;
font-size: 12px;
border-top: 1px solid var(--stroke2);
}
/* ==========
Accordion (mobile/details)
========== */
.vm-acc[b-w6v4yehcr8] {
border: 1px solid rgba(255,255,255,.08);
border-radius: 14px;
background: rgba(0,0,0,.06);
overflow: hidden;
}
.vm-accsum[b-w6v4yehcr8] {
list-style: none;
cursor: pointer;
padding: 10px 12px;
display: flex;
align-items: baseline;
justify-content: space-between;
gap: 10px;
background: rgba(34,52,75,.35);
border-bottom: 1px solid rgba(255,255,255,.08);
font-weight: 950;
color: rgba(233,243,251,.95);
}
.vm-accsum[b-w6v4yehcr8]::-webkit-details-marker {
display: none;
}
.vm-accsub[b-w6v4yehcr8] {
font-size: 12px;
font-weight: 850;
color: rgba(207,216,227,.85);
}
.vm-accbody[b-w6v4yehcr8] {
padding: 12px;
}
/* ==========
MOBILE
========== */
@media (max-width: 980px) {
.vm-grid[b-w6v4yehcr8] {
grid-template-columns: 1fr;
}
.vm-details[b-w6v4yehcr8] {
order: 1;
}
.vm-list[b-w6v4yehcr8] {
order: 2;
}
.vm-search[b-w6v4yehcr8] {
min-width: 0;
flex: 1 1 auto;
}
.vm-cols-2[b-w6v4yehcr8] {
grid-template-columns: 1fr;
}
.vm-span-2[b-w6v4yehcr8] {
grid-column: auto;
}
.vm-table[b-w6v4yehcr8] {
font-size: 12px;
}
.vm-table th:nth-child(2)[b-w6v4yehcr8],
.vm-table td:nth-child(2)[b-w6v4yehcr8] {
width: 130px;
}
.vm-table th:nth-child(5)[b-w6v4yehcr8],
.vm-table td:nth-child(5)[b-w6v4yehcr8] {
width: 110px;
}
}
@media (max-width: 520px) {
.vm-page[b-w6v4yehcr8] {
padding: 12px;
}
.vm-header[b-w6v4yehcr8] {
padding: 12px;
align-items: flex-start;
flex-direction: column;
}
.vm-actions[b-w6v4yehcr8] {
width: 100%;
justify-content: flex-start;
}
}
/* _content/MobilioPortal/Pages/Fleet.razor.rz.scp.css */
html[b-jlxwsq1cbk], body[b-jlxwsq1cbk] {
height: 100%;
margin: 0;
overflow: hidden; /* nur fp-scroll scrollt */
}
*[b-jlxwsq1cbk] {
box-sizing: border-box;
}
:root[b-jlxwsq1cbk] {
--cell-border: rgba(255,255,255,0.10);
--bg1: rgba(23,37,52,0.88);
--bg2: rgba(30,42,56,0.88);
--bg3: rgba(29,46,68,0.55);
--rowh: 64px;
--appt-inset: 10px;
}
/* Page layout */
.fp-page[b-jlxwsq1cbk] {
height: 100%;
display: flex;
flex-direction: column;
padding: 18px;
gap: 14px;
overflow: hidden;
}
/* Top bar */
.fp-top[b-jlxwsq1cbk] {
flex: 0 0 auto;
display: flex;
align-items: center;
gap: 14px;
padding: 12px 14px;
border-radius: 16px;
background: var(--bg2);
border: 1px solid var(--cell-border);
box-shadow: 0 10px 26px rgba(0,0,0,0.28);
position: sticky;
top: 0;
z-index: 200;
}
.fp-nav[b-jlxwsq1cbk], .fp-actions[b-jlxwsq1cbk] {
display: flex;
align-items: center;
gap: 8px;
}
.fp-toggles[b-jlxwsq1cbk] {
display: flex;
align-items: center;
gap: 8px;
}
.fp-pill[b-jlxwsq1cbk] {
height: 34px;
padding: 0 12px;
border-radius: 999px;
border: 1px solid rgba(255,255,255,0.14);
background: rgba(29,46,68,0.55);
color: #EDEEEE;
font-weight: 800;
cursor: pointer;
}
.fp-pill.is-on[b-jlxwsq1cbk] {
outline: 2px solid rgba(2,140,106,0.75);
}
.fp-ico[b-jlxwsq1cbk] {
width: 36px;
height: 36px;
border-radius: 12px;
border: 1px solid rgba(255,255,255,0.12);
background: rgba(29,46,68,0.80);
color: #EDEEEE;
cursor: pointer;
display: flex;
align-items: center;
justify-content: center;
}
.fp-ico:hover[b-jlxwsq1cbk] {
background: rgba(29,46,68,0.95);
}
.fp-ico:active[b-jlxwsq1cbk] {
transform: translateY(1px);
}
/* Suche */
.fp-search[b-jlxwsq1cbk] {
flex: 1;
position: relative;
min-width: 240px;
}
.fp-search-ico[b-jlxwsq1cbk] {
position: absolute;
left: 12px;
top: 50%;
transform: translateY(-50%);
opacity: .75;
}
.fp-search-input[b-jlxwsq1cbk] {
width: 100%;
height: 36px;
border-radius: 14px;
border: 1px solid rgba(255,255,255,0.12);
background: rgba(29,46,68,0.80);
color: #EDEEEE;
padding: 0 12px 0 34px;
outline: none;
}
/* Betrieb */
.fp-betrieb[b-jlxwsq1cbk] {
display: flex;
align-items: center;
gap: 10px;
white-space: nowrap;
}
.fp-betrieb-label[b-jlxwsq1cbk] {
color: #EDEEEE;
opacity: .85;
font-weight: 850;
}
.fp-betrieb-select[b-jlxwsq1cbk] {
height: 36px;
border-radius: 14px;
border: 1px solid rgba(255,255,255,0.12);
background: rgba(29,46,68,0.80);
color: #EDEEEE;
padding: 0 12px;
outline: none;
min-width: 240px;
}
.fp-betrieb-select:focus[b-jlxwsq1cbk] {
box-shadow: 0 0 0 2px rgba(2,140,106,0.45);
}
/* Host */
.fp-host[b-jlxwsq1cbk] {
flex: 1 1 auto;
min-height: 0;
border-radius: 18px;
overflow: hidden;
border: 1px solid rgba(255,255,255,0.10);
background: var(--bg1);
box-shadow: 0 12px 34px rgba(0,0,0,0.28);
display: flex;
flex-direction: column;
}
/* ONLY scrolling area */
.fp-scroll[b-jlxwsq1cbk] {
flex: 1 1 auto;
min-height: 0;
overflow-y: auto;
overflow-x: hidden;
padding: 14px;
}
/* Grid */
.fp-grid[b-jlxwsq1cbk] {
display: grid;
gap: 0;
width: 100%;
min-width: 0;
}
/* Zellen: kein Padding damit Row-Höhe stabil bleibt */
.fp-cell[b-jlxwsq1cbk] {
background: var(--bg3);
border: 1px solid var(--cell-border);
color: #EDEEEE;
min-width: 0;
padding: 0;
}
/* Row height fix */
.fp-rowh[b-jlxwsq1cbk] {
height: var(--rowh);
}
/* Inner padding für Zell-Inhalt */
.fp-cell > *[b-jlxwsq1cbk] {
padding: 10px;
}
/* Header */
.fp-header[b-jlxwsq1cbk] {
background: rgba(30,42,56,0.92);
font-weight: 900;
}
.fp-hcenter[b-jlxwsq1cbk] {
display: flex;
align-items: center;
justify-content: center;
text-align: center;
}
.fp-dayhdr[b-jlxwsq1cbk] {
text-align: center;
}
.fp-dow[b-jlxwsq1cbk] {
font-weight: 900;
opacity: .95;
}
.fp-date[b-jlxwsq1cbk] {
font-weight: 700;
opacity: .75;
font-size: 12px;
}
/* Plate */
.fp-plate[b-jlxwsq1cbk] {
display: flex;
align-items: center;
justify-content: center;
text-align: center;
font-weight: 950;
}
.fp-platewrap[b-jlxwsq1cbk] {
position: relative;
width: 100%;
height: 100%;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
gap: 2px;
padding-left: 14px;
}
.fp-platetxt[b-jlxwsq1cbk] {
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
max-width: 100%;
}
.fp-plateuser[b-jlxwsq1cbk] {
font-size: 12px;
font-weight: 900;
opacity: .85;
line-height: 1;
}
/* SOLD */
.fp-sold[b-jlxwsq1cbk] {
position: absolute;
left: 2px;
top: 50%;
transform: translateY(-50%) rotate(-90deg);
transform-origin: left center;
color: #B80000;
font-weight: 950;
font-size: 11px;
letter-spacing: .6px;
animation: fpBlink-b-jlxwsq1cbk .9s infinite alternate;
opacity: .95;
pointer-events: none;
}
@keyframes fpBlink-b-jlxwsq1cbk {
from {
opacity: 1;
}
to {
opacity: .25;
}
}
/* Vehicle */
.fp-veh[b-jlxwsq1cbk] {
display: flex;
flex-direction: column;
justify-content: center;
}
.fp-vehname[b-jlxwsq1cbk] {
font-weight: 900;
font-size: 13px;
line-height: 1.2;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
.fp-vehsub[b-jlxwsq1cbk] {
margin-top: 3px;
font-size: 12px;
opacity: .75;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
/* Day cells background */
.fp-daycell[b-jlxwsq1cbk] {
position: relative;
overflow: hidden;
}
.fp-daycell[b-jlxwsq1cbk]::before {
content: "";
position: absolute;
inset: 0;
pointer-events: none;
opacity: .22;
background: repeating-linear-gradient( to right, rgba(255,255,255,0.08) 0px, rgba(255,255,255,0.08) 1px, transparent 1px, transparent calc(100% / 24) );
}
/* Overlay timeline */
.fp-row-overlay[b-jlxwsq1cbk] {
position: relative;
height: var(--rowh);
z-index: 6;
pointer-events: none;
padding: 0 var(--appt-inset);
background-image: repeating-linear-gradient( to right, rgba(255,255,255,0.10) 0px, rgba(255,255,255,0.10) 1px, transparent 1px, transparent calc(100% / var(--days)) ), repeating-linear-gradient( to right, rgba(255,255,255,0.03) 0px, rgba(255,255,255,0.03) 1px, transparent 1px, transparent calc((100% / var(--days)) / 24) );
background-repeat: repeat;
}
/* Appointments */
.fp-appt[b-jlxwsq1cbk] {
position: absolute;
top: 6px;
bottom: 6px;
border-radius: 12px;
padding-left: 12px;
padding-right: 12px;
overflow: hidden;
pointer-events: auto;
display: flex;
flex-direction: column;
justify-content: center;
box-shadow: 0 10px 22px rgba(0,0,0,0.18);
min-width: 1px;
}
.fp-appt.is-tiny[b-jlxwsq1cbk] {
padding-left: 6px;
padding-right: 6px;
}
.fp-appt.is-tiny .fp-appt-title[b-jlxwsq1cbk] {
font-size: 11px;
}
.fp-appt.is-tiny .fp-appt-sub[b-jlxwsq1cbk] {
display: none;
}
.fp-appt-arrow[b-jlxwsq1cbk] {
position: absolute;
top: 50%;
transform: translateY(-50%);
font-weight: 900;
font-size: 14px;
opacity: .95;
pointer-events: none;
text-shadow: 0 2px 8px rgba(0,0,0,0.35);
}
.fp-appt-arrow.left[b-jlxwsq1cbk] {
left: 6px;
}
.fp-appt-arrow.right[b-jlxwsq1cbk] {
right: 6px;
}
.fp-appt-title[b-jlxwsq1cbk] {
font-weight: 950;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
.fp-appt-sub[b-jlxwsq1cbk] {
margin-top: 2px;
font-size: 12px;
opacity: .9;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
/* Colors */
.appt-probe[b-jlxwsq1cbk] {
background: rgba(0,255,120,0.92);
color: #00311a;
}
.appt-intern[b-jlxwsq1cbk] {
background: rgba(255,255,255,0.88);
color: #111;
}
.appt-verm[b-jlxwsq1cbk] {
background: rgba(255,145,0,0.92);
color: #2a1300;
}
.appt-dienst[b-jlxwsq1cbk] {
background: rgba(0,255,255,0.88);
color: #002a2a;
}
.appt-default[b-jlxwsq1cbk] {
background: rgba(2,140,106,0.32);
border: 1px solid rgba(2,140,106,0.45);
}
/* WPF-like vehicle colors */
.fp-plate.is-dienst[b-jlxwsq1cbk] {
background: rgba(135,206,235,0.70);
color: #0b2a48;
}
.fp-plate.is-tzul[b-jlxwsq1cbk] {
background: rgba(147,112,219,0.55);
}
.fp-plate.is-rote[b-jlxwsq1cbk] {
background: rgba(255,127,80,0.55);
}
.fp-veh.veh-dienst[b-jlxwsq1cbk] {
background: rgba(135,206,235,0.18);
}
.fp-veh.veh-tzul[b-jlxwsq1cbk] {
background: rgba(147,112,219,0.16);
}
.fp-veh.veh-rote[b-jlxwsq1cbk] {
background: rgba(255,127,80,0.16);
}
/* Footer */
.fp-foot[b-jlxwsq1cbk] {
flex: 0 0 auto;
display: flex;
justify-content: space-between;
gap: 12px;
padding: 12px 14px;
border-top: 1px solid rgba(255,255,255,0.08);
background: rgba(30,42,56,0.92);
position: sticky;
bottom: 0;
z-index: 200;
}
.fp-legend[b-jlxwsq1cbk] {
display: flex;
gap: 10px;
align-items: center;
flex-wrap: wrap;
}
.fp-tag[b-jlxwsq1cbk] {
display: inline-flex;
align-items: center;
justify-content: center;
height: 30px;
padding: 0 12px;
border-radius: 10px;
font-weight: 900;
font-size: 12px;
color: #111;
}
.fp-tag.t-probe[b-jlxwsq1cbk] {
background: rgba(0,255,120,0.95);
color: #00311a;
}
.fp-tag.t-intern[b-jlxwsq1cbk] {
background: rgba(255,255,255,0.92);
color: #111;
}
.fp-tag.t-verm[b-jlxwsq1cbk] {
background: rgba(255,145,0,0.95);
color: #2a1300;
}
.fp-tag.t-dienst[b-jlxwsq1cbk] {
background: rgba(0,255,255,0.92);
color: #002a2a;
}
.fp-userbar[b-jlxwsq1cbk] {
display: flex;
gap: 10px;
align-items: center;
flex-wrap: wrap;
}
.fp-userlbl[b-jlxwsq1cbk] {
color: #EDEEEE;
opacity: .85;
font-weight: 850;
}
.fp-userbox[b-jlxwsq1cbk] {
min-width: 110px;
height: 30px;
border-radius: 10px;
background: rgba(255,255,255,0.82);
color: #111;
display: flex;
align-items: center;
justify-content: center;
font-weight: 900;
padding: 0 10px;
}
.fp-error[b-jlxwsq1cbk] {
padding: 10px 12px;
border-radius: 12px;
background: rgba(211,0,0,0.16);
border: 1px solid rgba(211,0,0,0.30);
color: #ffd7d7;
}
/* Responsive */
@media (max-width: 980px) {
html[b-jlxwsq1cbk], body[b-jlxwsq1cbk] {
overflow: auto;
}
.fp-page[b-jlxwsq1cbk] {
height: auto;
overflow: visible;
padding: 12px;
}
.fp-top[b-jlxwsq1cbk] {
flex-wrap: wrap;
position: relative;
top: auto;
}
.fp-foot[b-jlxwsq1cbk] {
position: relative;
bottom: auto;
}
.fp-search[b-jlxwsq1cbk] {
order: 3;
min-width: 100%;
}
}
/* _content/MobilioPortal/Pages/Kundenmanager.razor.rz.scp.css */
.km-page[b-u7i194nlss] {
--stroke: rgba(255,255,255,.10);
--text: #fff;
--dim: #cfd8e3;
--bg1: rgba(25,37,53,.92);
--bg2: rgba(25,37,53,.78);
padding: 18px;
color: var(--text);
}
.km-error[b-u7i194nlss] {
margin-top: 10px;
padding: 10px 12px;
border-radius: 14px;
border: 1px solid rgba(255,120,120,.35);
background: rgba(120,20,20,.25);
font-weight: 900;
}
.km-header[b-u7i194nlss] {
display: flex;
align-items: flex-end;
justify-content: space-between;
gap: 14px;
padding: 14px;
border: 1px solid var(--stroke);
border-radius: 16px;
background: linear-gradient(180deg,var(--bg1),var(--bg2));
box-shadow: 0 12px 40px rgba(0,0,0,.35), inset 0 1px 0 rgba(255,255,255,.03);
}
.km-title h1[b-u7i194nlss] {
margin: 0;
font-size: 22px;
}
.km-sub[b-u7i194nlss] {
margin-top: 4px;
font-size: 12px;
color: var(--dim);
font-weight: 800;
}
.km-actions[b-u7i194nlss] {
display: flex;
flex-wrap: wrap;
gap: 10px;
justify-content: flex-end;
}
.km-btn[b-u7i194nlss] {
border: 1px solid var(--stroke);
background: rgba(23,42,65,.80);
color: var(--text);
padding: 9px 12px;
border-radius: 12px;
cursor: pointer;
font-weight: 900;
}
.km-btn-primary[b-u7i194nlss] {
border-color: rgba(236,239,202,.45);
background: linear-gradient(180deg, rgba(236,239,202,.95), rgba(236,239,202,.72));
color: #213448;
}
.km-btn-danger[b-u7i194nlss] {
border-color: rgba(255,120,120,.35);
background: rgba(120,20,20,.22);
}
.km-btn:disabled[b-u7i194nlss] {
opacity: .35;
filter: grayscale(1);
cursor: not-allowed;
pointer-events: none;
}
.km-grid[b-u7i194nlss] {
margin-top: 12px;
display: grid;
grid-template-columns: 520px 1fr;
gap: 12px;
align-items: start;
}
.km-card[b-u7i194nlss] {
border: 1px solid var(--stroke);
border-radius: 16px;
background: linear-gradient(180deg,var(--bg1),var(--bg2));
overflow: hidden;
min-width: 0;
}
.km-cardhead[b-u7i194nlss] {
padding: 12px 14px;
border-bottom: 1px solid var(--stroke);
background: rgba(34,52,75,.45);
display: flex;
align-items: center;
justify-content: space-between;
gap: 12px;
}
.km-cardtitle[b-u7i194nlss] {
font-weight: 950;
color: rgba(233,243,251,.95);
}
.km-cardsub[b-u7i194nlss] {
font-size: 12px;
color: rgba(207,216,227,.85);
font-weight: 800;
}
.km-pill[b-u7i194nlss] {
font-size: 12px;
padding: 6px 10px;
border-radius: 999px;
border: 1px solid rgba(255,255,255,.12);
background: rgba(23,42,65,.65);
color: var(--dim);
font-weight: 900;
white-space: nowrap;
}
.km-search[b-u7i194nlss] {
display: flex;
align-items: center;
gap: 8px;
min-width: 280px;
flex: 0 0 auto;
}
.km-ico[b-u7i194nlss] {
opacity: .85;
}
.km-input[b-u7i194nlss] {
width: 100%;
height: 38px;
border-radius: 12px;
border: 1px solid rgba(255,255,255,.10);
background: rgba(30,46,68,.90);
color: var(--text);
padding: 0 12px;
outline: none;
min-width: 0;
}
.km-tablewrap[b-u7i194nlss] {
padding: 10px 12px;
}
.km-table[b-u7i194nlss] {
width: 100%;
border-collapse: collapse;
font-size: 13px;
}
.km-table th[b-u7i194nlss] {
text-align: left;
color: rgba(207,216,227,.90);
font-weight: 900;
padding: 10px 8px;
border-bottom: 1px solid rgba(255,255,255,.10);
}
.km-table td[b-u7i194nlss] {
padding: 10px 8px;
border-bottom: 1px solid rgba(255,255,255,.06);
vertical-align: top;
}
.km-table tr[b-u7i194nlss] {
cursor: pointer;
}
.km-table tr:hover[b-u7i194nlss] {
background: rgba(255,255,255,.04);
}
.km-table tr.is-selected[b-u7i194nlss] {
background: rgba(236,239,202,.12);
}
.km-name[b-u7i194nlss] {
font-weight: 900;
}
.km-dim[b-u7i194nlss] {
color: rgba(207,216,227,.85);
}
.km-small[b-u7i194nlss] {
font-size: 12px;
}
.km-empty[b-u7i194nlss] {
text-align: center;
padding: 16px;
color: rgba(207,216,227,.85);
font-weight: 800;
}
.km-emptybig[b-u7i194nlss] {
padding: 18px 14px;
display: grid;
gap: 6px;
}
.km-emptybig-title[b-u7i194nlss] {
font-weight: 950;
color: rgba(233,243,251,.95);
}
.km-emptybig-sub[b-u7i194nlss] {
color: rgba(207,216,227,.85);
font-weight: 800;
font-size: 12px;
}
.km-form[b-u7i194nlss] {
padding: 12px;
display: grid;
gap: 10px;
}
/* Accordion */
.km-acc[b-u7i194nlss] {
border: 1px solid rgba(255,255,255,.08);
border-radius: 14px;
background: rgba(0,0,0,.06);
overflow: hidden;
}
.km-accsum[b-u7i194nlss] {
list-style: none;
cursor: pointer;
padding: 10px 12px;
display: flex;
align-items: baseline;
justify-content: space-between;
gap: 10px;
background: rgba(34,52,75,.35);
border-bottom: 1px solid rgba(255,255,255,.08);
font-weight: 950;
color: rgba(233,243,251,.95);
}
.km-accsum[b-u7i194nlss]::-webkit-details-marker {
display: none;
}
.km-accsub[b-u7i194nlss] {
font-size: 12px;
font-weight: 800;
color: rgba(207,216,227,.85);
}
.km-accbody[b-u7i194nlss] {
padding: 12px;
}
.km-fields[b-u7i194nlss] {
display: grid;
gap: 10px;
}
.km-cols-2[b-u7i194nlss] {
grid-template-columns: 1fr 1fr;
}
.km-field[b-u7i194nlss] {
display: grid;
gap: 6px;
min-width: 0;
}
.km-span-2[b-u7i194nlss] {
grid-column: 1 / -1;
}
.km-label[b-u7i194nlss] {
font-size: 12px;
font-weight: 900;
color: var(--dim);
}
.km-suggest[b-u7i194nlss] {
position: absolute;
left: 0;
right: 0;
top: calc(38px + 22px);
z-index: 50;
border: 1px solid rgba(255,255,255,.12);
background: rgba(30,46,68,.98);
border-radius: 12px;
overflow: hidden;
box-shadow: 0 18px 50px rgba(0,0,0,.35);
}
.km-suggest-empty[b-u7i194nlss] {
padding: 10px 12px;
color: rgba(207,216,227,.85);
font-weight: 800;
font-size: 12px;
}
.km-suggest-item[b-u7i194nlss] {
width: 100%;
text-align: left;
padding: 10px 12px;
border: 0;
background: transparent;
color: rgba(233,243,251,.95);
cursor: pointer;
font-weight: 850;
}
.km-suggest-item:hover[b-u7i194nlss] {
background: rgba(255,255,255,.06);
}
.km-hint[b-u7i194nlss] {
font-size: 11px;
color: rgba(207,216,227,.90);
padding: 0 4px;
}
.km-foot[b-u7i194nlss] {
padding: 10px 12px;
color: rgba(207,216,227,.85);
font-weight: 800;
font-size: 12px;
}
/* =========================
MOBILE BEHAVIOR
- Details zuerst sichtbar
- Kundenliste bleibt da, aber zeigt NICHT die Tabelle ohne Suche
========================= */
@media (max-width: 980px) {
.km-grid[b-u7i194nlss] {
grid-template-columns: 1fr;
}
/* Details zuerst */
.km-details[b-u7i194nlss] {
order: 1;
}
.km-list[b-u7i194nlss] {
order: 2;
}
.km-search[b-u7i194nlss] {
min-width: 0;
flex: 1 1 auto;
}
.km-cols-2[b-u7i194nlss] {
grid-template-columns: 1fr;
}
.km-span-2[b-u7i194nlss] {
grid-column: auto;
}
}
/* _content/MobilioPortal/Pages/Mandanten.razor.rz.scp.css */
/* =========================================================
Mandantensteuerung – Scoped CSS (Mandanten.razor.css)
Keine Sidebar / keine linke Action-Spalte
========================================================= */
.ms-page[b-z1ujpw2n19] {
--bg0: #0f172a;
--panel: rgba(25,37,53,.86);
--stroke: rgba(255,255,255,.10);
--stroke2: rgba(255,255,255,.14);
--text: #ffffff;
--dim: #cfd8e3;
--accent: #ECEFCA;
--danger: #ef4444;
--warn: #ffaf01;
--radius: 16px;
--shadow: 0 12px 40px rgba(0,0,0,.35), inset 0 1px 0 rgba(255,255,255,.03);
min-height: calc(100vh - 24px);
padding: 18px;
color: var(--text);
border-radius: 18px;
background: radial-gradient(1100px 520px at 15% -10%, rgba(107,145,171,.9) 0%, transparent 60%), radial-gradient(900px 420px at 90% -20%, rgba(61,95,120,.75) 0%, transparent 60%), linear-gradient(180deg, #5e86a3 0%, #3b5b72 50%, #243a4f 100%);
}
/* HEADER */
.ms-header[b-z1ujpw2n19] {
display: flex;
align-items: flex-end;
justify-content: space-between;
gap: 16px;
margin-bottom: 14px;
padding: 14px 14px 12px;
background: linear-gradient(180deg, rgba(25,37,53,.95), rgba(25,37,53,.78));
border: 1px solid var(--stroke);
border-radius: var(--radius);
box-shadow: var(--shadow);
}
.ms-title h1[b-z1ujpw2n19] {
margin: 0;
font-size: 22px;
letter-spacing: .2px;
}
.ms-sub[b-z1ujpw2n19] {
margin-top: 4px;
font-size: 12px;
color: var(--dim);
font-weight: 700;
}
/* GRID */
.ms-grid[b-z1ujpw2n19] {
display: grid;
grid-template-columns: 1fr;
gap: 14px;
}
@media (min-width: 1100px) {
.ms-grid[b-z1ujpw2n19] {
grid-template-columns: 1.25fr .95fr;
align-items: start;
}
}
/* CARDS */
.ms-card[b-z1ujpw2n19] {
background: linear-gradient(180deg, rgba(25,37,53,.92), rgba(25,37,53,.78));
border: 1px solid var(--stroke);
border-radius: var(--radius);
box-shadow: var(--shadow);
overflow: hidden;
}
.ms-card-head[b-z1ujpw2n19] {
display: flex;
align-items: center;
justify-content: space-between;
gap: 12px;
padding: 14px 14px 10px;
border-bottom: 1px solid var(--stroke);
}
.ms-card-head h2[b-z1ujpw2n19] {
margin: 0;
font-size: 15px;
color: var(--dim);
letter-spacing: .02em;
}
.ms-card-sub[b-z1ujpw2n19] {
margin-top: 2px;
font-size: 12px;
color: rgba(207,216,227,.85);
font-weight: 700;
}
.ms-chip[b-z1ujpw2n19] {
font-size: 12px;
padding: 6px 10px;
border-radius: 999px;
border: 1px solid rgba(255,255,255,.12);
background: rgba(23,42,65,.65);
color: var(--dim);
font-weight: 800;
}
/* TOOLBAR */
.ms-toolbar[b-z1ujpw2n19] {
display: flex;
gap: 10px;
padding: 12px 14px 0;
}
.ms-search[b-z1ujpw2n19] {
flex: 1;
}
/* INPUTS */
.ms-input[b-z1ujpw2n19] {
width: 100%;
min-width: 0;
height: 38px;
border-radius: 12px;
border: 1px solid rgba(255,255,255,.10);
background: rgba(30,46,68,.90);
color: var(--text);
padding: 0 12px;
outline: none;
transition: border-color .12s ease, box-shadow .12s ease, filter .12s ease;
}
.ms-input[b-z1ujpw2n19]::placeholder {
color: rgba(207,216,227,.55);
}
.ms-input:focus[b-z1ujpw2n19] {
border-color: rgba(236,239,202,.60);
box-shadow: 0 0 0 3px rgba(236,239,202,.12);
}
.ms-input:disabled[b-z1ujpw2n19] {
opacity: .65;
cursor: not-allowed;
}
/* TABLE */
.ms-table-wrap[b-z1ujpw2n19] {
padding: 10px 12px 12px;
overflow: auto;
max-height: 68vh;
}
.ms-table[b-z1ujpw2n19] {
width: 100%;
border-collapse: collapse;
font-size: 13px;
min-width: 840px;
}
.ms-table thead th[b-z1ujpw2n19] {
position: sticky;
top: 0;
background: rgba(34,52,75,.96);
color: var(--text);
padding: 10px 10px;
text-align: left;
border-bottom: 1px solid rgba(255,255,255,.12);
z-index: 1;
font-weight: 900;
letter-spacing: .02em;
}
.ms-table tbody td[b-z1ujpw2n19] {
padding: 10px 10px;
border-bottom: 1px dashed rgba(255,255,255,.12);
color: rgba(233,243,251,.95);
}
.ms-table tbody tr:nth-child(even)[b-z1ujpw2n19] {
background: rgba(255,255,255,.03);
}
.ms-table tbody tr:hover[b-z1ujpw2n19] {
background: rgba(236,239,202,.10);
cursor: pointer;
}
.ms-empty td[b-z1ujpw2n19] {
padding: 18px 10px;
text-align: center;
color: rgba(207,216,227,.80);
}
/* FOOTER NOTE */
.ms-footer-note[b-z1ujpw2n19] {
padding: 10px 14px 14px;
font-size: 12px;
color: rgba(207,216,227,.92);
border-top: 1px solid rgba(255,255,255,.10);
}
/* FORM */
.ms-form[b-z1ujpw2n19] {
padding: 14px;
display: flex;
flex-direction: column;
gap: 10px;
}
.ms-row[b-z1ujpw2n19] {
display: grid;
grid-template-columns: 110px 1fr;
gap: 12px;
align-items: center;
}
.ms-label[b-z1ujpw2n19] {
font-size: 12px;
font-weight: 900;
color: var(--text);
}
.ms-row-check[b-z1ujpw2n19] {
align-items: start;
}
.ms-check[b-z1ujpw2n19] {
display: flex;
align-items: center;
gap: 10px;
padding: 8px 10px;
border-radius: 12px;
border: 1px solid rgba(255,255,255,.10);
background: rgba(23,42,65,.55);
color: var(--text);
font-weight: 800;
user-select: none;
width: fit-content;
}
.ms-check input[type="checkbox"][b-z1ujpw2n19] {
width: 16px;
height: 16px;
accent-color: #aab48a;
}
.ms-sep[b-z1ujpw2n19] {
height: 1px;
background: rgba(255,255,255,.10);
margin: 6px 0;
}
.ms-block-title[b-z1ujpw2n19] {
font-size: 12px;
font-weight: 950;
color: rgba(207,216,227,.95);
margin-top: 2px;
}
/* ACTIONS (unten im Formular) */
.ms-actions[b-z1ujpw2n19] {
display: flex;
gap: 10px;
padding: 12px 14px 14px;
border-top: 1px solid rgba(255,255,255,.10);
align-items: center;
}
.ms-actions-spacer[b-z1ujpw2n19] {
flex: 1;
}
/* BUTTONS */
.ms-btn[b-z1ujpw2n19] {
appearance: none;
border: 1px solid rgba(255,255,255,.12);
background: rgba(23,42,65,.80);
color: var(--text);
padding: 9px 12px;
border-radius: 12px;
cursor: pointer;
font-weight: 800;
font-size: 13px;
box-shadow: inset 0 1px 0 rgba(255,255,255,.03);
transition: transform .12s ease, filter .12s ease, border-color .12s ease;
}
.ms-btn:hover[b-z1ujpw2n19] {
transform: translateY(-1px);
border-color: rgba(255,255,255,.18);
filter: brightness(1.03);
}
.ms-btn:active[b-z1ujpw2n19] {
transform: translateY(0);
}
.ms-btn:disabled[b-z1ujpw2n19] {
opacity: .45;
cursor: not-allowed;
transform: none;
}
.ms-btn-primary[b-z1ujpw2n19] {
border-color: rgba(236,239,202,.45);
background: linear-gradient(180deg, rgba(236,239,202,.95), rgba(236,239,202,.72));
color: #213448;
box-shadow: 0 10px 28px rgba(236,239,202,.22);
}
.ms-btn-warn[b-z1ujpw2n19] {
border-color: rgba(255,175,1,.45);
background: rgba(255,175,1,.14);
color: #ffe9b5;
}
.ms-btn-danger[b-z1ujpw2n19] {
border-color: rgba(239,68,68,.45);
background: rgba(239,68,68,.14);
color: #ffd6d6;
}
/* RESPONSIVE */
@media (max-width: 900px) {
.ms-header[b-z1ujpw2n19] {
flex-direction: column;
align-items: flex-start;
}
.ms-table[b-z1ujpw2n19] {
min-width: 760px;
}
}
@media (max-width: 640px) {
.ms-row[b-z1ujpw2n19] {
grid-template-columns: 1fr;
}
.ms-label[b-z1ujpw2n19] {
opacity: .9;
}
}
@media (max-width: 520px) {
.ms-page[b-z1ujpw2n19] {
padding: 12px;
border-radius: 14px;
}
.ms-header[b-z1ujpw2n19] {
padding: 12px;
}
.ms-actions[b-z1ujpw2n19] {
flex-wrap: wrap;
}
.ms-actions-spacer[b-z1ujpw2n19] {
display: none;
}
.ms-btn[b-z1ujpw2n19] {
width: 100%;
}
}
/* _content/MobilioPortal/Pages/Rechtemanager.razor.rz.scp.css */
.rm-page[b-asxegwbqov] {
--stroke: rgba(255,255,255,.10);
--stroke2: rgba(255,255,255,.16);
--text: #fff;
--dim: #cfd8e3;
--accent: #ECEFCA;
min-height: calc(100vh - 24px);
padding: 18px;
color: var(--text);
border-radius: 18px;
background: radial-gradient(1100px 520px at 15% -10%, rgba(107,145,171,.9) 0%, transparent 60%), radial-gradient(900px 420px at 90% -20%, rgba(61,95,120,.75) 0%, transparent 60%), linear-gradient(180deg, #5e86a3 0%, #3b5b72 50%, #243a4f 100%);
}
.rm-header[b-asxegwbqov] {
display: flex;
align-items: flex-end;
justify-content: space-between;
gap: 16px;
margin-bottom: 14px;
padding: 14px 14px 12px;
background: linear-gradient(180deg, rgba(25,37,53,.95), rgba(25,37,53,.78));
border: 1px solid var(--stroke);
border-radius: 16px;
box-shadow: 0 12px 40px rgba(0,0,0,.35), inset 0 1px 0 rgba(255,255,255,.03);
}
.rm-title h1[b-asxegwbqov] {
margin: 0;
font-size: 22px;
}
.rm-sub[b-asxegwbqov] {
margin-top: 4px;
font-size: 12px;
color: var(--dim);
font-weight: 600;
}
.rm-actions[b-asxegwbqov] {
display: flex;
flex-wrap: wrap;
gap: 10px;
justify-content: flex-end;
}
.rm-btn[b-asxegwbqov] {
appearance: none;
border: 1px solid var(--stroke);
background: rgba(23,42,65,.80);
color: var(--text);
padding: 9px 12px;
border-radius: 12px;
cursor: pointer;
font-weight: 850;
font-size: 13px;
transition: transform .12s ease, filter .12s ease, border-color .12s ease;
}
.rm-btn:hover[b-asxegwbqov] {
transform: translateY(-1px);
border-color: var(--stroke2);
filter: brightness(1.03);
}
.rm-btn:active[b-asxegwbqov] {
transform: translateY(0);
}
.rm-btn-primary[b-asxegwbqov] {
border-color: rgba(236,239,202,.45);
background: linear-gradient(180deg, rgba(236,239,202,.95), rgba(236,239,202,.72));
color: #213448;
}
.rm-btn-toggle[b-asxegwbqov] {
border-color: rgba(255,255,255,.18);
background: rgba(23,42,65,.65);
}
.rm-btn-mini[b-asxegwbqov] {
padding: 8px 10px;
border-radius: 10px;
font-size: 12px;
}
.rm-grid[b-asxegwbqov] {
display: grid;
grid-template-columns: 1.2fr .8fr;
gap: 14px;
align-items: start;
}
@media (max-width: 1100px) {
.rm-grid[b-asxegwbqov] {
grid-template-columns: 1fr;
}
}
.rm-card[b-asxegwbqov] {
background: linear-gradient(180deg, rgba(25,37,53,.92), rgba(25,37,53,.78));
border: 1px solid var(--stroke);
border-radius: 16px;
box-shadow: 0 12px 40px rgba(0,0,0,.35), inset 0 1px 0 rgba(255,255,255,.03);
overflow: hidden;
}
.rm-card-head[b-asxegwbqov] {
display: flex;
align-items: center;
justify-content: space-between;
gap: 12px;
padding: 14px 14px 10px;
border-bottom: 1px solid var(--stroke);
}
.rm-card-left[b-asxegwbqov] {
display: flex;
align-items: center;
gap: 10px;
}
.rm-card-head h2[b-asxegwbqov] {
margin: 0;
font-size: 15px;
color: var(--dim);
letter-spacing: .02em;
}
.rm-chip[b-asxegwbqov] {
font-size: 12px;
padding: 6px 10px;
border-radius: 999px;
border: 1px solid rgba(255,255,255,.12);
background: rgba(23,42,65,.65);
color: var(--dim);
font-weight: 800;
}
.rm-search[b-asxegwbqov] {
display: flex;
align-items: center;
gap: 10px;
background: rgba(30,46,68,.80);
border: 1px solid rgba(255,255,255,.10);
border-radius: 12px;
padding: 8px 10px;
min-width: 360px;
}
@media (max-width: 900px) {
.rm-search[b-asxegwbqov] {
min-width: 100%;
}
}
.rm-search-ico[b-asxegwbqov] {
opacity: .85;
}
.rm-input[b-asxegwbqov] {
width: 100%;
min-width: 0;
border: 0;
outline: none;
background: transparent;
color: var(--text);
font-weight: 700;
}
.rm-input[b-asxegwbqov]::placeholder {
color: rgba(207,216,227,.55);
}
.rm-table-wrap[b-asxegwbqov] {
padding: 10px 12px 12px;
overflow: auto;
max-height: 70vh;
}
.rm-table[b-asxegwbqov] {
width: 100%;
border-collapse: collapse;
font-size: 13px;
min-width: 720px;
}
.rm-table thead th[b-asxegwbqov] {
position: sticky;
top: 0;
background: rgba(34,52,75,.96);
color: var(--text);
padding: 10px 10px;
text-align: left;
border-bottom: 1px solid rgba(255,255,255,.12);
z-index: 1;
font-weight: 950;
}
.rm-table tbody td[b-asxegwbqov] {
padding: 10px 10px;
border-bottom: 1px dashed rgba(255,255,255,.12);
color: rgba(233,243,251,.95);
}
.rm-table tbody tr:nth-child(even)[b-asxegwbqov] {
background: rgba(255,255,255,.03);
}
.rm-table tbody tr:hover[b-asxegwbqov] {
background: rgba(236,239,202,.10);
cursor: pointer;
}
.rm-table tbody tr.is-selected[b-asxegwbqov] {
outline: 2px solid rgba(236,239,202,.28);
outline-offset: -2px;
background: rgba(236,239,202,.12);
}
.rm-empty[b-asxegwbqov] {
padding: 16px 10px;
color: rgba(207,216,227,.90);
}
.rm-footer[b-asxegwbqov] {
padding: 10px 14px 14px;
font-size: 12px;
color: rgba(207,216,227,.92);
border-top: 1px solid rgba(255,255,255,.10);
}
.rm-right-body[b-asxegwbqov] {
padding: 12px 12px 14px;
}
.rm-placeholder[b-asxegwbqov] {
padding: 18px 14px;
border: 1px dashed rgba(255,255,255,.14);
border-radius: 14px;
background: rgba(23,42,65,.20);
}
.rm-placeholder-title[b-asxegwbqov] {
font-weight: 950;
margin-bottom: 4px;
}
.rm-placeholder-sub[b-asxegwbqov] {
color: rgba(207,216,227,.85);
font-size: 12px;
}
.rm-userline[b-asxegwbqov] {
margin-bottom: 10px;
}
.rm-user-name[b-asxegwbqov] {
font-weight: 950;
font-size: 14px;
}
.rm-user-sub[b-asxegwbqov] {
font-size: 12px;
color: rgba(207,216,227,.85);
margin-top: 2px;
}
.rm-box[b-asxegwbqov] {
background: rgba(23,42,65,.18);
border: 1px solid rgba(255,255,255,.10);
border-radius: 16px;
padding: 12px;
}
.rm-box-top[b-asxegwbqov] {
display: flex;
align-items: center;
justify-content: space-between;
margin-bottom: 10px;
}
.rm-label[b-asxegwbqov] {
font-size: 12px;
color: var(--text);
font-weight: 900;
margin-bottom: 6px;
display: block;
}
.rm-input2[b-asxegwbqov] {
width: 100%;
min-width: 0;
height: 38px;
border-radius: 12px;
border: 1px solid rgba(255,255,255,.10);
background: rgba(30,46,68,.90);
color: var(--text);
padding: 0 12px;
outline: none;
transition: border-color .12s ease, box-shadow .12s ease;
}
.rm-input2:focus[b-asxegwbqov] {
border-color: rgba(236,239,202,.60);
box-shadow: 0 0 0 3px rgba(236,239,202,.12);
}
.rm-input2-mini[b-asxegwbqov] {
height: 34px;
border-radius: 10px;
}
.rm-formgrid[b-asxegwbqov] {
display: grid;
grid-template-columns: 1fr 1fr auto;
gap: 12px;
align-items: end;
}
@media (max-width: 900px) {
.rm-formgrid[b-asxegwbqov] {
grid-template-columns: 1fr;
}
.rm-formgrid-btn[b-asxegwbqov] {
display: flex;
justify-content: flex-start;
}
}
.rm-note[b-asxegwbqov] {
margin-top: 10px;
font-size: 11px;
color: rgba(207,216,227,.85);
line-height: 1.35;
}
.rm-section-title[b-asxegwbqov] {
margin-top: 14px;
margin-bottom: 8px;
font-size: 12px;
font-weight: 950;
color: rgba(233,243,251,.95);
}
.rm-assign-tablewrap[b-asxegwbqov] {
overflow: auto;
border-radius: 14px;
border: 1px solid rgba(255,255,255,.10);
}
.rm-assign-table[b-asxegwbqov] {
width: 100%;
border-collapse: collapse;
min-width: 520px;
font-size: 13px;
}
.rm-assign-table thead th[b-asxegwbqov] {
background: rgba(34,52,75,.96);
padding: 10px 10px;
text-align: left;
border-bottom: 1px solid rgba(255,255,255,.12);
font-weight: 950;
}
.rm-assign-table tbody td[b-asxegwbqov] {
padding: 10px 10px;
border-bottom: 1px dashed rgba(255,255,255,.12);
}
.rm-assign-actions[b-asxegwbqov] {
width: 180px;
text-align: right;
white-space: nowrap;
}
.rm-iconbtn[b-asxegwbqov] {
width: 38px;
height: 34px;
border-radius: 10px;
border: 1px solid rgba(255,255,255,.14);
background: rgba(23,42,65,.70);
color: var(--text);
cursor: pointer;
font-weight: 950;
margin-left: 8px;
}
.rm-iconbtn:hover[b-asxegwbqov] {
filter: brightness(1.05);
}
/* Checkbox */
.rm-check[b-asxegwbqov] {
display: flex;
align-items: center;
gap: 10px;
padding: 8px 10px;
border-radius: 12px;
border: 1px solid rgba(255,255,255,.10);
background: rgba(23,42,65,.55);
color: var(--text);
font-weight: 800;
user-select: none;
}
.rm-check input[type="checkbox"][b-asxegwbqov] {
width: 16px;
height: 16px;
accent-color: #aab48a;
}
/* Divider */
.rm-divider[b-asxegwbqov] {
border: 0;
border-top: 1px solid rgba(255,255,255,.10);
margin: 14px 0;
}
/* Cards block */
.rm-kachel-block[b-asxegwbqov] {
padding: 10px 0 0;
}
.rm-kachel-head[b-asxegwbqov] {
display: flex;
align-items: center;
justify-content: space-between;
gap: 12px;
margin-bottom: 10px;
}
.rm-kachel-title[b-asxegwbqov] {
font-weight: 900;
color: rgba(233,243,251,.95);
font-size: 13px;
}
.rm-kachel-sub[b-asxegwbqov] {
font-size: 11px;
color: rgba(207,216,227,.85);
margin-top: 2px;
}
.rm-dual[b-asxegwbqov] {
display: grid;
grid-template-columns: 1fr 64px 1fr;
gap: 12px;
align-items: start;
}
.rm-dual-col[b-asxegwbqov] {
background: rgba(23,42,65,.28);
border: 1px solid rgba(255,255,255,.10);
border-radius: 14px;
padding: 10px;
}
.rm-dual-cap[b-asxegwbqov] {
font-weight: 900;
font-size: 12px;
color: rgba(233,243,251,.92);
margin-bottom: 8px;
}
.rm-dual-search[b-asxegwbqov] {
display: flex;
align-items: center;
gap: 10px;
background: rgba(30,46,68,.80);
border: 1px solid rgba(255,255,255,.10);
border-radius: 12px;
padding: 8px 10px;
margin-bottom: 10px;
}
.rm-ico[b-asxegwbqov] {
opacity: .85;
}
.rm-dual-list[b-asxegwbqov] {
display: flex;
flex-direction: column;
gap: 8px;
max-height: 280px;
overflow: auto;
padding-right: 2px;
}
.rm-dual-item[b-asxegwbqov] {
text-align: left;
border-radius: 12px;
border: 1px solid rgba(255,255,255,.10);
background: rgba(30,46,68,.55);
color: #fff;
padding: 10px 10px;
cursor: pointer;
}
.rm-dual-item:hover[b-asxegwbqov] {
border-color: rgba(255,255,255,.16);
filter: brightness(1.03);
}
.rm-dual-item.is-selected[b-asxegwbqov] {
outline: 2px solid rgba(236,239,202,.28);
outline-offset: -2px;
background: rgba(236,239,202,.10);
}
.rm-dual-item-title[b-asxegwbqov] {
font-weight: 900;
font-size: 12px;
margin-bottom: 2px;
}
.rm-dual-item-sub[b-asxegwbqov] {
font-size: 11px;
color: rgba(207,216,227,.85);
}
.rm-dual-empty[b-asxegwbqov] {
text-align: center;
padding: 14px 10px;
color: rgba(207,216,227,.80);
border: 1px dashed rgba(255,255,255,.12);
border-radius: 12px;
}
.rm-dual-mid[b-asxegwbqov] {
display: flex;
flex-direction: column;
align-items: stretch;
justify-content: center;
gap: 8px;
}
.rm-move[b-asxegwbqov] {
width: 64px;
height: 42px;
border-radius: 12px;
border: 1px solid rgba(255,255,255,.14);
background: rgba(23,42,65,.70);
color: #fff;
font-weight: 950;
cursor: pointer;
}
.rm-move:disabled[b-asxegwbqov] {
opacity: .45;
cursor: not-allowed;
}
.rm-kachel-foot[b-asxegwbqov] {
margin-top: 10px;
font-size: 11px;
color: rgba(207,216,227,.80);
}
.rm-hint[b-asxegwbqov] {
opacity: .95;
}
/* Mobile */
@media (max-width: 900px) {
.rm-dual[b-asxegwbqov] {
grid-template-columns: 1fr;
}
.rm-dual-mid[b-asxegwbqov] {
flex-direction: row;
justify-content: center;
}
.rm-move[b-asxegwbqov] {
width: 54px;
height: 40px;
}
}
/* ===========================
Shiftplanner Rechte (UI only)
=========================== */
.rm-sp-block[b-asxegwbqov] {
margin-top: 2px;
padding: 12px 0 0;
}
.rm-sp-head[b-asxegwbqov] {
display: flex;
align-items: flex-start;
justify-content: space-between;
gap: 12px;
margin-bottom: 10px;
}
.rm-sp-title[b-asxegwbqov] {
font-weight: 950;
color: rgba(233,243,251,.95);
font-size: 13px;
}
.rm-sp-sub[b-asxegwbqov] {
font-size: 11px;
color: rgba(207,216,227,.85);
margin-top: 2px;
}
.rm-btn-compact[b-asxegwbqov] {
padding: 8px 10px;
border-radius: 12px;
font-size: 12px;
}
.rm-sp-card[b-asxegwbqov] {
background: rgba(23,42,65,.28);
border: 1px solid rgba(255,255,255,.10);
border-radius: 14px;
padding: 12px;
margin-top: 10px;
}
.rm-sp-cardtitle[b-asxegwbqov] {
font-weight: 950;
font-size: 12px;
color: rgba(233,243,251,.92);
margin-bottom: 10px;
}
.rm-sp-row[b-asxegwbqov] {
display: flex;
gap: 10px;
flex-wrap: wrap;
align-items: center;
}
.rm-sp-row-right[b-asxegwbqov] {
justify-content: flex-end;
margin-top: 10px;
}
.rm-check-wide[b-asxegwbqov] {
flex: 1 1 320px;
}
.rm-check-tight[b-asxegwbqov] {
padding: 8px 10px;
}
.rm-sp-grid[b-asxegwbqov] {
display: grid;
grid-template-columns: 1fr 1fr auto;
gap: 12px;
align-items: end;
}
.rm-sp-grid-3[b-asxegwbqov] {
grid-template-columns: 1fr 1fr 1fr;
}
.rm-sp-actions[b-asxegwbqov] {
display: flex;
align-items: center;
justify-content: flex-end;
gap: 10px;
padding-bottom: 2px;
}
.rm-sp-hint[b-asxegwbqov] {
margin-top: 10px;
font-size: 11px;
color: rgba(207,216,227,.82);
line-height: 1.35;
}
.rm-sp-tablewrap[b-asxegwbqov] {
margin-top: 10px;
overflow: auto;
border-radius: 14px;
border: 1px solid rgba(255,255,255,.10);
}
.rm-sp-table[b-asxegwbqov] {
width: 100%;
border-collapse: collapse;
min-width: 560px;
font-size: 13px;
}
.rm-sp-table thead th[b-asxegwbqov] {
background: rgba(34,52,75,.96);
padding: 10px 10px;
text-align: left;
border-bottom: 1px solid rgba(255,255,255,.12);
font-weight: 950;
}
.rm-sp-table tbody td[b-asxegwbqov] {
padding: 10px 10px;
border-bottom: 1px dashed rgba(255,255,255,.12);
}
.rm-sp-ta[b-asxegwbqov] {
text-align: right;
white-space: nowrap;
width: 160px;
}
.rm-dim[b-asxegwbqov] {
color: rgba(207,216,227,.78);
}
@media (max-width: 900px) {
.rm-sp-head[b-asxegwbqov] {
flex-direction: column;
align-items: stretch;
}
.rm-sp-grid[b-asxegwbqov] {
grid-template-columns: 1fr;
align-items: stretch;
}
.rm-sp-grid-3[b-asxegwbqov] {
grid-template-columns: 1fr;
}
.rm-sp-actions[b-asxegwbqov] {
justify-content: flex-start;
}
.rm-check-wide[b-asxegwbqov] {
flex: 1 1 100%;
}
.rm-sp-table[b-asxegwbqov] {
min-width: 520px;
}
}
/* WICHTIG: Deko-Layer darf keine Klicks fressen */
.sp-perm-section[b-asxegwbqov]::before,
.sp-perm-section[b-asxegwbqov]::after,
.sp-perm-card[b-asxegwbqov]::before,
.sp-perm-card[b-asxegwbqov]::after,
.rm-card[b-asxegwbqov]::before,
.rm-card[b-asxegwbqov]::after,
.rm-box[b-asxegwbqov]::before,
.rm-box[b-asxegwbqov]::after {
pointer-events: none;
}
.sp-perm-section[b-asxegwbqov],
.sp-perm-card[b-asxegwbqov],
.rm-box[b-asxegwbqov],
.rm-card[b-asxegwbqov] {
position: relative;
}
.sp-perm-section > *[b-asxegwbqov],
.sp-perm-card > *[b-asxegwbqov],
.rm-box > *[b-asxegwbqov],
.rm-card > *[b-asxegwbqov] {
position: relative;
z-index: 2;
}
/* _content/MobilioPortal/Pages/Shiftplanner.razor.rz.scp.css */
/* =========================
BASE
========================= */
.sp-page[b-7hukkyb77s] {
--stroke: rgba(255,255,255,.10);
--stroke2: rgba(255,255,255,.16);
--text: #fff;
--dim: #cfd8e3;
--bg1: rgba(25,37,53,.92);
--bg2: rgba(25,37,53,.78);
padding: 18px;
color: var(--text);
}
.sp-pageerror[b-7hukkyb77s] {
margin-top: 10px;
padding: 10px 12px;
border-radius: 14px;
border: 1px solid rgba(255, 120, 120, .35);
background: rgba(120, 20, 20, .25);
color: rgba(255,255,255,.95);
font-weight: 850;
}
/* =========================
HEADER
========================= */
.sp-header[b-7hukkyb77s] {
display: flex;
align-items: flex-end;
justify-content: space-between;
gap: 14px;
padding: 14px;
border: 1px solid var(--stroke);
border-radius: 16px;
background: linear-gradient(180deg,var(--bg1),var(--bg2));
box-shadow: 0 12px 40px rgba(0,0,0,.35), inset 0 1px 0 rgba(255,255,255,.03);
}
.sp-title h1[b-7hukkyb77s] {
margin: 0;
font-size: 22px;
}
.sp-sub[b-7hukkyb77s] {
margin-top: 4px;
font-size: 12px;
color: var(--dim);
font-weight: 700;
}
.sp-actions[b-7hukkyb77s] {
display: flex;
align-items: center;
gap: 10px;
flex-wrap: wrap;
justify-content: flex-end;
}
.sp-btn[b-7hukkyb77s] {
border: 1px solid var(--stroke);
background: rgba(23,42,65,.80);
color: var(--text);
padding: 9px 12px;
border-radius: 12px;
cursor: pointer;
font-weight: 900;
}
.sp-btn-primary[b-7hukkyb77s] {
border-color: rgba(236,239,202,.45);
background: linear-gradient(180deg, rgba(236,239,202,.95), rgba(236,239,202,.72));
color: #213448;
}
.sp-week[b-7hukkyb77s] {
font-weight: 900;
color: var(--dim);
padding: 0 6px;
}
/* =========================
FILTER BAR (SLIM, ONE LINE)
========================= */
.sp-filters[b-7hukkyb77s] {
margin-top: 12px;
display: flex;
align-items: center;
gap: 10px;
padding: 10px 12px;
border: 1px solid var(--stroke);
border-radius: 16px;
background: linear-gradient(180deg,var(--bg1),var(--bg2));
min-height: 52px;
}
/* Jede Filter-Einheit: Label + Feld in einer Reihe, aber schmal */
.sp-filter[b-7hukkyb77s] {
display: flex;
align-items: center;
gap: 8px;
min-width: 0;
}
/* Labels: klein, keine Zeilenumbrüche */
.sp-filter > label[b-7hukkyb77s] {
margin: 0;
font-size: 12px;
font-weight: 900;
color: var(--dim);
white-space: nowrap;
}
/* Inputs allgemein (kompakt) */
.sp-input[b-7hukkyb77s] {
height: 36px;
border-radius: 12px;
border: 1px solid rgba(255,255,255,.10);
background: rgba(30,46,68,.90);
color: var(--text);
padding: 0 10px;
outline: none;
min-width: 0;
}
/* Selects: fixe angenehme Breite */
.sp-filters select.sp-input[b-7hukkyb77s] {
width: 180px; /* nach Geschmack 160-220 */
}
/* Suche soll wachsen */
.sp-grow[b-7hukkyb77s] {
flex: 1 1 auto;
}
.sp-grow .sp-input[b-7hukkyb77s] {
width: 100%;
min-width: 220px;
}
/* Sonntag: nur kompakter Toggle */
.sp-filter-sunday[b-7hukkyb77s] {
flex: 0 0 auto;
}
/* dein Markup: */
.sp-toggle[b-7hukkyb77s] {
display: inline-flex;
align-items: center;
justify-content: center;
height: 36px;
padding: 0 12px;
border-radius: 12px;
border: 1px solid rgba(255,255,255,.10);
background: rgba(30,46,68,.55);
cursor: pointer;
user-select: none;
}
.sp-toggle input[type="checkbox"][b-7hukkyb77s] {
width: 16px;
height: 16px;
margin: 0;
accent-color: #cfd8e3;
}
/* Permission rechts */
.sp-perm[b-7hukkyb77s] {
margin-left: auto;
display: flex;
align-items: center;
}
.sp-pill[b-7hukkyb77s] {
display: inline-block;
font-size: 12px;
padding: 6px 10px;
border-radius: 999px;
border: 1px solid rgba(255,255,255,.12);
background: rgba(23,42,65,.65);
color: var(--dim);
font-weight: 900;
white-space: nowrap;
}
/* Screenreader label */
.sp-sr-only[b-7hukkyb77s] {
position: absolute;
width: 1px;
height: 1px;
padding: 0;
margin: -1px;
overflow: hidden;
clip: rect(0,0,0,0);
white-space: nowrap;
border: 0;
}
/* =========================
WEEK GRID
========================= */
.sp-weekgrid[b-7hukkyb77s] {
margin-top: 12px;
display: grid;
gap: 10px;
}
.sp-daycol[b-7hukkyb77s] {
border: 1px solid var(--stroke);
border-radius: 16px;
background: linear-gradient(180deg,var(--bg1),var(--bg2));
overflow: hidden;
min-height: 420px;
}
.sp-dayhead[b-7hukkyb77s] {
padding: 10px 12px;
border-bottom: 1px solid var(--stroke);
background: rgba(34,52,75,.55);
display: grid;
grid-template-columns: 1fr auto 1fr;
align-items: center;
}
.sp-dayhead-left[b-7hukkyb77s] {
font-weight: 950;
color: var(--dim);
justify-self: start;
}
.sp-dayhead-right[b-7hukkyb77s] {
font-weight: 900;
color: rgba(233,243,251,.95);
justify-self: end;
}
.sp-dayplus[b-7hukkyb77s] {
justify-self: center;
width: 30px;
height: 30px;
border-radius: 999px;
border: 1px dashed rgba(255,255,255,.24);
background: rgba(255,255,255,.04);
color: rgba(233,243,251,.95);
font-weight: 1000;
cursor: pointer;
display: none !important;
}
/* Timeline */
.sp-timeline[b-7hukkyb77s] {
position: relative;
}
.sp-timeline-top[b-7hukkyb77s] {
display: flex;
justify-content: space-between;
color: rgba(207,216,227,.95);
font-weight: 900;
font-size: 12px;
padding: 0 2px 8px 2px;
}
.sp-lanes[b-7hukkyb77s] {
position: relative;
width: 100%;
margin-top: 10px;
border: 1px solid rgba(255,255,255,.10);
border-radius: 14px;
background: rgba(0,0,0,.08);
overflow: hidden;
display: block;
}
.sp-lanes[b-7hukkyb77s]::before {
content: "";
position: absolute;
inset: 0;
background: linear-gradient(to right, rgba(255,255,255,.06), rgba(255,255,255,.06)) 25% 0/1px 100%, linear-gradient(to right, rgba(255,255,255,.06), rgba(255,255,255,.06)) 50% 0/1px 100%, linear-gradient(to right, rgba(255,255,255,.06), rgba(255,255,255,.06)) 75% 0/1px 100%;
pointer-events: none;
opacity: .55;
}
.sp-bar[b-7hukkyb77s] {
position: absolute;
z-index: 2;
display: block;
border: 1px solid rgba(255,255,255,.14);
border-radius: 14px;
padding: 10px 10px;
text-align: left;
cursor: pointer;
color: #fff;
height: 58px;
box-shadow: 0 10px 26px rgba(0,0,0,.35);
pointer-events: auto;
left: var(--l) !important;
width: var(--w) !important;
top: var(--t) !important;
}
.sp-bar-time[b-7hukkyb77s] {
font-weight: 950;
font-size: 12px;
opacity: .95;
}
.sp-bar-name[b-7hukkyb77s] {
margin-top: 3px;
font-weight: 950;
font-size: 13px;
}
.sp-bar-sub[b-7hukkyb77s] {
margin-top: 2px;
font-size: 11px;
opacity: .85;
}
.sp-add[b-7hukkyb77s] {
position: relative;
z-index: 5;
width: 100%;
margin-top: 10px;
border: 1px dashed rgba(255,255,255,.22);
background: rgba(255,255,255,.03);
color: rgba(233,243,251,.95);
border-radius: 12px;
padding: 10px;
cursor: pointer;
font-weight: 900;
}
.sp-empty[b-7hukkyb77s] {
pointer-events: none;
position: absolute;
inset: 0;
display: grid;
place-items: center;
z-index: 1;
top: 12px;
left: 12px;
color: rgba(207,216,227,.90);
font-weight: 800;
}
/* =========================
MOBILE DAY LIST
========================= */
.sp-daylist[b-7hukkyb77s] {
display: none;
margin-top: 12px;
border: 1px solid var(--stroke);
border-radius: 16px;
background: linear-gradient(180deg,var(--bg1),var(--bg2));
overflow: hidden;
}
.sp-mhead[b-7hukkyb77s] {
padding: 10px 12px;
border-bottom: 1px solid var(--stroke);
display: flex;
align-items: center;
gap: 10px;
}
.sp-mdate[b-7hukkyb77s] {
flex: 1;
text-align: center;
font-weight: 950;
color: var(--dim);
}
.sp-daylist-body[b-7hukkyb77s] {
padding: 10px;
display: grid;
gap: 10px;
}
.sp-daycard[b-7hukkyb77s] {
border: 1px solid rgba(255,255,255,.10);
border-radius: 16px;
overflow: hidden;
background: rgba(0,0,0,.06);
}
/* =========================
MODAL
========================= */
.sp-modal-backdrop[b-7hukkyb77s] {
position: fixed;
inset: 0;
background: rgba(0,0,0,.55);
display: flex;
align-items: center;
justify-content: center;
padding: 14px;
z-index: 9999;
}
.sp-modal[b-7hukkyb77s] {
width: min(520px, 100%);
border-radius: 16px;
border: 1px solid rgba(255,255,255,.14);
background: linear-gradient(180deg, rgba(25,37,53,.98), rgba(25,37,53,.86));
box-shadow: 0 20px 60px rgba(0,0,0,.55);
overflow: hidden;
}
.sp-modal-scroll[b-7hukkyb77s] {
max-height: 90vh;
overflow: auto;
}
.sp-modal-head[b-7hukkyb77s] {
display: flex;
justify-content: space-between;
align-items: center;
padding: 12px 14px;
border-bottom: 1px solid rgba(255,255,255,.10);
}
.sp-modal-title[b-7hukkyb77s] {
font-weight: 950;
color: var(--dim);
}
.sp-icon[b-7hukkyb77s] {
border: 1px solid rgba(255,255,255,.12);
background: rgba(23,42,65,.70);
color: #fff;
border-radius: 10px;
padding: 6px 10px;
cursor: pointer;
}
.sp-modal-body[b-7hukkyb77s] {
padding: 14px;
display: grid;
gap: 10px;
}
.sp-formrow[b-7hukkyb77s] {
display: grid;
gap: 6px;
}
.sp-formrow label[b-7hukkyb77s] {
font-size: 12px;
font-weight: 900;
color: var(--dim);
}
.sp-formrow input[b-7hukkyb77s],
.sp-formrow select[b-7hukkyb77s] {
height: 38px;
border-radius: 12px;
border: 1px solid rgba(255,255,255,.10);
background: rgba(30,46,68,.90);
color: #fff;
padding: 0 12px;
outline: none;
}
.sp-two[b-7hukkyb77s] {
display: grid;
grid-template-columns: 1fr 1fr;
gap: 10px;
}
.sp-hint[b-7hukkyb77s] {
font-size: 11px;
color: rgba(207,216,227,.90);
}
.sp-modal-foot[b-7hukkyb77s] {
padding: 12px 14px;
border-top: 1px solid rgba(255,255,255,.10);
display: flex;
gap: 10px;
justify-content: flex-end;
}
.sp-weekdays[b-7hukkyb77s] {
display: flex;
flex-wrap: wrap;
gap: 10px;
}
.sp-wd[b-7hukkyb77s] {
display: flex;
align-items: center;
gap: 8px;
padding: 8px 10px;
border-radius: 12px;
border: 1px solid rgba(255,255,255,.10);
background: rgba(30,46,68,.55);
font-weight: 900;
color: rgba(233,243,251,.95);
}
.sp-dayactions[b-7hukkyb77s] {
display: flex;
gap: 10px;
margin-top: 10px;
}
.sp-dayactions .sp-add[b-7hukkyb77s] {
margin-top: 0; /* weil Container schon margin hat */
width: auto;
flex: 1 1 0;
}
.sp-add-danger[b-7hukkyb77s] {
border: 1px dashed rgba(255,120,120,.35);
background: rgba(120,20,20,.20);
color: rgba(255,255,255,.95);
}
.sp-add-danger:hover[b-7hukkyb77s] {
background: rgba(120,20,20,.30);
}
/* =========================
RESPONSIVE
========================= */
@media (max-width: 900px) {
/* Reihenfolge steuern */
.sp-page[b-7hukkyb77s] {
display: flex;
flex-direction: column;
gap: 12px;
justify-content: flex-start;
}
/* Desktop aus */
.sp-weekgrid[b-7hukkyb77s] {
display: none;
}
/* Mobile an (ROSA direkt unter Header) */
.sp-daylist[b-7hukkyb77s] {
display: block;
order: 2;
margin-top: 0;
}
/* Filter nach unten (LILA ganz unten) */
.sp-filters[b-7hukkyb77s] {
order: 3;
margin-top: 0;
flex-wrap: wrap;
align-items: stretch;
gap: 10px;
}
/* In Mobile lieber Felder untereinander */
.sp-filter[b-7hukkyb77s] {
width: 100%;
display: grid;
grid-template-columns: 140px 1fr; /* Labelbreite anpassen */
align-items: center;
gap: 10px;
}
.sp-filter > label[b-7hukkyb77s] {
justify-self: start;
}
.sp-filter .sp-input[b-7hukkyb77s] {
width: 100%;
min-width: 0;
}
.sp-filters select.sp-input[b-7hukkyb77s] {
width: 100%;
}
.sp-grow[b-7hukkyb77s] {
width: 100%;
}
.sp-perm[b-7hukkyb77s] {
margin-left: 0;
width: 100%;
justify-content: flex-start;
}
.sp-two[b-7hukkyb77s] {
grid-template-columns: 1fr;
}
.sp-actions[b-7hukkyb77s]{
display: none !important;
}
}
/* Allgemein für alle Buttons im Schichtplaner */
.sp-page button:disabled[b-7hukkyb77s],
.sp-page .sp-btn:disabled[b-7hukkyb77s],
.sp-page .sp-add:disabled[b-7hukkyb77s],
.sp-page .sp-dayplus:disabled[b-7hukkyb77s] {
opacity: 0.35;
filter: grayscale(1);
cursor: not-allowed;
pointer-events: none;
}
/* Optional: auch die "Danger"-Variante sichtbar entschärfen */
.sp-page .sp-add-danger:disabled[b-7hukkyb77s] {
opacity: 0.25;
filter: grayscale(1);
}
/* _content/MobilioPortal/Shared/MainLayout.razor.rz.scp.css */
.layout[b-e5lt64qx04] {
min-height: 100vh;
}
.topbar[b-e5lt64qx04] {
position: sticky;
top: 0;
z-index: 99999 !important;
display: flex;
align-items: center;
gap: 14px;
padding: 12px 16px;
border-bottom: 1px solid rgba(255,255,255,0.06);
background: rgba(13, 20, 28, 0.85);
backdrop-filter: blur(10px);
}
/* Link statt Button */
.brand[b-e5lt64qx04] {
display: inline-flex;
align-items: center;
gap: 10px;
border: none;
background: transparent;
cursor: pointer;
padding: 6px 8px;
border-radius: 12px;
text-decoration: none; /* wichtig */
color: inherit; /* wichtig */
}
.brand:hover[b-e5lt64qx04] {
background: rgba(255,255,255,0.06);
text-decoration: none;
}
.brand-logo[b-e5lt64qx04] {
width: 28px;
height: 28px;
border-radius: 10px;
box-shadow: 0 6px 20px rgba(0,0,0,0.35);
}
.brand-text[b-e5lt64qx04] {
display: inline-flex;
align-items: center;
gap: 10px;
}
.brand-name[b-e5lt64qx04] {
font-weight: 800;
font-size: 18px;
letter-spacing: 0.2px;
color: #e8eef7;
}
.brand-badge[b-e5lt64qx04] {
font-size: 12px;
font-weight: 700;
color: #c7d2fe;
padding: 4px 10px;
border-radius: 999px;
background: rgba(99, 102, 241, 0.18);
border: 1px solid rgba(99, 102, 241, 0.25);
}
.spacer[b-e5lt64qx04] {
flex: 1;
min-width: 10px;
}
.right[b-e5lt64qx04] {
display: flex;
align-items: center;
gap: 14px;
min-width: 0;
}
.who[b-e5lt64qx04] {
display: flex;
align-items: center;
gap: 10px;
padding: 6px 10px;
border-radius: 12px;
background: rgba(255,255,255,0.04);
border: 1px solid rgba(255,255,255,0.06);
min-width: 0;
flex-wrap: wrap;
}
.who-item[b-e5lt64qx04] {
display: inline-flex;
align-items: baseline;
gap: 6px;
white-space: nowrap;
}
.who-label[b-e5lt64qx04] {
font-size: 12px;
color: rgba(232, 238, 247, 0.65);
}
.who-value[b-e5lt64qx04] {
font-size: 13px;
color: #e8eef7;
font-weight: 800;
}
.who-sep[b-e5lt64qx04] {
color: rgba(232, 238, 247, 0.25);
}
/* Logout ist jetzt */
.logout[b-e5lt64qx04] {
border: 1px solid rgba(255,255,255,0.10);
background: rgba(255,255,255,0.06);
color: #e8eef7;
padding: 8px 12px;
border-radius: 12px;
cursor: pointer;
font-weight: 700;
text-decoration: none;
display: inline-flex;
align-items: center;
}
.logout:hover[b-e5lt64qx04] {
background: rgba(255,255,255,0.10);
text-decoration: none;
}
.content[b-e5lt64qx04] {
padding: 18px;
}
/* Tablet/Handy: nur User zeigen */
@media (max-width: 900px) {
.who .who-item[b-e5lt64qx04] {
display: none;
}
.who .who-sep[b-e5lt64qx04] {
display: none;
}
/* 2. who-item ist "User" (weil du Mandant • User • Betrieb hast) */
.who .who-item:nth-of-type(2)[b-e5lt64qx04] {
display: inline-flex;
}
}