/* Grupa Lejdis Worker - Styles */
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&family=Quicksand:wght@400;500;600;700;800&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:opsz,wght,FILL,GRAD@20..48,100..700,0..1,-50..200');

:root {
	--mark:#cc0645;
	--mark-light:#f93f7a;
	--mark-dark:#9a0534;
	--mark2:var(--mark);
	--mark2-light:var(--mark-light);
	--mark2-dark:var(--mark-dark);
	--grey-dark:#424242;
	--grey-darker:#272727;
	--grey:#888888;
	--grey-light:#e6e6e6;
	--grey-lighter:#f1f2f6;
	--black:#000;
	--white:#fff;
	--red:#D63024;
	--red-light:#FF5F5D;
	--red-dark:#AE170C;
	--green:#AED581;
	--green-light:#C5E1A5;
	--green-dark:#116201;
	--yellow:#ff0;
	--font-family-header: 'Quicksand', sans-serif;
    --font-family-header-light: 400;
    --font-family-header-regular: 500;
    --font-family-header-medium: 600;
    --font-family-header-bold: 700;
    --font-family-header-extra-bold: 800;
    --font-family-text: 'Inter', sans-serif;
    --font-family-text-light: 400;
    --font-family-text-regular: 500;
    --font-family-text-medium: 600;
    --font-family-text-bold: 700;
	--font-family-icon-google: 'Material Symbols Outlined';
	scroll-behavior: smooth;
}

* {margin:0;padding:0;box-sizing:border-box;}

body {font-family:var(--font-family-text);font-size:16px;line-height:1.4em;color:var(--grey-dark);background:var(--white);margin:0;padding:0;}

.material-symbols-outlined {font-family:var(--font-family-icon-google);font-variation-settings:'FILL' 0,'wght' 400,'GRAD' 0,'opsz' 24;}

/* Container */
.container {width:100%;max-width:1400px;margin:0 auto;padding:0 2rem;}

/* Header */
header.app-header {background:var(--grey-lighter);border-bottom:solid 1px var(--grey-light);padding:1rem 0;}
header.app-header .header-content {display:flex;justify-content:space-between;align-items:center;}
header.app-header .logo {font-family:var(--font-family-header);font-size:1.5rem;font-weight:var(--font-family-header-bold);color:var(--mark);}
header.app-header .user-info {display:flex;align-items:center;gap:1rem;}
header.app-header .user-info .username {font-weight:var(--font-family-text-medium);}
header.app-header .user-info .logout {background:var(--mark);color:var(--white);padding:.5rem 1rem;border-radius:.5rem;text-decoration:none;font-size:.9rem;}
header.app-header .user-info .logout:hover {background:var(--mark-dark);}

/* Main content */
main {padding:2rem 0;min-height:calc(100vh - 200px);}

/* Buttons */
.button {background:var(--mark);padding:.7em 1em;border-radius:1em;color:var(--white);margin:0 .2em;display:inline-block;cursor:pointer;transition:.4s all;border:0;font-family:var(--font-family-text);font-size:14px;font-weight:var(--font-family-text-medium);letter-spacing:1.25px;text-decoration:none;}
.button:hover {background:var(--mark-dark);color:var(--white);}
.button.button-secondary {background:var(--grey);color:var(--white);}
.button.button-secondary:hover {background:var(--grey-dark);}
.button.button-outline {background:var(--white);color:var(--mark);border:solid 2px var(--mark);}
.button.button-outline:hover {background:var(--mark);color:var(--white);}
.button.button-success {background:var(--green-dark);color:var(--white);}
.button.button-success:hover {background:var(--green);}
.button.button-danger {background:var(--red);color:var(--white);}
.button.button-danger:hover {background:var(--red-dark);}

/* Forms */
input, select, textarea {display:block;width:100%;margin:0;padding:.7rem .9rem;border:solid 1px var(--grey-lighter);border-radius:4px;letter-spacing:.25px;transition:.2s all;font-size:14px;font-family:var(--font-family-text);}
input:hover, select:hover, textarea:hover {border:solid 1px var(--grey-light);}
input:focus, select:focus, textarea:focus {border:solid 1px var(--grey-dark);outline:none;}
textarea {min-height:80px;}
label {display:block;margin-bottom:.5rem;font-weight:var(--font-family-text-medium);}
.form-group {margin-bottom:1.5rem;}

/* Cards */
.card {background:var(--white);border:solid 1px var(--grey-lighter);border-radius:1rem;padding:1.5rem;margin-bottom:1.5rem;box-shadow:0px 0px 15px var(--grey-lighter);transition:.4s all;}
.card:hover {box-shadow:0px 0px 15px var(--grey-light);}
.card-header {font-size:1.3rem;font-weight:var(--font-family-header-medium);margin-bottom:1rem;padding-bottom:1rem;border-bottom:solid 1px var(--grey-lighter);}

/* Notifications list */
.notifications-list {display:flex;flex-direction:column;gap:1rem;}
.notification-item {background:var(--white);border:solid 1px var(--grey-lighter);border-left:solid 4px var(--mark);border-radius:.5rem;padding:1rem;transition:.3s all;cursor:pointer;}
.notification-item:hover {box-shadow:0px 0px 10px var(--grey-lighter);}
.notification-item.priority-urgent {border-left-color:var(--red);}
.notification-item.priority-high {border-left-color:var(--mark-dark);}
.notification-item.priority-normal {border-left-color:var(--mark);}
.notification-item.priority-low {border-left-color:var(--grey);}
.notification-item.status-postponed {background:var(--yellow);opacity:.7;}
.notification-item.status-completed {background:var(--green-light);opacity:.7;}
.notification-item.status-delegated {background:var(--grey-lighter);}
.notification-header {display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:.5rem;}
.notification-title {font-weight:var(--font-family-text-medium);font-size:1.1rem;color:var(--grey-darker);}
.notification-time {font-size:.85rem;color:var(--grey);white-space:nowrap;}
.notification-message {color:var(--grey-dark);margin-bottom:.5rem;}
.notification-category {display:inline-block;background:var(--grey-lighter);color:var(--grey-dark);padding:.3rem .6rem;border-radius:.3rem;font-size:.8rem;margin-right:.5rem;}
.notification-actions {display:flex;gap:.5rem;margin-top:1rem;flex-wrap:wrap;}
.notification-actions .button {margin:0;padding:.5rem 1rem;font-size:.85rem;}

/* Modal */
.modal {display:none;position:fixed;top:0;left:0;width:100%;height:100%;background:rgba(0,0,0,0.7);z-index:10000;align-items:center;justify-content:center;}
.modal.active {display:flex;}
.modal-content {background:var(--white);border-radius:1rem;padding:2rem;max-width:600px;width:90%;max-height:90vh;overflow-y:auto;}
.modal-header {display:flex;justify-content:space-between;align-items:center;margin-bottom:1.5rem;}
.modal-title {font-size:1.5rem;font-weight:var(--font-family-header-medium);}
.modal-close {background:transparent;border:0;font-size:2rem;cursor:pointer;color:var(--grey);padding:0;width:2rem;height:2rem;display:flex;align-items:center;justify-content:center;}
.modal-close:hover {color:var(--grey-dark);}
.modal-body {margin-bottom:1.5rem;}
.modal-footer {display:flex;gap:1rem;justify-content:flex-end;}

/* Tables */
table {width:100%;border-collapse:collapse;margin:1rem 0;}
table th {background:var(--grey-lighter);border:solid 1px var(--grey-light);padding:.7rem;text-align:left;font-weight:var(--font-family-text-medium);}
table td {border:solid 1px var(--grey-lighter);padding:.7rem;vertical-align:top;}
table tr:hover td {background:var(--grey-lighter);}

/* Filters */
.filters {display:flex;gap:1rem;margin-bottom:2rem;flex-wrap:wrap;align-items:center;}
.filters .form-group {margin-bottom:0;flex:1;min-width:200px;}

/* Stats */
.stats {display:grid;grid-template-columns:repeat(auto-fit, minmax(200px, 1fr));gap:1rem;margin-bottom:2rem;}
.stat-card {background:var(--white);border:solid 1px var(--grey-lighter);border-radius:.5rem;padding:1.5rem;text-align:center;}
.stat-number {font-size:2.5rem;font-weight:var(--font-family-header-bold);color:var(--mark);margin-bottom:.5rem;}
.stat-label {color:var(--grey);font-size:.9rem;}

/* Alert */
.alert {padding:1rem;border-radius:.5rem;margin-bottom:1rem;}
.alert-success {background:var(--green-light);color:var(--green-dark);border:solid 1px var(--green);}
.alert-error {background:var(--red-light);color:var(--white);border:solid 1px var(--red);}
.alert-warning {background:var(--yellow);color:var(--grey-darker);border:solid 1px var(--mark);}
.alert-info {background:var(--grey-lighter);color:var(--grey-dark);border:solid 1px var(--grey-light);}

/* Loading spinner */
.spinner {border:4px solid var(--grey-lighter);border-top:4px solid var(--mark);border-radius:50%;width:40px;height:40px;animation:spin 1s linear infinite;margin:2rem auto;}
@keyframes spin {0% {transform:rotate(0deg);} 100% {transform:rotate(360deg);}}

/* Responsive */
@media (max-width: 768px) {
	.container {padding:0 1rem;}
	header.app-header .header-content {flex-direction:column;gap:1rem;align-items:flex-start;}
	.notification-header {flex-direction:column;gap:.5rem;}
	.notification-actions {flex-direction:column;}
	.notification-actions .button {width:100%;}
	.filters {flex-direction:column;}
	.filters .form-group {min-width:100%;}
	.modal-content {width:95%;padding:1rem;}
	.stats {grid-template-columns:1fr;}
}