/* עיצוב כללי לגוף הדף */
body {
    font-family: 'Inter', sans-serif;
    display: flex;
    justify-content: center;
    align-items: center;
    min-height: 100vh;
    background-color: #f0f4f8; /* רקע אפור-כחול בהיר */
    margin: 0;
    padding: 20px;
    box-sizing: border-box;
    direction: rtl; /* יישור מימין לשמאל לכלל הדף */
}
/* עיצוב קונטיינר מרכזי */
.container {
    background-color: #ffffff;
    padding: 30px;
    border-radius: 15px;
    box-shadow: 0 10px 25px rgba(0, 0, 0, 0.1);
    /* text-align: center; - הוסר מכאן כי נשלט על ידי Tailwind */
    max-width: 400px;
    width: 100%;
    display: flex;
    flex-direction: column;
    gap: 20px; /* רווח בין סעיפים */
}
/* עיצוב כותרת ראשית */
h1 {
    color: #2c3e50; /* כחול-אפור כהה */
    margin-bottom: 10px;
    font-size: 2.5rem;
}
/* עיצוב תווית (לייבל) */
label {
    display: block;
    margin-bottom: 15px;
    font-size: 1.2rem;
    color: #34495e; /* כחול-אפור בינוני */
    /* text-align: right; - הוסר כדי לאפשר למרכז */
}
/* עיצוב תיבת קלט טקסט */
input[type="text"], input[type="date"], input[type="password"] {
    /* הוסר width: 80%; כדי לאפשר ל-Tailwind לשלוט ברוחב */
    padding: 12px 10px;
    margin: 0 auto 20px auto; /* ריכוז ורווח תחתון */
    border: 2px solid #cbd5e0; /* גבול אפור בהיר */
    border-radius: 8px;
    font-size: 1.1rem;
    box-sizing: border-box;
    transition: border-color 0.3s ease;
    /* text-align: right; - הוסר כדי לאפשר למרכז */
}
/* עיצוב תיבת קלט במיקוד (כאשר לוחצים עליה) */
input[type="text"]:focus, input[type="date"]:focus, input[type="password"]:focus {
    outline: none;
    border-color: #3b82f6; /* גבול כחול במיקוד */
    box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.25);
}
/* עיצוב כפתור */
button {
    background-color: #10B981; /* ירוק */
    color: white;
    padding: 15px 30px; /* הוגדל הריפוד */
    border: none;
    border-radius: 8px;
    font-size: 1.2rem; /* הוגדל הגופן */
    cursor: pointer;
    transition: background-color 0.3s ease, transform 0.2s ease;
    box-shadow: 0 6px 15px rgba(0, 0, 0, 0.15); /* צל בולט יותר */
}
/* עיצוב כפתור במעבר עכבר */
button:hover {
    background-color: #059669; /* ירוק כהה יותר במעבר עכבר */
    transform: translateY(-2px);
}
/* עיצוב הודעת ברכה/שגיאה */
#greetingMessage {
    margin-top: 10px;
    font-size: 1.3rem;
    color: #28a745; /* ירוק להודעת הצלחה */
    font-weight: bold;
    text-align: center;
}
.visitors-section {
    margin-top: 20px;
    border-top: 1px solid #e2e8f0;
    padding-top: 20px;
}
.visitors-section h2 {
    font-size: 1.4rem; /* הוקטן גודל הגופן */
    color: #2c3e50;
    margin-bottom: 15px;
}
#visitorsList {
    list-style: none;
    padding: 0;
    max-height: 200px;
    overflow-y: auto;
    border: 1px solid #e2e8f0;
    border-radius: 8px;
    background-color: #f8fafc;
}
#visitorsList li {
    padding: 10px 15px;
    border-bottom: 1px solid #e2e8f0;
    text-align: right;
    color: #4a5568;
    font-size: 1rem;
}
#visitorsList li:last-child {
    border-bottom: none;
}
#userIdDisplay {
    font-size: 0.8rem;
    color: #718096;
    margin-top: 10px;
    word-break: break-all; /* Ensures long IDs wrap */
    text-align: center;
}
/* עיצוב עבור דף ההשמות ודף הטופס */
#assignmentsPage, #visitFormPage {
    background-color: #ffffff;
    padding: 30px;
    border-radius: 15px;
    box-shadow: 0 10px 25px rgba(0, 0, 0, 0.1);
    text-align: center;
    max-width: 90%; /* רוחב גדול יותר לרשימת השמות */
    width: 100%;
    display: flex;
    flex-direction: column;
    gap: 20px;
}
#assignmentsPage h2, #visitFormPage h2 {
    font-size: 2rem;
    color: #2c3e50;
    margin-bottom: 20px;
}
.hidden {
    display: none !important;
}

/* --- עיצוב טבלה (למחשבים ניידים/נייחים) --- */
.assignments-table-container {
    overflow-x: auto; /* מאפשר גלילה אופקית אם הטבלה רחבה מדי */
    width: 100%;
}
#assignmentsTable, #importAssignmentsTable { /* Added #importAssignmentsTable */
    width: 100%;
    border-collapse: collapse;
    margin-top: 10px;
    font-size: 0.9rem;
    text-align: right; /* יישור לימין */
}
#assignmentsTable th, #assignmentsTable td,
#importAssignmentsTable th, #importAssignmentsTable td { /* Added #importAssignmentsTable */
    border: 1px solid #e2e8f0;
    padding: 8px 12px;
    vertical-align: top; /* יישור תוכן לתחילת התא */
}
#assignmentsTable th, #importAssignmentsTable th { /* Added #importAssignmentsTable */
    background-color: #e2e8f0;
    color: #2c3e50;
    font-weight: bold;
    white-space: nowrap; /* מונע שבירת שורות בכותרות */
}
#assignmentsTable tr:nth-child(even), #importAssignmentsTable tr:nth-child(even) { /* Added #importAssignmentsTable */
    background-color: #f8fafc; /* רקע שורות זוגיות */
}
#assignmentsTable tr:hover, #importAssignmentsTable tr:hover { /* Added #importAssignmentsTable */
    background-color: #eef2f6; /* רקע במעבר עכבר */
}
#assignmentsTable td.selectable {
    cursor: pointer; /* מראה שאפשר ללחוץ על התא */
}
/* סגנון לשורה שנבחרה */
#assignmentsTable tr.selected, #importAssignmentsTable tr.selected { /* Added #importAssignmentsTable */
    background-color: #dbeafe; /* כחול בהיר */
    border: 2px solid #3b82f6;
}

/* סגנון לשורה/כרטיסייה שסומנה להורדה/עדכון */
#assignmentsTable tr.downloaded-for-update, .assignment-card.downloaded-for-update {
    background-color: #e0f2f7; /* כחול ירוק בהיר */
    border: 2px solid #00bcd4; /* גבול טורקיז */
    opacity: 0.8; /* קצת שקיפות כדי להבליט */
}


/* --- עיצוב כרטיסיות (לטלפונים/טאבלטים) --- */
.assignments-cards-container {
    display: grid;
    gap: 15px;
    padding: 10px;
    background-color: #f8fafc;
    border-radius: 8px;
    border: 1px solid #e2e8f0;
}
.assignment-card {
    background-color: #ffffff;
    border: 1px solid #cbd5e0;
    border-radius: 10px;
    padding: 15px;
    text-align: right;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.05);
    display: flex;
    flex-direction: column;
    gap: 5px;
}
.assignment-card.selected {
    background-color: #dbeafe; /* כחול בהיר */
    border: 2px solid #3b82f6;
}
.assignment-card span {
    display: block;
    font-size: 0.95rem;
    color: #4a5568;
}
.assignment-card span strong {
    color: #2c3e50;
    font-weight: bold;
    margin-left: 5px; /* רווח בין הכותרת לערך */
}
.assignment-card .card-title {
    font-size: 1.1rem;
    font-weight: bold;
    color: #3b82f6;
    margin-bottom: 10px;
    border-bottom: 1px solid #e2e8f0;
    padding-bottom: 5px;
}
/* סגנון לצ'קבוקס בתוך כרטיס */
.card-checkbox-wrapper {
    display: flex;
    justify-content: flex-end; /* יישור לימין */
    margin-bottom: 10px;
}
.card-checkbox-wrapper input[type="checkbox"] {
    width: auto;
    margin-right: 0;
}

/* --- עיצוב טופס פרטי ביקור --- */
#visitFormPage {
    max-width: 600px; /* רוחב קבוע לטופס במסכים גדולים */
}
#visitFormPage .form-group {
    display: flex;
    flex-direction: column;
    align-items: flex-end; /* יישור לימין */
    margin-bottom: 15px;
}
#visitFormPage .form-group label {
    margin-bottom: 5px;
    font-size: 1rem;
    color: #34495e;
    text-align: right;
    width: 100%;
}
#visitFormPage .form-group input[type="text"],
#visitFormPage .form-group input[type="date"],
#visitFormPage .form-group select {
    width: 100%;
    padding: 10px;
    border: 1px solid #cbd5e0;
    border-radius: 5px;
    font-size: 1rem;
    text-align: right;
    box-sizing: border-box; /* חשוב לוודא שהרוחב כולל ריפוד וגבול */
}
#visitFormPage .form-group input[type="text"]:focus,
#visitFormPage .form-group input[type="date"]:focus,
#visitFormPage .form-group select:focus {
    outline: none;
    border-color: #3b82f6;
    box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.25);
}
#visitFormPage .read-only-field {
    background-color: #e2e8f0;
    padding: 10px;
    border-radius: 5px;
    margin-bottom: 10px;
    font-size: 1rem;
    color: #2c3e50;
    text-align: right;
    font-weight: bold;
}
#visitFormPage .form-actions {
    display: flex;
    justify-content: center;
    gap: 15px;
    margin-top: 20px;
}
#visitFormPage .form-actions button {
    padding: 10px 20px;
    font-size: 1rem;
}
.checkbox-group {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    justify-content: flex-end; /* יישור לימין */
    margin-top: 5px;
    margin-bottom: 15px;
}
.checkbox-group label {
    display: flex;
    align-items: center;
    gap: 5px;
    cursor: pointer;
    width: auto; /* מאפשר לתווית להיות ברוחב התוכן */
    margin-bottom: 0; /* מבטל מרווח תחתון של לייבל כללי */
}
.checkbox-group input[type="checkbox"] {
    margin: 0;
    width: auto;
    margin-right: 0;
}
.signature-field {
    background-color: #e2e8f0;
    padding: 10px;
    border-radius: 5px;
    margin-top: 15px;
    font-size: 1.1rem;
    color: #2c3e50;
    text-align: right;
    font-weight: bold;
}

/* --- עיצוב מפה --- */
#googleMap {
    height: 0; /* גובה מינימלי בהתחלה */
    min-height: 0; /* ודא שאין גובה מינימלי */
    overflow: hidden; /* הסתר תוכן גולש */
    transition: height 0.5s ease-out; /* אנימציה חלקה לגובה */
    width: 100%;
    background-color: #e0e0e0;
    border-radius: 8px;
    margin-top: 20px;
    margin-bottom: 20px;
    border: 1px solid #cbd5e0;
}
#googleMap.expanded {
    height: 400px; /* גובה מלא כאשר מורחב */
    min-height: 400px;
}
.map-actions {
    display: flex;
    justify-content: center;
    gap: 15px;
    margin-top: 10px;
    margin-bottom: 10px;
}
.map-actions button:disabled {
    background-color: #a0aec0;
    cursor: not-allowed;
}

/* --- מדיה קווריות לרספונסיביות --- */
/* הסתר טבלה והצג כרטיסיות במסכים קטנים */
@media (max-width: 768px) {
    .assignments-table-container {
        display: none;
    }
    .assignments-cards-container {
        display: grid; /* הצג כרטיסיות */
    }
    #assignmentsPage, #visitFormPage, #importAssignmentsTable { /* Added #importAssignmentsTable */
        max-width: 100%; /* רוחב מלא במסכים קטנים */
        padding: 15px;
    }
}

/* הסתר כרטיסיות והצג טבלה במסכים גדולים */
@media (min-width: 769px) {
    .assignments-table-container {
        display: block; /* הצג טבלה */
    }
    .assignments-cards-container {
        display: none;
    }
    #assignmentsPage {
        max-width: 900px; /* רוחב גדול יותר לטבלה */
    }
    #visitFormPage, #importAssignmentsTable { /* Added #importAssignmentsTable */
        max-width: 500px; /* רוחב קבוע לטופס במסכים גדולים */
    }
}
#topButtonsBar {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  justify-content: center;
  margin-bottom: 20px;
  position: sticky;
  top: 0;
  background-color: #ffffff;
  padding: 15px 10px;
  z-index: 100;
  border-bottom: 1px solid #e2e8f0;
}

#topButtonsBar button {
  flex: 1 1 calc(50% - 10px);
  min-width: 120px;
}

@media (min-width: 768px) {
  #topButtonsBar button {
    flex: 1 1 auto;
  }
}
@media (max-width: 600px) {
  #topButtonsBar button {
    padding: 8px 10px;
    font-size: 0.85rem;
    min-width: auto;
  }
}
#assignmentsTable th {
  white-space: nowrap; /* מונע שבירת שורות */
  text-align: center;
  font-size: 0.9rem;
  padding: 8px 5px;
}

#assignmentsTable td {
  text-align: center;
  font-size: 0.9rem;
  padding: 6px 5px;
}


#assignmentsTable th:nth-child(1)  /* צ'קבוקס */ {
  width: 60px;
}
#assignmentsTable th:nth-child(2) /* עובד סוציאלי */,
#assignmentsTable th:nth-child(3), /* פעולות */
#assignmentsTable th:nth-child(4) /* כתובת */ {
  width: 140px;
}

#assignmentsTable th:nth-child(5) /* שם מטופל */,
#assignmentsTable th:nth-child(6) /* ת.ז */ {
  width: 120px;
}

#assignmentsTable th:nth-child(7) /* תאריך השמה */,
#assignmentsTable th:nth-child(8) /* טלפון */ {
  width: 110px;
}

#assignmentsTable th:nth-child(9),
#assignmentsTable th:nth-child(10) {
  width: 130px; /* שם מטפל וטלפון */
}

#assignmentsTable th:nth-child(11),
#assignmentsTable th:nth-child(12) {
  width: 110px;
}
.assignment-row.completed {
  background-color: #f0f0f0;
  opacity: 0.6;
}
#assignmentsTable tr.completed {
  background-color: #f8fafc;
  color: #999;
  font-style: italic;
}