:root{--background-light: #f0f2f5;--text-light: #333;--container-light: #fff;--header-border-light: #eee;--table-border-light: #ddd;--th-background-light: #f2f2f2;--row-hover-light: #f9f9f9;--input-background-light: #333;--input-text-light: #fff;--background-dark: #1a1a1a;--text-dark: #f0f0f0;--container-dark: #2a2a2a;--header-border-dark: #444;--table-border-dark: #444;--th-background-dark: #3a3a3a;--row-hover-dark: #333;--input-background-dark: #444;--input-text-dark: #f0f0f0}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica,Arial,sans-serif;background-color:var(--background-light);color:var(--text-light);margin:0;padding:20px;transition:background-color .3s,color .3s}.container{width:95%;max-width:1200px;margin:0 auto;background-color:var(--container-light);padding:2vw;border-radius:8px;box-shadow:0 2px 10px #0000001a;transition:background-color .3s}th:nth-child(1),td:nth-child(1){width:50%}th:nth-child(2),td:nth-child(2){width:15%}th:nth-child(3),td:nth-child(3){width:15%}th:nth-child(4),td:nth-child(4){width:10%}th:nth-child(5),td:nth-child(5){width:10%}.header{display:flex;align-items:center;margin-bottom:20px;border-bottom:1px solid var(--header-border-light);padding-bottom:15px}.logo{width:50px;height:50px;margin-right:15px}h1{font-size:1.8em;color:var(--text-light);margin:0}.controls{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;margin-bottom:20px;gap:15px}.controls p{margin:0;color:var(--text-light)}button{background-color:#3498db;color:#fff;border:none;padding:10px 15px;border-radius:5px;cursor:pointer;font-size:1em;transition:background-color .3s,transform .2s;margin-left:10px}button:hover{transform:translateY(-2px)}#updateDataBtn{background-color:#2ecc71}#sendWaBtn{background-color:#1abc9c}.btn-delete{background-color:#e74c3c}.table-container{overflow-x:auto}table{width:100%;border-collapse:collapse;margin-top:20px;table-layout:fixed}th,td{padding:12px 15px;text-align:left;border-bottom:1px solid var(--table-border-light);word-wrap:break-word}th{background-color:var(--th-background-light);font-weight:600}tbody tr:hover{background-color:var(--row-hover-light)}.hitung-control{display:flex;align-items:center}.hitung-input,.obat-input{text-align:center;border:1px solid #ccc;border-radius:4px;margin:0 5px;padding:5px;background-color:var(--input-background-light);color:var(--input-text-light);box-sizing:border-box}.obat-input,.hitung-input{width:100%}.btn-plus,.btn-minus{display:none}.selisih-plus{color:#27ae60;font-weight:700}.selisih-minus{color:#c0392b;font-weight:700}.stok-rendah{background-color:#f2dede;color:#a94442;font-weight:700}.autocomplete-suggestions{position:absolute;background:var(--container-light);border:1px solid var(--table-border-light);border-top:none;z-index:1000;max-height:200px;overflow-y:auto;box-shadow:0 2px 5px #0000001a}.autocomplete-suggestion{padding:8px 12px;cursor:pointer}.autocomplete-suggestion:hover{background-color:var(--row-hover-light)}@media(prefers-color-scheme:dark){body{background-color:var(--background-dark);color:var(--text-dark)}.container{background-color:var(--container-dark)}.header{border-bottom-color:var(--header-border-dark)}h1,.controls p{color:var(--text-dark)}th{background-color:var(--th-background-dark)}td{border-bottom-color:var(--table-border-dark)}tbody tr:hover{background-color:var(--row-hover-dark)}.hitung-input,.obat-input{background-color:var(--input-background-dark);color:var(--input-text-dark);border-color:var(--header-border-dark)}.btn-plus,.btn-minus{background-color:#555;border-color:#777;color:var(--text-dark)}.autocomplete-suggestions{background:var(--container-dark);border-color:var(--header-border-dark)}.autocomplete-suggestion:hover{background-color:var(--row-hover-dark)}}.last-updated{text-align:center;font-size:.9em;color:#888;margin-top:-10px;margin-bottom:20px}@media screen and (max-width:768px){.button-group{display:flex;flex-direction:column;gap:.5rem;width:100%}.button-group button{width:100%;margin-left:0}.stock-table thead{border:none;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px}.stock-table tr{display:block;margin-bottom:1rem;border:1px solid #555;border-radius:8px;background-color:#3a3a3a;padding:.5rem}.stock-table td{display:flex;justify-content:space-between;align-items:center;text-align:right;padding:.75rem .5rem;border-bottom:1px dotted #555}.stock-table td:last-child{border-bottom:0}.stock-table td:before{content:attr(data-label);font-weight:700;text-transform:uppercase;text-align:left;margin-right:1rem;color:var(--text-dark)}.stock-table td input,.stock-table td button{max-width:150px}}@media(max-width:768px){body{padding:10px}h1{font-size:1.5em}th,td{padding:8px 10px}button{padding:8px 12px;font-size:.9em}}