
/* Mobile‑only stylesheet loaded with media query */
body{background:#f5f5f5;margin:0;font-family:Arial,sans-serif;}
.app-bar{background:#005288;color:#fff;display:flex;align-items:center;height:56px;padding:0 16px;font-size:1.15rem;font-weight:700;box-shadow:0 2px 4px rgba(0,0,0,.2);}
.app-bar .menu-icon{font-size:28px;margin-right:12px;cursor:pointer;color:#fff;}

.mobile-breadcrumb{font-style:italic;color:#005288;font-size:0.95rem;background:#fff;padding:8px 16px;border-bottom:1px solid #cfe3f4;}
.mobile-breadcrumb:before{content:'/';font-size:150%;margin-right:4px;}



.menu-overlay{position:fixed;left:0;top:0;width:100%;height:100%;background:rgba(0,0,0,.35);z-index:900;display:none;}
.menu-overlay.open{display:block;}

.side-menu ul{list-style:none;margin:0;padding:0;}
.side-menu li{display:flex;align-items:center;padding:12px 0;}
.side-menu li .material-icons{margin:0 16px 0 8px;font-size:24px;color:#555;}
.side-menu li a{text-decoration:none;color:#333;font-weight:500;font-size:1.05rem;}

.card{background:#fff;border:1px solid #e0e0e0;border-radius:6px;box-shadow:0 1px 3px rgba(0,0,0,.1);padding:24px;margin:16px;}
.card h2{font-size:1.1rem;margin-bottom:16px;}
form{display:flex;flex-direction:column;gap:12px;}
form input[type=text],form button{width:100%;font-size:1rem;padding:10px;border-radius:6px;border:2px solid #ccc;}
form button{background:#005288;color:#fff;font-weight:600;border:none;}
form button:hover{background:#00416a;}
.error-message{color:#c00;font-size:.9rem;text-align:center}

/* Hide desktop-only blocks */
.desktop-only{display:none!important;}

@media(max-width:768px){
    .top-bar,.breadcrumb.desktop-only,.header-content,.top-nav,.breadcrumb{display:none!important;}
}

/* ===== Side menu precise styling ===== */

.side-menu li{display:flex;align-items:center;padding:10px 8px;border-radius:4px;}
.side-menu li.active{background:#e6e6e6;}
.side-menu li a{color:#000;font-weight:500;font-size:1rem;}
.side-menu li .material-icons{font-size:24px;margin-right:16px;color:#666;}
.side-menu hr{border:0;border-top:1px solid #e0e0e0;margin:12px 0;}

/* single authoritative drawer rules */
.side-menu{
  position:fixed;
  left:0;top:0;height:100%;width:260px;
  background:#ffffff;box-shadow:2px 0 8px rgba(0,0,0,.3);
  transform:translateX(-100%);
  transition:transform .3s ease;
  z-index:1000;overflow-y:auto;
}
.side-menu.open{transform:translateX(0);}
.menu-overlay{
  display:none;
  position:fixed;left:0;top:0;width:100%;height:100%;
  background:rgba(0,0,0,.35);z-index:900;
}
.menu-overlay.open{display:block;}
