/* =========================================
   RITUAL LIVE OPERATIONS
   DASHBOARD CSS
========================================= */

/* MAIN DASHBOARD CONTAINER */

#ritual-dashboard{

max-width:900px;
margin:30px auto;
padding:20px;
font-family:"Noto Sans Oriya","Nirmala UI","Segoe UI",Arial,sans-serif;

color:#000;

}


/* MAIN TITLE */

#ritual-dashboard h2{

text-align:center;
font-size:26px;
font-weight:600;
margin-bottom:25px;
color:#000;

}


/* SECTION TITLES */

#ritual-dashboard h3{

font-size:18px;
font-weight:600;
margin-top:25px;
margin-bottom:10px;
color:#000;

}


/* ======================================
   SECTION BOX
====================================== */

.rlo-section{

background:#fafafa;
padding:18px;
border-radius:10px;
border:1px solid #ddd;
margin-bottom:20px;

}


/* ======================================
   INPUTS
====================================== */

.rlo-select,
textarea,
input[type="text"],
input[type="time"],
select{

width:100%;
padding:12px;
margin-bottom:12px;

border-radius:6px;
border:1px solid #ccc;

font-size:15px;

background:#ffffff;
color:#000000;

box-sizing:border-box;

transition:border .2s ease;

}


/* INPUT FOCUS */

.rlo-select:focus,
textarea:focus,
input:focus,
select:focus{

outline:none;
border-color:#2e7d32;

}


/* ======================================
   BUTTONS
====================================== */

.rlo-button{

padding:10px 18px;
background:#2e7d32;
color:#fff;

border:none;
border-radius:6px;

cursor:pointer;
font-weight:600;

margin-right:10px;
margin-bottom:10px;

transition:background .2s ease;

}

.rlo-button:hover{

background:#1b5e20;

}


/* ======================================
   RITUAL LIST
====================================== */

#row1-list,
#row2-list{

max-height:300px;
overflow-y:auto;

padding-right:5px;
margin-top:10px;

}


/* INDIVIDUAL RITUAL ITEM */

.rlo-item{

background:#f1f1f1;

padding:10px 12px;

margin-bottom:6px;

border-radius:6px;

font-size:14px;

display:flex;
justify-content:space-between;
align-items:center;

color:#000;          /* FIX: text visible */

}


/* REMOVE BUTTON */

.rlo-item button{

background:#e53935;
color:#ffffff;

border:none;
border-radius:4px;

padding:4px 8px;
cursor:pointer;

font-size:12px;

}

.rlo-item button:hover{

background:#b71c1c;

}


/* ======================================
   TEXTAREA
====================================== */

textarea{

min-height:90px;
resize:vertical;

}


/* ======================================
   SUCCESS MESSAGE
====================================== */

#ticker-msg,
#cards-msg,
#save-msg{

display:none;

margin-top:12px;

font-weight:bold;
font-size:15px;

color:#2e7d32;

}


/* ======================================
   MOBILE RESPONSIVE
====================================== */

@media(max-width:768px){

#ritual-dashboard{

padding:10px;

}

.rlo-button{

width:100%;
margin-bottom:10px;

}

.rlo-item{

flex-direction:column;
align-items:flex-start;

}

.rlo-item button{

margin-top:6px;

}

}