:root{--primary-color:#1565c0;--primary-gradient:linear-gradient(135deg, #1565c0 0%, #42a5f5 100%);--primary-light:#42a5f5;--header-bg-light:#e3f2fd;--main-bg-color:#f0f2f5;--surface-color:#fff;--accent-color:#2e7d32;--accent-gradient:linear-gradient(135deg, #2e7d32 0%, #66bb6a 100%);--danger-color:#c62828;--danger-gradient:linear-gradient(135deg, #c62828 0%, #ef5350 100%);--text-color:#1a202c;--text-light:#718096;--border-color:#e2e8f0;--white-color:#fff;--shadow-sm:0 2px 4px #94a3b81a;--shadow-md:0 8px 16px #94a3b826;--login-button-bg:#2962ff}*{box-sizing:border-box}#root{flex-direction:column;height:100%;display:flex}html,body{height:100%;margin:0;padding:0}body{background-color:var(--main-bg-color);color:var(--text-color);-webkit-text-size-adjust:100%;flex-direction:column;min-height:100vh;margin:0;font-family:Roboto,Segoe UI,sans-serif;font-size:12.5px;font-weight:500;line-height:1.4;display:flex}#login-screen{background:url(https://firebasestorage.googleapis.com/v0/b/giamsattauthan.firebasestorage.app/o/assets%2Floginbackground.png?alt=media&token=7bfec3b1-2942-4596-a5d0-8f0274c06663) 50%/cover no-repeat;flex-grow:1;justify-content:center;align-items:center;width:100%;min-height:100%;padding:15px;display:flex}.login-container{-webkit-backdrop-filter:blur(10px);text-align:center;color:#fdfdfc;background:#5874f363;border:1px solid #fff6;border-radius:20px;flex-direction:column;width:100%;max-width:390px;padding:40px;display:flex;position:relative;overflow:hidden;box-shadow:0 20px 50px #0000001a}.login-container h2{text-shadow:0 2px 4px #0003;white-space:nowrap;margin:0 0 10px;font-size:1.4rem;font-weight:600;line-height:1.3}.login-container .subtitle{color:#f8a304;text-transform:uppercase;letter-spacing:1.5px;text-shadow:1px 1px 2px #00000080,0 0 15px #f8a30466;z-index:2;margin-bottom:30px;font-size:1rem;font-weight:800;position:relative}.login-container input{background-color:#ffffffe6;border:1px solid #ffffff80;border-radius:12px;width:100%;margin-bottom:18px;padding:14px 18px;font-size:1rem;transition:all .3s}.login-container input:focus{background-color:#fff;outline:none;box-shadow:0 0 0 4px #42a5f566}#login-form button{width:100%;color:var(--white-color);cursor:pointer;background:linear-gradient(135deg,#2979ff 0%,#1565c0 100%);border:none;border-radius:12px;justify-content:center;align-items:center;gap:10px;padding:15px;font-size:1rem;font-weight:700;transition:transform .2s;display:flex;box-shadow:0 5px 15px #1565c04d}#login-form button:hover{transform:translateY(-2px)}#login-error{background:#d32f2fcc;border-radius:8px;margin-top:15px;padding:10px;display:none}@media (width<=480px){.login-container h2{white-space:normal;font-size:1.5rem}.login-container{padding:30px 20px}}#main-app{flex-direction:column;width:100%;display:none}.app-header-container{z-index:999;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);box-shadow:var(--shadow-sm);border-bottom:1px solid var(--border-color);background-color:#fffffff2;padding-top:10px;padding-bottom:15px;position:sticky;top:0}.app-header{flex-direction:column;align-items:flex-end;display:flex;position:absolute;top:15px;right:25px}.app-header .user-info{background:#f1f5f9;border-radius:20px;margin-bottom:5px;padding:6px 15px;font-size:.8rem}.user-info span{color:var(--primary-color);font-weight:700}.app-logo{filter:drop-shadow(0 2px 4px #0000001a);background-color:#fff0;border-radius:15px;width:auto;height:90px;position:absolute;top:10px;left:20px}.header-title{text-align:center;flex-direction:column;justify-content:center;min-height:110px;padding:10px 140px;display:flex}.header-title h1{text-transform:uppercase;-webkit-text-fill-color:#fff0;background:linear-gradient(90deg,#1565c0 10%,#08f7fe 30%,#1565c0 100%) 0 0/200%;-webkit-background-clip:text;background-clip:text;margin:0 0 5px;font-size:1.5rem;font-weight:800;animation:20s linear infinite shine}@keyframes shine{0%{background-position:200%}.4%{background-position:-200%}to{background-position:-200%}}.header-title h2{color:#f57c00;margin:0;font-size:1rem;font-weight:600;animation:3s ease-in-out infinite pulse-glow}@keyframes pulse-glow{0%,to{opacity:1;text-shadow:0 0 5px #f57c0033}50%{opacity:.8;text-shadow:0 0 15px #f57c0080}}.tab-container{justify-content:center;gap:8px;margin-top:5px;padding:0 25px;display:flex}.tab-button{cursor:pointer;color:#4d4e5e;box-shadow:var(--shadow-sm);background-color:#fff;border:none;border-radius:30px;padding:10px 20px;font-size:.85rem;font-weight:600;transition:all .3s}.tab-button:hover{color:var(--primary-color);transform:translateY(-2px)}.tab-button.active{background:var(--primary-gradient);color:#fff;box-shadow:0 4px 10px #2196f366}.tab-content{animation:.3s fadeIn;display:none}.tab-content.active{display:block}@keyframes fadeIn{0%{opacity:0;transform:translateY(5px)}to{opacity:1;transform:translateY(0)}}.dashboard-grid{grid-template-columns:repeat(4,1fr);align-items:stretch;gap:20px;display:grid}.status-column{flex-direction:column;height:100%;min-height:350px;display:flex}.status-column .card-body{flex-direction:column;flex-grow:1;padding:0;display:flex}.ship-count{color:#fff;background:#ffffff40;border:1px solid #ffffff4d;border-radius:10px;padding:2px 8px;font-size:.75rem;font-weight:700}.notification-list{background:#fff;flex-grow:1;max-height:400px;margin:0;padding:0;list-style:none;overflow-y:auto}.notification-item{border-bottom:1px solid #f1f1f1;border-left:3px solid #fff0;padding:10px 15px;font-size:.75rem;transition:background .2s}.notification-item:hover{border-left-color:var(--primary-color);background-color:#f8fafc}.notification-item span{color:#000;font-size:.75rem;font-weight:700}.card{background:var(--white-color);box-shadow:var(--shadow-md);border:none;border-radius:16px;margin-bottom:25px;overflow:hidden}.card-header{border-bottom:1px solid var(--border-color);background:linear-gradient(90deg,#fff,#f8fafc);justify-content:space-between;align-items:center;padding:12px 20px;display:flex}.status-column .card-header{background:var(--primary-gradient)}.status-column .card-header h3{color:#fff;margin:0;font-size:1rem}.card-header h2,.card-header h3{color:var(--primary-color);margin:0;font-size:1rem;font-weight:700}.card-body{padding:20px}.stages-grid{grid-template-columns:repeat(4,1fr);gap:15px;width:100%;display:grid}.stages-grid .card{height:100%;box-shadow:var(--shadow-sm);margin-bottom:0}.stages-grid .card-header{padding:8px 12px}.stages-grid .card-header h3{font-size:.9rem}.stages-grid .card-body{padding:15px;overflow:hidden}.stages-grid .form-group{flex-direction:column;align-items:stretch;gap:4px;width:100%;margin-bottom:10px}.stages-grid .form-group label{width:100%;color:var(--text-light);margin:0;font-size:.75rem}.stages-grid .form-group input,.stages-grid .form-group select{box-sizing:border-box;height:32px;padding:6px 10px;font-size:.85rem;width:100%!important;max-width:100%!important}.stages-grid button{width:100%;margin-top:8px;margin-right:0;padding:8px;font-size:.85rem}button{cursor:pointer;text-transform:uppercase;box-shadow:var(--shadow-sm);border:none;border-radius:8px;justify-content:center;align-items:center;padding:8px 16px;font-size:.85rem;font-weight:600;transition:all .2s;display:inline-flex}button:hover{filter:brightness(1.05);transform:translateY(-2px)}button.primary{background:var(--primary-gradient);color:#fff}button.accent{background:var(--accent-gradient);color:#fff}button.danger{background:var(--danger-gradient);color:#fff}button.secondary{color:var(--text-color);box-shadow:none;background-color:#e2e8f0}#logout-button{background:var(--danger-gradient);color:#fff;border-radius:20px;margin-top:2px;padding:4px 10px;font-size:.7rem}.form-group{flex-wrap:wrap;align-items:center;gap:15px;margin-bottom:15px;display:flex}.form-group label{width:160px;color:var(--text-color);font-size:.9rem;font-weight:600}.form-group input,.form-group select,.form-group textarea{border:1px solid var(--border-color);background:#f9fafb;border-radius:8px;flex:1;padding:8px 12px;font-size:.9rem}.form-group input:focus{border-color:var(--primary-light);background:#fff;outline:none;box-shadow:0 0 0 3px #42a5f526}.table-container{width:100%;box-shadow:var(--shadow-sm);border:1px solid var(--border-color);background:#fff;border-radius:12px;overflow-x:auto}table{border-collapse:separate;border-spacing:0;width:100%}th{border-bottom:1px solid var(--border-color);background:var(--header-bg-light);color:var(--primary-color);text-transform:uppercase;word-wrap:break-word;overflow-wrap:break-word;padding:8px 4px;font-size:.8rem;font-weight:700;line-height:1.3;text-align:center!important;vertical-align:middle!important;white-space:normal!important}td{text-align:left;border-bottom:1px solid var(--border-color);padding:10px;font-size:.75rem}tr:hover td{background-color:#f0f7ff}tr:last-child td{border-bottom:none}td.actions-cell{text-align:center}td.actions-cell button{padding:4px 8px;font-size:.7rem}.pagination{justify-content:center;align-items:center;gap:10px;width:100%;margin-top:20px;display:flex}#domestic-stats-container,#imported-stats-container{grid-template-columns:repeat(2,1fr);gap:20px;width:100%;margin-top:20px;display:grid}.stats-display{border:1px solid var(--border-color);box-shadow:var(--shadow-sm);background:#fff;border-radius:16px;flex-direction:row;justify-content:space-between;align-items:center;height:100%;margin-top:0;padding:25px;display:flex}.stats-info{flex:1;min-width:200px;padding-right:20px}.stats-info p{margin:8px 0;font-size:.95rem;line-height:1.5}.stats-info strong{color:var(--primary-color)}.stats-chart{flex:0 0 300px;justify-content:center;align-items:center;width:300px;height:300px;display:flex}@media (width<=1400px){#domestic-stats-container,#imported-stats-container{grid-template-columns:1fr}.stats-display{justify-content:center}}@media (width<=600px){.stats-display{text-align:center;flex-direction:column}.stats-info{padding-bottom:20px;padding-right:0}}.modal{z-index:2000;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);background-color:#0f172a99;justify-content:center;align-items:center;width:100%;height:100%;display:none;position:fixed;top:0;left:0}.modal.active{display:flex}.modal-content{background:#fff;border-radius:20px;width:90%;max-width:600px;max-height:90vh;padding:25px;animation:.3s slideDown;position:relative;overflow-y:auto;box-shadow:0 25px 50px -12px #00000040}@keyframes slideDown{0%{opacity:0;transform:translateY(-30px)}to{opacity:1;transform:translateY(0)}}.close-button{cursor:pointer;background:#f1f5f9;border-radius:50%;justify-content:center;align-items:center;width:30px;height:30px;transition:all .2s;display:flex;position:absolute;top:15px;right:15px}.close-button:hover{color:#ef4444;background:#fee2e2}.search-bar{gap:10px;margin-bottom:15px;display:flex}.search-bar input{box-shadow:var(--shadow-sm);border-radius:30px;padding:8px 15px;font-size:.9rem}.search-bar button{border-radius:30px;padding:8px 20px}@media (width<=1300px){.dashboard-grid,.stages-grid{grid-template-columns:repeat(2,1fr)}}@media (width<=768px){main{padding:15px}.dashboard-grid,.stages-grid{grid-template-columns:1fr}.status-column{min-height:auto}.header-title{min-height:auto;margin-top:60px;padding:0 10px}.header-title h1{font-size:1.2rem}.header-title h2{font-size:.9rem}.app-logo{top:10px;left:10px;height:60px!important}.app-header{top:10px;right:10px}.tab-container{background:#fff;justify-content:flex-start;padding:5px 15px;overflow-x:auto}.tab-button{white-space:nowrap;flex-shrink:0;padding:8px 16px}.login-container{width:85%;padding:30px 20px}.stats-display{flex-direction:column}.stats-chart{max-width:100%;margin-top:20px}}.loading-overlay{-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);z-index:9999;color:#fff;background:#0f172ab3;flex-direction:column;justify-content:center;align-items:center;width:100%;height:100%;font-weight:700;display:flex;position:fixed;top:0;left:0}.spinner{border:4px solid #fff3;border-top-color:var(--accent-color);border-radius:50%;width:45px;height:45px;margin-bottom:15px;animation:.8s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}tr.group-odd{background-color:#fff!important}tr.group-even{background-color:#f8fafc!important}tr.group-summary{border-top:2px solid #4caf50;font-weight:700;background-color:#e8f5e9!important}th,td{text-align:left;border-bottom:1px solid #0000001f;border-right:1px solid #0000001a;padding:10px}th:last-child,td:last-child{border-right:none;border-bottom:1px solid var(--border-color)}.btn-yellow,button.warning{border:none;transition:all .2s;color:#263238!important;background:linear-gradient(135deg,#ffa726 0%,#f57c00 100%)!important;font-weight:800!important;box-shadow:0 4px 6px #f57c004d!important}.btn-yellow:hover,button.warning:hover{transform:translateY(-2px);background:linear-gradient(135deg,#ffb74d 0%,#ef6c00 100%)!important;box-shadow:0 6px 12px #f57c0066!important}.history-item{border:1px solid var(--border-color);box-shadow:var(--shadow-sm);background-color:#fff;border-radius:12px;margin-bottom:20px;padding:20px;position:relative;overflow:hidden}.history-item:before{content:"";background-color:var(--primary-light);width:4px;position:absolute;top:0;bottom:0;left:0}.history-item h4{color:var(--primary-color);border-bottom:1px solid #f1f5f9;margin-top:0;margin-bottom:12px;padding-bottom:10px;font-size:1rem;font-weight:800}.history-item p{color:var(--text-color);margin:6px 0;font-size:.9rem;line-height:1.5}.history-item strong{color:#374151;margin-right:5px;font-weight:700}.history-item:hover{box-shadow:var(--shadow-md);border-color:var(--primary-light);transition:all .3s;transform:translateY(-2px)}.stages-grid button:disabled{cursor:not-allowed;color:#fff!important;opacity:1!important;box-shadow:none!important;background:#607d8b!important;border:1px solid #455a64!important}.child-ship-title{color:#0d47a1;background:linear-gradient(90deg,#e3f2fd,#fff);border-left:5px solid #1976d2;border-radius:8px;margin-bottom:20px;padding:12px 20px;font-size:1.1rem;font-weight:800;box-shadow:0 4px 6px #0000000d}#lightship-table-body button:disabled{cursor:default;color:#fff!important;box-shadow:none!important;opacity:1!important;background:#78909c!important;border:1px solid #b0bec5!important;padding:3px 8px!important;font-size:10px!important}.header-actions{align-items:center;gap:12px;margin-top:4px;display:flex}.hdsd-link{color:var(--primary-color);background-color:#e3f2fd;border:1px solid #fff0;border-radius:15px;align-items:center;gap:5px;padding:4px 10px;font-size:.8rem;font-weight:700;text-decoration:none;transition:all .2s;display:flex}.hdsd-link:hover{background-color:#bbdefb;transform:translateY(-1px);box-shadow:0 2px 4px #0000001a}#logout-button{margin-top:0!important}.weather-widget{color:#2d6df7;letter-spacing:.3px;opacity:0;background:linear-gradient(135deg,#7eab6a 10%,#d2f1c4 20%);border:1px solid #fff3;border-radius:25px;justify-content:center;align-items:center;width:fit-content;margin-top:6px;margin-left:auto;margin-right:0;padding:6px 18px;font-family:Roboto,sans-serif;font-size:13px;font-weight:500;transition:all .5s ease-in-out;display:flex;box-shadow:0 4px 6px #0003}.weather-widget.show{opacity:1;transform:translateY(0)}.weather-location{color:#0c29c9;text-transform:uppercase;text-shadow:0 1px 2px #0003;margin-right:10px;font-weight:800}.weather-separator{color:#fff;margin:0 8px;font-weight:300}.weather-icon-param{color:#b3e5fc;margin-right:4px}.notification-widget{float:left;color:#fff;background:linear-gradient(135deg,#ff512f 0%,#dd2476 100%);border:1px solid #fff3;border-radius:25px;align-items:center;width:45%;margin-top:5px;margin-left:1px;padding:6px 15px;font-family:Roboto,sans-serif;font-size:14px;font-weight:500;display:flex;position:relative;overflow:hidden;box-shadow:0 4px 6px #0003}.icon-gap{margin-right:8px}.bell-icon{color:#ffeb3b;margin-right:10px;font-size:1.2em;animation:2s infinite shake}.marquee-content{white-space:nowrap;flex-grow:1;position:relative;overflow:hidden;-webkit-mask-image:linear-gradient(90deg,#0000,#000 10% 90%,#0000);mask-image:linear-gradient(90deg,#0000,#000 10% 90%,#0000)}#marquee-text{will-change:transform;-webkit-backface-visibility:hidden;perspective:1000px;padding-left:100%;animation:45s linear infinite marquee-scroll;display:inline-block;transform:translateZ(0)}@keyframes marquee-scroll{0%{transform:translate(0,0)}to{transform:translate(-100%)}}@keyframes shake{0%,to{transform:rotate(0)}10%,30%,50%,70%,90%{transform:rotate(-10deg)}20%,40%,60%,80%{transform:rotate(10deg)}}.edit-noti-btn{z-index:9999;cursor:pointer;border-radius:50%;justify-content:center;align-items:center;margin-left:10px;transition:all .3s;position:relative;color:#fff!important;background:#ffffff40!important;border:1px solid #ffffff80!important;flex-shrink:0!important;width:30px!important;height:30px!important;display:flex!important}.edit-noti-btn:hover{transform:scale(1.1);box-shadow:0 2px 5px #0003;color:#0288d1!important;background:#fff!important}.marquee-content{white-space:nowrap;flex-grow:1;margin-right:5px;position:relative;overflow:hidden;-webkit-mask-image:linear-gradient(90deg,#0000,#000 5% 95%,#0000);mask-image:linear-gradient(90deg,#0000,#000 5% 95%,#0000)}.info-bar-wrapper{box-sizing:border-box;justify-content:space-between;align-items:center;width:100%;margin-top:10px;padding:0 10px;display:flex}.notification-widget{float:none;color:#fff;background:linear-gradient(135deg,#29b6f6 0%,#81d4fa 100%);border:1px solid #fff6;border-radius:10px;flex:1;align-items:center;max-width:70%;margin:0 20px 0 0;padding:6px 18px;font-family:Roboto,sans-serif;font-size:14px;font-weight:500;display:flex;overflow:hidden;box-shadow:0 4px 6px #0000001a}.weather-widget{float:none;color:#2d6df7;opacity:0;opacity:0;filter:blur(10px);background:linear-gradient(135deg,#7eab6a 10%,#d2f1c4 20%);border:1px solid #fff3;border-radius:10px;justify-content:center;align-items:center;width:auto;margin:0;padding:6px 16px;font-family:Roboto,sans-serif;font-size:13px;font-weight:500;transition:all .8s cubic-bezier(.4,0,.2,1);display:flex;transform:translateY(5px);box-shadow:0 4px 6px #0003}.weather-widget.show{opacity:1;filter:blur();transform:translateY(0)}@media (width<=768px){.info-bar-wrapper{gap:6px;margin-top:8px;padding:0 5px;flex-direction:row!important;align-items:stretch!important}.notification-widget{flex:1;min-width:0;border-radius:17px!important;width:auto!important;max-width:none!important;height:34px!important;padding:0 10px!important;font-size:11px!important}.notification-widget .bell-icon{display:none}.marquee-content{margin-right:2px}.edit-noti-btn{width:24px!important;height:24px!important;margin-left:5px!important}.weather-widget{flex-shrink:0;border-radius:17px!important;width:auto!important;height:34px!important;margin:0!important;padding:0 8px!important;font-size:10px!important}.weather-location{white-space:nowrap;text-overflow:ellipsis;vertical-align:middle;max-width:60px;display:inline-block;overflow:hidden;margin-right:3px!important;font-size:9px!important}.weather-separator{margin:0 2px!important}.weather-widget i{font-size:.9em}}@media (width<=380px){.weather-widget span:nth-child(7),.weather-widget span:nth-child(8),.weather-widget span:nth-child(5),.weather-widget span:nth-child(6){display:none!important}}.empty-port-icon svg{filter:drop-shadow(0 4px 6px #0000001a);animation:3s ease-in-out infinite boat-bob}@keyframes boat-bob{0%,to{transform:translateY(0)rotate(0)}50%{transform:translateY(-6px)rotate(1.5deg)}}@media (width<=768px){.header-bottom{flex-flow:row!important;align-items:center!important;gap:5px!important;padding:2px 5px!important;display:flex!important}.notification-marquee{background-color:#fff8e1;border:1px solid #ffe0b2;flex:0 0 45%!important;width:45%!important;min-width:0!important;max-width:40%!important;height:32px!important;margin-right:0!important}.marquee-content{font-weight:600;font-size:11px!important;line-height:30px!important}.weather-widget{white-space:nowrap!important;flex:0 0 55%!important;justify-content:space-between!important;align-items:center!important;width:55%!important;max-width:55%!important;height:32px!important;padding:0 2px!important;font-size:8px!important;display:flex!important;overflow:hidden!important}.weather-widget i{margin-right:2px!important;font-size:9px!important}.weather-widget span{margin:0 1px!important;display:inline-block!important}.weather-separator{display:none!important}.weather-location{text-overflow:ellipsis!important;max-width:45px!important;overflow:hidden!important}}#port-simulation-map{z-index:1;border:1px solid #ffffff4d;border-radius:12px;flex-direction:row;align-items:stretch;gap:20px;min-height:650px;padding:20px;display:flex;position:relative;overflow:hidden}#port-simulation-map:before{content:"";background-image:var(--sim-bg,url(background-cang.jpg));opacity:1;z-index:-1;background-position:50%;background-size:cover;transition:background-image 1s ease-in-out;position:absolute;inset:0}.simulation-clock{z-index:20;color:#00e676;text-align:right;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);background:#0009;border:1px solid #ffffff4d;border-radius:8px;padding:5px 12px;font-family:Consolas,Monaco,monospace;font-weight:700;line-height:1.2;position:absolute;top:8px;right:12px;box-shadow:0 2px 5px #00000080}.clock-time{letter-spacing:1px;font-size:16px}.clock-date{color:#ccc;font-size:11px}.map-column{flex-direction:column;flex:1;min-width:300px;display:flex}.group-connected{background:#ffffff1a;border:2px dashed #ffffff80;border-radius:15px;height:100%;padding:20px 15px;position:relative}#zone-cang2,.zone-waiting{border:1px solid #ffffff4d;border-radius:12px;box-shadow:0 8px 32px #1f26875e;background:#ffffff1a!important}.zone-waiting{flex-grow:1;min-height:200px;padding:10px;height:fit-content!important}.port-zone{flex-direction:column;align-items:center;width:100%;display:flex;position:relative}.group-label{color:#fff;white-space:nowrap;background:#0277bd;border:2px solid #fffc;border-radius:12px;padding:4px 15px;font-size:12px;font-weight:700;position:absolute;top:-12px;left:50%;transform:translate(-50%);box-shadow:0 2px 5px #0000004d}.port-label{color:#fff;white-space:nowrap;background:linear-gradient(135deg,#014f86,#0277bd);border:2px solid #fffc;border-radius:20px;margin-bottom:10px;padding:6px 15px;font-weight:700;box-shadow:0 4px 8px #0000004d}.concrete-pier{color:#2c3e50;z-index:5;background:linear-gradient(#ecf0f1,#bdc3c7);border:1px solid #95a5a6;justify-content:center;align-items:center;width:100%;height:50px;font-size:1.1rem;font-weight:800;display:flex;box-shadow:0 8px 15px #0006,inset 0 1px #fffc}.berth-container{-webkit-backdrop-filter:blur(-1px);color:#1a237e;border:1px solid #ffffff80;border-radius:12px;flex-direction:column;width:100%;display:flex;overflow:hidden;box-shadow:0 8px 32px #1f268726;background-image:linear-gradient(-225deg,#7de2fc99 0%,#b9b6e599 100%)!important}.berth-row{flex-direction:column;width:100%;height:130px;display:flex;position:relative}.split-berth{width:100%;height:100%;display:flex}.sub-slot{background:#ffffff0d;border:1px dashed #fff6;flex:1;justify-content:center;align-items:center;padding:2px;display:flex;position:relative;overflow:hidden}.full-slot-overlay{pointer-events:none;z-index:6;justify-content:center;align-items:center;width:100%;height:100%;display:flex;position:absolute;top:0;left:0}.water-label-group{text-align:center;color:#fff;text-transform:uppercase;background:#0006;padding:3px;font-size:11px;font-weight:700}.sub-slot,.full-slot-overlay{z-index:1;justify-content:center;align-items:flex-end;display:flex!important;position:relative!important;overflow:visible!important}.sim-ship{z-index:10;cursor:pointer;background-position:bottom;background-repeat:no-repeat;background-size:contain;transition:transform .3s;animation:4s ease-in-out infinite floatShip;position:absolute;bottom:0;left:0;box-shadow:none!important;background-color:#0000!important;border:none!important;border-radius:0!important;width:100%!important;height:100%!important;margin:0!important;padding:0!important}.ship-style-full{filter:drop-shadow(0 10px 5px #00000080);bottom:10px;background-image:url(https://firebasestorage.googleapis.com/v0/b/giamsattauthan.firebasestorage.app/o/assets%2Ffullship.png?alt=media&token=ed1b4b02-742d-4bcf-8f58-99bfc93507b7)!important;background-size:100% 130%!important;height:120%!important}.ship-style-mini{filter:drop-shadow(0 5px 3px #0006);bottom:8px;background-image:url(https://firebasestorage.googleapis.com/v0/b/giamsattauthan.firebasestorage.app/o/assets%2Fminiship.png?alt=media&token=a8d6f3a5-ad96-4949-99f0-9977cbcc18d0)!important;background-size:contain!important;width:90%!important;left:6%!important}.sim-ship:hover{z-index:100;filter:drop-shadow(0 0 10px #fff9);transform:translateY(-8px)scale(1.05)}.sim-ship .ship-name-label{white-space:nowrap;color:#fff;text-shadow:0 1px 1px #0003;z-index:20;background:#e91e63;border:1px solid #ffffff4d;border-radius:12px;width:auto;padding:2px 10px;font-size:11px;font-weight:700;position:absolute;top:0;left:25px;transform:none;box-shadow:0 3px 6px #0000004d}.sim-ship .cargo-bar-bg{z-index:15;background:#000000b3;border:1px solid #fff6;border-radius:3px;width:70%;height:6px;margin:0;position:absolute;bottom:22%;left:45%;transform:translate(-50%)}.sim-ship .cargo-bar-fill{background:linear-gradient(#cf0 0%,#39ff14 100%);border-radius:2px;height:100%;transition:all .3s;box-shadow:0 0 10px #39ff14,0 0 25px #39ff14cc,0 0 40px #39ff1466}.sim-ship .ship-info-row{text-align:center;color:#fc2803;text-shadow:0 1px 2px #000;pointer-events:none;width:100%;font-size:10px;font-weight:700;position:absolute;bottom:5px}.waiting-grid{flex-wrap:wrap;align-content:flex-start;gap:8px;width:100%;display:flex}.mini-ship{color:#000;cursor:pointer;white-space:nowrap;text-overflow:ellipsis;background:linear-gradient(#f5d100 0%,#50cc7f 100%);border:1px solid #ffffff4d;border-radius:6px;align-items:center;gap:5px;max-width:100%;padding:8px 12px;font-size:11px;font-weight:700;transition:all .2s;display:flex;overflow:hidden;box-shadow:0 2px 5px #0003}.mini-ship:hover{background:linear-gradient(135deg,#ffa726,#fb8c00);transform:translateY(-2px);box-shadow:0 4px 8px #0000004d}.ship-name-label{white-space:nowrap;text-overflow:ellipsis;text-align:left;width:100%;padding-left:10px;font-size:11px;font-weight:700;line-height:1.2;display:block;overflow:hidden}.ship-info-row{justify-content:space-between;margin-top:2px;font-size:10px;display:flex}.cargo-bar-bg{background:#0006;border:1px solid #ffffff4d;border-radius:3px;width:100%;height:9px;margin-top:4px}.cargo-bar-fill{background:#76ff03;width:0%;height:100%;box-shadow:0 0 8px #76ff03cc}@keyframes floatShip{0%,to{transform:translateY(0)}50%{transform:translateY(-3px)}}@media screen and (width<=1024px){#port-simulation-map{flex-direction:column;min-height:auto;padding:10px}.map-column{width:100%;margin-bottom:20px}.group-connected,#zone-cang2{zoom:.65;-moz-transform-origin:0 0;width:100%;-moz-transform:scale(.65)}.zone-waiting{zoom:.8;margin-left:0}.sim-ship:hover{transform:none}}.concrete-pier{position:relative;overflow:hidden}.shiploader-gears{opacity:.5;align-items:center;gap:2px;transition:opacity .3s;display:flex;position:absolute;top:50%;right:10px;transform:translateY(-50%)}.shiploader-gears i{color:#7f8c8d}.big-gear{font-size:24px}.small-gear{margin-top:10px;font-size:16px}.shiploader-active{opacity:1!important}.shiploader-active .big-gear{color:#e67e22;animation:3s linear infinite spin}.shiploader-active .small-gear{color:#d35400;animation:2s linear infinite spin-reverse}@keyframes spin-reverse{to{transform:rotate(-360deg)}}.stages-grid div[style*="text-align: right"] button{padding:8px 25px;width:auto!important}input[type=password]{appearance:none}