/* ================ */
/* ==== Global ==== */
/* ================ */
*{box-sizing:border-box}
:root{
  --bg:#f4f6fb;
  --surface:#ffffff;
  --surface-alt:#f7f9fe;
  --border:#e6eaf5;
  --text:#0f1a2b;
  --muted:#6c7a92;
  --accent:#3b82f6;
  --accent-quiet:#e3efff;
  --shadow: none;
}

body{font-family:system-ui,Segoe UI,Roboto,Ubuntu,Inter,Arial; margin:0; background:var(--bg); color:var(--text)}
a{color:var(--accent); text-decoration:none}
header{display:flex;gap:12px;align-items:center; padding:12px 16px; background:#0e131a; border-bottom:1px solid #1f2a36}

.wrap { max-width: 1100px; margin: 0 auto; padding: 8px; }

.btn { cursor: pointer; border:1px solid #e6ebf5; border-radius: 10px; background:#fff; padding:10px 12px; text-decoration:none; color:#111827; display:flex; align-items:center; justify-content:center; gap:8px; }
.btn.primary { border-color:#2563eb; background:#2563eb; color:#fff; }
.btn.full { width:100%; }
.btn.icon { padding:8px 10px; }
.btn.danger { border-color:#ef4444; color:#b91c1c; }
.btn.destructive { border-color:#fecaca; background:#fff; color:#b91c1c; }

.msg{ padding:10px 12px; border-radius: 10px; margin-bottom:10px; }
.msg.ok{ background:#ecfdf5; border:1px solid #a7f3d0; }
.msg.err { background:#fef2f2; border:1px solid #fecaca; color:#7f1d1d; }

.badge { display:inline-flex; align-items:center; gap:6px; padding:4px 8px; border-radius:999px; border:1px solid #e6ebf5; background:#f8fafc; font-size:12px; }
.badge.ok { background:#ecfdf5; border-color:#a7f3d0; color:#065f46; }
.badge.warn { background:#fef3c7; border-color:#fde68a; color:#92400e; }
.badge.alt { background:#eef2ff; border-color:#c7d2fe; color:#3730a3; }

.inp-group { position:relative; display:flex; align-items:center; }
.inp-icoL { position:absolute; left:10px; pointer-events:none; color:#6b7280; }
.inp.padL { padding-left:34px; }

.grid { display:grid; grid-template-columns: 1fr 340px; gap:16px; }
@media (max-width: 980px){ .grid { grid-template-columns: 1fr; } }

.list { display:grid; grid-template-columns: repeat(1, 1fr); gap:10px; }
@media (min-width: 900px){ .list { grid-template-columns: repeat(2, 1fr); } }

.mono { font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace; font-size:10px; }
.range { border:1px solid #e6ebf5; border-radius: 10px; padding:7px 10px; background:#fff; }
.muted { color:#6b7280; font-size:12px; }
.sel, .inp { border:1px solid #e6ebf5; border-radius:12px; background:#fff; padding:9px 12px; }
.item { border:1px solid #e6ebf5; border-radius:12px; padding:12px; background:#fff; display:flex; flex-direction:column; gap:8px; }
.row { display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:8px; }
.name { font-weight:700; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; min-width:0; flex:1; }
.meta { display:flex; align-items:center; gap:10px; flex-wrap:wrap; color:#6b7280; font-size:12px; }
.actions { display:flex; align-items:center; gap:8px; margin-top:4px; }
.tools {display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.hide{display:none !important}
.width100p {width: 100%}
.lbl { font-weight:700; }
.fld { display:flex; flex-direction:column; gap:6px; margin-bottom:10px; }

.card { background:#fff; border:1px solid #e6ebf5; border-radius: 10px; padding: 18px;}
.card .card-hd { display:flex; align-items:center; justify-content:space-between; padding:12px 14px; border-bottom:1px solid #e6ebf5; }
.card .card-bd { padding:12px 14px; }

.toolbar { display:flex; gap:8px; align-items:center; justify-content:space-between; flex-wrap:wrap; margin: 0 0 12px 0; }

.cal { display:grid; grid-template-columns: repeat(7, 1fr); gap:8px; }
.cal-head { display:grid; grid-template-columns: repeat(7, 1fr); gap:8px; margin-bottom:8px; }
.cal-head div { text-align:center; font-weight:700; color:#6b7280; }

.day { border:1px solid #e6ebf5; border-radius:12px; min-height:130px; background:#fff; display:flex; flex-direction:column; }
.day-hd { display:flex; align-items:center; justify-content:space-between; padding:8px 10px; font-weight:700; }
.day-hd .num { font-size:14px; }
.day-hd .add { font-size:12px; }
.day-body { padding:6px 8px; display:flex; flex-direction:column; gap:6px; }
.day.today { border-color:#2563eb; }
.day-empty { color:#94a3b8; font-size:12px; }

/* === Login & Register ===*/
.auth-wrap { min-height:100vh; display:flex; align-items:center; justify-content:center; background:#f3f4f6; padding:24px; }
.auth-card { width:100%; max-width: 560px; background:#fff; border:1px solid #e6ebf5; border-radius:16px; }
.auth-hd { padding:16px 18px; border-bottom:1px solid #e6ebf5; display:flex; align-items:center; justify-content:space-between; }
.auth-title { font-weight:800; display:flex; align-items:center; gap:10px; }
.auth-bd { padding:16px 18px; }



.toggle-eye { position:absolute; right:8px; border:1px solid #e6ebf5; background:#fff; border-radius:10px; padding:6px; cursor:pointer; }
.tag { display:inline-flex; align-items:center; gap:6px; border:1px solid #e6ebf5; border-radius:999px; padding:4px 8px; background:#f8fafc; font-size:12px; }


.foot { display:flex; align-items:center; justify-content:space-between; margin-top:10px; }
.brand { display:flex; align-items:center; gap:8px; color:#111827; text-decoration:none; font-weight:800; }
.brand i { color:#2563eb; }

.grid-lr { display:grid; grid-template-columns: 1fr 1fr; gap:12px; }
@media (max-width:680px){ .grid-lr{ grid-template-columns: 1fr; } }

/* =================== */
/* ==== Dashboard ==== */
/* =================== */
.grid-dash { display:grid; grid-template-columns: 1fr 320px; gap:16px; }
@media (max-width: 980px){ .grid-dash { grid-template-columns: 1fr; } }

.kpi-grid { display:grid; grid-template-columns: repeat(4, 1fr); gap:10px; }
@media (max-width: 640px){ .kpi-grid { grid-template-columns: repeat(2, 1fr); } }
.kpi { border:1px solid #e6ebf5; border-radius: 10px; padding:10px 12px; display:flex; align-items:center; gap:10px; background:#fff; }
.kpi .i { width:30px; height:30px; border-radius: 10px; display:inline-flex; align-items:center; justify-content:center; font-size:14px; }
.kpi .v { font-weight:800; font-size:18px; }
.kpi .l { color:#6c7a92; font-size:12px; }

.qa-grid { display:grid; grid-template-columns: repeat(2, 1fr); gap:10px; }

/* Timeline */
.timeline { position: relative; padding-left: 28px; }
.timeline::before { content:""; position:absolute; left:12px; top:4px; bottom:4px; width: 2px; background: #e6ebf5; }
.day-tl { min-height:110px; background:#fff; display:flex; flex-direction:column; }
.day-tl-title { display:flex; align-items:center; gap:8px; font-weight:700; margin: 8px 0; }
.day-tl-title .dot { width:10px; height:10px; border-radius: 999px; background:#111827; }

.tl-item { position:relative; display:flex; gap:12px; align-items:flex-start; margin: 10px 0; }
.tl-item::before { content:""; position:absolute; left:-16px; top:11px; transform:translateX(-50%); width:10px; height:10px; border-radius: 10px; background:#111827; box-shadow: 0 0 0 4px rgba(53,160,255,.15);}
.tl-body { border:1px solid #e6ebf5; border-radius: 10px; background:#fff; padding:10px 12px; width:100%; border-left-width:4px; border-left-style:solid; }
.tl-row { display:flex; align-items:center; justify-content:space-between; gap:12px; flex-wrap:wrap; }
.tl-left { display:flex; gap:10px; align-items:center; min-width:0; }
.tl-icon { width:28px; height:28px; border-radius: 10px; display:inline-flex; align-items:center; justify-content:center; font-size:14px; }
.tl-title { font-weight:700; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.tl-badge { font-size:12px; border-radius: 10px; padding:4px 8px; border:1px solid transparent; background:#f3f4f6; }
.tl-meta { color:#6c7a92; font-size:10px; display:flex; align-items:center; gap:10px; flex-wrap:wrap; border:1px solid #e6ebf5; border-radius: 10px; padding:7px 10px;}
.tl-time { color:#6b7280; font-size:12px; }
.tl-link { text-decoration:none; color:inherit; }
.tl-link:hover .tl-title { text-decoration: underline; }

.show-more { display:flex; justify-content:center; margin: 10px 0; }

.type-file    { border-left-color:#2563eb; }
.type-note    { border-left-color:#059669; }
.type-project { border-left-color:#7c3aed; }
.type-task    { border-left-color:#d97706; }
.type-event { border-left-color: var(--accent); }


/* ==================== */
/* ===== Calendar ===== */
/* ==================== */
.chip { display:flex; align-items:center; gap:6px; font-size:12px; padding:4px 8px; border-radius:10px; border:1px solid #e6ebf5; background:#f9fafb; flex-wrap:wrap; }
.chip i{min-width:14px;text-align:center}
.chip .time { font-variant-numeric: tabular-nums; }
.chip .u { font-weight:700; max-width:150px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.chip .dot { width:8px; height:8px; border-radius:999px; display:inline-block; }
.chip.vac { background:#fef3c7; border-color:#fde68a; }
.chip-proj { background:#eef2ff; border-color:#c7d2fe; }
.chip-task { background:#ecfeff; border-color:#a5f3fc; }
.chip-file-up { background:#e8fff3; border-color:#bbf7d0; }
.chip-file-del{ background:#fff1f2; border-color:#fecdd3; }


.legend { display:flex; gap:8px; flex-wrap:wrap; }
.leg-item { border:1px solid #e6ebf5; border-radius: 10px; padding:4px 8px; display:flex; align-items:center; gap:6px; }
.leg-dot { width:10px; height:10px; border-radius:999px; display:inline-block; }

.toggles { display:flex; gap:6px; flex-wrap:wrap; }
.tgl { border:1px solid #e6ebf5; border-radius:999px; padding:6px 10px; cursor:pointer; user-select:none; }
.tgl[data-on="0"]{ opacity:.5; }

/* ================= */
/* ==== Project ==== */
/* ================= */
.filters { display:flex; align-items:center; gap:8px; flex-wrap:wrap; }



.top { display:flex; align-items:center; justify-content:space-between; gap:8px; }
.desc { color:#374151; font-size:14px; line-height:1.5; max-height: 3.2em; overflow: hidden; }

.grid-proj{display:grid;grid-template-columns:1fr;gap:10px}
@media(min-width:760px){ .grid-proj{grid-template-columns:1fr 1fr;gap:12px} }

.field{display:flex;flex-direction:column;gap:6px}

.hint{color:#6b7280;font-size:12px}
.inp, .area, .date{ border:1px solid #e6ebf5;border-radius:12px;background:#fff;padding:10px 12px; }
.area {min-height:180px;resize:vertical; width:100%;}

.toggle {display:flex;align-items:center;gap:8px}
.toggle input {width:18px;height:18px}
.counter{font-size:12px;color:#6b7280;margin-left:auto}

/* =============== */
/* ==== Drive ==== */
/* =============== */
.body{padding:10px;display:flex;flex-direction:column;gap:6px}
.time{color:#6b7280;font-size:12px}

.uploader{display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.uploader .vis{border:1px solid #e6ebf5;border-radius:999px;padding:7px 10px;background:#fff}
.uploader input[type="file"]{border:1px solid #e6ebf5;border-radius:12px;padding:7px 10px;background:#fff}

.grid-drive{display:grid;grid-template-columns:repeat(2,1fr);gap:10px}
@media(min-width:900px){ .grid-drive{grid-template-columns:repeat(4,1fr)} }

.tile{
border:1px solid #e6ebf5;border-radius:12px;background:#fff;display:flex;flex-direction:column;
/* ważne: menu nie będzie obcinane */
overflow:visible;
position:relative;
}
.thumb-drive {
aspect-ratio: 4 / 3;
display:flex;align-items:center;justify-content:center;
border-bottom:1px solid #e6ebf5;background:#f8fafc;position:relative;overflow:hidden
}
/* Miniatury – pewne wczytanie i crop */
.thumb-drive img{
width:100%; height:100%;
object-fit:cover; /* pokryj całą miniaturę */
image-rendering:auto;
display:block;
}
.thumb-drive .ico{font-size:36px;color:#64748b}

/* Menu akcji */
.menu{position:relative;flex:0 0 auto}
.menu-btn{border:1px solid #e6ebf5;border-radius:8px;padding:6px 8px;background:#fff}
.menu-list{
position:absolute;right:0;top:36px;min-width:180px;border:1px solid #e6ebf5;background:#fff;border-radius:12px;display:none;z-index:20;
box-shadow:none; /* bez cieni */
}
.menu.open .menu-list{display:block}
.menu-list a{display:flex;align-items:center;gap:8px;padding:8px 10px;text-decoration:none;color:#111827;white-space:nowrap;border-bottom:1px solid #f1f5f9}
.menu-list a:last-child{border-bottom:none}
.menu-list a:hover{background:#f8fafc}

/* Modal podglądu */
.modal{
position:fixed; inset:0; background:rgba(15,23,42,.65); display:none; z-index:1000;
align-items:center; justify-content:center; padding:20px;
}
.modal.open{display:flex}
.modal-box{
background:#fff; border:1px solid #e6ebf5; border-radius:16px; max-width:min(1200px, 96vw); max-height:90vh;
display:flex; flex-direction:column; overflow:hidden;
}
.modal-hd{display:flex; align-items:center; justify-content:space-between; padding:10px 12px; border-bottom:1px solid #e6ebf5}
.modal-bd{padding:0; background:#000; display:flex; align-items:center; justify-content:center; min-height:50vh}
.modal-bd .viewer{width:100%; height:70vh; border:0; display:block; background:#111}
.modal-bd img{max-width:100%; max-height:75vh; display:block}
.modal-ft{padding:10px 12px; border-top:1px solid #e6ebf5; display:flex; gap:8px; justify-content:flex-end}

/* =============== */
/* ==== Hours ==== */
/* =============== */
.list li { display:flex; align-items:center; justify-content:space-between; gap:10px; padding:8px 0; border-bottom:1px solid #f1f5f9; }

.sum-grid { display:grid; grid-template-columns: 1fr 1fr; gap:8px; }
.sum { border:1px solid #e6ebf5; border-radius:12px; padding:10px 12px; }

.txt {min-height:90px;resize:vertical; width:100%; border:1px solid #e6ebf5;border-radius:12px;background:#fff;padding:9px 12px;}

  
/* =============== */
/* ==== Notes ==== */
/* =============== */
.title{font-weight:800;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.content{color:#111827;line-height:1.5;max-height:6.2em;overflow:hidden}

textarea.inp-area{width:100%;min-height:100px;border:1px solid #e6ebf5;border-radius:12px;padding:10px;background:#fff}
textarea.inp{min-height:260px}

/* ================== */
/* ==== Settings ==== */
/* ================== */
.avatar { width:96px; height:96px; border-radius:999px; border:1px solid #e6ebf5; object-fit:cover; background:#f8fafc; }



/* ===== Header (scoped) ===== */
.hdr-bar{position:sticky;top:0;z-index:50;background:#fff;border-bottom:1px solid #e6ebf5}
.hdr-row{max-width:1200px;margin:0 auto;padding:10px 12px;display:flex;align-items:center;gap:12px}

.hdr-brand{display:flex;align-items:center;gap:10px;padding:6px 8px;border:1px solid #e6ebf5;border-radius:12px;background:#fff;text-decoration:none;color:inherit}
.hdr-logo{width:26px;height:26px;border-radius:8px;background:#eef2ff;color:#1f2937;display:inline-flex;align-items:center;justify-content:center;font-size:13px}
.hdr-title{font-weight:800;letter-spacing:.2px}

.hdr-nav{display:flex;align-items:center;gap:6px;margin-left:6px;flex:1}
.hdr-nav a{display:inline-flex;align-items:center;gap:8px;padding:8px 12px;border:1px solid #e6ebf5;border-radius:10px;background:#fff;color:inherit;text-decoration:none;white-space:nowrap}
.hdr-nav a.is-active{border-color:#111827;font-weight:700}
.hdr-nav a i{font-style:normal}

.hdr-burger{display:none;align-items:center;justify-content:center;width:36px;height:36px;border:1px solid #e6ebf5;border-radius:10px;background:#fff}
@media (max-width:860px){
    .hdr-burger{display:flex}
    .hdr-nav.hdr-desktop{display:none}
    .hdr-nav.hdr-mobile{display:none;flex-direction:column;gap:6px;padding:8px 0}
    .hdr-open .hdr-nav.hdr-mobile{display:flex}
}

.hdr-user{display:flex;align-items:center;gap:8px;margin-left:auto}
.hdr-chip{display:flex;align-items:center;gap:8px;border:1px solid #e6ebf5;border-radius:999px;padding:6px 10px;background:#fff}
.hdr-ava{width:26px;height:26px;border-radius:999px;display:inline-flex;align-items:center;justify-content:center;background:#dbeafe;color:#1e3a8a;font-weight:700;font-size:12px}
.hdr-logout{border:1px solid #e6ebf5;border-radius:999px;padding:6px 10px;background:#fff;text-decoration:none;display:inline-flex;gap:8px;align-items:center}

/* FORCE: ukryj mobilne menu domyślnie, niezależnie od globalnych styli */
.hdr-nav.hdr-mobile{ display:none !important; }
@media (max-width:860px){
    .hdr-open .hdr-nav.hdr-mobile{ display:flex !important; }
}

/* ==== Admin ==== */
.col { flex:1 1 0; min-width:320px; }

.table { width:100%; border-collapse:separate; border-spacing:0; }
.table th, .table td { text-align:left; padding:10px 12px; border-bottom:1px solid #eef2f7; vertical-align:middle; }
.table th { font-weight:700; color:#475569; font-size:12px; text-transform:uppercase; letter-spacing:.02em; }
.table tbody tr:last-child td { border-bottom:0; }

.grid2 { display:grid; grid-template-columns: 1fr 1fr; gap:16px; }
@media (max-width: 900px){ .grid2{ grid-template-columns: 1fr; } }

.stat { border:1px solid #e6ebf5; border-radius:12px; padding:10px 12px; display:flex; align-items:center; justify-content:space-between; }
.stat .num { font-weight:800; font-size:18px; }
.token-pill { display:inline-flex; align-items:center; gap:6px; padding:4px 8px; border:1px solid #e6ebf5; border-radius:999px; background:#f8fafc; font-size:12px; }
.link-mini { font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", monospace; font-size:12px; color:#334155; }