/* Disable text selection cho toàn trang */
body {
    -webkit-user-select: none; /* Safari */
    -moz-user-select: none;    /* Firefox */
    -ms-user-select: none;     /* IE10+/Edge */
    user-select: none;         /* Standard */
}

/* Disable kéo hình ảnh */
/* Cấm kéo tất cả hình ảnh */
img {
    pointer-events: none;
    -webkit-user-drag: none;
    -khtml-user-drag: none;
    -moz-user-drag: none;
    -o-user-drag: none;
    user-drag: none;
}

/* Cho phép kéo ảnh có class shipItem */
img.shipItem {
    pointer-events: auto;
    -webkit-user-drag: auto;
    -khtml-user-drag: auto;
    -moz-user-drag: auto;
    -o-user-drag: auto;
    user-drag: auto;
}


body,html{padding:0;margin:0;position:relative}
.boxOverlay{display:none;background:#0099ff;color:#fff;border-radius:10px;padding:1%;line-height:180%;font-size:20px}
.tblInfo{
    position:fixed;right:0;top:0;padding:5px;background:#050e17;color:#fff;border:0px solid #fff;
    border-radius:50px 0 0 50px;overflow:hidden
}
.fire{
    position:absolute;left:915px;top:230px
}
.fireRight{
    position:absolute;left:1064px;top:140px
}
.normalCell{
    background:rgba(255,255,255,0.5);position:absolute;display:flex;width:50px;height:50px;
    margin:5px;border-radius:3px;cursor:pointer;border:2px solid transparent;
    align-items:center
}
.normalCell:hover{border:2px solid #0099ff}
.normalCell.shooted::after{display:inline-block;position:absolute;content:"X";font-size:50px;color:#ff0000;margin:auto;left:0;right:0;text-align:center}
.normalCell.cellFire::after{position:absolute;display:inline-block;z-index:100;width:45px;height:45px;content:"";background:url('../images/fire.gif') no-repeat bottom;background-size:40%}
/*.normalCell.shipFire::before{position:absolute;display:inline-block;z-index:100;width:50px;height:50px;content:"";background:url('../images/ship.svg') no-repeat bottom}*/
.normalCell.shipFire::after{position:absolute;display:inline-block;z-index:100;width:25px;height:30px;content:"";background:url('../images/fire.gif') no-repeat bottom;background-size:40%;bottom:0;right:0}
.normalCell.shipBroken::after{position:absolute;display:inline-block;z-index:100;width:54px;height:54px;content:"";background:url('../images/ship-broken.svg') no-repeat center}
#inputPlayerName{padding:10px;font-size:22px;}
#panelLogin{position:absolute;bottom:15px;left:0;right:0;margin:0 15px}
#btPlayerName{padding:10px;font-size:22px;width:100%;cursor:pointer}
.boxEnterName{position:relative;width:fit-content;padding:0!important}
.panelMyShip{position:absolute;display:inline-block;width:80px;background:rgba(0,0,0,0.7);left:0;top:0;padding:10px;margin:5px;border-radius:5px}
.headShip{}
.shipItem{cursor:pointer}
.cell-hover {
    background-color: rgba(0, 128, 255, 0.3);
    border: 2px dashed #00aaff;
}
.panelStart{position:fixed;bottom:30px;right:30px;display:inline-block;width:200px;}
.gameButton{padding:10px;font-weight:700;display:block;margin:10px 0;width:100%}

.popup {
    background: #fff;
    border: 1px solid #ccc;
    padding: 20px;
    width: 300px;
    margin: 0 auto;
    text-align: center;
    z-index: 1000;
}
.dnone {
    display: none;
}
.timeBox {
    position:fixed;
    top:0;left:0;
    font-size: 18px;
    margin: 10px 0;
    color: #333;
}
#playerTime {
    font-weight: bold;
    color: red;
}