body{font-family:sans-serif;  background: linear-gradient(135deg, #eef9f8 0%, #9face6 100%); }
.bg{background: linear-gradient(135deg, #74ebd5 0%, #9face6 100%);}

.valign-top {
  vertical-align: top !important;
}
.text-primary{color: #18A497 !important;}
.text-warning{color: #ffc107 !important;}
.nobg{background: none !important;}
#shoutList{max-height: 300px; overflow-y: scroll;}
#shoutList a, #shoutList p{text-decoration: none; font-size: 12px;}
.emoji-btn{font-size: 14px;}
.border-none{border: none !important;}
.display-none{display: none !important;}
.nav-link{color:#f6f6f6; font-size: small;
    text-transform: uppercase;}
.datetext{font-size: 9px; font-style: italic; color: darkgray;}
.nav-link:hover{color: #ffffff;}
.petbody ul li{font-size: 14px; color: darkblue; line-height: 1.5;}
.petbody ul li strong{color: rgb(5, 50, 155);}
.petbody ul li span{color: rgb(2, 8, 0);}
.petproperty li{text-align: left; text-transform: uppercase !important;}
#petLogList li a{text-decoration: none;}
.vip-badge {
      position:absolute;
      top:8px;
      left:8px;
      background:#2020ea;
      color:#fdfdfa !important;
      font-size:16px;
      padding:2px 4px;
      border-radius:4px;
      line-height:1;
      font-weight:bold;
      z-index: 100;
    }
    .invalid-feedback,.valid-feedback{position:absolute; bottom: 0; right: 0; font-weight: bold; background-color: beige; padding:3px; width: auto;}
    .filters{padding: 0; margin: 0;}
    .filters li{background-color: rgb(249, 251, 253); margin-bottom: 3px; padding: 3px;}
    .filters li:hover{background-color: rgb(53, 60, 67); margin-bottom: 3px; padding: 3px;}
    .filters li:hover a{color:#ffffff;}
    .text-decoration-none{color: rgb(1, 84, 132);}
    #petname{text-transform: uppercase;}
    .video-frame{
    position: relative;
    width: 100%;
    padding-top: 56.25%;   /* 16:9 */
    overflow: hidden;
    border-radius: 12px;
    background:#000;
}

.video-frame iframe{
    position:absolute;
    top:0;
    left:0;
    width:100%;
    height:100%;
    border:0;
}

/* optional: remove card padding around video */
.video-wrap.card{
    padding:0;
    overflow:hidden;
}