/* === Tile kafelki (p/settings, strony pracownika) === */
.tile {
    cursor: pointer;
    transition: 0.2s;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    text-align: center;
    padding: 1.5rem;
    height: 100%;
}
.tile:hover { transform: translateY(-5px); box-shadow: 0 10px 20px rgba(0,0,0,0.1); }
.tile i    { font-size: 2.5rem; margin-bottom: 1rem; color: var(--main-color); }
.tile h3   { margin: 0; font-size: 1.1rem; color: var(--black); }
.tile p    { margin: 0.5rem 0 0 0; font-size: 0.85rem; color: var(--black3); }

/* Chip statusu na kafelku kadrowym */
.tile-status {
    font-size: 0.72rem; font-weight: 600;
    padding: 2px 9px; border-radius: 20px;
    display: inline-flex; align-items: center; gap: 4px;
    margin-top: 0.6rem;
}
.tile-status i { font-size: 0.72rem; margin-bottom: 0; color: inherit; }
.tile-status--ok       { background: var(--green-bg);  color: var(--green);  }
.tile-status--pending  { background: var(--blue-bg);   color: var(--blue);   }
.tile-status--rejected { background: var(--red-bg);    color: var(--red);    }
.tile-status--empty    { background: var(--white3);    color: var(--black3); }

/* Banner statusu w modalach (dane kadrowe) */
.status-banner {
    padding: 10px 14px; border-radius: 8px;
    margin-bottom: 15px; font-weight: bold;
    display: flex; align-items: center; gap: 8px;
}
.status-banner--pending  { background: var(--blue-bg);   color: var(--blue);   }
.status-banner--accepted { background: var(--green-bg);  color: var(--green);  }
.status-banner--rejected { background: var(--orange-bg); color: var(--orange); }

/* Widget statusu push powiadomień */
#androidPushStatus {
    background: var(--white2);
    transition: all 0.3s ease;
    display: flex; align-items: center; gap: 1rem;
    padding: 1rem; border-radius: 12px; cursor: pointer;
    margin-bottom: 2rem; border: 1px solid var(--border);
}
#androidPushStatus.error   { border-color: var(--red);   background: var(--red-bg); }
#androidPushStatus.success { border-color: var(--green); background: var(--green-bg); }
.status-icon-wrap {
    position: relative; width: 40px; height: 40px;
    display: flex; align-items: center; justify-content: center; font-size: 1.5rem;
}
#androidPushStatus.error   .status-icon-wrap i { color: var(--red);   }
#androidPushStatus.success .status-icon-wrap i { color: var(--green); }
.pulse-ring {
    position: absolute; inset: 0; border-radius: 50%;
    border: 2px solid var(--red); opacity: 0; display: none;
}
#androidPushStatus.error .pulse-ring { display: block; animation: pulse-red 2s infinite; }
@keyframes pulse-red {
    0%   { transform: scale(0.8); opacity: 0.8; }
    100% { transform: scale(2);   opacity: 0;   }
}

/* Push widget — odstęp od nagłówka */
#androidPushStatus { margin-top: 1rem; }

/* === Settings page — inline formularz ustawień === */
.settings-box { display: block !important; padding: 0 !important; }

.settings-section-hdr {
    padding: 0.75rem 1.2rem;
    border-bottom: 1px solid var(--border);
    font-size: 0.75rem; font-weight: 700;
    text-transform: uppercase; letter-spacing: 0.06em;
    color: var(--black3);
}

.settings-row {
    display: flex; justify-content: space-between; align-items: center;
    padding: 0.75rem 1.2rem; border-bottom: 1px solid var(--border); gap: 1rem;
}
.settings-row--block {
    flex-direction: column; align-items: flex-start;
    padding: 0.75rem 1.2rem; border-bottom: 1px solid var(--border); gap: 0.3rem;
}
.settings-row:last-child,
.settings-row--block:last-child { border-bottom: none; }
.settings-row__label  { font-weight: 600; font-size: 0.92rem; color: var(--black); }
.settings-row__desc   { font-size: 0.78rem; color: var(--black3); margin-top: 1px; }
.settings-row__right  { display: flex; align-items: center; gap: 0.6rem; flex-shrink: 0; }
.settings-save-footer { padding: 1rem 1.2rem; border-top: 1px solid var(--border); }

/* Font size selector */
.font-size-options { display: flex; gap: 0.5rem; width: 100%; }
.font-size-options label { flex: 1; }
.font-size-option  {
    display: flex; align-items: center; justify-content: center;
    width: 100%; min-height: 2.4rem; text-align: center; cursor: pointer;
    padding: 0.5rem 0.3rem; border-radius: 8px;
    border: 2px solid var(--border); font-size: 0.82rem;
    background: var(--white2);
    color: var(--black2); transition: border-color 0.15s, color 0.15s, background 0.15s;
}
.font-size-option.active {
    border-color: var(--main-color); color: var(--main-color);
    background: var(--main-bg);
}

/* Sekcja uprawnień systemowych */
.perm-access-header {
    padding: 0.9rem 1.2rem; border-bottom: 1px solid var(--border);
    display: flex; align-items: center; justify-content: space-between;
}
.perm-access-header__title { font-weight: 700; font-size: 0.95rem; color: var(--black); }
.perm-access-header__sub   { font-size: 0.78rem; color: var(--black3); margin-top: 2px; }
.perm-access-row {
    display: flex; align-items: center; justify-content: space-between;
    padding: 0.9rem 1.2rem; gap: 1rem; border-bottom: 1px solid var(--border);
}
.perm-access-row:last-child { border-bottom: none; }
.perm-access-row__left  { display: flex; align-items: center; gap: 0.8rem; min-width: 0; flex: 1; }
.perm-access-row__label { font-weight: 600; font-size: 0.9rem; color: var(--black); }
.perm-access-row__desc  { font-size: 0.77rem; color: var(--black3); }
.perm-access-row__right { display: flex; align-items: center; gap: 0.6rem; flex-shrink: 0; }

/* Baner o nieobecności szefa w p/wolne */
.boss-away-banner {
    display: flex; align-items: center; gap: 8px;
    background: var(--black2); color: var(--white);
    border-radius: 10px; padding: 9px 14px;
    font-size: 0.88rem; font-weight: 600;
    margin-bottom: 12px;
}

/* Legenda wykresu finansowego */
.chart-legend {
    display: flex; gap: 1.2rem; justify-content: center;
    margin-top: 0.5rem; font-size: 0.8rem; color: var(--black2); flex-wrap: wrap;
}
.chart-legend span { display: flex; align-items: center; gap: 4px; }