* {box-sizing:border-box;-moz-box-sizing:border-box;-webkit-box-sizing:border-box;} body {font-family:"Trebuchet MS", Helvetica, sans-serif;font-size:16px;background-color:#000000;} html {scroll-behavior: smooth;} /* Common */ #main {width:100%;margin:0px auto;background-color:#FFFFFF;} #wrapper {width:100%;height:auto;float:left;background-color:#FFFFFF;} #content {width:100%;float:left;padding:0 2% 40px 2%;} a {color:#0162ad;} img {max-width:100%;height:auto;} /* Front End */ .top-nav {position:relative;margin-bottom:2px;width:100%;background-color:#d53333;color:#FFFFFF;} .breadcrumbs {width:92%;float:left;margin-bottom:0px;padding:0 4%;} .top-nav a {display:inline-block;text-decoration:none;padding:10px 5px 10px 5px;color:#FFFFFF;} .breadcrumbs a {display:inline-block;text-decoration:none;padding:10px 5px 10px 0px;} .top-nav a:first-child {padding-left:15px;} ul.categories-list {margin:0px;padding:0px;list-style-type:none;} ul.sub-categories-list {list-style-type:disc;padding-left:30px;} ul.categories-list li, ul.sub-categories-list li {} .errors {border:#d53333 1px solid;color:#d53333;padding:8px 15px 8px 15px;margin-bottom:20px;} /* Back End */ #registration_form input, #login_form input {margin-bottom:10px;} form {margin-top:20px;} form label {display:block;margin-bottom:3px;} .clear { display: block; clear: both; width: 100%; } input[type=text], input[type=password], textarea { padding: 8px; font-size: 16px; } textarea { width:100%; } select { padding: 5px; font-size: 16px; } #add-description-form select, #edit-description-form select {min-width:150px;} /* Start - Description List Styling */ .description_item { background: #f9f9f9; border: 1px solid #ddd; margin-bottom: 10px; padding: 15px; border-radius: 5px; list-style: none; } .description_name { font-size: 18px; font-weight: bold; color: #333; margin-bottom: 8px; } .description_info { font-size: 11px; color: #666; margin-bottom: 3px; line-height: 1.3; } .description_actions { margin-top: 10px; } .description_actions a { margin-right: 15px; text-decoration: none; font-size: 13px; font-weight: normal; padding: 5px 12px; border-radius: 3px; display: inline-block; transition: all 0.3s ease; } .description_edit_link { background: #4CAF50; color: #FFFFFF !important; } .description_edit_link:hover { background: #45a049; } .description_delete_link { background: #f44336; color: #FFFFFF !important; } .description_delete_link:hover { background: #da190b; } /* End - Description List Styling */ /* Start - Description Analytics Section */ .description_analytics { background: white; border: 1px solid #ccc; margin-bottom: 20px; padding: 20px; border-radius: 5px; } .description_analytics h2 { margin-top: 0; color: #333; font-size: 22px; margin-bottom: 20px; } .description_filter_buttons { margin-bottom: 20px; display: flex; flex-wrap: wrap; gap: 10px; } .description_filter_btn { background: #f0f0f0; border: 1px solid #ccc; padding: 8px 15px; cursor: pointer; border-radius: 3px; text-decoration: none; color: #333; display: inline-block; transition: all 0.3s ease; font-size: 14px; } .description_filter_btn:hover { background: #e0e0e0; border-color: #999; } .description_filter_btn.active { background: #007cba; color: white; border-color: #007cba; font-weight: bold; } /* END - Description Analytics Styling */ /* Start - Description Date Filter Styles */ .description_date_filter { margin: 20px 0; padding: 15px; background: #f9f9f9; border: 1px solid #ddd; border-radius: 5px; } .description_date_filter h3 { margin-top: 0; margin-bottom: 15px; color: #333; font-size: 18px; } .date_inputs { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; } .date_inputs label { font-weight: bold; color: #333; font-size: 14px; } .date_inputs input, .date_inputs select { padding: 6px 10px; border: 1px solid #ccc; border-radius: 3px; font-size: 14px; } .date_inputs input:focus, .date_inputs select:focus { outline: none; border-color: #007cba; } .date_inputs button { background: #007cba; color: white; border: none; padding: 8px 16px; border-radius: 3px; cursor: pointer; font-size: 14px; font-weight: bold; transition: background 0.3s ease; } .date_inputs button:hover { background: #005a87; } /* Group Type Buttons */ .description_group_buttons { margin: 10px 0 20px 0; display: flex; flex-wrap: wrap; gap: 10px; } /* Google Chart Container */ #description_chart { width: 100%; height: 500px; background: white; border-radius: 4px; box-shadow: 0 2px 4px rgba(0,0,0,0.1); margin-top: 20px; } /* Responsive Design for Analytics */ @media screen and (max-width: 768px) { .description_analytics { padding: 15px; } .description_analytics h2 { font-size: 20px; } .description_filter_buttons { justify-content: center; } .description_filter_btn { padding: 6px 12px; font-size: 13px; } .date_inputs { flex-direction: column; align-items: stretch; } .date_inputs label { margin-bottom: 5px; } .date_inputs input, .date_inputs select, .date_inputs button { width: 100%; max-width: 300px; } #description_chart { height: 400px; } .description_group_buttons { justify-content: center; } } @media screen and (max-width: 480px) { .description_analytics { padding: 10px; } .description_analytics h2 { font-size: 18px; } .description_filter_btn { width: 100%; text-align: center; } #description_chart { height: 350px; } .description_item { padding: 12px; } .description_name { font-size: 16px; } .description_actions a { display: block; margin-bottom: 5px; margin-right: 0; text-align: center; } } /* End - Description Date Filter Styles */ #sortable-row { padding: 0; } /* Prompt Generator CSS */ .prompt_generator_copy-message { position: fixed; top: 50%; left: 50%; transform: translate(-50%, -50%); background-color: #4CAF50; color: white; padding: 15px 25px; border-radius: 8px; font-size: 16px; font-weight: bold; z-index: 1000; opacity: 0; transition: opacity 0.3s ease; pointer-events: none; box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15); } .prompt_generator_copy-message.prompt_generator_show { opacity: 1; } #prompt_content { cursor: pointer; } /* End - Prompt Generator CSS */ .warning {color:red;} .admin-nav {margin-bottom:10px;width:100%;background-color:#000000;color:#FFFFFF;text-align:center;} .admin-nav-inner {padding:5px;} .admin-nav-inner a {display:inline-block;text-decoration:none;text-align:center;background-color:#B0000B;color:#FFFFFF;padding:0px 10px 0px 10px;line-height:2em;margin:0px 10px 10px 0px;} .admin-nav-inner a:hover {background-color:#FFFFFF;color:#B0000B;text-decoration:none;} a.buy-credit-button { background: #ffff00; background: linear-gradient(#ffff00, #ff9900); color: #000000; font-weight:bold; border-radius: 11px; } a.buy-credit-button:hover {background:linear-gradient(#ff9900,#ffff00);} a.profile-links {background-color:#2d7a27;} a.profile-links:hover {background-color:#FFFFFF;color:#2d7a27;} a.visit-website-top {background-color:#2870ca;} a.visit-website-top:hover {background-color:#FFFFFF;color:#2870ca;} a.logout-top {background-color:#e17400;} a.logout-top:hover {background-color:#FFFFFF;color:#e17400;} .blink { animation: blink 1s infinite;color:#FFFFFF; } @keyframes blink { 0% {opacity: 1;} 50% {opacity: 0;} 100% {opacity: 1;} } /* Add/Edit Listing CSS */ .listing-progress-bar {width:100%;text-align:center;} .listing-progress-bar a {display:inline-block;font-size:12px;padding:5px 0px;} .sub-admin-nav {margin-bottom:20px;width:100%;} /* .admin-nav a:first-child {padding-left:15px;} */ .grey-box {display:block;border:#eaeaea 1px solid;background-color:#f2f2f2;padding:8px 15px 8px 15px;margin:0px 20px 20px 0px;} .blue-box {display:block;border:#044a81 1px solid;color:#0162ad;padding:8px 15px 8px 15px;margin:0px 20px 20px 0px;opacity:1;animation: fade 10s linear forwards;} @keyframes fade { 0% { opacity: 1; } 50% { opacity: 0.5; } 100% { opacity: 0; position: absolute; top:-9999;} } @-webkit-keyframes fade-bg-animation { 0% {background-color:yellow;} 50% {background-color:#fff7b6;} 100% {background-color:#FFFFFF;} } @keyframes fade-bg-animation { 0% {background-color:yellow;} 50% {background-color:#fff7b6;} 100% {background-color:#FFFFFF;} } .box {display:block;border:#000000 1px solid;color:#000000;padding:8px 15px 8px 15px;margin:0px 0px 20px 0px;} .box-link {display:inline-block;text-decoration:none;border:#044a81 1px solid;background-color:#0162ad;color:#FFFFFF;padding:5px 8px 5px 8px;} .box-link-green {display:inline-block;text-decoration:none;border:#094b00 1px solid;background-color:#119000;color:#FFFFFF;padding:5px 8px 5px 8px;} .box-link-grey {display:inline-block;text-decoration:none;border:#272727 1px solid;background-color:#3e3e3e;color:#FFFFFF;padding:5px 8px 5px 8px;} .small-box-link {display:inline-block;cursor:pointer;text-decoration:none;border:#044a81 1px solid;background-color:#0162ad;color:#FFFFFF;margin:0px 0px 0px 2px;line-height:1em;padding:6px 8px 6px 8px;} .small-box-link-grey {display:inline-block;line-height:1.5em;text-decoration:none;border:#a5a5a5 1px solid;background-color:#f2f2f2;color:#4a4a4a;margin:5px 10px 5px 0px;padding:2px 8px 2px 8px;} .small-box-link-red {display:inline-block;line-height:1.5em;text-decoration:none;border:#aa0b0b 1px solid;background-color:#d53333;color:#FFFFFF;margin:5px 10px 5px 0px;padding:2px 8px 2px 8px;} /*.round-box-link {display:block;width:250px;max-width:100%;line-height:1em;text-decoration:none;text-align:center;font-size:20px;font-weight:bold;background-color:#116cc9;color:#FFFFFF;margin:5px 10px 5px 0px;padding:25px;border-radius:16px;}*/ .round-box-link { display:block; width:450px; max-width:100%; margin: 5px 0px 5px 0px; background: #4a70ee; /*background: linear-gradient(#cf444d, #b0000b 50%, #cf444d);*/ border-radius: 11px; padding: 20px 25px; color: #ffffff; font-size: 26px; font-weight:bold; text-align: center; text-decoration:none; } .round-box-link span {font-size:22px;font-weight:bold;display:block;color:#fff21b;margin-top:20px;} .round-box-link span strike {font-weight:normal;color:#e3e3e3;} .round-box-link i {font-size:13px;display:block;color:#b7ff9e;margin-top:20px;} .input-disabled {background-color:#EBEBE4;border:1px solid #ABADB3;} .new-submit {margin-top:10px;padding:10px;border:#044a81 1px solid;background-color:#0162ad;color:#FFFFFF;} .new-submit:hover {border:#137500 1px solid;background-color:#199a00;} .new-submit:disabled {border:#878787 1px solid;background-color:#878787;color:#FFFFFF;} .admin-headings {font-weight:100;} #current_listing, #revision {width:45%;margin-right:5%;float:left;} #current_listing span:first-child, #revision span:first-child {font-weight:bold;} .info_changed {min-width:100px;min-height:15px;display:inline-block;background-color:yellow;} /* css to make categories, sub-categories sortable */ #sortable-row {margin:0px 0px 20px 0px;padding:0px;} #sortable-row li {display:block;padding:10px;margin-bottom:2px;border:#eaeaea 1px solid;background-color:#f4f4f4;color:#626262;cursor:move;} #sortable-row li.ui-state-highlight {height:2.0em; background-color:#F0F0F0;border:#ccc 2px dotted;} #sortable {list-style-type:none;margin:0px 0px 10px 0px;padding:0;} #sortable li {margin:3px 3px 3px 0;padding:1px;float:left;font-size:4em;text-align:center;cursor:move;} #sortable li.ui-state-highlight {background-color:#f4f7cd;border:#abb53d 1px dotted;width:140px;margin-right:10px;height:220px;} .item_name {display:block;width:100%;} .item_edit, .item_delete {float:left;display:inline-block;width:40px;} /* users.php / locations.php */ #nice-links {margin-bottom:20px;} #nice-links a.CurrentLink {color:#d53333;font-weight:bold;} #nice-list {margin:20px 0px 0px 0px;padding:0px;color:#000000;} #nice-list li {display:block;border:#000000 1px solid;padding:20px;margin-bottom:30px;text-align:left;} /*#nice-list li:nth-child(even) {background-color:#f2f2f2}*/ .listings-wrapper span, .listings-wrapper a {display:inline-block;margin-bottom:10px;} .listing-title, .listing-status, .listing-author {} .listing-action-wrapper {display:block;margin-top:5px;margin-bottom:5px;} .listing-action {font-size:0.9em;} .time-ago {font-size:0.9em;} #nice-table {margin-top:20px;border-collapse: collapse;} #nice-table, #nice-table th, #nice-table td {border-bottom: 1px solid #ddd;} #nice-table th, #nice-table td {padding:15px;text-align:left;} #nice-table th {background-color: #4CAF50;color: white;} #nice-table tr:nth-child(even) {background-color: #FCFCFC;} #nice-table tr:nth-child(odd) {background-color: #F2F2F2;} #nice-table tr.sub-entry {background-color: #ffffff;} #nice-table tr.sub-entry:hover {background-color: #f5f5f5;} #nice-table-2 {border-collapse: collapse;} #nice-table-2, #nice-table-2 th, #nice-table-2 td {border-bottom: 1px solid #ddd;} #nice-table-2 th, #nice-table-2 td {padding:15px;text-align:left;} #nice-table-2 th {background-color: #4CAF50;color: white;} #nice-table-2 tr {background-color: #f2f2f2} #nice-table-2 tr.sub-entry {background-color: #ffffff} #nice-table-2 tr.sub-entry:hover {background-color: #f5f5f5} /* Bulk Edit Listings.php */ #bulk-actions {margin-top:10px;text-align:left;} #edit-options select, #edit-options input {margin-bottom:5px;} #edit-options {position:relative;border:#a5a5a5 1px solid;padding:15px;width:300px;max-width:100%;} #edit-status, #edit-needs-checking {width:100%;} #edit-options label {width:130px;float:left;margin-right:5px;} #edit-buttons {width:100%;text-align:right;margin-top:10px;} .page-numbers {margin:10px 0px 20px 0px;} /* add_listing.php */ #add-listing-form, #add-edit-listing-table {width:100%;} #add-edit-listing-table tr td:first-child {width:170px;} #title, #seo_title {width:100%;} #steps {margin-bottom:20px;} #steps a {text-decoration:none;color:#FFFFFF;display:inline-block;font-size:30px;padding:10px 15px 10px 15px;} .step-active {background-color:#0162ad;} .step-disabled {background-color:#aec3d3;cursor:default;pointer-events:none;} .step-details {font-size:15px;} /* edit_listing_images.php */ .listing-image-gallery {display:block;width:100%;margin:20px 0px 30px 0px;} .listing-image-wrapper {float:left;text-align:center;background:#ebebeb;border:#9e9e9e 1px solid;width:120px;height:auto;margin-right:10px;padding:10px;} .listing-image-container {text-align:center;background:#ffffff;width:100px;height:auto;padding:10px;border:#9e9e9e 1px solid;margin-bottom:5px;} /*.blank-image {background:url("admin/images/camera.png") no-repeat center center;cursor:pointer;}*/ /*.listing-image {max-width:100%;max-height:100%;}*/ .remove-img {text-align:center;} .image-features-t {text-align:left;margin-top:10px;} .image-features-r {font-size:14px;margin-bottom:5px;height:20px;line-height:20px;} .image-features-r input[type="radio"] {vertical-align:middle;margin:0px;padding:0px;} .image-features-r label {vertical-align:middle;} .image-features-m {font-size:12px;color:#BC0000;margin-bottom:5px;height:20px;line-height:20px;} form#add_listing_images {display:block;padding:20px;border:#9e9e9e 1px solid;} /* listing suggestion pages */ .suggest_img_pending {color:red;font-weight:bold;} .suggest_img_removal_pending {color:red;font-weight:bold;} .suggest_img_approved {color:green;font-weight:bold;} /* add_category.php edit_category.php states.php edit_listing_content.php add_listing_content.php */ .ff-main {width:800px;max-width:100%;margin:0px auto;} .full-width {width:1200px;max-width:100%;} .ff-left {width:50%;min-width:300px;float:left;} .ff-right {width:50%;min-width:300px;float:left;} .form-field-60 {float:left;width:60%;} .form-field-40 {float:left;width:38%;margin-left:2%;} .form-field-20 {float:left;width:18%;margin-left:2%;} .form-data {background-color:#f2f2f2;border:#ddd 1px solid;padding:20px;} .form-fields-container {float:left;height:auto;overflow:hidden;width:100%;} .form-fields-left {float:left;width:60%;min-width:300px;} .form-fields-middle {float:left;width:18%;margin-left:2%;} .form-fields-right {float:left;width:18%;margin-left:2%;} .form-field {margin-bottom:20px;} .field-float {float:left;margin-right:20px;} .form-field-wrapper {float:none;width:100%;} .form-field-group { box-sizing: border-box; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; float:left;margin-bottom:10px;width:100%;padding:15px 15px 0px 15px;border:#a5a5a5 1px solid;border-top-width:0px; } .form-fields-container input[type=text], .ff-main input[type=text] { padding: 8px; font-size: 16px; width:auto; } .form-fields-container textarea, .ff-main textarea { padding: 8px; font-size:12px !important; } .form-fields-container select, .ff-main select { padding: 8px; font-size: 16px; } .form-fields-container h3, .ff-main h3 { box-sizing: border-box; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; display:block;width:100%;float:left;padding:5px 5px 5px 10px;margin:0px;background-color:#d53333;color:#FFFFFF; } ul.parsley-errors-list {list-style-type:none !important;padding:0px !important;margin:5px 0px 15px 0px !important;} .parsley-errors-list li {color:red;display:inline;line-height:1em;} .input-label {margin-bottom:5px;font-size:16px;} input#email {width:300px;} input#age {width:auto;} #height_feet {width:auto;} #height_inches {width:auto;} #location {width:400px;max-width:100%;} #height, #weight, #bust_size, #body_type, #ethnicity, #hair, #eye, #skin, #dress_size, #breast_type {width:125px !important;} .start-time, .end-time {width:auto!important;margin:0px 0px 5px 0px!important;} .start-am-pm, .end-am-pm {width:auto!important;} #working-hours {border-spacing:0;border-collapse:collapse;} #working-hours td {text-align:left;padding:0px 5px 0px 0px;} #working-hours th {text-align:left;padding:0px 5px 13px 0px;} #working-hours tr {vertical-align:baseline !important;} .client-type-label, .service-label, .in-out-call-label {display:inline-block;margin-right:15px;float:left;} #extra-info {display:block;} .price-label {width:90px;display:inline-block;text-align:right;padding-right:5px;} .price {width:90px !important;} /* Suburb Autocomplete */ #location-list {float:left;list-style:none;margin:0px 0px 0px 0px;padding:0px;width:180px;position: absolute;} #location-list li {font-size:15px;line-height:1.25em;padding:9px 6px 9px 6px;margin:0px;background: #f0f0f0; border-bottom: #bbb9b9 1px solid;} #location-list li:hover {background:#ece3d2;cursor: pointer;} #location-list li.suggestion-heading {cursor:auto;background: #d4d4d4;padding:2px 6px 2px 6px;} #username-list {float:left;list-style:none;margin:0px 0px 0px 0px;padding:0px;width:180px;} #username-list li {font-size:15px;line-height:1.25em;padding:9px 6px 9px 6px;margin:0px;background: #f0f0f0; border-bottom: #bbb9b9 1px solid;} #username-list li:hover {background:#ece3d2;cursor: pointer;} /* Review Management */ #review_management { margin: 20px auto; max-width: 1200px; padding: 20px; } /* Error and Success Messages */ #review_management .revmgmt_error { color: #d32f2f; background-color: #ffebee; padding: 10px; border-radius: 5px; margin-bottom: 15px; font-weight: bold; } #review_management .revmgmt_success { color: #388e3c; background-color: #e8f5e9; padding: 10px; border-radius: 5px; margin-bottom: 15px; font-weight: bold; } /* Search Form Styling */ #review_management .revmgmt_search-form { background-color: #f5f5f5; padding: 20px; border-radius: 8px; margin-bottom: 20px; box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1); } #review_management .revmgmt_search-form form { display: flex; flex-wrap: wrap; gap: 15px; align-items: center; } #review_management .revmgmt_form-group { display: flex; flex-direction: column; min-width: 200px; flex: 1; } #review_management .revmgmt_form-group label { font-size: 14px; margin-bottom: 5px; color: #333; } #review_management .revmgmt_form-group input { padding: 8px; border: 1px solid #ddd; border-radius: 4px; font-size: 14px; } /* Approval Filter Styling */ #review_management .revmgmt_approval-filter { display: flex; gap: 10px; justify-content: center; margin-bottom: 20px; } #review_management .revmgmt_filter-btn { text-decoration: none; padding: 8px 15px; border: 1px solid #ddd; border-radius: 4px; font-size: 14px; color: #1976d2; background-color: #f5f5f5; transition: background-color 0.3s, color 0.3s; } #review_management .revmgmt_filter-btn:hover { background-color: #1976d2; color: white; } #review_management .revmgmt_filter-btn.revmgmt_filter-active { background-color: #1976d2; color: white; font-weight: bold; } /* Standardized Button Styling */ #review_management .revmgmt_toggle-btn, #review_management .revmgmt_edit-btn, #review_management .revmgmt_delete-btn, #review_management .revmgmt_search-btn, #review_management .revmgmt_reset-btn, #review_management .revmgmt_update-btn, #review_management .revmgmt_cancel-btn { border: none; padding: 8px 15px; border-radius: 4px; cursor: pointer; font-size: 14px; line-height: 1.5; height: 36px; box-sizing: border-box; transition: background-color 0.3s; } /* Specific Button Colors and Hover Effects */ #review_management .revmgmt_toggle-btn.revmgmt_approve { background-color: #388e3c; color: white; } #review_management .revmgmt_toggle-btn.revmgmt_unapprove { background-color: #f57c00; color: white; } #review_management .revmgmt_toggle-btn.revmgmt_approve:hover { background-color: #2e7d32; } #review_management .revmgmt_toggle-btn.revmgmt_unapprove:hover { background-color: #e65100; } #review_management .revmgmt_edit-btn { background-color: #1976d2; color: white; } #review_management .revmgmt_edit-btn:hover { background-color: #1565c0; } #review_management .revmgmt_delete-btn { background-color: #d32f2f; color: white; } #review_management .revmgmt_delete-btn:hover { background-color: #b71c1c; } #review_management .revmgmt_search-btn { background-color: #1976d2; color: white; } #review_management .revmgmt_search-btn:hover { background-color: #1565c0; } #review_management .revmgmt_reset-btn { background-color: #757575; color: white; } #review_management .revmgmt_reset-btn:hover { background-color: #616161; } #review_management .revmgmt_update-btn { background-color: #1976d2; color: white; } #review_management .revmgmt_update-btn:hover { background-color: #1565c0; } #review_management .revmgmt_cancel-btn { background-color: #757575; color: white; } #review_management .revmgmt_cancel-btn:hover { background-color: #616161; } /* Reviews Container Styling */ #review_management .revmgmt_reviews-container { margin-bottom: 20px; } #review_management .revmgmt_no-reviews { text-align: center; padding: 20px; background-color: #f9f9f9; border-radius: 8px; color: #666; box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1); } #review_management .revmgmt_review-box-container { display: flex; justify-content: space-between; margin-bottom: 20px; background-color: white; border-radius: 8px; overflow: hidden; box-shadow: 0 3px 10px rgba(0, 0, 0, 0.1); padding: 15px; transition: transform 0.2s, box-shadow 0.2s; } #review_management .revmgmt_review-box-container:hover { transform: translateY(-5px); box-shadow: 0 5px 15px rgba(0, 0, 0, 0.15); } #review_management .revmgmt_review-box { padding: 10px; box-sizing: border-box; } #review_management .revmgmt_box-left { width: 25%; min-width: 200px; border-right: 1px solid #eee; } #review_management .revmgmt_box-middle { width: 45%; min-width: 250px; border-right: 1px solid #eee; } #review_management .revmgmt_box-right { width: 30%; min-width: 150px; display: flex; flex-direction: column; gap: 10px; align-items: stretch; justify-content: center; } #review_management .revmgmt_review-box p { margin: 5px 0; font-size: 14px; color: #555; line-height: 1.5; } #review_management .revmgmt_review-box p strong { color: #333; min-width: 80px; display: inline-block; } #review_management .revmgmt_approved-status { padding: 5px 10px; border-radius: 4px; font-size: 12px; font-weight: bold; margin-top: 5px; display: inline-block; } #review_management .revmgmt_approved-status.revmgmt_approved { background-color: #c8e6c9; color: #2e7d32; } #review_management .revmgmt_approved-status.revmgmt_unapproved { background-color: #ffcdd2; color: #d32f2f; } #review_management .revmgmt_action-form { display: inline; margin-top: 0px; width: 100%; } #review_management .revmgmt_action-form button { width: 100%; margin: 0; } #review_management .revmgmt_edit-btn { width: 100%; margin: 0; } #review_management .revmgmt_edit-form { display: none; margin-top: 20px; padding: 15px; background-color: #f9f9f9; border-radius: 5px; width: 100%; box-sizing: border-box; box-shadow: 0 3px 10px rgba(0, 0, 0, 0.1); } #review_management .revmgmt_edit-form h3 { margin-top: 0; font-size: 16px; color: #333; } #review_management .revmgmt_edit-form textarea { width: 100%; height: 120px; padding: 10px; border: 1px solid #ddd; border-radius: 4px; font-size: 14px; margin-bottom: 10px; resize: vertical; } #review_management .revmgmt_form-actions { display: flex; gap: 10px; margin-top: 10px; } /* Pagination Styling */ #review_management .revmgmt_pagination { display: flex; justify-content: center; align-items: center; gap: 10px; margin-top: 20px; flex-wrap: wrap; } #review_management .revmgmt_pagination a { text-decoration: none; color: #1976d2; padding: 8px 12px; border: 1px solid #ddd; border-radius: 4px; font-size: 14px; transition: background-color 0.3s, color 0.3s; } #review_management .revmgmt_pagination a:hover { background-color: #1976d2; color: white; } #review_management .revmgmt_pagination a.revmgmt_active { background-color: #1976d2; color: white; font-weight: bold; } /* Responsive Adjustments */ @media (max-width: 1200px) { #review_management .revmgmt_edit-form { margin-top: 10px; width: 100%; } #review_management .revmgmt_review-box-container { flex-direction: column; gap: 15px; } #review_management .revmgmt_review-box { width: 100%; border-right: none; border-bottom: 1px solid #eee; } #review_management .revmgmt_box-left, #review_management .revmgmt_box-middle, #review_management .revmgmt_box-right { min-width: 100%; } #review_management .revmgmt_box-right { flex-direction: row; justify-content: space-around; align-items: center; } } @media (max-width: 768px) { #review_management .revmgmt_search-form form { flex-direction: column; align-items: stretch; } #review_management .revmgmt_form-group { min-width: 100%; } #review_management .revmgmt_review-box-container { flex-direction: column; gap: 15px; } #review_management .revmgmt_review-box { width: 100%; border-right: none; border-bottom: 1px solid #eee; } #review_management .revmgmt_box-left, #review_management .revmgmt_box-middle, #review_management .revmgmt_box-right { min-width: 100%; } #review_management .revmgmt_box-right { flex-direction: row; justify-content: space-around; align-items: center; } #review_management .revmgmt_action-form button, #review_management .revmgmt_edit-btn { width: auto; min-width: 80px; max-width: 100px; flex-grow: 1; flex-shrink: 1; padding: 8px 10px; margin: 0 2px; text-align: center; } #review_management .revmgmt_approval-filter { flex-direction: column; align-items: center; } #review_management .revmgmt_filter-btn { width: 100%; max-width: 200px; text-align: center; } } @media (max-width: 480px) { #review_management { padding: 10px; } #review_management .revmgmt_box-right { flex-direction: column; align-items: stretch; } #review_management .revmgmt_action-form button, #review_management .revmgmt_edit-btn { width: 100%; margin-bottom: 5px; } #review_management .revmgmt_search-buttons { flex-direction: column; align-items: center; } #review_management .revmgmt_search-btn, #review_management .revmgmt_reset-btn { width: 100%; max-width: 200px; margin-bottom: 5px; } #review_management .revmgmt_approval-filter { flex-direction: column; align-items: stretch; } #review_management .revmgmt_filter-btn { width: 100%; margin-bottom: 5px; } } /* END - Review Management */ /* Favourites and Lists */ #favlists_container { width: 95%; margin: 20px auto; background-color: #FFFFFF; } /* Dropdown for selecting lists */ .favlists_list-selector { display:block; width:100%; margin-bottom: 30px; } .favlists_list-selector select { padding: 8px; font-size: 14px; border: 1px solid #d4d4d4; border-radius: 5px; width: 100%; max-width: 300px; background-color: #fff; cursor: pointer; } .favlists_list-selector select:focus { outline: none; border-color: #B0000B; } /* Controls for the selected list */ .favlists_list-options { margin-bottom: 15px; } .favlists_list-controls { display: flex; align-items: center; flex-wrap: wrap; gap: 10px; } .favlists_list-name { font-size: 16px; font-weight: bold; color: #333; } #favlists_header { text-align: center; margin-bottom: 20px; } #favlists_header h1 { font-size: 30px; margin: 0; color: #B0000B; } #favlists_lists-wrapper { display: flex; flex-wrap: wrap; margin-bottom: 30px; border-bottom: #d4d4d4 2px solid; padding-bottom: 10px; } .favlists_list-item { margin-right: 80px; margin-bottom: 10px; display: flex; align-items: center; } .favlists_list-item a { display: inline-block; padding: 8px 15px; background-color: #f5f5f5; color: #222222; text-decoration: none; border-radius: 5px; border: #d4d4d4 1px solid; transition: background-color 0.3s, color 0.3s; } .favlists_list-item a:hover { background-color: #B0000B; color: #FFFFFF; border-color: #B0000B; } .favlists_list-item.favlists_active a { background-color: #B0000B; color: #FFFFFF; border-color: #B0000B; font-weight: bold; } .favlists_list-visibility { font-size: 12px; color: #888; margin-left: 5px; } .favlists_list-item.favlists_active .favlists_list-visibility { color: #FFFFFF; } .favlists_remove-list-btn, .favlists_edit-description-btn { cursor: pointer; background-color: #B0000B; color: #FFFFFF; border: none; padding: 5px 10px; border-radius: 5px; font-size: 12px; transition: background-color 0.3s; } .favlists_remove-list-btn:hover, .favlists_edit-description-btn:hover { background-color: #800000; } .favlists_visibility-toggle { padding: 5px; font-size: 12px; border: 1px solid #d4d4d4; border-radius: 5px; background-color: #fff; cursor: pointer; } .favlists_visibility-toggle:focus { outline: none; border-color: #B0000B; } #favlists_listings-wrapper { display: flex; flex-wrap: wrap; justify-content: space-between; } .favlists_listing-item { width: 48%; /* 2 items per row on larger screens */ margin-bottom: 20px; background-color: #FFFFFF; border: #cecece 1px solid; padding: 10px; border-radius: 5px; box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1); display: flex; flex-direction: row; align-items: flex-start; } .favlists_listing-thumb-wrapper { width: 150px; min-width: 150px; /* Ensure thumbnail width doesn't shrink */ height: 150px; margin-right: 15px; display: flex; justify-content: center; align-items: center; border: #d4d4d4 1px solid; background-color: #f5f5f5; } .favlists_listing-thumb { max-width: 100%; max-height: 100%; object-fit: cover; } .favlists_listing-details { flex-grow: 1; text-align: left; overflow: hidden; max-width: 100%; /* Prevent overflow beyond parent */ box-sizing: border-box; } .favlists_listing-title { font-weight: bold; font-size: 16px; margin-bottom: 8px; display: block; color: #222222; text-decoration: none; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; max-width: 100%; /* Ensure it respects parent container width */ box-sizing: border-box; /* Include padding/borders in width calculation */ overflow-wrap: break-word; /* Break long words if necessary */ } .favlists_listing-title:hover { color: #B0000B; } .favlists_listing-info { font-size: 14px; line-height: 1.5em; color: #555; margin-bottom: 5px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .favlists_listing-contact { font-size: 14px; line-height: 1.5em; color: #333; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .favlists_listing-contact a { color: #B0000B; text-decoration: none; } .favlists_listing-contact a:hover { text-decoration: underline; } .favlists_remove-listing-btn { cursor: pointer; background-color: #B0000B; color: #FFFFFF; border: none; padding: 5px 10px; margin-top: 5px; border-radius: 5px; font-size: 14px; transition: background-color 0.3s; } .favlists_remove-listing-btn:hover { background-color: #800000; } .favlists_empty-message { width: 100%; text-align: center; font-style: italic; color: #888; font-size: 16px; padding: 20px; } #favlists_pagination-wrapper { width: 100%; text-align: center; margin-top: 20px; } .favlists_pagination { display: inline-block; margin: 0 auto; } .favlists_pagination a { display: inline-block; padding: 8px 12px; margin: 0 5px; background-color: #f5f5f5; color: #222222; text-decoration: none; border: #d4d4d4 1px solid; border-radius: 5px; transition: background-color 0.3s, color 0.3s; } .favlists_pagination a:hover { background-color: #B0000B; color: #FFFFFF; border-color: #B0000B; } .favlists_pagination .favlists_active { background-color: #B0000B; color: #FFFFFF; border-color: #B0000B; font-weight: bold; } @media screen and (max-width: 1024px) { .favlists_listing-item { width: 48%; /* Still 2 items per row */ } } @media screen and (max-width: 768px) { .favlists_listing-item { width: 100%; /* 1 item per row on smaller screens */ } #favlists_container { width: 95%; } } @media screen and (max-width: 480px) { #favlists_lists-wrapper { flex-direction: column; } .favlists_list-item { margin-right: 0; } .favlists_listing-item { flex-direction: column; /* Stack thumbnail above details on very small screens */ align-items: center; } .favlists_listing-thumb-wrapper { margin-right: 0; margin-bottom: 10px; } .favlists_listing-details { text-align: center; } .favlists_pagination a { padding: 6px 10px; margin: 0 2px; font-size: 14px; } } .favlists_list-header { display: flex; align-items: center; flex-wrap: wrap; } .favlists_list-description-wrapper { margin-top: 10px; margin-bottom: 10px; width: 100%; /* Ensure it takes full width to appear below */ } .favlists_list-description { display: block; margin-bottom: 5px; font-size: 13px; color: #555; word-wrap: break-word; } .favlists_no-description { font-style: italic; color: #888; } .favlists_description-edit { margin-top: 5px; } .favlists_description-input { width: 100%; padding: 5px; font-size: 12px; border: 1px solid #d4d4d4; border-radius: 5px; margin-bottom: 5px; min-height: 120px; resize: vertical; } .favlists_description-buttons { display: flex; gap: 5px; } .favlists_save-description-btn, .favlists_cancel-description-btn { cursor: pointer; background-color: #B0000B; color: #FFFFFF; border: none; padding: 5px 10px; border-radius: 5px; font-size: 12px; transition: background-color 0.3s; } .favlists_save-description-btn:hover, .favlists_cancel-description-btn:hover { background-color: #800000; } @media screen and (max-width: 480px) { .favlists_list-controls { flex-direction: column; align-items: flex-start; gap: 5px; } .favlists_list-selector select { max-width: 100%; } } /* END - Favourites and Lists */ /* Comment Management */ /* Reset and Base Styles */ #comment_mgmt_wrapper { font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, sans-serif; line-height: 1.6; color: #333; max-width: 1400px; margin: 0 auto; padding: 20px; } #comment_mgmt_wrapper * { box-sizing: border-box; } #comment_mgmt_title { color: #2c3e50; margin-bottom: 30px; font-size: 28px; font-weight: 600; } /* Search Section */ #comment_mgmt_search_section { background: #f8f9fa; padding: 25px; border-radius: 8px; margin-bottom: 20px; box-shadow: 0 2px 4px rgba(0,0,0,0.1); } #comment_mgmt_search_section h2 { margin-top: 0; margin-bottom: 20px; color: #2c3e50; font-size: 20px; } #comment_mgmt_search_form { display: flex; flex-direction: column; gap: 15px; } .comment_mgmt_form_row { display: grid; grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)); gap: 15px; } .comment_mgmt_form_group { display: flex; flex-direction: column; } .comment_mgmt_form_group label { margin-bottom: 5px; font-weight: 500; color: #555; font-size: 14px; } .comment_mgmt_form_group input, .comment_mgmt_form_group select, .comment_mgmt_form_group textarea { padding: 8px 12px; border: 1px solid #ddd; border-radius: 4px; font-size: 14px; transition: border-color 0.3s; } .comment_mgmt_form_group input:focus, .comment_mgmt_form_group select:focus, .comment_mgmt_form_group textarea:focus { outline: none; border-color: #4CAF50; } .comment_mgmt_buttons { display: flex; gap: 10px; align-items: flex-end; } /* Filter Buttons */ #comment_mgmt_filter_buttons { display: flex; gap: 10px; margin-bottom: 20px; flex-wrap: wrap; } .comment_mgmt_filter_btn { padding: 10px 20px; background: #fff; border: 2px solid #ddd; border-radius: 25px; text-decoration: none; color: #333; font-weight: 500; transition: all 0.3s; } .comment_mgmt_filter_btn:hover { border-color: #4CAF50; color: #4CAF50; } .comment_mgmt_filter_active { background: #4CAF50; color: white; border-color: #4CAF50; } /* Buttons */ .comment_mgmt_btn { padding: 8px 16px; border: none; border-radius: 4px; cursor: pointer; font-size: 14px; font-weight: 500; text-decoration: none; display: inline-block; transition: all 0.3s; } .comment_mgmt_btn_primary { background: #4CAF50; color: white; } .comment_mgmt_btn_primary:hover { background: #45a049; } .comment_mgmt_btn_secondary { background: #6c757d; color: white; } .comment_mgmt_btn_secondary:hover { background: #5a6268; } .comment_mgmt_btn_success { background: #28a745; color: white; } .comment_mgmt_btn_success:hover { background: #218838; } .comment_mgmt_btn_warning { background: #ffc107; color: #212529; } .comment_mgmt_btn_warning:hover { background: #e0a800; } .comment_mgmt_btn_danger { background: #dc3545; color: white; } .comment_mgmt_btn_danger:hover { background: #c82333; } .comment_mgmt_btn_small { padding: 6px 12px; font-size: 13px; } .comment_mgmt_btn_edit { background: #007bff; color: white; } .comment_mgmt_btn_edit:hover { background: #0056b3; } /* Results Section */ #comment_mgmt_results_section { background: white; padding: 0; border-radius: 8px; box-shadow: 0 2px 4px rgba(0,0,0,0.1); } .comment_mgmt_no_results { text-align: center; color: #666; padding: 40px 20px; } /* Comment Items */ .comment_mgmt_comment_item { display: grid; grid-template-columns: 300px 1fr; gap: 20px; padding: 20px; border-bottom: 1px solid #eee; transition: background 0.2s; } .comment_mgmt_comment_item:hover { background: #f8f9fa; } .comment_mgmt_comment_item:last-child { border-bottom: none; } .comment_mgmt_comment_left { display: flex; flex-direction: column; gap: 8px; } .comment_mgmt_comment_right { display: flex; flex-direction: column; gap: 15px; } .comment_mgmt_comment_info { display: flex; gap: 10px; font-size: 14px; } .comment_mgmt_label { font-weight: 600; color: #666; min-width: 60px; } .comment_mgmt_listing_link { color: #007bff; text-decoration: none; font-weight: 500; } .comment_mgmt_listing_link:hover { text-decoration: underline; } .comment_mgmt_message_content { background: #f8f9fa; padding: 15px; border-radius: 6px; line-height: 1.6; word-break: break-word; flex-grow: 1; } /* Status Badges */ .comment_mgmt_status_badge { padding: 4px 12px; border-radius: 12px; font-size: 12px; font-weight: 500; display: inline-block; } .comment_mgmt_status_approved { background: #d4edda; color: #155724; } .comment_mgmt_status_unapproved { background: #f8d7da; color: #721c24; } /* Actions */ .comment_mgmt_actions { display: flex; gap: 8px; flex-wrap: wrap; } .comment_mgmt_actions form { display: inline-block; margin: 0; } /* Pagination */ #comment_mgmt_pagination { display: flex; justify-content: center; align-items: center; gap: 5px; padding: 20px; border-top: 1px solid #eee; } .comment_mgmt_pagination_link { padding: 6px 12px; border: 1px solid #ddd; border-radius: 4px; text-decoration: none; color: #333; transition: all 0.3s; } .comment_mgmt_pagination_link:hover { background: #f8f9fa; border-color: #aaa; } .comment_mgmt_pagination_active { background: #4CAF50; color: white; border-color: #4CAF50; } .comment_mgmt_pagination_ellipsis { padding: 0 5px; color: #666; } /* Modal */ .comment_mgmt_modal { display: none; position: fixed; z-index: 1000; left: 0; top: 0; width: 100%; height: 100%; background-color: rgba(0,0,0,0.5); } .comment_mgmt_modal_content { background-color: white; margin: 50px auto; padding: 30px; border-radius: 8px; width: 90%; max-width: 600px; position: relative; box-shadow: 0 4px 6px rgba(0,0,0,0.1); } .comment_mgmt_modal_close { position: absolute; right: 20px; top: 20px; font-size: 28px; font-weight: bold; color: #aaa; cursor: pointer; } .comment_mgmt_modal_close:hover { color: #000; } .comment_mgmt_modal_content h2 { margin-top: 0; margin-bottom: 20px; color: #2c3e50; } #comment_mgmt_edit_message { width: 100%; min-height: 200px; resize: vertical; } /* Responsive Design */ @media (max-width: 768px) { #comment_mgmt_wrapper { padding: 10px; } .comment_mgmt_form_row { grid-template-columns: 1fr; } /* Stack comment layout on mobile */ .comment_mgmt_comment_item { grid-template-columns: 1fr; gap: 15px; padding: 15px; } .comment_mgmt_comment_left { padding-bottom: 15px; border-bottom: 1px solid #eee; } .comment_mgmt_message_content { font-size: 14px; padding: 12px; } .comment_mgmt_btn_small { padding: 5px 10px; font-size: 12px; } .comment_mgmt_modal_content { width: 95%; margin: 20px auto; padding: 20px; } #comment_mgmt_filter_buttons { justify-content: center; } .comment_mgmt_filter_btn { padding: 8px 15px; font-size: 14px; } } @media (max-width: 480px) { #comment_mgmt_title { font-size: 24px; } #comment_mgmt_search_section { padding: 15px; } .comment_mgmt_comment_item { padding: 12px; } .comment_mgmt_comment_info { font-size: 13px; } .comment_mgmt_label { min-width: 50px; font-size: 13px; } .comment_mgmt_actions { flex-direction: column; width: 100%; } .comment_mgmt_actions form { width: 100%; } .comment_mgmt_actions .comment_mgmt_btn { width: 100%; } #comment_mgmt_pagination { padding: 15px; flex-wrap: wrap; } .comment_mgmt_pagination_link { padding: 5px 10px; font-size: 13px; } } /* Additional utility classes */ .comment_mgmt_text_truncate { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .comment_mgmt_clearfix::after { content: ""; display: table; clear: both; } /* Loading state */ .comment_mgmt_loading { opacity: 0.6; pointer-events: none; } /* Tooltip for date hover */ .comment_mgmt_comment_info span[title] { cursor: help; position: relative; } .comment_mgmt_comment_info span[title]:hover::after { content: attr(title); position: absolute; bottom: 100%; left: 0; background: #333; color: white; padding: 5px 10px; border-radius: 4px; white-space: nowrap; font-size: 12px; margin-bottom: 5px; z-index: 100; } /* Print styles */ @media print { #comment_mgmt_search_section, #comment_mgmt_filter_buttons, .comment_mgmt_actions, #comment_mgmt_pagination { display: none; } .comment_mgmt_comment_item { page-break-inside: avoid; border: 1px solid #ddd; margin-bottom: 10px; } } /* Animations */ @keyframes comment_mgmt_fadeIn { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: translateY(0); } } .comment_mgmt_modal_content { animation: comment_mgmt_fadeIn 0.3s ease-out; } /* Focus styles for accessibility */ .comment_mgmt_btn:focus, .comment_mgmt_filter_btn:focus, .comment_mgmt_pagination_link:focus, input:focus, select:focus, textarea:focus { outline: 2px solid #4CAF50; outline-offset: 2px; } /* High contrast mode support */ @media (prefers-contrast: high) { .comment_mgmt_btn, .comment_mgmt_filter_btn { border: 2px solid currentColor; } .comment_mgmt_status_badge { border: 1px solid currentColor; } } /* Dark mode support (optional) */ @media (prefers-color-scheme: dark) { #comment_mgmt_wrapper { color: #e0e0e0; } #comment_mgmt_search_section, #comment_mgmt_results_section, .comment_mgmt_modal_content { background: #2a2a2a; } .comment_mgmt_comment_item:hover { background: #333; } .comment_mgmt_message_content { background: #333; color: #e0e0e0; } input, select, textarea { background: #333; color: #e0e0e0; border-color: #555; } .comment_mgmt_filter_btn { background: #333; color: #e0e0e0; border-color: #555; } .comment_mgmt_filter_active { background: #4CAF50; color: white; border-color: #4CAF50; } } /* END - Comment Management */ /* search_log.php Styles */ /* Suggestions styling */ .search_log_suggestions { border: 1px solid #ccc; max-height: 150px; overflow-y: auto; position: absolute; background: white; width: 300px; } .search_log_suggestions div { padding: 5px; cursor: pointer; } .search_log_suggestions div:hover { background: #f0f0f0; } /* Responsive table wrapper */ .search_log_responsive_table { overflow-x: auto; /* Horizontal scroll on small screens */ width: 100%; } /* Table styling (scoped to .search_log_results_table) */ .search_log_results_table { width: 100%; border-collapse: collapse; margin: 20px 0; } .search_log_results_table th, .search_log_results_table td { padding: 8px; text-align: left; border: 1px solid #ddd; } .search_log_results_table th { background-color: #f2f2f2; } /* Media query for mobile: Stack rows vertically (scoped to .search_log_results_table) */ @media screen and (max-width: 600px) { .search_log_results_table { border: 0; } .search_log_results_table thead { display: none; /* Hide headers on small screens */ } .search_log_results_table tr { display: block; margin-bottom: 10px; border: 1px solid #ddd; } .search_log_results_table td { display: block; text-align: right; border: none; border-bottom: 1px solid #eee; position: relative; padding-left: 50%; } .search_log_results_table td::before { content: attr(data-label); /* Use data-label for pseudo-headers */ position: absolute; left: 10px; font-weight: bold; text-transform: uppercase; } .search_log_results_table td:last-child { border-bottom: 0; } } /* END - search_log.php Styles */ /* Memcached Monitor CSS */ .mem_mon_memcached-monitor { font-family: 'Courier New', monospace; background-color: #f8f9fa; padding: 20px; border-radius: 8px; margin: 20px 0; } .mem_mon_status-header { background: linear-gradient(135deg, #667eea 0%, #764ba2 100%); color: white; padding: 15px; border-radius: 8px 8px 0 0; margin: -20px -20px 20px -20px; } .mem_mon_stats-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)); gap: 15px; margin: 20px 0; } .mem_mon_stat-card { background: white; padding: 15px; border-radius: 6px; box-shadow: 0 2px 4px rgba(0,0,0,0.1); border-left: 4px solid #007bff; } .mem_mon_stat-label { font-size: 12px; color: #666; text-transform: uppercase; margin-bottom: 5px; } .mem_mon_stat-value { font-size: 24px; font-weight: bold; color: #333; } .mem_mon_slab-table { width: 100%; border-collapse: collapse; background: white; border-radius: 6px; overflow: hidden; box-shadow: 0 2px 4px rgba(0,0,0,0.1); margin: 20px 0; } .mem_mon_slab-table th { background-color: #343a40; color: white; padding: 12px; text-align: left; font-weight: 600; } .mem_mon_slab-table td { padding: 10px 12px; border-bottom: 1px solid #dee2e6; } .mem_mon_slab-table tr:hover { background-color: #f8f9fa; } .mem_mon_recommendations { background: #d4edda; border: 1px solid #c3e6cb; border-radius: 6px; padding: 15px; margin: 20px 0; } .mem_mon_recommendations h3 { color: #155724; margin-top: 0; } .mem_mon_efficiency-high { color: #28a745; font-weight: bold; } .mem_mon_efficiency-medium { color: #ffc107; font-weight: bold; } .mem_mon_efficiency-low { color: #dc3545; font-weight: bold; } .mem_mon_usage-bar { width: 100px; height: 8px; background: #e9ecef; border-radius: 4px; overflow: hidden; } .mem_mon_usage-fill { height: 100%; background: linear-gradient(90deg, #28a745, #ffc107, #dc3545); transition: width 0.3s ease; } .mem_mon_sub-text { font-size: 12px; color: #666; margin-top: 5px; } .mem_mon_usage-container { display: flex; align-items: center; gap: 10px; } /* Memcached Monitor Alert Styles */ .mem_mon_alert { padding: 12px 16px; border-radius: 6px; margin: 15px 0; font-weight: 500; } .mem_mon_alert-success { background-color: #d4edda; border: 1px solid #c3e6cb; color: #155724; } .mem_mon_alert-error { background-color: #f8d7da; border: 1px solid #f5c6cb; color: #721c24; } /* Header with buttons */ .mem_mon_header-content { display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 15px; } .mem_mon_header-actions { display: flex; gap: 10px; } /* Button styles */ .mem_mon_btn { padding: 8px 16px; border: none; border-radius: 4px; cursor: pointer; font-size: 14px; font-weight: 500; transition: all 0.3s ease; text-decoration: none; display: inline-block; } .mem_mon_btn-refresh { background-color: #007bff; color: white; } .mem_mon_btn-refresh:hover { background-color: #0056b3; transform: translateY(-1px); } .mem_mon_btn-danger { background-color: #dc3545; color: white; } .mem_mon_btn-danger:hover { background-color: #c82333; transform: translateY(-1px); } /* Success button style */ .mem_mon_btn-success { background-color: #28a745; color: white; } .mem_mon_btn-success:hover { background-color: #218838; transform: translateY(-1px); } /* Warning button style */ .mem_mon_btn-warning { background-color: #ffc107; color: #212529; } .mem_mon_btn-warning:hover { background-color: #e0a800; transform: translateY(-1px); } .mem_mon_key-management { background: #f8f9fa; border: 1px solid #e9ecef; border-radius: 8px; padding: 20px; margin: 20px 0; } .mem_mon_management-grid { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 20px; margin-bottom: 20px; } .mem_mon_management-section { background: white; border: 1px solid #dee2e6; border-radius: 6px; padding: 15px; } .mem_mon_management-section h4 { margin: 0 0 15px 0; color: #495057; font-size: 16px; } .mem_mon_form-group { margin-bottom: 15px; } .mem_mon_form-group label { display: block; margin-bottom: 5px; font-weight: 600; color: #495057; } .mem_mon_form-control { width: 100%; padding: 8px 12px; border: 1px solid #ced4da; border-radius: 4px; font-size: 14px; box-sizing: border-box; } .mem_mon_btn-small { padding: 6px 12px; font-size: 12px; border-radius: 3px; border: none; cursor: pointer; text-decoration: none; display: inline-block; margin-right: 5px; margin-bottom: 5px; } .mem_mon_warning-box { background: #fff3cd; border: 1px solid #ffeaa7; color: #856404; padding: 10px; border-radius: 4px; margin-bottom: 15px; font-size: 13px; } .mem_mon_stats-highlight { background: #e7f3ff; border: 1px solid #b3d7ff; border-radius: 4px; padding: 15px; margin: 15px 0; font-size: 14px; } /* Preview Section Styles */ .mem_mon_preview-section { background: #ffffff; border: 2px solid #007bff; border-radius: 8px; margin: 20px 0; box-shadow: 0 4px 6px rgba(0, 123, 255, 0.1); } .mem_mon_preview-section.mem_mon_preview-empty { border-color: #dc3545; box-shadow: 0 4px 6px rgba(220, 53, 69, 0.1); } .mem_mon_preview-header { background: linear-gradient(135deg, #007bff, #0056b3); color: white; padding: 15px 20px; border-radius: 6px 6px 0 0; display: flex; justify-content: space-between; align-items: center; } .mem_mon_preview-empty .mem_mon_preview-header { background: linear-gradient(135deg, #dc3545, #c82333); } .mem_mon_preview-title h3 { margin: 0; font-size: 18px; font-weight: 600; } .mem_mon_preview-stats { display: flex; gap: 10px; margin-top: 8px; } .mem_mon_stat-badge { background: rgba(255, 255, 255, 0.2); padding: 4px 8px; border-radius: 12px; font-size: 12px; font-weight: 500; } .mem_mon_stat-badge.mem_mon_warning { background: rgba(255, 193, 7, 0.9); color: #212529; } .mem_mon_preview-controls { display: flex; align-items: center; } .mem_mon_btn-toggle { background: rgba(255, 255, 255, 0.2); color: white; border: 1px solid rgba(255, 255, 255, 0.3); padding: 6px 12px; border-radius: 4px; font-size: 12px; cursor: pointer; transition: all 0.3s ease; font-weight: 500; } .mem_mon_btn-toggle:hover { background: rgba(255, 255, 255, 0.3); border-color: rgba(255, 255, 255, 0.5); } .mem_mon_preview-content { transition: all 0.3s ease; overflow: hidden; } .mem_mon_preview-content.hidden { max-height: 0; opacity: 0; } .mem_mon_preview-table-container { overflow-x: auto; max-height: 600px; overflow-y: auto; } .mem_mon_preview-table { width: 100%; border-collapse: collapse; font-size: 13px; } .mem_mon_preview-table thead { position: sticky; top: 0; z-index: 10; } .mem_mon_preview-table th { background: #f8f9fa; color: #495057; padding: 12px 8px; text-align: left; font-weight: 600; border-bottom: 2px solid #dee2e6; } .mem_mon_preview-table td { padding: 10px 8px; border-bottom: 1px solid #f0f0f0; vertical-align: middle; } .mem_mon_preview-table tbody tr:hover { background-color: #f8f9fa; } .mem_mon_col-key { width: 50%; } .mem_mon_col-size { width: 15%; } .mem_mon_col-expires { width: 15%; } .mem_mon_col-action { width: 20%; } .mem_mon_key-cell { max-width: 0; overflow: hidden; } .mem_mon_key-text { font-family: 'Courier New', monospace; font-size: 12px; color: #495057; display: block; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 100%; } .mem_mon_size-cell { text-align: center; } .mem_mon_size-badge { background: #e9ecef; color: #495057; padding: 4px 8px; border-radius: 12px; font-size: 11px; font-weight: 600; display: inline-block; } .mem_mon_expires-cell { text-align: center; font-weight: 500; } .mem_mon_expires-cell.mem_mon_expired { color: #dc3545; font-weight: 600; } .mem_mon_action-cell { text-align: center; } .mem_mon_btn-delete { background: #dc3545; color: white; border: none; padding: 4px 8px; border-radius: 4px; font-size: 11px; cursor: pointer; transition: background-color 0.2s; } .mem_mon_btn-delete:hover { background: #c82333; } .mem_mon_preview-footer { background: #f8f9fa; padding: 12px 20px; border-radius: 0 0 6px 6px; border-top: 1px solid #dee2e6; } .mem_mon_info-text { margin: 0; color: #6c757d; font-size: 13px; font-style: italic; } .mem_mon_empty-text { padding: 20px; text-align: center; color: #6c757d; font-size: 14px; margin: 0; } @media (max-width: 768px) { .mem_mon_header-content { flex-direction: column; align-items: flex-start; } .mem_mon_header-actions { width: 100%; justify-content: flex-end; } .mem_mon_management-grid { grid-template-columns: 1fr; } .mem_mon_preview-header { flex-direction: column; align-items: flex-start; gap: 10px; } .mem_mon_preview-stats { flex-wrap: wrap; } } /* END - Memcached Monitor CSS */ /* Files.php */ #fimages-wrapper {width:100%;font-size:12px;} .fimage-wrapper {width:150px;height:170px;float:left;padding:0px 10px 10px 0px;text-align:center;} .fimage {width:150px;height:150px;object-fit:contain;} .fimage:hover {transform: scale(2);} .fimage-desc {margin-top:5px;} @media screen and (max-width: 1600px) { .form-fields-left {width:50%;} .form-fields-middle {width:23%;margin-left:2%;} .form-fields-right {width:23%;margin-left:2%;} } @media screen and (max-width: 1366px) { .form-fields-left {width:44%;} .form-fields-middle {width:26%;margin-left:2%;} .form-fields-right {width:26%;margin-left:2%;} } @media screen and (max-width: 1280px) { h1 {font-size:30px;} .form-fields-left {width:100%;padding:0px;margin:0px;border:none;} .form-fields-middle {width:100%;padding:0px;margin:0px;border:none;} .form-fields-right {width:100%;padding:0px;margin:0px;border:none;} .form-field-20, .form-field-40, .form-field-60 {width:100%;margin-left:0px;margin-right:0px;} input#email {width:240px;max-width:100%;} .form-field-group input[type=text], .form-field-group textarea, .form-field-group select {width:200px;max-width:100%;} } /* MENU */ .responsive-menu {width:40px;height:40px;padding:10px 5px 10px 5px;float:left;} .overlay { height:400px; width: 0; position: absolute; z-index: 1; top: 0; left: 0; background-color: rgb(0,0,0); background-color: rgba(0,0,0, 0.9); overflow-x: hidden; transition: 0.5s; } .overlay-content { position: relative; top: 50px; width: 100%; text-align: center; margin-top: 10px; } .overlay a { padding: 8px; text-decoration: none; font-size: 18px; color: #818181; display: block; transition: 0.3s; } .overlay a:hover, .overlay a:focus { color: #f1f1f1; } .overlay .closebtn { position: absolute; top: 0px; right: 0px; font-size: 60px; } @media screen and (max-height: 450px) { .overlay a {font-size: 20px} .overlay .closebtn { font-size: 40px; top: 15px; right: 35px; } } /* Filter Cache Prewarming Styles */ /* ######################################### ######################################### ######################################### ######################################### ######################################### */ .cat_filters_cache_prewarm_container { max-width: 1000px; margin: 0 auto; background: white; border-radius: 8px; box-shadow: 0 2px 8px rgba(0,0,0,0.1); padding: 30px; } .cat_filters_cache_prewarm_subtitle { color: #666; margin-bottom: 30px; font-size: 14px; } .cat_filters_cache_prewarm_status_card { background: #f8f9fa; border-left: 4px solid #007bff; padding: 20px; margin-bottom: 20px; border-radius: 4px; } .cat_filters_cache_prewarm_status_card.cat_filters_cache_prewarm_status_running { border-color: #28a745; background: #f0fff4; } .cat_filters_cache_prewarm_status_card.cat_filters_cache_prewarm_status_completed { border-color: #17a2b8; background: #e7f9ff; } .cat_filters_cache_prewarm_status_card.cat_filters_cache_prewarm_status_failed { border-color: #dc3545; background: #fff5f5; } .cat_filters_cache_prewarm_status_row { display: flex; justify-content: space-between; margin-bottom: 10px; font-size: 14px; } .cat_filters_cache_prewarm_status_row:last-child { margin-bottom: 0; } .cat_filters_cache_prewarm_status_label { color: #666; font-weight: 500; } .cat_filters_cache_prewarm_status_value { color: #333; font-weight: 600; } .cat_filters_cache_prewarm_progress_container { margin: 30px 0; } .cat_filters_cache_prewarm_progress_bar_outer { width: 100%; height: 30px; background: #e9ecef; border-radius: 15px; overflow: hidden; position: relative; } .cat_filters_cache_prewarm_progress_bar_inner { height: 100%; background: linear-gradient(90deg, #007bff, #0056b3); transition: width 0.3s ease; display: flex; align-items: center; justify-content: center; color: white; font-weight: 600; font-size: 14px; } .cat_filters_cache_prewarm_progress_text { text-align: center; margin-top: 10px; color: #666; font-size: 14px; } .cat_filters_cache_prewarm_stats_grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 20px; margin: 30px 0; } .cat_filters_cache_prewarm_stat_box { background: #f8f9fa; padding: 20px; border-radius: 8px; text-align: center; } .cat_filters_cache_prewarm_stat_number { font-size: 32px; font-weight: 700; color: #007bff; margin-bottom: 5px; } .cat_filters_cache_prewarm_stat_label { color: #666; font-size: 13px; text-transform: uppercase; letter-spacing: 0.5px; } .cat_filters_cache_prewarm_button_group { display: flex; gap: 10px; margin-top: 30px; flex-wrap: wrap; } .cat_filters_cache_prewarm_btn { padding: 12px 24px; border: none; border-radius: 6px; font-size: 14px; font-weight: 600; cursor: pointer; transition: all 0.2s; text-decoration: none; display: inline-block; } .cat_filters_cache_prewarm_btn:hover { transform: translateY(-1px); box-shadow: 0 4px 12px rgba(0,0,0,0.15); } .cat_filters_cache_prewarm_btn_primary { background: #007bff; color: white; } .cat_filters_cache_prewarm_btn_primary:hover { background: #0056b3; } .cat_filters_cache_prewarm_btn_success { background: #28a745; color: white; } .cat_filters_cache_prewarm_btn_success:hover { background: #218838; } .cat_filters_cache_prewarm_btn_danger { background: #dc3545; color: white; } .cat_filters_cache_prewarm_btn_danger:hover { background: #c82333; } .cat_filters_cache_prewarm_btn_secondary { background: #6c757d; color: white; } .cat_filters_cache_prewarm_btn_secondary:hover { background: #545b62; } .cat_filters_cache_prewarm_btn:disabled { opacity: 0.5; cursor: not-allowed; transform: none !important; } .cat_filters_cache_prewarm_log_container { background: #f8f9fa; border: 1px solid #dee2e6; border-radius: 6px; padding: 20px; margin-top: 30px; max-height: 300px; overflow-y: auto; } .cat_filters_cache_prewarm_log_title { font-weight: 600; margin-bottom: 15px; color: #333; } .cat_filters_cache_prewarm_log_entry { font-family: 'Courier New', monospace; font-size: 12px; padding: 8px; margin-bottom: 5px; background: white; border-radius: 4px; border-left: 3px solid #007bff; } .cat_filters_cache_prewarm_log_entry.success { border-left-color: #28a745; } .cat_filters_cache_prewarm_log_entry.error { border-left-color: #dc3545; color: #dc3545; } .cat_filters_cache_prewarm_alert { padding: 15px 20px; border-radius: 6px; margin-bottom: 20px; font-size: 14px; } .cat_filters_cache_prewarm_alert_info { background: #d1ecf1; border-left: 4px solid #0c5460; color: #0c5460; } .cat_filters_cache_prewarm_alert_warning { background: #fff3cd; border-left: 4px solid #856404; color: #856404; } .cat_filters_cache_prewarm_alert_success { background: #d4edda; border-left: 4px solid #155724; color: #155724; } .cat_filters_cache_prewarm_spinner { display: inline-block; width: 16px; height: 16px; border: 2px solid rgba(255,255,255,0.3); border-radius: 50%; border-top-color: white; animation: cat_filters_cache_prewarm_spin 0.8s linear infinite; margin-right: 8px; } @keyframes cat_filters_cache_prewarm_spin { to { transform: rotate(360deg); } } .cat_filters_cache_prewarm_reminder_box { background: linear-gradient(135deg, #667eea 0%, #764ba2 100%); color: white; padding: 25px; border-radius: 8px; margin-bottom: 30px; } .cat_filters_cache_prewarm_reminder_box h3 { margin-bottom: 10px; font-size: 20px; } .cat_filters_cache_prewarm_reminder_box p { opacity: 0.9; font-size: 14px; line-height: 1.6; }