/* Basic body styling */
body {
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
    line-height: 1.6; margin: 0; padding: 20px; background-color: #f8f9fa; color: #212529; 
}
/* Centered container */
.container {
    max-width: 900px; margin: 20px auto; padding: 25px; background-color: #ffffff; 
    border-radius: 8px; box-shadow: 0 2px 10px rgba(0, 0, 0, 0.075); border: 1px solid #dee2e6; 
}
/* Header */
.header {
    display: flex; justify-content: space-between; align-items: center; 
    border-bottom: 1px solid #dee2e6; padding-bottom: 15px; margin-bottom: 25px; flex-wrap: wrap; 
    gap: 15px; /* Add gap between logo and controls */
}
/* ** Logo Styling ** */
.header img.logo {
    display: block;
    max-height: 80px; /* Adjust as needed */
    width: auto; /* Maintain aspect ratio */
    margin-right: 15px; /* Space between logo and controls */
}
.header > div { display: flex; align-items: center; flex-wrap: wrap; gap: 10px; margin-left: auto;} /* Push controls to right */
.header p, .header span { margin: 0; color: #6c757d; white-space: nowrap;} 
.header a { color: #007bff; text-decoration: none; } .header a:hover { text-decoration: underline; }

/* Headings */
h1, h2 { color: #343a40; margin-bottom: 15px; }
h2 { border-bottom: 1px solid #eee; padding-bottom: 8px; margin-top: 30px; font-size: 1.5em; }

/* Form */
form div { margin-bottom: 18px; }
label { display: block; margin-bottom: 6px; font-weight: 600; color: #495057; }
.freq-options label, .days-options label, .delete-picture-option label { margin-right: 15px; display: inline-block; cursor: pointer; font-weight: normal; }
.freq-options input, .days-options input, .delete-picture-option input { margin-right: 5px; vertical-align: middle; }

/* Inputs */
input[type="text"], input[type="password"], input[type="file"] {
    width: 100%; padding: 10px 12px; border: 1px solid #ced4da; border-radius: 4px; 
    box-sizing: border-box; font-size: 1rem; transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out; 
}
input[type="text"]:focus, input[type="password"]:focus { border-color: #80bdff; outline: 0; box-shadow: 0 0 0 0.2rem rgba(0, 123, 255, 0.25); }
input[type="file"] { padding: 5px; border: 1px dashed #ced4da; background-color: #f8f9fa; }
input[type=file]::file-selector-button { margin-right: 10px; border: none; background: #007bff; padding: 6px 12px; border-radius: 4px; color: #fff; cursor: pointer; transition: background .2s ease-in-out; }
input[type=file]::file-selector-button:hover { background: #0056b3; }

/* Buttons & Links styled as Buttons */
button, 
.button-link, 
.button-edit, 
.button-print, 
.remove-link,
table#medicine-table-display td a.button-edit,
table#medicine-table-display td a.remove-link 
{
    color: #ffffff; padding: 10px 18px; border: none; border-radius: 4px; cursor: pointer; 
    text-decoration: none; display: inline-block; font-size: 1rem; font-weight: 500; text-align: center; 
    transition: background-color 0.2s ease-in-out, box-shadow 0.1s ease-in-out; 
    box-shadow: 0 1px 3px rgba(0,0,0,0.1); vertical-align: middle; margin-bottom: 3px; 
}
button:active, .button-link:active, .button-edit:active, .button-print:active, .remove-link:active,
table#medicine-table-display td a.button-edit:active, table#medicine-table-display td a.remove-link:active 
{ box-shadow: inset 0 1px 3px rgba(0,0,0,0.2); }
button:disabled, .button-link:disabled, .button-edit:disabled, .button-print:disabled, .remove-link:disabled,
table#medicine-table-display td a.button-edit:disabled, table#medicine-table-display td a.remove-link:disabled 
{ opacity: 0.65; cursor: not-allowed; }


/* Specific Colors/Sizes */
button[type="submit"] { background-color: #28a745; color: #ffffff;} /* Green */
button[type="submit"]:hover { background-color: #218838; }

/* ** Fix for Add Medicine Button Color ** */
.button-link, 
.header > div > a.button-link /* Increased specificity */
{ background-color: #007bff; color: #ffffff !important; padding: 8px 15px; font-size: 0.95em; } /* Blue, ensure white text */
.button-link:hover,
.header > div > a.button-link:hover 
{ background-color: #0056b3; color: #ffffff; }

.button-edit, table#medicine-table-display td a.button-edit { background-color: #ffc107; color: #212529; padding: 6px 12px; font-size: 0.9em; } /* Yellow */
.button-edit:hover, table#medicine-table-display td a.button-edit:hover { background-color: #e0a800; color: #212529; }

.remove-link, table#medicine-table-display td a.remove-link { background-color: #dc3545; color: #ffffff; padding: 6px 12px; font-size: 0.9em; } /* Red */
.remove-link:hover, table#medicine-table-display td a.remove-link:hover { background-color: #c82333; color: #ffffff; }

.button-print { background-color: #6c757d; color: #ffffff; padding: 8px 15px; font-size: 0.95em; } /* Grey Print */
.button-print:hover { background-color: #5a6268; color: #ffffff; }

a.button-link[style*="background-color:#6c757d"] { background-color: #6c757d; color: #ffffff;} /* Grey Cancel */
a.button-link[style*="background-color:#6c757d"]:hover { background-color: #5a6268; }

/* Header Button Alignment */
.header a.button-link, .header button.button-print { font-size: 1em; padding: 8px 15px; margin-right: 0px;} /* Removed right margin, using gap now */

/* Messages */
.message, .error { border: 1px solid transparent; padding: 12px 15px; margin-bottom: 20px; border-radius: 4px; font-size: 0.95rem; }
.message { color: #155724; background-color: #d4edda; border-color: #c3e6cb; }
.error { color: #721c24; background-color: #f8d7da; border-color: #f5c6cb; }

/* HR */
hr { border: 0; border-top: 1px solid #dee2e6; margin: 30px 0; }

/* Table */
table { width: 100%; border-collapse: collapse; margin-top: 20px; font-size: 0.95rem; table-layout: fixed; word-wrap: break-word; }
th, td { border: 1px solid #dee2e6; padding: 10px 12px; text-align: left; vertical-align: middle; }
th { background-color: #e9ecef; font-weight: 600; color: #495057; }
/* ** Column widths Re-Re-Adjusted for more Action/Picture space ** */
table#medicine-table-display th:nth-child(1), table#medicine-table-display td:nth-child(1) { width: 22%; } /* Name */
table#medicine-table-display th:nth-child(2), table#medicine-table-display td:nth-child(2) { width: 10%; } /* Dosage - Reduced */
table#medicine-table-display th:nth-child(3), table#medicine-table-display td:nth-child(3) { width: 22%; } /* Frequency - Reduced */
table#medicine-table-display th:nth-child(4), table#medicine-table-display td:nth-child(4) { width: 14%; } /* Added On - Reduced */
table#medicine-table-display th:nth-child(5), table#medicine-table-display td:nth-child(5) { width: 19%; text-align: center;} /* Action - Increased */
table#medicine-table-display th:nth-child(6), table#medicine-table-display td:nth-child(6) { width: 13%; text-align: center;} /* Picture - Increased */

/* Prevent wrapping in Action column */
table#medicine-table-display td:nth-child(5) { white-space: nowrap; }
/* Add small gap between buttons in action column */
table#medicine-table-display td:nth-child(5) a,
table#medicine-table-display td:nth-child(5) button 
{ margin-right: 4px; }
table#medicine-table-display td:nth-child(5) a:last-child,
table#medicine-table-display td:nth-child(5) button:last-child
{ margin-right: 0; }


tbody tr:nth-child(odd) { background-color: #f8f9fa; } tbody tr:hover { background-color: #e9ecef; }
td img { max-width: 60px; max-height: 60px; height: auto; display: block; border-radius: 4px; margin: 0 auto; border: 1px solid #eee; padding: 2px; }

/* Picture preview in form */
.picture-preview { max-width: 100px; max-height: 100px; margin-top: 5px; display: block; border: 1px solid #eee; padding: 2px; }
.delete-picture-option { margin-left: 10px; font-size: 0.9em; display: inline-block; vertical-align: middle; }

/* Code tag */
code { background-color: #e9ecef; padding: 2px 5px; border-radius: 3px; font-family: SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace; font-size: 0.9em; color: #c7254e; }

/* Frequency checkboxes */
.weekly-days { display: none; margin-top: 10px; padding-left: 20px; border-left: 2px solid #eee; }
.weekly-days.visible { display: block; }

/* Responsive adjustments */
@media (max-width: 768px) { /* Styles identical to v6/v7/v8 */ }