/**
 * FarmEye CSS template for v2 master template.
 * Copied from ui/farmeye.css, removed CSS rules relating to v1 master template.
 */

 @font-face {
    font-family: Fira Sans;
    font-weight: 400;
    src: url(/fonts/firasans-regular.otf);
  }
  @font-face {
    font-family: Fira Sans;
    font-style: italic;
    font-weight: 400;
    src: url(/fonts/firasans-italic.otf);
  }
  @font-face {
    font-family: Fira Sans;
    font-weight: 300;
    src: url(/fonts/firasans-light.otf);
  }
  @font-face {
    font-family: Fira Sans;
    font-style: italic;
    font-weight: 300;
    src: url(/fonts/firasans-lightitalic.otf);
  }
  @font-face {
    font-family: Fira Sans;
    font-weight: 700;
    src: url(/fonts/firasans-bold.otf);
  }

  #printButton {
    display: inline-block; /* Ensure it's visible by default */
  }

  body {
      font-family: "Fira Sans",Nunito,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji";
  }

  /* allow for <a> tags without href */
  a {cursor:pointer;}

  label {font-weight:bold;}

  ul.left-menu {list-style-type:none;margin-left:0;padding:0;  list-style-position: inside;}
  ul.left-menu li {list-style-type:none;margin:0;padding:0}
  div.leftCol li {list-style-type:none;margin:0.8em;padding:0}


  table.stdtable {table-layout: fixed; border-collapse: collapse; width:100% }
  table.stdtable thead, table.stdtable tfoot {background-color: #eee; font-weight:bold;}
  table.stdtable {background-color: #fff;}
  table.stdtable tbody.subtotals {font-weight:bold;}
  table.stdtable tbody.grandtotals {font-weight:bold; background-color: #eee;}

  table.stdtable td, table.stdtable th { border: 1px solid #ccc; padding:4px; vertical-align:top;}
  table.stdtable th {background:#eee}

  table.stdtable tr.deleted {text-decoration: line-through;}
  table.stdtable tr.lc_DELETED {display:none;text-decoration:line-through;}
  table.stdtable tr.lc_NORMAL .undelete {display:none; text-decoration:none;}
  table.stdtable tr.s_ELIMINATED td.strikethruable {text-decoration:line-through;}
  table.stdtable td.number {text-align:right}
  table.stdtable td.n {text-align:right;}
  table.stdtable td.derived {background-color:#fafafa;}
  table.stdtable .exceeded {color:red; font-weight:bold;}
  table.stdtable .exceeded::before {content:"⚠ ";}

  table.fitdata {table-layout: auto; border-collapse: collapse;}

  tr.lcstate-ARCHIVED {text-decoration:line-through}


  table.login {margin-bottom:1em;}
  table.login td {padding:0.5em;}

  table.soil-index-key  {
      width:100%;
      margin:0px;
  }
  table.soil-index-key td {padding:8px;vertical-align: top;}

  #carbon-legend {
      background-color: rgba(255, 255, 255, 0.5);
      border: 1px solid #ccc;
      border-radius: 5px;
      box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
      padding: 5px;
    }
  #carbon-legend .legend-content {
      font-size: 11px;
      line-height: 1.5;
  }
  #carbon-legend .legend-colors {
      display: flex;
  }
  #carbon-legend .legend-color {
      display: inline-block;
      width: 40px;
      height: 15px;
  }
    /* Adjust the legend layout to be horizontal */
  #carbon-legend .legend-content span {
      display: inline-block;
  }
    /* Adjust the size of the legend dot */
  #carbon-legend .legend-content strong {
      font-size: 11px;
  }
  #carbon-legend .bins-text {
      display: flex;
      justify-content: center;
      text-align: center;
      font-size: 11px;
  }
  #carbon-legend .bins-text div {
      width: calc(100% / 7);
  }


  /* Field labels (used when listing fields in UI) */
  .label-field {
      background-color: #40c020;
      border: 1px solid #004000;
      line-height:2em;
      margin: 0.2em;
      xwhite-space:nowrap;
  }
  .label-field a {
      color: white;
  }

  fieldset {border: 1px solid #ddd;border-radius:4px;padding:0.5em;margin-bottom:1em;}
  fieldset legend {width:inherit;padding:0;margin:0;border-bottom:none;font-size:14px;font-weight:bold;}

  /*
   * Alerts, warning and errors
   */
  .red {color:red}
  .green {color:green}
  .amber {color:orange}
  .gray {color:gray}

  /*  Specific to the Multi Field Selector widget */
  .mfs-field-list .label-field {
      padding:0.5em;
      margin-right:0.5em;
      font-size: 16px;
      line-height:3em;
  }
  .mfs-field-list .label-field a {
      margin-left:0.5em;
  }


  .farmeye-logo-login {font-size:48px;display:flex;margin-top:47px;margin-bottom: 30px;}
  .farmeye-logo i {font-size:154%;}
  .farmeye-logo .version {font-size:16%;text-align:right; position:relative;}
  .farmeye-logo .tagline {font-size:20%;text-align:right; position:relative;top:-2em;right:1em;}


  .tag-list {line-height:120%}
  .tag-label {font-size: 1em; line-height:2em; margin:0.5em 0.5em 0.5em 0}

  /* Help modal */
  .modal-body section {margin-bottom:1em;}

  .help {font-size:small; display:none; border: 1px solid #888;padding:1em;margin-bottom:1em}

  .soil_index {padding:2px; border-radius:2px;}
  .soil_index_legend td {padding:2px 4px;}

  /* soil index background color. TODO: inconsistent use of minus vs underscore */
  .soil_index_1,.soilIndex1Color {background-color:#f88}
  .soil_index_2,.soilIndex2Color {background-color:#ff8}
  .soil_index_3,.soilIndex3Color {background-color:#8d8}
  .soil_index_4,.soilIndex4Color {background-color:#88f}
  .soil_index_5,.soilIndex5Color {background-color:#f8f}
  .soil_index_0,.soilIndex0Color {background-color:#ccc}
  .soil_index_unknown {background-color:#ccc}

  /* soil index foreground color */
  .soil-index-1-color {color:red;}
  .soil-index-2-color {color:yellow;}
  .soil-index-3-color {color:green;}
  .soil-index-4-color {color:blue;}
  .soil-index-5-color {color:violet;}

  .nutrient-N-bg {background-color:#dfd !important;}
  .nutrient-P-bg {background-color:#fdd !important;}
  .nutrient-K-bg {background-color:#ffd !important;}
  .nutrient-pH-bg {background-color:#ddf !important;}
  .nutrient-organic-bg {background-color:#e9b96e !important;}
  .nutrient-chemical-bg {background-color:#729fcf !important;}

  @media print {
      .nutrient-N-bg {background-color:#dfd !important;}
      .nutrient-P-bg {background-color:#fdd !important;}
      .nutrient-K-bg {background-color:#ffd !important;}
  }

  /* Preferred/starred items */
  .inactive-star {color: #eee;}
  .active-star {color: #ec0;}
  .invisible-star {color: white; visibility:hidden}

  /* NMP advice alerts */
  .advice-alert {
      font-size:smaller;
  }

  /* Needed to make map use full height of screen */
  .full-height {height:100%}
  html, body {height:100%}

  /*
   * Mapping
   */

  #map {
      width:100%;
      min-height:450px;
      height:100%;
  }

  /* MarkerWithLabel text style of use as field labels */
  .mapFieldLabels {
      color: blue;
      background-color: yellow;
      opacity: 0.5;
      font-family: "Lucida Grande", "Arial", sans-serif;
      font-size: 10px;
      text-align: center;
      white-space: nowrap;
      transform: translateX(-50%);
       padding:3px;
       border-radius: 2px;
  }

  /* MarkerWithLabel text style for use as map pin labels */
  .mapPinLabels {
      color: black;
      background-color: white;
      opacity: 0.9;
      font-family: "Lucida Grande", "Arial", sans-serif;
      font-size: 10px;
      text-align: center;
      white-space: nowrap;
       padding:2px;
       border: 1px solid black;
       border-radius: 2px;
  }

  /* Supplement bootstrap btn style for in-map buttons */
  .btn-farmeye-in-map {
      padding-top:7px;
      padding-bottom:7px;
      margin-right:2px;
      font-family: Roboto, Arial, sans-serif;
  }
  /*
   * NMP navigation
   */
  .tab-submenu li  a {
      font-size:smaller;
      padding: 4px 8px;
  }
  .tab-submenu li.selected a { color:#555}

  /*
   * Typeahead styling. Suggestions menu styling from
   * http://stackoverflow.com/questions/20198247/twitters-typeahead-js-suggestions-are-not-styled-have-no-border-transparent-b
   */
  span.twitter-typeahead .tt-dropdown-menu {
    position: absolute;
    top: 100%;
    left: 0;
    z-index: 1000;
    display: none;
    float: left;
    min-width: 160px;
    padding: 5px 0;
    margin: 2px 0 0;
    list-style: none;
    font-size: 14px;
    text-align: left;
    background-color: #ffffff;
    border: 1px solid #cccccc;
    border: 1px solid rgba(0, 0, 0, 0.15);
    border-radius: 4px;
    -webkit-box-shadow: 0 6px 12px rgba(0, 0, 0, 0.175);
    box-shadow: 0 6px 12px rgba(0, 0, 0, 0.175);
    background-clip: padding-box;
  }
  span.twitter-typeahead .tt-suggestion > p {
    display: block;
    padding: 3px 20px;
    clear: both;
    font-weight: normal;
    line-height: 1.42857143;
    color: #333333;
    white-space: nowrap;
  }
  span.twitter-typeahead .tt-suggestion > p:hover,
  span.twitter-typeahead .tt-suggestion > p:focus {
    color: #ffffff;
    text-decoration: none;
    outline: 0;
    background-color: #428bca;
  }
  span.twitter-typeahead .tt-suggestion.tt-cursor {
    color: #ffffff;
    background-color: #428bca;
  }
  span.twitter-typeahead {
    width: 100%;
  }
  .input-group span.twitter-typeahead {
    display: block !important;
  }
  .input-group span.twitter-typeahead .tt-dropdown-menu {
    top: 32px !important;
  }
  .input-group.input-group-lg span.twitter-typeahead .tt-dropdown-menu {
    top: 44px !important;
  }
  .input-group.input-group-sm span.twitter-typeahead .tt-dropdown-menu {
    top: 28px !important;
  }
  /* end typeahead styling */

  .nmp .disclaimer {
      font-weight:bold;
      border: 2px solid black;
      padding: 1em;
      margin: 1em 0;
  }

  .nmp .signature img.digitized-written-signature {
      height:32px;
  }
  .nmp .signature table {
      width:100%;
  }


  /**
   * Farmeye branding styles
   * Ref Farmeye Brand Guidelines
   */
  .farmeye-brand-font {
      font-family: "Futura Bold";
  }
  .farmeye-brand-color-1 {
      color: #17547b; /* dark blue */
  }
  .farmeye-brand-color-2 {
      color: #79b6a3; /* teal */
  }
  .farmeye-brand-color-3 {
      color: #8ac184; /* green */
  }
  .farmeye-brand-color-3 {
      color: #3e9ad8; /* blue  */
  }


  /* From https://stackoverflow.com/questions/20353907/how-to-stack-overlap-more-than-2-icons-in-font-awesome */
  .icon-stack {
    position: relative;
    display: inline-block;
    width: 2em;
    height: 2em;
    line-height: 2em;
    vertical-align: middle;
  }
  .icon-stack-1x,
  .icon-stack-2x,
  .icon-stack-3x {
    position: absolute;
    left: 0;
    width: 100%;
    text-align: center;
  }
  .icon-stack-1x {
    line-height: inherit;
  }
  .icon-stack-2x {
    font-size: 1.5em;
  }
  .icon-stack-3x {
    font-size: 2em;
  }



  /* Hide page nav elements when printing */
  @media print {
      .navbar-nav {
          display:none;
      }
      #printButton {
            display: none; /* Hide only during printing */
          }
  }

  /* Green master template theme */
  /*
  .bg-gradient-primary {
      background-color: #60b020;
      background-image: linear-gradient(180deg,#40a020 10%,#206010 100%);
  }
  */

  .fe-util-icon {margin-left:0.5em;}


  /* Paddy testing some custom css */
  a {
    color: #033c27;
  }
  .sidebar-brand {
    margin: 10px 0;
  }
  .sidebar-brand-icon {
    background: white;
    border-radius: 360px;
    padding: 4px;
  }
  .breadcrumb {
    background-color: transparent;
  }

  #accordionSidebar .collapse-item:hover {
    border-radius: 0.18rem;
  }

  .spinner-primary {
    color: #033c27;
  }

  .btn-primary {
    background-color: #033c27;
    border: none;
  }

  .btn-primary:hover,
  .btn-primary:focus {
    background-color: #6ab187;
  }

  .btn-outline-primary,
  .btn-primary.btn-outline-primary {
    border-color: #033c27;
    color: #033c27;
    background-color: white;
    border: 1px solid;
  }

  .btn-outline-primary:hover,
  .btn-primary.btn-outline-primary:hover,
  .btn-outline-primary:focus,
  .btn-primary.btn-outline-primary:focus {
    background-color: #033c27;
    color: white;
  }

  .btn-outline-secondary.active {
    background-color: #6ab187 !important;
  }

  .nav-primary {
    background-color: #033c27;
  }

  .btn-edit,
  .table-btn-expand,
  .table-btn-collapse {
      color : #033c27
  }

  .card-header .header-primary,
  .btn-edit:hover {
      color : #6ab187;
  }

  .card-header:not(.no-border)::after {
      display: block;
      content: "";
      border-bottom: 1px solid #ececec;
      padding-bottom: 15px;
      margin-bottom: -15px;
      width: 100%;
  }

  .sidebar .nav-item .collapse .collapse-inner .collapse-item.active,
  .sidebar .nav-item .collapsing .collapse-inner .collapse-item.active {
    color: #033c27;
  }

  .sidebar .nav-item .collapse,
  .sidebar .nav-item .collapsing {
       margin : 0 2px 0 0;
  }

  .sidebar .nav-item .collapse .collapse-box-shadow,
  .sidebar .nav-item .collapsing .collapse-box-shadow {
      box-shadow: inset 0 7px 9px -7px rgba(0,0,0,0.4);
  }

  @media (max-width: 991px) {
    .column-layout-toggle {
      display: none;
    }
  }

  .accordion .card .card-header[data-toggle=collapse].collapsed::after {
      content: '\f107';
  }

  .accordion .card .card-header[data-toggle=collapse]::after {
      line-height: 55px;
      content: '\f106';
      color:  #033c27;
  }

  .logo-color {
        transform: scale(0.75);

  }

  .btn-green-login {
    background-color: #033c27;
    border-color: green;
    color: white; /* Optional: to ensure text is readable on green background */
  }

  .import-farm-fail {
      color: red;
  }

  .import-farm-success {
      color: green;
  }

  a.disabled {
      pointer-events: none;
      opacity: 0.5;
      cursor: not-allowed;
  }

  .banner {
    height: 100%;
    width : 100%;
    display: flex;
    flex-direction: column;
    font-family: sans-serif;
    overflow: hidden;
  }

  .banner-top {
    height : 170px;
    background-color: #dadada;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    padding: 75px;
  }

  .banner-content {
    height : 50%;
    padding: 20px;
    text-align: center;
  }

  .banner-content h1 {
    margin: 0 0 10px;
    color: #103d24;
    font-size: 28px;
    letter-spacing: 1px;
  }

  .banner-content p {
    margin: 0;
    margin-bottom: 15px;
    color: #103d24;
    font-size: 16px;
  }

  .banner-footer {
    height : 30%;
  }

  .banner-footer a {
    color: #103d24;
    text-decoration: none;
    font-weight: 600;
    border: 1px solid #103d24;
    padding: 8px 16px;
    transition: background 0.3s, color 0.3s;
  }

  .banner-footer a:hover {
    background:  #033c27;
    color: #fff;
  }

.banner-content, .banner-footer {
      background-color:#ececec;
      display: flex;
      flex-direction: column;
      justify-content: center;
      align-items: center;
}

.banner-disabled {
    opacity: 0.8;
    pointer-events: none;
    user-select: none;
    filter: grayscale(80%);
}

.modal-90 {
    width: 90vw !important;
    max-width: 90vw !important;
    height: 90vh !important;
    margin: 2.5vh auto !important;
}

.modal-90 .modal-content {
  height: 100%;
  display: flex;
  flex-direction: column;
}

.senus-eye {
    color : green;
    cursor : pointer;
}

.filter-grayscale {
  filter: grayscale(100%);
  -webkit-filter: grayscale(100%);
}

.select2-container--default .select2-selection--single {
  height: calc(1.5em + 0.75rem + 2px);
  padding: 0.375rem 0.75rem;
  font-size: 1rem;
  line-height: 1.5;
  border: 1px solid #ced4da;
  border-radius: 0.25rem;
}

.select2-container--default .select2-selection--single .select2-selection__rendered {
  line-height: 1.5;
  padding-left: 0;
  padding-right: 0;
}

.select2-container--default .select2-selection--single .select2-selection__arrow {
  height: calc(1.5em + 0.75rem + 2px);
  right: 0.5rem;
}

.select2-container {
  margin-top: 0.25rem;
  margin-bottom: 1rem;
}

.required {
    color: var(--danger);
}

.legend-dot {
    display: inline-block;
    width: 0.9rem;
    height: 0.9rem;
    border-radius: 50%;
    vertical-align: middle;
}

.legend-cell {
    width: 2rem;
}

.fa-trash-can, .fa-pen-to-square {
    cursor: pointer;
    color: #033c27;
}

.delete-btn {
    position: absolute;
    top: 4px;
    right: 4px;
    background: rgba(229, 57, 53, 0.85);
    color: white;
    border: none;
    border-radius: 50%;
    width: 20px;
    height: 20px;
    line-height: 16px;
    text-align: center;
    font-size: 14px;
    cursor: pointer;
    transition: background 0.2s ease-in-out;
}
.delete-btn:hover {
    background: #c62828;
}