/* =========================
   🌍 GLOBAL
========================= */
* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

body {
    font-family: 'Segoe UI', sans-serif;
}

/* =========================
   🔐 LOGIN PAGE (DARK)
========================= */
body.login-page {
    background: linear-gradient(135deg, #1c1c1c, #000);
    height: 100vh;
    display: flex;
    justify-content: center;
    align-items: center;
}

.admin-login-container {
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
}

.login-card {
    background: #111;
    padding: 40px;
    border-radius: 12px;
    width: 320px;
    text-align: center;
    box-shadow: 0 0 25px rgba(255, 165, 0, 0.25);
}

.login-card h2 {
    color: orange;
    margin-bottom: 25px;
}

/* ===========================
   INPUT GROUP WITH ICON
=========================== */

.input-group{
    position: relative;
    margin-bottom: 18px;
}

.input-group i{
    position: absolute;
    left: 16px;
    top: 50%;
    transform: translateY(-50%);
    color: #888;
    font-size: 16px;
    width: 18px;
    text-align: center;
    pointer-events: none;
    z-index: 2;
}

.input-group input{
    width:100%;
    height:48px;
    padding-left:50px !important;
}

.input-group input:focus{
    border-color: #3498db;
    box-shadow: 0 0 8px rgba(52,152,219,.2);
}

.input-group input::placeholder{
    color: #777;
}

/* BUTTON */
.login-btn {
    width: 100%;
    padding: 10px;
    background: orange;
    border: none;
    border-radius: 6px;
    font-weight: bold;
    cursor: pointer;
    transition: 0.3s;
}

.login-btn:hover {
    background: #ff6600;
}

/* ERROR */
.error-msg {
    color: red;
    margin-top: 10px;
}


/* =========================
   📊 DASHBOARD
========================= */
body.dashboard-page {
    background: #f4f6f9;
}

/* HEADER */
.admin-header {
    background: white;
    border-bottom: 3px solid #f1c40f;
    padding: 15px 30px;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.admin-header h2 {
    color: #333;
}

/* USER */
.admin-user {
    display: flex;
    align-items: center;
    gap: 15px;
}

.admin-user span {
    font-weight: bold;
    color: #555;
}

/* BUTTONS */
.logout-btn {
    background: #f1c40f;
    color: black;
    padding: 8px 15px;
    border-radius: 6px;
    font-weight: bold;
    text-decoration: none;
}

.logout-btn:hover {
    background: #d4ac0d;
}

.back-btn {
    background: #3498db;
    color: white;
    padding: 8px 14px;
    border-radius: 6px;
    font-weight: bold;
    text-decoration: none;
}

.back-btn:hover {
    background: #2c80b4;
}

/* =========================
   🧠 DASHBOARD CARDS
========================= */

.welcome-box {
    text-align: center;
    margin-top: 40px;
}

.welcome-box h1 {
    font-size: 28px;
    color: #333;
}

.welcome-box p {
    color: #777;
}

.dashboard-container {
    display: flex;
    justify-content: center;
    gap: 30px;
    margin-top: 50px;
    flex-wrap: wrap;
}

.card-link {
    text-decoration: none;
    display: inline-block;
}

.card {
    width: 260px;
    padding: 30px;
    border-radius: 12px;
    text-align: center;
    background: white;
    box-shadow: 0 5px 20px rgba(0,0,0,0.08);
    border-top: 4px solid #f1c40f;
    transition: 0.3s;
    cursor: pointer;
}

.card i {
    font-size: 40px;
    color: #f1c40f;
}

.card h3 {
    margin: 10px 0;
    color: #444;
}

.card p {
    color: #777;
}

.card:hover {
    transform: translateY(-8px) scale(1.02);
}

/* =========================
   📋 TABLE
========================= */

.page-title {
    text-align: center;
    margin: 20px 0;
}

/* =========================
   TABLE CONTAINER
========================= */

.table-container{
    width:100%;
    overflow-x:auto;
    padding:20px;
}

/* =========================
   TABLE
========================= */

.dhaba-table{
    width:100%;
    min-width:1500px;
    border-collapse:collapse;
    table-layout:fixed;
    background:#fff;
    border-radius:10px;
    overflow:hidden;
    box-shadow:0 5px 20px rgba(0,0,0,.08);
}

.dhaba-table th,
.dhaba-table td{
    border:1px solid #eee;
    padding:10px;
    vertical-align:top;
    text-align:left;
    font-size:13px;
    word-break:break-word;
    overflow-wrap:anywhere;
}

.dhaba-table th{
    background:#f1c40f;
    position:sticky;
    top:0;
    z-index:10;
    text-align:center;
    font-weight:600;
}

.dhaba-table tr:nth-child(even){
    background:#fafafa;
}

.dhaba-table tr:hover{
    background:#f8f8f8;
}

.small-text{
    max-width:220px;
    white-space:normal;
    word-break:break-word;
    overflow-wrap:anywhere;
}
.map-box{
    width:250px;
    max-width:250px;
    overflow:hidden;
}

.map-box iframe{
    width:100%;
    height:140px;
    border:none;
    border-radius:8px;
}

/* ACTION COLUMN */

.action-buttons{
    display:flex;
    flex-direction:column;
    gap:8px;
    align-items:center;
}

.btn{
    display:inline-block;
    width:80px;
    padding:8px 0;
    border:none;
    border-radius:6px;
    color:#fff;
    text-decoration:none;
    text-align:center;
    cursor:pointer;
    font-size:13px;
    font-weight:600;
    transition:.3s;
}

.view{
    background:#28a745;
}

.view:hover{
    background:#1f8d38;
}

.edit{
    background:#17a2b8;
}

.edit:hover{
    background:#11798a;
}

.delete{
    background:#dc3545;
}

.delete:hover{
    background:#b52b39;
}
/* Location Column */
.location-cell{
    max-width:220px;
    width:220px;
}

/* Truncate Text */
.location-text{
    display:block;
    max-width:220px;
    overflow:hidden;
    white-space:nowrap;
    text-overflow:ellipsis;
    cursor:pointer;
}

/* Show full text on hover */
.location-text:hover{
    white-space:normal;
    overflow:visible;
    word-break:break-word;
    background:#fffbe6;
    border:1px solid #f1c40f;
    border-radius:6px;
    padding:8px;
    position:absolute;
    z-index:999;
    width:450px;
    box-shadow:0 5px 15px rgba(0,0,0,.15);
}

/********viewdhabas-details.html ============ */
/* =========================
   🍽️ DHABA DETAILS PAGE
========================= */

/* CONTAINER */
.details-container {
    width: 85%;
    margin: 30px auto;
    background: white;
    padding: 25px;
    border-radius: 12px;
    box-shadow: 0 5px 25px rgba(0,0,0,0.08);
}

/* TITLE */
.details-container h2 {
    text-align: center;
    margin-bottom: 20px;
    color: #333;
}

/* SECTION TITLE */
.section-title {
    margin-top: 30px;
    margin-bottom: 10px;
    font-size: 20px;
    color: #333;
    border-left: 5px solid #f1c40f;
    padding-left: 10px;
}

/* TABLE OVERRIDE FOR DETAILS */
.details-container table {
    width: 100%;
    border-collapse: collapse;
}

.details-container th,
.details-container td {
    padding: 12px;
    border-bottom: 1px solid #eee;
}

.details-container th {
    width: 30%;
    background: #f1c40f;
    text-align: left;
}

.details-container td {
    background: #fafafa;
}

/* INFO CARDS (ABOUT SECTION) */
.info-card {
    background: #fff;
    border-left: 5px solid #f1c40f;
    padding: 15px;
    margin-bottom: 15px;
    border-radius: 8px;
    box-shadow: 0 2px 12px rgba(0,0,0,0.08);
    transition: 0.3s;
}

.info-card:hover {
    transform: translateY(-3px);
}

.info-card p {
    margin: 6px 0;
    color: #555;
    font-size: 14px;
}

/* IMAGE GALLERY */
.images {
    display: flex;
    gap: 15px;
    flex-wrap: wrap;
    margin-top: 10px;
}

/* IMAGE BOX */
.images img {
    width: 180px;
    height: 120px;
    object-fit: cover;
    border-radius: 10px;
    box-shadow: 0 2px 12px rgba(0,0,0,0.1);
    transition: 0.3s;
    cursor: pointer;
}

/* IMAGE HOVER */
.images img:hover {
    transform: scale(1.08);
}

/* EMPTY IMAGE TEXT */
.images p {
    color: #888;
    font-size: 14px;
}

/* MAP FIX (DETAIL PAGE) */
.details-container iframe {
    width: 100%;
    height: 220px;
    border-radius: 10px;
    border: none;
}

/* RESPONSIVE */
@media (max-width: 768px) {
    .details-container {
        width: 95%;
        padding: 15px;
    }

    .images img {
        width: 100%;
        height: auto;
    }
}
/* FIX LONG TEXT WRAP */
.details-container td {
    word-break: break-word;
    overflow-wrap: break-word;
}

/* LOCATION CELL FIX */
.location-cell {
    max-width: 400px;
}

/* IFRAME FIX */
.location-cell iframe {
    width: 100%;
    max-width: 100%;
    height: 200px;
    border: none;
    border-radius: 8px;
}

/* TABLE FIX */
.details-container table {
    table-layout: fixed;
}


/* =========================
   💬 FEEDBACK PAGE  VIEW FEEDBACK.HTML 
========================= */

.dhaba-table td {
    vertical-align: top;
}

/* FEEDBACK TEXT */
.small-text {
    max-width: 250px;
    word-wrap: break-word;
}

/* RATING STARS */
.dhaba-table td span {
    color: #f1c40f;
    font-size: 16px;
}

/*******View new dhaba.html *********/
/* MULTIPLE IMAGES GRID */
/* =========================
   🏪 NEW DHABA PAGE
========================= */

.new-dhaba-card {
    width: 340px;
    background: white;
    padding: 18px;
    border-radius: 12px;
    box-shadow: 0 5px 20px rgba(0,0,0,0.08);
    transition: 0.3s;
}

.new-dhaba-card:hover {
    transform: translateY(-5px);
}

.new-dhaba-card h3 {
    margin-bottom: 10px;
    color: #333;
}

.sub-title {
    margin-top: 10px;
    font-size: 14px;
    color: #555;
}

/* MAIN IMAGE */
.main-img {
    width: 100%;
    height: 180px;
    object-fit: cover;
    border-radius: 8px;
    margin-top: 10px;
}

/* MULTIPLE IMAGES GRID */
.images {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(70px, 1fr));
    gap: 8px;
    margin-top: 10px;
}

/* IMAGE STYLE */
.images img {
    width: 100%;
    height: 70px;
    object-fit: cover;
    border-radius: 6px;
    transition: 0.3s;
    cursor: pointer;
}

/* HOVER EFFECT */
.images img:hover {
    transform: scale(1.08);
}

/* NO IMAGE TEXT */
.no-img {
    color: #888;
    font-size: 13px;
}

/* DATE */
.date {
    margin-top: 10px;
    color: #777;
}

/* MAP */
.map-box iframe {
    width: 100%;
    height: 140px;
    border-radius: 8px;
    border: none;
    margin-top: 10px;
}

/* ACTION BUTTONS CONTAINER */
.action-buttons {
    display: flex;
    gap: 8px;
    margin-top: 12px;
    flex-wrap: wrap;
}

/* EDIT BUTTON */
.edit {
    background: #2980b9;
}

.edit:hover {
    background: #1f6391;
}
/***************MORE_DETAILS_OF_DHABA.HTML*************/
/* =========================
   📝 ADMIN MORE DETAILS FORM
========================= */

/* FORM LAYOUT */
.details-container form {
    display: flex;
    flex-direction: column;
    gap: 15px;
}

/* HEADINGS */
.details-container h3 {
    font-size: 16px;
    color: #333;
    margin-top: 10px;
}

/* TEXTAREA */
.details-container textarea {
    width: 100%;
    min-height: 90px;
    padding: 10px;
    border-radius: 6px;
    border: 1px solid #ccc;
    outline: none;
    font-size: 14px;
    resize: vertical;
    transition: 0.3s;
}

/* TEXTAREA FOCUS */
.details-container textarea:focus {
    border-color: #f1c40f;
    box-shadow: 0 0 5px rgba(241, 196, 15, 0.4);
}

/* FILE INPUT */
.details-container input[type="file"] {
    padding: 8px;
    background: #fafafa;
    border: 1px dashed #ccc;
    border-radius: 6px;
    cursor: pointer;
    transition: 0.3s;
}

/* FILE INPUT HOVER */
.details-container input[type="file"]:hover {
    border-color: #f1c40f;
    background: #fffdf5;
}

/* BUTTON SPACING */
.details-container button {
    margin-top: 20px;
}

/* RESPONSIVE */
@media (max-width: 768px) {
    .details-container {
        width: 95%;
    }
}

/* ===============================
   EDIT DHABA PAGE
================================= */

.details-container{
    width:95%;
    max-width:1200px;
    margin:35px auto;
    background:#fff;
    border-radius:12px;
    padding:35px;
    box-shadow:0 10px 30px rgba(0,0,0,.08);
}

.details-container form{
    display:flex;
    flex-direction:column;
    gap:18px;
}

/* SECTION TITLE */

.details-container h3{
    margin-top:25px;
    margin-bottom:10px;
    padding-bottom:10px;
    border-bottom:2px solid #f1c40f;
    color:#333;
    font-size:22px;
}

/* LABEL */

.details-container label{
    display:block;
    font-size:15px;
    font-weight:600;
    color:#444;
    margin-bottom:6px;
}

/* INPUTS */

.details-container input[type=text],
.details-container input[type=email]{

    width:100%;
    height:48px;
    padding:12px 15px 12px 50px;
    border:1px solid #dcdcdc;
    border-radius:8px;
    font-size:15px;
    background:#fafafa;
}

.details-container input[type=file]{
    width:100%;
    padding:10px;
}

.details-container textarea{
    width:100%;
    padding:12px 15px;
}

.details-container input:focus,
.details-container textarea:focus{

    border-color:#3498db;
    background:#fff;
    outline:none;
    box-shadow:0 0 10px rgba(52,152,219,.18);

}

/* READONLY */

.details-container input[readonly]{

    background:#eeeeee;
    font-weight:bold;
    color:#666;

}

/* HORIZONTAL LINE */

.details-container hr{

    border:none;
    border-top:1px solid #ddd;
    margin:15px 0;

}

/* IMAGE SECTION */

.image-preview{

    display:flex;
    flex-wrap:wrap;
    gap:20px;
    margin-top:15px;

}

.image-card{

    width:230px;
    text-align:center;

}

.image-card img{

    width:100%;
    height:170px;
    object-fit:cover;
    border-radius:10px;
    border:2px solid #ddd;
    box-shadow:0 4px 15px rgba(0,0,0,.12);

}

.image-card p{

    margin-bottom:10px;
    font-weight:bold;
    color:#333;

}

/* FILE INPUT */

.image-card input{

    margin-top:10px;

}

/* UPDATE BUTTON */

.update-btn{

    margin-top:30px;
    width:220px;
    padding:14px;
    background:#28a745;
    color:#fff;
    border:none;
    border-radius:8px;
    font-size:16px;
    font-weight:600;
    cursor:pointer;
    transition:.3s;

}

.update-btn:hover{

    background:#1f8b38;
    transform:translateY(-2px);

}

/* RESPONSIVE */

@media(max-width:992px){

    .details-container{

        width:98%;
        padding:20px;

    }

    .image-card{

        width:100%;

    }

}

.success-message{
    background:#d4edda;
    color:#155724;
    border:1px solid #c3e6cb;
    padding:12px;
    border-radius:8px;
    margin-bottom:20px;
    font-weight:600;
}

.delete-btn{

    display:inline-block;
    padding:8px 16px;
    background:#dc3545;
    color:#fff;
    text-decoration:none;
    border-radius:6px;
    font-size:14px;
    font-weight:600;
}

.delete-btn:hover{

    background:#b02a37;
}

.edit-btn{
    display:inline-block;
    padding:8px 16px;
    background:#0d6efd;
    color:#fff;
    text-decoration:none;
    border-radius:6px;
    font-size:14px;
    font-weight:600;
    transition:0.3s;
}

.edit-btn:hover{
    background:#0b5ed7;
}